Skip to content

A visual timer to help with your sense of how much time has passed and how much is left

Notifications You must be signed in to change notification settings

ThinkerDreamer/TimeSense-Timer

Repository files navigation

Forked from Mateusz Rybczonek's Animated Countdown Timer

UPDATE: Version 2.0.0 has been released with a new UI made in React.

I will update this README soon.

Todos:

  • Fix mobile-responsiveness for small screen sizes
  • auto clear inputs on reset and timer finish
  • auto show/hide title, inputs, and buttons while timer is running
  • re-implement pop-out button from original vanilla JS version
  • add feature to share timers
  • update README with new images

README for Version 1.0.0

timesense-timer

I created this elegant visual timer to help myself and other people like me who struggle with time blindness visualize exactly how much of the allotted time has passed and how much is remaining.

Before starting this project, I looked for Android and web apps for visual timers and couldn't find any that were attractive and exactly what I was looking for, so I created my own.

I got the code for the SVG animation from the tutorial above, but I added many of my own touches to the timer's interface, such as:

  • blinking numbers while paused
  • buttons which hide while the timer is in use
  • a pop-out button to create a mini-version of the timer

I also crafted the styling to make it responsive for all screen sizes.

About

A visual timer to help with your sense of how much time has passed and how much is left

Resources

Stars

Watchers

Forks