TTSee
Wireframing
Usability Testing
Prototyping (Lead)
Figma & FigJam
Miro
Canva
Adobe Photoshop
Kelly Bang
Catherine Cassels
Daniel Henderson
Shobhit Srivastava
& Myself
Problem
How might we improve Toronto's public transit riders' experience during their commutes, which are riddled with service disruptions?
- A key part of many Torontonians' lives is using the city's public transit system, the Toronto Transit Commission, to get around the city using busses, subways, and streecars
- Over 57.6 million customers boarded a TTC vehicle in 2022 and ridership is not slowing down
- TTC was the least reliable transit service among all municipalities in the Greater Toronto Area in 2022
Results
- Utilized IBM's design thinking framework to improve the experience of Toronto's public transit riders, including flows that allow users to save frequent routes, sign up/receive disruption push notifications, and view recent updates for all routes
- Conducted preliminary research, user interviews, surveys
- Led the prototyping studio/sprint, creating low-to-high fidelity prototypes for three flows
- Conducted two rounds of user testing
- Delivered three playback presentations to communicate research and designs to industry judges and professors, receiving high praise for storytelling abilities
I utilized this framework and methods throughout this project.
.png)
So, how bad was the problem?
To discover the current issues with the TTC, we researched online through news articles and Reddit threads. The team then grouped similar issues together thematically on a Miro board.
We also conducted 12 user interviews and distributed a survey that received 41 responses.
.png)
Research Findings
Our research pointed us towards glaring pain points.
- Inconsistent service – sudden route changes, delays or no-shows, skipped stations all resulting in wasted time, being late, and overall negative sentiments towards the TTC.
- Lack of information – inaudible subway announcements, unexpected closures, abrupt disembarkment, unavailable/unhelpful staff, and a lack of clarity in next steps after disruptions.
- Overwhelming & incorrect information sources – participants used digital tools such as Google Maps, TTC.ca, and Twitter/X, but often found incorrect information or were overwhelmed by the amount of irrelevant information from these tools.
We developed a persona, empathy map, and needs statements to converge our research findings.
.png)
Needs Statements
Penelope the Passenger needs a way to:
- Be made aware of TTC service disruptions before leaving, so that they can plan around the disruption to stay on time.
- Quickly find re-routing options when TTC service disruptions occur, so that they can make prompt and informed decisions.
- Efficiently narrow TTC information updates, so that they can find route-specific information, avoiding information overload.
As a team, we generated over 100+ ideas to address Penelope's needs.
During a group brainstorming session, the team generated ideas that addressed the needs of our persona, Penelope. These ideas ranged from big ideas, to downright absurd ones—no idea was too strange.
We then grouped similar ideas together, coming up with the finalized set of ideas below. All team members were given 6 votes for impact, and 6 votes for feasibility. The group analyzed results to determine overall impact and feasibility of each idea.
.png)
We plotted all ideas according to the votes on a grid, prioritizing the most feasible and impactful ideas.
Low-fidelity
I visualized each idea by sketching it out with pencil and paper. We focused on the three most impactful & feasible flows.
Several team members created low-fi sketches for each of the three task flows. The group then had a meeting to discuss which elements were the best to incorporate into the MVP, and one member compiled the best ideas into a single low-fi sketch.
Below are the wireframes I sketched for each of the three flows, of which many ideas were eventually incorporated into the next iteration.
Lean Evaluations
To quickly validate our assumptions, we asked two participants what they thought of our low-fi designs.
.png)
Mid-fidelity
We turned our low-fi sketches into a digital mid-fi design, iterating with the feedback we received.
A mid-fidelity prototype was created on Figma after incorporating changes from the low-fidelity sketches by three team members (myself, Shobhit, and Dan).
Testing
We tested again, this time with three participants going through our mid-fi designs.
The team tested the mid-fidelity iteration by conducting usability tests with three participants.
We had these goals for usability testing:
1. Uncover pain points in each of the three flows.
2. Access whether users will find this app useful.
3. Find out if users find any particular parts of the app enjoyable.
After this usability test, our team delivered a presentation on our entire project up to this point.
As this was the final class of the semester, this presentation summed up our work as a group. Industry judges, our professor, and other students gave input on our project and how we can improve it, critiquing our prototype, slides, and presentation itself.
Any work completed after this point was accomplished individually.
High-fidelity
It was time to create the prototype in high-fidelity.
I created a design system that drew inspiration from TTC’s existing typography and colours, so that it would look cohesive when users use the app while they were riding TTC transit. I chose a lighter shade of red as the main pop of colour for the buttons, because the darkest shade signalled too much urgency and may evoke additional stress onto the user during their commute.
Besides updating the aesthetics, I also incorporated feedback from the most recent usability test findings with our three participants.
Here are examples of how I changed the mid-fidelity (created by the group) to high-fidelity (created individually) based on feedback from participants during usability testing:
The Problem
Service disruptions occur often during commutes on the TTC, but Toronto’s public transit riders cannot easily retrieve reliable and timely information about these disruptions.
The Solution
A mobile app where Toronto’s public transit riders can get relevant and timely updates on service disruptions, making their commutes less stressful on the TTC.
Try the prototype below!
Test the high-fidelity prototype again with five representative users to gather more feedback.
This feedback would specifically be around how the visual design could be improved, any feature suggestions that are top of mind. Iterate on this feedback.
Work with a team, including those software development skillsets, and other subject matter experts, to bring the app to life.
Hand over the designs to a software engineer and work collaboratively alongside them to ensure proper implementation. Also, I would seek out advice from SMEs, such as transit planners, TTC employees, and senior UX designers to seek out and address gaps in my designs.
Keep track of key performance indicators (KPIs) upon launch.
Once the MVP launches, monitor key performance indicators (KPIs) like number of downloads, number of trips saved, app ratings, as well as qualitative feedback from users such as feature suggestions.
Over-communicate and stay organized.
Especially important when working with larger teams. This was my first time working with 5 other designers, and communication and organization proved to be a challenge at the beginning of the project, as there was no clear leader in the group to delegate tasks. As a result, I brought up the idea of using a shared task list so that everyone can have visibility into deadlines and ensure tasks were completed.
The importance of research.
This project was quite research-heavy and even then, I know that there is more research that can and should be done, especially on the competitive analysis front. Research is the first step of the design process, and feeds into every other aspect of design.
Storytelling can make for effective idea delivery and feedback gathering.
Our team had to present at three playback sessions with industry experts, who gave lots of great feedback on the project. By practicing my storytelling skills during these playbacks, I was able to learn how to effectively convey ideas within a short time constraint.
You've reached the end of this case study. Thank you for reading!
