top of page

The project

Creating an airline website for a better user experience

The Overview

This was a case study for my school - The UX Design Institute. The objective was to create an improved version of a website for a better user experience, using the UX design thinking. The process is based on research, the analysis of the results and the ideation for improvements. 

Timeline

5-6 weeks

Tools

Miro       Invision        Figma

Screenshot 2023-10-23 at 18.22.27.png
Screenshot 2023-10-23 at 18.21.48.png
Screenshot 2023-10-23 at 18.23.21.png

My Role

Idea

Research

UX

The Problems

question marks_edited_edited_edited_edit

Through my research - benchmarking, survey, usability test - I ended up with a long list of issues:

 

  • There are unnecessary travel extras that are disturbing/ confusing.

  • The Search Flight button is not visible, have to look for it.

  • The names of the date fields are confusing ‘’Outgoing’’/’’Return’’ flight.

  • Frequently used site doesn’t recognize the user's location.

  • Calendar view doesn’t show the days.

  • Calendar view should mark the lowest price, as on the app.

  • Not clear if the price is for 1 or 2 passengers.

  • Selecting flight on calendar view only redirects to list view, where there are more flights with different prices.

  • List view doesn’t show the dates, nor the number of flights/ day.

  • Flight duration is not clear. Does it refer to the whole flight or only for the layover? 

  • No info if the destination is in a different time zone.

  • List view- the time of the flight is confusing because of the page layout.

  • Site shows unavailable fares/ features → confusing.

  • No info on what a fare includes.

  • No option to choose luggage size separately, the more expensive fare needs to be chosen, which includes unnecessary extras.

  • Passenger details are not saved from previous use, everything needs to be filled in.

  • Confirmation email doesn’t arrive instantly after purchase, it creates confusion.

Ideation

My aim was to narrow it down to a main use case, as it is not realistic to adjust everything to each person’s needs. Therefore I compared the results from my research to find the most common issues and to work on those. Such as price transparency, clear dates, and detailed flight info.

Screenshot 2023-11-02 at 18_edited_edite
Screenshot 2023-11-02 at 18_edited.png
Screenshot 2023-11-08 at 15_edited.png
Screenshot 2023-11-08 at 15.42_edited.png
Screenshot 2023-11-08 at 15.42_edited.png
Screenshot 2023-11-08 at 15.52_edited.png

The process

1. Benchmarking

booking.com.jpg

I chose the following sites:

 

Booking.com

Skyscanner

Turkish Airlines

Vueling

 

and I took notes for the following criteria:

 

  • Homepage - how straightforward and easy it is to navigate

 

  • Search - what filters are provided and how efficient they are

 

  • Information - how transparent/ clear the information is regarding flight details, cancellation, terms, additional costs

 

  • Personal feel – thoughts on how pleasant it is to navigate on the website

skyscanner.jpg
turkish airlines.jpg
vueling.jpg

The PPT was the first step, then I used notes to collect the data, as it will be easier to group them into positive and negative points. 

Miro notes

2. Survey

https://www.surveymonkey.com/r/BKKGS6Z

 

Note: This was a time where Covid was very much present, therefore many responses and complaints were related to that. In those cases I analysed how the information was provided and not the content itself. 

Miro notes

My main takeaway was that people like to stick to their commonly used sites, because they already know their process and have trust in them. They use search engines like Skyscanner/ Google flights only for research purposes, but then eventually they use the actual airline website. Common annoying features are the ads all over the place, confusion can happen regarding dates, prices, flight time. 

3. Usability Test

Two of the tests were given by the school. The notes, Participant 1 and Participant 2, are my reviews of them. In addition I conducted a third test, notes Participant 3. 

At this point I already started to see a pattern of the most common problems, such as: the important info, price, dates, times are not transparent or not clear, however unnecessary features are displayed.

4. Affinity Diagram

Some of the groupings are, what’s confusing, appealing features, what prevents booking, website is intuitive, notifications, etc..

5. Customer Journey Map

CJM.jpg

The conclusion of my findings can be seen under the paragraph ''The Problems''. 

6. Flow Diagram

7. Interaction Design

The followings are the measures I implemented based on the issues I gathered:

Homepage:

- Location is given on homepage.

- Search flight button is bright, visible.

Flight Results:

- On click on ''Flight details'' pop up opens on the same page with the flight info so the user doesn't have to navigate back to the flight results page.

- The fares have all info and only the available ones are visible.

Flight Details:

- Flight details are clearly listed with available options to add extras separately.

Payment:

- User's payment info is recognised, doesn't need to fill everything in.

- Clear confirmation message about the purchase on the website.

8. Wireframe

Conclusion

My first case study. It actually felt like doing a puzzle, I knew what I wanted more or less and I just had to put the pieces together. Through the process I realised there will always be something I could improve, especially after testing the result. So UX basically, always learn and improve.

Personally I learned that breaking down one step into mini steps helps untangle big chunks of info, however doing so it is also important not to lose sight of the bigger picture. It is easy to get lost in the details and eventually that could cause some time being wasted. 

Regarding the prototype, I didn't work much on UI and in retrospect, I could have put more effort into it. 

Overall working on this project made ,UX and the design thinking process, make sense. 

bottom of page