Ironhack’s Challenge 3: Tripadvisor and its confusing experiences

July de Jesus
8 min readOct 25, 2020

To plan a trip, you have now plenty of choice to compare the services and offers. Comparators appeared like Kayak, Liligo, Hopper, Skyscanner, Tripadvisor and so many more, to help us with that task. But at the end, is it really easier now ? Don’t you feel lost facing hundreds of deals ? In an attempt of giving the choice to users, comparators became stressful and users don’t even know how to properly use them. But let’s not rush to the conclusion and see how I got there.

Planning a trip is like finding a needle in a haystack

User profile: A young couple, between 20 and 30 years old, is looking for a nice trip for the next summer. Not something too far or too complicated to organize. Just a romantic vacation to celebrate being together. To do so, they intend to compare flights and hotels on the Internet and get a detailed list of all the activities they will be able to enjoy during their break.

Before testing any travel website with my users, I wanted to know more about them. That’s why I interviewed 4 people matching the user profile, to understand what they really expect from a comparator, and determine how they use it.

Among my interviewees, none of them really trust comparators so they usually end up comparing comparators. They want to get a big picture so they don’t just use one website, they use more than 2 of them. To plan their trip they look at many information to decide:

  • flight prices
  • airline companies prices too to see if the comparator is correct
  • reviews about the city, the activities (…) which are very important for them
  • opening times for activities, distances, prices…

Also, they prefer doing those tasks on a desktop. It’s easier, more comfortable and you can see more details according to their testimony. Indeed, a study conducted by Algolfly confirms that claim: only 21% of users buy their travel from their mobile phone.
Algofly.fr study made from january 2014 to march 2019: https://www.algofly.fr/blog/billets-avion-mobile-vs-ordinateur/

With that information, I was able to create my persona:

Persona : Simon, 32 years old, Project Manager, Paris

Which site best suits Simon’s needs ?

I started by conducting a usability evaluation using Jakob Nielsen’s 10 Usability Heuristics for User Interface Design. I compared Kayak, Hopper, Skyscanner and Tripadvisor, to determine which one I could present to them.

Usability evaluation using Jakob Nielsen’s 10 Usability Heuristics for User Interface Design

Thanks to the evaluation, I chose Tripadvisor for a deeper analysis. Indeed, Hopper was way behind the others in terms of usability and it may need a full redesign. Kayak and Skyscanner are great, especially Skyscanner, but none of them presented the feature needed. My users want a website to discover great places and things to do during the trip. Only Tripadvisor has that feature. So, Tripadvisor it was!

That was enough for me to conduct my first test: the 5 second usability test.
https://app.usabilityhub.com/do/89e2601dc350/d425

What does Tripadvisor do exactly ?

Tripadvisor’s homepage

I started my users tests with a simple 5 seconds test on the Homepage, to determine what they recognize about Tripadvisor, what they understand it can do for them and finally, how they can look for flights and activities.

Here are the results:

Results of the 5 seconds Usability test

In conclusion, it’s a semi-disaster for the flight feature on the website and the recognition of Tripadvisor’s services.

No one knew exactly what the website does except for activities, the historical core specialty of the website. No one even knew that Tripadvisor compares flights and more importantly, none of them found it on the website at first glance. Also, there are too many categories and they couldn’t remember more than 2 (restaurants and activities mainly).

At this stage, I wanted to go further on the analysis by asking my interviewees to perform 2 tasks on the website, to assess if this conclusion could lead to a pain point for my site redesign assignment.

Accessibili-what ?

Different pages for the Flight service
  • Task: Book a flight for 2 people, from Paris to Lisbon, from the 1st of June to the 8th of June 2021 (no stopover)

On one hand, everyone encountered trouble finding the Flights section. They clicked on the search bar or on « Location de vacances » but they got lost. After navigating for about 3 minutes, they finally found the right entry to look for a flight.

