Image for post
Image for post

Flymingo, the new travel App MVP

Last week I faced the last individual project for Ironhack UX/UI Bootcamp. A project that looks impossible to do at the beginning and push ourselves to give the best, and the biggest effort to achieve it.

So we were told to develop an MVP App. Like in the project before 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!

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 travelers, 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.

Main goal: The user relation with these travel apps. How they use them?

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.
Image for post
Image for post
Affinity map

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.

User Persona

Although we started with our proto-persona, I defined the final primary user persona with all the data gathered.

Image for post
Image for post
User persona definition

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, analyzing 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.

Image for post
Image for post
Benchmarking from Booking Apps

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)

Task Analysis

To be able to identify the pain problem that users are experiencing I conduct some task analysis from the same apps of benchmarking. And you know what? I was about to go crazy!

It felt like Indiana Jones trying to find the holy grail! Ok, but coming back to the task analysis I did the same task through all the app:

Buy the cheapest trip to Milan from Barcelona.

Image for post
Image for post
Task Analysis

Well, doing this analysis I could identify some pain points on the flows and get some conclusions:

  • The process is usually so long
  • They always have tricky options so is difficult to process without doing mistakes or buy things you don’t want
  • 4/8 displays outbounds/returns flights on the same screen.
  • It takes between 14–18 screens to get the process done.

Heuristic Evaluation

I use some heuristic evaluation from hopper and Skyscanner to be able to identify usability problems.

In this case, I identified more usability errors on Hopper, like error prevention or flexibility and efficiency of use.

Having all this information I went through value proposition to be able to start the definition process.

Let’s start with the solutions

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 my define 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.

Image for post
Image for post
Branding solution for the travel App

Flymingo it’s for young users, a charismatic brand that can be trusted, that feels close and funny, without falling into childishness.

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.

Image for post
Image for post
Part of the first flow definition

Feature prioritization helps me to focus on designing the important features.

Image for post
Image for post
Feature prioritization

User testing & Iterations

So I went through 4 iterations to get the final result form Lo-fi, mid-fid to hi-fid prototypes.

Image for post
Image for post
First low-fi prototype

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
Image for post
Image for post
Image for post
Image for post
Flight selection process splitted

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.
Image for post
Image for post

Third iteration findings:

Some information was so little that is 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
Image for post
Image for post
Flight data visualization improved
Image for post
Image for post
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
Image for post
Image for post
Empty state for searches without results
Image for post
Image for post
Adapting buttons to accessibility standards sizes

Looking for the best palette

Image for post
Image for post
Different palettes options

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 color 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 fidelize the customer.

Price alerts keep users attention about their flight avoiding leaks to other apps.

Some clues for iOS users

Image for post
Image for post
iOS version

Althought the app was thought to be developed for Android users in 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 in iOS users. That’s are some examples where you can see some adaptions.

  • Deleting hamburger menú and adding more options on the bottom navigation bar.
  • Action saving button on the top bar
  • 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

  1. During the process, I faced making tough decisions to align business with customer goals.
  2. How to prioritize features
  3. Learning how to use Figma animations

Before you go!

👏🏻 SPAM CLAPS if you enjoyed this article, I’d love to share more!

👨🏻‍💻 Connect with me on Linkedin

💭 Comment your thoughts, feedback, anything!

Written by

Visual Designer & Web Developer. Born in Barcelona. I began my career in prepress, it went on design and now, I‘m leading to UX/UI.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store