NIGHTBLOOM

A mental health application designed to enhance self-compassion through self-soothing techniques and mindfulness.

finalprototype

project details

ROLES AND RESPONSIBILITIES

Everything related to user experience design - research, analysis, concept development, testing, creation of a high-fidelity protype.

DELIVERABLES

Experience Map, User Stories, Task Flows, Persona, Visual Identity and Branding, Wireframes, High-Fidelity Prototype

PROJECT TYPE

Conceptual

TOOLS

Sketch, Figma, Invision, Whimsical

DURATION

8 Weeks

DATE

AUG 2020

problem space

SOCIAL COMPARISON

Nightbloom was inspired by the impact social media has on people's tendency to compare themselves to others. This behavior of social comparison is easy to do in a digital age where there is constant access to images of other people's lives. Unfortunately this often leads to the act of self-criticism, which is often viewed as a type of motivator towards improvement.

Research actually shows that self-criticism has the opposite effect, that when we know our failures will be met with criticism we are less likely to try to improve. In fact, self-criticism is a universal phenomenon that has been known to be associated with a variety of psychological difficulties including depression, anxiety and suicide (Kannan & Levitt, 2013).

SELF-COMPASSION

Research has found that an effective solution to self-criticism is something called self-compassion. Kirsten Neff, a researcher on self-compassion, describes it as "simply compassion directed inward, relating to ourselves as the object of care and concern when faced with the experience of suffering" (2003).

Self-compassion has been associated with social connectedness, increased life satisfaction and motivation to make positive life changes. People higher in self-compassion cope better when faced with hardship and have better interpersonal relationships. Self-compassion not only decreases self-criticism, but increases intrinsic motivation and personal initiative (Neff, 2005). With the benefits of self-compassion established, I posed a question that would direct the rest of the design process. 

DESIGN QUESTION

How might we increase people's self-compassion in order to decrease behaviors of self-criticism?

user research

RESEARCH STRATEGY

In order to answer this question I developed a research strategy aimed at uncovering the current contexts that people were likely to use self-criticism. We went over real-world examples, their response within these scenarios, and the reasons behind their use of self-criticism within their daily life.

Each interview also investigated the environments where self-criticism and social comparison were most prevalent. I conducted research interviews with 5 participants over Zoom and transcribed each of the interviews afterwards to help identify patterns, behaviors and pain points. These are a few of the themes and insights that I discovered.

avoidance

AVOIDANCE IS A COMMON REACTION

Participants reported that they would make efforts to stay busy so that they could avoid their negative thoughts of self-criticism. There were also reports of people avoiding the activity that caused the self-criticism in the first place.

habits

SELF-CRITICISM IS HABITUAL

Participants reported that their self-criticism had become a perpetual habit they felt helpless to fight against. Sometimes they would criticise themselves before an event occurred because they assumed it would end in a negative outcome.

comparison

SOCIAL COMPARISON IS OFTEN THE CAUSE

There was a common theme of using others as a basis for comparison which often fueled participants' self-ciriticism. Social comparison occured accross many areas of life including career, relationships and body-image.

market research

FINDINGS FROM INTERVIEWS

Participants felt that there often wasn't enough of an incentive to use their past wellness apps regularly. This resulted in abandonment of the applications. Participants also revealed that many of the wellness apps they used in the past focused on many different topics and did not focus enough on this problem specifically. Participants reported that the wellness apps they had used did not produce significant improvements in the area of self-compassion. 

OTHER WELLNESS APPLICATIONS

There were a number of applications on the market that focused on meditation, sleep assistance, journaling, mood tracking and mindfulness.

Direct competitors included a few journalling applications that had one or two self-compassion exercises, but were not the major focus of the application.

Mood tracking features were used as inspiration for the current design, but with a shift towards a more in-depth acknowledgement of emotions using mindfulness. This was essential in cultivating self-compassion, based on academic research.

Another common trend in mental health apps was the use of journalling. This was incorporated into the current design in order to encourage self-soothing words from users, but with much more pointed prompts with a focus on reducing social-comparison and self-criticism.

ca2
ca1

academic research

IN THE FIELD OF PSYCHOLOGY

In a study on evidence-based mental health apps, only 53% of the apps were associated with actual academic evidence and 33% referred to techniques for which no evidence could be found (Larsen, Huckvale, Nicholas et al., 2019).

