MoodBridge | Devpost

MoodBridge

Inspiration

Mental health challenges affect millions globally, yet access to timely, personalized, and non-judgmental support remains limited—especially for individuals who may not feel comfortable speaking to others or can’t afford therapy. We were inspired to build MoodBridge to bridge that emotional gap using AI.

With the rise of conversational AI and voice synthesis technology, we saw an opportunity to create a supportive, always-available companion that listens, responds empathetically, and even speaks back with a human-like voice. Whether someone is feeling anxious, lonely, overwhelmed, or just wants to talk, MoodBridge is designed to be a friendly first line of support.

Our goal was to design a tool that feels warm, safe, and intelligent—blending natural conversation with voice, sentiment tracking, and personal insights—all in a sleek, accessible interface.

What it does

MoodBridge is an AI-powered mental health companion designed to offer supportive, empathetic conversations through text and voice. It enables users to express themselves freely, receive thoughtful AI-generated responses, and hear those responses spoken aloud using natural-sounding speech synthesis.

Key features include:

🧠 Conversational AI – Built on OpenAI's GPT model, MoodBridge engages in contextual, supportive chat with the user.

🔊 Voice AI Integration – Every response is also converted into realistic speech using ElevenLabs, making the experience more human and accessible.

📊 Sentiment Analysis – Messages are analyzed in real time to detect emotional tone (positive, neutral, or negative), helping the system adapt its tone and allowing users to track their emotional trends.

📝 Chat Export – Users can export their conversation history for self-reflection or sharing with a professional.

🎤 Voice Input – Users can speak to MoodBridge using built-in speech recognition for a hands-free, natural experience.

🌙 Dark Mode Toggle – A personalized user interface with light/dark mode to reduce eye strain and enhance usability.

🔐 Secure Logging – All conversations are logged in a privacy-focused Supabase database per user session for continuity and self-tracking.

In essence, MoodBridge becomes a gentle companion that listens, responds, and supports—anytime, anywhere.

How we built it

We built MoodBridge using a combination of powerful technologies and AI services to deliver a truly conversational mental health companion.

🔧 Frontend & Application Logic: Developed locally with Next.js 14 and TypeScript, providing fast performance and strong type safety. The app structure follows the modern src/ directory convention for clean separation of logic.

🎤 Voice Interaction: Integrated ElevenLabs Voice AI to convert assistant responses into natural-sounding speech, enhancing accessibility and user immersion.

💬 Conversational Intelligence: Connected to the OpenAI GPT-3.5 Turbo API for empathetic, intelligent conversation generation. User messages are processed and logged, and assistant replies are streamed in real-time.

🧠 Sentiment Analysis: Used the Sentiment npm library to analyze emotional tone in AI responses, then visualized this in the chat UI with friendly emoji-based sentiment tags.

📦 Supabase: Leveraged Supabase for backend services—real-time logging of chats per user ID and persistent message history.

🎙️ Voice Input: Integrated the browser’s Web Speech API (via SpeechRecognition) to let users speak naturally to the assistant, making MoodBridge hands-free.

💻 Deployment & Hosting: Deployed the production build via Netlify, and used Bolt.new to publish a visually compelling landing page for submission. The Bolt site includes a custom domain and the required “Built with Bolt.new” badge.

🔗 GitHub: Source code versioned and managed in a public GitHub repository to enable transparency and collaboration.

Throughout the build, we focused on optimizing developer efficiency while prioritizing user experience, particularly around accessibility, emotional nuance, and privacy. Development was carried out using pnpm for fast and efficient package management.

Challenges we ran into

Challenges we ran into Building MoodBridge was an exciting but challenging journey. Here are some key obstacles we faced and overcame:

🔐 Environment Variable Conflicts Integrating multiple APIs (OpenAI, ElevenLabs, Supabase) required careful handling of environment variables. During deployment to Netlify, we ran into issues with mismatched variables and had to debug hidden configuration problems that weren’t obvious locally.

📦 pnpm Lockfile Errors Since we used pnpm, Netlify's default CI behavior failed due to a mismatch between pnpm-lock.yaml and package.json. We resolved this by forcing --no-frozen-lockfile during Netlify builds and carefully syncing dependency versions.

🔊 Voice Synthesis Synchronization Integrating ElevenLabs for real-time voice synthesis introduced race conditions between receiving the AI response and generating/playing audio. We had to refactor our async logic to ensure smooth, natural playback without audio delays or duplication.

