Summary
Heartland Midwest Transit Co. is an application designed for a midwest city public transit entity. This application allows users to check, when and where their buses were & provides feedback to users when buses were delayed or unavailable.
Roles & Responsibilities
I was responsible for this project's discovery & research, information architecture, branding, and usability testing.
Problem
This application was deemed necessary after a midwest city public bus system expanded its services. With 7 bus lines now serving their Washington and State stop riders started to :
- have trouble knowing when the bus was coming
- How much time they had to get to the bus
- And when & which incoming buses would arrive at Washington & state
These issues were compounded by an antiquated scheduling system that used posted paper schedules at stops and posting them online.
Audience
I found two audiences for this product:
- Young professionals who use the bus as a means to get to and from work. They don’t have to use the bus but want to in order to avoid traffic, crowded downtown parking, and/or want to reduce their environmental impact.
- Blue collar workers who don’t have access to a vehicle and use the bus as their main form of transportation, these users need the bus to be on time, want to reduce their wait time for the bus, and need to know where the closest stops are to plan their routes around the city.
For the purposes of this project two proto-personas were created based on assumptions about the audience. A final persona was later created after analyzing results from the user surveys.
Solution
I created a mobile application and bus brand that would reignite confidence in the public bus system and allow for a more consistent and reliable experience for bus riders. The app allows users to see when their bus is coming, how long they have to get there, and whether there are delays or schedule changes.
View PrototypeDesign Process
Discovery & Research
Survey
Google forms were utilized to collect data from potential users.
Survey results showed that our potential users:
- Most users were keeping tracked of the bus schedule using materials released from the bus system - I interpreted this mean that there was an opportunity to offers these individuals an application since they weren't already using one.
- Most users would use an application from the city to monitor the bus lines
- A little over half of users were missing their bus due to scheduling differences
- Nearly 60% of users were struggling to tell which bus was theirs
Overall these results confirmed user pain points
Competitive Analysis
As part of our research:
- Conducted competitive SWOT (strengths, weaknesses, opportunities, threats) analysis on 3 applications focused on pantry and recipe management
- These insights were things we kept in mind while developing our application and thinking about what features we might include
Persona
Based on the target audience, I came up with one persona, Christina Wilcox.
- She was created based on survey results that suggested ~63% were 25-45 years old, ~73% were female, the majority of survey participants were white and over half were students or young business professionals.
- The scope of this project called for the creation of one persona - although for the future it would be beneficial to break this persona apart into at least two personas.
Christina Wilcox
Age: 32
Local News Editor - Business Sector
Behaviors & Motivations:
- She uses a transit application to keep track of the buses in her area
- She typically uses bus transit to get to and from work on a daily basis
- She typically arrives about 10 minutes before she expects the bus to arrive
- She occasionally finds it difficult to tell different buses apart when are multiple buses at the stop
- She would use an application from city instead of an outside party if the option were available to her
Goals & Needs:
- Be on time for work
- Reduce her environmental impact
- Avoid traffic headaches
- Avoid parking dilemmas - such as difficulties finding parking/spending money on overpriced parking
- To manage all of her bussing needs in one application
Hesitations & Pain Points:
- She’s frustrated because bus timing isn’t always accurate & the application she currently uses doesn’t have real time updates
- She may hesistate to switch to a new transit app from the city if that app doesn’t receive great reviews
- Its occasionally hard to tell buses apart - but not usually
- Taking a late bus can impact her job
- Right now she can’t really track the bus in real time OR get alerts if traffic or other factors have impacted the bus
Information Architecture
MVP User Stories
The following user stories are based off of the problem statements and how it might affect users like Christina.
As a young business professional, I want to check the bus schedule in real-time so I won't be late for work.
As a busy professional, I want to know when the bus will arrive, so I know how much time I need to walk to my stop.
As a bus rider, I want to know which bus is coming next, so I know which bus to get on.
Site Map
User Flows
These two user flows were my first iterations. After careful consideration of necessary features and flow - I determined that these flows were too complicated.
I updated my user flows to streamline the amount of clicks a user would need in order to achieve tasks and reduced features to stay within the scope of the project.
Wireframe Sketches
All members of our team contributed sketches based on our sitemap. We then discussed sketches as a team and voted on concepts and designs we wanted to move forward.
Digital Wireframes
All members of our team contributed sketches based on our sitemap. We then discussed sketches as a team and voted on concepts and designs we wanted to move forward.
Usability Testing
For our moderated testing, I created a research plan for interviewing users
During our usability testing I asked testers to complete the following tasks:
- Find out when the Washington and State bus will arrive at its next stop?
- What bus will be arriving next at the Washing and State Bus Stop
- Are there any traffic conditions affecting buses right now?
- I tested two adults one age 25-45 and one individual 55-65
- Both are working class individuals
Results
- Error rate: 16% with a 100% ability to correct
- Average number of clicks to complete a task was 3
- User feedback:
There are multiple ways to find what you are looking for and that's good because different people think in different ways but can still find what they're looking for. - Participant
Average User Rating:
4.5 of 5
Next Steps for Improving the App
- Conduct more usability testing to make sure all of the application is helpful to customers
- And then if the feedback is positive I would start discussions with developers to make sure that all elements make sense
- If I had to do this again I would also reconsider branding and titling this project - I believe the name is too long now
- Adding more indicators (scroll bars, underlined icons, etc.) to improve usability
- Adding an accessibility plugin
Brand Development
Typography & Color Pallete
This project didn't call for brand development or any UI.
For the purposes of consistency and accessibility, we did select a palette for presentations along with accessible typography.
All colors are AAA compliant when used with their complementary text which is white for the heart red, black for wheat yellow, and black for the auxiliary colors. The auxiliary
Quicksand is the only font used in this project. Its designed to be accessible on small screens/mobile devices. It has a foundation of geometric shapes to give the impression of friendliness.
There is no font size smaller than 14px in the application. Most text in this project is 16px or above.
Logo Iterations
All members of our team contributed sketches based on our sitemap. We then discussed sketches as a team and voted on concepts and designs we wanted to move forward.
Visual Design Iterations
We made a paper prototype to experiment with new ideas, which allowed us to try out several iterations quickly before committing to a prototype.
This button felt dated and out of line with the other buttons so I adjusted it to an icon.
I changed these buttons to icons based off of feedback from a fellow designer. It helped to make the buttons look more modern.
This part of the app was updated to provide better usability. I added helper text inside of the search buttons and made them white to bump up the contrast. Additionally I made the plan trip button larger so that it would be easier for users to press.
High Fidelity Wireframes
All members of our team contributed sketches based on our sitemap. We then discussed sketches as a team and voted on concepts and designs we wanted to move forward.
Prototype
High-Fidelity Prototype
Final Thoughts
What worked?
For this application, I realized that keeping it simple was the best. This was my first design project and I had a lot to learn about how to keep things simple but also still user friendly.
What didn't?
I learned that I needed to do more research into aesthetics and trends before committing to a design. I also learned that I needed to not overthink elements and ideas. Developing a logo and name for the application was really difficult for me but I learned that I had to come up with a process for that that worked for me. I learned to not over think names and if I could go back I would probably really shorten the name down. I also probably not would redo this logo and make it simpler.
Next Steps?
For this project, it could go on to be made, but I personally would like to redo the aesthetic and branding. I would then like to do more usability testing to make it into something even better!
Return to Top