Skip to content
Enterprise SaaS · Design System2024–2026

ChartRequest

A unified design system and operations platform for medical records exchange used by hospitals, clinics and legal teams.

Role
Senior Product Designer
Timeline
Ongoing
Platform
Web · Operations Platform
Year
2024–2026

ChartRequest connects patients, healthcare providers and requesters to move medical records securely and compliantly. Over years of growth the product had accumulated inconsistent patterns across dozens of internal and external surfaces. I led the design-system-first rebuild, establishing tokens, primitives and shared components, then applying them to the highest-traffic operations pages.

The Problem

What wasn't working

Every team shipped its own version of the same table, dialog and form. Density, spacing and status language drifted between screens, which slowed engineering and made the platform feel harder to trust for compliance-sensitive users.

Goals

What success looked like

  • Create one token-driven system that light and dark, marketing and product could all share.
  • Reduce time-to-ship for common flows by giving engineers pre-solved primitives.
  • Raise the perceived quality and trustworthiness of every operations surface.
  • Keep daily-use admin pages fast and familiar for power users while modernising the shell.
Research

What I learned first

  • Audited 40+ existing screens to inventory every table, filter, status and empty state.
  • Interviewed internal operations staff who live in these tools eight hours a day.
  • Mapped the real jobs behind each page rather than porting the legacy layout 1:1.
  • Benchmarked against Linear, Stripe and enterprise console patterns for density and calm.
Challenges

The hard parts

  • Balancing a modern shell with the muscle memory of power users on daily-use pages.
  • Defining status language that stays legible across nine+ workflow states.
  • Scaling strokes, radii and spacing so components feel right from chips to full-page tables.
Design Process

How I worked through it

  1. 01

    Foundations

    Defined semantic color tokens, an 8pt spacing scale, radius and elevation. Everything downstream binds to these.

  2. 02

    Primitives

    Built the shared DataTable, StatusPill, ConfirmDialog and PageHeader as the vocabulary every page reuses.

  3. 03

    Application

    Restyled the highest-traffic pages in place, keeping section order and jump navigation intact for daily users.

  4. 04

    Documentation

    Paired Figma library and code so a component means the same thing in design and production.

Wireframes

Structure before surface

Low-fidelity structure first, table density, filter placement and the anatomy of each status before any color went on the screen.

User Flow

The path a user takes

  1. 1Operator lands on a work queue filtered to their role
  2. 2Scans status pills to triage what needs action
  3. 3Opens a record, acts, and confirms through a consistent dialog
  4. 4State updates propagate with the same language everywhere
Final UI

Where it landed

A calm, high-density operations platform where tables breathe, status is unmistakable, and every action feels like part of one system.

Impact

What changed

1
Shared system across product & marketing
40+
Screens audited and unified
Faster
Ship time for common flows
Higher
Perceived trust on compliance surfaces
Lessons Learned

What I took away

  • A design system earns its keep only when the busiest pages adopt it.
  • Restyle in place before you reorganise, respect the workflows people already trust.
  • Tokens are law, but components shouldn't be a ceiling on the best experience.
Reflection

The most satisfying part wasn't any single screen, it was watching the platform start to feel like it was designed by one mind. Consistency, at this scale, is a feature.