Group Project

Travel Unity

Travel Unity is a 501(c) non profit organization focused on increasing diversity within the world of travel. My team and I reached out to the organization for an unsolicited redesign of their desktop website to improve their information architecture.

Overview

The Covid-19 Pandemic forcibly took students from the classroom and back into their homes. As a result, virtual learning students in K-12thgrades have faced a variety of obstacles such as low academic performance. I planned on using design and research to uncover solutions for these users.

The Problem

  • Travel Unity isn't getting as much traffic on their website with 71.98% of people leaving the website once reaching the homepage. They're having difficulty reaching their users and promoting their travel programs.

Our Solution

  • Improve vistor engagement through redesigned homepage screens
  • Redesign webpages relating to Collegiant and Youth programs to improve information architecture

Project Details

Timeline

September 8th - December 1st 2022

My Role

UX Researcher
UX Designer

Platform

Desktop

Tools

Figma
Slack
Zoom

Design Process

Double Diamond (Discover > Define > Develop > Deliver)

Team

Sam Chung: Researcher, Asset Collector, Wireframer + Prototyper for Hi-Fi Designs
Derick Yeh: Researcher, Wireframer + Prototyper for Hi-Fi Designs
Fatima G Jhong: Content writer + Researcher

Team

Hydeia Blakey

UX Researcher + Designer

Jalena Threatt

UX Researcher + Content Designer

Janide Rene

UX Designer

Stephanie R.

UX Designer + Asset collector

Discover

More diversity in travel? We're onboard.

With an interest in helping diverse groups, we reached out to Travel Unity for a redesign of their desktop website. While informative, we noticed that the Travel Unity website was a bit outdated compared to modern day websites with a similar format but we reached out because we wanted to dig deeper. We wanted to find out how we could use UX design to solve problems the business might be having.

The Response + Digging Deep

Once we received the approval from Travel Unity on a redesign, we set up a meeting with Roni Weiss (the founder of TU) to understand Travel Unity’s goals and the challenges they might be having behind the scenes.

Our meeting with Roni gave us some major takeaways:

  • Travel unity focuses on two sides: working with the travel industry to align best practices and working with alliance members to include diversity and inclusion.
  • Their target users are students in age ranges 14-25 and  industry professionals in the world of travel.
  • Their goal is to get students, especially younger generations to see travel as a potential career.
  • They view success by how easily accessible information is for their users.

We learned the problems that Travel Unity wanted to focus on

While Roni gave us some ideas on where we could start with this redesign project, he recommended that we talk to Elijah, the director of Youth and Collegiante programs for more information on what the business wants us to focus on.

From our meeting with Elijah we understood more of Travel Unity's goals: 

  • The most important takeaway that TU wants for students is that they can learn more about what their programs offer and apply.
  • They have worked with UX designers before and the main feedback they received on their website were accessibility issues primarily with color.
  • Google Analytics show that people majorily drop off the site once they reach the homepage.

Finding gaps in the user experience

With an idea of where the business wants to focus, we decided to conduct a Heuristic Evaluation of problem areas on Travel Unity's website to get an idea of what users might be experiencing. We tackled heuristic evaluations of the homepage, program pages (Travel Unity's Global Scholars, College Corps, Youth Advisory Council) and volunteer page. (The heuristic evaluation was completed by another team member and I, but I will showcase my work from the Home, College Corps, Global Scholars and Youth Advisory Council pages)

Homepage
Homepage
Homepage

Understanding Travel Unity's audience and what they think

I created a usability test script for my team to conduct 6 user interviews of students interested in the world of travel.

"I felt like there was a lot of information ... so I think it's a [website] you could potentially get lost in."
Interviewee from Usability Testing

The test consisted of questions and scenarios that would help us understand:

Define

What exactly is the problem with Travel Unity's website?

We created an affinity map to organize interview findings into pain points (things users felt dissatisfied with), motivations (what they looked forward to or felt happy to see) and behaviors (actions users took while testing).

Some key takeaways from testing included: 

This led to the realization of our problem statement: 

"How might we improve the page content and information hierarchy to decrease bounce rate from homepage into program pages"
"How might we improve the page content and information hierarchy to decrease bounce rate from homepage into program pages"

Our User

The insight into our HMW statement and what users thought about Travel Unity's website helped craft our persona: Alex Rodriguez.

Revising the structure of Travel Unity

We revised the original structure of Travel Unity's navigation system based on the feedback received from Usability Testing in addition to an open card sort created by two of our team members.

Define

Realizing that we don't have enough time for so many pages

Originally we set a deadline to complete our project within 12 weeks but we also didn't realize that some of our team members would be completing another project in the same time frame. We shortened the amount of flows that we'd focus on from showcasing all program pages on Travel Unity's website to a single flow of the Homepage into the College program page. This way we'd give our stakeholders an idea of what the journey from the homepage into one of their programs would look like.

Develop

Making a blueprint to stay on track

Most of our team members sketched how we imagined a user would make it from the landing page into a specific program page. We sketched out designs for the homepage and an example program page based on the feedback we'd received from usability testing. We also voted on the designs we aligned on using stickies inside the program Figjam.

Turning blueprints into sustainable designs

For our low-fidelity wireframes, I was in charge of redesigning portions of the homepage and redesigning the Youth & Collegiate Programs page. Below I will detail the changes I made from the original design into the redesign. However, you can view all of our low-fidelity wireframes here.

Homepage

Original site: Navigation/Top of Homepage

Travel Unity's original homepage featured a side navigation bar with the ability to close the navigation bar on the right side of the screen. You could also filter through their slider which includes their donation button and other events that they have planned for the upcoming year.

Redesign: Navigation/Top of Homepage

  • In the homepage redesign, users felt that the original homepage felt too cluttered and crowded with information. Based on other non-profit website best practices, I decided that a horizontal navigation might work best in helping the user quickly get to the pages they need. Without an option to close, searching and using the navigation would always be available at the top of the page.
  • A prominent donation button would help users quickly get to the page to support the nonprofit.
  • Lastly, I decided to change the slider into a static mission statement message within a hero image to help users understand what Travel Unity is as soon as they reach the landing page. This would help users who initially were confused in testing on what the organization is, receive clarity.

Redesign: Annual Reports section

In the redesign, I thought that a graph might have the most visual impact and help users see the data in an abstract way. Users would still be able to view the data outside of the graph if needed.

Redesign: Footer

In the redesign we decided to add a footer. I went with a left aligned footer which would have Travel Unity's logo, a mission statement, their contact information and popular navigation pages for the users to click.

College Programs Page

Redesign: Youth & Collegiate Programs page

In the redesign, I made some changes that gives users insight into all the programs that Travel Unity offers so that they can make a decision on the information they want to receive rather than searching around the site for it.

Deliver

Travel Unity's Redesigned Website

This is the current prototype of our hi-fidelity solution for Travel Unity.

Click image to open prototype

Reflections

This isn't the end of our journey

More Testing

  • We haven't tested the hi-fidelity version of the redesign. We want to see how this solution stacks against Travel Unity's current website before presenting to our stakeholders!

Filtration System

  • Because Travel Unity has events that they want to emphasis on their homepage. For the upcoming events section we created, we plan to also create a filtration system that wil make it easier for users to cycle through past summit events from the company.
Back to top