/CASE STUDY

Designing the Foundation at
Providence Health.

Designing the Foundation at
Providence Health.

Led the strategy, design, and rollout of Providence Health’s first centralized design system, establishing a shared, accessible foundation that improved consistency and accelerated delivery across teams.

Led the strategy, design, and rollout of Providence Health’s first centralized design system, establishing a shared, accessible foundation that improved consistency and accelerated delivery across teams.

Led the strategy, design, and rollout of Providence Health’s first centralized design system, establishing a shared, accessible foundation that improved consistency and accelerated delivery across teams.

Magnus

OVERVIEW

Providence Health is a large, multi-brand healthcare organization shaped by rapid growth and acquisition. By 2021, its digital ecosystem had fractured. Patient- and staff-facing products shared little visual or structural consistency, accessibility risk was rising, and teams were repeatedly rebuilding the same UI patterns in isolation. I was brought in to lead the strategy, design, and rollout of Providence’s first centralized design system.

Magnus

MYROLE

I served as Lead UX Designer, responsible for end-to-end design system strategy and execution. This included auditing production experiences, defining system architecture, designing components and tokens, establishing governance, and driving adoption across design, product, and engineering. I partnered closely with front-end engineers, content strategists, and clinical stakeholders, and was accountable not just for launch, but for long-term sustainability.

THEPROBLEM

Teams were solving the same interface problems repeatedly without shared standards. Functionally identical components looked and behaved differently across products, creating inconsistent patient experiences for critical flows like finding care or managing appointments. Accessibility violations were common, increasing compliance risk. Internally, delivery slowed as teams debated patterns, rebuilt UI, and accrued technical debt.

This was not a tooling issue. It was a systems and trust problem.

Magnus

THEGOAL

Create a centralized, accessible, and scalable design system that improves consistency and usability while accelerating delivery. The system needed to meet WCAG 2.1 AA standards, integrate cleanly with engineering workflows, and allow teams to move fast without fragmenting the UI again.

APPROACH

I structured the work across five phases: Empathize, Analyze, Define, Educate, and Implement. This framework kept decisions grounded in real production issues and treated adoption and governance as UX problems rather than rollout tasks.

EMPATHIZE

I led a comprehensive UX and accessibility audit across ProvidenceHealth.org and related platforms, reviewing over 200 pages and flows. The audit revealed widespread layout divergence and more than 140 accessibility issues related to contrast, keyboard navigation, and semantic structure. Findings were prioritized based on patient impact and remediation effort, creating a clear case for systemic change.

ANALYZE

I inventoried the existing UI ecosystem and identified over 180 unique components and variants, many of which were functionally identical but visually inconsistent. In parallel, I studied mature systems including IBM Carbon, Material Design, and the NHS Design System to evaluate token strategies, documentation models, and governance patterns. This analysis informed a system architecture designed specifically for healthcare accessibility and enterprise scale.

DEFINE

I designed a unified component library supported by a tokenized foundation for color, typography, spacing, and motion, all WCAG 2.1 AA compliant. Components and tokens were designed to map cleanly to front-end implementation, reducing ambiguity during build and ensuring consistency in production.

KEYTRADEOFF

A critical early decision was choosing flexibility over pixel-perfect rigidity. A stricter system would have enforced consistency faster, but risked resistance from autonomous product teams. I intentionally allowed controlled variation through tokens and composable components, prioritizing adoption and long-term sustainability over short-term uniformity.

EDUCATE

I led recurring workshops and working sessions with design, product, and engineering teams to onboard the system and align on usage standards. Early feedback showed confusion around when to reuse versus extend components, which initially slowed adoption. I addressed this by simplifying contribution guidelines and adding concrete examples pulled from active production features.

IMPLEMENT&GOVERN

The design system launched as the default foundation for new digital initiatives. I partnered closely with engineering to ensure the system was not only documented, but actively adopted in production code through clear contribution paths, versioning, and governance checkpoints.

IMPACT

Component reuse increased significantly, time to ship new pages decreased, and post-launch accessibility defects dropped. Alignment between design and front-end implementation reduced rework and accelerated delivery across teams.

BUSINESS&USEROUTCOMES

Patients experienced more predictable and accessible interfaces across Providence’s digital ecosystem, reducing friction during high-stress healthcare interactions. Internally, teams shifted focus from rebuilding UI to improving feature quality and outcomes. The design system became a shared language aligning design, engineering, and product strategy.

REFLECTION

Successful design systems are not about control. They are about enablement. Treating governance, accessibility, and education as first-class UX challenges was essential to sustained adoption. The result was a system that scaled with the organization and delivered measurable improvements in both experience quality and delivery velocity.

Nathan Gordon

TM

All Rights Reserved 2026