TimeOut

• 

  TimeOut

Inspiration

We wanted to create a chrome extension that prevents the user from spending an excessive amount of time on the internet.

What it does

TimeOut is a browser extension that helps manage screen time by providing two main features: Break timer: Reminds you to take breaks from the internet.
Activity tracker: Monitors internet usage over your last five sessions to track trends.

How we built it

For this extension, our group decided to use JavaScript and HTML/CSS. JavaScript is used for the extension's background process and the functionality of the popup. HTML and CSS is used for the design and structure of the user interface.

Challenges we ran into

In the activity manager, we had some difficulties with properly storing the data for each session. Our goal was to provide a table that showed the time spent on chrome for the last five sessions. However, our table encountered some issues from the other features in the activity manager. For example, we could not use the reset button because it would prevent the data from going into the session table. We were eventually able to resolve this issue by resolving all of the conflicts with the other features.

Accomplishments that we're proud of

None of our team members had prior experience creating a browser extension before this project, so we are proud of the results of our efforts. We are also quite proud of how the UI turned out, as we had very little front end experience before this.

What we learned

Since all of our team members were inexperienced with JavaScript, this event provided us with an opportunity to learn this skill. Furthermore, we learned many useful front-end design skills from working on the chrome extension. Finally, we all became much more comfortable with coding in a team project and collaborating on different tasks to make one unified project.

What's next for TimeOut

We are planning to tweak the functionality in order to make the browser extension more user friendly. Additionally, we would like to add website specific reminders to stay focused. For example, if a user identifies YouTube as a distraction, the extension can send them targeted reminders to stay on track whenever they visit the site.

Built With

• css
• html
• javascript