Healthcare UX · Case Study

RECapp
Recovery After Cancer

Designing a clinical decision-support tool for long-term follow-up of patients recovering from esophageal and gastric cancer surgery, from research through a fully prototyped web and mobile MVP.

UX Research Information Architecture Interaction Design Design System Wireframing Prototyping Stakeholder Alignment
Organisation
Karolinska Institutet
My Role
UX Designer (Intern · Summer Position)
Collaborators
Researchers · Physicians · Contact nurses · Developers
Tools
Figma · Miro · FigJam

A research tool that needed to become a clinical tool

RECapp is a digital follow-up tool developed within a clinical research project at Karolinska Institutet. The tool supports long-term monitoring of patients who have undergone surgery for esophageal or gastric cancer.

Patients in this group often experience fluctuating symptoms over time, including malnutrition, reflux, dumping syndrome, fatigue, and weight loss. Follow-up stretches across months and years, and continuity is critical.

The project started as a research-driven initiative but required translation into a usable clinical decision-support tool. My responsibilities spanned the full design process: UX research, information architecture, interaction design, system structuring, design system creation, wireframing, prototyping, and stakeholder alignment across clinical and research teams.

Primary User

Contact Nurses

  • Daily follow-up workflow
  • Quick patient prioritization
  • Documentation support
  • Risk indication at a glance
Clinical

Treating Physicians

  • Longitudinal symptom data
  • Decision-support logic
  • Meeting summary generation
  • Clinical context at a glance
Research

Clinical Researchers

  • Patient randomization
  • Population data comparison
  • Study protocol adherence
  • Structured data collection
Secondary

Patients

  • Symptom self-reporting
  • Self-care guidance
  • Low-friction interactions
  • Emotional tone balance

Not just an interface problem — a system design problem

Patients lacked structured follow-up between visits, and symptom data collected over time was difficult to translate into actionable clinical decisions. The challenge was not simply interface design. It was system design within a clinical workflow.

Symptom burden fluctuates and is hard to monitor longitudinally. Contact nurses have limited time. Documentation is time-consuming. Patient data exists but is not easily actionable. No clear treat-to-target logic existed initially, and communication between patient and provider lacked structure.

01

No structured follow-up

Patients had no structured contact between clinic visits. Symptom fluctuations went undetected until the next appointment.

02

Data without action

Symptom data existed but was scattered and hard to translate into timely clinical decisions. Information was there. Prioritization was not.

03

No risk visualization

No visual risk indicator existed. Nutrition risk, weight loss, and deteriorating symptoms were difficult to identify quickly from a patient list.

04

Fragmented information

Information was scattered across multiple tools. No prioritization mechanism. No integrated decision-support logic. Just data in silos.

Turning data into clinical action

The goal was not to visualize data. It was to turn data into clinical action. This required combining systems thinking, research-driven iteration, and deep clinical context understanding with structured prioritization and decision-support design.

Every design decision was guided by a single question: does this reduce cognitive load and enable a faster, better clinical decision?

01

Stakeholder Research

Interviews with nurses, clinicians, and researchers to understand decision-making under time pressure and what data must be immediately scannable.

02

Quantitative Validation

Survey design with branching logic to validate research hypotheses across a broader group, segmented by specialty and experience.

03

Structured Prioritization

MoSCoW framework and Value vs Effort workshop to align teams on MVP scope and avoid building complexity before impact.

04

System Architecture

Flow design before wireframing. Patient list logic, decision flows, notification paths, and knowledge bank structure defined first.

05

Progressive Fidelity

Low-fidelity flows to wireframes to interactive prototype. Each stage validated specific interaction logic before visual refinement began.

Interviews, environmental scan, and quantitative validation

We interviewed contact nurses, clinicians, and researchers. Key themes emerged consistently: decision-making happens under time pressure, data must be quickly scannable, follow-up must be structured, and tools must integrate into a real clinical workflow.

We also conducted an environmental scan of comparable tools including Elsa Science, Medituner, TakeCare, Min Vårdplan, and the Clinical Frailty Scale. The goal was to understand what worked, what increased complexity, and what did not translate into clinical usability.

RECapp · UX Research

Synthesized Interview Themes & Key Insights

Healthcare Professionals & Patients
Interviews · Workshops · 84 Survey Participants
01 🤝

Safety & Trust
in Care

  • Patients need a sense of security connected to healthcare staff
  • A dedicated contact person (e.g. contact nurse) is essential
  • This relationship must be established early in the process
  • Early follow-up with care plan walk-through creates trust
Core user need
02 📊

