Packflow

A packing system with an emphasis on relieving pre-travel stress.

Overview

Problem

Most Americans have real difficulty packing and a majority put it off until the last minute. Americans voted packing as more stressful than actually traveling.¹ Many apps and websites have attempted to make packing easier, but recent data suggests that most travelers still struggle with packing.

¹ SWNS, https://bit.ly/37OWqSt

Solution

​​After researching, exploring solutions, testing, and reiterating, I crafted a solution: a mobile application for frequent travelers to create packing systems that work for them for every type of trip.

My Role

UI/UX Designer, Researcher, Usability Tester

Tools

Sketch, Marvel, Figma, Miro, Coolors, Google Forms, Google Docs, Procreate, Zoom

Process

My process was to utilize the core stages of design thinking: Empathize, Define, Ideate, Prototype, Test. I reiterated this process as needed.


Empathize

First and foremost, I wanted to empathize with users. In order to do this, it was essential for me to learn about their pain points. I conducted primary and secondary research to do this.

Secondary Research

According to my secondary research, the pre-travel process and in particular, packing, is a major stressor among the target market. 51% of people would give up alcohol for a month or social media for a week to NOT have to pack.² 37% of US vacationers have cancelled or delayed their trip due to travel stress.² 65% of Americans admit to having real difficulty when it comes to packing for a trip. ³ ² SWNS, https://bit.ly/37OWqSt ³ Wyndham Vacation Rentals Data via Travel Agent Central, https://bit.ly/2Lji1uA

Primary Research

In order to gain first hand experience to learn about the problem space, I conducted interviews with the potential users. First, I recruited users through a Screener Survey I created via Google Forms.

After collecting 60+ responses to the screener survey, I narrowed it down to 5 potential users to interview who fit into the following demographics:

  • Users aged 25-40

  • Travel by airplane regularly (4+ times a year)

  • Pack their own suitcase


Affinity Mapping

After conducting interviews, I wanted to take a look at the overlapping information from the each person. I synthesized the key information into the affinity map below.


Empathy Mapping

To better understand the users' pain points, goals, feelings, thoughts, and behaviors, I created two empathy maps. My goal for my empathy mapping was to bridge the gap between creating personas for the app with the problems the target market faced.



Personas

Creating two empathy maps from my original affinity map gave me two distinct users to build personas from. Below, I have crafted two distinct personas for Packflow to help me answer the question: "Who am I designing this product for?"

Refining the Problem Statement​

After my research and deep-dive discovery into the potential users of Packflow, I wanted to make sure I was clearly articulating the problem(s) I was trying to solve. I framed these problems in 4 "How Might We..." statements before I went into brainstorming a solution.

  • How might we destress the packing process?

  • How might we teach travelers to pack more effectively?

  • How might we reduce the amount of things travelers forget when packing?

  • How might we help travelers prepare for the weather at their destination?

Design

Brainstorming

My next phase of this project was to brainstorm solutions to the problem based on my research and How We Might Problem Statements.


User Stories

To prioritize features by needs of the users, I crafted and narrowed down user stories. First, I outlined my initial user story concepts then I prioritized 5 for the MVP.


User Stories
Prioritized User Stories




User Flows

After I had prioritized the user stories, I crafted the essential routes - or red routes - that users might take to achieve the key goals of the app.

Sketching

Sketching was the next part of my process to quickly get my ideas down before creating an in-depth prototype. My goal was to be able to get a low-fidelity version of my ideas down so I could test them first. I took my red routes and created the following screens for testing.

Guerilla Usability Testing

To get initial feedback on my ideas, I employed the method of Guerilla Usability Testing. My goal was to quickly learn what users liked, disliked, and struggled with in order to further my ideas.

Because of COVID, I was unable to do the guerrilla usability test in a cafe or somewhere public, so I conducted the test with 5 friends and family members who were a part of the target market. I created a prototype on Marvel for this test from my sketches. You can view the prototype here.

Findings and Recommendations

  1. Tasks Flow: I needed to explain more clearly if they should ‘Create an Account’ or if they were a "Returning User".

  2. Testing Script: I could have worded my questions a bit more clearly in general.

  3. The Idea was Easy to Understand: Participants did understand the purpose of the app without me having to tell them. I think the simplicity of the set up helped with understanding what the app was for.

  4. Back button: Seeing users go through the flow of these sketches made me realize I did not implement a way for users to go back to the previous page.

  5. Tutorial for first time users: I want to make sure there is a tutorial that can be walked through the first time a user creates an account on the app.


Wireframes & Wireflows

After implementing the changes to my idea based on the Guerilla Usability testing, I took my design ideas further. I created a wireframe of the app and then made it into a wireflow. My goal was to see how the elements interacted without diving into the design, color, typography, etc.


Brand Platform

Crafting a visual style that would resonate with users was my next step in the process. Creating a style and visual language to guide my prototype was essential.


Company Name: I chose the name "Packflow" for the platform because I wanted to convey packing and a sense of having a system with packing.


