Challenge 3: Usability Evaluation and Site Redesign

Hélène LE VEVE
7 min readApr 4, 2021

Here we meet again for the 3rd challenge of the prework! This one is about usability evalutation and site redesign!

In this pandemic time, we all need to take holidays and travel somewhere! This period allows us to think about the future: it is the perfect time for planning a beautiful trip, isn’t it? For that, how about discovering one of the fabulous seven wonders of the new millennium?

You’re coming with me? 😎

“Ahah I’m so hidden by those trees, they’ll never know which wonders she chose…” thought the Colosseum. Oh wait…

1. User Type

First of all, I have to choose an user type: who are my users? I decide to select this type of users because it is a huge part of my entourage.

Young couple — 20–40 y/o
You and your partner decide to go to a special place next summer. You realize you have both saved enough for the tickets and are planning to save as much as possible for the next 6 months to do this trip. You want to be efficient and have everything you need organized to enjoy at 100% while there. Even if you’re young, you want to have special moments to celebrate being together.

2. Research

Even if (according to medias…🙄) — Paris is known as the “Capital of Love”, Rome is one of the best romantic cities in the world.

This city is full of history and have some beautiful and impressive monument like the colosseum (which is one of the seven wonders of the new millenium), the pantheon… or the famous Trevi’s fountain where you can toss a coin and make a wish ✨

Maybe Geralt will too…

You could also walk into the Villa Borghese and enjoy of the many charms of Rome! Could it be better for a couple? 😉
To get your trip ready, you’ll need some informations about Rome:

  • AIRPORTS / There is two airports in this city:

— Airport di Fiumicino: almost 30km from center of Rome. It has 4 terminals and it’s for both companies: traditional (like Air France, Lufthansa…) and low-cost (RyanAir, Vueling…).
—Airport Ciampino: almost 18km from center of Rome, but 1 terminal
for low-cost companies only (RyanAir, Vueling…).
Even if this one is a little bit closer in distance, the urban transports aren’t very great…

To keep this trip magical and easy, I’ll recommend the Fiuminico airport (FMO), much easier to travel and reach Rome’s center.

  • CURRENCY / It’s the same currency as Paris: € (euros). Keep in mind to always have cash on you to pay ’cause lots of restaurants doesn’t take CB.
  • MEDICAL NEEDS / CNI or Passport available. No need for visa.
  • WARDROBE RECOMMENDATIONS / Top, pants, dress… summer clothes because at this time the weather is pretty hot. Don’t forget to bring proper clothes (not too short) for some specific places (as churches where shoulders and knees might be hidden).
    Don’t forget to take sunglasses and hats (and sunscreen: iit seems obvious, but it might happen to forget those sometimes).
    Take some comfortable shoes: sandal and sporty Baskets (to walk a lot without having blisters).
  • DAYS NEEDED TO VISIT ATTRACTION / Normally 1 day because you can visit the Colosseum in few hours. At least 2 days to sit down a little.
    But 4 days is the best: a long week-end to see many things and enjoy your trip, with a real change of scene. You might visit some fantastic places and walk into the differents alleys to discover the city.

3. Benchmarking

After conducting the Usability Heuristics Evaluation between Kayak, Skyscanner and Trip Advisor, I chose to work on the last one. It seems more complete for my user type (a young couple remember?) to organize their romantic trip.

4. Testing

I asked 5 couples for the first experience: the 5 seconds testing.
All of them were able to tell me that this is a booking trip application even if they didn’t recognize Trip Advisor (they didn’t saw the loading screen before and the logo is missing on the main page).
They saw at first sight the 6 boxes for special needs (hotel, restaurant etc) and the landing picture with bright colors. All of them will use it for traveling: by booking a ticket, an accomodation or to compare prices.

After this (very) quick experience, it’s time for users tasks:

