Blessing Aighangbe

Posted on May 21

MindBridge: A Mental Health First Responder AI Built with Gemma 4

#devchallenge #gemmachallenge #gemma

Gemma 4 Challenge: Build With Gemma 4 Submission

The Problem That Kept Me Up At Night

Over 970 million people worldwide live with a mental health disorder. That's roughly 1 in 8 people on Earth.

Yet most of them will never get help.

Not because they don't want it — but because of barriers that feel impossible to overcome:

💸 Therapy costs $100–$300 per session, often not covered by insurance
⏳ Waitlists of 3–6 months to see a psychiatrist
🌍 In many countries (including mine), mental health infrastructure barely exists
😶 Stigma so heavy that people won't tell a single soul they're struggling
🕐 Crises happen at 2am — not during office hours

I kept thinking: what happens in those critical hours before someone can reach a professional? What if there was something — anything — available at the exact moment someone hits rock bottom?

That's what MindBridge is.

What I Built

MindBridge is a compassionate AI-powered mental health first responder, built with Next.js and powered by Gemma 4's 31B dense model via OpenRouter.

It's not a therapist replacement. It's a bridge — from "I'm not okay and I don't know what to do" to "I have support, resources, and someone listening."

🔗 Live demo: https://mindbridgementalhealth.vercel.app/
🐙 GitHub: https://github.com/Tallest18/gemma4-mental-health

How it works

Step 1 — You share how you feel

Type freely, or tap one of six quick-start mood buttons (Sad, Anxious, Angry, Numb, Stressed, Lonely). You can even upload a journal page, a piece of artwork, or any image that expresses how you feel — Gemma 4 will analyze it.

Step 2 — Gemma 4 listens and assesses

The model performs a structured mental health triage, returning:

A triage level (Low / Moderate / High / Crisis)
A warm summary of what it heard
Patterns it identified in what you shared
Grounding strategies tailored to your situation
Curated resources — hotlines, apps, online therapy, exercises
A genuine affirmation just for you

Step 3 — Keep talking

The conversation continues in an empathetic chat interface for as long as you need. Full conversation history is maintained across the session thanks to Gemma 4's 128K context window.

Why Gemma 4? The Intentional Choice

This is the heart of why Gemma 4 specifically was the right tool — not just any model.

1. Multimodal understanding for richer emotional context

Mental health isn't purely verbal. People express distress in art, in journals, in the photos they take. Gemma 4's native multimodal capability means a user can upload a page from their journal or a piece of artwork alongside their words, and the model analyzes both together for a deeper understanding.

User types: "I don't really know how to explain it..."
User uploads: A photo of their journal filled with scribbled-out words

Gemma 4 sees both → understands the depth of their struggle
better than words alone could convey

No other approach in this size class handles this as cleanly.

2. Advanced reasoning for nuanced emotional language

Mental health language is extraordinarily subtle. "I'm fine" almost never means fine. "I've just been tired lately" can mask severe depression. "I've been thinking a lot" can be the first step toward disclosing suicidal ideation.

Gemma 4's reasoning capabilities allow it to read between the lines — to understand what someone means, not just what they said. This is critical in a mental health context where the wrong response to a signal can cause real harm.

3. 128K context window for continuity of care

Mental health support is not a single transaction — it's a relationship built over time. A model that forgets what someone said three messages ago cannot provide meaningful support.

Gemma 4's 128K context window means MindBridge can hold the entire conversation in memory, refer back to earlier disclosures, and build a coherent picture of what someone is going through — just like a real therapist would.

4. Privacy-first deployment

Perhaps most importantly: mental health data is among the most sensitive information that exists. Gemma 4 is an open model that can run locally or be accessed via OpenRouter without sending data to a large proprietary cloud. For a domain this sensitive, that matters enormously.

Technical Architecture

┌─────────────────────────────────────────┐
│            User's Browser               │
│  Next.js 14 · React 18 · TypeScript     │
│                                         │
│  Landing → Check-in → Results → Chat   │
└──────────────────┬──────────────────────┘
                   │ HTTPS (no API key exposed)
┌──────────────────▼──────────────────────┐
│           Next.js API Routes            │
│     (Server-side — Vercel Edge)         │
│                                         │
│  POST /api/assess  →  Initial triage    │
│  POST /api/chat    →  Ongoing support   │
└──────────────────┬──────────────────────┘
                   │ Bearer token (server env var)
