New booking navigation

Analysis of the booking process and reformulation based on improving the user experience.
Assignment within the Master of Interaction Design of the IED Barcelona.

the brief

Dream the sky. Make it yours.

The objective of the project was to improve the booking experience that comes once the flight search & selection process has been completed by the customer. They provided us with an assumed hypothesis that combining all the selections in a single page would enhance the performance of the ‘booking process’.

We decided to take this one step further and make it, also, a delightful experience.

For this, we dived this into research. During our analysis of the booking process, we encountered three main pain points:


Trip details are not easily found & can't be reviewed before paying.


Long loading pages interrupt the flow of the booking process.


It's unclear how many screens are left to the end of the process.


This amounts to a lack of control during the booking process.


If we design a clear signposting for the booking process, then the users will feel more in control of their purchase

We tested our hypothesis and after comparing 8 different airlines with the same step in the booking process and asking related questions, we obtained the following result: 80% of the people think that having a navigation bar makes the process “easier to handle” and them feel more in control of the information.

Take outs
Introducing a navigation bar and a progress indicator is necessary to improve the customers' experience. Furthermore, and considering what eDreams previously explained, if customers book one flight a year, then the booking process should be clear enough not to get lost during the process as well as delightful enough so that they will come back.


With that in mind, we went deep into analyzing the booking process. So, so deep.

We discovered some insights:

Insight 1
The constant closing and opening of the keyboard makes it harder to navigate. Even if the keyboard takes only 0,2 of a second to open, the time adds up and amounts to a waste of time.

Insight 2
Users would be willing to complete lots of steps as long as they know in which step they are and how many steps are left to finish.

Insight 3
When booking a flight, every information that needs to be changed can be punished with a fee.


One proposal, three parts

1. Merging the three original main steps into one seamless process flow: a horizontal one-pager.

2. Introducing a clear signposting: a main navigation bar with icons and a secondary bar with substeps.

3. Going as simple as possible: asking one question at a time so that the user can focus in that answer.

horizontal mockup


Some references

1. Trip summary Always available and constantly updating with new information

2. Main navigation bar Icons and line that show the progress

3. Secondary navigation system Steps indicator with same type fo behaviour

4. "Card” with only one question at a time The user can concentrate on one answer at a time

5. Arrows left and right: Blue one (like CTAs) pushing forward

6. Steps indicator

7. Keyboard already available to write

Any questions?
Let's meet for some mate!

Caroline Erize
Barcelona, Spain
Icons made by Freepik from www.flaticon.com is licensed by CC 3.0 BY