TRACKER

With real-time information, GPS tracking, electronic ticketing, and a user-friendly interface. Tracker

modernizes the public transportation experience and enhances the overall convenience of riding the bus.

Prototype

My Role

UX Research
UX Design

Tools

Figma
Illustrator
Notion
Prott

Timeline

Research - 1 Week
Design - 1 Week
Testing - 1 Week

Deliverable

Mobile App

Background

With the population of the city of Fort Worth growing every year, demand for public transport has been increasing as well. The increased use of public buses will likely drive demand for public bus mobile apps.

Current public bus mobile apps are often outdated, lack important features, and provide inconsistent or inaccurate information, causing frustration and reducing the overall appeal of public transportation as a mode of travel. This results in a significant obstacle for transit agencies trying to reduce congestion on roads.

"Looking ahead to 2045, the population of Tarrant County is projected to increase by 59%"

-State of the System Report

The Problem

Despite the growing demand for public transportation, many passengers still struggle to access reliable, convenient, and user-friendly public bus services.

The Solution

Provide a user-friendly and feature-rich public bus mobile app to improve the overall passenger experience, increase ridership, and support the growth of sustainable transportation options.

My Process

1. Research

Surveying
Interviews
Competitive Analysis
Task Analysis
Empathy Mapping
User Journey

2. Design

User Flows
Site Maps
Sketching
Low Fidelity Wireframing
High Fidelity Wireframing
Wireflows
Prototypes

3. Usability

Iterative Testing
Results
Feedback

4. Takeaways

Next Steps
Future Product Outlook
Personal Takeaways

Understanding the Problem

I conducted research interviews and surveys with current riders to uncover pain points that they were experiencing with the current bus apps available to them. My research encompassed understanding the user goals, needs and uncovering pain points with the existing user journey.

Survey

Gathering Insights

After collecting the recordings from the user interviews, I conducted affinity mapping to synthesize the pains identified. I grouped these problems under common themes and features in the platform.

Affinity Map

Narrowing down the scope of work

Based on the user interviews and surveying conducted with 20 riders on the current bus apps available for use to the market, we found the following key Pain Points:

47% of riders expressed a need for quick and efficient bus ticket booking feature.

In our research, 75% of riders are frustrated with a lack of reliable live bus tracking features in current apps.

65% of riders expressed frustration with the confusing Interfaces of current apps.

Huncho_Jack_people_creating_a_competitive_analysis_ux_ui_46e4f3f9-30b1-4cb2-aacb-102f2ddf7

Checking the competition

To further construct a concise and solid foundation for Tracker, I looked into the current bus apps available. I evaluated several features and pain points deemed vital from user surveys and identified which ones Tracker could capitalize on compared to other applications.

Competitive Analysis

Understanding the User

To solidify what was important to the rider and get a deeper insight into the rider's lives, I mapped the rider's view and humanized the data.

Mapping the Application

To provide a clear understanding of the relationships between different pages and sections of the app I decided to map out the user's journey.

Sitemap & User Flow

Sketching the Solution

Based on the above paint points identified, I worked towards sketching up some basic wireframes to lay a foundation to the design process and support the mapping I had created earlier.

Sketch

Pushing Pixels

I mocked up low-fidelity wireframes to gather feedback from the users on the overall layout and structure of the application. This involved establishing a standardized visual hierarchy and layout for the Tracker application.

Usability Testing

I conducted usability testing with primary users to validate whether the designs would solve their problems. I wrote a script including a scenario asking the rider to find and book a bus based on their destination. From the testing the following feedback was collected:

"Map is a bit confusing, would like more details on all active buses in the area and what bus stops are currently active."

"Interface is a bit confusing at first, especially when trying to book a bus, after selecting a preferred bus."

"The app seems to be very generic and boring with the same color grade throughout, almost resembles google maps."

Iterated Design

After gaining important feedback that would be vital in redesigning the layout of the Tracker app, I decided to hit the drawing board again, with an iterated draw-up of new sketches and working very closely with the users to make sure all new wireframes were in line with their mentioned needs.

Style Guide

Utilizing a warm and bold gradient of colors in the spectrum, that represents a place of significance in the transport industry felt like perfect fit for Tracker's branding. The main typeface of choice for the app is Open Sams, I felt this typeface best fit the app do to it's extreme versatility through uppercase and lowercase styling, as well as dark and light text fills.

Validating the Design

After multiple iterations and quite an extensive amount of usability tests were conducted, the user's feedback was on track with the vision and it seemed to have answered their major pain points mentioned during the research phase. At this time I decided to put the componets from my design phase together and present a final usuability test to validate my design before the shipment of the deliverable.