Self Care: an app to support people who struggle with mental disorders
A UX case study, from research to a mid-fi prototype.
My first individual project for my Ironhack UX/UI bootcamp was about creating a concept for a habit tracking app to improve people’s lives.
These are the instructions that we were given by our lead teacher:
When I thought about an audience that I wanted to reach out to for this project, it only took me a few seconds to decide: I knew right from the beginning that I wanted to help people who struggle with mental disorders and that I wanted my app to provide support for when they need it the most.
What’s the definition of mental disorders, though?
Mental disorders (or mental illnesses) are conditions that affect your thinking, feeling, mood, and behavior. They may be occasional or long-lasting (chronic). They can affect your ability to relate to others and function each day.
If you’re not familiar with them, some examples of mental disorders are:
- Anxiety disorders, including panic disorder, obsessive-compulsive disorder, and phobias.
- Depression, bipolar disorder, and other mood disorders.
- Eating disorders.
- Personality disorders.
- Post-traumatic stress disorder.
- Psychotic disorders, including schizophrenia.
For this project I followed the double-diamond scheme, which features four different stages of design thinking (Discover, Define, Develop, Deliver) where divergent and convergent approach alternate. They are structured as follows:
If you want a detailed overview of my process, have a look at this Miro board!
Step 1: Discover
First of all, I needed to gather enough data to get an idea of what kind of habit linked to mental health status I wanted to break or encourage. In order to do so, I had to reach out to as many people as possibile, so that I could learn more about my target users. The fastest way to do this was through a survey.
Having this Lean Survey canvas as a guideline and using preliminary research data as a foundation, I came up with a 10 questions’ survey and got 267 responses. You can find the survey here.
Here are the major insights that I got from my survey:
- 21.3% of the people who responded suffer from mental disorders and also know someone who does, while another 35.2% don’t but they know someone who does.
- Anxiety is by far the most common disorder among them, and is followed by depression and eating disorders.
- Only 32.8% of people who suffer from mental disorders get professional help, also 52.4% of those who know someone who struggles with disorders said that this person gets professional help.
- Even though they have someone to talk to, 29.3% of them said that they feel very alone.
- On a scale from 1 to 5, when asked how often they tend to feel judged or misunderstood because of their problem, 23.7% of people voted 4, while another 13.6% voted 5.
- 16.9% of people who responded said that they used to rely on toxic substances to cope with their disorder, and another 22% still do.
- Many said that they tend to isolate themselves when they are at home (49.2%) or at parties (25.4%).
Interviews and Affinity mapping
Once I gathered all the data from both the italian and the english version of the survey, I came up with some questions that I wanted to ask during the interviews and I moulded them into prompts to encourage my users to tell a story.
I conducted a total of 8 interviews: five of my users were women and the other three were men, ranged between 22 and 35 years old. They were all students except for one who was a B&B receptionist.
All the insights that I got from my interviews were collected on sticky notes in the Miro board: this way I could easily have an affinity mapping session where I gathered all the insights that shared commonalities under the same category to find the major pain points in my users’ experience.
Step 2: Define
The Affinity mapping brought to my attention 5 major pain points:
- Users need to engage in some activities and set goals in order to find motivation, otherwise they tend to feel powerless and get overwhelmed by their negative feelings.
- Users are scared of being vulnerable in front of others, they don’t want their peers to know about their struggles because they want to convey a “perfect image” of themselves who is in control of their emotions and doesn’t need any help.
- Users tend to overthink the most when they are alone and sometimes they don’t know how to get out of their head (even though many of them mentioned that yoga and meditation help).
- Users would like to see more empathy and raise awareness about the topic, but their fear of coming out of their shell and talk about their issues prevent them from contributing to the cause and make a change.
- Users’ mental status has been highly influenced by the ongoing pandemic.
Key Insight, “HMW” question and Problem Statement
After I found the major pain points that affect my users, I used Design Lib’s template as a reference to define a key insight, a “How Might We” question and a Problem Statement.
It is worth mentioning that the first time around I focused those on the theme of isolation, but on later steps in the Define stage I found out from my users that I was walking down the wrong path because company and understanding are not their main priorities: what they really need is to take control over their emotions so that they can focus on their life goals.
Once I realized that, I took a step back, had another look at my findings and came up with the following:
You might be wondering who is this Fiona that I mention in the Key insight.
Well, Fiona is my persona, that is a reliable and realistic representation of my target user. A persona helps designers maintain the focus on the user while approaching the development phase of the project.
The “Crazy 8's”
The “Crazy 8's” are a great technique used by designers to quickly sketch their ideas. This is the stage where I found out that my previous conclusions in terms of problem definition were wrong.
In fact, as you can see from the picture above, my ideas were all over the place: there were many options that I wanted to include in my prototype, but they were all different from one another and I couldn’t possibly implement all of them. At this point, I started feeling a bit lost and confused, I didn’t know how to narrow those possibilities down and choose some to prioritize.
The thing that helped me overcome this roadblock was the group crits (aka “group critique session”): my classmates and I had been divided into three groups of five to present our work in progress, get first impressions and receive feedback on our work.
Each student had 15 minutes available, and our lead teacher and teacher assistant were also present to facilitate the conversation and give their two cents on the project that were presented. When my turn came, I talked about this issue and my lead teacher Nevan suggested that I should rely once more on my users to see which of these options were most needed.
Following this suggestions, I reached out to 11 users and asked them to rate these options from their most (1) to their least favourite (8). Here are the results of those ratings:
The options that ended up on the podium were weekly goals [F], meditation and mindfulness exercises [C] and daily mood check-ins [E]. These results made proved that isolation was not as relevant and users’ need for control over their lives.
Step 3: Develop
At this point I had a clear idea of where my project was headed, but I needed to visually represent those ideas into a first draft of a paper prototype. At this stage I already came up with a name for my app: Self Care.
Here you can see a first concept for the user flow of my app, from the daily mood check-in to the completion of meditation and mindfulness exercises.
From there I quickly moved onto mid-fi prototyping using Figma.
Before we start digging deeper into the design choices that resulted from 3 sessions of usability testing and iterations, I’d advise you to have a look at my interactive prototype so that you can get a better understanding of the concept. You can play with it here:
Usability Testing and redesign
As you can imagine, it took a lot of tests and iterations to develop the first draft of paper prototype until the latest version of the interactive mockup.
I conducted a total of 8 usability tests divided into 3 different sessions, so that I could alternate test and iterations in the design.
Here are the major changes in my design:
The Daily Mood check-in
The Home Page
The Exercise Completion message
The Help Center
Step 4: Deliver
After my project was done, it was time to present it. I created some Google slides where I put all the most relevant information to give a quick, yet complete overview of my process.
The presentation had to be 8 minute long, but I ended up taking 4 extra minutes — even though my storytelling was engaging enough that I didn’t lose my audience attention, so that’s something!
You can have a look at my presentation here:
Conclusion & Retrospective
What I think I did well
- I followed the Design Process step by step, from Discover to Deliver.
- I engaged with my users for the entire duration of the project and relied on them during each and every step.
- I acknowledged that I was wrong about something and took a step back, had another look at my gatherings and found a better solutions that was coherent with my users’ needs.
- The storytelling during my presentation was pretty good, I didn’t lose my audience attention and I explained my process in a clear way.
What I need to improve
- I need to trust the process and believe that everything will eventually work out.
- I need to make more sketches and paper prototyping before jumping into Figma, despite how tempting it can be.
- I need to make the first draft of a mid-fi prototype quickly and prioritize starting usability test as soon as possible over having a detailed prototype to show: at the end of the day, my users will tell me what to do and details will come up as a natural consequence of the feedback that I receive.
- I should refine my presentation skills.
Thank you for your time, and feel free to leave a comment with your thoughts!
Feedback is highly appreciated! 😃