Context

The briefing from the Daily Health Conference challenges designers to reimagine how individuals can effortlessly adopt and stick to a routine that enhances their well-being. It outlines the creation of an app from scratch, covering everything from branding to a high-fidelity prototype. I partnered with Mattia Tempesta and Alexandre Fourgous to create a Minimum Viable Product (MVP).

This case study explores the iterative process underlying our product's design journey. It delves into how ideation, user-centric UX considerations, and thoughtful UI choices shaped an app offering personalized breathwork sessions alongside a seamless, intuitive, and visually appealing experience.

My role

We structured the project into two sprints (10 days) in accordance with the SCRUM methodology. This strategic approach allowed us to effectively prioritize tasks and meet all deadlines. Throughout the entirety of the project, I actively participated in every stage, undertaking tasks such as user research, competitive analysis, the creation of user personas and user journey, project definition, moodboard development, style guide, design system, as well as the iterative creation of low, mid, and high-fidelity prototypes.

The challenge

The major challenge we faced was the need to establish the branding foundation prior to delving into the design phase, without the presence of explicit design directives.

As a result, we engaged in comprehensive research, meticulously collecting authentic data. This focused effort aimed to create an MVP that fulfilled user needs while differentiating itself from competitors.

Our primary objective was to construct an approachable and user-friendly solution that facilitated users in enhancing their well-being through a scientific and innovative method.

01 Research

Our initial step involved market research, during which we conducted an examination of the disciplines within the well-being market. This research guided us in selecting a product that could fit well in the market.

Due to the increasing adoption of breathwork techniques globally, attracting individuals of all age groups and offering a practice that is both simple and cost-free, we chose to focus on developing an MVP for a personalized breathwork app with real-time biometric data integration. Consequently, we applied the Design Thinking framework to execute the project.

Competitive Analysis

We followed the research by conducting a competitive analysis, which facilitated the identification of relevant market positioning and established the project's scope. We delved into the offerings of various players in the field of breathwork to comprehend their practices, formats, and performance-tracking methods. The analysis revealed key insights from the following competitors:

• The competitors emphasize meditation and mindfulness, with their offerings encompassing courses and exercises. Users benefit from insights into their habits.

• They cover a range of practices including meditation, sleep, breathwork, yoga, and journaling.

• The app's format includes audio and video courses. Competitors engage users with challenges and include mood tracking, as well as integration with Apple Health to personalize the experience.

• The content is delivered through audio, animated visuals, and video, allowing users to track streaks, motivation, and challenges.

Users research

To gain a deeper understanding of the current breathwork landscape and the challenges individuals encounter in engaging with it, we conducted a comprehensive survey. The survey received responses from 60 participants.

Notably, participants favoured practising breathwork with their eyes closed, often accompanied by soothing auditory cues. Stress reduction emerged as the primary motivation. However, a common hurdle emerged – many participants found it challenging to integrate breathwork into their routines, often overlooking its importance precisely when needed most.

These findings helped us to effectively address these challenges and provide a user-centric solution for an easy-to-use and effective breathwork practice using an App. Additionally, we conducted 5 interviews, each lasting around 45–60 minutes, to gain deeper insights into users' familiarity with breathwork.

With the survey data and insights gleaned from the interviews, we organized the information into an Affinity Diagram. This process allowed us to identify recurring patterns and themes, forming the basis for our user persona.

02 Define

User persona

During the Define phase, we created our primary user persona: Mary – a wellness advocate navigating the challenge of focusing on breathwork. Mary's persona narrative reveals she as a mindful seeker faces stress and anxiety during high-pressure scenarios such as job interviews, and discovering refuge in breathwork, meditation and yoga classes.

User journey

Recognizing that breathwork could have eased past stressful situations drives her motivation to integrate it sooner. This analysis helped us identify issues and chances for our App to provide effective solutions. Mary's user journey demonstrates how she handles job interviews while practising mindfulness activities like yoga, shaping our design around her experiences.

Problem statement

Moving forward, our focus shifted to comprehensively understanding the precise issue that required attention and the underlying motivations behind it. This culminated in the formulation of a concise problem statement.

The problem statement is crucial as it provides a clear and concise articulation of the issue at hand. It serves as a guiding beacon throughout the project, helping to ensure that efforts remain aligned with addressing the core problem and its root causes. By formulating a well-defined problem statement, the project team and stakeholders can maintain a shared understanding of the objectives and direction, making it easier to devise effective solutions and track progress accurately.

How Might We

The "How might we" technique served as a pivotal guide in shaping our design direction.

