Inspiration
The inspiration behind this project was our group's desire to interlace a passion for health and fitness alongside an interest in user interface and design. In discussing ideas for this project, we found that we all had a creative side and a real interest in weightlifting. By combining these, we came to the conclusion that a website encompassing the beginner to expert side of fitness would be a perfect match for us.
What it does
The website performs as a question-result based model. The user first joins our website gainz and then is prompted with questions carefully designed to estimate the best workout/lifestyle program for their needs. We made sure to keep in mind the individual and even created a page for the user to input specific needs. Then we would have a professional trainer on our team reach out and directly communicate with them. This website makes fitness accessible and inclusive to all, no matter what circumstances or equipment they are limited to.
How we built it
We built this website using the interface design tool, Figma. We first started off by brainstorming our theme, fonts, and typography before starting our website. We used many features from Figma such as plugins as well as components in order to make the website interactive. After we designed the different screens, buttons, and icons, we started prototyping in order to make the website live.
Challenges we ran into
The first challenge we ran into was how we were going to implement the idea we envisioned for Figma. We wanted to make the website as easy to navigate as possible so we had to use straightforward elements to create this site. Another challenge we ran into was the alignment of the elements because some of them would be off center or auto-layout would not work as well as we wanted it to. Our last challenge was making sure the prototyping was accurate so we had to test it multiple times.
Accomplishments that we're proud of
After our first idea not going as planned, we came up with gainz. halfway through the hackathon and we’re proud that we have an appealing prototype. We also enjoyed learning more techniques on Figma and coming up with the content to display on our website.
What we learned
We learned how critical user interface design is for implementing an application that is appealing and motivates people to use. The challenges that we experienced taught us the importance of small details when designing and the process of working in an efficient manner as a team.
What's next for gainz.
Next, we hope to use html and css in order to make an interactive web application. We also look forward to creating a iOS app version of gainz.
Built With
- figma
- html5
Log in or sign up for Devpost to join the conversation.