Waypointer
An Android app recommending routes to travelers' activities and providing transit tips and guidance.
Time Frame
48 hours
October 2022
Task Background
For a 48-hour hackathon, fully designed a mobile app for travelers on a solo "team," with all steps executed by myself, including researching the needs of travelers and engaging in several rounds of testing.
Deliverables
-
High-fidelity prototype
-
Design process documentation
My Primary Roles
-
User Researcher
-
Prototype Designer
(All Stages) -
Usability Tester
-
Documentation Compiler
Project Overview
Know where you're going before you go with an app that focuses on finding the best ways to get between your plans.
Site Features
Trip Itinerary | Route Planner | Route Recommendations
City Transit Advice & Information
What Travelers Want
As a seasoned traveler, the UX Scene Hackathon prompt to “design a mobile experience for travelers” quickly spurred some ideas. Immediately, I recalled the occasions on vacation when I would sit around waiting for an event, and I’d wished I’d had places to hang out before then. So I started sketching out designs and delved into research with the following:
How might we help travelers organize their plans, navigate between their different destinations, and kill time in between?
User Research
The original idea in my mind was to allow users to find things to do near their destination and navigate into the area, allowing them to explore before and/or after their activities. As much as I abide by the philosophy that I should design things I’d want to see, though, in the short scope of a 48-hour hackathon, it was more important to me as a UX designer (and a sociology undergrad) to ensure that I was building a focused app for a real audience.
In setting up a survey about the topic, I broadened my breadth of questions to include traveling and activity planning so that I could have a more fleshed-out perspective on the topic. The survey asked about how many tourist destinations they’d visited, downtime activities, and how they generally traveled between their planned activities.
The results quickly challenged my perspective: people’s frustrations existed more in travel than in their destination. It turns out that I’m likely just effective at researching travel, and so I arrive at my destinations early, with plenty of time to kill. Others don’t quite have that same conundrum, as in new destinations, travelers were overwhelmed by options, and they opted for ride sharing, often the most expensive, out of frustration and confusion. They rarely even had issues finding something to do upon arrival.
With detailed responses from survey recipients, I crafted out a quick and rough Persona and User Journey to help keep my survey participants in mind:
I emerged from this step with a final problem statement:
How might we help travelers and tourists navigate their destinations in order to reach their planned activities on time while giving them as much information as possible about their transit, destination, and local resources?
A Design Journey
The app was given the preliminary name “Waypointer” with the initial goal in mind, but it remained viable as I repurposed the project, so I kept it. I imagined the app as a place to find sanctuaries on long journeys, though, again, the new project goal meant that I could keep many of its design fundamentals.
I’d begun to brainstorm ideas while survey results came in, as I’d preferred to narrow things down based on need and practicality, then bring in other ideas if time permitted.
Once research was over, that narrowing down of features did happen, and I focused on the following principles to stay on track:
-
Prioritize the unfamiliar traveler
-
Inform decision-making
-
Inspire explorative transport
In short, the app would let travelers/tourists tap into a destination’s wealth of transportation options, from subways to rideshares, if that’s what they opted for. They could search these options in advance by putting in their itinerary for the day, encouraging them to arrive at their destination with ample time by whatever means they wanted.
It was important to go into app-building and prototyping with all the required information conveyed well, so I did a few rounds of "low-fidelity" design sketching of major app pages on paper.
On the subject of design, as testing results came in, I had the chance to execute a visual design guide, opting for complementary “seafoam green” and “sandy brown” colors to represent classic sea travel themes. However, I wouldn’t opt for colors alone; these would complement shapes and icons, which were more clear, relatively universal markers for information and pages.
Trails to Trials
While sketching is always fun, prototypes would allow me to test and improve upon the UI concepts. The Figma build went through three rounds of design: mid-fidelity, early-prototype high-fidelity, and a final high-fidelity. The app has the following features throughout all stages:
-
Itinerary builder, including transit
-
Live transport suggestions & selections
-
Local transportation option tips
Testing involved using these features on the mid-fidelity and first high-fidelity apps The early-prototype high-fidelity’s flaws were largely in visual design cues, and I brainstormed ways to solve these. Despite extensive opportunities for my users to expand on their frustrations, though, I was still at a loss in regards to solutions for certain tests not doing so well, as Maze scored my overall testing at 42 points (which may be the meaning of life, but not a pathway to success).
Once the major design tweaks and testing recommendations were implemented, I put the new prototype through another round of testing. While Maze tested it better at 60 points, I finally was able to narrow down older frustrations: users drifted towards the hamburger menu for tasks that weren’t available in them, as well as towards prompts like “Edit trip” instead of provided, standard “new item” buttons on the page. The final design would allow more smooth access to features via these avenues.
Reflecting on the Voyage
As a “solo team” for this hackathon, I’m proud of what I emerged with. Waypointer is an app with features I know I’d personally be excited to have on-hand, based on a strong research stage and well-executed testing on a strong Figma prototype. I took a less focused concept and narrowed it down to a simple, usable, and desirable set of tasks.
Along those lines, this hackathon felt like an opportunity to find where my strengths and weaknesses lie, and I feel like I improved on both and have a foundation to grow further upon. I love the process of learning by doing, and I’m grateful for the opportunity to do so.
Mobile Prototype
Full Case Study via Figma
This is a paragraph where you can add any information you want to share with website visitors. Click here to edit the text, change the font and make it your own.
This Figjam version of a case study was submitted as part of the Hackathon deliverables.
If you'd like, you can also view this as a PDF file:
Team/Workplace
-
User outreach
-
Task prioritization
-
Time management
-
Report drafting
-
Storytelling
Design
-
User research & synthesis
-
Personas & user journeys
-
Design studio/sketching (paper)
-
Iterative design
-
Mockup design
-
Style guide formation
-
Prototype construction
(mid- and high-fidelity) -
User testing & analysis
Tools
-
Figma
-
Google Drive Suite
-
Discord