Overview
As a UX Design Intern at Sound Transit, I spearheaded a project focused on the integration of real-time crowding information into our digital platforms, aiming to elevate the rider experience by providing transparency about train occupancy levels.
Roles
Design Research
UX Design
Design System
Team
Myself Independantly
Outcomes
My designs and strategic insights were presented to Sound Transit leadership, influencing long-term project design and iterations.
Approach
Competitive Analysis
Desk Research
Journey Map
Problem Statement
Requirements
Apply style guide
Create new components
Mock-ups
Usablity Testing
Annotate
Next Steps
Problem
Solution
I proposed the integration of crowding indicators into the trip planner and route schedule interfaces on the Sound Transit website, enabling riders to make informed travel decisions.
Project Goals
Identify optimal display points for crowding information on Sound Transit’s platforms.
Analyze competitor applications to benchmark crowding information presentation.
Develop mock-ups integrating crowding data.
Formulate a comprehensive design system for seamless handoff.
How might we… ...effectively integrate crowding information into Sound Transit’s digital interface?
Design
Components
Based on the competitive analysis and common design patterns for crowding information, I made components that could be inserted into the trip planner and real-time arrivals pages of the Sound Transit website. One area of improvement I found within my competitive analysis is communicating crowding levels in multiple ways. Many of the examples in the competitive analysis only used icons to communicate crowding levels, and some of the icons were quite small for the screen making it hard to see and understand what the crowding icons might mean.
The components I made used an easy-to-understand 3-level crowding scale utilizing icons and text as well as consistent spacing and font size. I used Figma’s auto-layout feature to build the components with consistent sizing and spacing. My components and working documents can be seen at this link. Colors and text styles were used from the existing Sound Transit style guide.
Using both visual icons and text is a good practice for accessibility and reaching a broad audience. My design challenge was improving on what I saw in the competitive analysis and designing components that used both text and graphics.
I made examples of two versions, one using color to communicate crowding levels, and one using only two colors. Both included text.
Core Components
At the core, a simple system needed to be established that would communicate crowding levels at a glance with high level information. These components are meant to be an overview of a general crowding level on a trip. The components were created for different areas within the ST website and used existing style guides for consistency.
Car by Car Detailed Component
I made components for the trip detail view to be inserted when people were already on their trip. Desk research showed that having access to car-by-car crowding information can enhance a commuter’s journey by allowing them to make informed decisions about which car to board. This detailed view caters to comfort preferences, aids in maintaining personal space, and can help distribute passengers more evenly across the train, potentially speeding up boarding times and improving overall satisfaction as well as improved operations. For passengers concerned with health and safety such granular information empowers them to minimize close contact and choose less crowded spaces, thereby improving perception of health and safety.
I began with an initial iteration that presented a detailed view of the train cars' crowding levels, indicated by colors. Accompanying text identified the train's direction, clarifying the location of the train's front and back for users. In the second iteration, icons were introduced alongside the color coding to aid users who are colorblind, thus incorporating iconography into the design for enhanced accessibility. This modification came in response to stakeholder feedback highlighting potential accessibility concerns. Different stop names were integrated into the text areas to test the consistency of the design based on length. However, subsequent iterations will need to test the inclusion of stop names in various languages to ensure comprehensiveness.
Mock-Up Integration
After refining the components, they were integrated into mock-ups of the trip planner and stop viewer on the existing website. By incorporating these details into the trip planning and real-time arrivals interfaces, we can visualize and test how users may interact with this feature. These high-fidelity mockups approximate the final product's appearance and are testing-ready.
Trip Plan View of Low Crowding
Above is a mock up of the trip plan view showing low crowding. The top icon represents an overall crowding level while the train icon shows car level crowding.
Trip Plan View High Crowding
Above is a mock up of the trip plan view showing high crowding. The top icon represents an overall crowding level while the train icon shows car level crowding.
Testing
I was not personally able to see through the testing phase before the end of my tenure at Sound Transit. A sample of recommendations for testing the design components and areas of integration are as follows.
Task analysis:
Tasks:
Find out how crowded the next train is
Compare the crowding levels of different upcoming trains
Locate detailed information about crowding such as where the least crowded car on the next train might be.
Survey:
Rate how easy or difficult it was for you to understand the crowding levels.
Rate how easy it was to find information on crowding on the trip details page.
Rate how easy it was to find crowding information on route pages.
Provide feedback on which visual cues helped most in understanding the crowding information.
Do you have any other feedback on real-time crowding information?
This project shows how small feature additions can make a big impact on customer experience and can be integrated into existing design systems. Real-time crowding information is becoming more common within the competitive landscape and provides great value to transit riders. Given this, there are opportunities for improvement on the communication of transit information and standardization within the field.
Consider multiple ways to communicate information
Simplicity can have a big impact
Identify the areas within your transit service where this information will be the most impactful
Next Steps
Conduct user testing with a wide range of transit riders and iterate and refine based on feedback.
Keep up with what is happening in transit design and communication standards.
Expand design system components and document in Zeplin for development handoff.