For this romantic 4 days trip to Rome, keep in mind that the couple will discover some famous places, walk in the city, visit parks and museum to have wonderful memories.
But before dreaming about all they want to do on site, I asked them to do more fundamental and specific tasks. They must:
✈ 1. Choose the best flight in summer (July or August month) for 2 people with luggages.
🛏 2. Bookmark 3 nights in an hotel (budget: about 100€ per night) nearby the colosseum and sort them by price.
🍽 3. Bookmark a restaurant nearby the colosseum for the saturday night.

5. Insight

I asked 5 couples for this experience: I record their screens during the entire process to analyse everything deeply. After that, I was able to detect some pain point for the users:

  • BOOKFLIGHT:
    The main one is the lack of transparency about the flight: there is no luggages or insurrances to choose at first sight, the flight prices seams very attractive. After being redirected to a partner commercial website (which isn’t very obvious either for the users), the price has change considerably (twice or more…). There is too many operations to confirm the flight, too many clicks and all of this generate negative emotions to the users (frustrations, mistrust…).
    It’s also impossible to know which is the best offer when you want to travel and have a flexible calendar.
  • MAIN MENU:
    The search bar isn’t easy to see and to use (just a magnifying glass in the corner).
    Another point was the lack of a real searching bar in the destination field. Many users were disappointed because the screen is pretty empty. Most of them weren’t sure to do the right thing: they tried to tap on the screen to write some words but the field wasn’t very reactive. Others didn’t know how long they should wait because they thought this was a loading screen (they also tried to tap on the “bar” but nothing happened…)
  • FILTERS & MAP:
    The filters weren’t really clear for the users. They all had issues when they had to find a hotel or restaurant nearby the colosseum: the filters and map tabs aren’t visible at first sight.
    Another problem for the place: filter only shows to sort by district (and not in alphabetical order) which is totally insane and complicated for novices!
    I don’t even know the district in Paris even if I’m french… 😅
    So how could a novice know those abroad?

About the map: it’s not intuitive at all! There are no landmarks either. If you search for a special place, you must find it by yourself: not useful, and suuuuch a waste of time. I clearly saw the user’s annoyance…
Moreover, the searching bar on the map leads us to the specific page of the searched place but not in the map… which was very irritating for the users and confuse them a lot.

  • RESTAURANTS / The calendar isn’t useful at all!! It’s an infinite scroll, too long for every users.
    Too much choices: the food choices is really too long and not really pertinent: the culinary speciality isn’t the first proposal.

6. Redesign Wireframes

I decided to redesign the wireframes by taking all of the users’ difficulties into consideration: off course, the pain point described above but also some details (some remarks about the button: the heart button to bookmark specific places or restaurants wasn’t clearly visible. Same for the compass button which wasn’t relevant for the home menu…). Otherwise I also could observe that users always need to re-enter their trip dates for each category (hotel/ restaurant..) and they have to remember which were their trip dates…

You’ll find below 3 differents groupes by steps with my annotation beside: the screenshots from Trip Advisor and my wireframes underneath it.
1- The flight:

Trip advisor User flow — Flights
My wireframe — The Flight Steps

2- The hotel

Trip advisor User flow — Hotel
My wireframe — The Hotel Steps

3- The restaurant

Trip advisor User flow — Restaurant. See how the filter is useful… 🙄
My wireframe — The Hotel Steps

You can also test my prototype here:

Don’t forget to press Z to adjust it to your screen if it’s not already done.

I realize the importance of the mantra “I’m not the user of the product I’m creating and evaluating”. It’s really important to stay back, remain as neutral as possible (which is a real exercise!) and listen to the users. It’s also important to test it with several people (2 or 3 is clearly not enought to analyse). Each steps has his importance!
I really enjoy this challenge, I spend a lot of time to try to understand the users needs. I designed lo-fi wireframes at first, and I hope I could help them a little bit with my mid-fi solutions 😊

Feel free to share your thought about my work guys, because that’s how we evolve! Thanks for reading me!
See you soon on the bootcamp 💪

--

--