Jack's UX Studio

Jack Myers

Projects

About Me

Jack Myers

Projects

About Me

Jack Myers

Projects

About Me

Designing for Public Transportation Sponsored by Keylime Interactive

About The Project

Team Size

How is the CityBus Service currently used?

What Channels and Touchpoints are users interacting with?

How does a bus-based public transportation system work?

What are the Current Student Options of the CityBus Service?

Methods

Secondary Research | Observations | Usability Testing

Output

Experience Map Matrix Template | Design Sketches

Our first milestone in this project aimed to understand the very foundational knowledge related to the CityBus system that allows us to move forward towards our end goal. This includes but is not limited to understanding the best practices for public transportation, locating the current channels and touchpoints, and knowing the general opinions held by Purdue students on social media. At this point in the project, we were keeping our findings broad meaning we were unsure if we would focus on the app or the physical space.

The Current Riding Process

Based off of our observations we drafted a quick experience map matrix to document our findings. Moving forward we used this as a guide outlining the user journey of a Purdue Student leveraging the CityBus.

This also assisted us in identifying some early painpoints and design opportunities.

Figure 1 - Experience Map Matrix Template

The State of the App

To familiarize ourselves with the CityBus app we created a scenario based usability test to identify areas within the app that users are having trouble with. We also read app store reviews and reddit posts to start collecting painponts.

Purdue SubReddit

A user's complaints about the CityBus app on the Purdue Student subreddit. Many users complained about bugs, glitches, and bus times being incorrect.

Purdue SubReddit

A user's complaints about the CityBus app on the Purdue Student subreddit. Many users complained about bugs, glitches, and bus times being incorrect.

1 Star Reviews

Users on the Apple App Store also were found complaining of a confusing interface and inaccurate bus times.

1 Star Reviews

Users on the Apple App Store also were found complaining of a confusing interface and inaccurate bus times.

From multiple testing sessions, we discovered that the biggest issues users currently have with the app are...

Inconsistent information throughout the app
- The first issue is exemplified by the multiple sources of time information on different screens. The user had multiple ways to gain the same information within the app, which caused confusion.
- The live-tracking on the CityBus app makes locating the bus easier which is more accurate compared to the designated due times

Overcrowded information on some of the screens
- the amount of information displayed is overwhelming and confusing for users to find relevant information
- The route tab was difficult for users to understand at a glance
- The "plan a trip" feature was clunky and hard to understand
Lack of backtracking
- illustrated by participants' need to return to the hamburger menu whenever they want to use another feature
- participants constantly used universal back gestures (Android Users).
- Example: the bus icons on the map screen and the bus times on other screens are inconsistent

Since it is not feasible to solve technological issues such as real-time tracking and the time information related to it, we decided to focus on finding solutions for the latter two issues.

From multiple testing sessions, we discovered that the biggest issues users currently have with the app are...

Inconsistent information throughout the app
- The first issue is exemplified by the multiple sources of time information on different screens. The user had multiple ways to gain the same information within the app, which caused confusion.
- The live-tracking on the CityBus app makes locating the bus easier which is more accurate compared to the designated due times

Overcrowded information on some of the screens
- the amount of information displayed is overwhelming and confusing for users to find relevant information
- The route tab was difficult for users to understand at a glance
- The "plan a trip" feature was clunky and hard to understand
Lack of backtracking
- illustrated by participants' need to return to the hamburger menu whenever they want to use another feature
- participants constantly used universal back gestures (Android Users).
- Example: the bus icons on the map screen and the bus times on other screens are inconsistent

Since it is not feasible to solve technological issues such as real-time tracking and the time information related to it, we decided to focus on finding solutions for the latter two issues.

Deeper Research & Prioritization

Locating The CityBus Touchpoints/Channels that have the Most Opportunity for Design

What Touchpoint(s) and/or channel(s) need the most improvement in the system experience?

What Opportunities can we feasibly design for within the identified limitations of the CityBus Service?

Methods

Contextual Inquiry | Live Guerrilla Testing | User Survey | CEO Interview

Output

Finalized Experience Map Matrix | Top 10 User Painpoints | Narrowed Area of Focus

Our goal for this milestone was to find out the most valuable and feasible opportunities identified from research that we should design for.

Joining Riders for a Trip

We completed our contextual inquiry to 1.) better understand a rider’s experience using CityBus, and 2.) identify what parts of the experience create problems and opportunities for different types of users.

