99 ways not to get to Machu Picchu (Peruvians will hate this trick) | Ironhack
--
Prework Challenge 3: ‘Usability Evaluation and Site Redesign’
Imagine the following scenario: You and your friends finally reached that point in life, where traveling no longer equals packing only two pair of underpants and a bar of soap (so you can book a flight with cabin luggage only), just to then check into this particular BEST-DEAL-limited-offer-only! hostel with 7 or more roommates (cockroaches not included). Not going to lie: been there, done that.
Instead you’re now in your early 30s. You landed your first stable job and salary — and also find yourself surrounded by a social circle who, like you, left the good old backpacking times behind, but are also not quite yet in that next stage of life of settling with their partners and/or children and/or pets.
You and your friends decide to do the vacation of the year together. Far away, with a mix of culture and leisure, a bit of adventure, something special. All of you have always wanted to see South America. And visiting Machu Picchu in Peru has been a shared dream of yours — it was recently declared one of the New Seven Wonders of the World after all!
You’re a small group of four and even though you don’t have to be overly price-conscious, you still like to keep a tiny eye on your budget (old habits, right?). But as this trip is a one-time opportunity for your group in the given constellation, making it actually happen has first priority. Vacation days are rare — so things need to be well-planned.
The task
In this Ironhack challenge I was asked to select one of the New Seven Wonders of the World as a travel destination and perform a usability test on a travel app. For this I had to create the mentioned scenario first, which then would be the basis for finding a number test users that fitted the description. Analyzing my testees performing their user test should give me insights on the biggest pain points when using that app. This, then, should lead me to conceptualizing a possible site redesign (aka improvement of the app’s features I needed to solve the problem I’d discovered before).
For a first benchmark I compared the mobile apps Kayak, TripAdvisor and Skyscanner. Whilst all three of them had a pleasant design and generally met Nielsen’s heuristic principles (which, frankly, I’d expect from popular apps like that), I quickly found out, that Kayak and Skyscanner clearly focused on how to get to a specific destination. My use case, however, needed more information than that! Remember my users? My group of friends wants to make a wholesome plan, which means: not only information on flights were needed, like hotels or rental cars — but also first insights on possible activities. TripAdvisor was the only app that included all of that.
The test
I selected three persons between the age of 29 and 33. All of them knew TripAdvisor already but, interestingly enough, weren’t really using it. I described the aforementioned scenario to them and gave the additional information that Cusco, Peru is the nearest airport to go to and that main season would be between May to October. I then split my usability test into two phases: First, I did a 5 second test and then I asked them to perform two tasks on the app, which I’ll describe below.
For the 5 second test my testees had to look at the app’s main screen for a short moment, close it again and answer three questions based on this first quick impression. The answers were more or less precise and ranged between the following:
- What did you see?
buttons, (6) icons, a picture, a map, “flights”, “restaurants” and “where do you want to go”, … - What can this tool do for you?
help me find anything for my travel like activities or hotels, makes me want to go somewhere, can help to plan travels and find recommendations for restaurants and sights, … - Where would you search for a flight?
one of the icons (all had the same answer here!)
After that, I asked them to perform the following tasks:
- Give a rough estimate on when’s the best time to travel for the group (best as in combining flight duration + price at the given date)!
- Find a cool option for visiting Machu Picchu!
The results were surprising: Everyone was super quick on the 2nd task and performed it almost naturally, with only a few clicks:
The testees selected ‘Aktivitäten’ on the main page (even though I intentionally didn’t even use the word “activity”), typed in “Machu Picchu” or “Cusco” and scrolled down to look at the suggested activities. It seemed like there wasn’t any big problem to discover. Judging from both their behaviour and also the answers to the 5 second test before, the main site did its job quite well.
The real problems, however, were found during the flight search.
All of my users were avid travelers and used their smartphone proficiently (travel apps included). Despite that, when looking for flights, all of them were wildly clicking around, scrolling up and down the search results page and got lost in a heap of information. There was quite some friction in the handling of the app. The main pain points everyone encountered were:
- Filtern / Sortieren (filter / sort) couldn’t be clicked while the search results were loading, one had to wait & watch until it was finished before filter options could be changed
- Filtern / Sortieren (filter / sort) lead to a long menu of confusing sorting options AND there were checkboxes as input control even though only single selections could be made (radio buttons would have been the logical choice here)
- Empfohlene Flüge (recommended flights) looks like a menu link but only leads to an info box; the users rather expected to get a selection of recommended flights, it seemed pretty suggestive to assume this would be read as the description for the results shown
- Flüge beobachten (watch flights) would lead to a newsletter subscription instead of showing an in-app feature
- the search wasn’t automatically loading as soon as all information was inserted, but needed an extra click on the search button (I found my users waiting for quite a while until they even noticed)
What was especially remarkable was, that each (!) of my users autonomously mentioned they were missing a convenient overview for comparing best travel times and prices. No surprise: this seems like a standard feature on comparable other sites (no matter if official airline page or flight search app). But neither did the TripAdvisor app give you some general written information (e.g. “the standard travel time / price is….”, “other users paid…”) nor did it include a particular feature to compare results.
Convince yourself in the clickable mock-up here on Figma.
Curious of a full view of the filter options? Here’s the fun!
TripAdvisor’s flight search was missing simplicity and user-friendly performance. It provided way more information than necessary, didn’t prevent errors, didn’t make it easy to re-do actions, had the user remember information and always go extra steps.
The solution
You might already see where this is going… A quick look at the competitors confirmed the assumption: Skyscanner as well as Kayak not only included a convenient feature for comparing flights — no, even better than that! They’d offer super user-friendly solutions by already filtering out the best results and linking to them directly from the search results page. The user has the choice to select different views for cheapest, fastest or best flights (combining the prior options) in both apps and on Kayak you’d also get a precise overview of your possible dates to travel the cheapest.
KAYAK:
SKYSCANNER:
How do they always say in UX?
It’s okay not to reinvent the wheel.
Why not learn from the (best) practices of others then?
The shared opinion and needs of my users were so obvious — so why shouldn’t the solution be as well? My redesign jumped onto the competitors’ shoulders and took them as literal role models. I even took Google Flights into further consideration as this search is also well-known for its usability expertise. The lo-fi wireframe sketch that I created reduced and/or replaced the most misleading links and — let’s be honest here — annoying pages (and information overload) of TripAdvisor’s app. Like this, the basic layout and functions of TripAdvisor didn’t even need to be changed that much (except for the frustration button “watch flights”…), it rather was the content everything linked to, that was altered.
Here’s my lo-fi wireframe:
Summary
What’s left to say? The last time I used TripAdvisor was, when I I used it for rating restaurants badly that served me dishes over 5€ (= loooong ago). The internet has grown up since then — but nevertheless, TripAdvisor’s app somehow feels like it’s slow in the race.
Without knowing the app’s history too well, it gave me the impression that curating recommendations for places and activities still is TripAdvisor’s main focus. In terms of tourist attractions they still seem to be in a leading position. And their integrated booking option certainly is convenient! The flight search however gave the general impression that it was kind of … pressed into the concept? Like a feature that was only added afterwards, as an extra—which doesn’t seem too unlikely, to be honest, as the tool only mirrors external sources(instead of integrating an actual booking feature).
In my own designing process, what stood out to me was, that it really proved as inconvenient to me to integrate too much information. The content of an app should never equal an encyclopedia (except for when it’s an encyclopedia app, obviously). I had the first-hand experience that it is more than okay to condensate information. This probably is why I also found my own wireframe to be super minimalistic in comparison to how I sketched and designed before. I could also apply this principle of simplicity to my own methods: I noticed how by reducing information, I created quicker, failed faster and got back on track better than before.
