Airfly Website

UX Design

Scroll

Competitor Analysis

As part of my Professional diploma in UX Design, I had to create a hypothetical airline company website, and go through the whole UX process, which consisted of doing a competitor analysis first, followed by an online survey. This was done to gather an understanding of what kind of airline websites are on the market, and see what features are good and can be implement onto my final Airline website, and what doesn’t work.

From there I conducted a usability test, to better understand the process a user would take to book a flight. I first started off with an interview to gather some insights on the user such as what their occupation is, how they usually access the internet, what kind of travel apps they use, if any, how often they travel, what kind of airline sites they use and to describe the last time they booked a flight. After that part was done we moved on to the last part of the usability test which was giving the user a scenario to use on two websites which were Ryanair and Lufthansa.

After this was done I conducted a note taking exercise to write down key insights from the usability test to help me develop the final product.

Affinity Diagram

After the research block was done it was time to gather all the research conducted and compile it into an affinity diagram, to analyse common trends from the different research techniques conducted. From this I learnt different pain points, good features, and other points experiences by various types of users.

From the research gathered I also created a customer journey map to analyse the goals, mood, behaviours, pain points and positive interactions through each step of the process of booking a flight.

Customer Journey Map

After the research and analysis blocks, it was time to start designing the actual product. I first created a flow diagram of the website.Then I moved on to creating sketches of how the initial website will look, where the content would be placed, as well as annotations on how certain elements of the website would work when it would be handed to the developers. (Click here to view sketches)

Flow Diagram

After the sketches were done I moved on to creating the prototype. This step was done to refine the layouts from the sketches and prototype it to be able to test it out and if needed make changes to improve the flow, features and the user experience of the product. (Click here to view prototype)

Wireframe

For the last step of this project I created the wireframe, which included both the final design of the website as well as all the annotations for each design element of the page, so that developers would be able to code each feature accordingly.

Previous
Previous

Domino's Flyer