neuro vibe

Turning chaotic websites into calm digital spaces with AI

Comment

Inspiration

The modern internet is not designed for the human brain — it’s designed for engagement.

Flashing ads, dense paragraphs, auto-playing videos, and aggressive layouts create cognitive overload. For individuals with ADHD, autism, anxiety, or high stress, this sensory intensity becomes exhausting.

We asked a simple question:

What if the internet adapted to you, instead of forcing you to adapt to it?

Neuro-Vibe was inspired by the idea of “Liquid Design” — a web that reshapes itself in real time based on your mental state. Instead of static dark mode or accessibility toggles, we imagined an AI-powered interface that senses your vibe and dynamically transforms content to reduce overload before it happens.

What it does

Neuro-Vibe is an AI-powered browser adaptation engine that dynamically reshapes websites based on a user’s emotional state.

It:

Detects stress or focus levels via webcam-based expression analysis or manual vibe check.

Uses AI to summarize long paragraphs into concise bullet points.

Reduces cognitive load by:

Removing distracting elements

Expanding white space

Adjusting contrast and typography

Suppressing animations

Switches intelligently between:

Calm Mode

Focus Mode

High-Contrast Mode

Instead of just changing colors, Neuro-Vibe transforms the structure and readability of a webpage in real time.

It acts as a Cognitive Load Reduction Engine for the modern web.

How we built it

Neuro-Vibe was built as a functional prototype browser-based system.

Architecture:

  1. Emotion Detection Layer

Webcam input for facial expression analysis

Manual “vibe check” override

Stress classification logic

  1. AI Processing Layer

AI-powered text summarization

Content restructuring logic

Prompt-driven dynamic adaptation

  1. DOM Manipulation Engine

Injects custom CSS dynamically

Rewrites page structure

Hides non-essential elements

Adjusts spacing and typography in real time

Tech Stack:

Frontend: JavaScript, HTML, CSS

AI Integration: LLM API for summarization and rewriting

Emotion Detection: Browser-based facial analysis

Real-time DOM manipulation for transformation

Everything was built during the hackathon period and functions as a working MVP.

Challenges we ran into

Real-time DOM manipulation is unpredictable Every website has a different structure. Writing adaptive transformation logic that works across pages was complex.

Balancing AI speed and user experience Summarization needed to feel instant. We optimized prompts and content selection to reduce latency.

Avoiding over-simplification We had to ensure the AI preserved meaning while reducing cognitive load.

Designing for accessibility without over-designing We carefully tuned spacing, contrast, and layout to reduce overload without removing necessary context.

Accomplishments that we're proud of

Successfully built a working prototype that dynamically transforms live content.

Implemented AI-driven summarization directly into web pages.

Created multiple adaptive modes triggered by emotional state.

Designed a system that goes beyond dark mode — it restructures content intelligently.

Built an emotionally aware UI adaptation system within the hackathon timeframe.

Most importantly, we built something that feels humane — not just technical.

What we learned

Accessibility should be proactive, not reactive.

AI becomes powerful when it adapts environments, not just answers questions.

Real-world impact requires both technical intelligence and thoughtful UX design.

Measuring cognitive load reduction is as important as visual transformation.

We also learned how challenging cross-website DOM manipulation can be — and how powerful prompt engineering is when done strategically.

What’s next for Neuro-Vibe

Neuro-Vibe is just the beginning.

Next steps include:

Expanding compatibility across major websites

Adding reading-time and distraction-reduction metrics

Personalization profiles for ADHD, autism, and anxiety

On-device processing for improved privacy

Turning Neuro-Vibe into a full browser extension for public release

Long-term, we envision Neuro-Vibe becoming a universal cognitive accessibility layer for the internet.

Our goal is simple:

Make the internet calmer, smarter, and more human-aware.

Built With

Share this project:

Updates