on your way.

A place for travelers to manage their vacations.
VIEW PROTOTYPE

Project

Role: UX researcher, end-to-end UX designer

Timeline: five weeks

Process: goal determination, user research, secondary research, affinity mapping, POVs & HMWs, persona creation, site map & feature set, user & task flows, branding, wireframing, prototyping, testing

Target Demographic: young professionals between the ages of 18 and 32

Tools: Figma

Goals

• Create a platform for users to track all of their vacation booking information

• Allow users to create itineraries within the platform

• Plan for a vacation on a budget

Pain Points

• Potential users struggling to find activities to do on vacation that fall within their budget or allotted time frame

•  Potential users do not have a way to keep track of all their vacation information (booking information, confirmation codes, etc.)

STEP ONE - RESEARCH

Interviews

Demographics of Interviewees:
• three men

• three women

• ages 18-29
I interviewed six individuals during which the data collected determined that:

• Users need a place to store their tickets, booking information, etc.

• Users are interested in planning their trip itineraries by being able to see various activities without having to search on multiple sites

• Users want to plan an enjoyable trip on a budget

Secondary Research

Companies compared: 
• Wanderlog

• Hopper
• Kayak

• Expedia
Findings:
• None of the companies allow their users to maintain all trip details in one location
• Only one product provides an itinerary creation option
• Many of the companies had budget booking features

STEP TWO - THE USER

Personas

In dreaming up On Your Way, Millie was on my mind each step of the way. I knew that Millie needed a product that would help her achieve her goal of visiting one new country per year - something totally doable with the help of On Your Way. 

POVs

• As a traveler, Millie would like to manage her travel information (booking codes, confirmation emails, documents, etc.) she doesn’t have a system to keep track of the needed information effectively.

• Millie would like to travel on a budget and find enjoyable activities for her destinations because planning enjoyable activities is the most exciting part of planning a trip for her.

• Millie would like to find ways to afford travel since affording a vacation is a pain point for her.

HMWs

• How might we help Mille plan an itinerary and to do so within her budget and allotted travel timeframe?

• How might we help Millie travel abroad and do so within her specific budget?

• How might we help Millie afford more activities on their vacation and still stay within their allotted budget?

Card Sorting

With Millie in mind, I connected with four individuals who participated in On Your Way's card sorting. Each was given a list of 39 topics and five categories. The five categories, including Profile, Settings, Your Trips, Explore, and Help, would end up becoming the menu options for On Your Way. The card sorters were tasked with sorting each topic into one of the five categories.

The results were fascinating - some individuals thought that the topics "phone number" and "email address," for example, would be under the Help section of the product, while others thought those same topics would fall within the user's Profile section. 

Site Map & Feature Set

When reading the results of the card sorting, I was able to separate each topic into a corresponding category that was most user-friendly, according to the results, and create On Your Way's site map. Each topic was carefully reviewed and considered before assigning it to a menu category.

I was able to list features that were necessary for the initial launch of On Your Way. I listed out and evaluated nice-to-have features, features that would be surprising and delightful for users, and features that most definitely could come later in the iteration process.

User Flows

Based on information collected during the initial user interviews, I determined paths in which a user might move from one point to the next when using On Your Way. As shown above, users of On Your Way have multiple decisions to make in order to come to the same conclusion in creating itineraries, planning their vacations, and even simply signing into the product.

Task Flows

Upon completing the user flows, I determined the course of action a user is likely to take when creating task flows. For example, when sending a friend's previous trip details, a user will need to navigate to their previous trips page before finding a share option to complete the task. 

STEP THREE - BRANDING

Color Palette

In creating this color palette, I was interested in using two bold colors and one neutral. Based on the brand, I determined that the contrast between the orange and the blue while still maintaining the neutral colors would allow for a vibrant product.

Logo

Because this project is an end-to-end travel product, I wanted to go with something that indicated as much. I chose to use the airplane as an A in the word way. Additionally, the orange fade continues to fit with the brand identity.

Typography

I chose a simple sans-serif typography for this project as it matches the brand identity.

STEP FOUR - DESIGNING

Wireframes

• I worked with peers and mentors to obtain feedback on my low-fidelity wireframes before beginning iterations

• Upon receiving feedback and critiques, I evaluated travel company mobile applications and desktop websites as references for future iterations

• Next, I applied feedback and references before ensuring adequate and accurate coloring, spacing, etc., and again presented it in a group meeting and to my mentor 
When iterating between my low-fidelity and high-fidelity wireframes, I went back to the basics. I looked through my secondary research and sat with other product websites and mobile applications open to view what potential On Your Way users would expect from my product. 

I determined, for example, that breadcrumbs on a responsive mobile design were unnecessary and outdated. Additionally, I found the importance of using a hamburger menu over a bottom navigation bar

Many of On Your Way's competitors allowed their users to like or favorite various options within their product. In my iterations between low and high-fidelity wireframes, I too added a favorite feature. Additionally, I found it important to add ratings and reviews features that would provide users the opportunity to learn more about the location, activity, service, etc. that they would be purchasing within On Your Way.

STEP FIVE - TESTING

Prototyping

The prototyping process took place in Figma. Prototyping brought a unique set of challenges as I wanted to ensure each screen was pixel-perfect before allowing potential users to test the product. I look forward to simplifying my prototyping process in future projects as I learn ways in which users interact with the screens they're presented. 
After users tested the prototype, they provided feedback in which I applied additional iterations. They reminded me of the value of providing users with an undo feature.  

Many users also suggested decreasing the amount of blank space and increasing the element size. Both iterations were completed in the final step of creating On Your Way.

Testing

•  Based on feedback from user testing, many screens were shortened so as to avoid scrolling

•  Blank space was removed to increase the size of large elements such as photos and buttons.

•  Additionally, back buttons were made more prevalent across the platform to allow users the undo feature they had requested.

•  A few additional changes were made to ensure accessibility and to ensure that users were aware of what was an active state on the screen.

STEP SIX - CONCLUSION

If time and money were no object, I would continue my work on On Your Way and further the brand by adding additional features as listed in the Feature Roadmap. I would love to work with vendors, travel agents, and destination hot spots to provide users with deals and discounts they couldn't find anywhere else. 

On Your Way is a product for users looking to travel on a budget. Adding a feature that allows users to create and manage their vacation budget would be a top priority for the next step in this project.

If I were to start this project again from scratch, I would create additional low-fidelity wireframes for non-priority screens to present to stakeholders as a way of showing the potential of the project. 
linkedin facebook pinterest youtube rss twitter instagram facebook-blank rss-blank linkedin-blank pinterest youtube twitter instagram