Booking a flight online involves more than selecting two cities and departure times. In fact, airline websites and apps are offering lots of features and fares. However, most of them are sorely lacking when it comes to good user experience design. Fly UX is a new startup airline that aims to offer a great design, a better user focused experience, in order to increase customer acquisition, satisfaction and retention. Let's fly through this journey together!
There are so many reasons people are using an airline app. They might check promotions, deciding where to go for their next holidays or even to compare prices. During this project, we will focus on people that are using the app to check prices and book a flight.
I chose 3 airline and 1 flight aggregator applications to be benchmarked and analysed. In fact, the approach to user flow vary from an app to another. This method helped me to highlight the problems that needed to be solved and the best practices that I could emulate for the best user experience.
The survey was completed by 29 people, it was created in Survey Monkey and was composed of 10 questions (Structured & Unstructured). The survey required 3 minutes to be completed.
Chatting with people, being interested in their lives and their actions is very important in gathering good data. In fact the more I learn from the users, the more I get closer to the truth. The key in this part is to ask the right questions to leave the conversation open and move the process forward.
It allowed me to get a deeper understanding of the context of use, the behaviour and the user's pain points when using the airline's mobile app. In order to achieve this test, I sent out a personalised email few days in advance to my friends explaining briefly the task and what would be their role. The participants were then asked to perform a single user journey; booking a flight online using two different airline apps analysed in the first method.
.
My helper and I reviewed all the research data gathered previously. We transcribed the key findings on post-its that we stuck to the wall, then we organised them into relevant categories to make the insights easier to extract and use.
The Customer journey map translates the research data gathered into a structured document. It highlights the goals and the behaviour of the participant when using the app. The document below helped me to understand what are the areas that needs to be improved from the user's perspective in order to optimize the user experience when booking a flight online.
Main findings
1- Users become more frustrated as the process goes forward. The final prices are not clear enough. 2- Mapping out the customer journey allowed me to understand the areas that I need to focus my effort on. From the navigation search to selecting the seats are the most important stages that causes pain points and negative satisfaction.
Before designing any screen, it was important to understand where it sits in the structure and understand its sequence in the main flow. As a first step in the design process, I defined a high level flow for the mobile app focusing on the primary use case of booking a flight. I started by sketching the screen-states on a paper and then digitised them using sketch once I was satisfied with them.
Navigation Style
Once the main flow represented, I started designing the elements that would appear on the actual screens. Choosing the navigation style is an important decision to get right. It is critical to good experiences, it smoothes the flow, reduces friction and saves time. Considering Fly UX as an utility app where some content is more important than others, I chose tabs and off canvas style to design my mobile app.
Interaction and Micro-interaction Design
In order to define how each screens behaves, I made sure that the interface has the appropriate controls on it to help people fulfil their intent to take action. I then defined the rules for each control with a nice polite feedback that tells the users if they are successful or not (Result) and what they need to do next.
Sketching is a very efficient tool and a vital step before prototyping any digital wireframes. It allows us to try out a multitude of ideas and iterate them before settling on one. At this step, I draw all important phases from starting to research for a flight until selecting seats. Going on paper first, helped me to define which elements were the most important and how these would be reproduced in Sketch afterwards. Sketching communicate how the idea begin and how it evolve through the process.
Once I designed the medium fidelity prototype using Sketch, I moved to inVision, where I've built the interactions and micro-interactions. The immediate feedback adds a pleasant way to communicate the loading state and give a clear signal that the action is being performed as expected. InVision allowed me to share my prototype by publishing a share URL link or by simply sending an invitation by email. Therefore I asked some people to test the prototype as I iterated. It was great to see them manipulating and experiencing the process. That helped me to fix some occurring technical issues and make sure the flow is as smoother as possible.
The high fidelity prototype allows much richer interaction with the interface. It also include a looking feel that makes it indistinguishable from the real application. After designing the high-fidelity screens using Sketch, I transferred them to InVision Studio to make them highly functional and interactive.