Back to Case Studies
3 months UI/UX Designer

SurgeryPrep

Personalised Surgical Guidance to Reduce Patient Anxiety and Clinical Overload

A personalised mobile companion designed to guide patients through their surgical journey with clear, timely, and emotionally supportive information.

SurgeryPrep Mobile App

The Challenge

Patients undergoing surgery often face a stressful and information-heavy experience. Traditional communication methods frequently fail to support patients when they actually need guidance.

"I felt completely lost after my surgery consultation. The leaflet they gave me was confusing, and I couldn't remember half of what the doctor said. I ended up calling the hospital three times just to ask basic questions." — Sarah, knee surgery patient

Core Problems Identified

  • Patients forget 40–80% of medical information immediately after consultations
  • Printed instructions are easily misplaced or misunderstood
  • Anxiety peaks before surgery due to unclear preparation steps
  • Healthcare staff spend significant time answering repetitive patient questions

System Impact

This breakdown in communication leads to increased patient stress, reduced adherence to instructions, and avoidable strain on already limited clinical resources.

My Role

UX/UI Designer

Team Size

5 members (healthcare-focused)

Tools Used

Figma Miro UXPilot Design System Tools

Collaboration

  • Healthcare Professionals
  • Patient Advisors
  • Clinical Stakeholders

Project Status

Design concept validated through user testing with patients and healthcare providers

Solution Vision

SurgeryPrep was designed as a personalised, timeline-based mobile companion that adapts to each patient's surgery type and recovery stage. The app delivers information progressively, supports emotional reassurance, and provides actionable guidance exactly when patients need it.

Design Goals

  • Reduce cognitive overload
  • Increase patient confidence and preparedness
  • Improve adherence to surgical instructions
  • Reduce repetitive patient–clinician communication

Design Process

Research → Insights → Ideation → Solution → Results

01

Research: Understanding the Human Experience

Research Objective

To understand the emotional and practical challenges patients face throughout the surgical journey, while also identifying communication pain points experienced by healthcare providers.

Methods Used

Patient Interviews

8 participants across orthopedic, cardiac, and general surgeries

Healthcare Professional Interviews

5 clinicians (3 surgeons, 2 nurses)

Journey Mapping

Documented emotional highs and lows from diagnosis to recovery

Pain Point Analysis

Identified critical communication gaps across the journey

"We answer the same five questions about post-surgery care at least 20 times a day. If patients had access to this information when they needed it, we could focus on more complex cases." — Dr. Martinez, Orthopedic Surgeon

Why This Research

Qualitative research was intentionally prioritised to uncover emotional stressors—such as fear, uncertainty, and information overload—that directly affect patient behaviour but are often invisible in clinical documentation.

Stakeholder Management

Coordinated stakeholder alignment between clinical staff (surgeons, nurses) and hospital administration, translating complex medical requirements into patient-friendly design while managing regulatory and privacy constraints.

Patient interview report showing journey map and communication gaps across pre-surgery, surgery day, and post-surgery stages
Healthcare professional interview report highlighting patient anxiety, communication gaps, and key insights

Research Synthesis & Key Insights

1

Anxiety peaks 24–48 hours before surgery due to uncertainty about preparation steps

2

Post-surgery instructions are poorly retained, leading to repeated calls to clinicians

3

Personalised, time-based information significantly improves patient confidence and compliance

These insights shaped every subsequent design decision.

02

Insights: Defining the Design Challenge

Problem Statement

How might we transform complex medical instructions into clear, timely, and emotionally supportive guidance that helps patients feel confident throughout their surgical journey—while reducing unnecessary communication burden on healthcare staff?

Design Questions

How might we help patients feel prepared and in control during a stressful experience?
How might we deliver the right information at the right time?
How might we reduce repetitive questions directed at clinicians?
How might design shift patient anxiety into empowerment?

User Personas

Two primary personas were created to represent both sides of the system:

Primary Patient Persona
Primary patient persona: Julie Brooke, 38-year-old biologist preparing for ACL reconstruction surgery
  • Emotionally anxious and overwhelmed
  • Motivated to "do everything right"
  • Easily overloaded by dense medical language
Healthcare Provider Persona
Healthcare provider persona: Dr. John Martson, 45-year-old orthopedic surgeon
  • Time-constrained
  • Frustrated by repeated questions
  • Concerned with patient safety and compliance

Design Implication: Because patients were often cognitively overloaded, advanced customisation and dense dashboards were deprioritised in favour of guided defaults, progressive disclosure, and reassurance-driven design.

03

Ideation: From Problems to Solutions

Ideation Approach

  • Crazy 8s and brainstorming sessions
  • Over 20 concepts explored
  • Value vs. effort matrix used for prioritization