On the other hand, when on the right section, the following part of the task was satisfying! They filled in their flight information, they had no trouble with the filters and except for one confusing information about the price, none of them encountered real pain.

At the end, the same outcome as from the 5 second test emerges: the flight section is not accessible. The navigation is misleading, users get lost and at the end, they don’t even notice that Tripadvisor has a flight service.

I understood that this was a pain point to solve, but since it’s not about redesigning a feature I decided to work on some Homepage wireframes to be A/B tested to improve its performances.

First of all, I wanted to work on the list of services. Every participant told me there were too many categories and misleading, so I chose to reorganize them to make it more understandable. There are now only 5 labels: Lodging, Restaurants, Flights, Activities and More.

Then, I ideated on 3 versions for the homepage, each with different approaches:

3 versions for Tripadvisor’s homepage

Version 1: the « Skyscanner » homepage

I was inspired here by Skyscanner’s homepage, a website praised by 3 of my interviewees as their favourite comparator.

Version 2: the Landing Page

I was here inspired by landing pages. They have strong and visible taglines, the background presents an attractive picture and the main information are presented vertically, which is also great for responsive design:

Version 3: Tripadvisor simplified

In this final version, I wanted to keep Tripadvisor’s big search bar on the top of the page to indicate that the user can simply search for everything!

Since I don’t have access to Tripadvisor’s business goals, I can’t really choose a version but in my opinion, I think that the second version could be the best one: the page arrangement is very familiar to users and some pages on the website already use this layout. Users tend to use it well, with no trouble. Finally, it gives emphasis to a strong and appealing image and the tagline is enhanced.

Oh right, accessibility !

Different pages for the “Activities” service
  • Task: look for activities and things to do in Lisbon during the week

Unlike during the previous test, finding activities was not complicated for the interviewees. But on the other hand, 3 interviewees got lost after accessing the category.

Many entries exist but none of them leads to the same page. They all have different layouts, there is no consistency in presenting the content: the « Flexibility and efficiency » principle is not respected. Also, the « activities » category doesn’t respect the principle « Aesthetic and minimalism » either: the pages are crowded with information and the users are overwhelmed by information.

Even if all the interviewees understood Tripadvisor’s business model, they also agreed that this was too much. They were willing to pursue the task only because it was a test. They told me that if it was a regular situation, they would have left the website and searched for « What to do in Lisbon » in Google.

Again, the first principle of UX Design is Accessibility and here, we clearly see that users don’t access the content, they wander. I finally got the main pain point to solve on the website and here is my proposal to fix it

Redesign of Tripadvisor’s Homepage

In those wireframes, you can see that I tried to harmonize and create consistent layouts between the pages. The search bar is always visible on the top of the page to let the user know that he can modify his search in an instant without having to go back in the navigation. Also, I added understandable page titles and breadcrumbs (which is not the case currently) to give a clear status about the user’s location and navigation on the website. The activities are presented within a map or a list and when you click on an activity you get real content and information about the city, recommendations, reviews (…) prior to having ads presented to sell you a cruise.

In this prototype, I tried to implement a smooth and clean navigation. The goal here is to let the user know where he is and access the information he seeks.

Did I help Simon ?

I hope so! In this redesign challenge, I tried to improve the website’s accessibility. In the current website, the content is there, the tasks are completed with no trouble but the website is so messy ! I hope that I managed to fix this by providing peaceful and clean flows. Of course, this job doesn’t end with 1 section. The whole website should be assessed and aligned with this proposal (if it works).

To conclude, I guess that the best work would be to reverse the users trend and help them be comfortable with finalizing the task (purchase) on the same device, mobile phone especially.

I hope you appreciated this article and please don’t hesitate to comment ! Any feedback can bring me a lot to improve. Thank you for reading it and see you soon!

--

--

July de Jesus

Product Designer in Paris, I’ve been designing digital products for 8 years. Each solution designed is a passionate work dedicated to be relevant and innovative