Each team member accompanied a Purdue student on a bus ride on one of the CityBus routes, prompting them to think aloud through the experience. We also asked additional questions to further understand students’ mental models of the bus system and what workarounds they were using when faced with an issue. Our team created a basic protocol that included questions and prompts but team members were encouraged to go off script to learn more from our participants.

Lack of Information on Signage

Most bus stop signs only list the bus routes and the bus numbers. Some stops didn’t even have a sign, confusing newer riders. There was also no advertising or promotion for the CityBus app, leaving unfamiliar users lost as they were unaware of when the bus would be coming.

This prompted us to look into other similar campus bus systems and design for better communication of the routes and bus times.

Cramped Shelters

Only a few stops have a shelter at all, and those that do can only fit a few people. This is especially an issue in high-traffic stops like the one pictured left at the Electrical Engineering Building.

In addition, bad weather forces most riders to have to wait outside in the rain or snow as there isn’t enough room for more than 4 - 5 people.

From this, we identified an opportunity to improve the bus stop shelters and add more information at commonly used stops.

Over-reliance on the App

While students appreciate the live tracking features on the app, we noticed that many aspects create an over-reliance on the app without any physical indicators of when buses will be arriving at a stop.

This opportunity is two-fold since there are many opportunities to either A) improve the app experience or B) reduce reliance on the app.

Troubles with LCD Displays

Users appreciated the addition of an LCD display showing the stop requests and upcoming bus stops. However, many riders also simultaneously had issues seeing the display from the back of the bus.

This provided an opportunity to design new communication methods using haptic, visual, and auditory cues for riders, making comprehension of stops and bus times clear.

Stop Request Cord

New bus riders had trouble noticing and realizing that the stop request cord was meant to be pulled to request an upcoming stop.

This led us to look into opportunities for possible signage that the bus could be improved on, whether that be digital or physical.

Bus Public Address (PA) System

Some riders experienced problems with the bus PA system being too quiet or too difficult to understand. Other riders said they liked the PA system and found it helpful to determine the correct stop.

This indicated a possible disconnect between systems on different buses.

As a result, we decided to look into ways that the PA system could be more clear and more consistent for riders, especially on crowded bus routes.

Bringing the Info Together

Our Experience Map Matrix was sythesized leveraging a tool called JourneyTrack and allowed us to organize our found painpoints and potential opportunites to design for. We used this matrix to assist us in our prioritization testing.

Figure 2 - Final Experience Map Matrix

Prioritizing What's Important

Guerrilla UX Testing is a way of conducting user testing without the burden of extensive recruitment of participants. We chose this type of testing because of the vast number of accessible Citybus users here at Purdue. Using this procedure, we were able to engage with a large number of riders in a short amount of time.

With this guerilla testing, we aimed to determine the opportunities that were of the highest value to the students and to obtain quantitative data to determine the severity of the different pain points found. This would help determine what our final problem space would be.

We provided participants with colored markers based on how often they ride or how familiar they are with the bus system. Participants tally-marked the top three pain points they experienced and were also invited to explain the rational regarding their choices via a short interview.

We found the biggest issues were the bus arriving late or early, how difficult the manual doors were to open, and general dissatisfaction with using the app. Users were upset about constantly having to check their phones for when the bus will arrive, the app being difficult to navigate, and the times of the app being inaccurate.

Since the answers of others were public, it is possible that later on in the process participants were subject to groupthink. To help combat this, we also sent out a user survey to gather additional answers and data regarding our prioritization.

Our user survey received 166 responses from Purdue students.

Figure 3 - Our Guerilla Testing Board Post Test

Qualitative coding was used to analyze explanations of participants' decisions that were collected during guerilla testing. This analysis suggested the following connections between painpoints.

Confusion navigating the app is a really big part of the issues people have while planning a trip.
People get frustrated when their plans don't work because of inaccurate times.
Bus times being inaccurate makes planning harder and less effective, leading to frustration and people choosing to walk instead.
App times are inaccurate because busses run late, as a result, riders feel they have to constantly check the app.

Figure 4 - Top 10 Painpoints Identified Through our User Survey

Likert scale of the survey findings, ordered by most prevalent. Within the scale, the responses "Very frequent" was given a score of 3, "Somewhat frequent" a score of 2, and "Not frequent" a score of 1. Each identified painpoint's total score was calculated by summing the total points according to the likert scale.

Figure 4 - Top 10 Painpoints Identified Through our User Survey

Figure 4 - Top 10 Painpoints Identified Through our Guerrilla Testing

Results were compared by total tally marks written by participants at each color. A tally mark indicated that said participant found the specific painpoint to be most frustrating.

Figure 4 - Top 10 Painpoints Identified Through our Guerrilla Testing

