A travel tool for all.
INTRODUCTION
My Role
Solo student project for DesignLab UX/UI Bootcamp
Timeline
148 Hours
Problem
Between bookings, creating an itinerary, and keeping track of reservations, there's too much headache that comes with travel planning. So how can we reduce the time and effort spent planning?
Goal
A mobile app that works as an all emcompassing travel tool made friendly for veteran globetrotters, novice wanderers, and everyone in between. With features designed to assist with booking and managing reservations, building and itinerary, and budgeting travel plans.
RESEARCH
User Interviews
To understand the challenges of planning a trip and what features that users may need to eliminate frustrations when traveling, I conducted user interviews. Because the app is meant to be friendly to travelers from all walks of life, participants were recruited from various backgrounds such as younger students to mature professionals.
After conducting interviews, I found that pain points between participants remained quite consistent. This includes:
Tedious itinerary building on Excel
Going over budget whilst traveling
Requiring multiple travel tools that extend the duration of planning
Competitive Analysis
To become familiar with the current market and have a better understanding of what the current market has to offer, I analyzed four popular technologies surrounding this goal. I compiled the competitor’s background, strengths, weaknesses, opportunities, and threats.
I found that the other competitors did not have a platform where users can make/manage bookings, plan an itinerary, budget, AND review places to explore.
DEFINE
Affinity Mapping
To make better sense of the data I gathered, I used affinity mapping to capture observations that stood out to me. By grouping notes that have similar content, I can synthesize my data through these patterns. This content will be used to make HMW questions, POV statements, and personas.
POV Statements & HMW Questions
Working off my affinity map, I created point-of-view (POV) statements and how might we (HMW) questions to infer and hypothesize user’s needs. These insights have been tailored to the unique scenarios derived from my research and will serve as the foundation for my personas.
Personas
In order to design a product that meets user’s needs, I created personas based on my research findings to represent target users. Personas were referenced throughout the design process to keep the product user focused.
IDEATE
Task Flows
Upon addressing user needs, I devised a set of task flows to help define the necessary wireframes needed for prototyping. These flows provide a linear path for the project’s design to follow.
Key
Wireframes
I designed wireframes from low, mid, to high fidelity. The low fidelity wireframes were done on pen and paper to have room to explore iterations. From there, the mid fidelity wireframes were designed on Figma with personalized icons and a more distinct layout. Throughout the process, flows and personas were referenced consistently to ensure that the design remains user focused. I find wireframing to be what I look forward to most during the design process. Designing a skeleton for my product provides me with clearer visualization of where it may go.
UI Kit
Because this is a travel tool, I wanted a color palette that conveys the beauty found in nature. Seafoam blues of the ocean, viridian trees, and orange hues from sunsets encapsulate the UI to envoke feelings of wanderlust. The icons are hand sketched and vectored on Figma to have a touch of personalization. Typography was carefully chosen to maintain readabilty and cohesiveness with the modern design.
TEST
Usability Testing
Using the prototype feature in Figma, I conducted usability testing on a set of task flows with various participants to gather the following information:
Understand user’s ease of navigation on the app
Detect potential pain points that users may face while using the app
Evaluate time and effort spent completing core tasks
What I found was that generally, the users had little to no trouble completing tasks and detected no major painpoints. Minor details were mentioned in regards to the general UI such as bulky icons, hard to read rating review system, and lacking inporportionate input fields. From what was gathered, I worked on the following solutions:
Restyled icons to appear more seamless with the rest of the UI
Changed rating review system from hearts to the more familiar star shape
Resized input fields and text to look more cohesive with other elements, while mainting readability.
FINAL DESIGN
CONCLUSION
As this is my first UX project, I am grateful to have a better understanding of the entire UX process. The experience of this project taught me a few lessons:
Gather research data from a wide range of users
More user input provides a better understanding of how the design can connect to a wider audience. Friends and family are a good start, but posting online surveys for participants of various backgrounds may prove beneficial for certain projects.
Iterate as much as possible
While designing my low fidelity wireframes, I made over 5 iterations in my sketches to find a skeleton for my project that makes sense. I also iterated my high fidelity wireframes more after running the usability tests and receiving feedback from users. I found myself iterating consistently through the entire process to push for the best app that I could. This kept the design aligned with user needs as well as WCAG standards.
Don’t lose sight of your audience
My definition of design is the skill to bring people and things together. It can be tempting to use your designs as a medium for self expression, but ultimately, the product should address user needs first. Building personas helped me keep the user in mind throughout the entire process, and is a skill that I will keep consistent.