Fly UX is a project I completed as part of my Diploma in UX at Glasgow Caledonian University, through UX Design Institute. The end goal of the project was to design and build a clickable prototype that can be tested with users, along with a detailed set of wireframes.
The project brought me through the full UX process:
research, analysis, design, prototyping, and wireframing.
Problem Statement
01
Context
The fictional client for this case study is a start-up airline called Fly UX. They’re looking to create an online experience that is fast, easy, and intuitive: one that’s based on a deep understanding of their target users.
02
Task
The task was to design a new website for Fly UX, focusing specifically on the flight booking process: how users search for, find and select flights online.
UX Process
01
Research
Competitive Benchmarking
Online Survey
Usability Testing
02
Analysis
Affinity Diagram
Customer Journey Map
03
Design
User Flow
Interaction Design
04
Prototyping
Prototype
Usability Testing
05
Wireframing
Research
Competitive Benchmarking
I researched five competing airlines to learn how they attempt to solve the flight booking problem. This allowed me to identify what competitors are doing right, and to learn from what they are doing wrong. I was also able to recognize important conventions for me to follow.
Additionally, I researched three best-in-class travel related businesses to highlight best practices that I should emulate.
Online Survey
As part of the process of identitfying the problem with flight booking, I conducted an online survey.
I gathered both qualitative and quantitative data which helped me to uncover some of the goals, behaviours, context and frustrations of users.
Insights
Nearly 30% of users were unable to complete their task.
Many users use airline websites to research for future trips.
Users are frustrated by ads and upselling of additional services.
Users want to endure less steps in order to save them time.
Usability Testing
With the aim of discovering the goals, behaviours and context of use of airline customers, four usability tests and in-depth interviews were conducted.
Insights
Users often got disoriented, for instance, they thought they were still choosing an outgoing flight when they were in fact now choosing a return flight
Users were very frustrated when the price did not reflect what they had expected to see, once they reached the payment stage.
Price was not always the main factor when selecting flights – convenience could often trump it. If users knew what they were paying for, they’d be more likely to upgrade.
Analysis
Affinity Diagram
With the aim of organising the data gathered from the research stage into clear insights that could be used to improve the product and avoid possible pitfalls, I conducted an affinity mapping workshop.
After studying all of the data collected, I, along with two other workshop attendees, wrote down each observation on a post-it note and stuck them on the wall.
These observations gleaned from the research phase were then organised into thematic groups and a rough outline of the problems that Fly UX could solve started to become clear.
Customer Journey Map
I took the insights gathered from the affinity diagram and refined them further to reflect the distinct steps in booking a flight, and to show how users felt at each stage.
The Customer Journey Map indicated that the steps in the booking process that users found particularly frustrating were selecting flights, luggage and seat selection and additional service ad-ons.
I took note of the goals, behavior, context and pain points at each step along the journey in order to highlight where Fly UX could better serve its users in the flight booking process.
Design
User Flow
After identifying the issues I needed to fix during the research phase, and which I was able to highlight in the customer journey map, I created a user flow based on the primary use case.
This user flow proved invaluable as it provided a structured and visible representation of the actions a user can go through using an airline website, and how this can influence their goodwill towards it.
Defining the high-level flow allowed me to address all the issues highlighted and to begin to lay the groundwork on which I could build my design.
Interaction Design
Preliminary low-fidelity screen designs were then sketched out. These were further refined and added to the user flow diagram to help visualise the interactions as the user moves through the booking system.
Prototype
Once I was happy with how the site was coming together, it was time to build a medium fidelity prototype to test the high-level flow, screen layouts, text, and basic interactions.
If you’d like to test the protoype, yourself, please click on the image below!
Wireframe
After conducting usability tests on the prototype, finding and solving issues, rebuilding the prototype and testing again, it was time to define the extra details that developers need to build the product accurately.
This was a challenging task, specifying the rules, controls, and feedback for each aspect of the website, including all errors as well as the feedback for each error.
Identity Design
Although not included in the course projects for the case study, I jumped at the opportunity to create an identity for the fictional startup airline, Fly UX.
Aside from the brandmark and livery design, I also created a display font inspired by a more modern, fluid take on the bitmapped departure boards you find in airports.






