Results were compared by total tally marks written by participants at each color. A tally mark indicated that said participant found the specific painpoint to be most frustrating.

App Focus or Physical Bus Service Design?

Our users are not the only CityBus's only stakeholders and we recognize that we needed to talk to CityBus officials to get the full picture of why the bus operates as it does and what modifications would be feasible. To do this, we conducted a virtual interview with the CityBus CEO.

Some noteable takeaways from our conversation included:

CityBus does not manage the app, they work with a company called TripSpark.
City Bus executives have already started efforts to fix some of the physical problems we identified like ensuring that every bus stop has a sign, and the amenities it needs depending on the popularity of usage.
Physical changes and physical infrastructure cost a lot of money to create and uphold.
Out of all the changes we could suggest, changes to the app would be the easiest for CityBus to take action on.

Final Designs

Design Recommendations for Identified Opportunities

Based on the prior research outcomes, how can we make designs that provide a better experience for CityBus users within the current app?

Methods

Wireframing | MidFi Interface | A/B Concept Testing

Output

Final Design

For this stage of the project our team split into two different groups. One group redesigned the entire MyCityBus app, and one group made changes to the current app experience. I was apart of the team making changes to the current app experience, which is what I will focus on below.

Our goal for making changes to the current app was to improve the current flow and satisfaction of using the service.

Improve the overall usability of the app
Decrease the users' reliance on the app
Help users better manage their expectations of the bus times, expectations if the bus is late or early
Ease the riding process for new, inexperienced users

Our goal for making changes to the current app was to improve the current flow and satisfaction of using the service.

Improve the overall usability of the app
Decrease the users' reliance on the app
Help users better manage their expectations of the bus times, expectations if the bus is late or early
Ease the riding process for new, inexperienced users

Optimized Communication on Home Screen

The current bus times screen is difficult to understand because of repeating information and the absence of arrival times. Through our A/B concpet testing, we found that users preferred to see the bus arrival times first and then the distance from the bus stop in minutes or feet. We also found that most experienced app users spent their time leveraging the map within the app to plan their trips.

Current App Home Screen

Redesigned App Homescreen

We put the bus times first on the app home screen as this information we found to be most important to our users. We also found that some users had difficultly locating bus stops due to them not being properly labled. To help combat this we added in the distance the user is away from the bus stop.

We added a "view live map" right on the homescreen to improve the user flow of the app, easing the cognitive load to get the user to their favorite part of the app. We also added in bus alert icons on the homescreen, I will dive more into what these mean below.

Bus Alert Feature

Currently there are a lack of alerts for bus passengers that lead to frustrating scenarios for our users. These include a late bus, bus driver bathroom break, or a shift rotation. To address these issues we added a bus alert system to the map within the app.

New Bus Alert Feature

These alerts will be bus driver activated, meaning that if the bus driver is stuck in traffic, needs to use the bathroom, or is about to undergo a shift change they will activate these alerts from the drivers seat of the bus. After activation, the alerts will appear within the app.

Route Tab Visibility

The current route tab can be hard to understand for some users. This is mainly due to the tab having a transparent background. To assist with readability, we redesigned this tab. Some users were also confused as to what the toggle switches did.

Current Route Tab

Redesigned Route Tab

We removed the transparent background of the route tab and updated the toggle switches. The toggle switches display what destination the route will travel towards. The new toggle switches feature arrows to clearly indicate to the user where the bus will be moving towards.

Notification System and Widgets

To help people reduce time within the actual CityBus app (untested hypothesis), we designed notifications and widgets that users can leverage to obtain bus route information. Currently the CityBus app does not have notifications or widgets within the app.

Notifications

Widgets

Users will setup their notifications (figure 5) within the app leveraging a new button located on a bus routes tab. They can customize these notifications based on stops away, minutes away, and disruptions. They can also add a widget within this interaction.

Figure 5 - Notification Button within the CityBus App.

Redesigned Plan a Trip Feature

From our research, we found that many users avoided using the "plan a trip: feature within the app. This was due to the feature not providing adequate information and bad information architecture for the users. The users that did use this feature used the feature at the beginning of their trip, and then switched to google maps for the rest of the trip.

The hindered "plan a trip" feature also affected new bus riders from understanding the transportation process.

Current "Plan a Trip" Feature

Redesigned "Plan a Trip" Feature

Step 1: Enter Trip Details

Step 1: The user enters in details regarding their desired trip. While usability testing many users would want to backtrack to the map during this process, but when backtracking they would loose the details they already inputted, prompting them to restart the process.

