Asthma Monitoring App
DIGIPREDICT
CLIENT: NIHI, University of Auckland
ROLE: Lead Product Designer
SCOPE: UX Audit · Full Product Redesign · WCAG 2.1 AA Accessibility · Design System Architecture · Clinical UX Research
Redesigning clinical health monitoring for New Zealand's highest-risk respiratory population — predictive AI, real-time biometric tracking, and human-centred design for a 6-month university research trial.
Asthma affects 1 in 8 adults and 1 in 7 children in New Zealand — one of the highest rates globally. DIGIPREDICT, led by the National Institute for Health Innovation at the University of Auckland, set out to detect early deterioration in asthma control using smart wearable data and daily self-reported symptoms.
The existing research prototype had high drop-off rates and poor data quality. I led the end-to-end redesign — restructuring information architecture, simplifying clinical data entry flows, and building an accessible design system that served participants aged 12 to 65 across the full trial period.
60% faster daily log completion 85% positive usability feedback 6-month sustained participant adherence
CONTEXT & CHALLENGE
Overview
The DIGIPREDICT app was part of a clinical research initiative to understand asthma progression through continuous digital monitoring. The existing prototype was functional but overly complex — cluttered layouts, unclear hierarchy, and inconsistent task feedback led to low engagement and incomplete data submissions, undermining research accuracy.
Goal
Design a human-centred clinical platform that simplifies asthma tracking, sustains long-term adherence, and delivers clean, reliable data for researchers — without compromising accessibility.
Challenge
Participants struggled to complete daily logs and interpret symptom trends. From the research side, NIHI needed a design system that could scale across multiple studies while maintaining medical compliance and accessibility for participants aged 12 to 65.
Phase 1
UX Audit & Heuristic Analysis
A detailed audit mapped every interaction point within the existing prototype. Key findings: redundant navigation layers between log and overview screens, overloaded input forms without contextual guidance, and no visual hierarchy for symptom summaries. These insights established the foundation for restructuring the app architecture and setting measurable UX targets.
Phase 2
Flow Mapping & Redesign Strategy
I developed a structured approach built on three pillars: clarity, efficiency, and accessibility. Using flow diagrams and screen mapping in Figma, I restructured the core event flow to eliminate friction — replacing multiple redundant screens with a single-step daily entry process, adding clear progression states, and simplifying chart visualisations for symptom trend recognition.
Phase 3
Prototyping & Iteration
Mid- and high-fidelity prototypes were built to test navigation logic and visual clarity. Feedback loops with the NIHI research team refined edge cases — ensuring compliance with research data requirements and WCAG AA standards. Each iteration improved readability, touch precision, and flow speed.
Phase 4
Visual Refinement & Accessibility
The final interface combined a calm medical palette with intuitive spacing and dynamic contrast ratios. Typography and interactive elements were tested for low-light visibility, ensuring inclusive usability across age groups and device types. This phase unified all components into a scalable design system for future NIHI studies.
DESIGN EVOLUTION
Original → Constrained Redesign → Post-Project Enhancement.
Original Prototype Proof of concept with significant usability issues — fragmented navigation, low visual hierarchy, inconsistent UI patterns. Symptom logging was confusing and time-consuming.
Redesign (Budget-Constrained Release) Within a limited development scope, the redesign introduced a structured, patient-centred interface. Improved touch precision, simplified event flows, and cleaner typography reduced task time and improved engagement — achieving measurable gains despite resource constraints.
Post-Project Enhancements Independent refinements introduced softer gradients, refined iconography, and cohesive colour logic — elevating emotional warmth and visual sophistication. These updates matured a functional research tool into a professionally crafted digital health product.
Personal AI Assistant
Personal AI Assistant
Personal AI Assistant
Personal AI Assistant
Personal AI Assistant
Personal AI Assistant
Asthma Attack Record
Today, 22 December, 2024
Select start Day and Time
18/04/2024, 21:16
Action Taken
GP
Hospital
Self-Managed
Other
TITLE
“The team’s expertise is matched only by their warmth. My skin has never looked clearer or healthier—my ‘clear skin’ journey has been truly transformative here.”
01 — Daily Log Simplified
Guided event flow cut log time from 3 minutes to under 1. Symptoms, inhaler use, and triggers captured through a single minimal interface.
02 — Smart Reminders & Insights
Adaptive reminders adjust to user activity, weather, and missed entries. A visual dashboard surfaces symptom trends and early warning signs for participants and researchers.
03 — Accessibility-First Interface
Large touch targets, simplified layouts, and high-contrast modes serving all age groups and literacy levels — WCAG 2.1 AA compliant.
04 — Scalable Research System
Modular design system synced to NIHI's secure cloud database. Eliminated manual reporting and enabled rapid rollout across future respiratory and cardiovascular studies.
60%
faster daily log completion — 3 minutes to under 1
85%
positive usability feedback across participants aged 12–65
40%
faster iteration speed for NIHI's subsequent research modules
The DIGIPREDICT redesign delivered measurable improvements in participant engagement and research data reliability. A clarity-first interface, structured design system, and accessibility-led workflows transformed a complex clinical prototype into a trusted digital companion for asthma management.
Design & Development
