Timeline
4 months
Role
UI/UX, Art Direction, Interaction Design, Visual Design, Motion Design, Branding
Tools
Sketch, Principle, After Effects
Challenge
How might we create an app that will offer an easy way to track your workouts on the go while not overloading the user with extra features?
Goal
Build a workout tracking app focused on keeping track of your bodybuilding progress.
01
Understand
Problem Definition
Two main issues were identified:
Frustrating experience with lack of focus – most fitness apps throw everything at you, starting with how to perform exercises, then push you to buy workout plans or subscription and then randomly talk about nutrition and diet. All that while not doing a good job at neither.
Not possible to track your workout – workout tracking is either non existent or pretty limited.
Discovery
I started with market research, went through many related articles and then through competitor analysis to learn more about the existing solutions.
Then, interviewed a few fellow gym-goers. That helped me to make several important realizations.
Workout records - people who track their workouts usually do it via paper notebooks or notes app on the phone
No app for tracking - some people don’t track their workouts because they didn’t find any easy enough app to do so
Confusing exercise names - people are usually frustrated with certain exercise names, and would love some guidance.
02
Ideate
To define the structure of the app I started with Information Architecture map and then proceeded with Task Flows creation, covering key features.
Then, continued to Wireframes stage.
03
Visual Design
I started with gathering references of similar and related apps. After that, I created the mood board to start shaping the feel and look of the app.
Branding
After some sketching and exploring I came up with a simple logo idea: barbell and first letter of the name combine into one simple and unique shape.
Colors
Calm and at the same time fresh and elegant color palette with some rare accents of bright secondary colors were set for the project following the mood board.
Typography
Rubik was chosen as the primary font due to its rounded friendly shapes. Questrial is accompanying font, it is monospaced and used mostly for numbers because of its tabular figures to achieve maximum legibility and order.
04
Onboarding
Simple questions to get to know the user better and then give better suggestions and personalize the experience.
Dashboard
Dashboard gathers the most relevant data in one place. Here you can quickly check basic stats (workouts completed, tonnage lifted, current weight), navigation, profile, previous workouts performed, and start your next one.
Create Workout
The design challenge here is the multi-selection – on mobile it is pretty tricky.
With the split screen solution, I let the users browse the whole exercise library, select exercises, have the ability to check details of each exercise while being able to see at all times what they have already selected, easily remove exercises – all that without remembering and going back and forth between different screens.
Exercise Details
Allows users to learn more about the exercise, watch instructional video and see which muscles are involved.
Add Sets & more
Rearrange exercises, duplicate if needed, add sets, combine them into supersets, define weights and repetitions for each exercise.
Workout Tracking
All exercises are represented as cards in one list to provide easy access to them without extra taps. Exercises are prefilled with the info for a number of sets, weights, and reps based on previous results or set during the workout creation.
Previous Workout Results
Quickly check previous result of the specific exercise without trying to remember and without going back and forth between screens trying to find this statistic – the access is right at your fingertips when you need it.
Statistics
Dedicated place to check one’s progress, both global and exercise specific.
05
Results
The project was launched and received good initial feedback with lots of good insights for further improvements.
Unfortunately due to internal friction & lack of funding we parted ways with the Dev and the app ended up abandoned. It can still be found in App Store (under different name).
I prepared a UI Kit for sale out of it, and a case study for my online portfolio. It got huge success online at design communities such as Behance and Dribbble (over 600,000 total views), was featured in a lot of digital design related portals (Muzli, Uplabs, Product Disrupt, Smashing Magazine), and at least 5 apps that I found on App Store were using same solutions clearly inspired by this work.
