Challenge 3: Usability Evaluation and Site Redesign
By: Olivia Bse
Tags: Heuristics, Usability, Tripadvisor, Ironhack Prework, Redesign

I have put myself in the shoes of a world traveler, keeping in my mind this new mantra “I am not the user of the product I am creating and evaluating”.

credit photo: Fabio Fistarol on Unsplash

I have been inquired to choose a destination, to visit one of the Seven Wonders of the New Millennium. My choice fell on the Colosseum in Rome in Italy. The largest of the Roman-built amphitheatres, the Colosseum was intented for gladiatorial and wild animal combatants, residing for centuries the very symbol of Rome’s eternity. It was originally named the Flavian Amphitheater, appointed after the family of the emperors who established it. Its construction began between 70 and 72 AD, under the reign of Emperor Vespasian, and was completed in 80 under Titus.

Among the six different types of user, my preference fell on the elderly couple 60–80 years old and here is their story:

“You and your partner want to visit one of the wonders now that you’re retired. Looking for a tour or package with some flexibility that would allow you to enjoy while not dealing with many processes and desitions on your own.”

Now it’s time to define the specifics of this destination.

Nearest airport / most convenient airport to the destination point: The first airport is Leonardo da Vinci International Airport in Rome Fiumicino (FCO) which is 30 kilometres from the Colosseum in Rome. It is the largest airport in Rome. From this airport, there are 8 ways to get to the Colosseum, by bus, train, taxi, car, shuttle or luxury car. Located within 24 kilometres away, the second is Rome-Ciampino (CIA). From this airport, there are 2 ways to get to the Colosseum, by shuttle and taxi.

⚠️ For your information: A TAXI trip is priced €30 for a maximum of four passengers + luggage. However, be cautious as it is recommended to use a city taxi of Rome, which offers a fixed price for the transfer to the city center. Rome taxis are recognisable as follows by: their white colour, the taxi sign on each vehicle roof, their license number and the inscription “Roma Capitale”, both must appear on the passenger door and the rear of the vehicle. TERRAVISION SHUTTLE the trip lasts 45–55 minutes and can be extended if there is a lot of traffic and its cost is €4 per person. LEONARDO EXPRESS TRAIN the travel takes exactly 32 minutes and costs €14 per person. Howbeit leaves only from the first airport, Leonardo da Vinci International Airport in rome Fiumicino (FCO).

Currency and exchange apply to your money: As country’s currency is the euro €.

As country’s currency is the euro €. Medical needs: vaccination, visa: There are no compulsory vaccinations before departure.

Recommended vaccinations before departure are as follows: Hepatitis B, Diphtheria, Tetanus, Poliomyelitis.

Tick-borne encephalitis: possible in this country (rural areas in spring or summer). Please consult a vaccination center.

For a stay of three months maximum, French nationals must have en accurate ID card number.

Wardrobe recommendations: The best seasons to travel to central Italy are spring, autumn, and winter.

In the summer, the city center suffers a few weeks of heatwave, not to mention the crowds. The suggested best time prevails from September to May. The climate in central Italy is the Mediterranean, temperatures are pleasant all year long. The rainiest months are October, November and December. The regular temperatures in January are 13°C and 32°C in July.

For a winter trip: sweaters, windproof and waterproof suit is recommended. When visiting a religious place, even in summer, it is advised to wear clothes that cover at least the shoulders and knees. Comfortable shoes for walking down the aisles without forgetting a pair of sunglasses.

Duration needed to spend visiting the attraction: One day will be necessary to visit the Colosseum. It takes 2–3 hours of queueing to purchase a ticket for the site. Otherwise, you will have to pay for “skip-the-line tickets” to reach the arena directly, without queuing with an attendant. To explore the Colosseum without a guide and an audio guide, it will take about 1 hour, add to it 1 hour 15 minutes for the visit, understanding that this will leave you plenty of time to take many photos. With a guide either an audio guide, the visit commonly lasts between 1 hour 30 minutes and 1 hour 45 minutes.

Make way for benchmarking.

I need to perform a heuristic usability assessment with Nielsen principles. I need to identify the one that works best for my type of user meaning 60–80 year elder couple. So I compared 4 mobile apps such as, Kayak, Skyscanner, Trip Advisor and Hopper. I selected Tripadvisor because it’s the only app that offers a tour, although their aesthetic and minimalist design is far from it.

Usability testing.