In order to develop an evidence based concept, I reviewed academic studies on the topic of self-compassion and learned that there were 3 aspects of self-compassion that should be incorporated into the design of this product.

Rather than being harsh and belittling towards ourselves we should offer ourselves kind and encouraging inner dialogues. As obvious as this may sound, all of my interviews revealed that people offered themselves much less compassion than they offered to other people around them.

MINDFULNESS

In order to develop self-compassion, we must first acknowledge that we are suffering without overly fixating on the problem. Contrary to popular opinion, avoiding negative thoughts does not alleviate them, but actually makes it more likely that they will cause disruptions because they have not been processed.

We often over-identify with our problems by thinking that others do not face the same kinds of issues we do or at least not on the same scale. By reminding ourselves that imperfection is a normal part of being human, we should feel less isolated during times of struggle.

analysis

USER PERSONA

Meet Spencer, the Anxious Perfectionist. Spencer feels helpless to overcome her habit of self-criticism which leads to feelings of isolation, anxiety and stress in her life. She also avoids and distracts herself from her negative thoughts on a regular basis. Based on the data gathered from primary research, a persona was developed to represent the target audience.

persona
experiencemap

USER JOURNEY MAP

I also created an experience map which identified points of opportunity for design intervention. I discovered the importance of creating a digital space where users like Spencer could step away from the social comparison they face using other digital applications.

This was important for the creation of the social community feature of Nightbloom. I decided that this would be a place of encouragement and support where users would only be able to create text-based posts rather than images in order to eliminate the possibility of social comparison while using this app.

feature development

USER STORIES AND TASK FLOWS

Ideation started by creating user stories, statements which convey the functionality of the app from the perspective of the target user. These user stories were organized into logical groupings or themes which informed the development of task flows. Each task flow is a representation of a specific user goal paired with a few supporting user stories.

SELF-COMPASSION JOURNAL

Goal

Use a self-compassion technique to create a journal entry that will appear on my self-soothing board.

Task

The user will have the ability to create a new journal entry using evidence-based self-compassion techniques.

User Stories

As a self-critical person, I want to view prompts that encourage me to write self-kindness statements in order to increase my self-compassion.

As a self-critical person, I want to view a screen with all of my self-kindness statements in order to be reminded of my self-acceptance progress.

As a self-critical person, I want to add a new self-soothing statement in order to post to my compassion journal.

compassionboard

MESSAGES FROM YOUR PAST SELF

Goal

Set a daily reminder to receive self-kindness statements or quotes throughout my day in order to encourage kinder inner dialogues.

Task

Set a reminder using my compassion journal.

User Stories

As a self-critical individual, I want to set a reminder to receive self-kindness statements every day in order to reinforce habits of self-compassion.

As a self-critical individual, I want to receive a my self-kindness statements as a text message in order to be be reminded that my self-talk is just as important as the way I talk to others.

reminder_flow

MINDFULNESS

Goal

I want to have a safe and comforting way of acknowledging uncomfortable emotions in order to increase my self-compassion.

Task

Complete a mindfulness though excercise.

User Stories

As a self-critical individual, I want to view how many other people also struggle with the same issues that I do.

As a self-critical individual, I want to view a calming visualization after I input my negative thought.

mindfulness_flow

ideation

CONCEPT SKETCHING

Based on the task flows, sketches were created to investigate the potential look and layout of the screens. Fast and quick concept sketches were created to investigate a wide range of solutions and then further developed into more detailed concepts as I decided which flows to represent the flow best. Sketching was revisited  to circle back and iron out any issues encountered after  wire-framing began.

Compassion-Journal-Sketches

Mindfulness Technique Flow

Mindfulness-Sketches

Compassion Journal Flow and Setting a Reminder

greyscale wireframes

MINDFULNESS

This feature allows you to acknowledge uncomfortable emotions using mindfulness. It is impossible to develop self-compassion without acknowledging suffering. This is followed by a calming visualization technique.

SOOTHE-HOME-TEXT

SELF-KINDNESS

A compassion journal was created where users can view all of their statements of self-compassion and inspirational quotes. These can be set as reminders that the user will receive in order to encourage kinder inner dialogues.

CRITIC1

COMMON-HUMANITY

In the social feed, users can view, create and save inspirational quotes or simply post their own thoughts. Messaging occurs throughout the app to remind users how many others are also going through the same issues as they are.

SOCIAL-5

THE EVOLUTION OF THE HOME PAGE

