Fallstudie

Resilient Mind

Ein Webanwendungskonzept für zugängliche emotionale Unterstützung durch KI-gestützte Gespräche und Selbstübungen.

Rolle
Einzelentwickler
Zeitraum
2025–2026
Projekttyp
Psychische Gesundheit / KI-Integration
  • Vue 3
  • TypeScript
  • Firebase
  • OpenAI
  • GitHub Pages
Startseite der live Resilient-Mind-App. Die Navigation bietet Sign in und Create account. Vier Karten: AI Chat Support, Book Therapy, Recovery Programs und Community.
Startseite. Die Karten beschreiben die Produktidee. Therapiebuchung und Community sind unvollständige Module.

Überblick

Emotionale Unterstützung als Anwendungsprototyp.

Resilient Mind ist ein Konzept zur Unterstützung der psychischen Gesundheit für vom Krieg in der Ukraine Betroffene und alle, die emotionale Hilfe suchen. Die Produktvision umfasst einen KI-Chatbot, Therapiebuchung, Erholungsprogramme und eine Community.

Die umgesetzte Anwendung bietet E-Mail- und Passwort-Konten, einen KI-gestützten Chat für angemeldete Nutzer sowie Selbstübungen für Atmung und KVT im Browser.

Meine Rolle

Einzelentwickler über den gesamten Stack.

Ich habe die Vue-3- und TypeScript-Anwendung End-to-End konzipiert und gebaut: Frontend-Architektur und Routing, Pinia-State, Firebase Authentication und Firestore sowie die aufrufbare Cloud Function für OpenAI. Jeder Commit im Repository stammt von mir.

Umgesetzte Funktionen

Was im Prototyp enthalten ist.

Authentifizierung

Registrierung und Anmeldung per E-Mail und Passwort mit Firebase Authentication. Geschützte Routen erfordern eine angemeldete Sitzung.

KI-Chatbot

OpenAI gpt-4o-mini über die authentifizierte Cloud Function handleAIChat. Der Chat ist nach der Anmeldung verfügbar.

Selbstübungen

Atemübungen und KVT-Formulare (Gedankenprotokoll und Verhaltensaktivierung) im Browser. Fortschritt wird nicht gespeichert.

Anmeldebildschirm mit E-Mail- und Passwortfeldern und Schaltfläche Sign in.
Anmeldung — Firebase Authentication.
Angemeldeter AI Support Chat. Ein Hinweis besagt, dass der Assistent keine professionelle Hilfe ersetzt. Der Thread zeigt eine Begrüßung, das Wort Hello und eine kurze Antwort.
KI-Chat nach Anmeldung — Nachrichten laufen über die bereitgestellte Cloud Function.
Atemübung mit blauem Kreis Ready, Timer 0:00, Schaltflächen Start und Reset, fünf Minuten Dauer und ausgewähltem 4-7-8-Muster.
Atemübung — läuft lokal im Browser.

Architektur

Von der Oberfläche zum OpenAI-Modell.

Vue 3 + Pinia → Firebase Cloud Function (handleAIChat) → OpenAI API (gpt-4o-mini).

handleAIChat läuft nur für angemeldete Nutzer über Firebase Authentication. Der OpenAI-Schlüssel liegt in einem Firebase-Secret, nicht im Client-Bundle. Es gibt keinen separaten Anwendungsserver.

  1. 01

    Vue 3 und TypeScript mit Vue Router und Pinia für Struktur und Zustand der Anwendung.

  2. 02

    Serverseitige OpenAI-Integration über Firebase Cloud Functions.

  3. 03

    GitHub-Pages-Bereitstellung mit Vite-Basis /resilient-mind/ und SPA-Fallback für direkte Routen.

Projektstatus

Umfang des Prototyps.

Ein funktionierender Anwendungsprototyp mit Authentifizierung, KI-gestützten Gesprächen und Selbstübungen. Therapeutenbuchung, Community-Funktionen und erweiterte Erholungsmodule sind noch nicht fertig.

Technologie-Stack

Was die laufende Anwendung nutzt.

  • Vue 3
  • TypeScript
  • Vite
  • Vue Router
  • Pinia
  • Tailwind CSS
  • Firebase Authentication
  • Cloud Firestore
  • Firebase Cloud Functions
  • OpenAI API
  • GPT-4o-mini
  • GitHub Actions
  • GitHub Pages

Links

Interesse an Zusammenarbeit? Kontakt aufnehmen.

Zurück zu Arbeit