Focus Friend

Chrome Extension Icon
Productive Browser
Distraction Detected
Warning Notification
Completed Session
Study Buddy's Mood and Health
Pet Gallery and Shop

Inspiration

Online studying makes distractions only one tab away. Standard productivity timers can be easy to ignore, so we wanted focusing to feel more personal and rewarding.

What it does

Focus Friend is a Chrome extension that gives students a virtual study buddy. During a focus session, the buddy reacts when the student visits distracting websites and celebrates productive time.

Students can:

Track focus sessions and daily streaks
Receive distraction warnings
Watch their buddy’s mood change
Earn points for completed sessions
Unlock animals, colors, and accessories
Customize productive and distracting websites

How we built it

We built Focus Friend with HTML, CSS, JavaScript, and Chrome’s Manifest V3 APIs. The side panel contains the main dashboard, while a content script displays the floating buddy on webpages.

Chrome Storage saves progress locally, Chrome Tabs identifies the active website, and Chrome Notifications delivers distraction warnings. We also created systems for health, moods, points, streaks, sounds, and unlockable rewards.

Challenges we ran into

The biggest challenge was keeping sessions accurate when Chrome paused the extension’s background worker. We solved this by saving timestamps and recalculating the session whenever it wakes up.

We also had to synchronize the side panel, floating buddy, notifications, sounds, and active browser tab while keeping the experience encouraging rather than punishing.

Accomplishments that we're proud of

We are proud that we turned a simple focus timer into a complete, interactive experience. Focus Friend includes website detection, mood and health changes, notifications, points, streaks, sounds, a reward shop, and 30 animal companions.

We also built the extension to save progress locally without storing or transmitting browsing history.

What we learned

We learned how Chrome extensions communicate across webpages, side panels, and background workers. We also learned how thoughtful feedback and game mechanics can make a simple timer more motivating.