• First, we pondered, "How might we integrate real-time biometric data into an app to amplify the impact of breathwork?" This led us to envision dynamic visualizations that showcase users' physiological responses in real time, fostering a more engaging and personalized experience.

• Second, tackling the question, "How might we help users of all proficiency levels with tailored guidance?", helped define an intuitive user journey, curating content based on experience and knowledge, ensuring a seamless learning curve.

• Lastly, addressing the query "How might we incentivize daily breathwork practice for users to reap its rewards?" inspired us to devise a gamified progression system allowing users to track milestones and feel the immediate benefits of their commitment, fostering motivation and continuous engagement.

03 Ideation

During the ideation phase, we prioritize features using the MoSCoW method, a four-step approach for determining which features to develop for the MVP.

For the app's initial release (MVP), we consider the following features as must-haves: home screen, smartwatch integration, GDPR compliance, biometric dashboard, progress metrics (practice minutes and streaks), mood-dependent classes, and advanced search options. Based on the collected data, we decided to create a personalized breathwork app that incorporates real-time biometric data integration.

User Flow

The MVP journey commences with an onboarding phase featuring a brief questionnaire. Upon completion, users are prompted to enable notifications for their smartwatch to facilitate data tracking and choose if they want to have a voice or guided text depending on their current situation in case they don't have earphones.

Upon successful setup, users land on the home page, where they are presented with an array of class options tailored to their mood and the duration they want to choose. Once they take the class, the app will reward them with a gamification feature and allow them to see their progress.

The user can decide to continue taking another class or explore more app functionalities. The user can also explore its profile and see the progress. Additionally, the app offers emergency exercises for quick relief.

04 Prototype

Low and mid-fidelity wireframes

During the prototyping phase, our initial focus was on creating low-fidelity wireframes and conducting Concept Testing. This allowed us to assess the user’s comprehension of our approach and make necessary adjustments for the mid-fidelity prototypes. Although we had established a consensus on the user flow, we encountered three distinct ideas regarding the dashboard’s appearance.

Usability testing

During the development of our mid-fidelity prototype, we carried out Usability Testing for each flow, which consisted of giving our users a list of scenarios and tasks to complete while we encouraged them to think aloud throughout the test. Unfortunately, the results did not meet our expectations. Users found it challenging to navigate and understand how to utilize the dashboard screen effectively.

Since the initial experience did not align with the application’s purpose of alleviating stress and promoting well-being, we had to pivot and shift the design to be user-centred. For that reason, we made the decision to create a simplified version of the mid-fidelity prototype. We conducted another round of testing to ensure that the design met the necessary criteria. Once confident in its viability, we progressed to the next phase: the User Interface development.

UI Phase

Visual Competitive Analysis

We conducted a Visual Competitive Analysis to gain insights into the communication style and branding of our competitors. This analysis aided us in creating our moodboard. Our aim was to reflect specific brand attributes, including calmness, sophistication, mindfulness, clarity, and minimalism.

Style Guide

We created a Style Guide to maintain brand consistency and ensure that every aspect of our app reflected our brand attributes across each screen, and named our app “Buena Onda”. We conceptualized both the name and the brand identity for the breathwork app, crafting a distinct identity that encapsulates its essence. The app is named "Buena Onda," drawing inspiration from the Spanish expression for "good vibes." This name embodies the positive and uplifting atmosphere that breathwork aims to cultivate. The translation, "good waves," alludes to a deeper connection with the concept of brainwave frequencies. Engaging in breathwork induces a state of mental and emotional balance akin to waves' rhythmic ebb and flow. Thus, "Buena Onda" resonates with the harmonious alignment of one's breath, mind, and body, fostering a serene and refreshing experience within the app.

High Fidelity Prototype

UI Details

Testing

After creating our high-fidelity prototype, we wanted to ensure that users would like our design, so we conducted Desirability Testing and Memory Testing.

Desirability testing assesses users’ emotional and subjective responses to a product’s design, including visual aesthetics, branding, layout, colour scheme, typography, and style. We used qualitative research methods and conducted three interviews to gather feedback. This helped us identify users’ initial impressions and preferences, allowing us to create a more visually appealing design. Additionally, we conducted Memory Testing to identify any confusing elements or complex workflows. We used these insights to enhance learnability, and efficiency, improve the design and overall user experience and finally create our high-fidelity prototype.

Learnings

• Simplifying matters: Avoiding unnecessary complexity. We all appreciated the uniqueness of the wheel design on our mid-fidelity prototype, but it complicated several processes and confused users.

• Early and continuous testing: We realized the significance of testing early and continuously during the process.

• Competitor analysis is crucial: Gaining a solid understanding of the market is vital for differentiation and offering a unique perspective and design solution.