Usability Evaluation and Site Redesign

Introduction

Laura Searle
12 min readNov 1, 2020

Silvia and Gonzalo, a young couple from Madrid of 32 and 31 years old, have decided they want to go to Brasil next summer, and baring in mind this year was impossible to travel abroad, they have saved enough money for the plane tickets and will save even more for the rest of the trip, next 2021.

They both have pretty intense work lives, and being able to take the time off work for a long trip is already some sort of miracle, so they really want to be as efficient as possible and have everything really organized before, so when they are at the destination they only have to concentrate on enjoying it.

Goals of the case study

  1. Conduct Usability Heuristics evaluation with Nielsen’s Principles of at least 3 of the following mobile apps: Skyscanner, Trip Advisor and Hopper.
  2. Chose the app that is more adequate for my user/persona and redesign and solve one pain point I see through my research.

Brief initial research

To understand better what my users persona would be looking for, I did an initial research about Brazil, which gave me the following information:

  1. When you visit Brazil, you want to get to know at least the main cities/tourist attractions: Sao Paolo, Rio de Janeiro, Salvador de Bahía, Iguazú Falls and Amazonas.
  2. Best way of traveling around seems to be by plane: it’s cheap and safe, and distances in a big country like Brazil are big, therefore it will save time.
  3. At the end of February takes place Brazilian Carnival, which is unique in the world, and obviously implies prices are higher, but also, more an experience to remember!
  4. You can take a taxi from the airport to the city center but it’s important to book it through an agency to guarantee safety.
  5. Safety is an issue: and doing cash withdrawals in public machines is not a good idea. Therefore it’s better to take cash in the local currency before traveling, and hide part of this money in a separate wallet inside clothes.

Based on this, I already have in my head a list of ideas my user persona is going to want to see in this travel apps and that they may be worried about:

Pains & Gains of User Persona

Thinking about this, makes me identify better with my user, but also be more efficient when deciding which is the most adequate app to redesign.

Nielsen’s Principles Evaluation

After this quick evaluation I could observe many things that could be improved in all 3 apps, but selected some for each that I considered more significant.

HOPPER

Main competitive advantage is personalization through price

Captions of 3 screens that show main pain points
  • (1)Help users with errors: Initially I realize have of the messages are in spanish and half in english. I think this can mean that something is not working, so after a while I find language options, see that spanish is selected, click on it again and nothing changes. After a while of giving app a pop-up window appears notifying me that the app is still being translated. This in an “error” that could have been prevented by informing the user from the beginning and having a more visible language button.
  • (2)Match between system and real world: when selecting travel dates im showed a calendar where I can’t see days and numbers, and initially I see colors, that based on my previous experience with apps makes me think it refers to occupation, rather than price ranges.
  • (3)User control and freedom: once travel destination is selected and dates, if I wan’t to edit my destination I can’t without going back all the steps, which then implies I have to select date etc again.

SKYSCANNER

Main competitive advantage is that is completely flight based and literally compares every flight available for the selected option.

Skyscanner Trips Option

Analyzing Skyscanner was a little harder at the beginning, as it’s a platform I’m very familiar with, but when I entered the app, that I exclusively use for flight searches, I realized it also had a plan a trip option which I had never even realized was there.

As I am trying to see things from the perspective of my user persona I immediately realized even though it’s a great app to search flights, it’s not as good for accommodations, and can’t really be used to plan other plans besides these two things.

Based on that conclusion, and as part of my initial research, I asked 3 couples of friends of mine to open the phone app and navigate a little, and after a couple of minutes asked them what was skyscanner for they all said: it’s to compare and search for flights. When I asked them: can you plan a trip with Skyscanner? the answer in all three cases was negative and none of them had realized it had a

TRIPADVISOR

Main competitive advantage is that is based on user recommendations

Captions of the screens that show main pain points

I entered Tripadvisor with the idea to try and plan a trip to Brasil, but initially took me a little bit until I understood how to use their tool to plan trips. Based on Nielsen’s principles I observed the following:

  • (1)Flexibility & efficiency of use: when planning a trip, you create a board where you can start adding places you want to visit, cities, restaurants etc… but you can’t add flights. Baring in mind the whole app works by adding to your favorites or to your trip your preferred options, It doesn’t show efficiency of use that the only way of saving flight options is to actually buying one through a different website you are redirected to.
  • (2)Recognition rather than recall: Once inside our folder for planning a trip, and having selected the dates, there is several options. Two of these options are: edit dates and organize. When clicking on organize, you can actually only edit the dates, and instead of seeing “wednesday 25th of November” you can change it to call it “day 1” and so on. The option “edit dates” allows you to change the selected dates. I found the naming of these two options a bit confusing regarding the actions the user could actually take, and very similar withing each other.
  • (3)Aesthetic and minimalistic design: I found Trip Advisor to be a bit overwhelming with the amount of information displayed and options offered to the user. I think this could be solved by adding some options of what the user is looking to find from the beginning, and therefore guiding him through he platform.

So which app is better for my user persona?

Based on this initial research I decided that Trip Advisor seemed to be the most complete app for Silvia & Gonzalo, as if offered a more 360º experience in all areas that they needed to plan a trip.

Next steps: interviewing

Knowing now I was going to want to improve one task in the TripAdvisor app, and having had my own experience, I asked three couples of a man and a woman, that had never travelled to Brazil before and all of them same age group as my user persona (30–36 years old), the following questions:

1. How do you usually plan trips together?

2. What’s the main issue you face when going to new destinations?

3. What is the first thing you do when you are deciding upon a destination?

Conclusions were the following:

  1. 3/3 plan trips separately and then sit together to share their findings. This is due generally because they search for options throughout the day while they are at work.

