MODORA

MODORA is a Chrome Extension that blocks distracting sites according to the Pomodoro Technique which is proven to increase productivity while preventing overworking and encouraging breaks.

Comment 1

Inspiration

For this hackathon, we wanted to make something that would be useful on a daily basis. I (Chelsea) always find myself complaining that I get nothing done because I procrastinate too much by going on Discord or on YouTube. Additionally, a popular productivity technique called the “Pomodoro Technique” which is proven to be pretty effective has been going around. So we came up with MODORA, which is perfect when we have to get something done. MODORA is a combination of a “website blocker” and a Pomodoro Timer.

Pitch + Downloading and Usage Instructions

MODORA - LyonHacks2021 [Pitch]

What it does

  • blocks/alerts distracting sites (which can chosen/added/deleted by the user)
  • blocks according to the Pomodoro Technique
    • 25 minutes: study/work, websites are blocked
    • 5 minutes: break, websites are unblocked; reminds the user to take a break (overworking is unhealthy)
    • the above is supposed to repeat for every task with a longer break after every four tasks. [However, given that we only had 2 days and half of the members weren’t really familiar with the programming language that we used, we made it so the user’s sessions are always 4 tasks long. Don’t fear though, we have an abort button to abort anytime (or if you only have 3 or less tasks).]
  • has a todo list where you can put all your to-do’s in one place
  • uses cookies to store information between runs

How we built it

  • all the front-end script was written in HTML and CSS, while the back-end logic was written in Javascript
  • Replit was our main IDE used to collaborate together
  • GitHub was used for version control
  • Google Fonts was used for custom fonts

Challenges we ran into

cookies:

  • took lots of researching to find a way to store and retrieve cookies :D

blocking sites:

  • pop-ups were difficult to control
  • even to the extent that the pop-ups disabled any clicking on chrome for one of the tests 🤡

formatting:

  • finding correct functions for formatting took a lot of looking at the CSS documentation
  • sometimes the CSS didn’t want to format the way we wanted, so that was a challenge

Accomplishments that we're proud of

  • Figuring out how to block certain websites with alerts
  • Figuring out how to use cookies in the extension.
  • Creating the to-do list
  • How the design and user interaction pages look

What we learned

Chelsea:

  • From this hackathon, I learned more about HTML and CSS, and became (sort of) more familiar with using GitHub.

Max:

  • I’ve never learned HTML, CSS or JS before, so this was my first time learning scripting languages and collaborating on a hackathon

Samuel:

  • I was able to learn (only a bit) how to code in Javascript, and HTML in a short time span while also working on the project

Aaron:

  • I learned a great deal on chrome extensions, Javascript “alerts”, and how to manage cookies (very annoying). This was also my first time using lists and forms in HTML.

What's next for MODORA

“be productive”

  • allow the user to change the duration of the work period, break time, as well as how many cycles
  • fix timer glitches (“undefined” glitch, reopening lags during ongoing session)
  • improve the website blocking (so that it actually blocks and not just sends an alert)

“todo”

  • error trap empty inputs from “to-do”
  • prints the to-do’s on separate lines

“manage websites”

  • prints only the host of the input (gets rid of everything after ‘.com/’
  • prevent it from displaying duplicates

Built With

Share this project:

Updates