Exhale

Case study for meditation and mindfulness app

Frame 9 (7).png

Project Overview

MY ROLES

  • User Research

  • UX/UI Design

  • Branding

  • Prototyping

  • Usability Testing

TOOLKIT

Exhale (5).png

TIMELINE

5 weeks, approximately 100 hours

BACKGROUND

Living in a pandemic has shed additional light on the importance of taking care of yourself not only physically, but mentally. Exhale is a mindfulness meditation app focused on increasing mental health accessibility globally, whether you have access to the app or not. As part of DesignLab’s UX Academy curriculum, I was tasked with the challenge of researching and designing a mobile app for Exhale from end-to-end.

THE PROBLEM

Mental health issues are prevalent, and effect millions of people worldwide. It is essential for people to care for their mental health because it is integral to living a healthy, balanced life. With several different wellness apps that support various facets, how can we develop a product that helps people take care of their mental wellness the way they want to?

THE SOLUTION

Competitors currently on the market do not leverage gamification ideologies to encourage users to set and meet their customized goals as a way to expand and deepen meditation practice. As well, competitors are only making mindfulness accessible to people with access to technology. Neglecting these categories, creates great opportunity for Exhale’s mobile app.

Design Process

RESEARCH

Discovery & Immersion

Goals & Assumptions

To get the most out of the research process, I not only outlined the research goals, but my assumptions as well. Jotting down my own personal assumptions helps me focus on what the facts say, rather than what my experiences have led me to believe.

Competitive Analysis

I conducted an analysis to better understand the strengths and weakness of Exhale’s competitors. From this research, I noticed that there are a few areas of opportunity in the market:

  1. Leveraging gamification ideologies to encourage users to meet goals

  2. Reflecting and mood tracking are not emphasized as a valuable method to help users with anxiety/stress

  3. Businesses are only focused on increasing mental wellness accessibility to people with access to technology

Survey Findings

It’s fascinating to learn that there is a growing community of people who use and may also depend on mobile mental health applications. The known stigma around mental wellness can be an immense struggle. The responses from the survey had repetitive trends: empathy, patience, and flexibility.

  • 100% of participants have experienced anxiety, stress, or depression

  • 94% of participants have a close relationship with someone who struggles with anxiety, stress, or depression

  • The most popular methods to deal with mental health are: Physical Exercise 76.5%, Mediation 70.6%, Breathing 58.8%, and Journaling 47.1%

1:1 Interviews

I interviewed 3 participants, ages 20-42. who have previous experience or current experience with meditation. Mental health is a sensitive subject and I did my best to make a safe place for interviewee's to share their experiences to help widen my perspective on the importance of mental health. 

Needs

  • Better their mental wellness by decreasing stress/anxiety

  • Customizable programs

  • Affordable app 

  • Track goals and moods

  • Community to compete and practice with friends/family 

  • Reminders to tell me to practice

  • Having an outlet to cope when things are in or out of your control

  • Secure/trustworthy app

Pain Points

  • Lacks results

  • Not knowing what to practice that day

  • High cost or limited access to free options

  • Low accountability 

  • Poor educational resources 

  • Practices come from marketers rather than industry experts

  • Not being able to incorporate friends/family

Empathy Map

I curated an empathy map that aligns closely with the research conducted. This application is centered around two points:

  1. Understanding how users manage their mental health

  2. How users feel when they are stressed and anxious

It’s imperative that we use this empathy map going forward to create a mental health app that takes these feelings into consideration

User Persona

This persona will help me screen appropriate people to interview and makes the user’s goals and pains easily accessible and relatable. It also helps me focus on tackling the most important needs. This was one of the most important steps in my design process and paved the way for information architecture to take place.

I created a user persona based on the research compiled. Let’s meet Jenny!

Her main need is to develop a meditation practice and incorporate it into her daily routine. She is interested in a mindfulness app where she can customize her goals and track them over time to help cope with her anxiety and stress.

DEFINE

Interaction Design

Goals, Defined

Identifying the overlap of user and business goals was crucial for directing product development while maintaining stakeholder alignment. These goals will help clarify what is needed in the product.

The important takeaway here is, Exhale needs to be a safe environment to help users cope with stress and anxiety in a way that suits them best.

