Well - Mobile App Design
This project required me to create a clickable prototype for an app that solves a problem of my choosing. The problem I chose to address I that mental health resources are not accessible enough. "Well" is an app that provides free, on-the-go resources for individuals to practice mental well-being on their own time and terms. Journaling, mood tracking, helplines, meditations or other audio resources are available in just a few clicks.
Design Process
Paper Wireframes
Digital Wireframes
User Testing
Test 1: Login and record your mood for today.
Test 2: Login and listen to a two-minute mindfulness meditation.
Test 3: Login and start a new journal entry using the daily prompt.
Color and Typography
I wanted the color palette for Well to reflect the vibrance and tenderness of human emotion as well. I chose to focus on feelings of peace and warmth and love, to make the user experience a more calming and inviting one. Full of Love and Sunday Morning are warm and bold hues intended to energize without being overly bright and harsh on the eyes. Self-Reflection is cooler, calmer, and provides balance.
While these colors and their tints are used primarily in the app, the first app screen includes a freeform gradient with a swath of other colors. This is meant to represent the wide range of emotions that may be felt, since we often feel not just a singular emotion but a mixture of many.
FinalSix is highly readable and legible, making it ideal for use on a mobile device. The typeface was developed by José M. Uros to resemble the lettering used for the 2014 European Water Polo Final. With smooth, even curves and wavy lines, the typeface resembles the flow of water. I found this relevant for a mental health app because it is representative of the human flow of emotions and thoughts, much like water. It does not have serifs or harsh contrasts, making it calming, easy on the eyes, and trustworthy. For this project, FinalSix is used in headings and large text.
Neuzeit Grotesk is similarly very easy to read at small sizes. Its simplicity balances out the strong personality of FinalSix and is used for the majority of the text in the app.
FinalSix Bold
Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp
Qq Rr Ss Tt Uu Vv Ww Xx Yy Zz
1 2 3 4 5 6 7 8 9 0 !@#$%?
Neuzeit Grotesk Regular
Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp
Qq Rr Ss Tt Uu Vv Ww Xx Yy Zz
1 2 3 4 5 6 7 8 9 0 !@#$%?
Iconography
Mockups
