Case Study · UX & Visual Design

TransitFlowCommute Intelligence.

Shifting a payment utility into a proactive commute assistant — by listening to what users actually needed.

Mobile App UX Research Interaction Design Visual Design Wearable UX Figma · InVision
10
Users Interviewed
3
Core Systems
Device Ecosystem
TransitFlow App
Final high-fidelity mockups — phone + watch ecosystem
Overview Research Solution Decisions Process Final Designs Outcomes
The Problem

Commuters weren't missing rides because of bad routes.

City commuters had route knowledge. What they lacked was reliable time perception during chaotic morning routines — and a payment system that didn't create last-minute anxiety.

Missing a train isn't usually about ignorance of the schedule. It's about the compounding chaos of a busy morning — until suddenly the window is gone.

The Design Challenge

"How might we design a system that helps commuters stay on time while simplifying transit payments and trip awareness?"

Pain Points Identified
💳
Unexpected balance runouts
Card hit zero at the gates — no warning, no fallback
⏱️
Unreliable time perception
"Five more minutes" turns into a missed train
🔄
Delayed top-up updates
Topped up balance didn't reflect until too late
😰
Compounding morning stress
Small delays stacked into missed connections
The Pivotal Insight from Research

The real problem wasn't payments. It was timing.

Transit Wallet Proactive Commute Assistant
User Research

What 10 Toronto commuters actually told me.

I conducted in-depth interviews with 10 transit users aged 28–45, all regular TTC and GO Transit commuters. The goal wasn't to validate assumptions — it was to find out what was really breaking down.

User InterviewsCard SortingOptimalWorkshopPersona Development
  • Insight 01
    Reliability beats features, every time
    No one wanted a powerful app. They wanted a frictionless way to arrive on time without thinking about it.
  • Insight 02
    Payment anxiety is a timing problem in disguise
    The stress of a low balance was the fear of being stuck at a gate when a train was departing.
  • Insight 03
    Morning routines break time perception
    Participants consistently misjudged how much time remained before they needed to leave.
  • Insight 04
    Glanceable information wins over dashboards
    No one had the headspace to open and navigate an app — the answer had to surface itself.
Personas

Two patterns emerged clearly — both pointing to the same core need: automation and minimal interaction.

👔
Chris
The Focused Professional
  • Daily GO Train commuter
  • Values reliability above all
  • Wants reminders — never misses his train
  • Zero patience for app complexity
📱
Terri
The Busy Multitasker
  • Multi-line commuter
  • Juggling work + family
  • Needs quick payments, simple alerts
  • Often distracted at critical moments
The Solution

Three integrated systems.
One seamless commute.

TransitFlow reduces commuting friction through three systems designed to work together as a single invisible assistant that runs in the background of your morning.

01
System One · Payments
Smart Transit Wallet

Removes payment anxiety entirely so commuters can focus on what actually matters — getting out the door on time.

  • Real-time balance visibility at a glance
  • Automatic top-up below a user-set threshold
  • Quick NFC tap — no app-open required to board
Eliminates the payment anxiety loop — mental energy shifts entirely to timing.
Wallet Screens
02
System Two · Core Feature · Timing
Predictive "Leave Now" System

The centrepiece. Answers the one question that matters most: when should I leave to make it on time? — without asking the user to check anything.

  • Learns commute patterns (e.g. 7:30–9 AM windows)
  • Tiered alerts: ambient → haptic → alarm as departure approaches
  • Adapts in real-time: "You can leave 8 min later — delay on Line 1"
🎯Key principle: one recommended action, not multiple options. Hesitation costs trips.
Leave Now Screens
03
System Three · Wearable · Cross-Device
Watch-First Progressive Interface

Designed for real-world context — rushing out a door with coffee in hand. The watch handles what the phone shouldn't have to.

  • Glanceable alerts and haptic feedback on wrist
  • Progressive disclosure: shows only the next required step
  • Leave → NFC tap → board → fare confirmed. That's it.
Reduces cognitive load to near zero during the highest-friction moments of the commute.
Watch Interface
Why I made these choices

Design decisions that required real justification.

These weren't obvious calls. Each one came from research, with a clear alternative deliberately rejected.

Decision 01
One action, not a menu
Multiple departure options felt helpful in testing, but caused hesitation. A single "Leave now" CTA reduced decision time — commuters want to be right, not to choose.
Decision 02
Watch handles the moment of truth
The highest-friction moment — about to board, hands full — is when a phone is hardest to use. Routing core interactions to the watch wasn't a nice-to-have — it was the whole point.
Decision 03
Suppress delay info until it changes the decision
Showing real-time delay data constantly created anxiety. The system only surfaces delay updates when they actually change what the user should do next.
Decision 04
Auto top-up as default, not opt-in
Requiring users to "enable" auto top-up meant most wouldn't. Payment anxiety was universal — making auto top-up the default (with easy opt-out) was the right call.
Decision 05
Progressive disclosure over dashboard
Every screen shows only what the user needs at that moment. The "full" UI is only ever revealed if deliberately sought — busy mornings demand simplicity, not feature completeness.
Decision 06
Tiered alert escalation
A single notification is easy to ignore. A tiered system — ambient → haptic → urgent — mirrors how real urgency builds and aligns with how people respond to approaching deadlines.
Process Artefacts

From card sorting to hi-fi prototype.

Research → architecture → wireframes → design system → mockups. Every visual decision grounded in user need.

Card Sorting
IA · Research
Card Sorting via OptimalWorkshop
Validated how users expected to navigate transit features — avoiding designer-centric IA
IA Flows
Information Architecture
User Flows — Account & Card Linking
Primary task flows mapped before wireframes — ensuring navigation matched mental models
Sketches
Ideation · Sketching
Early Concept Sketches
Lo-fi sketches to explore layout and interaction patterns before committing to digital
Design System
Visual Design · Design System
Component Library & Style Guide
Living style guide covering typography, colour tokens, button states, and UI patterns
Final High-Fidelity Designs
TransitFlow Mockups Level 1 TransitFlow Mockups Level 2
What This Project Delivered

A commute that works with you, not against you.

  • Reduced missed rides
    Predictive leave reminders surface at the right moment — eliminating the "thought I had more time" failure mode
  • Eliminated payment anxiety
    Auto top-up and real-time balance visibility removed the last-minute card panic entirely
  • Raised commuter confidence
    Users reported feeling "in control" of their commute — a significant shift from baseline anxiety
  • 0
    Cognitive load at boarding
    Watch-first progressive disclosure reduced the boarding interaction to a single wrist glance
What I Learned

Commuting is a behavioural problem, not a transit one.

  • 🔍Reframe the product, not just the UI. The biggest design decision happened before a single wireframe — shifting the product concept entirely.
  • 🧠Passive assistance beats active features. The most impactful moments were in the background, quietly preventing failure.
  • Context is everything in cross-device design. The same information lands completely differently on a watch vs a phone.
  • 📊Progressive disclosure reduces cognitive load by elimination, not compression. Show only what the user can act on right now.
  • ✏️Early wireframing prevents expensive late-stage pivots. Lo-fi first, always — especially when the core flow is still uncertain.
Next Case Study

Rival —
Social Fitness
Experience.

Transforming solo exercise into a social, habit-forming system grounded in behaviour science and social psychology.

View Case Study →
Rival Case Study