UX Craft

Input

• Company: Northtide Health — a regional urgent care network (14 clinics, Pacific Northwest)
• Product area: Patient self-scheduling and intake mobile app, replacing a phone-only booking system
• Research input: 6 contextual interviews, 3 diary studies, NPS of 31 from post-visit surveys; top complaints are wait time uncertainty and redundant paperwork at check-in
• Design constraint: Must meet WCAG 2.1 AA; brand colors are deep teal (#0B5E6B) and warm sand (#F2EAD8)
• Stakeholders: VP of Patient Experience, Engineering Lead (React Native), and a compliance officer reviewing HIPAA data flows

---

Output

/ux-craft — Northtide Health Patient Scheduling & Intake App

---

Step 1 — /persona-draft

Primary Personas

---

Persona 1: "Pressed-for-Time Parent" — Maya

Attribute	Detail
Age / Role	38, operations manager, mother of two
Access pattern	Mobile-first, books appointments during school drop-off or lunch
Core goal	Confirm a same-day slot and know exactly when to show up
Top frustration	Calling during work hours, being put on hold, repeating insurance info every visit
Tech fluency	High — uses banking apps, food delivery, telehealth
Emotional state at entry	Mildly anxious, in a hurry

Design implications: Surface real-time wait estimates immediately. Pre-fill returning patient data. Minimize tap count to confirmation.

---

Persona 2: "Managing a Chronic Condition" — Dennis

Attribute	Detail
Age / Role	64, retired teacher, manages Type 2 diabetes + hypertension
Access pattern	Tablet or desktop; brings a family member when navigating complex forms
Core goal	Communicate current medications and reason for visit accurately before arrival
Top frustration	Small touch targets, unclear form labels, fear of entering wrong insurance info
Tech fluency	Moderate — comfortable with email and video calls, cautious with new apps
Emotional state at entry	Methodical, slightly overwhelmed by unfamiliar UI

Design implications: Large tap targets (min 48×48px), plain-language labels, progress indicators on multi-step forms, ability to save and resume.

---

Persona 3: "Walk-In Decision Maker" — Priya

Attribute	Detail
Age / Role	26, graduate student, uninsured / on student plan
Core goal	Understand cost upfront and avoid surprise billing
Top frustration	No price transparency before booking; unclear whether her plan is accepted
Emotional state at entry	Cost-anxious, comparison-shopping between Northtide and competitors

Design implications: Insurance + self-pay cost estimator visible before account creation. Trust signals (accepted plans badge) on the home screen.

---

Step 2 — /journey-map

Maya — Same-Day Booking Journey

TRIGGER → SEARCH → BOOK → PRE-ARRIVAL → CHECK-IN → VISIT → POST-VISIT

Stage	Maya's Action	Emotional Arc	Pain Point	Opportunity
Trigger	Child wakes with ear pain at 7am	😟 Worried	No quick way to gauge urgency	Symptom triage nudge → "Book now or visit ER?"
Search	Googles "urgent care near me open now"	😐 Focused	Northtide site not mobile-optimized	Deep-link from Google to live slot picker
Book	Selects clinic, picks 9:15am slot	🙂 Relieved	Has to re-enter insurance she gave last visit	Returning patient auto-fill from account
Pre-arrival	Receives SMS reminder 30 min before	🙂 Confident	No real-time wait update	Live queue position in SMS + app
Check-in	Fills out intake form in waiting room	😤 Frustrated	Repeats same paperwork as last visit	Pre-completed digital intake, just confirm
Visit	Seen by provider	😊 Cared for	—	—
Post-visit	Gets paper discharge summary	😐 Neutral	No digital record, hard to share with PCP	In-app visit summary + share-to-provider

Highest-value stages to prototype first (designer decision checkpoint): Book → Pre-arrival → Check-in. These three stages contain all four top-complaint moments.

---

Opportunity Areas Surfaced Across All Personas

1. Real-time wait transparency — appears in all three persona journeys
2. Persistent patient profile — eliminates redundant data entry for Dennis and Maya
3. Cost clarity before commitment — critical for Priya, table-stakes for credibility
4. Digital intake pre-completion — reduces check-in friction for all personas

---

Step 3 — /information-architecture

Navigation Model: Bottom Tab Bar (4 items)

[ Home ] [ Find Care ] [ My Health ] [ Account ]

Content Hierarchy

Home
├── Live Wait Times (by clinic, surfaced immediately)
├── Book Appointment (primary CTA)
├── Continue Where You Left Off (returning users)
└── Cost Estimator entry point

Find Care
├── Clinic Locator (map + list toggle)
│   ├── Filter: Open Now / Distance / Wait Time
│   └── Clinic Detail → Book slot
├── Symptom Checker (triage nudge)
└── Services Offered (per clinic)

My Health
├── Upcoming Appointments
│   ├── Pre-Visit Intake Form (pre-filled, confirm)
│   ├── Live Queue Position (day-of)
│   └── Cancel / Reschedule
├── Visit History
│   └── Discharge Summary (PDF + share)
└── Medications & Conditions (Dennis use case)

Account
├── Personal Info
├── Insurance & Payment
│   └── Saved Plans (auto-fill on booking)
├── Notification Preferences
└── Accessibility Settings (text size, high contrast)

Labeling Decisions

IA Term	Rationale
"Find Care" not "Locations"	Action-oriented; matches mental model of users starting with a need
"My Health" not "Records"	Less clinical; inclusive of upcoming + past + intake
"Live Wait Times" on Home	Addresses #1 stated frustration before any interaction
"Cost Estimator" not "Pricing"	Softer framing reduces anxiety for uninsured users (Priya)

---

Step 4 — /client-prototype

Branded Prototype Spec — Northtide Health

Brand tokens applied:

• Primary: #0B5E6B (deep teal) — CTAs, active nav, progress bars
• Surface: #F2EAD8 (warm sand) — card backgrounds, form fields
• Text primary: #1A1A1A — AA contrast on sand (7.3:1 ✓)
• Destructive / alert: #C0392B
• Font: Inter (system fallback: -apple-system) — 16px body minimum

---

Screen Flow: Core Prototype (Booking + Intake)

Screen 1 — Home

┌─────────────────────────────────┐
│  Good morning, Maya             │
│  ─────────────────────────────  │
│  🟢 Northtide Eastside — 12 min │
│  🟡 Northtide Bellevue — 28 min │
│  ─────────────────────────────  │
│  [ Book an Appointment →  ]     │  ← teal CTA, full-width
│  [ Estimate My Cost       ]     │  ← sand outline button
└─────────────────────────────────┘

Screen 2 — Slot Picker

┌─────────────────────────────────┐
│  < Northtide Eastside           │
│  Today · Est. wait 12 min       │
│                                 │
│  ○ 9:00 AM