With the "saved trips" feature users can save a trip for easy access to their submitted details.

Step 2: Route Selection

Step 2: After the user enters their desired details, they will be able to view a selection of trips most suited for them. The user can also view a map of the route they will be taking on the trip.

Step 3: Navigate to Bus Stop

Step 3: The user begins a step by step journey to walk them through their bus trip. The first step on the journey is to assist the user in locating the bus stop.

Step 4: Enter Trip Details

Step 4: The next step of the journey is when the bus picks up the user. As the user is on the bus, they can easily see how many stops they have until their destination. This is to reduce user anxiety and give the user more awareness.

Step 5: Nearing Destination

Step 5: As the user approaches their destination they will be prompted with a message signaling the user to pull on the stop cord to alert the driver of their desired stop.

Step 6: Arrived at Destination

Step 6: As the user arrives at their desired destination and complete the trip.

Conclusion

The Hypothesized Value

Small yet meaningful changes to the current CityBus app, the primary source of information for Purdue, Lafayette, and West Lafayette's Bus Transportation System
Increased ease of use in users embarking on a CityBus trip, leading to happier customers
Step by Step "plan a trip" design catered towards new bus users, increasing new passenger ridership

Small yet meaningful changes to the current CityBus app, the primary source of information for Purdue, Lafayette, and West Lafayette's Bus Transportation System
Increased ease of use in users embarking on a CityBus trip, leading to happier customers
Step by Step "plan a trip" design catered towards new bus users, increasing new passenger ridership

Limitations

The main limitations of this project were subjected to time and resource constraints. While our constructed solution is based on our insights and data collected from previous research, we identified that three main limitations should be considered while using the outcome of this project to carry on further work in the future:

Small Sample Size and Bias

While we tried our best to collect data that are adequate in number (for quantitative studies) and varied in demographics (for qualitative studies) to serve a better understanding of the whole picture, we recognized that there a small sample that we’re able to collect from might be subjected to multiple types of bias. That being said, we believe that the insights that we synthesized through research and the designs we recommended are supported by our research and carefully considered.

Lack of Adequate Real Context-Embedded Testing

Within the time and resource constraints, we did a lot of in-lab usability testing and concept testing, which provided us with a lot of useful feedback to improve on our final solution. However, we did not manage to get to do fleshed-out testing that incorporates real-life context, such as having a functional prototype for the app and having users use the newly designed app actually to go on a bus trip. The in-lab testing and concept testing we did mostly served to determine whether our users see our designs as more helpful than the old app.

Lack of Technical Feasibility Evaluation

Through the interview with the CEO and upon examining similar apps made by TripSpark, we are aware that some technical constraints might made our designs harder to implement. While we included a more realistic revision for the app and did consider technical constraints while coming up with the solution, none of these suggestions have fully gone through any technical consultancy to make sure that it is feasible to carry out on the current app.

Next Steps

Because of the above limitations, there are a few extra steps that we recommend in order to make the most out of the result of this project. These steps include conducting further research among the Purdue student bodies and further re-evaluating the designs that we currently have done.

While we are confident that our research findings are true to some extent, we are aware that they might not be accurate to the entirety of the student population at Purdue. Hence, additional research within the CityBus space may be needed to ensure the accuracy of our research findings. This could include further investigation within the rider experience through a deeper heuristic evaluation of the MyCityBus app, and A/B testing with CityBus riders.

We were able to also conduct a few user tests for each design, however, it would be optimal to gather more data on the effectiveness and usability of each before concluding what we would like to iterate on in our designs, especially the overhaul since it completely changes the user flow. Context-embedded user testing would be an immediate next step as this would help confirm whether our designs resolve our identified pain points or not.

My Reflection

This was my last Purdue UX Experience Studio project (5 total). Going into this project excited me as I was the only upperclassman on my team which gave me a high responsibility to ensure our project was sucessfull. I was blessed to have eight other hard working teammates that were eager to learn and accomplish the task at hand. Our sponsors at KeyLime Interactive were also a great part of our team during our weekly virtual meetings, which encouraged us to really think about what we were doing within this project and where each part will lead us to move forward.

This was my first project where we had such easy access to our users as they were Purdue students. This enabled us to practice our prioritization through user surveys, guerilla testing, and we were lucky enough to be able to talk to upper level stakeholders such as the CityBus CEO.

If I was to do this project all over again, I would have talked to the CEO much earlier within our design process. This would have enabled us to narrow our scope (app focus) earlier in the design process, instead of looking into the physical elements of the experience in which were not feasible for us to change or in which changes were already being developed.