A metropolitan transit app for
at-a-glance clarity while on the go.
Client
Transportation Agency
Duration
4-Week Design Sprint
Roles
Researcher, UX/UI Design
Tools
Figma . Adobe Illustrator . Google Forms . Figjam . Adobe Photoshop
Brief
Certain stops in the city have many different routes running through them, so riders needed a simple way to distinguish between them.
Ensure that any rider can tell when each of the buses arrives at the Washington & State bus stop.
Ensure that all riders can tell how much time they have to get to the Washington & State bus stop before the bus they need arrives at that stop.
Allow riders to select one of seven bus lines to see a list of their future arrival times at the Washington & State bus stop.
Business Requirements
Discover
Beginning with market research of three popular transit apps and a S.W.O.T. analysis was a crucial launching point to understanding the product and how users are already interacting with existing mental models.
These initial findings helped formulate questions for my user survey and subsequent user interviews.
By synthesizing the data gathered from the above methodologies I created a couple of user personas and a journey map. These personas and the journey map became the foundation for building the user flows and site map for this project.
Research
S.W.O.T.
Well organized information
Detailed route information
Multiple features beyond project MVP
Strengths
Flawed notification system of when to leave for the next bus
Steps listed are long and confusing
Hard to find different bus lines
Weakness
Reduce the number of steps it takes to get to basic information
Show clear times of when the bus
will come while
on-the-go
Provide information with no ads or clutter
Opportunities
Other apps already have wide adoption with robust customer loyalty
Other apps offer additional features
One top app that covers more than just transit
Threats
User Survey
How far in advance do you plan your trip?
45.8% responded 30 minutes or less
The primary reason for taking the bus?
59.4% take the bus for leisure / travel
Favorite thing about current transit app?
29.2% Trip Planning
29.2% Ease of Use
When the bus is late my stress level is...
50% responded with medium to high stress
User Interviews
Conducting interviews allowed me to deepen my understanding of the topic through the qualitative lens of the bus rider. These interviews helped me with more nuanced experiences that my surveys did not capture.
The people I interviewed were recruited through my survey and were from a wide demographic.
“It would be fun to ride the bus to explore the city, but the buses are so crowded it wouldn’t be enjoyable.”
Taylor - 45 - Salt Lake City, Utah
"Bus schedules are frustrating to use because of the number of departure times."
Christine - 38 - Austin, Texas
“It’s the worst when you arrive at the transfer stop and watch the bus you need drive right on by.”
Michael - 34 - New York, New York
“I wish the transit app would show the maximum amount of time for the trip as a whole.”
Bailey - 26 - Saskatchewan, Canada
Define
Over 50% of my survey respondents identified as a female between the ages of 35-45. 50% of the survey respondents took the bus for commuting to work.
45% of the survey respondents planned a bus ride in 30 minutes or less while 63% lived in the city. This data coupled with the information received from the user interviews helped create my primary persona.
Persona Development
User Journey
Loretta’s user journey is one of expectation, frustration, and confusion. She expects and smooth bus riding experience but is met with anxiety and annoyance. Her journey was designed based on what I learned from my user surveys and interviews.
User Stories
“As a bus rider, I want to know when to leave for the bus, so that I can calculate how much time it will take me to get to the bus stop.”
“As a bus rider, I want to know various arrival times, so that I can make a decision about what bus I want to take.”
“As a bus rider, I want to find my bus line easily, so that I am not confused about which bus is mine.”
User Flow
Find a bus line arrival time and activate a ride.
Sketches
I began sketching with the user flow in mind. My main purpose was to rough-out fast navigation and simple information hierarchy.
Wireframes (User Tested)
My sketching led me to design a one-handed navigation wheel at the bottom of the viewport which was well received in user testing, but there was confusion as to which bus line was which. The initial bus stop and bus line screens respectively were tested to be too confusing and too cluttered. There was too much to look at.
User Feedback
Wireframes (Iteration)
After testing the first set of wireframes;
I simplified it. The navigation wheel became the location for saved favorites that were revealed when needed. The bus line and bus stop buttons were clearly labeled and were given prominent placement. I also cleaned up their respective screens.
Style Guide
I wanted the branding to have a metro-architectural vibe. The majority of my research respondents were located in the city and it made sense to reflect on their environment.
I pulled a color palette from the single image pictured below which informed the style guide for the project.
The colors are cool and subtle with a pop of gold. This gave the app a refined sophisticated nuance that resonated with my users.
Name & Logo Development
In my preliminary wireframe development, I chose a placeholder name, "Ride On" this had a colloquial, casual tone with words like, "get me outta here" and "Let's ride!".
But, in user testing, the branding and copy were too confusing and the slang detracted from the ease of use and simplicity my users were seeking. After exploring various names I landed on ABOARD.
Aboard was a name that was inviting yet firm. The logo materialized when I deconstructed a letter A from the Italiana typeface used as a header throughout the app.
What I learned
Designing experiences for others takes so much more empathy than I ever imagined. I appreciate the user tests most of all because they gave real-time feedback on what was working and what still needed to be iterated upon. These small changes impact the overall usability of the product in profound ways and the results are immediate.
If I had more time, I would test a broader demographic. I would like to see how an aging-in-place demographic tests with the solution I came up with and iterate based on the feedback of an older population.
