Fly UX (Case Study)
Airline Booking Service
How do you approach a problem
How well have you mastered skills
How do you learn and adapt
Is there a logical thread
Can you communicate effectively
Scannable in 3 minutes
Just enough info - but don’t let points get lost
Case study - Beginning (problem), Middle (what you did to solve it), End (results, final design, lessons learned)
#1 Beginning - Set the scene
Provide an overview
State the problem/challenge
Lay out project goals
Describe your role (note if collaborating)
#2 Beginning - Outline strategy for solving problem
Provide context the reader needs to follow rest of case study. Don’t list artifacts, list steps in the process and what I’m hoping to achieve.
e.g. This is an overview of the full UX design process I went through:
Research
Identify the problem
- Competitive research
- User researchDefine
Articulate the problem
- Affinity diagram
- Customer journey mapDesign
Solve the problem
- Flow diagram
- Interaction designValidate
Test the solution
- Wireframe
- Prototype for desktop
For each activity I did explain
What I was hoping to achieve
How did it progress the project?
What did you learn? How did it help?
e.g. don’t just describe competitve benchmarking - lead with story of why i did it
Look for ways to bring story to life. e.g. quote from user research is powerful
Plot twists are useful. Discovered something new and unexpected? Explain how it changed the assumptions from the start and how I adapted.
Don’t just show polished artifacts. Show how design was iterated as project progressed.
#3 - End - Outcome
Include final design - ideally in the form of a clickable prototype and some details of developer handover (if relevant).
Add a reflection/conclusion.
What worked well/what I learned
What I would do differently
Needs to:
show you understand the design process
show you know design is never done
demonstrate a learning mindset
Portfolio needs to include not only case studies but
About section (introduce myself)
Contact details
Link to downloadable version of CV/resume
Overview
As part of my Diploma in UX Design with the UX Design Institute, I completed a case study for Fly UX — a fictitious start-up airline. The brief was to design a desktop flight booking experience that feels fast, intuitive and easy, and could realistically compete with established airline websites. I worked through the full UX process, from research and analysis through to interaction design and prototyping.
Problem
Booking a flight takes longer and is more confusing than it should be. Fly UX needed a flow that helps users search, compare and select flights without friction.
Project Goals
Create a booking experience that feels fast, easy and intuitive, delivered as a clickable prototype plus wireframes for developer handoff.
My Role
I worked as the sole UX researcher and designer, using my own research alongside course-provided usability test recordings.
The Process
Design is not always a linear process - certain projects may call for a slightly different flow, and often times certain situations or insights may require a jump forwards or backwards within the design process. For this particular project I followed this high level UX design process:
Let's take a closer look at the design process. Starting with RESEARCH where we engage with the end user to understand the problems we are trying to solve with the new design. Once data is gathered it needs to be analyzed in order to clearly DEFINE the issues. DESIGN is where we solve the problems. That is to design a solution we believe is going to benefit users' interaction with the product. Part of the design process is the creation of PROTOTYPE, a mock-up of a solution that can be VALIDATED with users. It's an interactive circular process. Once the satisfaction with the final design is there, the product is ready to be BUILD and subsequently TESTED.
Please note: Due to the scope of this project, the process concludes at the Prototype stage, with no build or test phases included.
INSERT PROCESS DIAGRAM
User Research
Research is the first step in the UX design process. It’s where we learn what users need and how they behave, so the design decisions that follow are based on evidence, not assumptions.
Methods used:
// Competitive Benchmarking
Competitive benchmarking is a structured review of other flight booking websites (and close alternatives) to understand common design patterns, user expectations, and common usability issues in the booking journey. It helps us to understand what works, what doesn’t, and where users regularly get tripped up.
Objectives
See how best-in-class sites handle the same booking problems
Identify conventions and mental models users already know
Capture best practice to emulate and common mistakes to avoid
Build a reference point for what features should be included, improved or left out
Process
I benchmarked the flight booking flows of Rex, Emirates, Qantas, Delta, Orbitz, Ryanair and KLM, reviewing key steps from search and results through to flight selection, fares, add-ons and payment to identify standard patterns and where friction shows up.
Key Findings
-
The best flows make it easy to enter trip details and adjust them without losing your place.
-
Users decide fastest when price, times, duration and stops are front-and-centre.
-
Per-person vs total pricing, what’s included, and when extras appear is often unclear, which creates frustration and distrust.
-
Ads, sidebars and extra content create overload during selection.
-
When flight/fare selection relies on hover states or layouts that look like columns but behave like tabs, users miss the action and get stuck.
-
Breadcrumbs/progress indicators help, and users need an easy way to go back and change choices.
-
Differences between tiers aren’t always clear; side-by-side comparisons work best.
-
When add-ons are pushed repeatedly across multiple screens, the process feels longer and more salesy—so extras should be easy to skip, kept contained (overlays can work well), and not constantly send users to new pages.
-
Too many clicks, unclear passenger/leg context, and heavy confirmation steps slow users down.
-
Smart defaults and clear validation keep users moving.
-
Users want to review and change seats/bags/extras without hunting; messy “review and pay” screens increase cognitive load.
Screenshots from the competitive benchmarking process.
// Online Survey
An online survey is a quick way to collect both quantitative (patterns, frequency) and qualitative (comments, reasons) data from a broader mix of people than you can usually reach with interviews alone. It helps spot patterns before moving to deeper testing.
Objectives
To better understand how people experience booking flights online, specifically:
What people visit airline websites/apps to do
Whether they can complete those tasks (and what blocks them)
What features help vs frustrate
What matters most when booking a flight (decision drivers)
What people would change in the experience
Process
I created a 12-question survey in Google Forms using a mix of multiple-choice and open-ended questions. The questions focused on recent flight booking behaviour, goals when visiting airline sites, blockers, missing features, and preferred/disliked experiences. 10 people responded.
Key Findings
People use airline sites for more than booking: booking, deals, check-in/status and managing bookings all came up.
Half completed their task easily; the rest had difficulty or couldn’t complete it.
The biggest friction themes were comparison effort (price/time/value), clutter/upsells, timeouts, and being pushed into extra steps/windows.
Most respondents had used an airline site recently, across desktop/app/mobile.
When booking, price and departure/arrival times were the main decision drivers.
Screenshot of some of the survey questions.
// Usability Tests
Usability testing is where you watch real people try to complete key tasks on a website while you observe what they do, where they hesitate, and what confuses them. It’s one of the fastest ways to find problems you won’t spot on your own.
Objectives
Because Fly UX is a fictitious product being built from scratch, I tested competitor airline websites instead. The goal was to:
Observe real user behaviour during the flight booking journey
Understand user mental models and expectations (“where they think things should be”)
Identify friction points and confusing steps to avoid repeating in Fly UX
Sense-check conventions against Fly UX principles (user-centred functionality, clear communication, smooth navigation)
Process
I ran remote sessions on desktop. Each session started with a short interview about travel habits and recent booking experiences, then participants were asked to simulate a booking flow on two airline sites. I also conducted my own test on EasyJet and Ryanair, and reviewed two peer tests on Aer Lingus and Eurowings. Across the work, this gave coverage across both full-service airlines and low-cost carriers.
Findings
Pages often include too much information, creating overload and slowing decision-making.
Some features and labels are unclear, with not enough explanation at the moment it’s needed.
Price presentation can be ambiguous (e.g., per person vs total), which causes hesitation and mistrust.
The overall flow can feel longer and more complex than users expect, making it harder to stay oriented and complete the booking.
Four user interviews were conducted and observations of the users making a booking on rivals’ websites revealed some interesting insights:
The reasons for some users getting stuck in the booking process was because of the poor designs of navigation or input controls – they did not look ‘clickable’.
The display of information was not always coherent. Users were sometimes confused on the pricing for the items that they had selected. Is the price for the outbound and inbound flight? Is the price displayed for one or two passengers?
2. Analysis
After gathering research, I organised the findings into an affinity diagram to pull clear themes from messy data, then mapped them into a customer journey showing key stages, user goals, actions and emotions.
Methods used:
Affinity diagram
Customer journey map
2. Analysis
Once both quantitative and qualitative data was collected, it was time to begin making sense of it.
With the raw data gathered from my research phase, I moved into analyzing the data in order to clearly define the problem or set of problems affecting users. With such a large volume of disorganized data, I began with building an affinity diagram which led to a more organized categorization of information. Reviewing my research, I took notes and wrote each observation on a post-it note then began to group the notes into high level categories based on screen states and stages - further refining those groups to include context, user emotions, behaviors and more. I also moved my notes into Miro which allowed me to keep refining the diagram and save my progress online. With my affinity diagram finalized into groupings and subgroupings, the massive amount of raw data was distilled into clear, understandable data points.
Once the affinity diagram complete, a more structured view could be developed from my data and analysis. In order to conceptualize how a user interacts with an airline to achieve the goal of booking a flight online, I built a customer journey map in Illustrator - laying out the different stages along with user goals to provide clarity and definition in the booking process while visualizing the true state of the current experience to include the users emotions, actions and behaviors.
Affinity diagram; Customer journey map
Affinity diagram
Objective: At this stage of the process, all the research data is gathered and put into consideration. It is important to start structuring the data into different groups.
Affinity Diagrams are one of the best ways of visualising this data. They are a great methodology for discovering patterns in the data, such as what methods are commonly used across the different softwares and what features don't work so well.
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.
The next part of the process was to collect all the data from the research stage; competitive benchmarking, online surveys and usability tests. As a lot of this data is qualitative, I needed a logical way to organise it, which is why I used an affinity diagram. The first step was to write out key findings and observations on post it notes and organise them into groups.
Our goal was to organize the (unstructured) data gathered from the research stage into clear insights that could be used to improve the product and avoid possible pitfalls.
We came up with an extensive list of observations. These went into detail about the user’s goals and problems during each stage of the booking process. We then classified all the observations into groups based on their similarities, and gave each group a suitable name. Now, I didn’t only have a better understanding of the user’s needs and concerns, but I also ended up having a structured overview of the most important data that could serve as a starting point for the next steps in the design process.
The groups that emerged were:
Confusion/sensibility
Features
Core functionality
Innovation
User priorities
User methods
User behaviours
Pain points
Aesthetics
Page structure
User journey
Patterns and potential fixes started surfacing during the process, most of which could be easily implemented in the design stage.
Analysis conclusions:
Structure and flow needs to be streamlined and simplified
Only relavent and important information should be displayed to users
If features or add ons are to be included they need to be well explained
Design should be minimal and pleasing to the eye
Theres should be no ambiguity around the cost of the journey
INSERT IMAGE
To start making sense of all the different data I had collected I recruited a partner to read through the research and write out observations on post it notes. We started to arrange the post it’s into categories to create an affinity diagram. From there I came up with group/sub group names for them and organised them into a priority order.
It was clear from creating and analysing the groups that most user negative points where around calendar, price and the extra/add on steps.
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.
After collating all the data, I went through each step of the user's journey in the booking process to determine how Fly UX could do it better. Each stage focused on the users goals, behaviours, positive points and pain point in the process. I used quotes from the usability test to provide further insights.
To transform the data in a highly structured document, I designed a customer journey map.
This included all of the different goals, actions, behaviors, pain points and emotions that a user would experience while booking a flight; using data gathered from the previous stages.
During the design phase, I could refer back to this user’s journey to see if I could solve some of the pain points.
Objective: From reviewing the findings of the affinity diagram, highlight the common contexts, behaviours, goals, and mental models of the users.
Construct a customer journey map that visually represents this data and show the journey of the user when using airline software.
Findings:
This technique highlighted that users had issues with most aspects of the site. However 'searching for and selecting flights' was found to be the most problematic for users. This area would need to be a main focus point when designing Fly UX.
I organised the information from my affinity diagram and created a 10 step by step view of the journey to demonstrate how the user felt before starting the task and then at each stage of the booking process. I added notes of the users goals, mental models, behaviours and pain points. Finally user quotes were added for more context when referring back to the CJM.
This tool clearly highlighted that the biggest pain point in the customer journey is around the add ons/luggage step, making it a focus point for my designs.
INSERT IMAGE
3. Design
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 - sketches; High-fidelity 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.
Onto the design stage, and the initial part was to map out user's flow through the site. This started at the homepage and finished at the checkout stage. I tried to make the flow as simple as possible while addressing the pain points that were highlighted in the earlier projects.
Before I started sketching or designing, I put together a user flow diagram to get a better idea of the high-level flow for booking flights on my new airline website. While creating the flow, I tried to address as many uncovered issues during the research phase.
I found this very useful to get a better understanding of the screens that the user will soon walk through, and the actions that lead up to booking a flight. Also, this gave me a very structured representation that I used as the groundwork for my designs.
The design phase began within defining the flow. I used the findings made in my research and analysis to define a high level flow for a single use case. I began the process by making several sketches of the flow which allowed me to quickly translate my ideas and thoughts to paper.
With every sketch I was able to refine and address the issues that where uncovered in my research. Once happy I recreated the flow digitally, fine tuning the small details.
INSERT IMAGE
Interaction design - sketches
From the flow overview, I then started sketching the website, trying out solutions to the issues and pain points users have voiced.
After determining user flow, it was time to put everything together in the form of sketches. These sketches would roughly outline the look and feel of interaction with the Fly UX website.
Like the user flow diagram, the sketches were designed to consider the user goals, behaviours and paint points that were discovered during the research and analysis phase.
After a few different attemps to get the design correct, I settled on the sketches shown below.
Based on the flow diagram, I transitioned into solution mode.
In a first phase, I created some rough paper sketches, which I kept improving and improving – with the help of my arts & crafts toolbox – until I had my first low-fidelity wireframes.
Preliminary low-fidelity screen designs were quickly sketched. They were further refined and added to the user flow diagram to help visualise the interactions as the user moves through the booking system.
INSERT GALLERY OF SKETCHES
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 next stage of the process was prototyping. Once I was happy with the interaction design I got started. I decided to go with a medium/high fidelity prototype, as these prototypes have the ability to convey richer interactions from the user and gain greater data and insights.
The design then went through more user testing to either validate or find flaws in the design.
While using all my previous references, I build a medium fidelity prototype following the guidelines shown in the lessons of the UX Design course.
After many iterative steps, improvements and testing, I finally delivered a full clickable prototype that I’m proud to present.
N.B. As this is a prototype, not all of prototype is interactable, however hints are given if needed. It is also important to note that I have designed the prototype with UX in mind and in the real world, the UI would need some tweaking.
After defining much of the solution through my flow diagram and sketching I created an interactive website prototype. The prototype was built with all of the necessary detail and interactions to test the high level flow, screen layouts, text and interactions.
The process was relatively straight forward as I had defined each screen states in detail during the previous exercise.
Annotated wireframes
As this was a fictive project to obtain my UX Diploma, a real implementation of the application was never in scope. However, the final exercise included the creation of annotated wireframes as if we were to showcase our designs to a team of developers. By creating those annotations, I got to think about all the different states of interactivity of the screens and elements used in my design.
Writing the annotations really helped me to discover potential deviations of the happy flow and made me think of different solutions to cope with these exceptions.
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.
The Final stage of UX process is to produce high quality wireframes as part of handover documentation for developers, and in some situations, UI designers too. All pages, components, states and interactions need to be explained and made clear as to avoid any guess work.
Below you can see my final wireframes for Fly UX.
The final piece in the puzzle after all the research, analysis, design and prototyping was to prepare the document to hand over to the development team. Close attention to detail and labelling was crucial to ensure a smooth hand over to the development team, so they do not need to guess or fill any blanks. I added a layer to my Figma prototype to create my wireframes then moved them over to a powerpoint for the handover document.
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.
This project was challenging although very rewarding. It gave me a very hands-on experience of a UX design use case in which I acquired extensive knowledge related to all steps of the design process. Not only did I discover the importance of research, but I also discovered new technical skills while designing and thereby using different design tools.
What I learned
I enjoyed following the UX process, solving problems and building empathy with the user to fully understand their wants and needs. I was able to develop a UX toolkit for future UX projects and adopt a user first mindset to create a digital product with a positive experience.
The whole project was a huge learning experience, if I could start it again I would conduct more research. Specifically I would conduct more usability tests, the insights I gained were vast and they gave me the confidence that I was solving real user issues.