Loading-VivaAerobus

A Renewed Digital Experience to Increase the Sales of Flights

Clarifying the Flight Purchase Process

Client:Viva Aerobús
Sector:Airline
My role:User Experience Design and Prototyping
Project time:3 weeks

Context

Viva Aerobús is one of Mexico's leading airlines. In October 2020, it had an app with a very poor user experience and many opportunities for improvement. At the agency, we set out to create a high-fidelity prototype to find an opportunity to work with them.

Problem

Analyzing the app and critical points, we found several problems and room for improvement, such as:

  1. The main problem to address was that when a user tried to find a flight, the results were displayed outside the app in a web view.
  2. The second problem is that the date selection calendar does not show the price.
  3. The order of results is not very clear and lacks filter functionality.
  4. It does not show prices for the day before or after.
  5. The luggage icons are not clear about what type of baggage they are when selecting flight packages.
  6. Unclear purchase steps that make you feel lost.
  7. Little clarity on how to select airplane seats. Confusion is created when you are selecting the outbound flight or the return flight.

Navigation Flow

Our intention was to continue with the current website flow, with only minor changes that would improve user orientation by grouping all flight extras in one section.

Summary of the Previous User Flow

Summary of the New User Flow

Once this problem was solved, we designed two components that would be present throughout almost the entire flow and would serve as a common thread guiding the user on the path to their goal.

Navegation step bar Viva AerobusNavegation step bar Viva AerobusNavegation step bar Viva Aerobus

Interface Design and Interactions:

Once we defined the structure of the main flow, we could propose the details of the screens. We chose 3 parts of the process that we considered critical for the overall user experience:

  1. Search Engine and Flight Calendar
  2. Flight and Extras Selection
  3. Seat Selection

Search Engine and Flight Schedule

We proposed a calendar design that helps the user reduce uncertainty about knowing the cost of a flight when selecting departure and return dates. At a glance we provided dates with available flights and their cheapest prices. On the same screen we provided clarity in date selection using colors and contrasts for outbound and return flights, which would be present from this step onward.

day selection Viva Aerobus

Flight and Package Selection

One of the most important screens is the flight schedule and package selection; the main challenge was to allow the user to clearly explore a large amount of information related to flight results, with their dates and details, on a single screen.

To achieve this, we defined the layout of elements that the design would have to display all information clearly and conveniently for the user.

We show at a glance the most relevant information for each flight, adding actions to see more details. We designed the package and price information to navigate horizontally, providing context on which flight is being explored and the features of each package.

  1. Flight results would be organized from top to bottom, showing outbound flights first and return flights second, clearly divided.
  2. We show at a glance the most relevant information for each flight, adding actions to see more details.
  3. We designed the package and price information to navigate horizontally, providing context on which flight is being explored and the features of each package.
Navegation step bar Viva Aerobus

Seat Selection

On the seat selection screen, our goal was to design the components in such a way that the user was aware of which seat they were selecting, for which passenger, and on which flight. This design allowed the user to modify any previous selection if desired.

Seat selection Viva AerobusSeat selection Viva AerobusSeat selection Viva Aerobus

Conclusion

This project was very challenging thanks to the number of interactions it has. Creating a project of this complexity in such a short time showed me how capable I am of designing and proposing.

In the end, a functional prototype was created by the developers and presented to the client. They were impressed. We could not close the deal with them, but we opened the doors to work with them in the future.