Work Steps
First of all, we needed to plan the mental health app design process carefully. Our designer decided to follow these steps:
Competitor
analysis
We compared key industry players with Mind Easy in terms of content and main focus of the apps.
This analysis helped us to distinguish Mind Easy from competitors and find ways to emphasize their strengths.
User Flow
We thought out the user flow and created wireframes based on the existing functionality to figure out a better way to arrange elements and make the interface easier for users.
Log in process
Home and Profile
On the Home screen, users can talk to the chatbot and see their streak of exercises and featured exercises. From there, users can go to the Profile screen to manage the subscription, change the password, report problems, and call emergency services if they’re in crisis.
During the mental health app design, we highlighted the most important actions with accent colors and designed the chart for the streak of exercises.
Exercises
Subscription
Rewards
Concept
Initially, our clients didn’t have a clear vision of the future design, so we asked them to show us some references and anti references. They liked monochrome themes with slight color shading and fonts and disliked crowded interfaces with too many colors and common illustrations. To figure out the mental health app design direction, we made several versions of the concept.
Animations
Mind Easy wanted us to make something unique and unusual, with a style that would differ from the previous design. They saw our animated concepts on Dribbble and wished us to try it in their project. Together we decided to experiment with creating a couple of screens with 3D animations.
It helped us to find out that the Mind Easy team wanted something as lightweight and simple as possible. So we rejected the idea of 3D animations and moved forward with minimalism.
👇
🌝
Dark theme
Another test version included a dark theme — it also didn’t fit the client’s vision of mental health app design but helped us to narrow down the search for the perfect match.
Final version
Considering our previous attempts, we aimed for a light and minimalistic interface that would reflect Mind Easy’s values. The company’s main focus was on inclusion and cultural sensitivity — they already had such elements in the mental health app design but wished to amplify them.
Colors & typography
We chose dark colors for the text and light colors for the background. As for the accent color, we used blue, as it adds enough contrast and, at the same time, looks calm and soft against the light background. It symbolizes lightness, purity, and reasonableness, and reflects concern for the mental health of users.
