Level: Public Transit Navigation App
Client:
• A transportation agency for a midsize metropolitan area in the midwest that serves thousands of commuters.
Product:
• A mobile application operated by a city transit system that serves thousands of commuters.
Roles and Responsibilities
• Planning, facilitating and conducting research
• Developing prototyping and testing wireframes. 
Creative Direction: 
Alisa Le, Monica Longmire
Scope and Constraints
• Timeline: 4 weeks
• Budget: pro bono
• Timezone: facilitated and met with people in Central and Eastern Time.
• Tools Used: Figma, Notion, Google Suite, Whimsical, Loom
Problem Statement
Project Brief
• Create a mobile application operated by a city transit system that serves thousands of commuters.
• Added infrastructure has broken Rider's previous mental models and they often run the risk of boarding the wrong bus.
• Riders are boarding the wrong bus most often at Washington and State, which is served by seven bus lines.
PROCESS | DISCOVER
Users and Audience
• Students
• Younger Professionals
• Essential Workers
• Seniors
• Public Transit Enthusiasts (...we exist!)
Research:
• User surveys
• Customer interviews
• Competitor analysis
Survey Questions:
• do you have any experience with ride share apps?
• do you have any experience with current public transit apps?
• are there any public transit apps you favor?
• how do you plan your commute?
• has existing infrastructure failed or disappointed you?
User Interviews Plan:
     • After the survey I facilitated follow up interviews on 08/20 and 08/21 with potential users. I strived to be an active listener and keep the tone of the interviews conversational and fun.

    • In retrospect, I wish scope and resources allowed for me to conduct user interviews from a more diverse age demographic, however I was fortunate enough to have had 2/3 of my interviewees being commuters from the midwest. Insights from these sessions allowed me to identify pattern's and develop personas.
 
   • In initial interviews I asked users to walk through their routine or lack there of for a potential commute. Additionally I asked them how they would navigate scenarios similar to the user's in the project brief (As seen below).
Scenarios:
• User stops at the Washington/State bus stop to commute to work and is not sure which bus is coming.
• User accidentally boards the wrong bus at Washington/State and is late.
SWOT: CityMapper
After interviews and surveys I drew up a competitive analysis to pull insights and strategize from scrutinizing existing solutions.
Strengths
Weaknesses
• Gamification
• Big legible type
• Detailed icons
• Simple legible interface
• More commuter options
• Detailed map
• Navigation in 2 taps
• COVID-19 alerts
• No tablet version
• Feels less detailed (but isn’t)
• Branded green color evokes feelings of tension.
Opportunities
Threats
• Develop app for tablet
• Hire more 
customer service.
• Prioritize accurate 
travel times
• Small London based team
• Relies on remote workers
• In competition with Google and Apple
• Inaccurate travel times due to delays from COVID damaging reputation.
SWOT: Google Maps
Strengths
Weaknesses
• Clean, elegant UI
• Detailed, responsive map
• Live, responsive time
• Intuitive user flow
• Harmonious, bright colors
• Fun icons
• Dark mode
• Covid-19 alerts
• Small type, and icons
• Could be disorienting 
for seniors/visually impaired.
• Sometimes 
inaccurate times
• Hard to use 
while moving
Opportunities:
Threats:
• Could find ways to implement gamification
• Interface elements 
could be larger
• Allow offline option
• In competition with Apple
• In competition with smaller more accessibility-focused 
map applications
• Can’t be used safely while driving/traveling
PROCESS | DEFINE
User Personas:
• I chose to highlight the persona's Rachel and Bryson as they were developed using insights from users who worked and studied in the Midwest and commuted by bus.
Insights:
• Rachel indicated the bus had driven straight past her on several occasions.
• Additionally the bus had changed routes immediately after she boarded leading to frantic googling.
Empathy Maps:
Insights:
• Bryson mentioned he severe anxiety regarding planning his commute.
• His livelihood is directly affected by the inaccuracies of the bus schedule.
User Journey:
Journey Map Insights: 
• Both users felt a sense of dread and unease when relying on the bus.
• They voiced a sense of relief and felt they could always count on the subway or train systems.

This exercise helped me to empathize with the experiences of the potential user and infer what their needs, preferences and wants would be.
Every User:
• preferred taking the train and viewed it as effective.
• needed to know the live location of the bus.
• needed to be able to plan their commute with short notice.
User Stories:
• As Rachel I have familiarity with the app, but have started working and living in a new city. I would like to take the bus after work to meet some friends at a popular Karaoke bar."
• As Bryson I would like to check the schedule for the day at my nearest stop.

     • The story I ended up prioritizing was Rachel's, a mid 20's start up employee who just moved to a new city. Her need for a search function informed the primary architecture of the product. Additionally, the users that informed Rachel's persona had the most bandwidth to conduct interviews and user testing.
User Flow:
• I built off of initial requirements and integrated the aforementioned user stories to plan around the needs of potential users.  Additionally I utilized four up sketches to plan through each possible screen.
Process | DEVELOP
Wireframe Sketches:
• Four up sketches I created to ideate possible features, and utilized in conjunction with user stories to quantify and develop information architecture.
Digital Wireframes:
    • User's recommended I could add tabs per each intended user flow. Additionally they had trouble identifying hierarchies of bus information without color coding.
Wireframes V2:
     • User's felt frustrated by the lack of collapsible way-finding information. Additionally, they recommended implementing progressive disclosure to prioritize the map screens, as well as easing back on color coding until I develop more intuitive information architecture.
Lo-Fi Prototype:
    • Users recommended I begin color coding bus lines, as well as including quantifiable units in the possible routes screen. They felt more familiarity with this iteration, and found the search feature to be intuitive. User's felt the overlays were ineffective as they took away screen real estate from the maps, and the information architecture could benefit from collapsible and responsive container elements.
Mid-Fi Prototype:
    • In usability testing I got feedback that the color palette felt "stale" and "dated". User's also felt confused about the purposes of the bus stops and bus line's tabs, yet found the main search path effective.
Process | DeLIVER
Style Tile:
Moodboard:
Branding Goals: 
Considerate, Bright, Simple, Minimal, Bold, Friendly, Ease of use, Altruistic
Branding Background:
• Level is a reference to the phrase “Eye Level”  as in meeting the user at "Eye Level".

• It additionally is a reference to the literal meaning of level which is akin to balance.

• Level is a reference to progressive disclosure, as the app has features that a user must sequentially advance through.
HD PROTOTYPE:
Final Usability Tests:
     • After introducing each interviewee to their scenario I actively listened and took notes, encouraging them to vocalize areas they found frustrating or could be improved as well as identify what features resonated with them.
Changes Made:
• Improved styling per brand goals.
• Search bar hierarchy prioritized
• Updated Color Palettes per brand goals.
• Responsive information tab to reduce cognitive load.
Usability Reports | QUalitative data
Improved:
     In my final round of usability tests, user's expressed I had made successful branding decisions. Every user expressed they understood the bus styling as it referenced mental models from public transit in major metropolitan areas.
Changes to be made: 
    With that being said users identified pain points and additional features to be improved upon in future iterations:

• Improve UX grammar, check to make sure icons match existing mental models.
• User's claimed certain features felt redundant and mentioned the app could benefit from either less or more features
• User's wanted the map to take up more of the screen real estate.
• Walking directions could be simplified into a collapsible screen.
What I learned:
• Decomposition (Breaking down and finding solutions for a complex problem).
• Mindfulness: Commitment to the process in itself, working and iterating without attachment or expectations.
• Prototyping in Figma
• Information Architecture
• Time Management
• Research
Back to Top