Usability evaluation and Site redesign: Case study (Ironhack Challenge 3)

In this challenge I need to choose a User type and a Destination to conduct a research and then a user testing of travel apps. Based on the results and pain points I will redesign the app chosen as the most suitable for my User type.

A Family goes to see the Pyramids

For my research I chose Family with kids as a User type because it is the closest for me and my surroundings, so it will be easier to test.

My imagined family will go to see the Great Pyramids of Giza in Egypt.

This is the oldest monument among the 7 wonders and there are some mysteries surrounding Kheops pyramids which are not yet revealed. Gravity is lighter inside the pyramids than out. Electronic equipment does not work inside them. The precision of building is impressive. The scientists remain at a loss to answer how exactly it was built.

I decided that it shouldn't be very far destination as for a family with 2–3 kids the Air fare can be too expensive and it can be spent otherwise on the spot.

Photo by Spencer Davis on Unsplash

Here is a little story and portrait of my family and its goals for traveling.

Next year family vacation is going to be BIG. You want to take your children to know all the world’s wonders, but you need to start with one. Because your children have different needs and cannot keep up with only doing tourism, look for a good place to stay and relax. You assumed this is going to be quite an expense but you’re looking for opportunities if there would be any.

Research and Heuristic Evaluation

After defining the basic things like which city we need to travel to see the pyramids (Cairo), what is a currency in Egypt (Egyptian pound)and what will be the best season to go there (Spring or Fall), I take the first step to see which tool can take me there with no hassle.

There are different search tools and Apps helping organize the trips. I will have a look at 3 : Trip Advisor, Skyscanner and Kayak.

Using Usability heuristic evaluation I will measure these 3 Apps interface against 10 principles. This way I will get first overview of possible issues and corrections to be done before testing on users.

Here are my measurement by 10 best known heuristics from Jacob Nielsen.

1.Visibility of system status

Heuristic: The system should always keep users informed about what is going on, through appropriate feedback within reasonable time.

Trip Advisor: The search status is visible by yellow loading bar and showing the number of search results

Kayak: The same thing as Trip Advisor. The search status is visible by blue loading bar(walking)and by text “searching for the best offers”

Skyscanner: The search status is visible by moving circle line showing the number of search results. Little more is a notification explaining that the search results can be not complete and there may be other options available. There is a statement about how they rate the flight options (This is quite transparent and trustworthy).

My choice for visibility is Skyscanner .

2.Match between system and the real world

Heuristic: The system should speak the users’ language, with words, phrases and concepts familiar to the user, rather than system-oriented terms. Follow real-world conventions, making information appear in a natural and logical order.

Trip Advisor: The menu options on Home page are logical and reflecting the goal of the traveler to find everything in one place, but I think the 2 menus should be less overloaded, not overlapping themselves. Need to separate main things from optional or less important like forums and restaurants.

Kayak: To the point. I like the minimum text and maximum icons on the top, no distraction from what you need to accomplish on the site.

Skyscanner: Too much text and questions. Rechercher? It’s obvious that the user will search here, no need to write in bold. Even though the 3 top buttons are logical, not the best home page.

Kayak is better than the rest.

3.User control and freedom

Heuristic: Users often choose system functions by mistake and will need a clearly marked “emergency exit” to leave the unwanted state without having to go through an extended dialogue. Support undo and redo.

Trip Advisor has an advantage above Kayak and Skyscanner of having the 2nd menu bar at the bottom, as for the rest of apps they have the same or similar return arrow at the top left corner.

4.Consistency and standards

Heuristic: Users should not have to wonder whether different words, situations, or actions mean the same thing. Follow platform conventions.

For this evaluation all the apps have done good job. I found that the meanings are consistent in pictograms, actions and colors.

5.Error prevention

Heuristic: Even better than good error messages is a careful design which prevents a problem from occurring in the first place. Either eliminate error-prone conditions or check for them and present users with a confirmation option before they commit to the action.

Trip Advisor: Too much text and information on the screen and poorly organized or categorized, which is misleading and prone to errors.

Why not to list all offers instead of writing that there are 2 more under the 1st one?

Kayak: Very clearly presented information with details about taxes and paid baggage. Difficult to make a mistake there.

Skyscanner: Very thouroghly presented, they managed to squeeze a lot in one screen, but it doesn’t look crowded and it underlines that it is flight summary, so the user knows that he can still change his mind.

6.Recognition rather than recall

Heuristic: Minimize the user’s memory load by making objects, actions, and options visible. The user should not have to remember information from one part of the dialogue to another. Instructions for use of the system should be visible or easily retrievable whenever appropriate.

Trip Advisor and Kayak chose to put the flight summary down the screen and put the offers with prices first.

