Team: Robin Kuang / Richard Xu / Leon Zhang

Duration: 8 weeks

Spiritus is KNOX Medical Diagnostic‘s mobile app and mouthpiece for testing pulmonary health in asthmatic children. Through Berkeley Innovation, I was given the opportunity to work closely with KNOX’s founders and a multidisciplinary team to design the user experience and user interface for Spiritus.

The focus of this project was to design a mobile app that is intuitive for both parents and asthmatic children to use on a daily basis.

Defining the Problem

As a consultant for Berkeley Innovation, my teammates and I were approached by Knox Medical Diagnostics, a start-up incubated in Berkeley, with a design problem. Though the need was given to us from the start, we decided to tackle the problem from a user-centric perspective and leave no stone unturned.

The Problem

Monitoring lung health is difficult. Current at-home tests are inaccurate, and the best method currently is to conduct a spirometry test. However, spirometry tests require expensive, immobile equipment in hospitals, making them inaccessible.

In the context of asthma, asthmatics live in constant fear of potential asthma attacks throughout the day. This fear can be mitigated by taking consistent spirometry tests throughout today, allowing asthmatics to take preventative measures to prepare for or prevent an upcoming asthma attack. However, the current infrastructure limits this, which is what Knox Medical Diagnostics set out to solve.

A patient taking a spirometer test in a hospital.
(Photo Courtesy: Wikipedia)

What is Spiritus?

Knox Medical Diagnostics offers asthmatics the power to control their next breath by introducing a portable spirometer, which can communicate via Bluetooth with a mobile phone to provide instant feedback on your lung health.

In short, lung health can be assessed by the ratio of how much air a person can breathe out to that person’s lung capacity at the time of the test, which their portable spirometer delivers with FDA approved quality.

Co-Founder Charvi Shetty holding one of the first portable spirometer prototypes
(Photo Courtesy: Preston Davis)

For this project, the Co-Founders at Knox asked my team to build the user experience and user interface for their Spiritus mobile app.

User Research

Before jumping into the project, we decided to begin with preliminary research to better understand our users.

Who is most affected by asthma?

Although the population of adults with asthma is greater than the population of children with asthma, the percentage of children with asthma is greater. In addition, a greater percentage of children reported having at least one asthma attack. In other words, asthma seems to affect children greater than adults. We decided to delve into this more:

Asthmatic Children (18 and younger)

Considering asthma is the leading cause of chronic disease among children, we validated the reality that children are greatly affect by asthma.

What do children and their parents actually want done about asthma?

After validating the need that children are greatly affected by asthma, the Co-Founders of Knox set out to do 5 user interviews with parents of asthmatic children and asthmatic children. A few key insights were found and shared:

Co-Founders Charvi and Huyson chatting with Finn, who is holding a Spiritus portable spirometer prototype

Parents wish they could monitor their childrens’ health throughout the day from anywhere.

Parents wish they could pinpoint trends about when and why their children have asthma attacks to prevent future ones.

For children, carrying an inhaler can be a point of social and personal stress.

Who would use the mobile app, the parent or child?

Parents of first-time children are on average 26 years old, which falls between the range of 78% of 25-34 year-old adults who own smartphones. With this data, it is likely for parents of asthmatic children to own a smartphone. As such, parents would likely be the one to own the app and share it with their child.

What is currently out there in the market?

(Competitor Analysis)

To better understand the market of portable spirometers, a quick Google Search reveals a lot about how expensive current devices are. Ranging from $115 to $2,150, portable spirometry is currently a financial burden.

User Personas

Through our user interviews and preliminary research, we decided to synthesize our data into user personas to best describe the users we’re designing for.

Ben, 33

Software Engineer
San Francisco, CA

Ben and his wife are busy parents who work full-time away from home. Kay, their daughter, has asthma and has been known to have sporadic attacks. He constantly worries about Kay’s health while she attends school but is unable to check on her through the day. He wishes for Kay to perform well in school, and worries when she has to miss school. He also does not have easy access to a doctor in case of an emergency, but he does own a smartphone.

Kay, 7

Elementary School Student
Berkeley, CA

Kay is in the first grade, and has asthma. She constantly worries about potential asthma attacks, and has to limit physical activity at recess and PE because of her asthma. She has to carry her inhaler with her all the time, and worries about what other students think of her. She enjoys playing video games in her free time.

Wireframing and Iteration


With all the insights we gained from our research, we began our wireframing by whiteboarding the core of the user experience flow from testing to settings.

The greatest challenge we faced was considering the flow from both a parent’s and child’s perspective, as the app would eventually be used by both users.

Some Design Decisions

Who is using the app when you launch it? What does onboarding look like? Should there be separate onboarding flows for parents and children?

The mobile app would be installed on the parent’s smartphone, so intuitively onboarding would a user experience flow designed for a parent.

What should we prioritize the first screen be? Is this screen different for parents and children?

Regardless of whether the parent or child is using the phone, the first screen and home page should be the testing screen. Considering this is the major reason for having the app, the priority of the testing flow should be first. To draw a comparison, Snapchat’s home screen is the selfie screen; it makes sense to prioritize the home screen based off the app’s function.

How might we make the experience more enjoyable for children if parents have to force them to use the app daily?

Parents are naturally inclined to monitor their children’s health on a regular basis, but the burden of the testing truly falls on a child, who may not be as inclined to take tests daily. We decided to gamify the testing process in order to create incentive for children to want to reuse the app each day. To do so, we included a timer on the landing page to track when the next test could be taken, as well as personality, Blu (blue and blew), to make the app more personable and interactive.

Experience Flow

After whiteboarding, we clarified and consolidated the experience flow onto paper and began to draft low-fidelity screens for the experience flow. During these sketches, differentiating between when the parent and a child would use it introduced “Kid Mode,” which denotes all of the process done by a child.

To clarify the separation between child and parent interactions, we drafter a higher fidelity experience flow using color to denote child and parent interactions.

With an overall experience flow, we began to create low-fidelity wireframes in Balsamiq and create an interactive prototype to begin preliminary usability testing.

Final Deliverable

For our final deliverable, we decided to mockup high-fidelity screens and present them in a format best fit for Behance and in a poster format suited for Berkeley Innovation’s end-of-semester Showcase.


What I Learned:

The Value of User Interviews: Nothing beats talking directly with users

Data-informed Decisions: Used data to back-up our design decisions

Always Consider the User: Seamlessly integrating two separate interactions for parents and children was a challenge

Next Steps:

InVision: Create high fidelity, interactive prototype using InVision

Usability Testing: Conduct heuristic evaluations or usability tests to assess success of designs

iOS Guidelines: Follow iOS guidelines for visual design

Results Data Analysis: Provide a wealth of data analysis tools to provide accurate assessments of daily and weekly trends