UX/UI case study: habits tracker

Published in

Bootcamp

7 min readJul 11, 2022

The challenge

As part of an IronHack UX/UI Bootcamp, I was challenged to design an app that “measures something.” Yes, the instruction was that broad, and I had only two weeks to do it.

I chose anxiety as a starting point and applied the Design thinking methodology to find a problem that was worth solving. I focused on this methodology’s empathize, define, ideate, and prototype stages.

Design thinking process: Empathize, define, ideate, prototype, and test.

Empathize stage

Surveys

To better understand how people approach anxiety, I surveyed 42 Mexicans to realize what they thought about it and what they currently were doing to manage it.

1.- How would you describe anxiety?

They answered with concepts like lack of control, overthinking, fear, negative thoughts, panic attacks, and physical reactions like difficulty breathing.

This question gave me information about what concepts people relate to anxiety. I noticed that some people better understand how anxiety manifests than others.

Results (in Spanish) of what people answered: How would you describe anxiety?

2.- What do you rely on to manage anxiety?

They said things like Talking to friends or family, breathing techniques, exercising, hobbies, meditating, therapy, work, drugs, and music.

This question gave me information about what they thought helped manage their anxiety. People have found different techniques to deal with it, but not everyone has overcome it.

Interviews

I interviewed a mental health expert, and he explained to me that depending on the school of therapy and tool, specialists will diagnose differently if a person has or not pathological anxiety and to which degree.

For example, on one side, the Diagnostic and statistical manual of mental disorders says you need six months of symptoms to evaluate if a person has anxiety, and they categorize more than ten types of them. On the other side is Beck’s Anxiety Inventory which says you need just one week of symptoms to recognize pathological anxiety.

We need the knowledge and experience of a specialist to apply these existing tools accurately and interpret the information gathered from the patient.

Understanding and measuring anxiety is not a simple task.

I started wondering: if this is not easy, how do people learn about their relationship with anxiety, and how do they learn to overcome it?

I interviewed seven people around 27–35 years old to understand how they learned about anxiety in their lives.

I found that they have learned, mostly in therapy, to identify anxiety and understand how to manage it over several years. Five of the seven interviewees mentioned that it was relevant to consult with a psychologist to start understanding their relation to anxiety in their lives and then start a self-discovery process.

Define stage

The problem

In this self-discovering process, one of the biggest challenges for them is to identify and be conscious about habits that boost anxiety and that make them feel far away from it.
They recognize that they are prone to getting sick when staying in a loop of bad habits for a long time.
It’s frustrating to forget the negative impact of some habits and recognize it until feeling bad.

More research

How do habits, anxiety, and health are related? To solve this question I did desktop research and discussed it with the specialist.

I got these insights:

Bad habits usually include behaviors that negatively and silently impact your health.
Habits aren’t always the main cause of anxiety, but they relate.
Bad habits can be a way of monitoring if anxiety is present or not: For example, if you eat more than what your body needs, that could be a signal of experiencing anxiety. Eating could be a way of coping with anxiety that you don’t notice.
Bad habits can be the cause of anxiety sensation: For example, if you spend several hours on your phone before sleeping, you won’t rest well. May be next day you will experience anxiousness because your body didn’t recover at night.

If you are experiencing a high degree of anxiety, changing habits it’s not always the complete solution. Maybe first, you will need the help of a specialist to find what is behind it and treat it from the root.

User persona & Journey map

I created a User Persona and mapped her journey in dealing with anxiety, health, and habits through her last five years, aiming to understand whom I should design for.

She is Amira:

A couple of years ago she took therapy and start learning about her anxiety.
Since then, she has been in a self-discovery process aiming to reduce anxiety in her life.
She wants to feel better every day and achieve her personal and professional goals.
She is struggling to deal with her bad habits.

She has been in a self-discovery process for some years aiming to reduce anxiety in her life. She wants to feel better and achieve her goals. Now she is struggling to deal with bad and good habits.

Following, you will read what her mind looks like after getting sick or experiencing anxiousness:

1- She wants to understand why she got to this point of feeling anxious or getting sick.
2- She starts evaluating her habits in the last week.
3- She identifies some bad habits that led her to that state.
4- She frustrates because is a normal week is difficult to remember the impact that some habits have on their health.
5- She wants to avoid these bad habits.
6- She is afraid of having a relapse of these bad habits.

The opportunity

I saw the opportunity to design a tool that contributes to diminishing anxiety and bad habits relapses by helping people like Amira reduce their bad habits.

How might we help Amira to reduce her bad habits?

Helping her:

Identifying bad habits
Understanding the relationship between each habit and its impact on her wellness
Finding substitutes for them
Keeping track of their achievements on substitute habits

Ideation stage

After an ideation session, I came up with this idea:

Bad habits tracker that helps you identify, track and substitute your bad habits for good ones and get better wellness:

The app will help you identify bad habits and find substitutes by answering a simple form.
While responding to the questions, you will always have information that will help you do it more accurately.
The information you register in the form will automatically be logged into your home screen as a weekly habits tracker tool.
At this point, you can track if you achieve substituted the bad habit for the good one daily
The apps promote self-discovery and patience in your process of changing habits.
The moment you discover a new substitute that works better, you will be able to edit the details of your habit.
The maximum number of habits you could track simultaneously is 3.

Prototyping stage

I started creating a paper prototype to come up with the first ideas for the app’s interface.

After the first sketches on paper, I realized it would be helpful to map a user flow diagram before continuing to create more wireframes. A user flow diagram is useful to figure out the flow of an app. It permits you to understand the experience you want your customers to have.

Mid-fidelity prototype & testing

Once I mapped the user flow, I created the mid-fidelity prototype and test it with two people to see if the flow was clear enough. With the testing, I realized:

The home screen could be redesigned to give more valuable information at first glance.
There was a button that doesn’t seem like a button. Needed a redesign.
I could make the form screen simpler, changing the way I present the information.

Mid-fidelity prototype with changes after user testing

Moodboard and components guideline

To create the final prototype I first choose the color palette and style of the product by gathering images and putting them all together in a Moodboard. As I was designing for people who are struggling with habits, I selected elements that help them feel calm.

Then, I made a components guideline so it would be easy to design all the screens for the high-fidelity prototype.