For the third challenge at Ironhack, the task is to test and redesign, if necessary, a travelling app or website.
— User type & scenario
First thing first, I had to choose a user type. I decided to go with this one :
Worldtrotter, Backpacker — 18–38 y/o (1) :
You’ve decided to finally go visit the city of your dreams, Tokyo. You don’t have a long time to plan but also you don’t need it. You’ll be traveling in 6 months and are open to almost any possibility but have a budget constraint of 2000 euros. You are price-cautious and prefer experiences where you have a chance to meet people and make acquaintances to enjoy the adventure together. You are not picky and you can accommodate the most affordable, adventurous, genuine experience.
Backpacker tourism : a millenial story
The growing demand for backpacker travel has stimulated a dense infrastructure of services dedicated to their needs, from backpacker hostels to companies organising bus trips to the ‘backpacker’s bible’; the Lonely Planet guide books.
— Greg Richards and Julie Wilson, Backpacker tourism: the contemporary face of youth tourism.
In recent years, a new type of tourism has increasingly emerged: backpacking. Often represented by millennials, these tourists seek an authentic adventure, a real connection with the places they travel and the people they meet.
From the smallest Indian village to the bustling streets of London, the backpacker can be found everywhere.
Flanked by their backpack and the bare essentials, the backpacker also travels with their own cultural background, their desire to share, to enrich and to enrich themself.
In this context, the demand for services exploded. Backpackers are millenials. They are connected and know their way around technology. But they’re also travelling on a budget most of the time and need a solution that help them plan the basics of their trips with no effort.
Scenario details
The destination for this test is Tokyo.
Tokyo is a city of extraordinary energy and history. Between supreme modernity and humanity in the way of life, we discover dissimilar districts which each have their own life, their identity, their smells, their colors, their particular rhythm.
For the test, I did a little bit of background research on the destination :
Destination : Tokyo, Japan.
Dates : from December 22nd, 2021 to January 8th, 2022.
Nearest Airport : Tokyo International Airport, also known as Haneda Airport.
Currency : Yen.
Exchange rate from euro : €1 = ¥130.55 | ¥1 = €0.01
Vaccinations : Chickenpox (Varicella), Diphtheria-Tetanus-Pertussis, Flu (influenza), Measles-Mumps-Rubella (MMR), Polio, Covid, Hepatite A / B
Visa and other documents : No visa required from France. But the traveller needs to carry with them their passport at all time as well as a short-term residence permit given on arrival.
Wardrobe recommendations for winter : sturdy, waterproof boots, gloves, a winter hat and an insulated winter coat.
Average budget : 2036 euros for 2 weeks.
With all those informations in mind, it was now time to choose the right app or website for the task.
— Benchmarking
For this challenge, we have been given the possibility to choose between 4 travel app/website:
Kayak, Skyscanner, TripAdvisor, Hopper.
I based my benchmarking process on Jakob Nielsen’s 10 usability heuristic principles.
UXness describes this process really well :
A heuristic evaluation is a usability inspection method for computer software that helps to identify usability problems in the user interface (UI) design. It specifically involves evaluators examining the interface and judging its compliance with recognized usability principles (the “heuristics”).
To put it simple, heuristic evaluation is a process in which experts use rules of thumb to measure the usability of user interfaces. This process makes it possible to reveal the problems, inconsistencies and report issues, thus allowing the design teams to better anticipate the usability of the product from the development stage.
Jakob Nielsen’s heuristics are probably the most-used usability heuristics for user interface design. Nielsen developed the heuristics based on work together with Rolf Molich in 1990.The final set of heuristics that are still used today were released by Nielsen in 1994. Also known as “Usability Heuristics”.
Now back to our challenge.
After carefully examinating each one, I decided to go with Kayak’s website for a few reasons :
First, I was very pleased with the interface. It is clear, modern and pleasant, easy to navigate. The content is quite clear as well, with the use of keywords, making it easy to recognize the goal and benefits of every page.
The content gets straight to the point, perfect for backpackers. The research is made easy with the use of filters, especially the price range that I found very simple to modulate.
Finally I was really curious about the “create your trip” fonctionnality that let you add to your favorites plane tickets and hotels and gives you the possibility to centralized all your journey informations : tickets, reservations, places, activities etc.
But I still encountered some pain points which made me eager to work on it.
— Usability test
Method
For the test, I decided to interview 3 people that fit the age and user type. All the interviews were made remotely.
First task :
First, I did a 5 secondes test. I presented the Kayak homepage to the interviewee, then closed it.
I then asked a few questions :
What did you see ? What elements stood out the most ?
What caught your attention ?
What was your first impression on the homepage ?
What can this site do for you ?
Where would you go on the site to book a flight ?
Do you remember the name of the company ?
Did you have knowledge of the site before the test ?
Most of my users never heard of Kayak before but they all liked it at first glance, finding it modern but still a little bit overcharged with infos. The logo attracted their eye, as well as the searchbar and the title.
The main pain point that stood out was the purpose of this site. When you get to the homepage for the first time, you land on the car rental service, making it hard for users to understand all the possibilities Kayak has to offer.
Second task :
For the next task, I asked the user to create a trip to Tokyo. In this trip, I wanted them to add plane tickets from december 22nd, 2021 to january 8th, 2022 with a maximum budget of 850 euros. I then asked them to a add an hotel room in Shinjuku from december 23 to december 27. Finally, I asked them to add 2 activities of their choice, one in Shinjuku, the other one in Shibuya. The total budget for the task was 2000 euros.
Results :
All the users had no problem navigating though the website. They find it easy to look up for a flight and an hotel room.
However, a couple of pain points emerged during the test :
- Creating a trip is not made clear enough in the site. The “Trips” menu on top is confusing and doesn’t carry enough meaningful purpose.
- When trying to book a flight, the inability to choose non-stop flights from the homepage search came back 2 out of 3 times.
- On the flights results page, the airline is not obvious enough.
- When booking a hotel, the filter by districts is not highlighted enough. Users have to scroll through all the other filters before finding it.
- Not enough pictures are available on the hotels results page for the hotel. The users have to click on the card to trigger a modal to see the different pictures of the place.
- The button “See the offer/Voir l’offre” redirects immediately to book on an other site. To see the full description of the hotel, users have to click on the card which was not intuitive for some of them.
- A filter to find activities by disctricts was lacking on the activities results page.
- And finally, it was impossible to add activities to your trip the same way you can do for flights or hotels.
Defining the problem :
The users had a nice overall experience on the Kayak website. But they did spend too much time with the filters and trying to add activities to their trip before realising it was not possible. They were a little bit confused about the purpose of the website at first, thinking it was for rental car service only. This made me think that the goal of the site is not clear enough from the beginning and that some improvements could be added to the homepage.
— How I am solving the problem
1- First, I am going to make the homepage easier to understand by adding a “Home/Accueil” section in the menu. On this page, a new tag line will define the purpose of the site, planning a trip, more efficiently. The searchbar will be modified as well, with the ability to choose to book a flight, hotel or car rental. For the flight, the possibility to filter non-stop flight (sans escale) will be present in the searchbar. On top of the page, the “Trips” menu will be change to “Create a trip/Créer un voyage”.
2- On the flights results page, I will add a “non-stop flight” filter above the searchbar and make the airline for each result more obvious, by adding the logo to the card, on the right corner.
3- On the hotels results page, I will move the district filter on top of the page in the searchbar. I will add a carrousel to the result cards so the user can browse the pictures quickly without having to click on the modal. The button will be change from “See the offer” to “See more/Voir plus” so it can now redirect to the details page of the hotel selected rather than the external booking site.
4- For the activities results page, I will add a filter by disctrict, within the searchbar. I will also add the possibility to add to favorite an activity. This will add it to the trip, like flights, car rental and hotels.
5- Finally, on the trips page, a new section will be added for the activities with a card summarizing each user’s favorite activities.
— My Mid-Fi wireframes solution
1- Homepage
There is now a real homepage on the website, defining what Kayak does more clearly. The searchbar has more options (Flights/Vols, Hotels/Hôtels and Car Rental/Voitures), preventing to search for the right category in the menu for too long. There is also a filter to get only non-stop flight. On the top menu, I switch “Trips” to “Create a trip/Créer un voyage” to clarify more the purpose of this action.
2- Flights results page
I made very few changes. I simply added a “non-stop flight” filter above the searchbar and made the company airline’s name more obvious in the card.
3- Hotels results page
Not much changes here. I added a new filter in the searchbar to search by district in the city selected. I also added a carousel to the cards so the user can browse through the hotel’s images without triggering the modal, making the search for a place to stay more intuitive and faster. Finally, I made a change to the button to redirect to the hotel details page instead of the external booking site.
4- Activities results page
I created a search by district in the searchbar to prevent the user to spend too much time scrolling to the disctrict filter that was originally at the bottom of the filter’s menu. I also added the possibility to add activities to your trip and created a new section to the side sheet on the right, with a summary of the activity added.
5- My trips page
Finally for the last issue, I created a new tab on the “Your trips/Vos voyages” page, so the user can find and browse all their favorite activities planned on their trip. I created a card with a summarize of the activity, the name, the date, the price and a button to delete the activity at any time.
If you’re curious, you can view the entire project here :
— Final thoughts : What I learned from this challenge
This was by far the hardest challenge of the pre-work !
The interview process was very difficult at first. My first one was a mess ! Thankfully my friend was very patient. But I was able to learn from it and clarify my process even further for the next interviews. I realized that I needed to spend more time defining the tasks and listening for the feedback during the task -and not simply after. At the end, my 2 other interviews lasted more than 20 minutes but I had more insights to work with. My only regret is that I should have take more time to find more people to interview.
Even though I had good feedback from the interviews, the mid-fi wireframes part was a bit chaotic to me. At times, I felt like I was not doing enough, or that my process was messy and not clear. I really had to focus hard to shut my brain and just keep doing it ! Thankfully my lo-fi wireframes really helped me and I spent a lot of times going back to my pen and paper, iterating though new ideas.
At the end of the challenge, I guess the biggest lesson I learned is that you HAVE to just do it already ! Make mistakes, be messy, go back to your pen and paper, take a walk and come back fresh but KEEP. DOING. IT.
You can’t just know everything from the get go. It’s a slow process. But the feeling of climbing a little bit more of that mountain makes it so worth it !
So I hope you enjoyed reading my article as much as I enjoyed writing it ! Please feel free to leave any feedback, it would really help me get better.
See ya soon !