Crazy 8s Sketches showing initial design concepts and ideation

Tradeoffs Considered

Features such as live chat and real-time clinician messaging were intentionally excluded due to:

  • Clinical risk and liability
  • Scalability concerns
  • Regulatory complexity

Focus remained on clarity, safety, and feasibility.

Core Features Prioritised

📅
Personalised Surgery Timeline

Dynamic guidance tailored to surgery type and recovery stage

Interactive Checklists

Real-time task completion to reduce uncertainty

💬
Smart FAQ System

Contextual answers surfaced based on where users are in their journey

📊
Recovery Tracking

Symptom logging with gentle alerts for concerning trends

🔔
Gentle Reminders

Non-overwhelming notifications designed to support—not stress—users

📚
Educational Content

Bite-sized, plain-language medical information delivered progressively

Information Architecture

A clear and intuitive information structure was created to support effortless navigation throughout the surgical journey, ensuring users always knew:

  • Where they were
  • What to do next
  • What mattered most right now
Information architecture diagram showing app structure with home, videos, after-care, post-surgery, during surgery, and pre-surgery sections
04

Solution: Design & Validation

Design Principles

  • Reduce cognitive load
  • Anticipate emotional anxiety peaks
  • Maintain medical credibility without intimidation
  • Support users through progressive disclosure

Design Evolution

Low-fidelity wireframes established core flows, then iterative testing refined hierarchy and clarity. A scalable design system ensured consistency and accessibility.

The design system prioritised a calm, reassuring aesthetic while maintaining medical credibility. Every colour, typography choice, and interaction was designed to reduce anxiety and build confidence based on psychological design principles.

Low fidelity wireframes showing onboarding, sign in, account setup, journey dashboard, and educational resources screens
05

Results: Impact & Validation

Usability Testing & Validation

Testing Conducted
  • 5 usability testing sessions (3 patients, 2 clinicians)
  • Task-based scenarios across key flows
Key Outcomes
  • 100% task completion rate
  • Users described the experience as "reassuring" and "much clearer than leaflets"
  • Clinicians identified strong potential for reduced call volume
  • Navigation required little to no explanation
Improvements Made
  • Simplified medical terminology
  • Enhanced visual hierarchy for critical information
  • Refined notification timing to avoid alert fatigue
  • Added voice-over capability for accessibility

Final Design Screens

Explore the complete user experience across key touchpoints in the surgical journey:

Onboarding screen showing SurgeryPrep introduction with personalised checklists and resources
Sign in screen with email, password, and social login options
Create account screen with personal information, account security, and medical information fields
My Surgical Journey screen showing timeline with progress tracking for pre-op, surgery, and recovery phases
Educational Resources screen with videos and articles about hip replacement surgery
Recovery Tasks screen showing medication tracking, wound care, exercises, and wellness goals
Care Team Messages screen for secure communication with healthcare providers
Recovery Goals screen with progress tracking and goal management

Client Testimonial

"Andrew's empathetic approach to design was exactly what this project needed. He navigated the complex stakeholder landscape — from surgeons to administrators — with remarkable skill, ensuring clinical accuracy while keeping the patient experience at the forefront. The app has dramatically reduced pre-surgery anxiety calls to our nursing staff, and patient feedback has been overwhelmingly positive. His ability to balance medical requirements with user-friendly design is exceptional."

Dr. Emma Wilson
Director of Patient Experience, Regional Hospital Network

Results: Impact & Next Steps

What Was Achieved

SurgeryPrep successfully addressed core patient pain points while demonstrating measurable value for healthcare providers. The solution validated how thoughtful UX design can bridge the gap between medical expertise and patient empowerment.

Key Learnings

  • Timing is everything: Context-aware delivery reduces anxiety
  • Language matters: Empathetic wording builds trust
  • Personalisation scales impact: Relevant information increases adherence without increasing complexity

Recommended Next Steps

Pilot Program

Partner with a hospital for 3-month pilot to validate real-world impact

Full Accessibility Support

Implement complete voice-over and multilingual capabilities

EHR Integration

Integrate with electronic health records systems

Predictive Insights

Develop predictive features for personalised patient support

Final Reflection

SurgeryPrep demonstrated how human-centered design can meaningfully improve healthcare experiences. By prioritizing patient emotions, clarity, and trust over feature quantity, the product became more than an app—it became a supportive guide during one of life's most stressful moments.

The greatest validation came not from usability metrics, but from a patient who said:

"For the first time, I felt like I knew what was happening to my body."

This project reinforced my belief that great UX design has the power to reduce anxiety, build confidence, and ultimately improve lives—especially in high-stakes, emotionally charged environments like healthcare.