Mindful Web - Stay calm and on track

Mindful Web makes the internet feel lighter and more intentional. It helps when your focus slips or stress builds up, and uses AI to help you breathe, refocus, or simplify what’s onscreen.

Comment

Inspiration

Spending hours online, I noticed how easy it is to swing between feeling overwhelmed and distracted. There’s no built-in way for browsers to help us manage our mental state — they just keep feeding us more. I wanted to change that.

What it does

Mindful Web is a browser extension that adapts to your cognitive state. It helps you stay focused when you need to work and offers calming support when things get too intense. The goal is simple: make the web a little more human.

How we built it

Built using Chrome’s on-device AI APIs, everything runs locally — no data leaves your browser. Core Components: Popup UI: Lets you switch between Calm and Focus modes. Content Script: Adds overlays, breathing animations, summaries, and affirmations. Background Worker: Connects to Chrome’s AI models (Gemini Nano, Summarizer, Prompt API). Key Features: Summarizer API: Simplifies dense or stressful content. Prompt API: Scores how relevant a page is to your goals. Writer API: Generates short affirmations or focus nudges.

Challenges we ran into

API Limitations: Some features were still experimental. State Syncing: Keeping UI and content scripts in sync was tricky. User Experience: Designing interventions that feel helpful, not annoying, took iteration.

What we learned

This project taught us a lot about: Using on-device AI for real-time, private inference. Designing for cognitive load, not just clicks. Balancing automation with user control - the AI suggests, never forces. It also deepened our interest in calm tech and how digital tools can support mental well-being.

What's next for Mindful Web - Stay calm and on track

Smart Mode Switching: Predict user state and suggest mode changes (with consent). Reflect Mode: Summarize browsing sessions to promote self-awareness. Tab Group Integration: Label tabs as relevant or distracting based on user goals.

Future Direction

  • Affective Computing Studies — measuring the impact of calm interventions on cognitive load and user well-being.
  • Attention Restoration Experiments — testing whether guided breathing or reflective prompts measurably improve task resumption speed.
  • Human-AI Interaction Design — exploring how gentle suggestions compare to automatic actions in maintaining user trust.

Study how calm interventions affect focus and stress. Model attention drift over time: \[ A(t) = A_0 e^{-kt} \] where \(A(t)\) is focus over time, \(A_0\) the initial attention level, and \(k\) a decay constant influenced by environmental noise or task complexity.
Interventions like Calm Mode aim to reduce \(k\), slowing cognitive fatigue.

Final Thoughts

Mindful Web is more than a productivity tool — it’s a step toward tech that respects our attention and supports our mental state. It’s about building systems that adapt to us, not the other way around.

Calm technology for the cognitive age.

Built With

Share this project:

Updates