EXPEDIA.COM

RESEARCH

Our very first goal, before even thinking about what our new feature would be, was to understand who we were designing for — we’ll call this phase, Establishing Our Persona. We wanted to understand users that frequently booked travel and also had some level of interest regarding various social causes, ranging from sustainability to gender equality. 

We developed a quick, nine question screener survey in order to pre-vet out users eligible for an in depth interview. We asked high level questions such as how many trips respondents booked within the last year, and what kinds of social causes they were particularly interested in. These questions enabled us to find our target audience so we could dive into the interviews. 

After synthesizing interview results via affinity mapping, we condensed our findings into a few key insights that really shed light on what our primary persona looked like.

KEY INSIGHTS

PERSONA

Our persona encompassed these insights and a few other important details from our interviews. We used George to guide us through our design, remembering that every decision we made had to come back to creating a better experience for him.

JOURNEY MAP

Our second goal was to Understand Our Persona. We went on to create a journey map for George, looking at his emotional state during the process of booking a family vacation using the expedia.com website. This process allowed us to pin point where in the process he struggled and what aspects of the process he valued or sparked positive emotions. These insights provide clarity on where and how our feature could be integrated.

IDEATE

Once we hammered down who we were solving for, we had to look further into how we were going to solve for this new persona. We’ll call this phase — Understanding the Product.

EXISTING SITE USABILITY TESTING

We did this by doing usability testing on the existing expedia.com website. We found minor issues with the site, as all users were able to complete the assigned task, which was to purchase a bundled trip consisting of a flight, hotel, and car option. 

The main complaint of users was that they couldn’t understand how information was organized on the site, particularly when looking at different options for hotels, flights, and cars. Upon realizing that these users weren’t engaging with the content they found confusing, we decided that incorporating helpful iconography and clearer language would help clarify how information was organized on these hotel, flight, and car pages.

KEY INSIGHTS TO FEATURES

Now that the proper foundation of research was laid out, we moved into the next phase — Adding a Feature to the Product. We started with a design studio exercise in an effort to come up with as many ideas as possible. We all came up with different feature ideas, and even after critiques and multiple iterations, it still took us a good amount of time to finally come to a consensus. In the end, we ended up blending two ideas together, both stemming from our three key research insights.

DESIGN

Iterating the Feature

After conducting three usability tests with our mid-fidelity prototype, we determined two key points to iterate before bringing the prototype to high-fidelity. Firstly, users skipped over the initial eco-friendly checkbox, so the simplest solution was to make it bigger so it didn’t get overshadowed by the form field. The second update was to include text on the hotel information page elaborating the tree icon, because users either skipped over the icon, or didn’t understand what made the hotel “eco-friendly.”

HI-FIDELITY USABILITY TESTING

Improving the Feature

Bringing the prototype to high-fidelity produced the most realistic version of our feature we could achieve, complete with improvements from the mid-fidelity version. For these high-fidelity wireframes, we paid particular attention to color, consistency, and format to make it look as close to the existing site as possible. 

In the last round of testing, we had three final users go through the same task of completing a bundled trip booking, making sure to choose a sustainable hotel option. All users succeeded, but we actually came away with three important insights, both of which we would implement if we decided to take this project further. 

DELIVER

NEXT STEPS

The clear next step in the process would be to iterate based on the three key findings from the last round of usability. The first finding came from a user wanting to see the eco-friendly tree icon on the final booking confirmation page, as he had forgotten if he actually chose an eco-friendly hotel, and there was no way to tell that far through the flow. Including that icon next to the hotel information on the confirmation page is an easy way to keep labeling consistent and remind users of their past actions.

The second idea would be to use more specific icons than the tree. Multiple rounds of testing proved that users either weren’t engaging with the tree icon or weren’t finding the relevant information when trying to engage with it. Using a recycling icon or a more specific icon relating to how the hotel was practicing sustainability might be a clearer form of visual communication for users.

Lastly, the final user problem has seemingly two potential solutions. One user expected “eco-friendly” options to apply to not just the hotels portion of the booking, but flights and cars as well. The simple solution would be adjusting the checkbox text to specify “eco-friendly hotel options.” However, the larger solution would be to implement sustainable annotations with the tree icon on flights and cars as well. We believe this solution falls more in line with our persona, George, and his goals: to make more socially conscious decisions, yet doing so in a simple and intuitive way that doesn’t require too much extra effort on his part.