UX Research · Service Design

Reimagining the Mission Bay Shuttle

How Might We

Make the Mission Bay Shuttle website more engaging and intuitive for first-time users?

How Might We

Make the Mission Bay Shuttle website more engaging and intuitive for first-time users?

Developed through rider-centered research, this UX study reimagines the Mission Bay Shuttle experience—turning fragmented commuter feedback into actionable design insights for future mobility planning.

Tool

Figma

Google form

Mural

Zoom

My Role

UX Researcher

Survey Redesign

Strategic Pitch

Partners

Peiran Xia

Ning Zhang

Time line

January 2026 -

march 2026

Background · The contexting

A free, daily shuttle carried 213,000 riders in 2023 — running right past our campus. Most of my classmates had never heard of it.

The Mission Bay Shuttle connects students, employees, and residents across one of San Francisco's most dynamic neighborhoods. It's free, it's frequent, and it's nearly invisible. That gap between a service's quality and its discoverability is what this study set out to understand.

213,000

riders

Total ridership in 2023 — a well-used service by the numbers

5 of 6

Participants couldn't find the website or didn't know the shuttle existed

Key Finding

A Free Shuttle Nobody Knew Existed

Six in-depth interviews revealed a striking pattern: riders who knew about the shuttle loved it — but most people had "NO" idea it existed, and those who tried it once often couldn't find it again.

The Ride Experience

Half praised safety, friendly drivers, and uncrowded buses — but first-timers hit friction from poor signage and confusing navigation.

Digital Experience

Most riders use the shuttle sporadically. Only 1 in 6 rides daily. Unexpected holiday closures created service gaps nobody anticipated.

5/6

Usage Patterns

5 of 6 participants found the website difficult to navigate or didn't know it existed. Most relied on third-party apps instead.

Research Method

We didn't just send out a Google Form link. To truly understand the rider experience, we went to Mission Bay ourselves — posting flyers at shuttle stops and street poles, and speaking directly with people waiting for the bus.

On-the-Ground Recruiting

Flyers at shuttle stops, street poles, and campus bulletin boards

Screener Interviews

6 participants screened across rider types and commute patterns

Remote Sessions

Conducted via Zoom with structured discussion guides

Problems

The Problem: Website Discoverability & Usability

A critical challenge for the Mission Bay Shuttle was the website itself. Even though the site exists, first-time riders struggle to understand where to start, how to find route details, and how to use the service confidently.

Current state of the Mission Bay TMA website

(https://missionbaytma.org/)

Current state of the Mission Bay TMA website

(https://missionbaytma.org/)

Current state of the Mission Bay TMA website

(https://missionbaytma.org/)

Findability

Navigation labels are ambiguous, routes are buried two clicks deep, and schedules are split across multiple PDFs. Riders can't tell which page holds what they need.

First-time orientation

The homepage explains the organization but never tells a new rider what to do next — no CTA, no "start here," no onboarding path for someone trying the service for the first time.

Spatial understanding

Stop locations live on a static PDF, real-time tracking is hidden in a sub-menu, and the mobile layout breaks the route map — exactly when riders need it most.

Insight Deep Dive

Polarized Sentiment, One Clear Signal

Overall sentiment was highly polarized. Some participants absolutely loved the service — rating it highly for safety and friendly drivers. Others felt frustrated by the lack of awareness, poor physical signage, and inadequate digital tracking tools.

What Riders Loved

Cleanliness, safety, friendly drivers, convenient routes, and uncrowded buses

What Caused Friction

Inaccurate schedules, invisible physical signage, confusing route maps, and a website most riders couldn't find

What Riders Loved

Cleanliness, safety, friendly drivers, convenient routes, and uncrowded buses

The Magic Wand Wish

Riders didn't want new buses — they wanted informational clarity: better signage, clearer route maps, and a more intuitive website

Design Response

Physical

Wayfinding
at Stops

Install permanent stop signs with the route name, a simplified map, operating hours, and a QR code linking to live arrival time. Permanent signs at every stop: route name, simplified map, operating hours, and a QR code for live arrivals. Right now, nothing marks the stop at all.

I couldn't tell where the stop actually was — there's no signage at all.

“

A new rider can find the stop and see the next arrival without asking anyone

Riders weren't asking for a different shuttle. They were asking for three things: a stop they could find, a schedule they could trust, and a way to know when the bus is actually coming. These solutions respond to exactly that.

Real-time

Wayfinding
at Stops

Wayfinding
at
Stops

I couldn't tell where the stop actually was — there's no signage at all.

“

A new rider can find the stop and see the next arrival without asking anyone

Digital

Website  Information  Architecture

Rewrite the site to answer the rider's actual question. Not "View schedule information" — "Next bus: 4 min at 4th & King." Fix the schedule errors and add route maps that match what's on the street.

The website was hard to find and didn't help me plan anything.

“

Planning a trip takes one glance, not three pages

Physical

Live Tracking

Live
Tracking

Live Tracking

Fix the broken tracker and make it the first thing on the homepage — not buried under menus. Riders told us the existing tracking was so unreliable they stopped trusting it. If they can't trust the arrival time, nothing else on the site matters.

"I just need to know when the bus is actually coming. That's all I want."

“

Riders check their phone instead of standing at the curb wondering

Actionable insights