TickFit
Building a website for customized workouts with variety of fitness timers




Context
Personal workouts usually consist of specific timing intervals that users have the ability to customize themselves. This website allows users to select from a variety of timers and organize their own workout queue to be able to follow along, see a progress bar on the whole workout and individual timers, as well as share their personal workouts with friends and see history of completed workouts.
Task
Create a website for personal customized workouts created from 4 different types of timers: Countdown, Stopwatch, XY (X time per Y repetitions) and Tabata (work intervals and rest intervals per X repetitions).
Development
The website was developed with React framework in JS, HTML and CSS.
Final Features
-
Creating stacked customized workouts with 4 different timer types
-
Ability to name personal workouts
-
Editing individual timers
-
Forwarding timers in workout queue
-
Persisting state for reloading pages
-
Workout configuration and progress stored locally for each user
-
-
Timer configuration stored in URL
-
Allows sending custom workouts to others ​
-
-
Total time displayed and progress bar​​
-
Ability to add description to every timer
-
Personal workout history
Iterations
Version 1: four separate timers​

Version 2: timers organized in a queue​

Version 3: timers organized as a workout
