TestingProductReflection ProjectsResumeAbout
The Pebbles
Connecting people suffering from mental health issues with the resources.
Product Designer
Figma, Adobe XD, Adobe Illustrator
User Research, Interaction Design, Visual Design
Problem Statement
How might we bridge the gap between international students and the mental health resources at school?
Even when facing an inordinate amount of stress, international students hesitate to draw on mental health resources.
Upon leaving their home country for the United States, many international students are facing the expectation that they must be successful both academically and vocationally success. While this can be a shared pressure for all, it is the additional solitude, language barrier, and culture shock that worsen their mental health. Still, few of them utilize the mental health resources that the university offered.
According to Journal of  American College Health 61% of international students are aware of the offering of mental health resource by school, 33% international students consider going, and only 17% actually did.

This project address the inability of international students to seek mental health assistance. More specifically, I adopt a social approach to designing interventions that can bridge the gap between international students and mental health resources.
There’s a gift behind each and every emotion
Glean the pebbles of emotion, and let them guide you to the light
Track Your Emotions
Understand how your emotion is doing.
Collect the Gifts
Read inspirations or advice for each emotion
Save the Gifts
Put the gift in your pocket for next time
Seek Help
When you need it, a friend is here to talk anonymously .

To get contextual insights of "Why don't international students utilize mental health resources", I conducted interviews with 4 International students to look at their experience.
I gathered 4 interviewees and ask them about their experience of handling mental health issue. During the interviews, the 4 interviewees discussed the following:

① Their experience of feeling negative emotions and how they handle it.
② Their attitude toward mental health issues.
③ Their concerns over seeking help from resources.
I found that the problem lies not so much in their reluctance to seek help but their lack of understandings of when best to do so.
To have a clear mind of the reason behind, I visualized international students' experience  before and after the negativity exceeded their capacity of handling?
Knowing that, to international students, just to realize the necessity to access mental health resource can be an issue, I started to delineate the developmental trajectory of their emotions. I separated users' whole experience of struggling with negativity into two: ① before exceeding the capacity, ② after exceeding the capacity. Then I looked into their behaviors/emotions during both phases.

> Go see the Personas to understand more.
Besides understanding the behaviors through the developmental trajectory, I also synthesized the three pain points through affinity wall
Not sure when they should seek help
Experiencing negativity is a long and winding process. The students mentioned that in this process, they are feeling complex emotions. They only realize they really need help when things are really serious.
Cultural backgrounds influence their behaviors
In many of their culture, negative emotion is something they have to deal with themselves. This led to them falsely handle with their negativity, which can bring them serious consequences.
Felt uncomfortable reaching out
When students finally feel the urgency to seek help, they at the same time get hesitant since they are afraid of being seen seeking help, and are reluctant to associate themselves with the syndromes described by mental health institutes.
To create user-centered product, I ideated solutions according to the insights and selected the one according to users' feedback.
I started by ideating ideas for each overarching pain points and sketched them into storyboards. I came up with in total 8 possible solutions
After having all the potential ideas, I tried to converge them into feasible ideas. I took the storyboards back to the users to do next round of interview and dot voting. And I finally decided to go for the following three final functions: Emotional Tracker, Professional Advice, and Anonymous Talk.
Not Sure When Should They Seek Help
Emotion Tracker
To help users realize the timing when they need help, the start of the product should be an emotion tracker to help users keep track of their mental health.
Cultural Backgrounds Influence their Behaviors
Professional Advice
After users express their negative emotion to the tracker, it should give users some professional advice to read and follow.
Felt Uncomfortable Reaching Out
Anonymous Talk
When the tracker realize users are exceeding the threshold, the tracker can actively ask the user if they would like to talk with a professional anonymously.
I located the final functions in the developmental trajectory to create a user journey map.
Design: Emotion Tracker
Step 1 : Approach
Decide the emotion tracking approach that can motivate the users
At this stage, students experience fluctuating emotions. Their emotion can severely influence their motivation to track their feeling. Hence it's critical to contemplate what is the best approach for the emotion tracker.

I synthesized three criteria from the user research such as they refuse to do complicated things and can't clearly state their emotions. Then I used them to evaluate the three options that I ideated. Finally, I decided to go with the third option: offer users choices of emotions to pick.
Step 2 : Information Architecture
Create an experience that users can felt at ease using
Information architecture can influence users' perception of a product at first sight. Hence I spent extra effort deciding how I should design the information architecture to facilitate users in recording their true emotions.

