ATIC
.png)
A conceptual mental-health platform that allows users to explore various therapy modalities and resources in an approachable and optimistic way.
-atic
(a suffix; pertaining to; of the nature of)
Role
UX Designer
UX Researcher
Tools Used
Figma
Otter.ai
Optimal Workshop
Maze
Timeline
12 weeks
Solution
Develop a responsive website that allows users to explore various therapy modalities and resources in an approachable and optimistic way. Users can explore modalities on their own or discover recommended modalities by taking Atic’s ai-powered quiz.
Problem
Mental health influences our everyday lives as it affects how we think, feel, and act. While mental health improvement is on the minds of many, individuals have a hard time finding a therapy modality that feels like a right fit for them.
What steps were taken to solve this problem?
By using the design process, we were able to truly understand our users and develop solutions that work for them.
empathize
define
ideate
prototype
test
01. empathize
Research Goal
Learn what users want out of an online therapy platform so that we can design an approachable and easy-to-use product where users can get the help that they need with their mental health.
Research Objectives
Identify Needs
Understand the needs of people who are thinking about their mental health and seeking professional help.
Catalog Experiences
Learn the successes and frustrations users have faced communicating with a therapist and/or using online platforms to do so.
Analyze Tools
Learn what online therapy tools actually help people achieve long-term success.
Anxiety
Over 40 million adults in the U.S. (19.1%) have an anxiety disorder.
Market Data
Depression
19.4 million adults, or 7.8 percent of all adults in the United States, had at least one episode of major depression in 2019.
Needs
In the United States alone, about 1 in 5 people report having an unmet need in regards to mental health care (that’s 9 million people!)
Competitive Analysis
We started the project with the idea that the product would be another flavor of online therapy. So, we evaluated three of the most popular tele-therapy platforms.
User Interviews
Time to get some insight!
In order to better understand the needs of our users..
5 participants were interviewed between the ages of 26-30.
Other important deets:
* all participants spent time thinking about their mental health
* all participants had tried either in person or teletherapy.
Affinity Mapping
After conducting the interview and sifting thought the data, an affinity map was created to identify the patterns among my users. We organized the data in various ways, but the following categories were most insightful.
peruse the full Figma file here
!!!
!!!
Key Takeaways
an "ah-hah!" moment:
**The conversations we had with our participants were incredibly insightful. The needs of the users were so different than we initially assumed- none of the participants were interested in perusing tele-therapy! While all interviewees expressed that they prefer in person therapy, they all had something else in common :
Every interviewee expressed interest in exploring or learning about various modalities of therapy**
User Personas
After listening to my participants and using this newfound information to change course, we developed three user personas based on insights gathered during our research.
Our Therapy- Fanatic, Natasha, became the main persona the project was intended for.
Hi Natasha!
02. define
POV & HMWs
Point of View Statement- Frames the problem in a way that keeps a focus on users, their needs, and the insights about them.
We'd like to explore ways to discover how people interested in trying therapy can find the perfect match and modality of therapy that feels curated just for them.
How Might We Questions- Turns the problem at hand into design opportunities.
(1) How might we make people who want to explore therapy feel confident about finding a therapy modality that works for them?
(2) How might we make additional therapeutic resources available to young people who are already going to talk therapy but want more out of their experience.
Project Goals
To further define the product, we brainstormed business, user, and tech goals within the context of the research findings.
03. ideate
" I begin with an idea, and then it becomes something else."
- Pablo Picasso
Site Map
Using the information gathered from the users, our inspiration from my user personas, and the opportunity spaces that were found by my HMWs and project goals, We developed Attic's first site map. After a few iterations after a card sort using Optimal Workshop, we solidified the following navigation:
Task Flows
After the site map was solicited, task flows were created for the platform's three main features.
Wireframes
Defining the task flows helped us to create the initial iterations of low and mid-fid wireframes.
UI Components
Before creating Attic's high-fidelity designs, we developed a UI Component Library in order to simplify the design process and create consistency across the platform.
04. prototype
Prototypes
Flow 1 of the high fidelity design takes welcomes the user to Atic and guides them through the sign up process.
The second flow of the prototype allows the user to discover therapy modalities on their own. While learning more about a specific type of therapy, they can discover resources and save them to their wellness page to revisit later.
The third flow takes users through Atic’s AI-powered quiz. After a series of questions, the AI recommends a therapy modality it thinks will be the best fit for the user. The user can then learn more and explore resources within that modality.
Quiz pages were also built out for desktop to round out this responsive website. See the full flow on Figma here.
05. test
Usability Testing
Time for testing! After finishing my high fidelities, we recruited 8 relevant participants to participate in usability tests; 1 in person and 7 virtually with Maze.
Testing Goals:
1. Evaluate usability of each flow.
2. Gather feedback on UI and user flow.
3. Identify common pain points.
4. Observe how users are feeling when navigating the product, noting how they feel about their overall experience.
Usability Test Findings
Click to expand
While the feedback on the navigation and the UI was mostly positive, I found that a few iterations were needed...
Priority Revisions
Iterations needed:
• Build out a "my favorites/ wellness" page that can be accessed from menu icon
• Build out menu icon and remove profile icon from nav bar (also simplify search icon)
• Make sure font sizes are readable throughout. Check rules, make them uniform.
Old Flow vs New Flow
finding a saved resource
Iconography was too complicated in the first iterations. Users could not identify the profile icon.
A menu icon replaced the profile icon. Users could not navigate here to locate their saved resources and other elements of the site.
Typography rules were developed throughout the product to ensure consistency and enhance UI.
Try me!
Play with the prototype...
So... What's Next?
1. Retest new iterations and edit prototype as needed
2. Hand off to developers
3. App exploration and design
Reflection
• Over these 12 weeks, I learned A LOT. I’m happy with the outcome of this project, but am looking forward to executing this process again and again, improving with each project.
• If I had more time, I would retest the new iterations and rebuild the prototypes with proper components.
• I love this process. Working with users and colleagues to create an enjoyable product brings me so much joy. I am incredibly excited for the road ahead in UX design.
Whew, thanks for listening!
questions? comments? constructive criticism? let me know.