Wellbeing

Designing Clear Pathways to Mental Health and Substance Use Support

Overview

In partnership with the British Columbia Government, I led the end-to-end design of a publicly accessible Mental Health and Substance Use website. This initiative was part of a province-wide effort to provide clearer access to mental health supports, services, and educational content for individuals, families, and care providers.

Problem

British Columbians seeking help for mental health or substance use often encountered fragmented, confusing, or clinical online resources. The department’s goal was to build a trusted, user-centered website that simplifies access to support, aligns with service standards, and reflects empathy for people in crisis.

My Role

Title: Lead UI/UX Designer

Team: Ministry stakeholders, content strategists, and developers

Responsibilities:

  • Led competitive analysis and user research

  • Developed site-wide information architecture

  • Created wireframes, prototypes, and high-fidelity UI

  • Built and maintained a design system aligned with BC Government standards

  • Conducted usability testing and iterations across design phases

Process

1. Discovery & Briefing

Started with a department brief and collaborated with the project team to clarify user goals and project direction.

2. Competitive Analysis

Audited mental health websites globally to identify usability best practices.

3. Defining the Problem

Workshops confirmed the need for clearer navigation, accessible language, and mobile-friendly access.

4. Information Architecture

Created a user-centric content structure prioritizing urgent needs and reducing friction.

5. Wireframes & Iteration

Low-to-mid fidelity wireframes iteratively refined through continuous stakeholder feedback.

  • Home

  • Supports

  • Articles

  • Stories

6. Design System & Mockups

Developed accessible visual design with calming, clean aesthetics while following BC Government guidelines.

  • Colour Palette

  • States, spacing scale, border radius

7. Prototyping & Usability Testing

Tested task-based flows with remote users through multiple rounds of testing to evaluate clarity and effectiveness.

8. Launch & Enhancements

Launched with extensive promotion; ongoing improvements after launch included service filtering and mobile optimisation.

Outcomes

  • High public traffic at launch and strong positive user feedback

  • Increased discoverability of crisis and localized services

  • Adopted as a reference implementation by other government teams

Reflection

This project showed how accessibility, empathy, and systems thinking can converge to create high-impact public sector tools. I’m proud to have contributed to a site that supports real people in moments of vulnerability.

Tools & Skills

Tools: Axure, Figma, Jira, Optimal Workshop, Drupal

Skills: UX Research, IA, Wireframing, Prototyping, Accessibility, Government UX