
Making Transportation Efficient and Functional.
Bloomington TransEase
Meet the Team
-
Ricky Vu
User Research and Communication
-
Emery Vickers
Writing and Deliverables
-
Carina Wang
Leadership and Management
-
Maria Morales
UX Design and Prototyping
Students at Indiana University, Bloomington find it difficult to navigate campus because the city’s bus app is inefficient, has an outdated interface, and offers a poor user experience.
Problem
Solution
A bus app for Indiana University students to make traveling easier and more efficient.
What is Bloomington TransEase?
Bloomington TransEase is a design created by myself alongside three other peers - Emery Vickers, Maria Morales, and Carina Wang.
The goal of this project is to develop a more effective bus app focused on functionality, usability, and efficiency for users in Bloomington, Indiana.
We learn new ideas every day, record them, and incorporate our insights and feedback into what we think is our best design.
Research
-
Total transit time
Type of bus taken
Traffic
Accuracy of the current bus application
General issues of use
-
Typically around three dozen people waiting at a busy bus stop
Few people are checking the app
Certain buses are at full capacity than others
Total of 23 minutes to get from campus to home for Emery
-
Start time: 4:00 PM
ETA's for the current bus app were mostly accurate
Some buses were either ten minutes late or five minutes early
Real time map tracking is not entirely accurate
Purpose
To understand the problems with the public transit app used by Indiana University students, we first did research. Emery made observations on consecutive days to see different student schedules. This helped us identify inefficiencies and improvements, guiding us in designing a better solution.
What People Are Saying
“Sometimes the bus can be overcrowded and I am even late to class sometimes because of how bad traffic gets when going to class. This doesn’t happen that much but there are times where I’ll contemplate if walking to class might be faster.”
— Filip Mang, 19, Sophomore at Indiana University
“I use Apple Maps and Double Maps to get to class but both aren’t the greatest for tracking buses though. Double maps doesn’t show the letters on the bus icons and I don’t like how it shows street names rather than the building name for destinations on campus.”
— Delaney Delgadillo, 19, Freshman at Indiana University
“When I use the apps to track the buses at IU, the screens are small and can be hard to track a bus route. On top of that, there isn’t really an indication of what direction the buses are going, you just have to know which can be really annoying especially when a bus is stuck in traffic.”
— Slesarev-Nogami, 22, Sophomore at Indiana University
Ideation
Main Concepts for Public Transit Mobile App Design
User-Centric Interface
Our first concept emphasizes a user-centric interface, ensuring ease of navigation for all users. This design would incorporate intuitive icons, a clean layout, and a simplified menu structure. The goal is to minimize the learning curve and make the app accessible for users of all ages and tech savviness.Real-Time Updates and Notifications
The second concept focuses on providing real-time updates and alerts. Users would receive live information regarding schedules, delays, and service changes. Additionally, customizable notifications could be set based on user preferences, ensuring that commuters are always informed about their routes.Integrated Trip Planning
Our third concept incorporates an integrated trip planning feature. This would allow users to input their starting point and destination, and the app would generate multiple transit options, including walking directions and estimated arrival times. Integration with other transportation services, such as bike-sharing and ride-hailing, would enhance the overall commuting experience.
These concepts reflect our commitment to creating an efficient and user-friendly public transit app that meets the needs of the community. Each idea has been carefully considered based on feedback and insights gathered through discussions with stakeholders.
Concept 1: Home Page/Map UI
After quick sketches, our team identified some UIs to address inefficiencies found in our research. The following sketches for our first concept show the home screen and the initial map displayed when the app is launched.
This second concept was another pain point that we noticed in our research - ETA accuracy. The sketch shows several mobile screens which allows users to view the following;
Bus/destination
List of buses to take
ETA of a specified bus
Announcements of traffic incidents
The user’s student ID card (if applicable)
Concept 2: ETA UI
Concept 3: Carbon Footprint Tracker
This concept aims to highlight the importance of self-awareness in transportation. Our group concluded that, with advancing technology, people should be able to easily track their carbon footprint from travel. Through research, interviews, and reviews of existing bus apps, we found that no app currently lets users track their transportation-related footprint.
Low Fidelity Prototype
After making mockups and paper wireframes, we gathered to create a simple prototype in Figma. There are four main pages: the home page with the map, the announcement page, user settings, and a gamified carbon emissions tracker page.
Home UI
Announcement page
User settings
Carbon Footprint Leaderboard
-
The home UI has a nav bar and two search icons in the top right corner. These are clickable buttons. When the ‘Routes’ button is clicked, an overlay shows all Bloomington bus routes, both on campus and in the city.
-
Clicking the announcements button displays a popup with bus announcements. Users can also filter the buses they want updates on, ensuring a clean and helpful experience.
-
On the user settings page, accessible by clicking the profile icon, there are three buttons. The first shows the student ID card for quick access for drivers. The second lets users change the color of their bus route. The last button opens the Carbon Footprint leaderboard page.
-
This page has a button that shows the user their carbon footprint and other information. Users can also contact us with any concerns.
Usability Plan, Test and Results
Plan
The following scenarios focus on exploring features of the IU Bloomington TransEase bus app for campus students. This includes students seeking a fun way to be environmentally conscious and those needing quick access to bus information. We will use these scenarios to help users perform tasks, engage with Bloomington TransEase features, and assess their effectiveness and usefulness.
Scenario 1 (Checking carbon emissions)
You and your friends have been using the bus system a lot more recently. You make a bet with them to see which of you can save the most amount of CO2 emissions by the end of the week. At the end of the week you go to the TransEase app to check your status.
Task 1: Find your rank number in the CO2 leaderboard.
Scenario 2 (Filtering announcements)
On a Wednesday afternoon, you are trying to get from the IMU to the Library with bus 6. Upon opening Bloomington TransEase, you recalled that your friends have complained to you about the unexpected traffic incidents or bus driver break that make the busy afternoon even more difficult to take a bus. To examine whether you should still take the bus or app, you want to be able to know if there will be unexpected incidents that lengthen the bus ride.
Task 2: On the home page, navigate to the announcement page to see all recent announcements. Filter bus 6 to only see announcements on the bus you want to taken
Test (Two Participants)
Participant 1: Sharon Chou, 19 years old, student at Indiana University Bloomington
The person tested is a freshman at Indiana University Bloomington studying in Marketing. She fits into the target user demographic. The test was conducted on April 4th in an open space. After stating our project, testing purposes, and getting consent, Sharon was asked to engage with the prototype
Participant 2: Delaney Delgadillo, 19 years old, student at Indiana University Bloomington
A freshman at Indiana University similarly fitting into our demographic group. The user test was conducted on April 5th in a dorm room area. This was a comfortable spot for the user and allowed her to openly voice out as she walked through the app tests. It was noted to the user that they were able to stop participating during any point during the test. After receiving the users consent, the scenarios were read. When completing the tasks, Delaney had moments of hesitation or visual confusion and this was noted
Results
Participant 1: Sharon Chou
Problem #1 - Finding the CO2 emission leaderboard
The user was confused by the instructions to “find the leaderboard to see your CO2 emissions and ranking.” We did not make this important feature obvious on the home page. Since it is a new feature, users struggled to find it and spent time clicking on every button. Several users have pointed out this issue, and we are committed to adding a dedicated, clear button for this page on the home page.
Problem #2 - The font size on the leaderboard page
On the leaderboard page, we asked the user for layout and design feedback. She found it hard to focus on the message because the font was too small. As a result, she lost interest in the environmental impact of her transportation choice and the innovative feature. To fix this, we will increase the font size and adjust the visual layout to better highlight the user's ranking.
Problem #3 - The filter icon
When asked to filter announcements for bus 6, the user easily found the announcement tab but hesitated to click the filter icon. She recognized it as a button but was unsure of its purpose. Driven to complete the task, she clicked various options until she found the filter. We determined that the confusion stemmed from different perceptions of the filter icon. A possible solution is to examine filtering icons from other apps and choose a universal one.
Participant 2: Delaney Delgadillo
Problem #1- ‘Clickability’ of buttons
While doing the tasks, I noticed participant #2 needed to click a button multiple times to reach the desired page. During our app development, we planned for the text to lead to the next page when clicked, but we did not connect many text items with the button shapes on the home page. To resolve this, we should ensure that the entire area of a button takes users to the right screen, rather than just a small part. The participant also pointed out that the announcements button is too close to the iPhone's home screen bar. We can address this by examining how other apps space their features from this bar. Fixing these problems will save users time and reduce frustration while using the app.
Problem #2- Home page icons
After both tasks, I asked participant #2, “How can we improve the app?” She mentioned issues with the app's design and inconsistencies in using image icons. We can address this by adding icons and labels for all tabs on the home page, not just for the settings page. This would help users understand the purpose of each button better.
Insights / Design Recommendations
To create a minimalist design, we should reduce clickable options on the main page. Hiding the top bars or minimizing their visibility will greatly simplify the main map page and improve navigation.
The carbon emission tracker should be prominently displayed in the app. A navigation button on the homepage will let users access it easily when they open the app, highlighting this important feature.
Placing a help button on the main or settings page will help users better understand the app's features. Moving it to the carbon emissions page makes it harder to find.
Enhance buttons in the app with standardized icons when possible, and ensure all buttons respond correctly to user actions.