Mood Mate

MoodMate: A kinder emotional reset hub featuring tactile mood tracking, 4-7-8 breathing, a Growth Coin economy, and Lumi 🌿—a Gemini 3.8 Flash AI companion for grounding and coding support.

Comment

Here is a clean, simple version in standard Markdown format:

Inspiration

Most mood tracking apps are clinical, boring, and punitive—making users feel guilty when they break a streak. As students dealing with exam stress and deadlines, we wanted to build something kinder. We created MoodMate to treat human emotions like natural weather rather than bugs to fix, pairing daily resets with a real AI companion.

What it does

  • 8-Mood Tactile Sanctuary: Tap an emoji to trigger custom particle animations, a 30-second reset pack, and curated YouTube music streams.
  • Lumi 🌿 AI Companion: Powered by Google Gemini 3.8 Flash. Lumi provides emotional grounding (5-4-3-2-1 exercises) and can also write, debug, and explain code (C++, Python).
  • Joyful Bar Graph: A 7-day visual energy chart that dynamically colors columns by your mood with interactive reflection notes.
  • Growth Coin Economy: Earn coins by doing micro-tasks and breathing sessions—no punitive streak penalties.
  • 4-7-8 Breathing Sanctuary: An interactive breathing circle with soothing sound feedback.
  • Kindness Wall: Post anonymous peer encouragement and send virtual hugs.
  • Demo Mode for Judges: Click "Load Demo Profile" to instantly see 14 days of realistic history.

How we built it

  • React 18 & Vite: Ultra-fast frontend with instant page transitions.
  • Tailwind CSS: Clean, responsive sand & sage wellness theme with dark mode.
  • Google Gemini 3.8 Flash: Direct multi-turn API integration with code syntax blocks and copy buttons.
  • Framer Motion & Canvas Confetti: Smooth animations and mood particle effects.
  • LocalStorage: 100% private, client-side data storage without remote database tracking.

Challenges we ran into

  • Formatting Gemini's strict multi-turn conversation flow so the AI remembers previous questions.
  • Making the AI chat work smoothly on static hosts like Netlify without requiring a backend server.
  • Designing unique particle physics animations for all 8 emotions.

Accomplishments that we're proud of

  • Fully functional, zero-error production build.
  • Live integration with Google Gemini 3.8 Flash that handles both emotional support and technical coding.
  • Built-in 1-click Demo Profile that lets judges test the full experience immediately.

What we learned

  • How to structure multi-turn AI prompts and context windows.
  • State management and client-side data isolation in React.
  • How simple interactive design (like 4-7-8 breathing) can de-escalate stress.

What's next for Mood Mate

  • Cloud sync with Supabase for multi-device login.
  • Voice chat support for Lumi AI.
  • Smartwatch heart-rate integration for automatic stress resets.

Built With

Share this project:

Updates

Submission history