Ironhack Challenge 3: Usability Evaluation and Site Redesign
In 2017, the world voted for the seven wonders of the new millennium. These are places of unique beauty which attract tourists from all over the world; they also offer services aimed at enhancing the experience for the people who visit them.
My task for this challenge is to conduct a usability case study to improve a mobile app or website through six crucial steps: define a user type, research, do some benchmarking, test, write down valuable insight and redesign wireframes.
1. User Type
First things first: let’s find out who our target users are going to be!
We were given six different user types to choose from. This is the one that I chose to go with:
Young group — 20–40 y/o (4 people)
You and your friends have decided to invest and spend some quality time together. You are planning your trip one year in advance to really make it happen and accommodate everybody’s schedules and needs. You’d like to share as much time together and plan for a lot of fun. You’re interested in a mix of culture and leisure. You have all saved for the last year for the trip so, while you’re still price-conscious, this is the opportunity to spoil yourselves.
But where is our young group headed? After some brainstorming, the winner was Petra, Jordan!
2. Research
- Nearest airport/most convenient airport to destination: King Husein Airport (Aqaba), 2 hours drive from Petra.
- Currency and exchange from your own currency: 1EUR = 0.78JD (Jordan Dinar).
- Vaccinations:
- Measles, Routine Vaccines [all travellers];
- Hepatitis A, Typhoid [most travellers];
- Hepatitis B, Rabies, Yellow Fever [some travellers];
- Visa: Tourist Visa.
- Wardrobe recommendations: Clothing which covers legs and shoulders is the best option for this trip — Jordan is a Muslim country and bare legs or shoulders can be seen as offensive; they should also be light so you don’t overheat. Don’t forget to carry a light sweater and a wind-proof jacket for the evening, when the temperatures start dropping. It is also recommended to wear sturdy shoes such as hiking boots — the desert is tough on shoes made from cloth.
- Days needed to visit attraction: 1–2 days.
Overall itinerary example:
- Day 1: Old City Amman + Jerash
- Day 2: Madaba + Mt. Nebo + Bethany
- Day 3: Petra
- Day 4: Wadi Rum + Dead Sea
- Day 5: Departure from Amman
3. Benchmarking
This is the step where we were asked to go to Kayak, Skyscanner, Trip Advisor and Hopper to conduct Usability Heuristics evaluation with Nielsen’s Principles, comparing at least three of these tools.
Once we identified the one that performs better for our selected user type/scenario in terms of accessibility, value proposition, features, etc. we’ll be performing usability testing to understand how it could get even better and help people travel the world!
After a meticulous analysis, these are the main issues that I experienced while interacting with the tools that I ended up discarding:
Trip Advisor (web)
- There is no sectioning that shows the cheapest, shortest or best value flight like other competitors: you have to manually select the chosen filter from the dropdown menu — the default filter is “best value”, which may work for a large portion of users, anyway.
Skyscanner (web)
- The website provides pre-made combinations of flights without the ability to mix and match flights from different offers, forcing the user to scroll down the list until they find the most suitable option for their trip, thus making the experience frustrating and error-prone.
Hopper (mobile)
- It’s mobile-only.
- When using the app, the interface gives you no clue whatsoever as to which section you’re in, so you may get lost in the process.
- The app won’t let the user pick departing and return flights at the same time: they will have to interact with multiple screens to select all the flights required by their trip.
- You can only change some of the criteria during your search: for example, if you wanted to select a different number of travellers for your trip, you’d have to go back to the first screen and start over.
- Info is displayed in a concise manner, however it may be incomplete on certain screens: for example, after selecting the number of travellers, the user will no longer be able to see this info when selecting flights, so in case of uncertainty they’ll have to go back to the first screen to make sure they typed the correct number of travellers.
- Search options are not intuitive enough.
- It’s not easy to access the help centre in the upper right corner menu, because this will only appear in the “Trips” page.
I found Kayak (web) to be the right choice for the project since it’s easy to use, the booking process is clear, linear and straightforward and criteria can be customised during the search to satisfy everyone’s needs in terms of booking a flight or a hotel accommodation.
4. Testing
For testing I need to target at least 3 users (5 would be ideal ) who are consistent with my selected user type and ask them for a 20 minutes test and interview.
To setup the interviews, I must design the task for my users, which should be adjusted in accordance with the information I have about my target.
What kind of budget do they have?
We’re talking about an intercontinental trip for which the group has been planning and saving for months, which means that they’ll need to cover expenses such as flight tickets, 5-day accommodations, transports and/or rental car, the budget will probably be around €900 each.
What kind of accommodation do they need?
They are going to need a comfortable and spacious accommodation inside a nice — yet not super expensive — hotel, suitable for all four of them. They’re young and adaptable, so they won’t need more than a suite consisting of two rooms with single or double beds.
How would they move around?
Car rental in Jordan is one of the most convenient ways to explore the country, with over one hundred car rental companies based in Amman alone (visitors can also pick up rental cars from Aqaba Airport). On average, visitors should expect to pay around 25–30JD (30–36EUR) per day for a new model with air conditioning and insurance. A car ride from Aqaba to Petra will take approximately one hour and 50 minutes.
Alternatively, since Petra is a world-renowned tourist destination, Jordan operates an excellent bus network which connects visitors from the cities of Amman and Aqaba. The journey takes just under two hours and costs 12JD (14.50EUR) one way or 20JD (24EUR) for a return ticket.
Do they have any time restrictions or is their schedule flexible?
My users are young professionals who work for most of the year, but they are likely to find a good compromise at work for just a few days OOO if they book their trip early enough.
Do they need special care/services (accessibility, day-care, etc.)?
Our young group has been saving up for a short yet packed experience, so they won’t need special services for their stay, since they will be spending most of the time away from the hotel. They will only need daily cleaning and optionally a shuttle to reach the airport and other points of interest.
The tasks:
- Book a round-trip ticket from Bologna (Italy) to Aqaba (Jordan). Spring is the best time to visit Petra, so our time window will be the month of April.
- Book an accommodation: most of the budget is for flight tickets, so we need to find a cheap yet comfortable 3-4 star hotel room in Aqaba.
- Rent a car for the entire duration of the trip.
The interviews:
Before each interview, users will also undergo a 5 seconds test to collect useful data about the look and feel of the website. It is structured as follows:
- Give the user 5 seconds to take a look at the home screen of the metasearch you selected. After 5 seconds, cover the screen and ask them: What did you see? What can this tool do for you? Where would you search for a flight?
After answering these questions, we can move on with the real test which will take place remotely, with users sharing their screens (it will take up to 15–20 minutes). Starting from the homepage of the website, I will observe their interactions and collect data about their experience, keeping notes about the issues that they face while completing the tasks. This way I’ll be able to come up with useful insight to build my own redesign concept.
5. Insight
I interviewed six targets from my personal network. Here are the major pain points in user experience that I aim to solve:
- Most of my users had a hard time finding the dropdown menu for number of passengers/guests selection, which went unnoticed.
- In baggage selection, hasty users tend to overlook the annotation that specifies “Baggage per person” and end up asking why they can’t select more than one cabin bag and two checked bags.
- The upper bar containing flight search criteria selected by the user disappears while scrolling.
- The “Cheapest”, “Best” and “Quickest” flight sections provide a price and a duration for flights. At first it isn’t clear what that duration represents, but after some analysis I figured that it must be the average between the duration of the departing flight and the duration of the return flight for the featured offer. While this piece of information may be useful, nowhere is it specified that the number represents an average.
- It’s not clear whether the prices refer to a single passenger/guest or to the entire group.
- Users didn’t know where to find more info about the flights they were considering (they eventually realized that they had to click on the box with the flights, not on the “View Deal” button, and felt frustrated).
- When selecting a flight, users don’t immediately recognise whether the website registered their choice or not, because the checkbox doesn’t stand out.
- Users don’t get info about the accommodations that they are considering until they click on the offer.
- In the accommodation description, amenities are listed randomly and with no sectioning whatsoever, making it difficult for the user to gather the info they need.
- In the rental car section the “passengers” filter includes the “number of bags” selection, which should have a filter of its own.
- Car photos don’t match the model description. Some users deemed the service unreliable.
6. Redesign Wireframes
Now we have everything we need to come up with those wireframes for our redesign! Here are some wireframes that I made using Sketch where I commented my design choices:
You can play with the interactive prototype that I made with Marvel here:
Final Words
This was the last project for my Ironhack prework, and I can honestly say that I learnt a lot throughout this journey, and I loved how each challenge pushed me to test my skills and, sometimes, to develop new ones.
What this last challenge taught me is that everyone uses websites differently (most of my users didn’t use filters during their search! That hurt me deeply!) and that’s why we should give them as much freedom as we possibly can while designing.
I learnt that tests are a powerful tool, capable of pointing out many issues in user experience that couldn’t be predicted otherwise. I can’t believe all the insight that I got after the interviews, that really opened my eyes to the beauty of engaging with users and listening to their experiences to improve a product and make it more enjoyable.
Another cool thing that I am now aware of is how even a teeny tiny element in the website interface can make a huge difference in the user experience: imagine how counterintuitive it would be to have the login button in the bottom-right corner of the screen, or to represent the search bar with an icon that isn’t the magnifying glass!
Well, now that my bootcamp is about to start, I can’t wait to delve deeper into UX/UI design and learn as much as I can!
Thank you for your time, and feel free to leave a comment with your thoughts!
Feedback is highly appreciated! 😃