Mission/Vision: Packing should be the least stressful part of travel. We provide tools that make it easy to prepare for travel and concentrate on the trip. I chose this mission/vision because I wanted this company to help take the stress out of packing so travelers could focus more on the destination than the prep they needed to do to get there.


Brand Personality: Packflow goes beyond travel as it helps relieve stress and makes a real difference in people’s lives. Showcasing a lighthearted and fun filled travel experience is essential. It’s important the brand creates less stress in the user’s lives and not just improve the travel experience.


Brand Attributes: Reliable, stress-reducing, effortless. Traveling can be overwhelming. Creating a reliable system for travelers to use will be stress-reducing and will help them achieve an effortless pre-travel experience.


Logo: Crafting a logo that embodied the brand personality and brand attributes saw me working through a lot of iterations. I knew I wanted something that embodied packing, travel, and a streamlined process.

Color Palette: The goal for the color palette was to find colors that oozed streamlined travel. I went with shades of blue and green to compliment this sentiment.

Typography: When looking at fonts to compliment the logo design, I wanted to make sure I chose fonts that were easy to read, accessible, and inclusive.

Imagery: Selecting images that complimented Packflow's branding was essential in making sure there was a cohesive end product. I wanted to ensure I found images that reinforced the brand's personality and create a connection with the users. As such, finding images that felt like an effortless travel experience were essential.

Iconography: One of the most important parts of creating an inclusive, accessible experience was creating intuitive, easy to understand icons for users. Although I did not need many icons, I wanted to be sure the ones used in the Packflow app were streamlined.


Prototype


High Fidelity Mockups

Creating a fleshed out version of the app after establishing the style guide was the next step in my process. My goal was to create an engaging, accessible, and inclusive design that solved the user problems. To create the best user experience possible, there were multiple iterations of the high fidelity mockups. ​ Version 1: The first iteration of Packflow was all about getting the color scheme, flow and ideas down. I also experimented with a colored background versus a plain white background.

Version 2: I wanted to create a more cohesive, streamlined look and feel to the app. Getting rid of the yellow and playing with negative space and gradients made the app feel more branded. Version 2 had many different iterations within it before landing on the final version of 2.

Version 3: The final version of Packflow was born after usability testing, mentor review, and hiring manager reviews. The final prototype complete with animations is viewable here.



Testing

Throughout each version of the high fidelity prototype, I employed user testing to get feedback. I wanted to figure out what would work and what needed improvement in my designs. Some of the feedback was more casual in nature from mentors and colleagues, but two official rounds of Usability Testing were employed. ​ Testing was executed to find usability issues in the UI and UX of the app. I recruited 5 individuals in the target market through a social media callout. By conducting moderated remote usability tests, I wanted to discover:

  • Can users add a Master Packing List?

  • Can users add a Trip?

  • Can users add a new Master Packing List?

  • How do users respond to the flow of the UI?

Through testing, I found a few issues which I solved in the latest version of the app.

Usability Testing - Round 1 Findings & Recommendations

Issue #1: Language Consistency

There was some confusion with the label “Master Packing Lists” and “Packing Lists”. It was apparent that the renaming of Master Packing Lists and Packing Lists could lead to a less confusing user experience. I would like to explore renaming Master Packing Lists so that it signifies more of what it was originally supposed to be - your core essentials you take on every trip no matter where you are going. e.g. glasses, toothbrush, phone cord etc. Issue #2: Add a Trip Flow There were some hang ups with the user flow of Add a Trip. When users got to the question if they should use the Master Packing List or not, the question was, “What type of trip is it? How would I know what type of Packing List to use?” The flow of adding a trip can be improved by adding in a way to determine what type of trip it is from the get go: for leisure or for work. Issue #3: Weather Users said they could not determine what to pack if they did not know what the weather would be like where they were going. Adding in an option in the flow of “Add a Trip” to view the weather of the location they are going to before they edit the Master Packing List or add a new Packing List would be helpful in the packing process. Issue #4: Tweaking Packing Lists Users said that even if they used the Master Packing List for a Trip, they would still like to tweak it for that trip. Building out a way to edit the Master Packing List for the specific Trip after they have answered “yes” to the “Use Master Packing List for trip?” question would help solve this issue.

Usability Testing - Round 2 Findings & Recommendations

The next round of Usability Tests were centered around these tweaks and had the same tasks. I recruited 5 individuals in the target market through a social media callout. By conducting these tests, I found minor issues including font tweaks that may need to be made, language considerations, and future ideas to add to the app.

Reflections and Next Steps

Working on this project, tweaking it to many variations, and testing it with different users helped me grow the concept of the app tremendously. Users didn't have a lot of issues with my final prototype but did have suggestions on how to further the idea of the app. If I were to further the app, there are some ideas I would explore including:

  • A way to say what type of trip the packing list was for - personal or work

  • A better flow of editing the packing list

  • A way to sync activity confirmations from e-mail to the packing lists to ensure essentials for specific activities are not forgotten

  • A notes section for each packing list