VCH Medical StaffWebsite Redesign
A comprehensive redesign of Vancouver Coastal Health's Medical Staff portal — connecting 3,600+ healthcare professionals to the resources they need, when they need them.
VCH Design Department
Brand-consistent asset production across print and digital channels — photography, videography, logo design, print collateral, and interactive e-learning modules developed in Adobe Creative Suite and Articulate Storyline.
Medical Staff Website Redesign
End-to-end brand and UX campaign — research, design system implementation, and high-fidelity prototyping for the VCH Medical Staff portal, reaching 3,600+ healthcare professionals across all Communities of Care.
Creative Production & Learning Design.
Designer, Photographer & Creative Producer.
My first placement at VCH was in the Design department, where I wore many hats across a wide range of creative and digital production work.
What I Did
In the VCH Design department, I executed best-in-class creative assets across a wide range of paid and owned channels. Working under the direction of senior designers, I translated creative briefs into polished deliverables — from on-location photography and videography to branded print collateral, logo systems, and interactive digital learning modules built in Adobe Creative Suite and Articulate Storyline.
Photography & Videography
On-location capture and Adobe Lightroom/Premiere production for internal communications, campaigns, and clinical programs.
Logo & Brand Identity
Designed visual identities and graphic devices for VCH internal programs, ensuring brand consistency across all channels.
Presentation & Template Design
Designed and delivered polished PowerPoint and branded templates for leadership and clinical teams, aligned to brand standards.
Interactive E-Learning — Digital Production
Built multi-channel interactive learning modules for clinical education in Articulate Storyline, responsive across mobile and desktop.
On-location production setup — Sony mirrorless on gimbal stabilizer, VCH Design Department
Clinical Coursework for Nurses & Medical Staff.
I designed and developed two clinical education modules — each crafted to be warm, accessible, and effective for healthcare professionals.
Palliative Care — Nursing Education Module
Designed and produced an interactive e-learning module on palliative care for VCH nurses — translating a clinical creative brief into a fully polished digital deliverable. The module covers the current state of palliative care in Canada, clinical frameworks, and patient communication, built to be warm, accessible, and navigable across both desktop and mobile. Visual identity uses a soft earthy palette, ensuring the brand expression aligned with the sensitivity of the subject matter.
Palliative Care Module — Desktop view (landing) & interactive content slide
Epilepsy Clinic — Room Finder Module
Developed a mobile-first interactive e-learning module for the Epilepsy Clinic at Vancouver General Hospital. The Room Finder feature provides maps, guides, and a 360° video walkthrough of the Seizure Unit — translating a complex wayfinding brief into a clear, step-by-step digital experience. Designed with accessibility standards and multi-device digital production as the primary constraints.
Epilepsy Clinic — Room Finder, mobile module at Vancouver General Hospital
UX Research & Portal Redesign.
Understanding the Problem Space.
Medical professionals needed more than a website — they needed a digital home that understood the complexity of their careers.
The Core Problem
The existing VCH Medical Staff website was a child site of the main Vancouver Coastal Health portal, designed without the specific needs of medical staff in mind. It failed to serve over 3,600 physicians, nurse practitioners, midwives, and other healthcare professionals who needed quick access to career resources, policy documents, and internal communications.
The challenge wasn't just visual — it was structural. Information was buried, navigation was unclear, and the site didn't reflect the mental models of medical professionals at different career stages.
Medical Staff site sitemap — information architecture restructured around career phases & Communities of Care
Target Users
- Board-appointed physicians
- Nurse practitioners
- Midwives & dentists with permits
- Medical administrators
- Healthcare coordinators
- All VCH Communities of Care
Project Goals
- Increase user engagement & retention
- Immersive mobile & desktop experience
- Understand & respond to user needs
- Improve navigation & content placement
- Restructure information architecture
- Support all career phases & growth goals
"Medical Staff is a child site of the Vancouver Coastal Health website. It will be redesigned in order to create a meaningful website for all medical staff from all Communities of Care that offers information for all phases of their career, supports developmental goals, and is easy to navigate."
— Project Brief
Reaching 3,600 Medical Professionals.
To design for medical professionals, I needed to hear directly from them — at scale.
The Engagement Strategy
I developed and interrogated a creative brief, proposing Stanford's Design Thinking Process to keep the team aligned with a clear strategic framework, alongside the RASCI matrix for cross-functional accountability. Using Notion as a shared project hub, we executed a two-phase engagement campaign that reached every Community of Care across VCH.
Discovery
Gathering high-level input from stakeholders to define the scope, architecture and core requirements for the redesign.
Design Validation
Sharing prototypes with stakeholders, collecting feedback, and iterating on designs before final handoff.
Engagement Techniques
Focus Groups
Small-group sessions with medical professionals from different departments and career stages — informing the creative brief.
Surveys & Questionnaires
Mass-distributed via newsletters to thousands of medical staff — structured with open-ended, Likert-scale, and close-ended variables for broad data coverage.
One-on-One Interviews
In-depth stakeholder conversations to uncover nuanced pain points and validate design concepts before production.
Print & Digital Poster Campaign
Designed and produced both print collateral and digital assets — physical posters with pre-press file prep placed in doctor lounges, QR-coded to drive digital survey participation.
Automated Scheduling
Process improvement — automation tools let staff self-book, receive calendar invites, and select timeslots with minimal friction.
Content Audits
Assessed existing content across web, print, and digital channels for relevance, findability, and brand consistency.
Print collateral and digital campaign assets — produced with pre-press file preparation for placement across VCH doctor lounges, QR-coded to drive survey participation
Electronic, paper & digital poster variants — pre-press ready, deployed across VCH doctor lounges
Poster design iterations — colour, layout, and format variations explored before final production
The live campaign page is still up — medicalstaff.vch.ca. Scroll all the way to the bottom to see the survey posters in context.
From Sketches to High-Fidelity Prototypes.
Research insights shaped every wireframe. Design decisions were grounded in real user feedback, not assumptions.
Design Principles
After synthesizing focus group insights and stakeholder interviews, I developed multiple design concepts in response to the creative brief — sketching wireframes and translating them into high-fidelity, brand-consistent prototypes. Most designs were produced in a browser-like context to accurately reflect real-world use across all owned and paid channels.
Franchise Design System
I activated and evolved the VCH franchise design system using Figma Variables — defining tokens for colour, typography, spacing, and interactive state across all owned and paid channels. Primary brand colour: Harbour Teal (#006271), desaturated to WCAG 2.1 AA compliance, with a full type scale using HK Grotesk. Every component, template, and style guide was built on this foundation to ensure brand integrity and handoff-ready deliverables across web, print, and digital media.
Aligning on Direction with the Medical Quality Team.
After the research phase, I facilitated stakeholder sessions to synthesize findings and agree on the design direction.
Ideation & Design Direction
I conducted a series of cross-functional stakeholder meetings with senior designers and project leads to synthesize research data and align on brand direction. Using FigJam, we structured the information architecture — chunking content by career phase and department — and established navigational hierarchies grounded in how medical staff described their needs. Designs were reviewed in multiple iterations under the guidance of senior creatives before final production.
A key brand standards artifact from this phase was the MSPE Leader's Guide — a sub-brand document I designed for the Medical Staff Practice Enhancement program, co-branded with Providence Health Care. Produced for both print and digital distribution, it established consistent visual language and brand standards across all touchpoints for department heads across VCH.
MSPE Leader's Guide — co-branded VCH & Providence Health Care document
Collaborative Design in Figma
Design decisions were made collaboratively — working in real-time with senior designers and project leads directly in Figma. The canvas captures the iterative, multi-contributor nature of the work: reviewing prototypes, aligning on content hierarchy, and resolving brand questions together before production.
Active Figma project canvas — MSPE documents, design system, and medical staff working files
Real-time collaborative Figma session — iterating on prototypes with the team
What 8 Months at VCH Built in Me.
Two departments, two different kinds of design — both taught me things no classroom could.
Key Deliverables
Palliative Care E-Learning Module
Full interactive digital production for VCH nurses — brand-consistent across desktop and mobile, built in Articulate Storyline and Adobe Creative Suite.
Epilepsy Clinic Room Finder
Mobile-first multi-channel digital deliverable with 360° walkthrough — produced to accessibility and wayfinding standards for VGH Epilepsy Clinic.
Print & Digital Poster Campaign
Campaign collateral produced for both print (with pre-press file prep) and digital channels — deployed across doctor lounges with QR-coded survey links.
Franchise Design System
Token-based brand design system built in Figma Variables — covering colour, typography, components, and style guides for all owned and paid channels.
MSPE Leader's Guide Sub-Brand
Co-branded print and digital document establishing brand standards and visual language for the MSPE program across VCH and Providence Health Care.
High-Fidelity Prototypes & Templates
ProtoPie and Figma prototypes with micro-interactions, plus reusable templates for web, social, and email — reviewed and approved by senior creatives before handoff.
Key Takeaways
Brand Integrity Across Every Channel
From print collateral and photography to e-learning modules and high-fidelity prototypes — every deliverable had to hold up to the same brand standard. Working across channels taught me that brand consistency isn't just visual, it's structural.
Cross-Functional Collaboration at Scale
Reaching 3,600 professionals across multiple departments required process systems, not just creative effort. Working closely with senior creatives, project leads, and clinicians shaped how I manage competing priorities in a fast-paced environment.
Accessibility Is the Foundation, Not a Feature
Designing for healthcare professionals — many accessing tools under time pressure — meant WCAG compliance wasn't a checkbox. It was embedded into the design system and every production file from day one.
The Final Design — Physician Led Quality Improvement
The primary deliverable of the redesign was the Physician Led Quality Improvement (PLQI) section — a complete overhaul of the page that houses education workshops, collaboration opportunities, course levels, and downloadable resources for doctors across VCH and Providence Health Care. Built on the new design system, it features a teal-forward navigation, clear content hierarchy, and responsive card-based layouts for courses.
PLQI — Education & Workshop page with Introductory and Advanced course cards
PLQI — Resources page with downloadable documents and external links
"The past eight months may have been hectic, but it was a journey of growth."
The experiences accumulated here — the interviews, the learning modules, the audits, the countless meetings — will definitely help speed up the process on future projects. Designing in a real healthcare environment, with real stakes, changes how you think about people-centered design.
Life between the deliverables.
Eight months of real work, real people, and a city that became home. The moments that don't make it into case studies but shape everything.
View from the new office room 🌆
Vancouver skyline from VCH HQ, BC Place in frame
Day One 🪪
VCH Co-op Student badge
Fit check ✅
Office mirror, VCH Design Dept
Halloween 🎃
Showed up as Akatsuki to the office
Caffeine runs ☕
Matcha + boba with the crew
Team coffee walks 🏙️
Lunch break downtown with the team
Team walks 🚶
The whole crew — best way to end the week
On-location photoshoot 📸
Vancouver waterfront at night — BC Place
First paycheck, first gift 🎁
Ted Baker briefcase — treated myself
Production days 🎬
Sony mirrorless on gimbal — on-location videography