Symptom Tracking
& Visualization

  • Weight & nutrition are the most critical symptoms to monitor
  • Strong need to compare and measure symptom change over time
  • Graphs and timelines essential for both patients and staff
  • Push notifications can remind and engage users effectively
Key feature driver
03 🔗

Fragmented
Systems

  • Staff work across many unsynchronized systems daily
  • Duplicate work is a major pain point to eliminate
  • Single sign-on required — no extra login burden
  • Documentation must be radically streamlined
Staff pain point
04 💬

Communication & Personalisation

  • Need to communicate key patient data directly to doctors
  • Messaging function essential to bridge patient–staff gap
  • Personalization creates a sense of safety within the app
  • Timely contact with patients: push for data entry & connection
  • Timeline view of events: visits, interventions, contacts
  • Patients less likely to use app without ongoing follow-up
Product opportunity
05 🗓️

Follow-up
& Planning

  • Return visits: 4–6 weeks, 3, 6 & 12 months post-treatment
  • Patients feel lost when handed off between systems
  • Proactive planning reduces anxiety and delays
  • Delphi process can validate and prioritise design decisions
Structural insight
Key takeaway
"The most critical need is not a feature — it's a relationship. Technology should reinforce trust between patient and caregiver, not replace it."

Survey design and quantitative validation

After interviews, we designed a structured survey to validate hypotheses across a broader group. Participants were segmented into specialists working with esophageal and gastric cancer and general oncology professionals. The survey included branching logic based on oncology experience, cancer type familiarity, and years in practice. Focus was on prioritization, real clinical tasks, feature ranking, and decision-making support needs.

RECapp · Delphi Survey

Survey Structure &
Screening Flow

84 Participants · Healthcare Professionals
Branching logic · Two respondent tracks

Screening — Question 1

Do you work within cancer care?

Yes
Continue
No
Exit survey
Thank you!

Screening — Question 2

Have you worked with esophageal or gastric cancer patients?

Branching into two respondent tracks

Track A — Specialist

Healthcare staff with esophageal / gastric cancer experience

Question 3

How many years of experience do you have in cancer care?

0–5 yr5–10 yr 10–15 yr15–20 yr20+ yr

Question 4

How many years of experience do you have with MT/MS-cancer patients specifically?

0–5 yr5–10 yr 10–15 yr15–20 yr20+ yr

Questions 5 – end

Specific questions for staff with MT/MS-cancer experience: detailed clinical workflow, app needs, and feature prioritization.

Specialist Respondent Track

In-depth clinical & app-specific questions

Track B — General

General healthcare staff without MT/MS-cancer experience

Question 3

How many years of experience do you have working in healthcare overall?

0–5 yr5–10 yr 10–15 yr15–20 yr20+ yr

Questions 4 – end

General questions for healthcare staff: broader perspective on digital tools in care, patient communication, and system needs.

General Respondent Track

Broader healthcare & digital tool questions

Design note
"Branching logic ensures each respondent only sees questions relevant to their experience, reducing cognitive load and improving data quality across both tracks."

RECapp · Delphi Survey

Survey Results &
Analysis

84 Total Participants · Specialist Track
26 respondents with direct MT/MS experience
26resp.
Respondents with direct MT/MS-cancer experience
Specialist track
84%
Had worked more than 5 years, representing the majority of all respondents
Senior experience
49%
Find documentation after phone or digital communication least effective
Key pain point
4–7min
Majority (36%) estimated time to follow up with a patient in RECapp
Time per patient
Top Requested Features

Top 5 · All Features

1
Graphs for patient symptoms over time
21 · 80%
2
Copy tool: transfer data & notes to journal
17 · 65%
3
Activate patient's app from care provider
15 · 57%
4
Patient list linked to clinic & tools used
14 · 53%
5
Customisable reminders for staff at specific moments
13 · 50%

Top 3 · Start Page Features

1
Search / patient list
14 · 53%
2
Customisable reminders at specific moments
5 · 19%
3
Graph of symptoms over time / intro guide
3 · 11%
Key finding: Despite respondents rating themselves as relatively technical, the task they find least effective is documentation after phone or digital communication, suggesting the interface gap between communication and documentation is a critical design opportunity.
Validated Hypotheses
Primary hypothesis

The service we create should primarily develop efficiency in the healthcare professional's daily work and enable an adapted system for seamless information transfer to existing systems.

Confirmed

Knowledge and work routines already exist: the tool should support, not replace, established clinical workflows.

Confirmed

Strengthen communication, contact and transparency between healthcare staff and patients. Create a timeline where the patient feels seen.

Confirmed

