The Midwest Metro is an accessible public transit app for everyday riders to obtain important information about their ride.
Challenge
A Midwest City recently expanded bus routes and developed a way to know how far away each bus is from a stop, but they aren't sure how to share that information with riders. The expansion of routes has caused frustration and confusion for riders especially at stops where multiple buses share a route, because they do not know which buses are approaching, nor have immediate access to arrival and departure schedules. Riders find themselves rushing for wrong bus as several buses share similar routes. The goal is to be able to provide accurate information to riders so that they know when their bus is arriving and how much time they have to get to the bus stop.
Outcome
With the Midwest Metro app riders are able to find out live details about their scheduled bus arrival time and its distance from a stop. Improving the experience of riding public transit by having access to reliable public transit information. The app also allows riders to save routes and stops creating shortcut access to their preferred or most frequented trips without having to input details repeatedly. The app was successfully tested to meet usability requirements for individuals with all levels of tech-competency, making easy and accessible to use.
Audience
Bus riders, city locals, public transit organization
Role
UX Research, UX Design, UI Design
Process
In order to come up with an MVP, I used the double diamond approach to discover, define, develop and deliver. This helped me keep the project in scope by organizing and prioritizing the tasks that needed to be completed to delivery a successful product.
Competitive Analysis
A competitive analysis was performed with three other transit apps in the market that already have a high user base to highlight SWOT.
User Surveys and Interviews
Surveys helped me learn about riders, their daily routines, the need for reliable public transit and the importance of up-to-date information regarding their bus schedules.
Interviews allowed for follow up questions to determine tech learnability in users who are not tech savvy. During the interviews, I was able to ask for more in-depth information about riders experience with public transit and how unreliable information affects them. They also had the opportunity to share their suggestions for improving public transit with small but impactful changes.
Collecting data directly from riders provided me with great detail of the most frequent pain points and motivators for users. I was able to follow up on trends that stood out like the inaccuracy of arrival times and how delays or early departures can derail their commute. Riders most impacted were those transferring between buses/trains, accounting for 60% of survey participants. Some riders expressed their motivator for riding public transit, in big cities, is the cost efficiency compared to other transportation options. Riding public transit helps them get to and from work and/or school, or accomplish their daily tasks without breaking the bank or requiring them to sit in traffic for hours on end.
Personas
User Stories
After reviewing the riders pain points and motivators I compiled a list of user stories that would support the MVP. Out of all the potential user stories, I selected the following three that prioritize the greatest needs for riders.
“ As a Bus Rider, I want to know when the bus is arriving, so that I can calculate how much time I have to get to the bus stop. ”
“ As a Bus Rider, I want to know when the bus is arriving, so that I can calculate how much time I have to get to the bus stop. ”
“ As a Bus Rider, I want to know when the bus is arriving, so that I can calculate how much time I have to get to the bus stop. ”
User Flow
In correspondence to my user stories, I created a user flow that reflects the process for viewing arrival schedules and bus routes.
Sketches
Simple design made up of recognizable elements such as: search bar, map, list of alerts and tabs. Creating sketches allowed me to figure out the general landscape, brainstorm the user flow and consider the elements necessary to accomplish a task such as buttons, links, shortcuts and information display.
Digital wire-frames
The wire-frames contain elements that are important to building a simple and intuitive app based on the sketches previously presented. Creating a digital version of the wireframes allowed me to emphasize on the visual aspects such as spacing, clear layout, ease of use and familiarity.
After the general layout was completed, I created another iteration with more detailed screens containing page titles and relevant text that would eventually become the lofi-prototype.
First Iteration
Minimal design with no helpful information displayed. It does not reflect the purpose of the app. The status bar on the top is not formatted to fit the device.
Second Iteration
Spacing between elements is improved to be better on the eye. Relevant text information is displayed to reflect app functions, status bar is fixed and navigation buttons are available.
Lofi prototype
This iteration contains text and functions necessary to perform usability testing to collect user feedback. It is a more detailed version too the second iteration because it has proper page titles, navigation buttons (exit, back, search) and displays bus schedule information.
Usability Testing
During usability testing users were asked to perform a number of tasks to accomplish three goals: locate bus stop, access real-time notifications and view bus schedule.
Task 1: Where would you click to find information about a stop?
Task 2: How can you access notifications about route changes?
Task 3: How can you find out what time bus M15 will arrive at Washington & State?
Findings
100% of users naturally followed flow of the app without direction because they are familiar with other navigation apps.
Users expressed that shortcuts to helped achieve task with less clicks.
Saving bus routes is a convenient feature that allows them to see instant results that are specific to them.
Simple design removes the stress of navigating the app especially when rushing to catch a bus and supports learnability for a variety of users.
Final Prototype
This iteration contains all the changes from the feedback that was received during usability testing and UI design. It is a more detailed version containing splash page, registration, informational graphics and destination details. It also highlights tab open so users know where they are in the app.
Takeaways
I learned to keep the process and design simple in order to focus on functionality.
The process of collecting and implementing feedback is important to deliver a quality product that enhances user experience.
Iteration is key to a successful design meaning that as UXUI designers we cannot get attached to a certain developments especially if they do not benefit the product/user.