A healthcare system aimed at helping asthmatics. The product monitors and alerts the user of potential asthma triggers in their environment along with obstructions to their airway.

Project Brief

Students were asked to choose a chronic condition to design for, with the implementation of a body sensor to maintain homeostasis.

Digital Prototype

The user workflow for how an asthmatic using this product might better manage their condition

Project Information

Class: Systems


Instructor: Hugh Dubberly


Duration: Three weeks


Key Skills: Behavioral change, branding, design research, interviewing, digital prototyping, visual design, user experience design, and persona development


Tools: Adobe Illustrator, Sketch


Project Role: Individual project


  • Model of the chronic condition​


  • Model of the care-network


  • Journey map showing how the person manages their condition

  • Product-service ecology to better manage their condition, with an element being a mobile app and body sensor

Design Research

Interviews and Persona Creation

Conducting interviews allowed the opportunity for better insights to the challenges asthmatics encounter to manage their condition. It helped with understanding the different severities of asthma, the various triggers that can cause an asthma attack, and what an individual must do to keep the condition under control.

Journey Map

This map shows the typical triggers and steps an asthmatic has to take in order to manage their condition. These scenarios were based on interviews with people afflicted with asthma.

Patient Care Network

Listening to the participants describe their condition and the precautions they take helped guide this care map, which explains the different actors and components involved in preventing or treating asthma.

Automatic Feedback Model

This model represents the feedback loop for an asthmatic and different components involved in order for them to maintain homeostasis.



Initial wireframes, which helped guide the design of the app.

Note taking, to sketching, to modeling with Post Its - all steps helped to further my knowledge and create the first iteration for the final deliverables.

Initial Sketches
Initial sketch of wireframe
Initial Sketches
Iteration of app concept
Modeling the information architecture of the app
Interview Notes
Interview Notes
Listing the required steps within a participant's care network.
First Draft of Screen
First Draft of Screen
First Draft of Screen
First Draft of Screen
Show More

Key Takeaways

The first step was to model the current state of a person afflicted with the condition of our choice. I selected asthma because I have seen the physical toll this particular condition can take, within my own family. Modeling the current state allowed me quickly see where my gaps in knowledge were so I could set out to learn more about the condition.


Understanding the automatic feedback loop, within the context of asthma was the next part of closing the loop for homeostasis. What does one have to measure? How do they manage the variables? What does the feedback loop look like? All were questions that needed to be answered and labeled in cybernetic terms.


Mapping an asthmatic’s current care network and journey also played an important role in better understanding the attention and medical care one requires when they are afflicted with the condition. I had to examine whom the patient seeks out for treatment, the type of medication they use, the people that support them, behavior that may be different from non-asthmatics, and how they manage their condition during any given week.


The use of the various models for this project helped me to better understand not just more about asthma and the people afflicted with asthma but as well as how a model can be a tool to help fill in the missing pieces of what a designer might not yet understand.


John Sun

User Experience Designer

John Sun © All Rights Reserved

Welcome Screen