Simple, smooth and effective tool for healthcare professionals: a shared system where information and work happens in one place.

Confirmed

RECapp should help staff who aren't specialised in the case, enabling them to meet and follow up patients at a regular care centre visit.

Insight

Patients need positive reinforcement and recognition: a bridge between clinical efficiency and patient emotional support.

Knowledge Matrix

✓ What we know

Staff are experienced and technically capable

Documentation after calls is the biggest pain point

Symptom graphs are the most wanted feature (80%)

Search/patient list is most critical start page element

4–7 min estimated per patient follow-up

Communication between staff and patient needs bridging

? What we don't know

How patients will actually engage with the app long-term

Optimal notification frequency without causing fatigue

How to integrate seamlessly into existing journal systems

Which care moments are most critical for digital touchpoints

How reminders should be personalised per patient profile

◎ What we don't know we know

Existing routines are a strength, not a barrier to design around

Emotional safety is as important as functional efficiency

Relationship-based care cannot be fully digitised

◈ What we don't know we don't know

Edge cases in rural or under-resourced care settings

Long-term behavioural effects of digitalised care pathways

Privacy and trust implications of centralised patient data

Future regulatory requirements for medtech apps in Sweden

Key finding
"Staff don't lack knowledge or skill: they lack a unified system. The design opportunity is efficiency, not education: reduce friction between communication, documentation, and patient follow-up."

From needs to a realistic MVP

Requirements were gathered through workshops and interviews, then structured using MoSCoW prioritization. This helped define a realistic MVP that delivered impact before adding complexity.

Segment differences from the survey directly influenced the information hierarchy. Specialists prioritized deep symptom visualization and decision-support tools. General oncology staff prioritized overview, ease of use, and implementation simplicity.

Priority Feature Rationale
Must Have Patient list with sorting, filtering, and risk indicators Core operational hub for daily nurse workflow
Must Have Visual symptom comparison and traffic-light logic Enables risk identification without entering each patient record
Must Have Patient prioritization and notification logic Reduces time-to-decision for contact nurses
Must Have Activated self-care advice tracking Closes the loop between clinical guidance and patient action
Must Have Add and randomize patients (research context) Core research requirement for clinical study protocol
Should Have Meeting summary generation High-value validated feature reducing documentation burden
Should Have Communication channel between patient and provider Structured contact reduces unstructured calls and messages
Should Have Knowledge bank with search and references Secondary workflow support layer for nurses and clinicians
Could Have Advanced analytics and population comparison Research value, but not core to daily clinical use
Could Have Community features Low value relative to effort, deprioritized for MVP

Requirements gathered through workshops, interviews, and validated via structured survey. Prioritized using MoSCoW framework.

System-level flows before any wireframing

We designed system-level flows before touching a single wireframe: overall system structure, patient list logic, patient page decision flow, knowledge bank structure, notification logic, and the communication pathway.

The patient list became the primary operational hub for daily clinical use, with status indicators visible before entering any patient record. The patient page was designed as a decision surface, not a data archive.

recapp-ia-flowchart.png · System architecture and flow diagram
Overall system structure and patient flow logic designed before wireframing began
recapp-ia-patientlist.png · Patient list logic
Patient list as operational hub: sorting, filtering, risk indicators, direct navigation
recapp-ia-patientpage.png · Patient page decision flow
Patient page decision flow: longitudinal data, traffic-light logic, self-care, summary generation

Built for scalability and clinical clarity

To ensure scalability and consistency, I built a structured design library from the ground up. The system covered color, typography, and a full component library, all grounded in the clinical context it was built for.

Color was used consistently for prioritization, risk indication, feedback, and action guidance. The typography system supported rapid scanning, reduced cognitive load, and maintained a clear information hierarchy throughout the interface.

recapp-design-system.png · Design system overview
Design system overview: color tokens, typography scale, status indicators, and component library

Color System

Neutral backgrounds Primary interactive Secondary structural Success Warning Error High risk

Typography System

Display hierarchy Heading 1–5 Body text Labels Captions

Component Library

Status badges Graph modules Structured cards Stepper Overlays CTA hierarchy

Designed for clinical workflow

Although RECapp included a mobile interface for patients, the primary focus of the MVP was a web interface designed for healthcare professionals. Every screen was built around a single goal: reduce time-to-decision.

The patient list, patient page, and summary generator were designed as an interconnected system where risk was visible before the clinician ever opened a patient record.

Patient List — Operational Hub

The patient list became the primary entry point for daily clinical use. Status indicators, risk flags, and sorting were all accessible at list level, before entering any patient record. This reduced time-to-decision significantly for contact nurses managing large patient loads.

