Main Image (It changes when you click on the thumbnails)
ALl buttons of the Productivity Bar Gif of the progress bar Gif of the timer bar Gif of the session timer bar Gif of the money every 15 minutes Settings of the session timer Night mode of the session timer
Classic Productivity Bar
Track your progress, and compare it to a simple timer.

TLDR:

I built a program that displays a progress bar on the top of your monitor so that you can visualize how much time you have left for a task vs. how much progress you've made on that task. It's like an hourglass but better.


Productivity Bar

This program has 2 modes: a timer mode and a progress bar mode.

Timer Mode: Start, Stop and Reset a timer that progress from the left to the right of your screen.

Progress Bar Mode: Add and subtract progress towards a goal. For example, completing 3/6 peer reviews.

There is a button that lets you switch the large bar between the 2 modes. As well as a button to open the session timer.

Fun fact: I didn't know how to make the design responsive, so it is fixed at 4k resolution. I believe its 3840x180.


Session Timer

Hidden inside of the progress bar is a session timer. This is just a simple timer that I used to track how long I have been working, and the percent of productive time for the session. I also modified it to display how much money I was making per hour.

This is the first project that I added a night mode to. It also has a little settings menu that allows you to change the $/hr, night mode, and enabled or disabled productivity percent.

As well as a little Money gif and sound effect that plays every 15 minutes or $5.