Take a trip to a world wonder with the whole family

Making the search for an accommodation easier for users on Tripadvisor as a challenge in the prework UX/UI course of ironhack

Nils Jaedicke
8 min readOct 12, 2020
The task: try to find an accommodation in Rome for the whole family

Though we’re in a middle of a pandemic that makes traveling nearly impossible, there’s no risk in dreaming of all the trips one could do in the future. So I took on my next challenge in UX/UI design: to make finding the perfect spot even easier.

The goal was to evaluate the usability of a well known travel app and come up with a redesign that improves the performance based on previously discovered pain points.

Happy family vacation

I chose a family with kids as my user type. They want to take their children to one of the world wonders and plan a trip to Rome, where they want to visit the Coliseum. They saved some money for the big vacation, but won’t be able to afford super luxury. They look for a nice place to stay and relax, ideally close to the landmark.

They will travel in February as temperatures are beginning to rise again around this time. They travel from Berlin and Italy is in the EU so they don’t have to worry about any travel precautions (other than of course having an eye on special restrictions because of Corona).

Usability Evaluation

Heuristic Evaluation

For the apps Kayak, Skyscanner, Tripadvisor and Hopper, I did a first analysis based on Usability Heuristics evaluation with Nielsen’s Principles. I learned about the basic features of the app and identified first weaknesses.

For some details, have a look at my Figma doc

Based on my findings I decided to go for Tripadvisor to test its functionality more closely with real users. The app also offers the feature to look for rental homes which I assumed to be a good option for families with kids.

Testing

I asked four parents in my environment to take on the task of testing the app. They were 37 to 45 years old, 3 were female, 1 male. They had 1 to 3 kids, ranging from 0 to 12 years old.

First I conducted the 5 second test. I showed them the home screen of the app for 5 seconds and asked what they saw.

Tripadvisor home screen (German edition)

Then I gave them the following task: “Search for a hotel or an apartment in Rome to stay there for a week with the whole family on Tripadvisor, ideally even close to the coliseum.”

Insight

The 5 second test revealed that though users recognized it was a travel app, they were distracted by the images and the colorful elements so the main functionalities were harder to grasp.

Home screen: clear value proposition, but a lot of distractions

I knew it was more of an advanced task when not only asking the parents to find a nice place to stay but also demanding if it could maybe be close to their dream destination, the coliseum. I recorded their user flow and asked them about their overall impression of the app and how well it performed on the task they were given. You can have a look on the interviews here (please note that its a weird mix of English and German, as it is my working document that I didn’t polish).

Overall, most of the users felt that the app was very fiddly and felt overwhelmed them with information. Two of them liked the idea and the logo of the brand but felt the execution couldn’t live up to it. Regarding the actual task, the app covered the basic functionality that it was expected to perform from their point of view.

“Where the f*** is the coliseum?”

Finding some place to stay near the coliseum was nearly impossible for them. Only one user found the magic key hidden deeply in filtering options for hotel results. Strangely enough, the feature “Near a landmark” is only available for hotels, not apartments. Most took a detour by looking for the coliseum on another map and then comparing it to the map with search results on their own. Though they couldn’t find the coliseum, they liked the map view of results.

Map with search results. “Where is the coliseum?”

The option “Near a landmark” might not be absolutely necessary to fulfill the basic purpose of the app, but I also discovered some room for improvement regarding the general search process. I guess that a user’s feedback can be pure gold if they give you a hint or even a solution where you should turn your attention: “I expected to have “number of guests” and other filtering options in one place!”. Another user stated that she wished to have the filter options implemented earlier in the search process.

These discoveries were made by visualizing their individual user flows and referencing them with their comments to identify pain points:

User struggles while using Tripadvisor

I identified the following challenges and ranked them by priority:

  1. Merge filter options into one filter and make filter by location possible, while keeping the process lean and easy
  2. Implement filters earlier in the search process
  3. Clean up home screen

Since I identified the last topic to be more of a visual design challenge that didn’t really hinder the users while testing the app, I focused on solving the first two as they were regarding the actual functionality.

My goal was to make searching easier for the user so he or she could focus on viewing results and looking at photos of beautiful places once the search was done.

Site Redesign

I scribbled first ideas. I imagined a busy mother struggling with her whining children while trying to find a place to relax using the app.

It seemed possible to merge the input for number of guests and rooms and the general filter options into one powerful filter — as one user had suggested during testing. Also adding more details when initially entering the search would fit nicely into the flow without making it too heavy. I had a look at Airbnb as one user had mentioned it and discovered that they already had solved some issues quite well. I have to admit it inspired me to add helpful details to the solutions I had already come with on myself: directly displaying search results on a map and also how to add “Search for a landmark or address” option on a map. I laid out my scribbles as a blueprint for a more detailed Figma prototype.

Paper prototype

I implemented the option to define the number of guests earlier in the initial search process so he doesn’t have to bother with it later on. The user can easily skip this input by closing the dialogue and has a preview of the map with results already.

Initial search

I merged list view and map view of results into one hybrid view. Filter options were concentrated on top. So the user has a good overview and can easily access all filter options with one tab.

Search results

I added “number of guests and rooms” to the main filter and specified the “Search by location” option. Though the list got quite long, I assumed it would be easier to use with a clear understanding of each menu icon and easy visual differentiation.

Filter

On the maps view of search results I added the feature to search for specific locations. The user can look for an address or a landmark and focus the search in the particular area. My test users chose the map view most intuitively, so I think this would have given them a nice option to fulfill their task.

I designed the prototype using Figma. You can have a look at it here. You will also find results of the research phase in the document.

Overview of prototype

What I learned

It never ends. When you try to improve such a complex app like Tripadvisor you discover a lot of pain points that accompany the major one you’re working on. The methodology helps to isolate them and solve them one by one. I figured out that UX Design is an ongoing process that is also closely linked to UI Design and Branding.

Heuristic evaluation was new to me and I should have done a less detailed analysis to identify first pain points — next time. I put way too much work into visualizing my findings of user tests in an overview that looked like the hunt for a serial killer. Since I had to struggle most with this phase also in the first challenge, I would like to speed up this process. I know I need to visually organize my findings cause it helps me identify clusters, but I will make handwritten notes on post its while interviewing the next time directly.

I’m happy with the results and would really like to see users interacting with the prototype. As I said, my solution can only improve on a small facet of the overall experience of the app, but I’m curious to see if the tweaks I made already added a noticeable improvement to the usability of the app.

Thanks to all my classmates and other ironhackers who took on this challenge before and gave me a lot of insight before even starting. Also a big thanks to Airbnb for being such a well designed app.

--

--

Nils Jaedicke

Designer at heart. Exploring the realms of UX Design