top of page

3C Bear: Mental Health support app for LGBT+ people

MVP Design

Nov 14-21, 2022 - paired UX/UI project

​

For this project, the brief was to build a health-tracking MVP to be entered into a competition. The topic was broad and allowed for a lot of specialization. With my teammate Margie, we decided to focus on mental health, which is an important yet still stigmatized topic. We also narrowed the target to LGBT+ people, because they are marginalized which can worsen their mental health but also make it harder to seek treatment, and even simply to find others to relate to or open up to.

​

Quantitative and Qualitative User Data

Our first step was to send out a survey for quantitative user data. We received 106 responses within 24 hours, showing that there is a clear interest in this kind of application. Here is a summary of our results:

Business Plan Templates.png

82.3% of respondents felt they needed emotional support and 84.3% were interested in mental health support specifically targeted to LGBT+ people, supporting our intuition that there is demand for this kind of application. We also learned that 73.5% were interested in seeking professional treatment but had not attempted to do so, which was backed up and explained by the fact that 66.6% found it difficult to seek help.

​

As a result, for our qualitative interviews we decided to ask the users what features they would find most helpful to support them emotionally. Out of the five people we interviewed, all five suggested a live chat, making it clear to us that it was a must-have. Three of them also mentioned wanting to share and read relatable stories from people with similar experiences. We concluded that the app should put users in contact with one another in a safe environment.

​

Our Persona: Gaylord the Glitter Bomb

User Persona.png

From the information we gathered was born Gaylord, our persona. He’s a young gay man who tends to be the life of the party and has trouble opening up about his depression. A typical weekend for him might include spending the night partying with friends only to come back home and feel sad and lonely, not knowing where to turn, and feeling guilty about being sad when he was just having fun.

Journey Map.png

We agreed that our main features in the app would be the unanimously requested live chat, a page to share stories, and a way to track moods that would make it easier to look back and identify patterns, and possibly share them with a professional. We also included a goal tracker that would allow Gaylord to set daily goals and track whether he was successful at reaching them, and what helped or hindered him.

​

Competitive Analysis

We analyzed the other applications with similar goals and realized that the only ones with chatrooms or forums for users to share with one another were targeted at teens. We decided that our app would be for all age groups to fill that gap in the market.

Competitive Analysis 2.png

Lo-fi Wireframes

Business Plan Templates (1).png

Our lofi wireframes concept tested well. The main insights we got was that the menu bar would work better at the bottom as we were talking about a mobile app and that is the most accessible area of the screen, and the fact that the “share story” page wasn’t clearly defined. We also needed to add more mood options than the 5-point rating we had.

The 3C Bear

For the mood emoji, we wanted to use something a bit more personal and decided our app would have an animal mascot, as animals make good emotional support companions.

We learned in our research that polar bears are very caring and protective toward their group, and it seemed perfect as a mascot: for one thing they live in the North Pole, and feeling rejected and alone can make you feel like you are in a deserted, cold environment. On top of that, bears are one of the most common soft toy for kids, and teddy bears can be reminders of a time when everything felt safe and warm. And finally, bears are already culturally associated with the LGBT+ community which we felt could be a nice nod.

From there the 3C Bear was born. It stands for Care, Connect, and Communicate, the three elements we identified as most important to the users.

​

Mid-fi Wireframes

We implemented the changes we identified as needed when concept testing the lo-fi wireframe, and I started working on the mascot and panel of emotions, which became my personal mission throughout the rest of this project.

But first, we worked on the brand attributes and the visual identity of 3C Bear.

​

Moodboard and Style Tile

We identified our brand attribute as Caring, Cute, Supportive, Safe, and Accepting and created the following mood board, making sure to include polar bears as well.

Our Moodboard

The mood board tested very well and we moved on to colors. We decided to use a variety of blues that would be evocative of the North Pole while being soothing and relaxing as well. For typography, we picked Nunito, which we felt matched the cuteness and curves of our mascot.

Our Style Tile

Now that we had decided on colors and approved our choice of mascot, I went on to work on the emojis.

Creating a set of emoji

Aside from the 5-point scale from very sad to very happy, I identified 16 different emotions, broken down in 8 pairs, each with a positive emotion paired with its negative counterpart.
I designed three ear positions (happy, sad, and neutral) and then worked on the facial features needed to express the 16 emotions I identified.

Elements needed for the bear emojis

The panel of emotions available to the user

Our Prototype

You can find our prototype here

Next Steps

As a next step, we would have liked to implement a feature that would send happy memes and messages daily, so that users would receive positive notifications. Their favorites would be gathered in a page where they could go back to them any time.

I also wanted to add more personalization to their profile picture as well as the mood emoji and allow the user to pick eye color, fur color, hairstyle, and give them the option to add one of more pride flags if they wanted to.

bottom of page