🔄 OpenAI Rate Limits & Errors During testing, we occasionally hit OpenAI rate limits or experienced API timeouts. We built graceful error handling and user notifications to maintain a polished UX even during backend instability.

💬 SpeechRecognition Browser Support Ensuring voice input worked across browsers was tricky. We had to fallback to webkitSpeechRecognition for compatibility and dynamically detect browser capabilities to avoid runtime crashes.

⏳ Time Constraints As with most hackathons, time was tight. We had to prioritize features that aligned with the prize tracks and make strategic decisions to deliver a polished MVP with limited resources.

Despite these challenges, we stayed agile and focused, and ultimately delivered a product we’re proud of.

Accomplishments that we're proud of

✨ Bringing MoodBridge to life in just two weeks was an incredible achievement. We’re proud of the following milestones:

🧠 Built a full-stack AI-powered mental health app from scratch We successfully integrated OpenAI for intelligent conversation, ElevenLabs for natural voice synthesis, and Supabase for user chat logging—creating an emotionally responsive voice-based assistant.

🎙️ Real-time voice input and output Users can speak directly to MoodBridge and get intelligent, spoken responses—turning passive chat into an immersive, natural experience.

💬 Sentiment-aware messaging Every assistant reply is analyzed with sentiment scoring, helping users understand the emotional tone of their conversations. This is especially valuable for mental health reflection.

🧾 Chat export feature We implemented an easy-to-use .txt export button so users can save their MoodBridge sessions for journaling or sharing with professionals.

🌗 Seamless dark/light mode MoodBridge includes a smooth toggle between dark and light themes to suit user preferences and reduce eye strain.

🚀 Live Deployment & Bolt Integration We deployed our app successfully to Netlify and migrated the landing page to Bolt.new, fulfilling all hackathon publishing and submission requirements.

💡 Vision with purpose Above all, we’re proud that MoodBridge addresses a real societal need—providing a supportive, private space for users to process their emotions with AI assistance.

This project pushed our limits—and we delivered something beautiful, meaningful, and technically solid.

What we learned

This hackathon was a crash course in building fast, smart, and human-centered applications with AI. Here's what we learned:

⚙️ How to connect multiple AI services into one cohesive experience We gained hands-on experience integrating OpenAI's conversational intelligence, ElevenLabs' voice synthesis, and Supabase’s scalable backend—turning disparate tools into a seamless user journey.

🗣️ The power of voice in user interaction Building a voice-driven chat interface opened our eyes to how much more engaging and emotionally resonant apps can be when sound is involved.

🧠 Designing for emotion We learned how to analyze user input for sentiment and reflect emotional awareness in our AI responses—essential when creating tools that interact with human vulnerability.

⚡ The power of fast prototyping with Bolt.new Bolt’s no-code interface allowed us to quickly build and publish a public-facing landing page for MoodBridge. This accelerated our outreach and hackathon readiness without getting slowed down by frontend friction.

🧪 Resilience in debugging under pressure From resolving deployment errors to fixing dependency mismatches between pnpm, Next.js, and Netlify, we learned the value of staying calm and persistent when things go wrong (because they will).

🧩 Collaboration between AI and human creativity Ultimately, this hackathon taught us that the future of software isn’t code vs. no-code—it’s about combining AI capabilities with human insight to build tools that truly matter.

What's next for MoodBridge

🚀 MoodBridge is just getting started. Here’s what’s ahead:

📱 Launch a mobile version We plan to extend MoodBridge to iOS and Android using React Native or Flutter, enabling users to carry their mental health companion in their pockets.

🧠 Smarter emotional intelligence We’re working on improving sentiment detection with context-aware analysis and tone mapping to generate more empathetic and personalized responses.

🎭 Custom AI personas Users will be able to select or design AI personas (therapist, coach, friend, etc.) that match their communication style and needs.

🌍 Global accessibility Future updates will support multilingual voice input/output to ensure MoodBridge is inclusive across regions and cultures.

📊 Wellness insights dashboard We plan to add a user dashboard with sentiment trends, mood timelines, and AI-generated mental wellness tips.

🧩 Plugin ecosystem We envision a plugin-friendly platform where developers can integrate journaling, meditation, CBT techniques, or even crisis line referrals.