Project Brief​​​​​​​
Fitted is a responsive web app to add some form of exercise to your routine, regardless of experience or ability. The app is a simple and fun way for the individual to learn new practices and create a schedule to find the proper routine. 

Project Timeline : January 2022 - April 2022
Role : UI/UX Designer
Project created based on fitness app brief from Career Foundry.
Tools Used : Figma / Adobe XD / Keynote / Google Fonts / Font Awesome / Icons8 / Pen and Paper
The Problem​​​​​​​
Finding exercise routines can be difficult no matter the experience you may have, especially when looking for something new. Finding the time to fit those exercises into your already busy schedule is just as tough.
The Goal​​​​​​​
Since the Fitted App is a responsive design, it will encourage people to find it easy to do a routine no matter where they are located and have the ability to do a workout in as little as 5 minutes.
User Flow Diagrams
Wireframes
Low Fidelity
I created these wireframes using sticky notes, which I find helpful in the responsive design process. It keeps me focused on the essential information needed for each page.
Wireframes

Mid Fidelity

Mid-Fidelity can be tricky, as it is easy to get carried away with your designs too quickly. I needed to take a step back and focus on the essential UX functions of the process to allow my UI work to be more flexible.
Mood Board

I wanted to create a simple, fun mood for the fitness app and represent strength
Style Guide
This style guide contains the essential components used when building the app in Figma.
Wireframes

High Fidelity

The high-fidelity wireframes represent all the hard work up to this point reflected in the designs below.
Animation & Gestures
Below are some examples of some basic gestures and animations that were involved in building the app into a prototype.
Responsive Design
This project began as a mobile-first design. Below are some examples of responsive design used on tablets or desktops.
Prototype
Below you will find the link to my application prototype in Figma. Hope you enjoy it, and if you have any questions or feedback they are always welcome!
Conclusion
     I really enjoyed diving further into the UI side of the design for this project. As with any project, there will always be challenges along the way, and making the appropriate adjustments will only help build a stronger design. I learned to work with new design tools for this project and gathered a ton of great assets and shortcuts to make my work more efficient and of better quality. I chose the fitness app design because I strongly believe exercise is a critical aspect of our lives that we all need. The opportunity to help others get healthy and feel great about themselves was what drew me to work on this project.

You may also like

Back to Top