Mindful Moments

Mindful Moments is a mental health tracker app designed to support users of all ages, genders, and backgrounds

Mindful Moments Main Screen
Home screen for Mindful Moments

Overview

Mindful Moments is a multi-platform mental health tracker designed to help users manage their well-being through daily check-ins, journaling, breathing exercises, and emergency support. Created for mobile, tablet, and desktop, it offers a calming and accessible experience for anyone facing mental health struggles.

Problem

Many people struggle to find mental health resources that are both accessible and easy to use. Often, the overwhelming nature of their emotional state makes it difficult to engage with tools that feel clinical, cluttered, or overly complicated.

Goals

Design a simple, calming, and supportive app that helps users track moods, express thoughts, practice mindfulness, and quickly access help when needed — all while being visually soothing and emotionally accessible.

User Persona: Jamie

Jamie is a college student needs an emotionally supportive app that helps track moods and reduce stress through small, consistent habits—without feeling overwhelmed by too many features.

Design Process

Wireframes

Wireframes

Rough sketches of what I envisioned the Mindful Moments app to look like


Low Fidelity

Low Fidelity

Removed placeholders and started adding in content that would be used in the final version


Final Design

High Fidelity Mobile
Final Design for Mindful Moments on Mobile

Added calming colors that flow well together as well as added animations for the Breathe screen


High Fidelity Tablet
Final Design for Mindful Moments on Tablet

Expanded content to ensure that it fits on a tablet screen


High Fidelity Desktop
Final Design for Mindful Moments on Desktop

Adjusted spacing and sizes of content for desktop devices


Key Features

  • Daily mood tracking with visual indicators
  • Guided breathing exercises with calming visuals
  • Journal entries with emotion tagging
  • SOS button for immediate crisis support
  • Progress timeline to track emotional patterns

    • Prototypes

    High-Fidelity UI

    Mobile Check In
    Final Design for the Check In screen on Mobile
    Mobile Breathe
    Final Design for the Breathe screen on Mobile
    Mobile Support
    Final Design for the Support screen on Mobile

    Desktop Dashboard
    Final Design for the Dashboard screen on Desktop
    Desktop Progress Tracker
    Final Design for the Progress Tracker screen on Desktop
    Desktop Journal
    Final Design for the Journal screen on Desktop

    Mobile Prototype: Ensure that all functionality is working and easy to navigate through

    Desktop Prototype: Ensured that everything flows smoothly from mobile to desktop

    Mobile Prototype Tablet Prototype Desktop Prototype

    Accessibility Considerations

  • High Color Contrast for readability
  • Responsive Design for seamless adaptation across devices
  • Alt Text for Images for screen readers
  • Clear Visual Hierarchy to ensure all fonts and spacing are the equal

    • Reflection

    Designing a mental wellness app gave me the opportunity to explore how digital tools can offer comfort, support, and empowerment to users during emotionally difficult times.