Increasing revenue by £247,000 with one click

Everyone needs luggage when they travel abroad. I was tasked with making it as easy as possible for users to upgrade luggage for everyone within their travel party.

My Role: Researcher, UX Designer

Duration: 1 week

Completed: August 2024

Tools: Axure

The Problem

Without sounding too dramatic, upgrading luggage on the TUI website can be a laborious task, especially when the amount of passengers increases. Upgrading individual luggage amounts for a family of 4, for example, suddenly becomes a chore in which cooking a lasagne in the oven feels less time consuming.

The Challenge

Investigate and create a simple way to allow users to upgrade their luggage with ease, negating the fiddly feeling of the current component.

Deliverables

As this was initially a quick A/B test, there were not many deliverables.

UX research (articles about similar problems, competitor/comparator analysis)
User flows
Greyscale wireframes

Outcomes

Project completed within projected timeframe
Greyscale wireframes finalised
Working with the UI designer to produce high fidelity mockups
Working with developer to ensure A/B component matched designs
Future iterations planned

Discover & Define

The initial steps for this project was a usability review of the current component on the TUI website.

The main finding was around time taken. Some deep diving into the analytics shows that the majority of customers who upgrade their luggage will do so for all members of their party. As the amount of passengers in a customers' party increases, so does the amount of clicks to upgrade their luggage, and therefore, time taken. Something that should be a simple task may suddenly take 5-10 seconds. Not a long time, relatively speaking, but within the context of booking a holiday, with all the other fiddly configurations this brings, a rather irritating mission.

A challenging part of this project was to find any relevant articles to help aid design decisions. As it turns out, Googling "How to simplify the 'UX equivalent of frantically trying to unlock a friend’s front door while they watch you fail from the hallway'." doesn't offer much value. A different tactic needed, it seemed.

Asking fellow designers, it was heavily suggested to use a button approach, to upgrade all passengers. This sounded promising, but real estate on mobile is precious, and a button would allow customers to upgrade, but what would the pattern be for 'downgrading' again?

Researching various websites, I noticed a pattern emerging of checkboxes being used as a main control to operate several options in one go. Think about deleting your emails. You can either select individual emails, or use a checkbox to select everything. Intrigue around this pattern was building.

Above: The original luggage component forced users to upgrade each individual within their travel party, increasing time taken to get through the booking flow

Develop & Deliver

I began wireframing possible solutions. One option using a button and then the other a checkbox approach.

The more I investigated the button approach, the more it seemed like a less viable option. The question was around what would happen once the user tapped the button. Would the copy change within the CTA? would it change to an link? Or would it simply disappear? Number 3 of the Nielsen Norman heuristics is '3: User Control and Freedom', so supporting 'undo' and 'redo' highlighted that a button in this context would be tricky to match this criteria.

I gravitated towards using the checkbox approach. Creating user flows helped understand whether this would be a good solution, in order to help users upgrade luggage with a single click. As it turned out, this approach worked a treat.

Above: One solution, using a button, was dismissed after user flows suggested difficulty in 'undoing' the upgrade action once the button was pressed.

Left: Mapping out a flow for the checkbox solution helped understand that this was probably the best way to go. Customers would land on the page with the default amount of luggage (20kg) pre-selected. They could use the checkbox to upgrade all passengers to 25kg. Unselecting the checkbox would revert everyone back to 20kg, and having multiple luggage options selected would uncheck the box too.

Outcomes & Conclusion

The final stage of the plan was to run an A/B test on the live website. The test ran over a course of 37 days, in which time there was an 8.8% uptake in luggage, and an overall revenue increase of £247,427.