Product Roadmap

These product features are sorted into three categories, including Must-Have (P1), Nice-to-Have (P2), and Surprising and Delightful (P3) features. Key implementation features to highlight are:

  • Onboarding questionnaire

  • Content - there needs to be a minimum amount in order for Exhale to launch initially

  • Allowing the user to customize the experience

The Product Roadmap is supported by user research and not only infuses the project goals, but also ensures we prioritize the most important features in the development cycle.

Site Map

After creating the feature roadmap I outlined the site map to visualize the integration information architecture and organize the screen flow. The sitemap below illustrates the overall app navigation, defines the organizational structure, and how the integration fits within the current system.

The app’s navigation is broken down into 4 main areas: Home, Mediate, Reflect, and Profile.

User Flow

Now that I have the architecture of the app built out, I created a user flow to help understand how a user moves through the app. The two tasks for Jenny’s flow are:

  • Add a new mood/journal entry

  • Starting a new meditation

The reason I chose these two tasks is because at the very least the app needs to be able to allow users to complete these well. Developing these paths helped me determine how many screens are needed, what order they should appear in, and what components are required for the user to complete the task successfully.

IDEATE

Ideate & Brand Development

Wireframes Flow Analysis

Referencing the sitemap and user flows, I drew initial sketches ideating how the app might look. I then turned my sketches into digital wireframes and created other complementary wellness tools.

After analyzing my initial wireframe screens to ensure they align with business and user goals, I realized they could be improved.

  • Version #1 - Creating an account is a stressful situation and I need to be cautious of the mental state of the user. Exhale needs low barriers to entry to allow the user to see the benefits before making a commitment

  • Final Version - Changing the flow of the app to provide free features blends the business and user goals to make mental wellness accessible and takes the mental state of the user into consideration

Final Wireframes

After completing my wireframe flow analysis, I created the final wireframes for the following processes:

  • Onboarding screens

  • Choosing and completing a meditation

  • Creating an account

  • Logging a mood and journal entry

  • Profile page and tracking functionalities

Brand Development

After creating the wireframes, I moved onto the UI Design and Brand Development part of the process. I decided to name the app Exhale. The idea here is that users can take a breath of relief when they enter the app.

I chose typefaces that were easy to read, light in weight, and have soft corners to give an inviting and welcoming feel.

USABILITY

Prototype & Testing

Final UI Designs

After completing the brand development I created high-fidelity mockups. The screens below outline 5 different areas:

  1. Onboarding process and questionnaire

  2. A meditation

  3. Creating an account

  4. Making a mood/journal entry

  5. Looking at history and streaks

 

Usability Testing

I selected four participants, age 27 to 62, who meditate regularly to complete usability testing for the Exhale app. The test involved navigating the onboarding experience, starting a meditation, completing a mood and reflection entry, and exploring the profile section to look at weekly and monthly history.

Task Completion Rate

  • 100% task completion among 4 participants

Wins

  • All participants felt that the app was simple, straightforward, easy to navigate, and user friendly

  • All participants enjoyed being able to track mood and journal history to see how their wellness changes over time

  • Two people wish their current app was as customizable as Exhale

  • All participants appreciated the flexible subscription packages as well as the organization donation business objective

REFLECTION

Final Thoughts

Conclusion and Reflection

The problem was solved through in depth research to better understand the industry, potential users, and where gaps in the market are. I successfully designed an application to blend both user and business goals to create a product that encourages users to manage their mental health the way they need to.

What did I learn?

Speaking with other people on such a sensitive topic strengthened my empathy for others. Mental health and wellness should be more accessible. I believe technology and giving back to those without access to it play a massive role in that mission. 
Taking a more design perspective, this process allowed me to think deeply about every step involved in developing an app from end-to-end, as well as work with existing standards for app design.

Take a look at my other work ⬇

Justified Case Study

Justified Case Study

DesignHub Case Study

DesignHub Case Study

Google Fire Case Study

Google Fire Case Study

Previous
Previous

Google Fire Added feature to Google Maps to track wildfires & evacuation statuses

Next
Next

Justified A responsive ecommerce website for a sustainable clothing retailer