The home page started out with showing all negative thoughts and required users to click on each item to create a corresponding self-acceptance statement. This evolved into a separation of the two features - the compassion board and a list of negative thoughts the user can process using self-compassion techniques. Eventually theses two features were turned into a compassion journal were both of these features were available, but in a more streamlined format. When using the Compassion Journal, the user can add new negative thoughts to process and still see a list of all of their entries from their previous 'journal entries.'

FROM SECRETS TO INSPIRATION

The social feature started out as a place to acknowledge imperfections in an anonymous and non-judgemental space. The aim was to encourage the idea that imperfection is normal -- Common Humanity.

Testing revealed a desire for more inspirational content. Users felt that this board might become a place of negativity and decrease motivation to make positive changes.

This led to the incorporating the concept of common humanity into the mindfulness feature. While acknowledging negative thoughts users will be presented with a pop up that let's them know that they are not alone in their struggle. This allows users to feel that aspect of Common Humanity without potentially internalizing other people's self-criticism.

Finally, the social board became a place where users can post their own thoughts or use famous quotes by authors and musicians to acknowledge how they feel. Posts can be saved and added to their private compassion journal.

branding

NOTES ON PROCESS

The name of the product (Nightbloom) was chosen because it referenced a type of flower that blooms during the night. This symbol was strongly related to the goal of this product - the idea that people can find meaning and growth even during some of life's more challenging periods. The user interface design began by creating a moodboard and deciding upon the tone and feel that this app would evoke. 

The name of the app and moodboard elements were then used to develop a color palette. A number of app icons were created, which were tested among peers for feedback. Finally, the selected visual design and branding elements were applied to the the grey-scale wireframes, which revealed a pivot from darker to lighter tones.

MOODBOARD

A visual identity moodboard was created in order to guide the look, feel and tone of the design. The inspiration for this moodboard was inspired by the following concepts: serenity, calm, renewal, clarity, elegance.

ICON DEVELOPMENT

Various icons were created and then tested with the public in order to determine aesthetic preferences. The branding colors evolved over time and the design of the flower was simplified in the final version of the icon.

Nightbloom-Moodboard
Icon-Choice

CREATIVE EXPLORATION

Other aesthetic elements were created in order to help cycle through different branding and icon design options. With the app's name being "Nightbloom" I was inspired to use a night shade and floral shade in my branding colors. These colors were lightened and drifted towards a teal color in order to increase visibility in the final product. All calls to action within the final prototype adhere to AA Web Content Accessibility Guidelines.

Visual-Identity-Moodboard-1
Wordmark-2
Branding

FINAL WORDMARK AND ICON

The final wordmark style was selected for a number of reasons. A sans-serif font was used because it had a more classic and modern look with simple lines and sizing of each character. The Audrey font style has varying font weights within a single character making the characters less imposing and more feminine. The chosen font style was clear, elegant and easily readible even when using all capital letters. A number of different font-styles were cycled through to find the right look and feel.

The final floral icon was updated to have less rounded corners and more angular points at the end to give it more sophistication and maturity. The floral icon was also iterated on so that there were varying line weights used to mimic the style used by the Audrey font. This made the wordmark and icon more strongly related aesthetically. The floral icon was also given a gradient which was inspired by the way that nature often has more nuanced color palettes and to provide more contrast within the symbol. Careful attention was paid to the symbol so that it would not feel overly complex, but still be eye catching. 

Logo Styling

Font Style Audrey | Font Weight 400 | Font Size 40 |  Spacing: 3.5 px

FINAL-WORDMARK-AND-ICON-3

user-interface design

NIGHTBLOOM

A mental health application designed to enhance self-compassion through self-soothing techniques and mindfulness.

finalprototype-1

SHAPE YOUR INNER VOICE

The app that takes you from self-comparison to self-compassion and allows you to thrive even in your darkest moments.

Mockup_techniques
Mockup_Prompt
Mockup_Reminder
Mockup_board

OVERCOME HABITS

Anything in your journal can be set as a reminder. In order to overcome habits of self-criticism, journal posts can be sent to your phone by text message replacing your self-criticism with kinder inner dialogues throughout your day.

I decided to add the text-message option to deliver these reminders because this is the way we often use to communicate with friends, showing that our self-talk is just as important as the words we use to communicate with others.

ACKNOWLEDGE AND RELEASE

