Parago | Devpost

Timer
Enter what task you accomplished in the 25 minute interval
Parago shown on a webpage
Data visualization of how the user spends their time

Derived from the Greek word for productivity, Parago is a Chrome extension that keeps you on track. Based on the Pomodoro technique, a timer counts down 25 minutes for work and then 5 minutes for a break. Then, you're asked to input the one main task you completed during the 25 minute block of time. At the end of the day, you can switch over to the Visualizer tab to see how you spent your day, whether you were studying your math homework or surfing the web.

Inspiration

In a remote school or work from home setting, it's too easy to spend the entire day in front of your computer and not get anything done. Our friends, peers, and parents constantly complain about how time slips away with no productive result. Parago takes on this problem in two different ways: by increasing your focus using the Pomodoro Technique and your accountability by allowing you to see how you spent your time.

How we built it

We built this Chrome Extension using vanilla Javascript, HTML, and CSS. We used the D3.js library for the data visualizations.

Challenges we ran into

Every minor bug takes so long to correct, especially when you've been staring at the same code for a long time and can't see the simple fix!

Accomplishments that we're proud of

We didn't have much experience with Javascript, HTML, or CSS, so we're proud of how we managed to pull everything together! This was also our first time developing a Chrome Extension and are very happy with the result.

What we learned

We learned a lot about developing Chrome Extensions. We also learned how to use the D3.js library for data visualization and the Bootstrap framework for our design.

What's next for Parago

We would like to add more customizability; for example, so that you can change the length of the timer or the way the data is displayed. We think it would be really cool to use a Natural Language Processing API on the 'task' that the user enters, so that even if the user enters slightly different tasks (e.g., studying math vs. studying science), Parago can intelligently group those together in the data visualization chart. Finally, we would love to get Parago on the Chrome Webstore so that our friends and family can start using it!

Built With

Submitted to

Hack the North 2020++

Created by

I worked mostly on the Javascript backend implementation, creating the multi-tab toggle feature, the data visualization, and saving and retrieving data from the user input.

Natalie Volk
I worked both front end and backend, and used mainly Javascript, HTML and CSS to help create the project.

Aayaan Naqvi
Worked on backend logistics and the frontend of the first tab and with Javascript, HTML, and CSS.

Yaser Nossibeh
I worked on the backend and frontend. Along with Natalie, I used JavaScript to implement the "toggle" feature between the timer and visualization pages, create a pie chart, and communicate data between the user input and visualization page.

Kailin Chu