VIRA

Your Personal Mental Health Companion

In an age where technology has allowed people to reach out quickly, there is little support for mental health. Research shows a 93% increase in anxiety screens and a 62% increase in depression screens from 2019. Current solutions disregard a humanized approach creating a missed opportunity to utilize the technology of today.

What if there was an effective digital method of coping with mental health?

Role:
Research, UI/UX

Duration:
10 Weeks

Software:
Figma, Illustrator

PDF  |  Preview Available |  39.2MB  |  80 pages

Group-363-1
THE PROBLEM

Lack of Mental Health Resources

There is little support for mental health in an age where technology has allowed people to reach out quickly. How can we use utilize technology to create a remote platform that alleviates mental health issues effectively?

THE SOLUTION

A Customized Toolkit

An interactive application that acts as a one-stop shop for mental health needs. The application should act as a support system and provide information on exercises, tools, coping mechanisms in an engaging manner rather than taking place of a therapist.

COMPETITIVE ANALYSIS

Exploring Solutions and Opportunities

During COVID-19, the need for mental health applications became urgent. I explored some existing products to find solutions to learn what made them so successful along with any missed opportunities presented.

Headspace

Headspace is a startup that strives to make meditation open to everyone. The mobile app is enhanced by interactive audio sessions and aims to educate you about the fundamental aspects of meditation.

image-1

Learnings

For beginners - approachable and efficient introduction to mindfulness and meditation.

Notification - the app will provide you with daily reminders to maintain user retention.

Progression - you can track your growth through the stats feature in the application.

Opportunities

For everyone - create a unique experience for users of all backgrounds

Reward system - provide a non-invasive way to nudge the users.

Mindshift

MindShift uses scientifically proven strategies based on Cognitive Behavioural Therapy (CBT) to help you learn to relax and be mindful, develop more effective ways of thinking, and use active steps to take charge of your anxiety.

image-9

Learnings

Progression - you can track your growth through the stats feature in the application.

Limited - the app focuses on anxiety situations and has limited content.

Scientific - uses evidence-based techniques developed by experts.


Opportunities

Visualization - create an exciting way to visualize the user’s progression.

Customized - allow users to choose which content they want to be shown.


USER RESEARCH

Quantitative Surveys and Qualitative Interviews Defined my Users and Identified User Needs and Struggles.

The surveys were completed via a google form. There were a total of 127 participants, mostly consisting of teenagers and college students. The interviews were completed in 30-minute intervals and included two students, one young adult, one parent, one social worker.

What I Learned...

1. Social Struggle

Participants noticed that they have been more reclusive during the pandemic. Many are losing motivation and others are struggling to maintain a social life.

2. Robotic Responses

Multiple participants acknowledged generic responses that made the app feel less user-friendly as it often fell into looped responses.

3. Choice Overload

Users did not know which tools to use or how to answer thought-provoking questions. According to Hick's Law, "The time it takes to make a decision increases with the number and complexity of choices."

4. Accessibility & Inclusivity

Participants complained of complicated interfaces that were difficult to navigate. There was also little to no support for accessibility. 

PROJECT GOALS

What Do I Want to Accomplish With This Project?

Group-49
Inclusivity

I want to create an experience that is transparent to all users. Therefore, the app will Incorporate standards that allow all users to use the app without hindering usability. 

Group-52
Convenience

Due to my wide range in the audience, I want users to access the application on multiple devices wherever and whenever. Therefore, VIRA is flexible to your space.

Group-50
Companionship

83% of interviewees found themselves becoming more reclusive. Therefore, I want to create an experience that will empathize with human emotions through user-friendly visuals and interactions.

So how do we allow users to have an engaging experience in caring for their mental health?

1.  Introduce a companion
2. Deliver personalized responses
3. Find tools specific to the user
4. Allow for a flexible space 
5. Provide an inclusive experience

USER PERSONAS

Utilizing my Research, I Created Three User Personas Based on the Idea of the Teenager, the Young Adult, and the Mid-life adult.

These also defined my target user groups. Many existing solutions are tailored more to teenagers and young adults, so I wanted to include mid-adults who have their struggles.

Frame-1-2
Frame-2-1
Frame-3
BRINGING THE SOLUTION TO LIFE

An Interactive Application that Identifies Mental Health Issues and Provides a Custom Toolkit of Exercises and Coping Mechanisms.

My solution focuses on creating a customized experience for every user. I am providing an experience that works well on a larger screen if that works better specifically for the user. For the younger generation, a similar experience would be present on their smartphones and smartwatches. This will allow users to access the application from the most convenient device to them at any given time.

RAPID PROTOYPING

Using Figma, I Created Several Iterations of my Product

My first version was a chatbot-oriented approach. It however failed to provide the friendliness that I wanted to incorporate. In version 2, I kept the option for a chatbot but expanded to a voice-forward experience. This still felt clunky and In my third version, I took it out and developed my virtual assistant. View my final prototype in detail in my process deck.

