01. Introduction
When Thinkful assigned an app project to me, I knew it would be the kind of project I enjoyed taking on: challenging, new, and, of course, fun. The initial pitch was simple: let’s build a bus route schedule and time app (Thing Google Maps – Transit).
They pushed me hard to explore paths through research that usually lead to better solutions to the problem we were trying to solve: making a bus route app that is simple, intuitive and gets you in and out with the minimum amount of fuss. This is where I began coming up with the idea of Bussy, a simple bus route app. Along the way, I’ve learned a lot, experienced a lot, failed some, and had a good dose of the best research and design experience of my career.
My Role
I led the project, starting with user research and continuing all the way to the design of prototypes that were ready for hand off to developers. Because I was flying solo on the project, I served as Researcher, Prototyper, Content Strategist, Designer and Product Manager. It was a great experience fulfilling all these roles and going through the process singularly.
The Problem, Audience, and Solution
The problem is simple. There are too many bus route apps with too many bells and whistles, many of which are simply not needed. Users are tired of wading through dozens of options when all they want is their bus route and time.
The audience for the app are commuters who primarily use technology to find their bus routes and times to and from work, events, and their day to day transit. The solution we found for them was as simple as the problem: make an app that allows them to quickly and easily find their bus route and time.
02. The Research Phase
Much research was done on Bussy and can be broken down into 3 major phases:
User Surveys
A simple, sketched sitemap and wireframe were initiated, from which users discussed their thoughts. Three main points were discovered… First, that users were attracted to the ease of use of Bussy. Second, that users were frustrated when searches brought back no results. And third, that the structure of the app was spot on and right where it needed to be.
Key Insights
These included:
- Continue to build and design with ease of use in mind. This was the main thing the users appreciated and they were 36%more likely to use this app over competitors.
- With search results, always suggest other options and routes that could be applicable to their search. This would avoid empty search results.
- Keep the structure of the site as is and do not add more bells and whistles. Simplicity was key to the user with this app and increased user satisfaction by 28%.
Personas
A persona was created, detailing the drives, goals, needs, and hesitation/pain points of a typical Bussy user. Their goals included making it to a target location in time – while using technology to meet this goal – and having access to multiple bus routes and time options. The typical user does not want to be overwhelmed with the technology… They simply want their bus route and time.
Competitive Analysis
A competitive analysis was undertaken, focusing on Google Maps and City Mapper. Google Maps was overly complicated and took many steps just to get to the bus transit screen. Though it provided good information when you found it, there was simply too much complication involved. CityMapper was simpler, but also had too many features and functionality. There were multiple steps just to get route information and it was easy to get lost in the minutia. This analysis further led to the belief that there was an opening in the marketplace for an app that was both simple and straightforward.
03. The Define Phase
Bussy went through a “define” phase consisting of user stories, user flows, paper prototypes, and wireframes:
User Stories
User Stories were created, highlighting user problems and needs so that the developers could determine which features to prioritize and build into the final product. For the MVP, this was defined as a log-in, location services, route search, and information display screen.
User Flow
An extensive user flow was built, detailing the project overview, business requirements, user stories, and of course, the resulting user flow. This encapsulated all previous research and condensed it into one document, leaning to a simplified 10 step user flow… Exactly what we were after with our end goals in mind.
Paper Prototypes
Paper prototypes were created, but kept very simple as this was a simple app. Ten screens were drawn, aiding in the future step of low fidelity wireframes.
Wireframes
Lastly, wireframes were made. These were based on all user research that had happened before, along with the hand drawn paper prototypes. This was the culmination of the “define” phase and led directly to the “design” phase.
04. The Design Phase
Design was done on Bussy and – since sketches, basic wireframes, and a site map had been done during the research phase – the design was only two major steps:
Lo-fidelity Prototypes
Lo-fi prototypes were generated from which Bussy started to take shape and form. This served as a good starting point for further user testing, which revealed several flaws. Mainly, that users wanted to be able to log in and that they wanted to be able to turn location services on or off. These improvements were implemented in subsequent revisions and the lo-fidelity prototypes were ready to be converted into developer-ready, hi-fidelity prototypes.
Usability Testing & Design Iterations
Several rounds of design iterations were made, also based on usability testing. Testing was done on multiple sample commuters and their provided feedback. Design iteration number one included the addition of a log-in/user account creation screen. This was added because users wanted saved searches in the future and account holders wanted to be able to start keeping a database of users right from the beginning. Design iteration two included mimicking a dark mode, as the initial views were too bright if looking up routes while walking in sunny conditions. Design iteration three was last and added location services so users wouldn’t have to look-up or add their address each time they searched.
Hi-Fidelity Prototypes
From these lo-fi prototypes, hi-fidelity prototypes were created. These were screen specific, accurate and final designs, from which the developers could build Bussy without any question as to feature or function. Final usability testing was done with a clickable prototype and last minute adjustments were made.
05. Results
One of the most exciting things about building a new product is being able to experiment and take risks without too much to lose.
As part of the research, design and development cycle, I cut features and functionality until an MVP was created. In each user test, we analyzed how people go about finding their bus routes and schedules. This helped us learn that most would like a simple way to get into the app and onto their route. The design phase detailed how this would look and, seeing an opportunity to improve on competitors, we developed a great app named Bussy.
Want to learn more or get started on your own project? Feel free to email me at anytime »
