Bay Yong Khiong
Web Designer, Programmer
Project
Summary
Exercise
Tracker
This is a school project where I was tasked to design a simple fitness website for gym rats. The full details can be found
Exercise Tracker is a website that allows users to track their exercise regime. The web app allows users to complete their tasks and advance to the next fitness level. It uses javascript libraries for animations, html, css, bootstrap, and a bit of jQuery.
Software used:
Visual Studio Code
My thought process:
To start doing this project, I researched a few fitness websites to see how the professionals have done their websites. However, most I came across are subscription services, and not a web app that helps you keep track of your exercise regime. So it was a waste of time. However I did found a design that I like. Which is good.
After that, I coded everything from scratch, using my knowledge of html, css stylesheets and flexbox. The nav bar uses flexbox but since the assignment only want 1 page, I was not able to hide the nav bar when I scroll down to other pages. It was horrible experience to try and figure out myself on how to hide the nav bar when I am on other pages for fullpage.js. For the cards I used bootstrap as usual.
Year
2023
Color Scheme
Yellow, White, Orange, Tints of neon orange.
Principle of Design
Contrast and Balance
High Fidelity wireframe:
