ThriveSpace
Product Overview
ThriveSpace helps users break the mental health stigma, pick up on their patterns, and begin working with a mental health professional.
This is accomplished through progress tracking, connection to community, and therapy services.
The Process
Discover
User interviews, affinity map, secondary research.
Define
User persona, idea generation, feature roadmap, feature prioritization.
Develop
Information architecture, task flows, wireframes, brand design
Deliver
High fidelity prototypes, usability testing, iterations
Discover
User interviews, affinity mapping.
Primary Research
User Interviews:
What did we want to learn?
-People’s general approach to mental health.
-How individuals generally go about finding therapy.
-Any big hang-ups associated with those two.
What we discovered
-Finding therapy can be an incredibly daunting task
-Reliance on the community helps tremendously in improving mental health.
-People want to be able to track and visualize their mental health progress
Affinity Map
Define
User personas, HMW questions, feature prioritization.
Who are we designing for?
User Personas
Key Insights
We are designing for busy individuals who are wanting to take action with their mental health.
Those who want to begin to shed light on patterns that might be negatively impacting their lives.
Those who want to reduce the stigma of mental health and who want to unite with others on the matter.
Exploring Ideas & Prioritizing Features
Exploring ideas through HMW questions
Idea/feature prioritization
Develop
Information architecture, Task Flows, Wireframes, Brand Design
Information Architecture
Content requirements uncovered through Tree Testing.
Tree testing is a technique that I used to provide great insights on the organization, structure, and nesting of the content.
Example image from BananaCom
Task flows
Branding
Typography Selection
Continuing to refer back to user personas and brand values, we select our typography for the design.
Settling on a playful yet traditional serif font for the headers communicates care and support.
A simple serif font is used for body as it has a high level of readability when text is smaller.
Color Palate
Color palate was determined based on the determinded brand values.
I wanted a palate that communicated a sense of well-being, support, and growth.
Wireframes
Low fidelity sketches
Mid fidelity digital
Deliver
Now that we have the general structure and brand sorted out, we can begin putting all of the pieces together using components, high fidelity wireframes, and a prototype.
Components
I determined the re-occurring elements of the design and applied the brand values to them.
High fidelity wireframes
With the components I made, I then plugged them into the existing wireframes. At this stage we begin seeing the design begin to take life.
Interactive Prototype
Using Figma’s prototyping technology, we link the screens together in a way that speaks directly to the task flows.
From here, we can begin testing the product with users!
Iterations
Once usability testing is complete, we now have a better idea of the parts of the design that are lacking and should begin making changes to improve those aspects of the design.
Impact/effort matrix helped determine how actionable each of the prospected changes were.
Ready development.
About
Socials
Contact