TUI Itinerary.

The itinerary was one of the first projects I worked on when I started at TUI. The requirements were to make the information clearer and easier to access for the user, as well as giving it a UI update.

The project started off with competitor analysis and breaking down all the different requirements for the screen.

We looked at how to minimise how much text we were showing on the screen to make the itinerary feel less cluttered. This involved removing static titles and replacing them with more relevant information. We explored introducing a badge messaging system to alert users to updates happening in their itinerary, for example check in is now open or boarding passes are available.

Animation.

We wanted to see how introducing animation into the screen could help convey a sense of a holiday schedule. We wanted to help the user know what they are doing on which day, so we introduced a sticky scrolling date bar. Below is an animation I created to show the development team our requirements.

Current designs.

We developed a template approach for the itinerary as most of the information changes. We don’t have much control over how long the text could be so we designed a template that explored longer text scenarios. This template needed to work for 8 different languages and also different holiday types. It needed to be versatile enough to work for everything from a multi destination holiday to a cruise booking.

Artboard.png
itinearary.png

 

Future thinking.

We had developed a very functional itinerary and the next step was to think of how to inspire and engage the user to get them looking forward to their holiday. In the designs below we have introduced imagery relating to the user’s holiday. Using imagery lends itself nicely to also suggesting other upsell products that customers might want to buy while on their holiday, like excursions for example.

future.png
Previous
Previous

TUI Holiday Search

Next
Next

TUI Excursions book flow