From the three options that I ideated, I decided to go for the one with the least buttons. The thought behind this is to create an environment that users can know the emotion comes first. And this is an area they can solely focus on the emotions.
Design: Professional Advice
Step 1 : User Flow - Accessing advice
Figure out the user flow of accessing advice behind the emotion that suits users' behavior
While tapping on the emotions, users are at a process of exploring. Hence it is crucial to make them feel comfortable to explore.

Instead of directly bringing users to the content page after tapping the emotion pebble, I added a preview page. With this, users can feel more freely to go in and out of different emotion pebbles.
Step 2 : User Flow - Saving Advice
Interviewed users about their experience of saving contents to lay the basis for the design
Before jumping into designing, I tried to get a deeper understanding. And then, I came up with functions targeting the insights.

To uncover people's motivation and experience of saving information, I went back to users to ask about their saving information experience. I did user interviews on users and then concluded the following insights (blue box). Based on the insights, I decided to come up with the two functions Box (a place for users to store the emotion pebbles and advice) and Path(see their emotion trajectory).
Deciding Box's user flow based on users' mental model

For the Box function, I went deeper to contemplate what flow could be better, Grid, or List. While evaluating, the two seem to be somewhat evenly rated. Hence I decided to go for the one that fit users' mental models the most.

At here, Box's goal is to help users in finding advice when they need it. Users' mental model should focus on finding advice: first, the emotion and then the advice about the emotion. Hence I went for the grid, which is prioritizing finding the emotion.
Step 3 : Layout
Design a layout that is easiest for user to access advice.
I started by separating the negative and positive emotions. This way, it's easier for users to choose.

When users reached the advice list, I put the navigation buttons on top of the page. Since users may still be browsing, this may save users from needing to go back and forth too much.
Design: Anonymous Chat
Step1 Approach:
How to reach out to users that is the least intrusive yet effective
From the research, we can know users' aren't comfortable interacting with people. They are also shown to be sensitive. While deciding which approach to reach out to users, I came up with criteria that can help evaluate users' concerns in this.

I decided to put a pebble for users to click on and chat when the tracker realize the user needs help. As users can still hold the final decision and feel not invaded. Also, having a chat pebble in the pool may hint them to tap.
User Testing
To refine the product, I did 2 rounds of user testing on 6 users and made design changes accordingly.
After finishing the mi-fi digital mockup, I brought it to the users again. During the testing, I gave users a brief introduction to the app and let them work on the following tasks:

① Find the emotion pebble that best fits their current mood and receive the gift.
② Save the pebble into their box.
③ Access the chat and seek assistance anonymously.

I observed users' behavior while they navigated through the app. Base on their user experience, the followings are several design changes I made.
① Added a navigation icon to guide users
During the first task, the user is asked to find the emotion pebble that best suits her mood. I found that they started to loose direction. One of the users told me that she found it hard to go back to previous ones. It dawned on me that the emotion they are feeling is complicated, users are not looking for the emotion but comparing.

Hence I added a navigation icon to indicate the user's location in the canvas and help them compare.
② Added a notification pop-up before starting the anonymous talk
During the task of finding the chat pebble and seek professional assistance.

The user was taken by surprise after hitting the chat pebble. "So the conversation just started huh?" asked the user. This reaction made me realized that, the design failed to meet users' expectation of "clicking a pebble and receive a content". And it can be too intrusive to directly start the conversation.

So I added a notification box, giving users more control of their action and make them feel more secure.
Final Product
① Pick a pebble that matches your emotion
② Collect the Gifts and See the Path
③ Chat Anonymously with Professionals
Mind the Feelings
It is imperative to make the design easy to navigate and fits' users' experience. However, while we are focusing the behavior, it's also crucial to understand some reason behind the behavior that is so easy to look over-the emotion.

While designing for my users in this project, a group with more sensitive mind, I spent a lot of time to really feel what they are feeling. During the interview, I tried to read deeper under the story. And the final design prove the extra learning vital. After I present the design to my users, they gave positive feedback not only on the intuitiveness of the design but that they can picture them motivated to use it when at their vulnerable low point.

This means so much to me.
The "Good" Design
While designing for people suffering from mental hardship, I'm constantly asking myself what change this design can bring to them? Is the design good?

It's easy to define a good design as a design that centers what users need. For instance, if they want to be alone, the design equips them with the perfect way to block the world around them. However, is that the designer I want to be?

To me, what matters is the design's intention. We understand that people suffering from depression tend to isolate themselves. We also know to lend them a hand, it is imperial to lead them to people. Hence, I decided not to settle on users' surface needs but the change that users need.

I learned that creating a good design does not stop at centering it around users' behavior. To create a good design, we should stretch it to bring good to people.