Breaz : your pocket asthma saver — UX Case Study

Cecile Gosseau
8 min readMar 14, 2021

🚀 — The project

For this project, The Wellness Institute, our client, wanted to explore how they could use technology to help people live healthier lives.
To address this project, we decided to focus on a chronic disease: asthma.
Every day we breathe about 14,000 liters of air without even realizing it.
It is totally harmless and this mechanism is necessary to live. Asthmatics are not always able to do this.

Our goal for this project is to offer a solution to improve asthmatics’ wellness.
The attacks caused by this disease are not always predictable, and this has an impact on the every day life.
The solution we will propose will therefore improve the well-being of asthmatic people.

Our team was composed of Charlotte Urvoy, and myself, 2 UX Designers. We had already worked together in the past on a UX project about Culture&Heritage.
To complete the project we had 9 days to conduct user research, and develop a prototype.

The solution we will propose must meet certain criteria defined by the Wellness Institute:
It has to be a smartphone application

  • It has to be MVP
  • The solution has to be relevant according to user needs
  • The design system has to be versatile (Indeed, the Wellness Institute wants to be able to apply the app to other issues around wellness.)

To frame this project we have established our UX strategy :
To start the project, we will do secondary research, business analysis, do a survey, and do Job To Be Done interviews. It is the empathize part.
Then we will gather this information with an empathy map, and we will brainstorm, and ideate with How Might We. These tools will allow us to find design opportunities.
Then we will prioritize the features by using the MOSCOW method to create the mid-fi and have it tested and iterated.
With all this information we can move on to the UI by creating the brand attributes, the moodboard, the style tile, and the high-fi prototype. Finally we will perform a desirability test.

🗺 — Process

🔬 — Secondary research

Our first step was to do some research. Neither Charlotte nor I have asthma or any special knowledge about it. So we first asked ourselves what asthma was.
Asthma is a chronic respiratory disease that manifests itself in episodes that are breathing discomfort. It turns out that in France this disease affects 4 million people. There are 60,000 hospitalizations each year due to the disease, and it causes the death of 1,000 people, which means that on average 2.7 people die every day due to the disease. We can also note that the number of asthmatics has increased by 40% in 20 years.

Asthma has triggers:

  • Genetics (a person with asthmatics in their family is more likely to develop the disease as well)
  • Air pollution
  • Climate conditions (specifically humidity and temperature)
  • Allergies (especially cats and dust mites)
  • Pollens
  • Anxiety and strong emotions

📊 — Business analysis

To continue our research we were interested in pre-existing apps for asthmatics. We selected 5 apps:

  • Pollen alerts; which indicates pollen levels by location.
  • Asthma activ’; an application for monitoring the disease (recording attacks, treatment, medical appointments)
  • Propeller; tracking app that works with a device that you have to buy to reference the quality of your breathing
  • SOS asthma: application that references where you can find Ventolin according to your location.
  • Asthma Act: One-page app that gives instructions to follow in case of an attack.

📝 — Survey

To collect quantitative data and to have a better understanding of the user, we create a survey focused on the trigger of the attack, and how it is managed.

This survey was published on a support group for asthmatics on Facebook. We collect 65 answers. To be sure that only asthmatics people answer our survey, the first question was “Are you asthmatic ?”.

Among the results, 2 results have particularly retained our attention :

  • In 62,2% of cases asthma attack is simultaneous with an allergic attack
  • 60% of asthmatics have already had an attack without having their treatment available.

🎙 — Job To Be Done interviews

To deepen the subject, and understand exactly what happens before, during and after crisis. We did Job To Be Done interviewed with asthmatic people.

We asked them about the course of the crises, and how they manage them.

We could notice a great detachment of all the users when talking about the disease, for example many of them do not have their Ventolin on them every day.

“Asthma management is disabling but not the asthma itself “

But when they talk about the crisis itself is more experienced as a moment of anxiety. As the quotes show;

“Can’t talk during a crisis”

“ I was in an absolute distress”

It was also noted that users complained about the lack of information and awareness about asthma. This cause the inability for the people around us to help them in these moments.

📌 — How might we ?

To analyze all our research and gather all the information collected we made an empathy map, and we did a How Might We to define our design opportunities.

We found the following three HMWs;

HMW help the person to communicate with other people when he has a crisis ?

HMW inform the user on the level of the factors that trigger an attack ?

HMW make the content appealing to learn and easy to remember ?

🔎 — Features prioritization

It is with these design opportunities that we proceeded to the features prioritization by doing the MOSCOW methods.

So we selected three features for our MVP:

  • An emergency page that allows you to communicate via your smartphone with someone around you when a crisis occurs.
  • A profile page where you can fill in information about your disease (type of asthma, triggers, phone number…)
  • A forecast page where you can find information about your triggers that can be referenced (pollens, air quality, humidity level).

User flow

To start building the application we started by making a user flow for the three main features.

User flow of the SOS feature
User flow of the profile page
User Flow of the trigger page

📱 — Mid-fi prototype and user testing

Thanks to our user flow, which allowed us to have the information architecture, we built our mid-fi prototype that we tested with 5 users.

We had the following comments:

“ It’s too much information ” (On the Asthma trigger page)

“ I didn’t know I could scroll ” (About the profile page, and the the instructions on the emergency page)

“ I can’t stop clicking on this button ” ( about the SOS Feature)

But overall, we had a great welcoming for the app and the concept.

UI

Brand attributes

After iterating, we started the UI phase.

We proceeded to a UI benchmarking, then we brainstormed to find the brand attributes:

  • Support
  • Foreseeing
  • Appeasement
  • Be calm

We selected these words because our app should help and prevent risk factors.

Moodboard

For our moodboard, we wanted to create a relaxing atmosphere to help the crises. Indeed, anxiety and stress can make a crisis worse. Also, we wanted to remind how vital the help of others was.

Style tile

For the tile style, we stayed on something very simple. We have a single font : Roboto on which we have modified the sizes, and we have taken this lagon image as a color inspiration, using different variant of this dark blue.

This was to have a calming and breathable atmosphere.

High-Fi Prototype

The video below is a demo of our high-fi. This is the user path through sending an SOS message, the profile page, and the asthma trigger page.

Desirability testing

Our last step was to do a desirability test. It turned out that our app was :

  • Smooth
  • Reliable
  • Secure
  • Honest
  • Technical

This is good feedback for us because we wanted a simple, clear app, which is represented by “smooth”, and it is important that it is secure.

📝 — Outcomes

The next steps for this MVP would be to create a feature that allows contact with people who have Ventolin and who are close to an individual who is having a seizure. We have also thought of a voice message to ask people around to look at the phone.

We would also like to be able to offer a feature with sophrology exercises, and information that would allow individuals to better manage their attack and the diseases.

About the versatility, we can imagine that this app can quite easily be applied to other chronic diseases and more specifically to those that cause attacks.

It can be used in emergency situations. For example for individuals with heart problems.

This project was a way for me to learn how to implement my own UX strategy. For the first time we were free to manage our time, and what I found interesting was the time management.

Thanks a lot for reading me !

--

--