I gave my users 5 seconds to take a look at the Trip Advisor home screen mobile app. After 5 seconds I hide the screen to ask these 3 questions:

What did you see?

What can this tool do for you?

Where would you search for a flight?

Then comes a 20-minute interview setting the scene.

I asked for 3 tasks that my user must perform on the Trip Advisor mobile app:

To find a flight while avoiding the summer period.

To find accommodation in the city centre of Rome.

And last but not least find a tour to visit the Colosseum.

My users, aged 69 and 71, have found, that the 5 seconds are very short, on analysing the screen, they have been focused on the picture essentially and not around it.

For the second part of my test, 2/3 of my users were able to find the flight, the hotel and choose an excursion to visit Colosseum. I will distribute the discomfort points by step.

The flight choice:

First of all, while looking for a flight on Trip Advisor, my users were not sure if they were on the round trip option, moreover, when they wanted to choose their dates, as there was no indication whatsoever they had to choose the return. They wanted to press the Done key without the power. And finally and inadvertently, by trying to tap their finger that they succeeded.

Total lack of flexibility. They would have liked to choose their return flight schedules earlier than the schedules offered, and not having to choose from the Trip Advisor selection.

📌 Note, it is regrettable noticing that the filter option is not at all clear for this type of users. Nobody has utilised the filter option to facilitate their research.

The choice of booking a hotel room:

The great point is, that the dates of destination, and the number of people are recorded. They appreciated not having to redefine this part.

However, the negative point in this research was the lack of clarity on the map, especially the inaccurate location of the hotel and distance related to the Colosseum.

And when the users wanted to see the offer, they did not realise that they were leaving the app and were redirected to the internet offer.

The choice of the excursion:

Surprisingly, the icon for finding a circuit was found relatively easily. My successful users focused on the “Purchase tickets and tours part”. Then on “Guided tours and tourism”.

I will accordingly focus on the user who recognised the picture of Colosseum without reading “Special occasions and luxury”, all of a sudden the user, have landed themselves into visits that were overpriced for their budget.

Following the principles of Nielsen Heuristics, I chose to modify the visibility of the system state, to match system + real world, recognition rather than recall, aesthetic, minimalist design, flexibility and efficiency of use.

Now, let’s take a close up at the design.

Home page.

For the home page, which gave 2 of my users a situation during the 5-second test, I simplified by eliminating the picture of the house and laying a single search bar, which was the contrary on the original page, as two prevailed. The banner and the magnifying glass, which are at the top right, leads the users to the same place. I have also eliminated the travel forums icon. In my mind is in the icon trips with the small suitcase. I will explain why this change later.

For booking the flights.

I widened the round trip part and removed the find flights button. It only appears when all the text fields are filled.

For the choice of dates.

original

I notify by instant message information to enter the return date. I removed the “finished or done” button. It only appears when the departure and return dates are fully selected and completed.

Redesign

For the flight results.

I suggest putting an input message explaining “Use the filter/sort to refine your search from:

The cheapest to most expensive.

Choose to leave earlier or later.

And more…”

Locate your hotel.

This is the most unbearable point for my users. Locate your hotel from the Colosseum neighbourhood, the map gives too much information often not related to the search, like the Vatican, The Roma theatre, museum was also listed, the users were confused.

When they have pressed activities banner. Numerous activities appeared without separating the monuments, cultural spaces. There is too much information and the same time it requires clarity.

First, I suggest that when I click on activities, I have two choices. Find it in a drop-down menu or search for it with the search banner and using the keyboard.

Thus appears the distance between the hotel and the monument. If I want to see the offer, a pop-up window message notifies me that I will be redirected to the hotel’s website.

For the excursion.

I removed the photos for purchase of tickets and circuits. If you recall, one of my users chose the right photo, the Colosseum without reading that it was the special occasions and luxury part. So, instead of the photographs, I replaced them with pictograms.

I will finally explain why I replaced the heart with the suitcase. Because this same user, who was very visual, wanted to like a photo like we do on a social media network but did not understand why he could not like the photo he liked. That is the reason why I replaced it.

It was very pleasant to observe users in front of a tool, to note the discomfort points. This part was complementary following the two other challenges, design thinking and wireframing. With this third challenge , I can already see the upstream work accomplished and the learning that has only just begun.

The first challenge’s common sense was a follow up with the users examination. The second challenge was to recreate a wireframe, The third to identify and detect the confusion and offering to solve it.

Thank you ever so much for reading.