HIIT That Button

You've been selected to compete in the world's newest and most popular gameshow: HIIT That Button! Complete a HIIT workout while attempting to collet as many points as possible!

Comment 1

Inspiration

Everyone knows that exercise is crucial for your health, which is why some "exercise games" have been created to encourage physical activity. However, they don't utilize one of the most popular forms of exercise: the HIIT workout. My goal when creating HIIT That Button was to fill this gap and put a unique spin on it while I'm at it!

What it does

HIIT That Button is an online game where you pretend you're competing for fame and glory on a popular game show while improving your fitness. You can watch my video for a walkthrough!

How I made it

It may not look like much, but this is the most complicated website I've ever created. I spent ages working on the JavaScript, and this is the first time I've added artwork (if 4 different Google Drawings even count as "art").

Challenges I ran into & my solutions

It took a long time (and multiple different StackOverflow threads) for me to figure out how to create a countdown timer. For me, it was a very complicated piece of code that I created based on many different sources since most of them didn't discuss what I was looking for. I'm really not an artist, and the design alone took forever. It was really difficult to combine images with CSS properties. I'm really proud of myself for figuring out how to use local storage to prevent a page refresh from deleting your progress. I don't think it's foolproof yet, but it definitely works. Overall, I'm really proud of my website since my first time creating a website was earlier this summer in the Girls Who Code SIP.

What I learned

I learned how to use Date.getTime(), how to disable buttons or make them disappear completely, use local storage, and convert strings to integers. I also got better at adding a grid to my CSS.

What's next for HIIT That Button

I wanted to do more with the point system, but the JavaScript was a lot more complicated and time-consuming than I anticipated. In the future, though, I'd like to add a dramatic "final round" where the player can really push themself and bet some of their points on doing something like beating a personal fitness record or do one last plank. I'd also like to add an individual leader board where the player can track their previous scores, and make it possible for the player to customize their appearance and add their name.

PS- My color scheme is based on the TecHacks logo!

Built With

Share this project:

Updates