Case Study //
Mobile App for Mental Health Support
Conceptualized key features and created a visual language for a mental health-focused mobile app.
Coming fall 2024
Summary
Having began as a small community of civilians helping their friends and loved ones, Never Alone Recovery had a vision for a mobile app. I created the visual language for the app as well as conceptualizing key features like a recovery tracker and gamification.
Challenges
Designing and prototyping interactive elements
Building a guided onboarding process for new users
Designing a clean, intuitive interface
Functional and informational hierarchies
Recovery Renewed
Designed to support those seeking a fresh start, the app had to be intuitive and accessible.
Between my in-depth knowledge of design tools and certification in UX Design, I was eager to work with Never Alone Recovery on this intriguing app.
Between the app and the Sobriety Tracker function, the vision was for as tool that could be used both for tracking and rewarding triumphs as well as to provide an on-demand source of support in the event of a relapse or mental health crisis.
In early discussions, the client expressed a desire to take certain cues from certain finance apps with organized and somewhat graphical interfaces.
Special attention was paid to navigation and ensuring an intuitive, seamless user experience.
Mobile app design
Application Dashboard
The app features a persistent bottom navigation bar, providing easy access to core functionalities across all contexts. This bottom dock remains fixed, overlaying all content within the app to ensure constant accessibility for the user.
- Neutral colors over dark navy evokes professionalism, experience, and reassurance.
- Soothing round, organic shapes instead of harsh corners and jagged lines.
- Color graphics used for emphasis.
- Minimal material design with a splash of glassmorphism.
- Persistent navigation dock ensures easy access to core functionality.
Mobile app design
Slide-Out Navigation Drawer
A secondary menu is accessible through a menu icon positioned in the top-right corner of the interface. Activating this icon reveals a slide-out drawer, which is designed to take visual precedence when engaged. This is achieved by allowing the drawer to overlay not only the app's main content but also the bottom dock. This design choice underscores the importance of the secondary menu's contents, ensuring they capture the user's focus entirely when in use.
- Lighter color for contrast.
- Dimming/darkening effect to the window below.
- Access to app support, usage data, account management.
- Navigation drawer has priority over static dock.
Mobile app design
Sobriety Tracker Concept
The Sobriety Tracker is a pivotal feature, offering users a more personalized and insightful overview of their recovery journeys.
The card-based dashboard layout mirrors the app's main dashboard with each card offering interesting facts and statistics to quantify the user's progress, leveraging sophisticated data visualizations and calculated statistics to generate meaningful insights — ready for users to share their triumphs on social media.
In fact, the ability to transform raw data into motivational milestones is arguably the most important feature of the app. Upon completing an initial onboarding survey, users' responses are ingeniously utilized to generate customized statistics that resonate on a personal level.
Example: You log into the app and open the Recovery Tracker to see a card prominently celebrating your sober anniversary and providing dynamically calculated figures like your total number of days sober, how much money you've saved by not purchasing substances, or the extent to which your body has "recovered" from long-term substance use.
Project Timeline
Schedule
1
Research & Ideation
- Market and audience research
- Defining goals and objectives for the app
2
Planning
- Establishing the scope of a project
- Creating a project roadmap
- Resource allocation and scheduling
3
Design
- Creating user personas, wireframing, user flows, and interaction design
- Visual design, branding, and building mockups
4
Prototyping
- Market and audience research
- Defining goals and objectives for the app
5
Development (Current)
- Setting up development environment
- Coding front-end and back-end of the app
- Integrating APIs and third-party services
6
Testing
- Unit testing, integration testing, and systems testing
- User Acceptance Testing (UAT) to validate app against requirements
- Bug fixing and optimization
7
Launch
- Deploying app to the production environment
- App store submission and approval
8
Post-Launch
- Monitoring app performance and user feedback
- Regular updates with new features and bug fixes
- Marketing and promotion
9
Evaluation & Iteration
- Analyzing user data and app performance metrics
- Making decisions for future iteration and updates
