Bus Lightyear
Building Light Years Ahead
Detroit and the neighboring town Flint, MI are having serious issues with poverty, crime and lack of clean drinking water, amongst other issues. The goal of this mobile application would be to brighten people’s mood while helping them get a faster and more efficient method for using their existing public bus system.
Overview
The goal of this project was to combine my love for branding, technology and art into a cohesive design. This would work for a mobile application for a public transportation system that serves a city in the midwest. I was limited to 4 weeks, so I had to design efficiently and quickly.
Summary
The goal of this mobile application would be to restore faith in the Detroit public bus system by helping people get a faster, more reliable and more efficient method for using public bus transportation.
Roles & Responsibilities
Conducted user research and testing. Developed wireframes and task flows based on user needs. Collaborated with designers and developers to create intuitive, user-friendly software.
Problem
People in Detroit, Michigan are having to deal with a brand new and increasingly expanding public transportation system. They cannot figure out when their bus will arrive and which specific bus is arriving. People who are riding on the bus need to know this information so they can calculate how much time they need to get to the bus stop.
Audience
This mobile application is for anyone who can operate a mobile device. My target audience is the elderly, since a large part of my user base is in the age range of 70-85. If I plan to design for accessibility I will have a mobile application that is usable and enjoyable for everyone.
Solution
Detroit can have extreme temperatures and people should not have to wait for hours in the elements without knowing if a bus will show up on time or even at all. The people of Detroit had no mobile application for their bus system. With Bus Lightyear, people can reserve a seat, get confirmation of bus arrivals and get access to information about bus routes at the click of a button.
Google Maps SWOT Graph
By studying Google Maps, I was able to find a baseline for how a great web mapping service works. By offering satellite imagery, aerial photography, street maps, 360° interactive panoramic views of streets (Street View), real-time traffic conditions, and route planning for traveling by foot, car, bicycle, air (in beta) and public transportation, Google Maps stands as a pinnacle for web mapping applications.
Proto-Persona
Getting preconceived notions and bias out of the way. With a proto-persona a designer can come up with what they believe will be the typical user for their application. Sometimes generalizations are correct and often times, they are not. With this proto-persona, I created a female in her late twenties, who has a young child to take care of and a job as a cosmetologist to keep. As it turns out, this was accurate, as this age group was common on my survey.
Research and Discovery
Process
With a Google survey, I was able to begin the process of finding out more about current activities, people’s view’s on personal safety, accessibility and how individual peoples needs differ from one person to the next.
Survey Data
What I learned from this project is that people have extreme difficulties using public transportation. They need to get to work and they want transparency and accountability from their public bus system . With my survey data, I have proof that people need a public bus system that is conscious of accessibility and ease of use.
Persona: Delores Echazu
Delores has a wonderful life, but not without its share of challenges. She is a retired anthropology professor and widow. She loves her daughter Miranda and does her best to help her when she can, by watching her daughter while Miranda works. She goes to the park often, but has struggled in the past with mobility. She loves her friends and his family and wishes it were easier for her to get on and off the bus..
Motivations
Delores has desires to help her daughter have a happy life. She is retired, but often takes the bus to watch over her granddaughter, while her daughter works hard as a cosmetologist. She is a recent widow and often goes to the park to feed and watch birds. She loves interacting with her previous students and plays Dungeons & Dragons with them when she can.
Goals
Help her daughter with watching her granddaughter.
Go to the park and get outside with friends.
Accomplish her goals without falling or getting hurt.
Frustrations
Mobility and lack of accessibility.
Finding the correct bus route.
Not being able to help her daughter.
Bio
Dolores is retired anthropologist who has recently been made a widow. She gets to see her daughter, who works a lot, so she also gets to spend time with her precious grandchild. She gets exercise by walking to the bus stop from her daughter’s house. Dolores enjoys the company of passengers and people she meets at the park.
Gain Points
Dolores is retired. She can go to the park and enjoy feeding birds. She can go read or meet up with her pottery group. She keeps up with Instagram, Facebook and Pintrest. Even though she uses them seldomly, she gets inspiration from them often. She gets to see her daughter and granddaughter. Dolores enjoys the company of passengers and people she meets at the park.
Pain Points
Dolores husband passed away three years ago. Since then, she has had to ride the bus routes by herself. The bus could be more accessible. It is difficult for Dolores to get onto the bus. She feels like her voice is not heard. She is frequently early to the bus stop and has to wait due to unreliable bus routes information.
Information Architecture
Minimal viable product. The MVP for any UX designer is vital for truly understanding client goals. To see how I determined my MVP, take a look at my user stories, wireframe sketches, digital wireframes and user tested tasks that showed me how people really interact when using my mobile application.
User Stories
Journey maps help us understand a typical day in the life of someone’s shoes. In this case, we have Delores tasked with getting her bus route scheduled so she can babysit her granddaughter, while her daughter goes to work.
Crazy 8 Sketches:Delores
This quick sketch is called the crazy 8 method. It breaks a scenario into 8 squares, in which the UX designer must showcase a scenario of how the product or service they are making is utilized in a real world scenario. Here we have a layout of what the mobile app will look like from start to finish for someone like Delores or Miranda.
Wireframe User Flow Sketches
User flow sketches often showcase the application in stages. These quick sketches allows for me to work with developers and other designers quickly without having to open any software to make corrections.
User Flow
With user flows a UX designer can better understand how to achieve the minimal viable product for a typical user. With a few taps, I can allow users like Delores to get on the bus and get to her destination with ease and confidence.
Site Maps
Just like a user flow map, a site map can allow a UX designer to better understand a user’s basic needs. Also, it helps designers understand how users might navigate the entire application. With this site map, I had grand intensions of having a shop where I could show off my love for branding and design, but mostly it is designed to help people find particular buses and bus times without getting lost during navigation.
Wireframes
With digital wireframes I can begin to create a skeletal structure that allows me to see spacial relationships that elements have inside the predetermined dimensions of my screen. Much of this stage is about blocking out and framing work for prototyping.
Landscape Mode
When designing for accessibility, we needed to have an application that is responsive. We were tasked with making designs in horizontal, as well as vertical layouts.
In-Person Usability Testing
With in-person user testing, I can see people’s reactions and hear instant feedback. It is the most valuable form of testing that can be done, in my opinion.
Standard Mode
Accessibility Mode
Privacy Protected Mode
Rain Watson
Cornell Thomas
Cody Parsons
David Cannady
Michaela Guthrie
Qualitative Data vs Quantitate Data
Branding
Content, it is always about content. With branding I start to work on content. With elements of design I can showcase imagery or specific design styles that describe the ethos of a brand.
Brand Development
This product is for anyone who can operate a mobile device. The age range for the average customer for The Bus Lightyear is 21 to 80 years old, according to Google survey data. See how I developed this brand further by coming up with designs that represent emerging audiences and markets towards a potential shift in demographic data.
Sketches
Bus Lightyear is a mobile application for an existing public transportation system. With a product and service that has more visual impact I could increase awareness about new changes in their operation. Using sketching in the early stages of design I am able to better understand my goals for concepts. See how sketching allowed me to create ideas that form design decisions.
Sketches
Sketching helps me create concepts, ideas and logos. It is a valuable tool that gives me visual design inspiration for further stages of design
Moodboard
Moodboards allow me to have a good understanding of what my design aspirations look like for Bus Lightyear. I chose a color scheme and design that echoes Disney’s beloved character Buzz Lightyear. By using a flat UI concept, I was able to keep a clean and legible look with crisp icons that increase speed and enhance usability.
Typography
Typography is sometimes referred to as the most important tool a designer can use. See how adhering to Bauhaus style typography allowed me to develop designs that are functional, aesthetically pleasing and efficient. This design method helps designers and developers to create intuitive, user-friendly design that focuses on legibility and ease of use.
Color Palette
Understanding user psychology unlocks decisions about how to utilize color theory. How we associate colors often will lead to a pleasurable or unenjoyable experience. See how color impacts my design, as I use light grey and green to echo Disney’s design. I also allow dark purple to highlight call-to-action areas.
Logo Design
The people of Detroit needed a reliable bus system. The logo design for Bus Lightyear needed to to have impact and be seen from far away to let people know that there was a shining beacon of hope and trust that was around every corner to help those that needed comfortable transport in city of steel.
Style Guide
Creating style guides allows me to reference typography, color hex codes, specific sized buttons, text and more. With these best practices, I can work alongside the largest workforce without having to stop and miss a single ounce of efficiency. See how style guides helped my concept get out of draft, into prototype mode.
Prototyping
My user interface design concepts can help people of the city of Detroit pay for fares, find routes and more; all at the touch of a button. Now users can skip the hassle of waiting in the elements not knowing if a bus was going to arrive on time or even show up at all. Plus, they even have different options for specialized buses that cater to accessibility needs for people with specific disabilities.
Usability: Outcomes & Results
Efficient connection of wealth and labour to the marketplace. Riders can now commute with reliability and confidence.
Removal of productivity bottlenecks, route confusion and missed buses.
Maximized opportunities for individuals, business and government to increase income and asset value.
Feedback: Accessibility Mode
Summary Of Feedback: The revision I made came from an interview with a fellow UX designer named Zuki Modunkwu that I conducted via Zoom. He liked my idea of incorporating Disney into the project and asked that I think about expanding the app to include an accessibility mode.
Rationale: Quick Access
Rationale and Process: My original idea for this project was to design for the MVP for the Bus Lightyear. So, for my MVP, I wanted to showcase how easy it would be to reserve a seat on the bus or find a particular bus route. I modeled my process after Google Maps. Once a customer enters their information they can check out in a few clicks and swipes in standard mode.
Bus Lightyear: Revised Iteration
Revision Made: I created three paths from the start of when a user opens the mobile application. With adherence to accessibility standards I made typefaces bigger and bolder. I also made another path for people who do not want GPS tracking.
Final Thoughts
The number of rides from the Detroit Department of Transportation fell from 35.7 million rides in 2010 to 23.3 million rides in 2018, a 35% decrease. The Suburban Mobility Authority for Regional Transportation's annual ridership fell from 10.3 million rides to 8.6 million rides.
Public transportation is necessary for many people. To achieve my MVP, I focused on speed, efficiency and reliability. However, there is much more that can be done with this application. I am working on further iterations for potential applications for Disney, Tesla, GM, Nike and Carhartt WIP, as well.
Ready To Ride?
What I learned is that accessibility and ease of use is everything when designing a product or service. By using Gestalt theory, doing user research, conducting surveys and creating multiple design iterations, I have begun to make a mobile application prototype that I feel is ready to become operational.
“With the Bus Lightyear. I finally have the confidence that my bus will get me to work on time.”
— Tina Baros., Ballet Instructor
Contact
Feel free to contact me with any questions.
Email
wrketcha@gmail.com
Phone
(252) 619-9561