Inspiration

Throughout my years as a middle schooler, I found many of my friends playing games around their teachers' backs and not focusing on the given assignments. As students keep progressing through middle school, there are going to be a lot of distractions that they have to stay away from in order to be productive. I myself find it difficult to focus in class because of the virtual and in person distractions such as disturbing noises or other websites on the chromebook. This later causes me to have loads of homework and I find myself having to pull late-nighters in order to finish my work. This made me think of how I can utilize my coding skills in order to find a solution. This led me to my chrome extension, LockedIn.

What it does

LockedIn provides many features that help students focus on their assignments at school.

Features:

  • Task manager: This powerful tool allows you to organize your tasks with ease. On top of labeling your tasks, you can also set due dates and add descriptions.

  • Block sites feature: This feature allows you to control your online habits and minimize distractions. You can block access to distracting websites, social media platforms, or any online content that hinders your productivity.

  • Pomodoro Timer: This pomodoro timer was inspired by the popular management technique. It helps you break your work into manageable intervals which are 25 minutes long, followed by short breaks and long breaks.

  • Music feature: The music player allows you to play ambient noises and calm music. WIth this, you can block out distracting background noise and help you focus on your work. You can also upload your own music to the extension.

  • Reminders: When I developed this extension, I also took the user's health into consideration. This feature provides the user with reminders for tasks like staying hydrated, maintaining good posture, and refreshing your eyes.

How I built it

LockedIn was built using HTML, CSS, JS, and a manifest.json file to turn it into an extension. I used webflow for the CSS or styling of my project, but everything else like the javascript and html was written by me. In order to interact with the user's chrome browser, I used chrome APIs such as the storage and notifications APIs.

Challenges I ran into

Since this was my first time using chrome APIs or building chrome extensions in general, I faced a lot of issues while trying to work with the user's browser. Javascript is also not my 'native' coding language, so there were a lot of things I had to learn while creating the extension. Another challenge I ran into was that chrome didn't accept my extension at first because of some issues with the chrome APIs.

Accomplishments that I am proud of

I am proud that even though this is my first time coding an extension and working with google chrome's APIs, I was able to complete this project. My biggest accomplishment is that I was able to successfully deploy this extension to the chrome web store.

What I learned

This project taught me lots of useful things about web development and working with APIs. I think while making this extension, I learned lots of coding skills in Javascript and understood the overall structure of extensions.

Future Goals for LockedIn

I think LockedIn has a lot of potential for future updates and more features

  • School Device Implementation: At present, our extension is blocked for devices under the Board of Education because it is not on the whitelist. I am currently working with the Board of Education to get this extension unblocked and enabled for all students.

  • Team Management: Although this is for personal use at the moment, I plan to extend this so that teams can manage their tasks, and boost productivity by connecting different users. Soon, teachers may be able to utilize this extension to manage student devices, and track productivity.

  • Adaptive Techniques: In the future, LockedIn will be able to pull data from the google workspace to schedule your days, work periods, and breaks using AI.

Share this project:

Updates