top of page

Improving the Usability Expedia's Travel Bundle Booking:

Role:
UI/UX Designer,
User Researcher
Tool(s):
Figma
Collaborators:
Amy Yee
Bao Huynh
Kevin Sy

Role:

For this project, I helped to develop the user testing plan and generate ideas for the redesigns, For the redesign mockups, I worked with Amy Yee to develop the 2nd redesign option.

Problem Statement:

How might we redesign the Expedia “Bundle & Book” process to create an easier flow that reduces the mental workload on the user and decrease usability errors?

User Testing Plan:

To start, we devised a task in which we tested four users. Given the time frame of this project, we were only able to test four users, but given time, we would have liked to test more, as different issues will come up with different users. We tasked our users with booking a bundled deal (which includes flights, hotel, and car rental) from San Diego to New York for their family of 5 with a budget of $10,000.

Recording Methods:

When performing user testing, we had our participants think aloud while they navigated through the site and also took screen recordings that we would look back on to find errors we might not have seen at first.

Top Usability Errors Identified:

Through user testing and observing errors users made, we identified 5 usability errors that were violated by the current Expedia system.

​

Match between System and Real World

  • The current breadcrumbs used do not exactly match the full process, as they leave out the “Review and Book” page, causing the user to create a false mental model of the process

 

Visibility of System Status

  • Users do not always see what fees are being added to their total, leading them to be confused at certain prices changes in their trip total

​

Help and Documentation

  • Users must mentally calculate additional costs when they should not need to do so, as well as mystery prices may appear when reviewing their bookings, and users do not know where these prices are coming from

​

Recognition over Recall

  • Users constantly need to remember what decisions they made, but become confused as to why their trip price may have increased.

​

User Control and Freedom

  • Users are not able to modify their trip details during the process (must go back in the linear process)

Main Goals of Redesigning:

1. Transparency of Pricing Terminology

​

Users often have to mentally calculate or recall information in order to determine the total price increase caused by adding on extra features (such as different flights, different car models, hotel room types, etc.). Throughout the process, users must mentally keep track of prices due to the terminology used and lack of information available to the user during each stage of the process. Prices must be transparent and easily accessible or else customers may lose trust and get frustrated with hidden fees.

​

2. Revising Booking Options

​

There is currently not an effective way for users to backtrack through the process of booking their hotel, flights, and rental car. Additionally, once they reach the final “Review and book” page, they are unable to change things unless they go through the browser’s back button. Additionally, when click on the “change hotel” and “change flights” links, it loses all forward progress that one has made. Given their sequence of booking hotel then flight then car, choosing to modify your hotel booking will erase your choices for flights and rental cars. Additionally, going to change your flight will make you reselect both departing and returning flights, rather than just being able to modify one. Expedia needs a way to allow their customers to more effectively revise their booking options to adjust their trip price to their budget.

Redesign 1: Tab-based Navigation Bar

With this particular redesign, we decided to create a tab system that allows users to go back and review more information about previous decisions at any step in the process. As users go through the process, more tabs are added to this navigation bar asset. Using a tab system allows us to address recognition over recall, allowing us to separate the decisions and display more information and lower the cognitive load on users to remember what they booked. This also gives more user control and freedom by allowing users to change specific aspects of bookings like room type and returning or departing flight, rather than being forced to reselect everything in the domain of hotel, flight, car, etc. We also included a constant price tracker on the right side, which allows users to see exactly what their total price will be, and reduce the amount of information users have to recall. This is based on the base price of the trip as well as any add-ons that have extra fees.

expedia-tab redesign.png

Tabs are laid out to the user in a way in which users can quickly look back at their past decisions and do not need to recall this information throughout the process. Decisions also updated and allows users to see how choices impact the total price.

Redesign 2: Interactive Progress Bar and Cost Tracker

With this particular redesign, we decided to create a tab system that allows users to go back and review more information about previous decisions at any step in the process. As users go through the process, more tabs are added to this navigation bar asset. Using a tab system allows us to address recognition over recall, allowing us to separate the decisions and display more information and lower the cognitive load on users to remember what they booked. This also gives more user control and freedom by allowing users to change specific aspects of bookings like room type and returning or departing flight, rather than being forced to reselect everything in the domain of hotel, flight, car, etc. We also included a constant price tracker on the right side, which allows users to see exactly what their total price will be, and reduce the amount of information users have to recall. This is based on the base price of the trip as well as any add-ons that have extra fees.

Book Car Rental.png
expedia timeline.png
expedia side view.png

With the timeline components, users are able to visualize the current system status and have a clear mental model of the booking process. They are also allowed more user control and freedom as they can click back to edit certain booking choices. The price tracking component also shows live updates to the total price of the trip, reducing the user's cognitive load to recall information throughout the process.

bottom of page