Commuti App
Spring 2025
Planning a commute can be stressful, especially when there are many factors to consider such as traffic, travel time, and best mode of transportation as well as one’s budget and comfort level with varying transportation methods. Busy commuters need to make the most of their time and find the best option for their needs. They may benefit from a community of commuters to share experiences and information.
Commuting looks and means something different for everyone, so my goal is to optimize the app for all kinds of transportation methods (driving on own, uber, public/university transportation, biking, walking) and to create a community of commuters within the app.
Research & Benchmarking
App Audience:
People who want a way to plan out their commute and be more productive with their time, people who may be trying a different transportation method for the first time, and people who want to find community within the challenging commute experience.
Waze:
Community reports
Information on accidents and road hazards
Intuitive iconography
Citymapper:
Intuitive iconography
Precise timetables
Good route planning based on transportation method (notably for cycling)
Uber:
Now has public transit availability and ticket purchase options on the site
Teen account capability and safety features
Komoot:
Easy planning for bike routes
Community and social features for users to connect and share
Personas & User Flows
Emil’s Pain Points:
Emil has a hard time remembering route directions and finds many navigation apps to be overwhelming.
Emil is afraid of missing out on finding a community in college.
Dahlia’s Pain Points:
Dahlia is new to the area and does not know her way around.
Dahlia is already stressed because of her new job and recently moving, she feels like she does not have as much time to relax.
Emil’s User Journey
Dahlia’s User Journey
App Wireframing
I incorporated combinations of different information architecture structures commonly used for mobile apps that I believed suited my user flow.
Tabular: Navigation bar allows user to tab from page to page.
Nested Doll: Back buttons in the “Plan a Commute” and “Commute Details” pages are part of a linear progression, with the two pages serving as an index.
Paper Prototypes
Some feedback I received on my paper prototypes was about adding the ability to tab between viewing hazards and social posts on the Community page. The ability to be able to edit commutes on the Calendar page will make it easier for users to quickly access that option rather than going back to the My Commutes page. A cost section about the user’s data regarding how much energy they saved could also be added to the Commute Details tab for a “feel-good” aspect of the app.
Mid-Fi Digital Wireframes
Visual Exploration & Style Guide
The emotions I wanted my app to evoke were the feelings of a Productive, Organized, and Comfortable commute routine.
I wanted the majority of my color system to be a neutral and sleek gray so the screens are not overwhelmed by color. The use of primary colors (red, blue, yellow, and the addition of green) would primarily be used in the Calendar page to differentiate the kind of commute (driving on your own, biking, public transportation, and walking).
