Inspiration
We wanted to build a tool that feels like the “secret safe haven” you see in thriller or sci‑fi movies—where a character can discreetly signal for help or vanish at the push of a button. Action FIlms inspired us to create a conversational interface that not only listens empathetically but also helps the user stay safe and literally cover their tracks with one click.
What it does
- Real‑time chat support with an empathetic bot that responds to emotional cues
- Automated risk assessment, tracking hundreds of distress keywords and sentiment to compute a “Wellness Index”
- Emergency decoys (normal decoy, stealth decoy, cover‑up) that generate a privacy‑preserving PDF report and immediately redirect you to a benign site
- Voice input with live transcript and keyword detection
- Safety code‑words modal for discreet communication when someone might be watching
- Downloadable report (PDF) that snapshots conversation history, risk level, and contextual patterns
How we built it
- Front‑end: Vanilla HTML/CSS/JS, with Tailwind‑inspired utility‑classes for rapid styling
- NLP: Compromise.js for entity‑extraction + Datamuse API to expand our distress‑keyword list to over 1 000 terms
- Sentiment: AFINN‑based Sentiment.js to gauge tone (positive/negative/comparative)
- PDF generation: jsPDF + jsPDF‑AutoTable to compile chat history and risk scores into a downloadable report
- Voice: Web Speech API (SpeechRecognition + MediaRecorder) for live transcription and analysis
- Stealth features:
history.pushState+location.replaceflow to remove our app page from the back‑button history
Challenges we ran into
- Balancing sensitivity vs. false positives: Catching every distress term without overwhelming the user with high‑risk alerts took several iterations of pattern‑tuning.
- Cross‑browser voice support: Different browsers handle interim vs. final transcripts inconsistently, so we had to build robust fallback logic.
- PDF layout: Ensuring multi‑page conversation histories and tables rendered neatly in jsPDF required manual pagination and autotable configuration.
- History hijacking: Preventing the back‑button from exposing the report page was surprisingly tricky—
pushState+popstateguards were essential.
Accomplishments that we’re proud of
- 🔒 A fully functional emergency decoy that generates a real report behind the scenes and immediately redirects—no trace in browser history
- 🎙️ Seamless voice chat with live transcript, NLP analysis, and emergency‑trigger detection, all in under 200 lines of vanilla JS
- 💾 Persistent session storage across reloads and tabs, so users can pick up exactly where they left off
- 🤝 A tiny, zero‑dependency codebase that integrates open APIs and libraries—no build step required
What we learned
- User privacy first: Small UI/UX details (like a cover‑up button or subtle code‑words modal) make a huge difference in real‑world safety scenarios.
- API design matters: Keeping core logic decoupled (keyword loading, risk scoring, PDF gen) makes future maintenance and testing far easier.
- Graceful degradation: Building robust fallbacks for missing APIs (e.g. no SpeechRecognition) ensures the app still works in constrained environments.
- History manipulation: Modern browsers’ history APIs are powerful but must be used judiciously to avoid frustrating users.
What’s next for Mental Mane
- Mobile‑friendly UI: Responsive redesign and a standalone PWA for offline/low‑connectivity use
- Multilingual support: Expand NLP and distress‑keyword sets to Spanish, French, and other high‑need languages
- Real‑time remote monitoring: Optional opt‑in feature to securely share anonymized risk reports with trusted contacts or professionals
- Machine learning: Integrate a lightweight on‑device model to learn individual user patterns and reduce false positives over time
- Accessibility enhancements: Full keyboard‑only navigation, screen‑reader support, and adjustable font sizes/colors for low‑vision users
Built With
- gemini
- javascript
- openai
Log in or sign up for Devpost to join the conversation.