Therefore that the app has a board or folder where you can save all your findings is really important.

2. 2/3 couples said the main issue is not really knowing where to start, specially if they want to go to several cities. Is it better to fly to the main one and later come back from a smaller one? Should they rent a car to travel around and always use the same airport?

1/3 couples said main issue was adjusting to a certain budget.

This indicated to me that suggestions based on the main cities that wanted to be visited, or even already made trips that had the bare minimun and then you could add options to could be a good idea.

The budget issue also indicated that being able to determine a price range in the search for options was important.

3. 3/3 couples said the first thing they always looked for, in overseas trips was flights, as it was usually one of the most expensive parts.

Therefore how the flight search engine was done, and how easy it was to save flights to the board, or set up alarms for flight prices or even first flight combinations, was really important.

After this first short interview, I asked them to accomplish the following task:

In 20 minutes I want you to: plan together a trip to Brazil using exclusively the TripAdvisor App, that includes at least flights, accommodation and one plan to do, for at least 3 different cities in a 21 days trip, thinking about a budget of maximum 4000 euros.

And this is where the fun starts…

Main Pain Points for the established task:

  1. Even though all 3 couples successfully created a board in the “Travel” button in the menu at the bottom, only 1/3 managed to save a flight they were interested in inside that trip, and it wasn’t through the normal way of just clicking on the heart button and then add to trip, but by having to add a note within the day planner with a link to the flight.
  2. On top of it, when clicking on a flight, Tripadvisor redirects you to an external website, which when navigating on a computer browser is not very surprising, but it is when using an app, specially if the user is not notified beforehand.
  3. Planning distances and activities seems to not be clear. All three couples started browsing through activities and liking them through the “heart button”, but then started wondering which one they could do first, if they were close to each other or if they were even available on the selected dates. Only 1/3 couples realized there was a map, on the top of the trip board, but they where disappointed by it as they couldn’t see distances or use it in a similar way to google maps.
  4. 2/3 couples forgot about the price. When by the end of the task I asked, and them if they had though if they were within the budget, and they said they only remembered prices of flights and accommodation, but not of activities. 1/3 couples did consider budget, but as they found impossible to find through the app how much they were spending for their planned trip, they used pen and paper to write it down. When asked if they would have done that in a normal situation, they confessed they only did it because it was the task I had assigned, but that in a normal situation they stopped using the app because of it.

Here comes the redesign!

Not being able to save a flight inside the trip, is a major pain point for Tripadvisor, as user flow was the following:

User Flow if you want to save a flight

Which could be solved by adding a heart button next to flight options so that these could be saved in the trip board:

Left original screen I Right proposal with adding heart button next to flight options

But I decided it was more interesting and a little more complex to solve, the fact of being able to plan a whole trip and know at all times your budget.
For doing so, I felt that adding something the user didn’t have to learn, and that was familiar with could work, so I created and “add to basket option” where you could:

1. Check at all times the total amount of selected options by checking your basket

2. Know at one glance the price of each activity

3. Buy options separately, which would solve the idea of maybe not being sure to buy everything at the beginning, but also allowing some freedom while having the “save for later” options there.

4. Having the option of bulk reserving everything: in which case TripAdvisor would handle it but it would save a lot of time and effort.

How to implement the idea on the wireframes

Below i’ll walk you through the wireframes. Please note that the one on the left will always be the original, and on the right you will have my proposal.

  1. Step 1: Create your trip

As you can see below, I decided to change the trip icon. I thought the heart was a little confusing and also that I wanted to use it for a “save for later option”.

2. Step 2: Give a title to your trip

3. Step 3: Your board trip has been created. Start planning.

Even though in this case it was tempting to redesign some of the options, I decided to fully concentrate on my task, and therefore I only introduced for the first time the “cart icon”, on the right top part.

This will work as a traditional shopping cart, that you can add items to, preview what’s inside by scrolling over and access it to finish your payment or edit your items.

4. Step 4: Start adding activities to your trip.

As you can see below, once you’ve added a couple of options you are interested in in your trip folder or board, this options are displayed in small boxes that contain: the title of the activity, the TripAdvisor rating, location, and the possibility of adding a note.

I decided it would be more efficient as you can see in my proposal on the right wireframe to have the following:

  • Location that’s interactive so that when you click you can see it on a map.
  • Always the price visible, before clicking on the activity for more info.
  • Four icons (from left to right): an add notes icon, add to favorites, add to shopping cart, set a date (to make planning easier).

5. Step 5: Inside the shopping cart

After selecting several of these activities and adding them to the shopping cart, the user could go inside this one and check all the added items.

Activites would be displayed as seen below, always including an image so that being able to remember the activity would be easier for the user, as well as the activity name, location, the selected dates, and the number of tickets desired.

Within each activity, the user could select it (tick box icon), delete it (bin icon), or save if for later (heart icon). There would also be an available option to select all activities, o delete selection.

At the end of this list, there would be the total amount, number of activities selected, and by clicking in proceed to payment, the user would be able to pay for their selection.

Considering that there is a possibility that the user wants to have all the items inside their cart, but maybe only pay and book some of them individually to start with, each activity has a “buy now button” by which it will proceed to payment but only individually.

BEFORE (Original wireframes)
AFTER (my proposal)

Key learnings

  1. During your research, trying to investigate one single task and assign it to your interviewee proofs to be more efficient in order to better understand where the problem sits.
  2. Interview, interview and interview!! By listening and not assuming, you can solve 80% problems.
  3. Start simple: don’t try and create a whole new app. Chose something that can really improve the user experience by never losing focus of the ultimate goal os the task you want your user to accomplish.

Thanks for reading!!

--

--