recapp-web-patientlist.png · Patient list view
Patient list with risk indicators, sorting, filtering, and direct access to summary and screening

Patient Page — Decision Surface

The patient page was designed as a structured decision surface rather than a data archive. The longitudinal symptom graph became the central clinical conversation anchor, refined through iteration to reduce noise, highlight risk areas, and allow month-range filtering via slider interaction.

recapp-web-graph-v1.png · Early graph iteration
Early graph iteration: establishing core structure and traffic-light thresholds
recapp-web-graph-v2.png · Refined graph
Refined graph: reduced noise, highlighted risk zones, added range filter
recapp-web-patientpage.png · Full patient page view
Full patient page: symptom graph, clinical info card, self-care advice, and summary generator

Summary Generator

A key feature validated by the survey. The flow allowed clinicians to select a time range, auto-generate a structured meeting summary, edit it if needed, and export directly into documentation. This addressed documentation burden, meeting preparation time, and standardization of follow-ups in a single flow.

recapp-web-summary.png · Summary generator flow
Summary generator: time-range selection, auto-generated content, edit and export flow

Screening Flow

We designed a structured screening interaction using a stepper component: step-by-step symptom input, frequency logic, conditional branching, and severity categorization. The stepper logic reduced cognitive overload, minimized the risk of missing questions, and ensured consistent data collection across the patient cohort.

recapp-web-screening.png · Screening stepper flow
Screening stepper: structured symptom input with frequency logic and conditional branching

Patient-facing, low friction

Although the web interface was the primary clinical tool, we also designed a patient-facing mobile MVP. The mobile flow covered onboarding, login, health status overview, screening submission, self-care advice, and an information bank.

Visual consistency was maintained across platforms while interaction patterns were adapted for mobile behavior. The guiding principles were low friction, clear language, emotional tone balance, and guided navigation.

recapp-mobile-onboarding.png · Mobile onboarding
Mobile onboarding and login flow: low friction, clear language
recapp-mobile-screening.png · Mobile screening
Mobile screening submission with guided stepper interaction
recapp-mobile-overview.png · Mobile health overview
Health status overview: symptom history and self-care advice
recapp-mobile-infobank.png · Mobile information bank
Information bank: definitions, references, and self-care structure

Each round of feedback made the system more precise

Based on stakeholder feedback, four main areas were refined iteratively: the symptom graph, the prioritization visual hierarchy, the summary flow, and the screening interaction.

Design principles applied throughout: progressive disclosure, action-oriented layout, risk-first visualization, reduced cognitive load, clinical prioritization logic, and scannability over decoration.

Iteration
recapp-iter-graph.png
Graph Refinement
Increased contrast in risk zones, reduced visual clutter, improved axis clarity, added month range filter.
Iteration
recapp-iter-priority.png
Prioritization
Improved visual weight of risk indicators, reduced emphasis on secondary metadata, moved key actions closer to graph.
Iteration
recapp-iter-summary.png
Summary Flow
Added breadcrumb logic, clarified time-range selection, improved edit feedback, reduced total clicks.
Iteration
recapp-iter-screening.png
Screening UX
Simplified answer scales, improved frequency wording, reduced redundant steps, clarified navigation buttons.

Operational UX in a clinical environment

The project resulted in a fully prototyped, research-validated clinical tool with clear prioritization logic, decision-support design, and a component system built for long-term scalability. The work was recognized with an extended employment offer beyond the original internship period.

RECapp strengthened my ability to design within high-stakes, complex environments where usability directly impacts patient care.

Structured follow-up

Patients gain structured contact between visits. Symptom changes become detectable before the next appointment.

Reduced cognitive load

Risk visible at list level. Clinical decisions supported before entering any patient record. Less scanning, more acting.

Documentation efficiency

Summary generator cuts meeting preparation time. Standardized follow-up format reduces documentation burden across the team.

Actionable symptom data

Longitudinal graph with traffic-light logic turns raw data into clear clinical signals. Data exists to be acted on, not just stored.

Scalable design system

Component library built for long-term development. Consistent patterns across web and mobile. Ready for handoff and iteration.

Extended engagement

The quality of the work led to extended employment beyond the internship. The foundation continues to be built upon.

What I learned

  • Clinical UX is systems design. The interface is the last thing you design, not the first.
  • Data does not equal value. Value comes from turning data into a decision.
  • Prioritization is design. Choosing what not to build is as important as what to build.
  • Stakeholder alignment is continuous. In clinical environments, misalignment has real consequences.
  • Iteration beats perfection. Research-driven increments outperform upfront completeness every time.