— GOAL
Redesigning the UOK wellness app
— ROLE
User Research
Product Strategy
UX Design
UI Design
Prototyping
Usability Testing
— TIMELINE
5 Weeks
— TEAM
Stephanie de la Uz
Tripp R.
— TARGET AUDIENCE
Students aged 12 – 18 years
I worked on this project with a small team of designers from around the world. The goal of this case study was to overhaul the UOK Wellness Mobile App into a more engaging and motivating experience for teenage users.
We followed a comprehensive Design Thinking process during the case study while using the latest tools and workflows available.
THE PROBLEM
Middle school & high school students using UOK are unable to clearly communicate their emotions and are not motivated to check-in consistently through the app.
HYPOTHESIS
We believe that creating a more interactive way to check-in for mental health for teenagers will motivate the them to continue checking-in daily.
THE SOLUTION
My team and I arrived at this solution: creating a more comprehensive onboarding and sign-in process, updating the questions and selections to be more visually appealing, adding a journal option for each question, making the end screen more engaging, adding a set reminder option, and improving the aesthetics of the overall app.
THE OUTCOME
While most testers responded positively to the addition of a journal feature in, our iterations to the journal feature did not feel intuitive to some testers, as described in the open questions from our testing. That being said, two statistics pulled from our usability test seem to indicate that our changes to UOK remain useful…
- 98% of testers ultimately completed the mission
- 77% of testers reported that the addition of the journal entry to each question was helpful.
Future iterations may potentially include: updating the journal entry feature and increasing the readability of the type on the first couple of check-in screens.
🟦 USABILITY TESTING
To help us better understand the product, we conducted a usability review to identify pain points and wow moments in the existing experience.
🏁 COMPETITOR BENCHMARKING
With a usability review complete, we moved on to competitor benchmarking to help us identify standards in competitor products that could be used to improve the existing experience.
Indirect competitor Calm, a mental health app for adults
Another indirect competitor, Whole, a mental health app for all ages
Indirect competitor MyLife, another mental health app for adults
🏁 QUESTIONS & OBSERVATIONS
To help us better frame any problems with the product, we began by forming some questions and observations we have about the product. To easily document these we followed the structure [situation], [response], [problem to business or experience] to ensure we were aware of users and business needs.
Observation 1
When UOK is opened, users see a bland interface, which causes the user to be less motivated to engage with the app or check-in.
Observation 2
- When UOK is opened, users try rating their emotions with a number/color system, which causes confusion and a lack of feeling understood for the user.
Awards
- It’s Nice That
- AIGA
- Fonts In Use
- The Dieline
Contact
email@domain.com
000-000-000
🔍 SURVEY
To confirm our observation and begin forming a hypothesis backed by data, we created a user survey to help form no frill user personas and understand the problem space more from real users' perspectives.You can you this place to talk a little bit about the image on the side.
📊 SYNTHESIS
Having shared our survey with users of the product, the next stage of our case study was focused on synthesizing the data to recognize trends and form a hypothesis. During the synthesis we segmented user responses and used and affinity map to prioritize the problems of users inline with business needs.
Affinity Map
While affinity diagramming, my team and I identified three primary trends in the survey data…
- A user’s ability to express their specific emotions and thoughts matters greatly
- The current layout of the app was uninteresting to the user
- A lack of personalization within UOK causes motivation to check-in to decrease
…it became clear to my team and I that an iteration to UOK’s product that enables users to accurately explain their feelings while keeping the user engaged would provide the greatest value in the shortest amount of time.
❗️ USER FRUSTRATIONS WITH
THE PRODUCT
👩👧👦 NO FRILLS USER PERSONAS
During the synthesis stage of our case study, using the User Story…
As a teenager I want to check-in for my mood so that I can improve my mental health.
…my team and I focused on identifying the different personas who have frustrations with completing the UOK check-in. We created no frills user personas, focusing on their biography, goals and blockers.
🤔 HOW MIGHT WE
With a picture of the problem at hand starting to come into place, we jumped into the ideation phase and worked through the solution design model, identifying users actual behavior, and optimal behavior. This allowed me to form a how might we statement to begin forming a solution.
How might we help users feel more confident communicating their emotions?
💡 IDEATION
To avoid following the first idea we conducted a series of ideation techniques. This allowed us to consider an array of solutions. Following ideation we mapped what could be improved and added and prioritized them based on user value, business value, effort and time.
A mind map in order to narrow down our ideas
What can we improve?
What can we add?
✍🏼 HYPOTHESIS
Having prioritized ideas based on what can be improved, or added, we wrote a hypothesis that helps us frame the problem for user and business goals.
We believe that creating a more interactive way to check-in for mental health for teenagers will motivate the user to continue checking-in daily.
⤵️ USER FLOWS
Following Ideation we created user flows of the existing experience and improved the flow based on the idea that fit with business and user goals.
The existing user flow
The improved user flow
🔳 LO-FI WIREFRAMES
We used a neutral color palette to avoid any decision bias and would use this prototype to get feedback internally. We used Autoflow in Figma to help us easily map the user flow between each page ahead of converting the pages into a prototype. To ensure quality, we mapped out each iteration.
🎨 STYLES & COMPONENTS
The lo-fi prototype helped us recognize frustrations with the experience that we improved at the hi-fi stage. To create the high fidelity prototype, we inspected the products style and followed the 8pt rule to effectively and easily create a prototype that was consistent with the product styling. Before creating the prototype, we defined styles and components to easily and quickly help us design consistently.
Typography
Icons
Input variants
UOK color palette
🤗 HIGH FIDELITY PROTOTYPE
Below is the final version of the prototype that we created. We included interactions and transitions from Figma to match the product’s flow.
Hi-fi prototype
📋 TESTING
With the hi fi prototype created we formed a testing script with scenario and tasks for the user to complete to validate the prototype with real users. To test the prototype we used Maze and gathered feedback following every task.
HYPOTHESIS RECAP
We believe that creating a more interactive way to check-in for mental health for teenagers will motivate the them to continue checking-in daily.
The Usability Test
GOALS & METRICS
Heading into usability testing, the goals and metrics my team and I felt would define the overall efficacy of our iterations were the following…
- 90% of testers vote our iteration would increase the ease of check-in
- 80% of testers vote that adding a journal for each question would be helpful
- 70% of testers successfully complete the usability mission
✔️ OUTCOME
INITIAL RESULTS
The initial results of the usability test, as compared to our original goals and metrics, were very encouraging.
90% of testers expressed a belief that our iterations would increase the likelihood of completing each check-in for UOK’s wellness check-in. This result sits right at our original goal of 90%.
77% of testers expressed a belief that adding a journal entry to each question would be helpful. This fell slightly short of our 80% goal, but we were still encouraged.
98% of testers successfully completed the usability mission, which well-exceeds our original goal of 70%.
THE MISSION
83% of testers experienced direct success, while 17% of testers experienced indirect success. Based on these numbers, it was clear to my team and I that our iterations to UOK’s check-in system was successful, but can still use improvement. This assumption is supported by the feedback given on question #6 and #8.
THE USER EXPERIENCE
Overall, 71% of testers reported a neutral or positive experience during the test, while 29% of testers reported either an unsatisfactory or difficult experience.
Seeing as over a quarter of testers reported having a less-than-satisfactory experience interacting with our prototype, we took the time to carefully consider and analyze our testers' feedback. This analysis allowed us to create a list of areas within the interface that could be improved…
JOURNAL FEATURE
Based on the below feedback, it became clear that our iteration’s journal feature would require some extra attention and refinement…
In retrospect, my team and I agreed that the journal feature was helpful to have within the check-in process, though having it appear for each question likely was unnecessary. For the journal feature within each question, our team did include a “saved” message at the bottom of the journal. Perhaps in future iterations, we can make this message more prominent; or include fewer journal entries.
ACCESSIBILITY
17% of users reported that the type was difficult to read…
Based on this feedback, it is clear that readability and accessibility is important; as my team and I would like as many individuals as possible to be able to utilize UOK. Future iterations will tackle this readability issue by adjusting the type colors in the first few screens.
FINAL THOUGHTS
While most testers responded positively to the addition of a journal feature in our iterations, the journal feature did not feel intuitive to some testers. That being said, two statistics pulled from our usability test seem to indicate that our changes to UOK remain useful…
- 98% of testers ultimately completed the mission
- 77% of testers reported that the addition of the journal entry to each question was helpful.
It is unclear whether or not tablet or desktop users, as opposed to mobile users, might find our iteration to UOK to be more intuitive. It is our assumption that mobile users and tablet or desktop users take different actions to achieve the same goal. Finding definitive evidence to prove or disprove this assumption deserves further exploration.
In a real-world scenario, Tripp and I would take what we’ve learned from this case study in its entirety and continue to make gradual improvements to the product. We believe that integrating our iteration of UOK with refining the journal feature would greatly improve the overall user experience and enable the product to better serve teenagers.
In summation, creating a user-friendly experience for wellbeing check-ins would provide incredible value not only to users, but also to UOK as a business.