FITTED
A UI Design Case Study
Fitted is a fitness-responsive app that motivates people into an exercise routine that suits their level, schedule, and interests.
Challenge
A young professional who feels overwhelmed about busy work and social life needs to get in shape but faces a lack of motivation and tools to keep exercising enjoyable.
My Role
UI/UX Designer
Tools
Sketch, Invision, Figma, Balsamiq, Adobe Photoshop, Adobe Illustrator, Adobe InDesign, Principle
Meet Rebecca, Fitted’s User Persona
The goal for this project was to create polished and consistent screens based on existing user research and an existing user persona provided by CareerFoundry.
Low Fidelity and Mid Fidelity Wireframes
Low-Fidelity Wireframes
From the information from the user persona, low fidelity wireframes were drawn up. This is the way I iterate through many design options quickly.
Mid-Fidelity Wireframes
Translating the sketches into digital wireframes allowed me to check the effectiveness of the design and the approach I was using. I was able to keep the structure of the app without losing too much time on details.
Inspiration
After creating several mood boards, this one was chosen. It sets an inviting and encouraging atmosphere for the users. It fulfilled much of the objectives for the persona to ease her into working out without overwhelming her to build good routines and habits as she becomes a regular user of the app. The color scheme also does a good job of supporting this objective as it is both welcoming and promoting productivity to keep users engaged while interacting with the app.
Original Fitted Logo
Since the description given for FITTED described it as an app that puts equal importance in fitness and scheduling, I created a logo that would make users think of health with the heart and a schedule with a calendar. From feedback from my mentor, the logo was too busy so edits had to be done.
Fitted Logo
The dumbbell was chosen because it’s a universal icon for fitness. The one dumbbell is also readable as an icon and in the name.
Final Design
The objective of the interface was to keep the app welcoming, informative and fun. This was accomplished through colors that evoke happiness, energy, yet calmness. The wording and images chosen were all bright and featured people that were not intense or too muscular.
Takeaways
Moving forward, I would take into consideration how the design translates onto different devices. This project was designed for a mobile app that users can view and use anywhere. If a user was at home doing the exercises, streaming the workout video on the TV may be a better choice because the display is larger.
If those designs were to be made, I could do another round of usability testing to see if the designs are cohesive and if the designs on a larger scale is as efficient as it is on a mobile device.