┌──────────────────▼──────────────────────┐
│         OpenRouter API                  │
│    google/gemma-4-31b (31B dense)       │
│                                         │
│  Structured JSON assessment output      │
│  Multimodal input (text + images)       │
│  128K context for full chat history     │
└─────────────────────────────────────────┘

Key technical decisions

Server-side API key — The OpenRouter key never touches the client. It lives in Vercel's environment variables and is called only from Next.js API routes. Users just use the app.

Structured JSON output — The initial assessment prompt asks Gemma 4 to return a strict JSON schema with triage level, symptoms, coping strategies, resources, affirmation, and disclaimer. This makes the output predictable, parseable, and safe to render.

Triage-aware prompting — The chat continuation prompt is dynamically adjusted based on the triage level. A "crisis" level conversation has different system instructions than a "low" concern — the model is told to prioritize crisis line resources in every response.

Trauma-informed system prompts — The prompts were written using trauma-informed communication principles: validate before advising, never minimize, use "I" statements, keep language warm and non-clinical.

Stack

Layer	Technology
Framework	Next.js 14 (App Router)
Language	TypeScript
Styling	Tailwind CSS + CSS Variables
AI Model	Gemma 4 31B via OpenRouter
Deployment	Vercel (free tier)
Image upload	react-dropzone
Markdown	react-markdown

The Triage System

MindBridge uses a four-level triage system modeled loosely on real mental health intake processes:

Level	What it means	Example signals
🟢 Low	Mild everyday stress	Work pressure, minor anxiety
🔵 Moderate	Needs attention	Sleep problems, low mood, social withdrawal
🟠 High	Significant concern	Panic attacks, trauma symptoms, major life crisis
🔴 Crisis	Immediate danger	Suicidal ideation, self-harm, active danger

For Crisis level, the UI changes dramatically — a pulsing red banner with crisis line numbers appears immediately, before any other content. The chat input shows a permanent reminder to call 988 or 911. Gemma 4's system prompt is rewritten to prioritize connecting the user to professional help above all else.

What I Learned Building This

1. Prompt engineering for mental health is genuinely hard

Getting Gemma 4 to consistently return valid JSON while also being warm and empathetic required significant iteration. Early versions were either too clinical (returned perfect JSON but felt cold) or too conversational (great tone but malformed output). The solution was separating the structured assessment from the conversational chat — two different prompt strategies for two different needs.

2. Structured output is your best friend

Asking Gemma 4 to return a strict JSON schema for the initial assessment — rather than free-form text — made the entire downstream experience reliable. The model is remarkably good at this when the schema is clearly specified in the system prompt with examples.

3. Open models enable trust in sensitive domains

For a mental health application, the fact that Gemma 4 is open matters beyond the technical. Users (and regulators) increasingly want to know where sensitive conversations go. With an open model, the answer is clear and auditable. This is a real advantage over proprietary alternatives for this use case.

4. The smallest UX details carry enormous weight

A mental health tool isn't just a technical product — every word, color, and interaction either builds trust or erodes it. The warm cream palette instead of clinical white. "What I'm hearing" instead of "Symptoms detected." "Things that can help right now" instead of "Recommended interventions." These choices matter enormously when someone is vulnerable.

What's Next for MindBridge

The foundation is solid. Here's what I'd build next with more time:

On-device mode using Gemma 4's 4B model (runs on a phone) for fully offline, completely private support
Voice input — many people find it easier to speak than type when distressed
Mood tracking across sessions with optional local storage
Localization — mental health resources are country-specific; a Nigerian user needs different resources than a US user
Professional handoff — structured summaries a user can share with a therapist to accelerate their first session

Safety & Ethics

I want to be transparent about the limitations and safety considerations:

What MindBridge is:

A compassionate first point of contact
A bridge to professional care and crisis resources
A private space to process feelings without judgment

What MindBridge is NOT:

A replacement for professional mental health care
A diagnostic tool
A crisis intervention service

Every response includes a disclaimer. Crisis-level triage immediately surfaces 988, Crisis Text Line, and findahelpline.com. The system prompts explicitly position MindBridge as a companion, not a clinician.

Try It

🔗 Live: https://mindbridgementalhealth.vercel.app/
🐙 Code: https://github.com/Tallest18/gemma4-mental-health

No sign-up. No data stored. No cost. Just open it and talk.

If this resonates with you, or if you've experienced the gap in mental health access firsthand — I'd love to hear your thoughts in the comments. And if you're struggling right now: you don't have to figure it out alone.

988 (US)/ 112 (NG) · findahelpline.com (international)

Built with Gemma 4 for the DEV.to Gemma 4 Challenge · May 2026