Skyscanner

Usability Evaluation & Site Redesign (World Traveler) — Case Study

Laissa Moura Ferreira
6 min readApr 8, 2020
UI-designer_illustration_by_tranmautritam

“Traveling — it leaves you speechless, then turns you into a storyteller.” — Ibn Battuta

Planning a trip is not always an easy mission, but thanks to the internet, some platforms can help all the world travelers with it. For our 3rd Challenge, we were asked to improve this experience by redesigning one of these platforms.

Challenges

UI/UX Design Illustration Set by Bernadetta Pastuszka
  • Analyze the platform to brainstorm areas of friction for improving user experience and navigation
  • Conduct heuristic evaluation and usability tests to confirm pain points or uncover new ones
  • Design wireframes to suggest solutions for the major pain points

The choice: Skyscanner

Before starting the usability test with users, I’ve done a Heuristic Evaluation using Nielsen’s 10 general principles for interaction design to help me select the best travel platform for my user type, and the winner was Skyscanner.

Compared with some of its most popular cousins, such as Trip Advisor and Kayak, Skyscanner is the one that has the best layout, in my opinion. Its language is pretty easy to understand too. However, after the heuristic evaluation, I’ve detected a few improvements that could be done regarding its usability, and some of them could be confirmed after the usability test with real users.

The center: User type

Young couple

Demographic: 20–40 y/o

Behavior: Adventurous and curious. Loves culinary experiences and earn enough money to travel internationally

Goals/Needs: Travel internationally once a year. Be able to efficiently plan their vacation.

According to Condor Ferries’ early research, youth generation is reshaping how travel works by focusing on experiences and culture, solo travel, planning their itineraries, ignoring cheap stock content and drawing their decision and influence from social media or user-generated content.

My process

After defining my user type and choosing the platform I was going to aim, I’ve sketched to structure and guide my process.

  • Research
  • Define
  • Test
  • Results/Insights
  • Redesign/Wireframe

Research

UI/UX Design Illustration Set by Bernadetta Pastuszka
  • Reasons for users to choose a destination and a platform
  • Specifics of my chosen platform: Skyscanner.
  • Specifics of my chosen destination: Coliseum, Rome.

Define

The research gave me material to define the main tasks, and the steps a user has to perform to accomplish them (user journey map). Focused on the main goal and needs of my user, I built the scope of my usability test.

User Journey Map

Test

UI/UX Design Illustration Set by Bernadetta Pastuszka

Usability testing is a popular UX research methodology. I’ve chosen to do a Remote Moderated Usability Test because it is fast and easier to access the participants. During the test, I asked the participants to perform tasks (previously defined by the user journey map) using the platform. While the participants completed each task, I observed their behavior and listened for feedback.

Task #1 — Search flights to Rome

  • for you and your partner
  • the total budget for the trip is R$12.000,00 (for both)
  • 6–8 days between August and September
  • the best option (regarding time, stops, price)
  • with baggage

Task #2 — Search accommodation in Rome

  • for you and your partner
  • the total budget for the trip is R$12.000,00 (for both)
  • on the dates picked for flights
  • the best option (regarding location, rating, price)
  • with breakfast

Task #3 — Search to get a car rented

  • for you and your partner
  • the total budget for the trip is R$12.000,00 (for both)
  • on the dates picked for flights and accommodation
  • the best option (regarding model, conditions, price)
  • with insurance

Results and Insights

Here’s a list of some general complaints and pain-points from users regarding the platform:

Searching for flights

#1

  • The option “whole month” is not easily noticed, so all of them started their research checking date by date, which made them lose a lot of time.

#2

  • There is no baggage information on the platform, users have to go to another website to check this information.

#3

  • The total price, displayed on the research after picking dates, doesn’t follow the total price for the number of passengers, which creates a wrong expectation and confuses their choices.

#4

  • On the page for the research option “whole month”, there are two calendars side by side and it confuses the user. It is not clear that they correspond to departure and return calendar options.

Searching for accommodation

#5

  • There is no filter that allows users to choose some relevant locations like touristic places or airports

#6

  • The map is not clear regarding relevant places like touristic places or airports

Renting a car

#7

  • There is no information about insurance

#8

  • There is no information about the model of the car, only a small picture

#9

  • There is no “sort by” option for the results

The general insights were changing some UI elements and including information and features to the pages.

Redesign and Wireframes

I’ve chosen to aim in six pain-points, and the solutions suggested will be presented on the wireframes bellow:

#1

  • Instead of changing only the color of the title from each tab, the background also changes to highlight that there are two options.

#2

  • A “baggage” section was included in the search options. Now, users will also get information regarding baggage.

#3

  • The “depart” and “return” are now on top of the selector, making it clear what each calendar is for.

#4

  • The price highlighted is the total for all passengers, and under it is the price per passenger.

#5

  • A filter “location” was included. Now, users can select relevant places for the accommodation search.

#6

  • The options selected on the “location” filter also appear on the map, making it easier to see the location of each accommodation regarding relevant places.

#7

  • A selector “sort by” was included to results

#8

  • Information about insurance are now displayed on the results

#9

  • The model of the car is also displayed on the results

Conclusion

I believe this was the most difficult challenge so far, but also the most enlightening one. Case studies are a great way of learning new things by doing, which is excellent for new designers and students like me.

The fact I had the chance to learn about how to conduct a usability test was the most important gain for me with this challenge.

I’m more prepared to analyze services and products from a designer's point of view using relevant standards and principles. Keep going with case studies is definitely something I’m going to do from now on, even after I have the chance to start working with real projects.

--

--

Laissa Moura Ferreira

An empathetic creator with a playground inside her head. Product Designer ☔️