Loading-VivaAerobus

A renewed digital experience to increase the sales of flights

Clarifying the flight purchase process

Client:Viva Aerobus
Sector:Aviation
My role:Research, design and prototyping
Project time:3 weeks

Context

Viva aerobus is one of the main airlines in Mexico. In October 2020, it had an App with a very bad user experience, with many opportunities. At the agency we set out to make a high-fidelity prototype to find an opportunity to work with them.

Problem

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

  1. The main issue to be addressed was when a user intended to find a flight the results prompted outside the app on a web view.
  2. The second problem is that the date selection calendar do not show the price.
  3. The order of results not very clear and lacks filter functionality.
  4. It does not show the prices of a day before or after.
  5. The suitcase icons are not clear what type of luggage they are. When flight packages are selected.
  6. Unclear purchase steps that make you feel lost.
  7. Poor clarity on how to select aircraft seats. A confusion is created when you are selecting the outbound flight or the return flight.

Navigation Flow

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

Old User Flow Overview

Old User Flow Viva Aerobus

New User Flow Overview

Old User Flow Viva Aerobus

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

Navegation step bar Viva Aerobus
Navegation step bar Viva Aerobus
Navegation 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 consider critical to the overall user experience:

  1. Search engine and flight calendar
  2. The second problem is that the date selection calendar do not show the price.
  3. Selection of flights and extras
  4. Seat selection

Search engine and flight schedule

We proposed a calendar design that helps the user reducing the uncertainty of knowing the cost of a flight, when selecting the departure and return dates. At a glance we managed to give the dates with available flights and their cheapest prices.In the same screen we gave clarity in the selection of dates using colors and contrasts for round trip flights, which would be present from this step onwards.

day selection Viva Aerobus

Selection of flights and packages

One of the most important screens is the selection of flight schedules and packages, the main challenge was to allow the user to explore in a clear way and on a single screen a large amount of information related to flight results, with their dates and details.

To achieve this, we defined the arrangement of elements that the layout would have to show all the information in a clear and convenient way for the user.

We show at first glance the most relevant information for each flight, adding actions to see more details. We designed package and pricing information to navigate horizontally, giving context to which flight is explored and the features of each package.

  1. The flight results would be arranged from top to bottom, showing outbound flights first and return flights second, neatly divided.
  2. We show at first glance the most relevant information for each flight, adding actions to see more details.
  3. We designed package and pricing information to navigate horizontally, giving context to which flight is explored and the features of each package.
Navegation step bar Viva Aerobus

Seat selection

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

Seat selection Viva Aerobus
Seat selection Viva Aerobus
Seat 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 period of time showed me how capable I am of designing and proposing.

In the end, a functional prototype was created by the developers that was 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.