FLY UX: Redesign of the online booking experience
The Project
The Brief: research, design and prototype a website for a new airline, focusing on the task of booking a flight.
For: UX Design Institute 2020
My role: Lead UX Researcher and Designer
This project was part of my UX professional diploma with the UX Design Institute. The goal of this exercise was to create the end to end UX journey in order to deliver the best possible flight booking solution to users.
This was the first case study I worked on while obtaining my UX diploma and was grateful for familiarity of the research and analysis part. From my previous life in Commercial Development, data and discoveries were essential to build robust strategies. This is a skill I relied on while crafting surveys and interview scripts to gain a valuable information.
Throughout this project, I learned the importance of paying attention to details as well as prioritising business goals in congruence with user interactions.
Tools: Adobe XD, Sketch, Figma, Screenflow
Competitive Benchmarking; Online Surveys; Usability Tests; In-depth Interviews; Affinity Diagram; Customer Journey Mapping; Interaction Design; Medium-fidelity Prototyping; Wireframes
The challenge:
Fly UX is a new airline. The goal is to attract customers and grow traffic and revenue by selling flights around the world. How can we improve the flight booking process and offer a better user experience to become a competitive force on the market?
The approach:
I started this project with a competitive benchmark to familiarise myself with the industry conventions and pinpoint any preliminary improvement I could make to the final solution. I then run both a quantitative and qualitative research with an online survey to gather data on user goals when booking a flight and usability tests to dig deeper into the actual experience, feelings and thoughts of users when undertaking this task.
The outcome:
Collecting the data from my research via an affinity diagram I was able to decipher themes that I, in turn, categorised into “positive”, “neutral”, “negative” feelings for users. I mapped out those feelings into a customer journey map in order to begin thinking about a solution to a problem raised by users as a lack of trust, confusion and a perceived lengthy process.
The solution:
By creating a detailed flow diagram, I was then able to sketch out a preliminary design of a simple and transparent website, following industry conventions and using constant communication as a tool to build trust throughout the booking process. By introducing pop-ups to remember preferences, the prototype and wireframes show an easy-to-use product by-passing (if chosen) additional steps and giving users the information and communication they need to go through the flight booking process without friction.
The Research
I started this project with a set of different research to gain better insights into what best-in class websites are doing to ease the flight booking process, learn about user goals and context of use and hear from users directly through interviews and usability tests.
Competitive benchmark; Online Survey; Usability tests
Usability tests
I interviewed 5 participants, remotely, starting with general questions regarding their travelling habits. I then deep dived into their most recent experience with booking a flight. Finally, I asked them to simulate a booking experience on 2 separate websites to observe their behaviours and listen to their thought process.
Using Survey Monkey, I created a 10-question survey to gain more quantitative undertanding of users’ goals when booking a flight: what are they trying to do, what (if anything) is preventing them from doing it, what else would they like to be able to do on airline websites and apps.
Online survey
Competitive benchmarking
I selected 3 airlines, 1 aggregator and other out-of-sector websites to understand industry conventions I need to follow and highlight any improvement I could make to the solution.
Key findings:
Unexpected total price
A lot of frustration comes from the lack of clarity in prices from the beginning: per person or for all passengers? Including extras and add-ons? The ambiguity in price makes the user frustrated or deceived
Lack of trust
The initial thought of users when beginning the flight booking process is one of distrust. Users seem aware that they are in for a not-so-great experience. From the lack of transparency to the amount of ads, and the infinite extras, users are warry and worried that they will make a mistake that will cost them (whether cost them in cost or time, or both)
“This is where they get you” — “I think they profit on being difficult”
Lengthy process
The longer the flight booking journey, the higher the level of annoyance.
“By now, I just want it to be over with” — “I think I’ll just continue, this is too annoying”
Confusion and lack of understanding of jargon
Users are unsure of the jargon used for fares and luggage selection, creating great frustration throughout the process.
“I’m not trying to educate myself on their airline vocabulary”
Preferred sites
Users tend to have a favorite website that they use in order to shop for a flight. It is one that they have learned and thus feels familiar with, that is used when the purchasing decision has been made.
*Interestingly, my research was based on responses from different parts of the world (US and Europe mainly). It was interesting to see the commonalities in both as well as the differences. The US respondents seemed to favour a particular website to shop for flights, while Europeans tend to use an aggregtor first to look for the best price, regardless of the airline.
The Analysis
Once both quantitative and qualitative data was collected, it was time to begin making sense of it.
Affinity diagram; Customer journey map
Affinity diagram
I collected all the findings from my research and took out my sticky notes to write down user quotes, goals, behaviours, pain points, mental models, and contextual information. My goal was to start defining recurring themes that I could address later on in the problem solving phase.
Customer journey map
Starting from the themes and groups from the affinity diagram, I built a customer journey map to define the high-level steps in the journey, documenting the goals of the user, pain points, and any behaviours that the website was not facilitating. This helped shape my design ideas and focus my work to solve the low satisfaction areas.
The Solution
After analysing the collected information, a solution started forming with the overall objective to fix the issues uncovered during my research.
Flow diagram; Interaction design; Prototype; Wireframes
Flow diagram
First, I created a high-level flow to understand how users will flow through my design. The goal was to put down every interaction and reaction I could expect in a common user journey. Details of the final product were also added to help shape the second phase, the interaction design.
From the flow overview, I then started sketching the website, trying out solutions to the issues and pain points users have voiced.
Interaction design
Medium-Fidelity prototype
The main goal of the design is to address the common pain points of lack of transparency of information. I designed the prototype with simplicity and transparency in mind. Try it here.
The final step consists of wireframing the design with enough information to pass on to developers so the final product acts and reacts as designed.
Wireframes
Final thoughts and learnings
Ultimately, this project was developed for one user. If I were to move this forward, I would have tested and re-tested with more users in order to gain more comprehensive feedback before delivering the wireframes.
Overall however, this project was extremely useful to put theory into practice. I further developed my customer-centered focus on users, and designed a solution to alleviate pain points and challenges. It has reinforced my decision to focus on UX as my new career path.