Fitness mobile app
UI/UX Design case study
Duration: 2 months
Project overview
Introduction
Product
Fitness App is a mobile app made for fitness and workout routines that aids users in selecting the best training regimen for their requirements, preferences, and limitations. Users may search for and reserve an appropriate variety of workout plans or online trainer. Also, users may monitor their progress, set reminders, and design exercises that are specifically suited to their objectives.
Problem
Many individuals want to lead healthy lives, but they face obstacles including time constraints and restricted access to fitness facilities or personal trainers. As a result, many people find it difficult. Without the direct supervision of a personal trainer, users may find it difficult to follow complicated training routines or lack desire and responsibility, which might be harmful to their health.
Goal
Introducing a mobile application designed for fitness and workout routines that aids users in selecting the best training regimen for their requirements, preferences, and limitations. Users may search for and reserve an appropriate variety of workout plans or online trainer. Also, users may monitor their progress, set reminders, and design exercises that are specifically suited to their objectives.
Project overview
Introduction
My role
The app's UI/UX designer. User research, planning, usability testing, prototypes, visual design, and branding from inception to completion.
Responsibilities
Conducting interviews, paper and digital wireframing, low and high-fidelity prototyping, conducting usability studies, accounting for accessibility, iterating on designs, determining information architecture, and responsive design.
User research
Project summary
The fitness application should offer customized training options that prioritize to simplicity, motivation, and accessibility, according to user research. Customers want to be able to quickly access their health metrics by measures as active calories and step count, which show their desire to track their progress, according to statistical information.
Additionally, customers want to be able to set up appointments, communicate with online trainers, and also get reminders and guided training programs.
Pain points
First impact
1
Navigation
Not having enough time to organize and prepare healthy meals.
2
Guidance
Lack of motivation and accountability without direct guidance from a personal trainer.
3
Accessibility
Difficulty in finding a reliable and effective fitness mobile application.
User Personas
Persona 1
As a busy personal trainer, Amy needs a solution that is simple to use and convenient for her schedule. To assist her in achieving her objectives, Amy is looking for a comprehensive fitness app that offers a selection of workout schedules and offers real-time data and insights.
User Personas
Persona 2
David is a busy traveler. He wants an app that offers a variety of workout plans and tracks his progress. David needs motivation and accountability to help him stay on track with his fitness goals while juggling a hectic travel schedule. He is looking for a reliable and effective fitness app that can help him lead a healthy life, no matter where he is.
Ideation
Paper wireframes
To begin the design process, I utilized the popular Crazy Eights brainstorming exercise to sketch out my ideas. To streamline the user experience, I assigned priority access to several categories on the home screen. This was done with the aim of saving users' time.
Ideation
User flow
At the initial stage, I developed user flows to map out key interactions within the product. This helped define where and when the subscription offer should appear, ensuring it integrates seamlessly into the user journey without disrupting the experience.
Ideation
Digital wireframes
After sketching wireframes, I decided to create a training information screen. It displays essential details like session duration, calories burned, the user's progress level if the training was interrupted early, focus area, reviews/comments, and guides for personalized preferences such as music selection.
Prototype
Low-Fidelity Prototype
I created a simple prototype that allowed users access to their daily data, enabled them choose workouts or trainers, and let them schedule a workout session for a specific date and time.
Iteration
Mockups
Following usability testing, I made design modifications based on the results. The home screen required minimal iterations, including text size in the blocks and a 5px padding for improved layout structure. Additionally, icons and daily activity page were refined.
Iteration
Mockups
Moreover, the training screen underwent iterations, enabling users to view all exercises within the training session for better tracking and progress monitoring.
UI Kit
Typeface
UI Kit
Color & Icons
UI Kit
Components
Prototype
High-Fidelity Prototype
The high-fidelity prototype followed the same user flow as the low-fidelity prototype, including design changes made after the usability study.