Ripple.

A mobile app that helps people connect to others with similar mental health struggles.

Project Type

Solo Student

BrainStation UX Design

My Role

UX/UI Designer

UX Researcher

Timeline

Dec 2023 - Feb 2024

Tools

Figma

Photoshop

Overview.

How might we help Canadians struggling with mental illness connect with others for validation and support?

Countless Canadians grapple with mental health issues without getting adequate support. Limited access to essential services like therapy contributes to the problem, leaving millions unsure of where to get the support they need.

So, I designed Ripple, a mobile app that helps people connect to others who are dealing with the same challenges.

The Problem.

50%

Half of Canadians experience mental illness by age 40 and do not get sufficient assistance.

43%

43% of Canadians feel their mental health needs are not met by the medical system.

78%

78% of Canadians cannot afford treatment like therapy.

The Solution.

A tool to connect, share and support people with similar mental health struggles.

Key Features:

  • Read relevant articles

  • Browse personal stories

  • Filter for your specific concern

  • Chat with others


Interviews.

The Process

To dive deeper into the problem, I conducted interviews with 3 people who struggle with their mental health and feel they received inadequate care from the medical system. This helped me to understand their pain points, motivations and behaviours surrounding mental health challenges.

Take a look at the Affinity Mapping Process HERE.

I grouped my interview findings into 3 key themes:

  • Struggling with therapy

  • Alternative forms of support

  • Challenges accessing treatment

Alternative forms of support would become my guiding theme throughout the design process. This theme explores the method of community and connection to others.

Who is Ripple for?

I then crafted a persona who would guide my design decisions. Allan represents my target users and identifies how they currently find support for mental health challenges. This helped me understand my user’s challenges to identify opportunities within my digital solution.

Defining Tasks.

Now that I know who I am designing for, I moved on to crafting user stories, which would define my task flow.

I created 30 user stories and then grouped them into epics to define the key tasks that my persona Allan would move through.

Stories

  • I want to search for stories related to my concerns

  • I want to read other people’s personal stories

  • I want to comment and chat with others

Take a look at the full user story process HERE.

Tasks

  • Filter based on my concern

  • Browse posts

  • Comment and direct message

Task Flow.

After defining my user’s key tasks, I built a task flow that would guide my screen design.

Sketching.

Next, I sketched out my screens according to the task flow to guide my digital designs.

Lo-Fi Wireframes.

With sketching complete, I designed low-fidelity wireframes which would be used to conduct user testing.

Test + Iterate.

Using my low-fidelity prototype, I conducted user tests with 10 people to refine my product before moving on to the final high-fidelity design.

I used a design prioritization matrix to prioritize revisions that fit within the project time constraints. I fixed issues based on user feedback/confusion. The major changes included increased type size, icon changes and size, and the information hierarchy.

The Final Product.

A high-fidelity, working prototype. Take a look HERE.

Brand Artifacts.

Mood Board

Logo Exploration

Final Wordmark & Logo

Next Steps.

  • Conduct further user tests using the high-fidelity prototype

  • Build out more features of the app

Colour Theory

Purple is seen as a calming colour that can promote relaxation and reduce stress.

Blue is often associated with the sky and ocean, these natural elements can evoke a sense of peace and promote a tranquil environment.

Green is often linked to feelings of renewal and refreshment. It can symbolize growth and new beginnings.

Yellow is associated with communication and sociability. It can encourage social interaction and a sense of connection.

Pink in a lighter shade can convey a sense of positivity and innocence.

The brand name Ripple was chosen for the word’s connection to nature. In a figurative sense, a Ripple can represent a series of effects that spread out from an initial event or action. In the context of the app, one positive comment or story can spread into hundreds and generate a wave of positivity throughout the community.