Inspiration
Image you set a timer, open a tab, keep it open…then bounce off five other websites, check Slack, onto Instagram, back to the original tab…and poof your focus is gone. We wanted something that forces that focus without being punitive. A tool that gets you to do your work while making it fun.
What it does
Launches a dedicated “locked” session where major distractions tabs are either redirected or purposely silenced so you stay on task.
Built to work with your routine: set a goal, duration, and let LockedIn curate your very own environment.
How we built it
Frontend: HTML/CSS for structure and styling, with JavaScript controlling state, user interactions, session & idle timers, and website redirect logic.
Chrome extension: Uploaded to Chrome using manifest.json, background scripts (background.js), and inject scripts (inject_sidebar.js).
Audio/UX feedback: We added sound effects (musicFun.mp3, scream.mp3) to reinforce the playful moments when focus is broken.
Friends/collaboration logic: The friends tab handles peer-linked accountability features to let you know how you compare to your friends.
Challenges we ran into
Chrome extension permissions: Getting the manifest and background scripts to behave consistently every time we made changes so that we could inject scripts safely. Choosing which chrome extension format (pop-up, side panel, injected side panel, etc.) to use.
Idle detection & false positives: Detecting when the user is really distracted vs. just switching tabs to a whitelisted site. Making sure the redirect logic doesn’t mis-fire and annoy the user more than help.
Accomplishments that we're proud of
Accountable AI Friend: A friend whose primary goal is to keep you on task. After 5 minutes of idling, our friend will check up on you to make sure you're there.
Compatibility with Chrome: This was our first time making a Chrome extension so we are proud that everything was compatible and uploaded without errors.
What we learned
UX is everything. If a productivity tool feels too serious or feels like punishment, users will abandon it. Our playful elements made a big difference.
Chrome extension development has a lot of moving parts that have to fit together: permissions, background vs content scripts, which sites the extension can access, tab management. Knowing how to structure those early saves trouble towards the end.
What's next for LockedIn
Implementing pop-ups and notifications.
Built With
- css
- digitalocean
- elevenlabs
- godaddy
- html
- javascript
- json
Log in or sign up for Devpost to join the conversation.