Week 2 - StudyBuddy

Throughout the past few days, my team and I have been working on an open source browser extension that would enable students to improve their study habits. At first, we had trouble coming up with ideas until we realized that we all had a bad habit when it came to studying. We had trouble focusing and staying on task because we would either check our social media or do online shopping. From there, we brainstormed features for StudyBuddy:

An extension that “helps you not fail by blocking access to sites that distract you from studying.”

Our professor suggested the name “studyguard”, which encapsulates the purpose of our extension. But we also didn’t want our users to be turned off by the name, as it sounds like an anti-virus instead of a friendly buddy that keeps you on task.

StudyBuddy would go on to feature a handful of sites to choose from: facebook, instagram, twitter, reddit, amazon. We also wanted to incorporate an input field that allowed users to type in their own blocked site. The important feature of all is the time field. Instead of having users disable/enable the browser extension, we decided to have them input a designated ‘end’ study time. The extension would remain active-blocking distracting websites-until the specified time is reached.

This is my first time collaborating with a team on a technical project. We all have different skills and for all of us, it’s a learning experience. One of my team members, Anthony Z., has a great depth of JavaScript knowledge and implemented the logic behind connecting the browser to our extension. I, on the other hand, implemented the pop-up user interface using HTML/CSS and a little bit of JavaScript. Knowing that we had to get information from the user, I thought it’d be best to extract the information using an HTML form. Once the user provides the values the extension needs to function (e.g. checked off suggested sites, added a new site, time), we’d use more JavaScript to extract the values and handle them as needed.

Currently, our browser extension is not fully functional. The user interface is visible, but unfortunately, the backend code that handles the browser-user interaction/”blocking” is not working. We hope that we’re able to debug and figure out the issue, which I believe we’ll have resolved before the due date. I am also in the process of incorporating a form validation that prevents users from submitting non-url inputs and empty times.

Although I’ve worked on extensions before, this is my first time creating one with a user interface. One of the first extensions I’ve built was a simple script that automated shopping for sneakers. Now that I know extension UI can be created using HTML/CSS, I am looking forward to improving the extensions I’ve made previously.

Written before or on February 10, 2020