Inspiration
We wanted to make something that could create a blueprint to help people who do not know where to start with working out. A lot of workout apps are confusing or ask for money, so we decided to make a simple website that gives users a workout plan based on their choices. We also wanted to make it feel interactive and easy to use.
What it does
WorkPrint is a workout designer website that helps users find a workout routine that matches their situation. When the user enters the website, they click to continue and answer questions like whether they work out at home or at the gym. As they answer more questions, the website creates a workout plan that fits their choices. The website also has back and reset buttons so users can change their answers at any time.
Here's a presentation explaining the features: https://docs.google.com/presentation/d/110a2zFkhp6ZMMk7C3gVeGGs9jyE5lodnyU1yRxEoeoQ/edit?usp=sharing
Here's the final project: https://tanish512.github.io/WorkPrint.github.io/
Here's the repository: https://github.com/tanish512/WorkPrint.github.io
How we built it
We built WorkPrint using HTML, CSS, and JavaScript. HTML was used to create the structure of the website, CSS was used to design the website and make it look clean, and JavaScript was used to control the quiz flow and generate workout plans based on the user’s answers. We used GitHub Pages to host the website for free.
Challenges we ran into
One challenge was making the screens switch correctly when the user clicked buttons. Another problem was connecting the CSS file because the styles were not showing up at first. We also had to figure out how to organize the workout choices so the website could give the correct workout plan based on the answers.
Accomplishments that we're proud of
We are proud that we created a working interactive website in a short amount of time. We are also proud that the website feels smooth and easy to use instead of just being a normal form. Another accomplishment was making the quiz system work with different workout paths.
What we learned
We learned how HTML, CSS, and JavaScript work together to create a real website. We also learned more about organizing code, creating user-friendly layouts, and using logic in JavaScript to create different results from user choices. We also learned how to publish a website using GitHub Pages.
What's next for WorkPrint
In the future, we want to add more workout plans and make the website more personalized. We also want to add features like workout timers, progress tracking, and animations to make the app feel even more professional. Another idea is adding accounts so users can save their workout plans.
Log in or sign up for Devpost to join the conversation.