Ironhack UX/UI Design. Challenge 3: Usability Evaluation and Site Redesign
For challenge 3 of the UX/UI Ironhack bootcamp we were supposed to do a usability evaluation for an app like Kayak, Sky scanner, TripAdvisor and Hopper. Then, based on the conclusions that arise from the testing we had to come up with redesigned wireframes for the place where we detected pain points.
1. Destination: Peru, Machu Pichu
2. User type:
We have 6 user types to choose from and each one has different needs and expectations.
1. Worldtrotter, Backpacker — 18–38 y/o (1)
Flexible about the trip but price cautious.
2. Young group 20–40 y/o (4)
Planned trip, price conscious but willing to enjoy. Mix of culture and leisure.
3. Young couple 20–40 y/o (2)
Everything organized, efficient, certain flexibility with the prices.
4. Family w/ children 30–50 y/o (4)
Wants to relax and willing to spend and make it BIG.
5. Small group of friends 40–60 y/o (3)
Exclusivity and quality above all. Flexible trip.
6. Elder couple 60–80 y/o (2)
Looking for a package with certain flexibility. Want to avoid taking decision.
For my case, I selected the young couple group.
3. Research
Nearest airport: airport of Cusco
Conversion rate: 1 euros = 4,42 Peruvian Nuevos Soles
Medical needs: Typhoid, Hepatitis A, Measles, mumps, rubella (MMR), Diphtheria, whooping cough, tetanus (DPT).
No visa needed.
Wardrobe recommendations: Light weight clothing with long sleeves and pants
Dates: 19/03/2021–31/03/2021
4. Benchmarking
Following, I will do an evaluation of Nielsen Heuristics to compare three apps: Kayak, Hopper and TripAdvisor.
1. Visibility of system status: I found that all three sites clearly communicate what the system state is, so the user will get a clear understanding of the progress of a specific activity within the app.
2. Match between system and the real world: I believe that for this characteristic TripAdvisor and Hopper do it better than Kayak. I feel that they make a better use of the terms for the users, such as “finding the best deals on wheels” (Hopper). Even though, its fair to say that all three of them work with appropriate language.
3. User control and freedom: TripAdvisor and Kayak are the best in this respect, exits are always clearly marked if you performed an unwanted action, even though they both use third party websites, cancel buttons are always clear and intuitive. This is not the case with Hopper, there are parts where you get stuck trying to go back. Also, if you arrived at an unwanted page you must go back screen by screen, which I found inconvenient.
4. Consistency and standards: I found Kayak and TripAdvisor to be the best at this, but mostly because of the colors, buttons, and overall experience. But generally, all three do a good job.
5. Error prevention: Kayak and Hopper would be my choice regarding this aspect, because I feel Tripadvisor is over saturated with information, making it easier for the user to make a mistake.
6. Aesthetics and minimalist design: Kayak is the winner. Its simple, clean, visually appealing and straight forward.
7. Recognition rather than recall: I feel all three sites achieve this very well, its easy to recognize the information every step of the way.
8. Flexibility and efficiency of use: All of them allow you save your searches, making it easy for you to access the ones that interest you the most. I like the way Hopper makes use of this because if you search for a certain flight, it gives you the option to watch the trip for deals, keeping you up to date with any changes that might arise.
9. Help users recognize, diagnose, and recover from errors: All have clear messages to tell the user to let them know that something went wrong and offer solution to solve it.
10. Help and documentation: Information is straightforward and clear, there is no need for extra help and documentation.
Conclusion: After this evaluation I have decided to go for TripAdvisor, despite Hopper and Kayak also being good options. But, considering the user type, their needs, and expectations I think TripAdvisor offers better hotel deals, restaurants, and things to do for the type of vacation that a young couple want to have. Also, the ratings are a key factor, because it reassures the user on the type of experience that they can expect.
5. Testing
We are asked to interview at least three users using the app we selected to gain insights into what the app can improve.
Five second test
In this test I asked the user to look at the home screen of the website for 5 seconds and respond certain questions like: What did you see? What can this tool do for you? Where would you search for you flight?
All the respondents where able to determine that this was a traveling website because they saw icons for hotels, flights, and restaurants. All three knew the basic things that this app could do for you, while two out of the three knew where to search for flights.
To carry out the user testing part I reached out to three different couples through zoom. I asked them to go through the process of:
· Entering the destination
· Searching for a flight
· Searching for an accommodation
· Searching for a Car to rent
6. Insights
While testing the three couples it showed that the most useful aspect of Tripadvisor is to be able to see the different options/offers of flights, restaurants, accommodation, etc. all at once. Because if they were to search for only one thing, they would search for it independently in a particular website. Therefore, I focused on the process of planning a whole itinerary of a trip on the website.
When the users where on the homepage, the first pain point appeared. They didn’t know whether they should start by entering the destination on the search bar or going directly to the option of hotels because there was no flight option.
They decided to enter their destination on the search bar, arriving to the following page:
This page was unnecessary and confusing for the user, it contained a lot of text and information that the person already knew beforehand.
Finally, the couples came to page where they could insert their dates, destination, number of passengers and other options. Yet, the look of the website is different from the initial webpage, with distracting colors and irrelevant background picture. Once they can search for the flights, TripAdvisor takes them to the following page:
Filters are confusing, there is a lot of information and its not well organized. It was frustrating for the users to change from one page to another in a seamless and simple manner.
7. Redesigned wireframes:
On my wireframes I focused on making this process for the user more intuitive, with less irrelevant information in between and letting them switch from one option to the other with ease. The pain point I wanted to focus on were the following:
Making the homepage more user friendly, by proposing the most relevant options that the user can select from.
· Planning an entire trip through the website, in an intuitive and clear manner that would guide the user through the process.
· Making the filters more relevant to each category. They have an easy access to the most popular ones and then if they want to see more filters a whole list of options would appear. This is visually more appealing because you give the necessary relevance to the different options with the photos and remove the side bar on the left.
· Having a summary of the options they are interested in at the end with an estimated final cost. Instead of the person having to view offers of different options independently and being forced to open several windows.
On the homepage, I decided to lay out the options clearly for the user. One can decide whether to only chose for flight, accommodation, car rental or plan an entire journey which would include all the latter. Once the user clicks on the option of plan a journey, the webpage will take him/her to the page of selecting the destination, passengers, etc.
You can see clearly on the top the different steps that “planning a journey” would include, if the user wants to skip an option, he can do it by clicking on the continue button. I thought it was also useful to have the main details on the top of the page on the center, in case the person would like to choose different dates or amount of people for a different tab.
When the user finishes adding his options, he/she will arrive to a summary of the itinerary, where they can see an estimate of what these options will cost. They can also view the offer on the third-party webpage.
8. Learnings
This project allowed me to apply all the concepts I learned from the usability module. However, it was quite challenging for me because at the start when I was using the page, I didn’t see as many flaws. But, when the users began to go through the process of planning a trip, many of the problems started to arise. I was able to empathize and see with a much more UX/UI mentality the whole situation. The process of redesigning is difficult at the beginning when you have all these insights, but you don’t know where to start. But, once you start to develop a certain vision of how the experience could work, everything starts to make more sense.
