CatBus Case Study
A public transit app that will get you to where you want to go.
Role
UX Designer
Timeline
4 weeks
Team
Monica Longmire | Project Lead
Dela Rostami | Project Lead
Shayna Blume | Project Lead
Design Tools
Figma | Adobe XD
about the project
Introducing the City of Midville:
The City of Midville has an established network of bus routes and currently lists information of the network of buses, bus routes and schedules on the city website and on signs at each bus stop.
One major pain point has been located at the cross section of Washington & State, which has seven bus lines serving the stop.
***The city of Midville is a fictitious place. While the scope of the project is made up; the research, user interviews, and testing is real.
How might we make the experience of finding the right bus at the Washington and State stop easier and more enjoyable?
Discovery and Research
During the discovery phase I had tapped into the diehard bus rider demographic! It was so exciting to interview folks so passionate about public transportation that it inspired me to make UX design choices to encourage daily use. My goal was to design a user experience so engaging and simple to navigate, that everyone gets a chance to enjoy the ride.
Personas -->
"I love public transit because it is affordable and accessible."
"I enjoy taking the bus to take a break from the daily stresses of work commute."
"I am a bit of a secret hippie so my kiddo and I do not have a car by choice."
"I love public transit because it is affordable and accessible."
Comparative Analysis
Comparing existing public transit apps such as powerhouse Google Maps, local favorite DC Metro, and well rounded Moovit allowed me to pinpoint which features I wanted to add and which to avoid to best support the community of Midville.
SWOTs -->
Strengths, weaknesses, opportunities and threats of Google Maps.
Strengths, weaknesses, opportunities and threats of DC Metro.
Strengths, weaknesses, opportunities and threats of Moovit.
Strengths, weaknesses, opportunities and threats of Google Maps.
Empathy Map
Journey Map
Content Strategy
Armed with all this knowledge about our users from empathy and journey maps, I was able to deduce a hierarchy of user tasks from user stories and iterated through series of user flows, sitemaps and wireframes. Earlier iterations of the sitemap included a login feature which was later cut to focus on functionality and streamline flow to reduce user drop off rates.
Site Map -->
User Flow
Wireframe
Visual Design
I went with the idea of using Cat Bus as a source of inspiration for visual design and overall user experience of the app. In the movie My Neighbor Totoro, the Cat Bus is seemingly able to take its passengers to any destination they desire, even if the passenger (or the bus itself) lacks the knowledge how to get there; as is the case when one of the characters needed to find her missing sister.
Usability Testing
Through gorilla testing, participants walked through every function of the prototype and finished all tasks outlined in the business requirements (ETAs, ETDs, and access to multiple bus lines). They were also able to complete the additional task of choosing departure vs arrival times. Although the testing was successful regarding function, the prototype failed as Julian did not fully understand what he was doing or what he was looking at. Further refinement of the prototype was needed to increase the prominence of hierarchy of content and ease user flow. Users seemed to find delight in the playfulness and “cuteness” of the welcome and onboarding screen. I wanted to continue down that path of delight with visual design.
Splash screen sketch.
Onboarding screen sketch.
Brainstorming techniques to identify themes.
Splash screen sketch.
High Fidelity Prototype
Conclusion
Growth
Being able to take in feedback at face value along with analysis of data from research and testing makes for a combination that a powerful and undeniable source of truth. Testing only proves that there is more work to be done to enhance user experience of the CatBus app.
Next Steps:
Turns out you can custom edit Material Design components! I will be diving deep into both IOS and Material Design Guidelines to best edit components and elements to suit our users needs!
Final Thoughts
All in all, I found that designing a delightful experience using a UI that is friendly, approachable, cute and tactile provided a memorable user experience that is sure to entice new users and keep daily users engaged with the transit system of Midville. I also found that although there is room to provide a variety of tasks and functions, I thought it was best to keep this particular app simple and sweet for ease of use.
As one user stated:
“Keep it ‘Idiot Proof’ so I can enjoy the ride.”
