Figma/Figjam Google Forms Adobe Illustrator Adobe Photoshop MAZE
The Challenge
How do you design a social app for people who are anxious about socializing? 54.2% of survey participants stated that they were too nervous to talk or engage when making new friends. Many of those who deal with social anxiety often times feel judged when interacting with others.
Tasks
• Design a mobile app that connects those with social anxiety • Understand how users cope with anxiety and how it affects their behavior • Build features that can help combat negative thoughts
Need for App
Millions of users on friend apps
From Bumble's IPO filing, it can be estimated that Bumble BFF has about 1-2 million MAUs.
A study from The Journal of American Academy of Child & Adolescent Psychiatry shows that students have anxiety about returning to class due to social phobias from the pandemic
Inclusivity
Contrast Check - Making sure colors are passing the WCAG standards for visually impaired users
Avoiding Prejudice & Racial Biases - Algorithm would not consider preferences relating to looks & would never hide potential matches due to race (which has been an issue in dating apps before)
Many Pronouns and Genders to Choose - Offer multiple gender options as well as an option to filter to match by gender identity
Solution
What if there was an app designed specifically for those with social anxiety in mind? A friend-finding app that would remove the pressure of explaining the nuances of social anxiety to others. An app that would provide conversation prompts to relieve the stress of sending a witty opening message, and also allows you to take a break whenever you feel overwhelmed.
Hi-Fi Digital Prototype, Usability Testing, Iterating
*Ended up finishing project 5 days ahead of schedule
Research
Surveys
Discovered Demographics from 31 participants
• 79.2% of participants stated that they would probably feel LESS stressed if they were to connect to someone who they knew had social anxiety as well • 54.2% stated that they were too nervous to talk or engage when making a new friend • 58.3% were interested in connecting to others based on similar interests/values
interview
“Yes, pretty much anytime I go to a social event I feel like people might not like me because I might not be funny, interesting or not talk much.” - Interviewee #1
Competition
A competitive analysis of 3 social companies (MeetUp.com, Yubo, and Bumble BFF) was conducted to gain insight into industry standards. A comparative analysis was done on the relaxation apps, Headspace and Calm, to see how they were easing the anxiety of their users.
Define/Map
How Might we?
Using IDEO’s “Framing your design challenge” I was able to hone in on how to solve questions that popped up. These HMWs shaped the scope of the project, becoming the MVP.
HMW
.. have users interact without needing to have a conversation when feeling overwhelmed?
HMW
..help users combat their negative thoughts, inspiring a growth of confidence?
HMW
.. get nervous users to engage in conversation?
insights from data
Using the data from my survey and interviews, I created an affinity map in order to organize found key insights and findings.
Personas and empathy maps
I created two different personas with different levels of social anxiety to gain a better understanding of the overall groups who would be using this app.
Luke's journey map
User stories
After coming up with 9 different user stories, I took the top 3 highest priority stories to focus on building as user flows. I also ended up including a medium story to combat negative feelings since there was enough time.
AS A USER, I WANT TO
..customize who I match with based on my interests so that we have something in common (High priority based on survey data)
..let people I’m chatting with that I am feeling overwhelmed so that they know I am not ghosting them (High priority based on survey data) .. know how to start a conversation when matching with a new friend, because I get too anxious to start the conversation (High priority based on interview data) .. being able to combat my negative thoughts will help me feel better, as I sometimes feel too negative about myself to try and connect with others (Medium priority)
User Flow
Develop
Crazy 8 sketches
Taking about a minute per sketch, I was able to quickly ideate potential layouts for the homepage and chat prompt page. I then refined 4 of the sketches with the top two sketches being the homepage/connect page and the bottom two being the prompt page.
Storyboard
Paper prototype
Before building out my wireframes I built out a quick paper prototype. This process helped me understand how the pages of my site map would actually work and feel physically.
Lo-fi wireframes
Feedback
Moodboards
I already knew that I wanted the calm cool colors of blue and purple within my app. Many businesses use the color blue to represent security and trustworthiness.
Backgrounds
Using Adobe Illustrator, I designed 3 different backgrounds for the app. The idea was that the app would move through different backgrounds, reflecting that the moods of anxiety don't have to remain in a constant state of fixedness.
Logo exploration and style tile
from wireframes to mockups
First Homepage
Second Homepage
Mockup Homepage
Deliver
usability testing
Using MAZE to carry out a usability test, I was able to uncover where my prototype’s flow could be improved. One pattern that emerged was that users repeatedly attempted to click on the gear icon (settings) when trying to “filter matches”, as well as when asked to locate "Overwhelmed" mode. This lent to 30% of misclicks and an average of 8.89s spent trying to complete the task amongst 7 users.
Prototype
Changes made based on feedback
The gear icon changed to a hamburger menu and built out that page. It includes links to both Overwhelmed mode as well as the chatbot feature
I also received feedback about adding manual options to click through pages that had swipe features to view the next page, to make it more accessible
Fine-tuned visual elements to be more easily digested such as spreading out text-heavy pages
Added resources to crisis numbers when Overwhelmed or accessing chatbot, including numbers for people who are hard of hearing or deaf.
Mental Health Tags - Social anxiety is often accompanied by many other mental health issues and it would be great to start erasing the stigmas around mental health. By offering multiple tags, users have the option of connecting with others who have similar experiences.
Friend Introduction & Group Messaging - With the limited time for this project, I decided to focus on the most important components, getting users to use the app and make a connection with somebody new. The data also reflected that users felt more comfortable meeting 1x1 versus a group. As members start to gain confidence and make connections, they can introduce their friends by connecting them. They could then engage in group conversations together.
Relaxation Exercises or Videos - Another tool for tackling anxiety considered, was introducing meditation or breathing exercises. Since it was lower in terms of survey users' interest, it was moved to a low priority. As the app grows and gains different types of anxious users, mediation or breathing content could aid more people.
Resources
I love sharing resources, so if you have any questions feel free to send a message
