Safety and Security Hub_

Metro’s safety section on metro.net was one static, text-heavy page. Over 2.5 months I redesigned it into a Safety & Security Hub with five pages:

• Safety & Support landing
• Rider Guide
• By the Numbers
• Safety Team
• Report an Issue

The hub is live at metro.net/safety-support.

What wasn’t working

• Invisible safety work. Metro had more ambassadors, officers and security teams on the system, plus cameras across stations and vehicles, but riders rarely saw this work. That gap fed concern and misinformation.
• A static page. One long page of text blocks, hard to navigate and with no numbers.
• No way to keep up. The page couldn’t show safety measures that change month to month.
• Reporting at the bottom. The way to report an issue was the last thing on the page.

Four audiences, four questions

The goal

• Give riders the safety information they need, with clear next steps
• Build transparency with data-backed storytelling
• Drive engagement with interactive data visualizations and actionable content

1. 01DiscoverStakeholder kickoffs and the project brief
2. 02UnderstandRider survey, interviews and a review of other agencies
3. 03DefineKey insights and audience needs
4. 04IdeateSolution mapping and feature prioritization
5. 05DesignWireframes, prototypes and a mobile-first UI
6. 06Hand offDeveloper handoff and support through implementation

Aligning with Metro’s vision

I led the stakeholder meetings to agree on goals and objectives for the hub.

• A structured kickoff questionnaire surfaced priorities, challenges and expectations from executives, PR, law enforcement representatives and the data lead
• With the project manager, I turned the answers into a project brief covering strategic goals, key milestones, timeline and deliverables
• The brief became the shared reference that kept the cross-functional team aligned

Understanding rider needs

• Designed and ran a survey on metro.net about riders’ safety concerns and expectations
• Interviewed riders, Metro staff and transit advocates about how they perceive crime and security
• Reviewed how other transit agencies communicate safety, to find best practices

Key user insights

Riders told us they value four things. Each one became a job for the hub:

Finding the story in Metro’s own reports

• Reviewed Metro’s Board reports, monthly safety emails, weekly dispatches and employee safety updates
• Pulled out the safety information that matters most to riders
• Found the structure for the homepage in Metro’s three safety pillars

Information architecture

• Ran brainstorming sessions for solution mapping and feature prioritization
• Structured the homepage into clear content blocks
• Outlined the pages around it in four areas: Metro’s Performance, Our People, Our Initiatives and Programs, and Data and Transparency
• Shipped five pages: Safety & Support, Rider Guide, By the Numbers, Safety Team and Report an Issue

I built the hub around a story of action, accountability and progress, so Metro’s safety work and the numbers back each other up.

Reporting comes first

• Three ways to report right under the hero: the Transit Watch app, 911 and a text line (213.788.2777)
• Clear calls to action that explain the Transit Watch app and link straight to it
• A Report an Issue button in the hub’s navigation

Three pillars, each backed by numbers

• Eyes on the system: more visible Metro Ambassadors, law enforcement and security teams, plus cameras across stations, stops, trains and buses
• Used for transit, and only transit: TAP-to-Exit to encourage fare payment, and sound-based deterrents to reduce loitering
• Partnerships for societal issues: crisis response teams, and outreach that connects people experiencing homelessness to housing and services
• Each pillar leads with a plain-language headline and a stat block, such as cameras, customers helped, fare checks and people placed in housing

Numbers with context

• Chose the key crime metrics: most reported crimes, total arrests, and trends by location and time
• Balanced them with Metro’s response: law enforcement, Metro Ambassadors and security installations
• Designed standardized chart templates with Systemwide, Bus and Rail views, comparisons with last month and last year, time ranges, and a context note under each chart
• Built the templates as modules that Metro’s teams can update on their own
• Audited Metro’s Crime Dashboard so safety data looks consistent across platforms

Wireframes and prototypes

• Low-fidelity wireframes to set content hierarchy and flow
• Interactive prototypes to test usability with stakeholders and selected users
• A mobile-first approach for accessibility and responsive layouts
• Reused components from the Customer Experience Hub I designed for Metro, for speed and brand consistency

Content and visual design

• Partnered with PR and the content team on a clear safety narrative
• Worked with Metro’s Art Department on imagery
• Designed to WCAG 2.1 AA accessibility standards
• Worked closely with developers through implementation

• Easier access: intuitive, streamlined access to safety resources and reporting
• More trust: data-backed storytelling made Metro’s safety efforts more transparent
• Clearer numbers: simplified statistics improved comprehension
• Faster delivery: component reuse sped up design to development, within a tight deadline
• A go-to reference: Metro leadership, media and stakeholders use the hub for safety updates
• Still live: in October 2026 the hub keeps the same structure and shows August 2026 figures