Capture
VISUAL DESIGN

I focused on creating a friendly emotional connection.

The Initial visual explorations were inspired by designs and colors from dribble and Pinterest. Initially, I was focused on creating an aesthetic design but the following explorations did not communicate the simplicity of the application I needed to make sure to not overdesign. After several more iterations, I decided to go with a royal blue color palette to best evoke my emotional connection. The color represents compassion and support and creates a calm and soothing emotional connection while the teal highlights visual elements.

Moodboard

Type and Color

I decided to go with a purple-blue color palette to best evoke my emotional connection. The color represents compassion and support and creates a calm and soothing emotional connection while the teal highlights visual elements.

Poppins has monolinear and geometric letterforms making it great for headlines. It has a modern, playful, but professional feel.

Nunito is a rounded terminal sans-serif font. Its thin but uniform strokes make it work well for body type. It plays off the Poppins due to its playful nature and evokes that friendliness I wanted in my design.

Group-377
Group-357-1
THE USER EXPERIENCE

A Unique Perspective

To get deeper into the ability of the application, I wanted to highlight an extreme user and go through his user flows.

I’m highlighting Warren to showcase the features you would otherwise see. Warren has a rather interesting use case due to his impaired vision and his need to multitask. In this instance, Warren will choose to connect to his TV to satisfy both his needs.

User Journey

This Journey tracks Warren's usage of the application along with his emotions. The application adapts to his feelings to allow for a safe and comfortable space to share his thoughts.

Group-331
INCORPERATING MY GOALS

To ensure my goals were met, I incorporated them into the different depths of my solution

First level - An inclusive introduction that familiarizes users with the environment.

Second level -
a divergence of the original path (connection to another device) that allows for convenience. 

Third level -
 a selection that is made by the user that customizes and strengthens companionship with VIRA.

image-12
FIRST LEVEL

🧭 Discovery

The onboarding experience exposes users to critical features. Through the use of custom Illustrations, a rich and entertaining experience quickly showcase the app's features. 

During the process, the users can also choose to pair any nearby devices to quickly access later.

Onboadring
Group-361
Intake-Session
FIRST LEVEL

🧘🏻 Intake Session

A brief questionnaire helps VIRA understand the user's mental and emotional distress and informs them of any potential diagnosis. This, in turn, will help customize their toolkit. 

Group-362
SECOND LEVEL

💪🏼 Flexibility

VIRA is a multi-platform application flexible to your space.

VIRA can switch over to other devices if need be. This is helpful to those who need to multitask or the visually impaired who need a larger screen, just like Frank.

The initial onboarding process should make it, so existing devices connect instantaneously since it was previously paired.

Mood-Tracking-Mobile
Group-363
VOICE EXPERIENCE

UX Heuristics of a Voice-Forward Experience

1. Surface Transparent Feedback
Consistent feedback creates a fluid, engaging, and responsive human experience. This includes surfacing processing states.

2. Alternative Choices
We can leverage AI to narrow the number of choices your users need to make or eliminate the need to choose altogether.

3. Personalization
We could harness AI to select the best IxD experience given what we know about the customer and how he or she is using the app.

home-and-mini
THIRD LEVEL

😬 Mood Tracking

One of the tools Warren uses to cope with his mental distress. Being more conscientious of his mood, Warren can better control his life's choices, take educated health decisions, mitigate or eliminate adverse mood causes, and achieve a higher quality of life.

Mood-Tracking-TV
Group-121
INCLUSIVITY

Providing an experience for all

Open captions provide an experience for the deaf and hard of hearing without hindering a hearing person's experience. Voice provides an experience for the visually impaired.

All Colors have passed the Web Content Accessibility Guidelines, with at least AA providing enough contrast for all.

I've designed the larger screen to meet users (in this case, Frank) where they are and where they want to be. As a multi-platform application, it provides a unique experience for every user.

THIRD LEVEL

🧭 Summary

Throughout the month, VIRA will use Warren's data to identify his mood and activities and correlate them to identify habits and patterns. Then, based on the correlations, VIRA will suggest activities to best help him.

Summary
TAKEAWAYS

Playing the angles

As a practicing designer, I don't know everything. It is important to bring in users and experts from different perspectives to create a well-rounded solution. 

Although it is important to have many ideas, it is just as important to know when to let go during the project's duration. There is no one right solution; it is important to be open to many ideas and opportunities and not fear making mistakes. 

Customizability

VIRA provides an inclusive experience, but what if it can be further customized instead of generalized? For example, how would it look different if it was a teenager using the application? In future iterations, I would incorporate a way to customize further the user experience based on the user's needs and wants.

Using methods such as usability testing will help understand users' behaviors, identify additional issues, and uncover even more opportunities to improve the product while learning about a more extensive user base.

~Fin~

Thanks for checking out this case study!

Back to top Arrow