Focus Guardian

Inspiration

In a world filled with constant notifications, endless content, and digital distractions, staying focused throughout the day can feel overwhelming. Our team wanted to create a tool that lives directly inside the browser and helps users stay on track without adding more noise to their workflow. We were inspired by the idea of combining AI, behavioral feedback, and light gamification to make productivity feel supportive rather than restrictive.

What it does

Focus Guardian is an AI-powered Chrome extension designed to help users maintain focus and build better productivity habits. The extension introduces a customizable character that acts as a friendly guide throughout the day, encouraging users to stay engaged with their tasks. It monitors browsing activity, supports structured focus sessions using a Pomodoro-style timer, and classifies websites as productive or distracting in real time. Facial tracking is used to estimate attentiveness through eye and head movement, allowing the system to deliver adaptive feedback without storing personal camera data. Users receive sound alerts, notifications for distractions, and encouraging messages that reinforce positive behavior. As users stay focused, they unlock cosmetic upgrades for their character, turning productivity into a rewarding and interactive experience.

How we built it

We developed Focus Guardian as a modern Chrome Extension using React, TypeScript, and JavaScript, with a Manifest V3 architecture and a service worker handling background processes. The AI website classification system was powered by the Groq API, where we engineered prompts to evaluate browsing context and generate personalized productivity signals. Facial tracking was implemented using an open face-mesh model to estimate focus levels directly in the browser. We also built a responsive UI with animated character interactions, integrated real-time notifications and sound cues, and designed the system to run locally whenever possible to prioritize user privacy and performance.

Challenges we ran into

One of our biggest challenges was configuring the Chrome extension environment so that it worked consistently across multiple machines and browsers during development. We also had to creatively handle video playback and media behavior since platforms like YouTube limit direct integrations. Another major hurdle was refining the AI prompts to reliably distinguish between productive and distracting content, which required continuous iteration and testing to balance accuracy with speed.

Accomplishments that we're proud of

We’re proud of building a fully functional AI-driven productivity tool within a short hackathon timeline while maintaining a polished user experience. Successfully integrating facial tracking, adaptive AI classification, and gamified design into a single browser extension demonstrated strong collaboration between frontend, AI, and systems engineering. We were also excited to see early adoption from more than 20 users who tested the extension and engaged with its focus features.

What we learned

Through this project, we gained hands-on experience building Chrome extensions with modern architecture, integrating LLM APIs into real-time workflows, and implementing browser-based computer vision responsibly. We also learned how to collaborate effectively under tight deadlines, balance technical ambition with usability, and transform a daily-life problem into a functional product from concept to deployment.

What's next for Focus Guardian

Our next step is to expand the social and competitive aspects of the platform. We plan to introduce leaderboards and friend-based challenges so users can compare focus streaks and motivate each other through healthy competition. By combining community-driven features with AI-powered feedback, we aim to make productivity more engaging, social, and sustainable over time.