Project Background
With cheap flights on the rise, traveling is becoming more and more accessible to people. 20% of all travelers are Millennials, and they take an average of 7.4 trips per year. And with the increase in travel, one thing that hasn’t been automated for the traveler is packing. That poses an issue since 65% of Americans admit to having real difficulty when it comes to packing for a trip. Seeing as packing is a necessary task before traveling, how can we as designers streamline the process to make it more stress-free and efficient for the modern-day traveler?
Role:
UX Researcher, UX Designer, UI Designer
Tools:
Figma
Deliverables:
Research plan, Sketches, Wireframes, High-fidelity prototype, User testing report
How might we reduce stress and make packing easier for travelers?
For those traveling for leisure, traveling should be a fun and exciting experience, however, 37% of travelers have delayed or canceled a trip due to the stress of planning. In addition, 67% of travelers say not procrastinating on packing would minimize stress.
Research
User surveys
User surveys were integral to understanding the actual pain points of frequent leisure/business travelers. I created a survey and conducted interviews among friends, family, and other UX bootcamp students who traveled infrequently (0-1 times a year) to often (5+ times a year).
Qualitative interviews
My target audience was millennials who traveled solo and in groups, either with friends or family. Through user interviews, I sought to understand users’ challenges and pain points that came with preparing for and packing for a trip. This would later help me shape the backbone and give me the ‘why’ to design WanderList.
Identifying Opportunity
Competitive Analysis
Identifying competitors in the same space helped me find opportunities while designing for WanderList; what features were missing that users wanted? I downloaded and used 3 different packing apps: PackKing, PackTeo, and PackPoint.
Insights
After collecting information from user interviews and competitive analysis, I gained qualitative and quantitative insights. I better understood user expectations, motivations, needs, and behaviors. These insights helped shape the MVP for WanderList.
Preparation: Users had to complete multiple steps before they could even start packing; they needed to do laundry, look up the weather in their destination, and maybe even research what special items they may need to bring depending on their activity and destination.
Situational: Travelers don’t use the same checklist when traveling because the destination, activity, and duration of their stay can alter their checklist.
Specificity: Users have a specific item in mind when they are creating a checklist or packing. They don’t want just a shirt, they want “the green shirt sitting in the laundry basket.”
![Capstone Presentation [Ayana Ngo].png](https://images.squarespace-cdn.com/content/v1/60ff75e8dbf8434bedac625d/1627686301481-ISSA9BQEL4GMSPSEPO7R/Capstone+Presentation+%5BAyana+Ngo%5D.png)
Personas
I created 2 personas as a cumulative representation of all the common user goals, needs, and pain points acquired from user interviews, surveys, and research.
The 2 personas were divided into 2 archetypes: Family Planner and Adventurous Traveler
Ideation
Sketching
For the MVP, the user needs to be able to create, edit, and delete a checklist. On the backend, WanderList needed the destination, duration, and dates of travel to provide a personalized checklist. I focused on 2 key principles to create an intuitive experience: personalization and accessibility. Since many travelers go on trips in groups, I wanted to add a collaborative aspect to the checklists and create a ‘group checklist’ option.
Guerilla User Testing
I conducted guerilla user testing with 5 users, ages ranging from 28-34. By conducting more in-depth and time-consuming user research and learning from feedback, I iterated on my designs to make the UI more intuitive and helpful. Here are some key findings from my first round of user testing:
Picking Checklists
One user mentioned the confusion between creating a group and individual checklist when he thought he was creating a group and individual trip.
Iteration: I made a clear distinction that creating a trip is different from creating a checklist with the “Congratulations” prompt.
Before
After
Activities Page
Many users were unsure if this screen was meant as a suggested activity screen or if this was where they’d input activities they’d participate in on their trip.
Iteration: I added a prompt so users know to pick activities they’d be participating in.
Before
After
Checklist Page
The pencil icon was to notify the user that the checklist name (in the heading location) was editable, but almost every user believed the pencil icon was to edit the actual checklist itself.
The share button was also confusing for Apple users since this was mostly used for Android apps.
Iteration: I removed the pencil icon entirely and instead gave the ability to edit the checklist name just by clicking on it, a feature recognized in other apps.
I also changed the share button to something seen more universally between both OS.
Before
After
Branding/Style Guide
Users mentioned in interviews how stressful and time consuming packing was so it was important to me that WanderList gave a calming and clean presence. I chose sky blue as my primary color and a soft salmon color as my secondary as a soft and playful palette.
WanderList’s brand personality is meant to feel like the partner you want to travel with; they’re comforting, helpful, and there for you to make a chore a more pleasing experience.
Icons
The icons chosen were more rounded to prevent any harsh lines. This added to the bubbliness and playfulness of the brand’s personality
Iterating Designs
Prototyping with Target
Audience
I conducted 2 rounds of user testing with 5 friends and other UX students who were self-proclaimed avid travelers. I focused on enhancing features users would interact with most. Here are some changes I made based on their feedback.
Checklist Page
One user experienced cognitive overload on this page and said “I don’t know where to look at first, my eyes just jump around.” There was no clear point of focus for the user.
Iteration: I decided to blur the background and highlight the instructions and icons I wanted the user to focus on.
I also rounded the corners of the tutorial making it more friendly and bubbly.
Before
After
Activities Page
Since the first change in the activities page, users now know to pick out activities they’ll be participating in. The next question was: why? Users had no idea what choosing the activities would do; would WanderList give recommendations based on what they picked?
Iteration: I added a prompt to tell users directly what choosing an activity would do.
Before
After
Checklist Page: Changes Saved Button
2 users missed the “Changes saved” alert that popped up for a few seconds after editing the checklist.
Iteration: I decided to move the alert location to the bottom, increased its height, and changed the color of the alert. The alert is more noticeable and looks less like a button.
Before
After
Reflection
As a frequent traveler myself, this was a really fun project for me to work on since I could see myself using a product like this. With that being said, I felt it was more challenging to keep my bias checked as I was interviewing and doing user testing. I constantly needed to remind myself that I am not my user so I could accurately gather data. Some other lessons I learned were:
Reduce clutter where you can
Finding a balance to give your user the information they need without overwhelming them can be challenging. If I were to continue iterating on my design, I would reduce the number of menu icons in the checklist UI of WanderList. This way they aren’t fatigued by the number of choices and can focus on what they really need.
Test early and test often
Receiving feedback early in my process helped me set a foundation for the core of my app. Suggestions and feedback from my users set the direction in which WanderList was going to go, making my process less ambiguous.
Listen, don’t defend
I had the impulse to explain why I made certain design decisions but ultimately realized the user doesn’t care (for a good reason!). The user wants a seamless app experience and as a UX designer, I should be focused on listening and iterating based on the feedback to get one step closer to a better UX.