Aquent's The Gymnasium offers multiple courses to learn new skills. While completing their UX Designs course, I was able to complete a UX project from initial research to final usability testing.

Summary of project:

My client, The Gymnasium, wanted to create a website where users could easily book a flight. I was tasked with doing the initial research, planning, testing, prototype, and analytics for this project. What follows is my steps with this project, following the best practices of UX design - design, test, and repeat.

Part 1 - Initial Data Collection

I identified my user as a young professional who wanted to book a flight on a budget. Accordingly, I did three initial interviews with users allowing them to choose the flight booking website of their choice to observe.

After observing and interviewing three users, I came upon the following trouble points, conclusions, and goals:

My users wanted more options for customizing their flights from the beginning so they did not have to waste time in extra interfaces
My users wanted to be able to navigate easily through the process, making it as stress free as possible.
My users wanted a website that would easily take their input and be easy to browse without extra information and ads.

(Full interview notes)

Part 2 - Wireframes

With this information, I began designing wireframes and navigation for the project. Since my users wanted ease and options, I made sure to emphasize both of those points in my wire frames.

After researching other travel websites, I decided that a drop-down menu would be ideal for navigation. Along with the drop-down, I created a mock-up of the navigation bar for my client along with the required information they desired.

Wireframe #1

The initial page for starting the process. The “i” buttons can be moused over to give more information; the “First Time Flyer” will automatically expand these hints to better help young people who have never flown before.

Wireframe #2

After entering initial options, this is the results that come up. The buttons on the button will get checks with both flights have been chosen as well as allow the “continue button” become active.

Wireframe #3

The summary page after all options have been chosen. The fees are an accordion that can show or hide what the individual fees are.

Step 3 - Prototype and Testing

For my Prototype, I used the program Adobe XD. The goals of my prototype were to test three things:

Inputting options for choosing a flight including date and optional features
The results screen and how the user can choose flights that meet their needs
The easy to understand summary screen that takes all guesswork and hidden fees out of finding a flight

Using the prototype, found here, I tested again to see how effective the changes were with my users.

Copy of full user observations: Prototype Observations

Using one user from the initial interview and two new ones I found:

The prototype was easy to use and navigate
My users were happy at how they were able to accomplish their goals more easily

Summary

My user, a young professional who wants to book a flight on a budget, wanted a simple and streamlined process. They wanted to have plenty of options to choose from so they could quickly and easily pick their flight and get on to the other tasks they needed to complete.

Through this design, my user accomplishes their goals and helps my client to increase traffic and ease to their website.