Lets Go
App Concept
A public transit app
Duration
5 weeks
Platform
IOS
Role
UI/UX Designer
Tools
Figma
Overview
I was assigned the task of developing a mobile application for a city's public transportation system. My fictional client is an organization in a mid-sized Midwest city. The city is served by a network of public buses. By creating this application, I was able to provide the city with an efficient and cost-effective way of managing its public transportation network and providing users with the information they demand.
Problem
Prior to this, the city only listed the bus schedule at each stop and on its website. Users were left with a few issues: First, they did not know which bus lines to take unless they were already familiar with the routes and schedules. Second, there was no way of notifying users of delays or service issues occurred. Third, users didn't know how far the bus was from the stop.
Solution
Create an app that addresses user needs. The city implemented a real-time bus tracker, which provides an up-to-date view of bus locations and estimated arrival times, including a GPS feature to guide users to their desired destination by the city's bus. The app also features an alerts page that informs the users of any delays or outages.
Design Process
The first step of this project was to conduct user research to see exactly what users are expecting in a bus application. I began my research by asking friends and family who have used public transit what they expect in a bus app. I then furthered my research by creating a Google survey and posting it on Reddit to gather more feedback. While I was waiting for my results on the survey I began downloading similar apps and examining them, asking myself questions like: What makes this app effective? what makes it bad? How would I fix the issues? what would make my app stand out opposed to theirs?
-
Survey
-
interviews
-
Insight from other apps on the market
Crafting a Persona
I created a persona based on common traits throughout my research
-
Relies on public transportation
-
Time oriented
-
Professional
User flows
The user's experience flow must be carefully designed, not only to guarantee that all required screens are finished, but also to stop users from becoming disoriented in the flow.
.png)
Site Map
Wireframes
Before I started making wireframes in Figma I began sketching some ideas. This was important because Sketching allowed me to visualize the multiple paths I can take before committing to one. Trial and error prevented me from attaching myself to a design and allowed me to iterate as I saw fit.
Low-Fidelity Wireframes
Once I became satisfied with my sketches it was time to get to work on Figma. Before I could worry about the color scheme and information I wanted to construct a base layout.
High-fidelity
Prototype
Not forgetting the original goals of the app, I designed it in mind of user needs. After finalizing my wireframes, I made a mood board to collect font and color ideas. Once I had enough inspiration on my moldboard I finalized my wireframes into my high-fidelity prototype.
Design Changes
After I finished my high-fidelity prototypes I conducted user testing to gather feedback. A similar response was given to me: add more details to the bus lines page in addition to their live location. The color palette was another element that was altered. The current shade of blue was formerly a brighter, more intense shade. I switched to a different shade of blue after realizing that the loud blue and the bold yellow didn't go well together.
Reflection
This was my first project as a UI/UX Designer. The journey was challenging but fun and rewarding. Learning to work with figma was tedious yet worthwhile. Every hour I spent on the program increased my proficiency with the application.
Conducting research was never a big skill of mine but this project helped change that. Conducting user research was a major plus for the development of the app. It helped me gather information on what users expect to have on a bus app. It also helped me understand the way users think. This project helped emphasize the importance of user research and feedback, which in return helped me grow as a designer and researcher.