All Case Studies
Case Study — Healthcare

Patient Portal Redesign

A 12-location Michigan health system needed its patient portal rebuilt from the ground up — reducing call volume, improving scheduling completion, and meeting modern accessibility standards.

UX Research UX Design Development Healthcare
Client
Arbor Health
Industry
Healthcare
Timeline
20 Weeks
Team
UX Research, Design, Development
Arbor Health
Patient Portal Redesign

A Portal That Created More Work Than It Saved

Arbor Health's legacy patient portal had been intended to reduce administrative burden — but in practice, it was generating it. With a scheduling completion rate of just 34%, more than two-thirds of patients who started the scheduling flow abandoned it and called the front desk instead. This created a compounding problem: staff were fielding thousands of calls per month that should have been handled digitally, while patients experienced delays and frustration from wait times that the portal was supposed to eliminate.

The accessibility situation was equally critical. The interface was not compatible with screen readers and failed WCAG 2.1 AA standards across multiple categories — exposing the health system to compliance risk and excluding a meaningful portion of patients who relied on assistive technology. For a health system whose mission centered on equitable care, a non-accessible digital front door was a direct contradiction of their core values.

Our engagement scope was broad: conduct the research necessary to understand the root causes, redesign the complete portal experience from information architecture through UI, rebuild it in React with HIPAA-compliant data handling, and deliver a product that cleared full WCAG 2.1 AA certification on launch day.

Research-Led Design, Built for Real Patients

We began with the most comprehensive UX research effort Arbor Health had ever commissioned: 18 patient interviews stratified across age, digital fluency, and health condition complexity; 6 staff interviews covering front desk coordinators, nurses, and portal administrators; a full session recording analysis of over 400 portal interactions; and an accessibility audit that identified 31 distinct usability issues ranked by severity and frequency. The research painted a clear picture — the portal had been designed around the system's administrative needs, not the patient's mental model of healthcare.

The redesign reoriented the entire information architecture around the most common patient tasks: scheduling, messaging a care team, and reviewing test results. We reduced average task completion to under 4 clicks for each of these primary flows through extensive card sorting and tree testing with patients. The new progressive scheduling experience displayed real-time appointment availability, surfaced provider names and photos, and allowed patients to specify their reason for visit in plain language rather than medical codes.

On the accessibility front, we adopted an accessibility-first component library approach — every UI element was built and tested with screen readers before visual styling was applied. The secure messaging center, appointment reminders, and billing portal were all rebuilt with keyboard navigation, focus management, and ARIA labeling designed in from the start, not retrofitted at the end. The system passed its full WCAG 2.1 AA audit on launch day with zero remediation items required.

Deliverables

  • UX Research Report (31 issues)
  • Journey Maps
  • Accessibility Audit
  • Information Architecture
  • UI Design System
  • React Portal Build
  • HIPAA Compliance Review

Disciplines

  • UX Research & Interviews
  • Accessibility Auditing
  • Information Architecture
  • Interaction Design
  • React Development
  • HIPAA Compliance

Technologies

  • React 18
  • Figma Design System
  • HIPAA-compliant Hosting
  • WCAG 2.1 AA Certified
  • HL7 FHIR Integration

A 20-Week Research-to-Launch Journey

Every phase was gated — we didn't advance to design until research was complete, and we didn't advance to development until designs had cleared accessibility review.

01

UX Research

18 patient interviews, 6 staff interviews, session recording analysis of 400+ portal sessions, and a full accessibility audit identifying 31 prioritized issues.

02

Information Architecture

Sitemap redesign, task flow mapping with 30 patients, card sorting and tree testing to validate navigation, and complete IA documentation for the development team.

03

UI Design

Accessibility-first component library, responsive wireframes for all 24 portal views, interactive prototypes tested with 12 patients, WCAG annotations on every screen.

04

Development & QA

React build with HIPAA-compliant data handling, HL7 FHIR integration, full WCAG 2.1 AA audit, cross-device QA across 14 device/browser combinations.

Measurable Impact Across Every Metric

Measured at 30 days post-launch. Patient satisfaction via post-visit survey, call volume via phone system reporting, scheduling completion via portal analytics.

−41%
Support Calls

Monthly call volume to front desk reduced from 4,200 to 2,478 — freeing staff to focus on patients present in the clinic.

34%→81%
Scheduling Completion

Scheduling completion rate rose from 34% to 81% within the first 30 days — more than doubling digital appointment volume.

WCAG AA
Accessibility Certified

Full WCAG 2.1 AA compliance achieved at launch — zero remediation items outstanding, verified by third-party accessibility auditor.

4.6/5
Patient Satisfaction

Surveyed patient satisfaction score improved from 3.1 to 4.6 — an increase driven primarily by scheduling and messaging experience ratings.

31
Usability Issues Resolved

Every one of the 31 usability issues identified in the research audit was addressed in the redesign — tracked to resolution.

<4 clicks
Avg. Task Completion

Average primary task completion reduced to under 4 clicks — scheduling, messaging, and results review all achieved this threshold.

What We Built

🔬

UX Research Report

Comprehensive research synthesis documenting all 31 usability issues, severity rankings, frequency data, and supporting evidence from patient interviews and session recordings.

🗺️

Journey Maps

Patient journey maps for five primary portal use cases, documenting current-state pain points and future-state experience goals with supporting patient quotes.

Accessibility Audit

Full WCAG 2.1 AA audit of the legacy portal with prioritized remediation roadmap, plus accessibility annotations on every screen in the new design system.

🏗️

Information Architecture

New portal IA validated through card sorting and tree testing with 30 patients — including navigation structure, content taxonomy, and task flow documentation.

⚛️

React Portal Build

Full production React build with HIPAA-compliant data handling, HL7 FHIR integration for appointment and records data, and WCAG 2.1 AA compliance throughout.

🔒

HIPAA Compliance Review

End-to-end HIPAA compliance documentation covering data handling, encryption, audit logging, and access control — reviewed by Arbor Health's compliance team.

"
"The research Monolith did surfaced issues we hadn't even considered. The new portal feels like a completely different product — our staff and patients are both grateful."
PN
Priya Nair Director of Patient Experience, Arbor Health

Next Case Studies

Ready to transform your digital experience?

Let's talk about what a research-led engagement could achieve for your organization.

Monolith UX

Online · Typically replies in minutes

Hi there 👋 How can I help you today?