Travel Trader is 4 years old and needed updating to bring it up to date with the latest uability standards.

Little consideration had been given to mobile users, whilst data showed that over 75% of traffic was through using a mobile device.

The existing user journey can be improved to allow users to find more specific listings, meaning a faster experience and a higher chance of conversion.

The website also has a slow loading time. when initially landing on the homepage.

Please note: To comply with my non-disclosure agreement, I have omitted confidential information in this case study. All information in this case study is my own and does not necessarily reflect the views of the company I worked for. I have replaced the original company and product names with the alias, “Travel Trader”.

As the sole designer, I had the opportunity to spearhead the UX design of this website:

I follow IDEO’s human-centered design and lean UX design thinking process to make sure that my design decisions are supported by user research and feedback.

To understand more about the existing user experience, we conducted user research with 15 participants. This led to the development of two personas.

User Personas

Based on conversations with current users and potential users, I created personas for a typical Travel Trader user to guide design decisions and the team's priorities throughout the project.

Remote Usability Testing

By reaching out to 5 existing users and asking them to complete a series of tasks using Travel Trader, I was able to validate some of our persona assumptions and spot users’ pain points.

Important User Insights:

1. The website was taking a lot of time to load (up to 20 seconds on a good wifi connection).
2. Users were unsure how they would find what they were looking for using the navigation.
3. Users found the filters less intuitive than other websites.

Analysing Existing User Journey

I analysed the existing user flow of performing a search to understand where users issues could be highlighted (highlighted in red text).

Identifying Pain Points

After usability testing, I wrote down each user’s pain points onto a Post-It note. Then I used affinity mapping to group the pain points into similar categories on a wall.

Prioritizing Pain Points

1. The website was taking a lot of time to load (up to 20 seconds on a good wifi connection).
2. Users found the UI confusing and some key content was missing compared to the desktop version.
3. The colour palette used on the website was very similar and content that should be highlighted did not stand out such as buttons and discounts. 
4. Users were unable to sign up using their social profile.

Wireframes

I created some quick wireframes using Figma to show the product manager and development team rough ideas for the app functionality, layout, and UI components. 

The wireframes made it easier for developers to communicate feasibility issues and offer feedback early on.

Moodboard

I created a mood board to inspire the look and feel of the user interface.

A Logo Update (of colour)

Using Adobe Illustrator I updated the logo colour to a brighter and more vibrant blue and removed the gradient to give it a fresher, cleaner look.

Style Guide

Travel Trader’s brand must convey fun, passion, friendliness and trust. These brand values helped inspire the colour palette, shapes, movement, and typography. I created the style guide using Figma.

Fonts

Icons

New icons were created to improve the user experience and to give the website a cleaner and simpler look. 

Listing Types

UI Icons

Mockups

I used Figma to create high-fidelity mockups of my proposed solutions.

Testing the Prototype

I tested the interactive prototype with 5 new users to validate whether the problem has been solved. 

Validating results:

After conducting validation tests and iterating designs:

• All users navigated through the mobile website with ease and could find what they were looking for more easily
• All users found the buttons and key information with the new accent colour much more intuitive and easier to see than the previous website
• All users felt that they would be more likely to buy or sell a holiday with the new interface

Lessons Learned

User Experience is challenging, especially when working as the sole designer. Whilst you can bounce ideas off other stakeholders it is always a huge benefit to work with other designers to speed up the process of the creation stage.

The Results...

What’s Next?

In the next release, we hope to provide users with a dedicated mobile app that would  include notifications and improved communication and , plus a 'contact the team' modal to give a direct method, plus keeps them engaged with he app.

By having a simple onboarding process when signing up we can gain useful information that can then be used to give a more personalised experience for the user.