Flytographer Enterprises LTD.

My Role: As the only UI/UX designer in the company, I took full ownership of the aesthetic, user flow, and user experience throughout our top-of-funnel landing pages, and our internal system where our stakeholder groups communicate, view, manage and coordinate photo shoots.

Main Challenges: While Flytographer had a previous designer before my time that gave the company a great start visually, the main website and internal system never had a specialized UX designer to work on the product. The key challenges included:

• lacked a design system that developers could leverage to quickly add common components to the system during product development. There were a lot of visual inconsistencies between the various platforms because of this.

• lacked a cohesive visual style across key landing pages. The design of various landing pages fell on individual team members whom did not have design expertise or experience. While they all did their best, Flytographer was ready to take it to the next level.

• many internal processes were very manual, repetitive, time consuming, and included a lot of back-and-forth between stakeholder groups during photo shoot inquiry and planning.

Key Solutions & Outcomes: Through nearly two years with Flytographer, I worked with the development team to iteratively design and develop new features and optimize existing ones with the aim to improve UX, boost conversion, and speed up the development process.

• redesigned the entire website to optimize user experience, conversion rate and on-page SEO

• contributed to an approximate 10% boost in conversion rate at a key point in process

• re-wrote all CSS and converted to SCSS in our custom platforms to reduce redundancy, add modularity and create a design system that developers could easily leverage.

• worked closely with the product manager and development team to design and develop ways to automate the internal system to address the key challenges caused by the existing manual workflow.

Special Note: I spent the majority of my time working on Flytographer’s proprietary system (app.flytographer.com) that users login to to view and manage their bookings and photo shoot galleries. As the system is proprietary and contains private information from customers and other stakeholder groups, I cannot publicly display improvements to that system.

I am happy to discuss examples and results of that system in person or during job interviews.

Homepage

The majority of our traffic ends up on the homepage, and primarily utilizes the search bar to find their travel destination. The existing homepage had minimal content and low engagement. As the homepage is typically our chance to make a good first impression, I wanted to amplify the page to add valuable links to pages throughout the site, help explain what Flytographer does, how it works, and demonstrate the quality of our product.

Through numerous heat maps and visitor recordings, I knew that approximately 60% of the users went straight to the search bar, so the search bar became the main feature, filling the entire viewport height on most screens. The other 40% of users liked to scroll and see what else is on the page. By providing relevant content to those users who were looking for more information, I was able to significantly boost our CTR (click through rate) with the new design by including a number of relevant links to content that users were looking for (top travel destination, gift cards, reviews, how it works).

Proposal Landing Page

One of Flytographer’s main product offerings is coordinating surprise proposal photo shoots, where a customer can coordinate with Flytographer and one of our photographers to plan an unforgettable proposal experience to capture the in-the-moment reaction of the customer’s partner.

While the search bar was still the primary feature that was utilized, my research showed that customers looking into proposal shoots more often scrolled down the page to read the content vs going straight to a destination page. Users who were planning their proposal wanted to know the process, how much it costs and wanted examples.

While the original design and content achieved this, it wasn’t a cohesive or diverse story. By updating the design to include:

• new images in the feature that showcased some of our best proposal moments (ensuring it also showcased diversity)

• a second slideshow with more examples

• re-prioritization of the content to explain the service better and build a convincing argument for why a user should book with us

• and providing an updated customer testimonial

we were able to boost the conversion rate and user engagement of this page.

Destinations Page

The destinations page is the one page that all users will engage with at some point throughout the process. It holds all of the countries and cities that Flytographer has service offerings in. While the original design worked fine, through visitor recordings, I confirmed that users spent a lot of time trying to find the city they were looking for (even though the search bar still got decent user engagement).

In redesigning the landing page, I prioritized the organization of the content to make it easier to scan visually, including:

• making the search bar easier to see and highlighting it as the key feature

• highlighting the popular destinations as CTA tiles for quick access

• Dividing up each of our destination categories into country/state/province sub categories, so all cities fell under their common regional name for easier scanning. Prior to the redesign, the cities were listed alphabetically. That works fine, but if a user knows they are travelling to Italy, but they may not know which city they are specifically looking for, they can now easily find “Italy” and see all of the cities we provide photography services in.

The mobile experience was lacking, ending up being a giant list of hundreds of cities where you had to scroll forever, again searching alphabetically for a particular city. If you didn’t use the search bar, the mobile experience wasn’t enjoyable. By subcategorizing the cities into their respective regions, I was able to optimize the mobile user experience by collapsing the cities underneath their country/state/province levels, so the user sees the most important thing first (the region they are travelling to), and then they could see how many cities we had in that region and choose to investigate further.

By making this small enhancement change on mobile, we were able boost user engagement and drastically increase our CTR (click through rate).

City Pages

Flytographer’s city pages are where the users explore photographer portfolios and decide whom they want to work with to capture their vacation memories. While the photographers are the most important pieces of information on that page, there was more to the process that the page lacked, and the content hierarchy was confusing.

The original design showcased photographers, and briefly mentioned our shoot routes (a key part of the process). Through many iterative improvements to the city pages, I added value by:

• reorganizing the content of the page for better readability and user flow

• re-designing the photographer section to showcase their portfolios within each photographer card so users could quickly get an idea of each photographer’s style without having to click into every individual photographer page

• adding the ability to filter photographer cards based on their availability for a specific date & time, again helping users narrow down their options without having to click into every individual photographer page

• designing and implementing route pages with the development team to give users insight into what routes are, what photos they could expect in that route, and which routes would suit them best based on their wants (e.g. family friendly routes).

Through two years of iterative improvements, I was able to create a much more enjoyable and informative user experience.

Photographer Profile Pages

The original photographer profile pages had all of the important information that users were looking for, but the page lacked any visual hierarchy and created a poor user experience due to the bunched up text and the manually entered customer reviews.

I redesigned the profile pages to create a stronger visual design, content flow, and to provide more valuable content including:

• enhancing the customer reviews for the photographer by generating the reviews dynamically, featuring the customer’s actual rating of the photographer and a photo from the customers gallery (where we had consent to do so).

• adding a calendar to give users an insight into the photographer’s availability and allow customers to choose their date and preferred time of day for their photo shoot to speed up their photo shoot request process. * This was a significant feature within our proprietary system that cannot be displayed publicly; the calendar on the photographers’ profile page is the tip of the iceberg.

Through user surveys and interviews, I confirmed that the users really cared about the information on the photographer profiles and used reviews to help them decide between photographers they were comparing. By enhancing the design and providing more relevant content on the page, I was able to improve the user experience overall, and with the addition of the availability calendar, we were able to generate more qualified leads, which in turn helped to boost our conversion rate approximately 10%.