I would put this main info on the top visible as did Skyscanner. Scroll down is good but better have all at the eyesight not to recall and scroll down.

Skyscanner did great. Really like the concentrated info on this screen.

7.Flexibility and efficiency of use

Heuristic: Accelerators — unseen by the novice user — may often speed up the interaction for the expert user such that the system can cater to both inexperienced and experienced users. Allow users to tailor frequent actions.

All the apps have their efficient accelerators for example filters and sorters or notifications about the new best prices.

8.Aesthetic and minimalist design

Heuristic: Dialogues should not contain information which is irrelevant or rarely needed. Every extra unit of information in a dialogue competes with the relevant units of information and diminishes their relative visibility.

Kayak has a very minimalistic approach and stands out from Skyscanner and Trip Advisor which both have sometimes too much info on the screens.

But Trip Advisor has tooo much of different things which overload the user and make it difficult to find something.

9.Help users recognize, diagnose, and recover from errors

Heuristic: Error messages should be expressed in plain language (no codes), precisely indicate the problem, and constructively suggest a solution.

Couldn’t evaluate this feature, but i collected enough info to choose the best app for my User.

10.Help and documentation

Even though it is better if the system can be used without documentation, it may be necessary to provide help and documentation. Any such information should be easy to search, focused on the user’s task, list concrete steps to be carried out, and not be too large.

Trip Advisor has its FAQ section and Help tool compared to Kayak and Skyscanner that do not have this feature.

Conclusion : My choice for Family with kids is Kayak. Kayak has a very pure, understandable design, no irrelevant or distractive info, which is a time-saver.

It has also a bonus distinct feature for Families with kids — Bagage measurement. You can measure all at home and see if your bag meet the requirement of the Airline company and so to avoid the stress at the airport.

But in overall ther is no major differences for my User type which App to use as all of them missing children friendly features.

Users Testing

I asked 3 of my friends with kids to test Kayak as if they planned a trip to Cairo, Egypt:

• what will be the 1st thing to look up on the app? Flight, hotel or smith else?
• what kind of budget will you spend on flight and on housing?where would you cut the expense? do you want tips from app?
• would you use one App to book everything?
• what housing will you book? BnB or Hotel? why?
• how would you move around in Cairo?
• do they have any time restrictions or schedule is flexible?
• which special services will you need or add to app to free yourself from hassle ?

From testing and feedback I had I defined some pain points to work with to improve Kayak users experience:

1. Home page is very clear but the logical order is not clear. First thing is Flights, then Housing and then Activities or Car.
2. App is redirecting to other sites, for hotels is ok as it is a Booking partner but for flights it is not convenient.
3. The bonus distinct features (bags measurement and flight status )are hidden at the bottom of the screen, so not very visible.
4. The flights details are hidden at the end of the screen.
5. No tips or hints for families travel, like kids friendly hotels or activities etc.
6. Schedule is school holidays driven, so no flexibility for family with kids. It should be added like school vacation for your zone.
7. City Maps or Public transportation map offline with sights will be useful.

Kayak Redesign

From collected feedback I decided to redesign 3 screens for the beginning.

First I will redesign the Home page.

• I’m rearranging the Main top menu by a logical order: Flight, Accommodation, Car etc
• Adding the description of the Screen Accommodation, as it looks exactly as Flight search
• Adding the shadows to let users know that these are clickable buttons
• Making the repeating features visible on the screen without scrolling down and rearranging them in a 2nd bottom menu
• Changing the search tool place on the right corner, so it frees the space for other things
• Adding from which airport we are flying as it can be diffrernt than where we are currently located.

Second I redesigned the Flight summary screen

• By rearranging the information everything fits in a screen without scrolling down
• The main flight info stays on the top and doesn’t go to the bottom as in original version
• As any way Kayak transfers to other booking flights sites, there is no need to have 3 separate buttons and a link, we can have one button to transfer to a screen with a list of all offers and from there separate links.
• The top of the page should state which step we are in, here is Flight Summary

The 3rd screen and final remake is adding the additional Sightseeing or Activities tab option to Kayak main menu.

I think it would be a nice addition categorized by travel groups like Solo, Families, Young couple or Friends.

So that you know exactly what 5–10 places you ll visit advised by other travelers from the same category.

Conclusion

The case study was a good exercise and feel for a real project, despite a lot of time I spent on it. I really enjoyed comparatif analysis by 10 Heuristics of Nielsen — it’s a really great tool before testing. I also found cool features on my phone like Video screenshot and new apps like Preely, which I will use for my testing too. I still need to better learn working in Sketch as it took a lot of time creating wireframes.

Thank you for this long read:)