Asthma tracker app

A UX and UI Design project by Jennifer Lee Palandro

Introduction

A pharmaceutical company needed to develop an app that would help their medical partners and their patients:

  • Track their asthma to have more efficient conversations during office visits

  • Become more aware of bad weather conditions and triggers for asthma

  • Get in touch and have async check-ins.

During my time there, I worked on the reskin, redesign, and reimagination of the app with UX flows, information architecture, prototypes and sketches, and visual design.

Continue viewing this page for more information, sketches, and screens. Tap any image to enlarge.

 The home screen

The homepage serves as the dashboard for the experience. A user would open the app to:

  • Check the air quality

  • Log their asthma symptoms

  • Take an asthma symptom test

  • Browse new articles and resources

  • Navigate to other areas of the app

The goal is to make the homepage as light and friendly as possible. Getting a patient to open an app daily to log their asthma symptoms is a big feat, so we wanted the landing screen to feel un-busy yet still useful.

 

Navigation and information architecture

With varying levels of complexity of the app, I wanted to explore the full possibility of what this app could provide in later iterations. This involved a navigation redesign as well as reconsidering the structure of the user profile.

 

Breathing conditions

Patients with asthma are concerned with environmental air quality because poor or even moderate conditions can trigger asthma, depending on the severity of the disease.

The original design showcased a drag feature to explore hourly conditions, but I proposed a scrollable bar chart so the information could be digested quickly and visually, and wouldn’t rely so heavily on color to indicate air quality.

The entire air quality experience could be viewed for today, tomorrow, and two days out for planning.

 

Asthma tracker

One of the main goals of the app was to entice users to track their asthma symptoms daily for a more efficient in-office visit with their doctors.

Through the research, we discovered there wasn’t a lot of inherent motivation for a patient to track asthma, especially it was a “good asthma day.”

Through the redesign, I tried to shorten the scrolling experience so users wouldn’t feel overwhelmed by the lengthy daily survey with selectable pills instead of a long list of toggles. Ultimately, the client wanted to go with an alphabetical checklist.

If I were to work on this further, I’d suggest:

  • A progressive modal flow for each set of questions

  • Grouping symptoms by area: chest, head, and behavioral

  • Bigger pills for a larger tap target

 
 

Asthma insights

For a patient to get the most out of the app, we need to provide them with data visualization, some level of visual gamification, and encouraging content to solidify the daily habit.

 
 

Additional thoughts and questions

  • If this becomes the landing pad for an asthma patient, what else can we provide for them to make it the most helpful app they can use?

  • Would patients benefit from a regular messaging touchpoint with their asthma doctor? Do doctors want to be reachable via this method?

  • How do we create an asthma tracker flow that would only capture the “good” “okay” “bad” and then give the user options to continue with the survey, so at least the user has the high-level daily data to discuss further with their doctor?

  • How do we provide prescription management information?

  • Is there a way to incorporate lifestyle and habit suggestions into the app to reduce the dependency on medication?