Inspiration

Mental health struggles often go unnoticed because they’re invisible. We wanted to create an experience that builds empathy by helping people feel—even briefly—what it’s like to live with conditions like anxiety, depression, or PTSD. Our goal: awareness through immersion.

What it does

Mindscape is an interactive, scroll-based mental health empathy simulator. It tells a first-person story from the perspective of someone navigating everyday life while silently battling an internal condition. Through visual distortion, sound, and narration, it helps users understand the emotional weight and sensory challenges many silently carry.

How we built it

We used Lovable (the AI coder) to assist in building the static website Local data only—no backend, no tracking, fully privacy-first

Challenges we ran into

Designing an experience that was powerful without being overwhelming Striking a balance between realism and accessibility Making it work smoothly on both mobile and desktop devices Ensuring that the narrative wasn’t too triggering while remaining emotionally impactful

Accomplishments that we're proud of

Delivered an empathy-first experience using only front-end code Created an offline-capable, lightweight site with rich storytelling Made mental health awareness interactive and emotionally resonant

What we learned

How to use scroll-based storytelling as a medium for empathy The importance of accessibility in emotionally sensitive experiences How to collaborate with an AI coder like Lovable to prototype faster

What's next for Mindscape

Add more perspectives (e.g., OCD, bipolar) Allow user-submitted stories (curated & static) Localize into multiple languages Partner with awareness campaigns or schools for educational use

Built With

  • lovable
Share this project:

Updates