Nova Hu
Project
Moodspace
summary
Build a safe space for college students who are suffering from mental health problems
Resposibilites
UX Design
UX Research
Front End Developer
Project Overview
I have done this project in a group consisting of 4 members. This project is sponsored by Google Developer Student Club. Our team cooperates and demonstrates our project with Google UX designers, software developers, and product managers.
Why mental health?
-
About 4 in 10 adults have reported symptoms of anxiety or depressive disorder during the COVID-19 pandemic
-
Mental health becomes an increasingly important topic in one of the UN Development Goals - No.3 Good Health & well-being
-
Mental health/mindfulness-related applications today have many limitations
.png)
Before we start
An important challenge that I and my team were facing is to know how to define our project scope. We should be done with the MVP and also develop the front-end code within 2 weeks. I and my group discuss this problem over a Zoom meeting and everyone was assigned their own job. However, Something unexpected may happen at any time...
One Teammate Quit
When we were ready to start, the only UX designer in our group had to quit the project due to health reasons. There is no one who knows UX design in our group, and now we are in trouble. At this time, as a front-end engineer, I know how to scratch, so I discussed with my team members that I can try my best to learn how to do UX design. But I don't know anything about how to do UX Design. After I asked some UX designers around me how to do UX design, I began to learn Figma and the basic framework within three days.
Find the problem
Phase 1
After we discussed it together, we decide to help college students who are suffering from mental health problems, because mental health issues are increasingly prevalent among college students:
-
Almost half of the college students had a psychiatric disorder in the past year
-
73% of students experience some sort of mental health crisis during college
-
Almost 1/3 of college students report having felt so depressed that they had trouble functioning
-
Mental health issues such as anxiety, depression, eating disorders
-
More than 80% of college students felt overwhelmed by all they had to do in the past year
To make matters worse:
There is a tremendous lack of services in colleges and universities: On college campuses, the ratio of certified counselors to students overall is about 1:1000 – 2000 for small to moderate size schools and 1:2000 – 3500 for large universities.
Obviously, something needs to be done right away.
Refine and define
Phase 2
"I need to help a student like me who is suffering from mental health problems". This is what came to my mind immediately. I had a mental health illness when I was a freshman in college. At that time, I do not know what to do. I tied to talk with my mom and my friends, but they are not the person who are in my shoes. I also do not want to find a therapist because it is so hard to open your heart to a stranger. Luckily, I helped myself, but what about others?
Therefore based on my personal experience and user research, we define out problem statement:
There is a tremendous lack of services in colleges and universities and limited preventive mental health care and services for college students.
Phase 3
Create Ideas
After we’ve grown to understand our users and their needs in the Empathize stage, we’ve analyzed our observations in the Define stage to create a user-centric problem statement. With this solid background, I and my team members started to look at the problem from different perspectives and ideate innovative solutions to our problem statement.
We decide to develop a phone App that includes daily feeling check-in, a self-help plan, natural anxiety therapy, relaxing sound and video, and volunteer coaches.
Phase 4
Start to Create Solutions
Before we start to design
I discussed with software developers in our group and we set up what theologies we should use for this project:
UX Design:
-
Low-Fi: hand-draw
-
Hi-fi: Figma
-
UI components: Material Design
Low-fi wireframes
After I hand draw the low-fi wireframes, I and my team met with the Google product manager and software developer to discuss our product.
iOS Application Development:
-
Programming language: Swift
-
Login authentication: Firebase
-
Backend infrastructure and NLP offering for chat box: Google Cloud
Phase 5
Hi-fi wireframes
Based on the feedback that Google product managers and software developers provided to us, I changed my low-fi wireframes, and start to design my hi-fi wireframes.
.png)
.png)
.png)
Test the MVP
Phase 4
Meet with Google Product Manager
After I have done the first version of hi-fi wireframes, I and my team bring this to Google product management, and to check if we can get some feedback from him.
He loves our idea and suggests we add more features and screens.
Test with Target Users
We asked participants to do tasks in order to test them. We picked realistic scenarios to engage the participants in reaching their goals with the app. Also, we ran a user test to get overall feedback.
Based on the feedback from the Google product manager and target users, I started to change a re-design the hi-fi wireframes
Changing Sign in and Sign up
Users feel confused about what do these buttons for, so I decided to add short text to clarify what these buttons use for
Changing Daily Check-in
Based on user feedback, I change the size for the thing under recently add, because they trying to look at my cart not trying to look at other stuff
Changing Homepage
Users feel confused about what do these buttons for, so I decided to add short text to clarify what these buttons use for
.png)
Adding More Feature
Based on user feedback, I change the size for the thing under recently added, because they trying to look at my cart not trying to look at other stuff
Improvements
Phase 4