Flymingo. Travel App.
Flymingo is a case of study for a Travel App. I’ve designed it for UX UI Bootcamp at Ironhack. Here you can see how UX UI research has been done as well as UI design. We only had 1 week to do the research, the design and present the project by Zoom.
Category:
UX Research, UI Design, Visual Design
Time:
1 week
Tools:
Figma, Illustrator, Indesign, Photoshop, Mural
Team:
Susana Real
The Challange
So we were told to develop an MVP Travel App. I had a week to complete this assignment. In this project we have a common brief:
Briefing
We are planning to launch a new product for booking travel. We intend to generate revenue based on fees associated with the booking of flights. We want to start by launching a minimum viable product, but considering this is a competitive market to enter, we probably cannot compete solely on price — instead we need you to help us add value to the experience so that users may start adopting our platform.
For this project, we have as well a 3 proto-personas. This new app goal will be to provide a product that is useful to all of these personas, but I had to make a decision about who will serve as “primary persona”.
What a long journey in a week!
The Research
I started my research by conducting 7 interviews to be able to find pain points. My target was people between 25–35 years old, low-cost travellers, who travel twice a year at least. Also, I sent a survey to know more about how people usually do to get a flight. To find the right questions I used Lean Canva board for surveys.
I gathered a lot of information and I clustered in groups using the affinity map. So, some interesting findings were:
- 6/7 People who flight in low-cost companies feel cheated
- 7/7 are afraid of upraising prices
- 60 % of people buy flights with 2 or more months of anticipation
- 62% Mainly buy flights for holidays
- 70% Knows the destination before buying the flight
- 60% Spend between 2–3h to find a buy a flight
- 70% find confusing the prices during the process
- 75% Expect from a travel app to be easy and transparent.
Noticeable Quote from Users:
I always have to compare at least 3 different platforms to compare prices and go to the final process to know the real price. It takes me a lot of time, and it freaks me out.
Pain Points
Knowing this information I defined the main pain points where I focused to design the new App.
Redifining the User Persona
Although we started with our proto-persona, I defined the final primary user persona with all the data gathered.
Sofia, has recently joined a company as a consultant. She likes traveling, learns languages, and discover different cultures. She always travels alone by low-cost flights, in spite of she usually feels cheated. Sometimes she feels scared and cannot go to all the places she would like because it’s not safe.
To continue my research, I started to look at a few competitors or similar platforms, doing some benchmarking, analysing UI, UX, User flow, and key features.
Benchmarking
I selected 8 Apps related to finding and buying flights. Between these apps there are ones who operate as search engines, and others like Vueling are directly the company’s App.
Summarizing the benchmarking a get this conclusion:
- Most of them offer more than only flights, like hotel or car renting
- They ask for login after looking for a flight
- 5/8 has to Go anywhere in their features
- Only two have prices alerts and price prediction
- 5/8 has a social media log in
- 4/8 can finish the check out in the same app
- 5/8 has the “Explore” option (Travels without knowing destination yet)
Heuristic Evaluation
I use some heuristic evaluation from hopper, kayak and Skyscanner to be able to identify usability problems in their App’s.
In this case, I identified more usability errors on Hopper, like error prevention or flexibility and efficiency of use.
Let’s start with the solutions
Having all this information I went through value proposition to be able to start the definition process(Following double diamond process).
It was important to keep a simple process that could be trusted. So I decided to focus on a simple buying process, where users can be focus on one task at a time.
Well, but how I will reach business goals?
Business goals in the briefing were generating revenues from flights purchases, so I defined four main ways to increase business values and achieve the revenues goals:
After evaluating several apps and identifying pain points in users that I found out through my research I define the problem statement:
People who book flights online are afraid to be cheated, upraising prices and make mistakes at the moment of booking because the process is so complex
Well, it’s time to define!
Having in mind the user persona, the problem statement, business goals, and value proposition I started the defining process.
Branding
Let’s go on with the brand!. Flymingo it’s for young users, a charismatic brand that can be trusted, that feels close and funny, without falling into childishness.
I’ve to tell that designing the brand it wasn’t the main exercise in this project, but It was important to be able to translate these brand concepts into the App, so I design a quick logo, but I spend more time on deciding and testing the colour palette and the right font for the App.
Designing for emotion and UX Writing
Flow definition and feature prioritization
In the first place, I decided to define the flow. After doing tests and iterating It has been modified to improve user experience.
I did feature prioritization with Impact-Effort Analysis and number of people-frequency matrix. These methods helps me to focus on designing the important features.
User testing & Iterations
So I went through 4 iterations to get the final result form Lo-fi, mid-fid to hi-fid prototypes.
So I went through 4 iterations to get the final result form Lo-fi, mid-fid to hi-fid prototypes.
First iteration findings:
- People were asking about putting automatically their data because that process takes time.
- It was important for them depending on the travel be able to add a bag easily
- Divided selection page on two outbound/return to have more flexibility
So, I went to the first iteration and added:
- Missing screens: log-in
- Divided Extra page focus on the most important step for my user persona: Added a bag selection screen
- I split the selection flight process as well to have more flexibility on selecting flights
After adding this new screens I tested again with 3 different people and I find out the next pain points.
Second iteration findings:
They felt it was a long process.
Flow improved:
- I removed two steps by avoiding selecting and confirm the selection. The selection would be done only on the summary screen.
Third iteration findings:
Some information was so little that it was hard to read and feels a bit confusing for such much information in every box.
They were doubting when selecting flights to know if it was outbound/return
Improvements:
- Adding status visibility
- Flight data visualization improved
- Error prevention
Fourth iteration findings:
Buttons were too smalls and were not adapted to standard. People feel confused with block price option
Improvements:
- Text and button sizes improved
- Copy improved
- Empty state added
Looking for the best palette
I tried many palettes that could work for this app, trying to find the balance between young and fun and thrustworth. So, flamingo pink was a risky decision, but I bet for being different from other brands to be more pregnant and combined with dark violet to have contrast and an active colour like green who also is associated with validation, so could connote trust in the main trigger actions.
The solution
So before let you see the app, I will put you in context with the scenario:
So, Sofia it’s planning to travel to Milan with 3 months in advance, looking for the best price. She is planning to travel alone but if there is a good offer maybe her partner will join her.
In this final version, you can see how flow is easy going, avoiding non-necessary steps, and trustworthy. It shows in every moment the final prices and all the information it’s clear.
It only asks for login when it could be interesting for the user and gives him the option to continue as a guest as well.
The brand voice tone it’s appreciated in every screen and it has some sense in some points without losing trust.
It has an additional value at the end giving users a gift like the destination Guide to fidelizing the customer.
Price alerts keep users attention about their flight avoiding leaks to other apps.
Although the app was thought to be developed for Android users in the first place, I designed having in mind iOS as well. In that way, the app wouldn’t need to suffer big changes.
I adopted some modifications to improve the experience for iOS users. That’s are some examples where you can see some adaptions.
- Deleting hamburger menu and adding more options on the bottom navigation bar.
- Action saving button on the top bar
- A cleanest form
- iOS tab format
What I would like to do next?
- Personal Travels suggestions
- Automatic Checkout
- Membership
- Corporate social responsibility for support flamingos habitats
My Learnings
- During the process, I faced making tough decisions to align business with customer goals.
- How to prioritize features
- Learning how to use Figma animations