It is impossible to develop self-compassion without acknowledging your own sufferring. Nightbloom helps us acknowledge uncomfortable emotions using mindfulness. This is followed by a calming visualization to help you contain your negative thought for the time-being so that you can access it again whenever you're ready.

Mockup_Negativethought
Mockup_Physical
Mockup_Visualization

ENCOURAGEMENT THROUGH COMMUNITY

Remember that we all struggle with imperfection. Express your thoughts in a community that de-emphasizes social comparison.

Use famous authors or musicians to express your thoughts or to gain inspiration for how you could become a more self-accepting individual.

mockup_social-3
Mockup_SocialPostNew
Mockup_mindfulness
Mockup_Observer

THE COMPASSIONATE OBSERVER

The compassionate observer is an exercise that allows the user to become aware of the conflicting parts of the self as well as negative patterns that they want to overcome.

This feature will undergo further testing as part of my next steps to widen the scope of this project.

multi-platform design

watch

SMART-WATCH DESIGN

I adapted Nightbloom to a multi-platform design using a smart-watch that would track stress levels using Biometric Heart Rate measurements. The watch would warn users when their stress levels are getting high and offer them the opportunity to acknowledge their thoughts using voice recording followed by a calming visualization.

marketing

WEBSITE DESIGN

A marketing website was created in order to promote the adoption of the service. I started by creating a new moodboard and visual identity. After sketching out concepts and creating wireframes, I developed a high-fidelity prototype highlighting the features of Nightbloom and it's evidence-based benefits.

mockup_marketing_laptop
marketing_mobile_mockup

RESPONSIVE DESIGN

I translated the marketing website into a mobile site. I produced a content flow diagram that would clearly communicate the change in design to developers.

business considerations

POTENTIAL BUSINESS APPLICATIONS

Apple named "Self-Care" as the app trend of the year in 2018. There was $32 million spent on these applications in only the first quarter of that year (McRobbie, 2019). Patient, clinical and government interest has grown in the potential use of these technologies within clinical care. A product like this could be useful to mental health professionals who want help their patients combat self-criticism when they are going about their daily lives. This product could also provide more affordable access to mental health support.

Part of my next steps would be to test the export data option I created in mid-fidelity stages. This would allow users to securely transfer data for personal or clinical use and would be hidden behind a paywall to create monetisation.

There is also a growing number of businesses now offering mental health services to their employees. Nightbloom could be an effective service in improving mental wellness by improving employees ability to cope with setbacks and challenges.

ADDITIONAL FEATURES

 I would also spend time finishing a feature that tracks the user's progress over time. This would encourage users to the use product more and aim to practice self-compassion more frequently.

PROGRESS-1

design ethics

POTENTIAL FOR EXPLOITIVE BEHAVIOR

Predatory or exploitive behavior is a concern when it comes the privacy of users. This is why the privacy policy should be easily accessible for users to view before making the decision to download this service. This also connects to the vulnerability of product features such as the compassion board where users should feel confident about their privacy being respected and adhered to.

Error prevention was also considered when designing the look and layout of the compassion board and social feed. For instnace, it is important that users would not mistakenly post information to the social feed that was meant for their private compassion board.

This is why I made sure the look and layout differed considerable as do the calls to action that allow users to post new content on each feature.

An export data option was developed in mid-fidelity stages, but requires further testing. It would allow users to export data securely for personal or clinical use. A passcode is used to ensure privacy and security during transfer.

Tarot1
Tarot2

next steps

POTENTIAL FOR EXPLOITIVE BEHAVIOR

Before launching a minimum viable product, Nightbloom would be evaluated by a psychologist that specialises in Mindful Self Compassion techniques.

Since digital mental health applications are still unregulated, it is important to have such applications evaluated by experts in the field to ensure the best outcome for users.

The Self-Compassion Scale is used in psychological research in order to measure levels of self-compassion. This measure would be taken before a user starts the service and after they have used the service for one month in order to ensure the effectiveness of the product.

Additional self-compassion exercises, such as the Compassionate Observer and the Export Data option would undergo user testing in order to be incorporated into the final prototype.

Finally, the marketing site and multi-platform device prototypes would be tested to ensure success after launch.

Teal-Avatar-Portfolio

Ways to Connect

Feel free to reach out to me if you'd like to learn more about my experience and design work or if you would like to collaborate on something in the future.

Teacup Graphic Image

© Jacqueline Williams 2021 • UX Designer     Website built with Semplice