Flight Mate — a mobile app UX design that helps you organize your flight.
Imagine travelling by airplane and not feeling stressed at all.
Imagine, there is an app that helps you plan your flight including all necessary steps until you arrive at your gate on time without any hassle. I seized this design challenge as an eight-week capstone project for my part-time online Interaction Design Specialization of the University of California, San Diego.
I tackled the task by the following process:
- Needfinding
- Ideation
- Prototype
- Heuristic Evaluation
- User Testing & Iteration
Needfinding
I started a survey and interviewed people to find out about their actual needs. Turns out, most of the time, people don’t have problems at all. Often they arrive well on time, because they plan to arrive at the airport really early. Just in case something goes wrong. Because you’ll never know! … Or could you?
Yes, you could know a lot more. Airports often have data about their security waiting times. Google has data about traffic. Transit has data about real-time public transport. And apart from the journey to the airport, so much more information is available that could help you plan your trip. What documents do you need to enter a foreign country? What are you allowed to bring on your plane? When does check-in start? Usually, you have to research everything on different websites.
In conclusion of my research, even if the majority of travellers doesn’t actually have problems during their way to the plane, they need to feel that everything is under control. They need a way to ease their mind when going to bed the night before an early departure. They need everything well planned, nothing forgotten and even if something unexpected happens that they can still manage to catch the plane. My vision was a digital assistant who is reliable and knows everything on the traveller’s schedule and combines it with traffic, airport and airline data.
Ideation
Based on what I discovered in the research phase, I came up with the idea of Flight Mate. The app knows how the traffic will be the next day at 8am or when the airport shuttle arrives. If the bus has a breakdown, Flight Mate quickly gives you an alternative way. The app will tell you where you can print your luggage tags and how long it will take to pass security and border preclearance. Flight Mate will calculate the proposals by using real-time and empirical data. The app will make sure that you arrive on time without letting you waste time. It will also help you organize other important parts of your flight, so you don’t have to worry about anything anymore.
I started exploring the user flow and interaction models with storyboards. Version A shows all information in a graphical user interface. Storyboard B displays a chatbot solution.
Low-Fidelity Prototyping and Heuristic Evaluation
I sketched out paper prototypes for both versions and conducted a few in-person user studies.
The user studies and a heuristic evaluation session together with another interaction design student were very constructive. The feedback helped me decide to move on with the graphical user interface solution, first of all, because it worked well and secondly a GUI naturally has more elements to visually design. A chat or even voice interface is still very attractive, but seemed to be more of a task for people specializing in artificial intelligence. A chatbot needs to reply to infinite scenarios. However, I still like the idea and decided to combine the GUI approach of version A with a more personal touch of Version B. The final prototype uses reminders which still feel like written by a personal assistant. But it’s not only about the human aspect. Reminders are crucial to this app, because the whole user experience is based on user situations. Dependent on the current point of the user journey, it is critical to guide the user at the right moment towards the next stage.
High Fidelity Prototyping and User Testing
I moved from paper prototypes to wireframes in Sketch App. Soon after, I prepared a fully functional prototype in InVision and conducted another two in-person user studies. These two sessions were so helpful that I could fix a bunch of details in the user interface and the language. Subsequently, I tried out a variation in the display of the steps. My first version had a chronological order, so your current step might be on the very bottom of the screen if you checked all previous steps. I created another version with the most current step on top.
I tested these two versions on usertesting.com. Two participants tested each version remotely following a given scenario and several tasks. The whole session was recorded including their voices. Of course, four participants in total are too few to talk about significant results. In fact, I couldn’t really tell which version worked better. Both performed very well. However, I still received valuable insights. One of them is: language and user interface details are very important. One other is: if you’re doing user tests online, provide the participants very clear tasks. Otherwise they will go the fastest way possible and you will have fewer breakthroughs.
As a result of my user tests, I refined the UI and the language of the app’s steps. I went with version B and added contextual icons to the unchecked steps in order to make them instantly recognizable.
“I feel like this is my own personal assistant. It’s helping guide me through this process, so I don’t forget anything.”
Besides, I got amazing feedback on my app by my four user test participants. All four rated the tasks as very easy. They also strongly agreed on “I will likely return to the app in the future”. One participant said the app feels like her personal assistant, which was exactly my intention.
If you are an app developer and interested in moving this design to the next phase, let me know.
