Mai K. Nguyen
Design and Illustration
afloat_th.png

Afloat

 

Afloat

Afloat is a social anxiety management app I worked on as a side project. It uses a simple cognitive restructuring technique to reduce unrealistic thinking habits. The interface is disguised as a chat app, so users can practice better rethinking regardless when it's most needed.

afloat_1.png
 

 

Problem

15 million Americans over the age of 18 suffer from social anxiety disorder. While highly treatable with cognitive behavioral therapy, only a third of those afflicted actually seek treatment. When you considers the root cause of this phobia, it becomes clear that the disorder itself is preventing people from seeking help.

I wanted to help break this debilitating cycle of anxiety. My goal was to make a simple, easily accessible, and preventive treatment that can stop further deterioration of our mental health. 

 

Research

I kicked off my project with some informal interviews with young adults who suffer from moderate to severe social anxiety. I asked various questions around the following topics:

  • Where are you when you experience the most anxiety?
  • What are the symptoms? What physical and mental state do you define as the feelings of social anxiety?
  • How do these symptoms directly affect your day-to-day life.
  • What kinds of methods or tools do you use to cope with anxiety?
afloat_2.png

After 4 of these sessions, I was able to gather the following valuable insights:

  • In a stressful situation, people need the space and time to refocus and feel more grounded—whether that's going to the restroom or looking at their phone.
  • People find it difficult to take control of their thoughts, so they will try to control external factors— practicing conversations beforehand, planning an exit strategy, scouting a safe space they can retreat to, deciding when and how much they want to socialize, etc
  • People KNOW that their irrational thoughts prevent them from fully enjoying life. They want to challenge themselves beyond their comfort zone but find it difficult to maintain control of their emotional state.
 

Approach

The accessibility of this app is a key priority, so I approached the problem as a disguised chat app. I focused on two main tasks for the user to complete:

  • Starting a conversation and going through the Realistic Thinking Exercise
  • Reflecting on a conversation and going through the Reflection Exercise

There was some confusion with taxonomy, so I created a quick map to show how the key features of the app existed in relation to each other. This map also includes potential future features.

afloat_3.png
afloat_4.png
 

Wireframing & testing

Flow 1: Beginning a Chat and going through the rethinking exercise with Turtle. The exercise also includes a brief guided deep breathing exercise. Once complete, you can save the Chat as a Journal

afloat_5.png

Flow 2: Reflecting on the saved Chat. Once saved, a Chat becomes a Journal entry that you can reflect on. The Reflect exercise consists of rating your level of anxiety, identifying poor thinking patterns, and answering some questions.

afloat_6.png

In addition, I ran a few usability tests to gather some initial feedback

  • Users like the idea of a rethinking exercise disguised as a chat.
  • Users love Turtle!
  • Users are confused by the "Edit" feature for the messages they send to Turtle. There needs to be better communication that, once saved, the responses cannot be edited.
  • The deep breathing exercised needs to have a time limit.
  • Once in Reflect mode, the default view is the Chat tab (you can view the chat you had with Turtle), so people seem to miss the Reflect tab.
  • Users like that the reflection section is self-paced
 

Final Prototypes

Onboarding flow:

afloat_7.png
 

Flow 1: Beginning your first Chat with Turtle, answering the 11 rethinking questions, and going through a deep breathing exercise

afloat_8.png
 

Flow 2: Selecting your saved Chat and going through the Reflect exercise. you can rate you anxiety, identify thinking traps, and answer questions to help you understand your anxiety

afloat_9.png
afloat_10.png
afloat_11.png

 

Visuals assets

It was important to me that Afloat has a light-hearted look and feel, along with cool and calming colors to bring a wholesome, delightful experience together.

afloat_12.png
Icons for thinking traps and illustrations for onboarding

Icons for thinking traps and illustrations for onboarding