Bodybuilding App UI UXCase Study


Improving your body must have been one of your New Years resolutions. Our body is our most important asset and tool, and being in a good shape should be one of the primary priorities. And since every aspect of life is slowly but surely going to apps, this aspect isn’t the exception. Being just a tap away from your coach and a meal/workout plan is so amazing. What a time to be alive!

Let’s design!

Before rolling into design software, we need to determine the whole process that we are going to follow. You should have more or less the same system approaching every new project, that will give you the best results most of the times. Mine looks like this:

  1. Inspiration (Moodboards)
  2. Designing
  3. Testing and Polishing


Research for me means getting as much relevant information as possible. It involved talking with the client about his clients, to get the know the average user. A key to a good UX is knowing the user. You can’t make a small car for the F1 and a formula for agriculture. You need to know who is the user.

Inspiration (Moodboards)

This may be the most important step for every project I do. I learn a lot from it every single time and find amazing solutions other designers have pulled off. My main source is Dribbble, but I like to check out Medium and Behance as well. These 3 combined work like a charm.

VShred’s website.


Here goes the fun part. Using every information we gained to complete something unique. I’m obsessed with good UX, every time I work I want a user to feel it is familiar and easy to navigate. You will judge if I succeeded.

Onboarding and Home Screen

Onboarding are used to gain information about user — his or her gender, age, height, weight, activity and goal. After registering and picking 15 day trial, here goes the homescreen.


Although important for the user and the admin, calendar was a challenge that I’m the most proud of solving. One of the nicest UI’s that I made. Calendar needs to show this months calendar and day by day if it is a training day or the rest or cheat day. Admin imputs these to each user with his admin version, and apart from just information what it is, we need to show couple of information about the day — for example is it a leg day, or a chest one. Let’s see what I did.

Training and Diet

A true core of the app. Essential for user experience, being able to see the training (workout, reps, sets and how it is done) and diet (today's meals, calories, ingredients and the recipe). Not many personal trainers have this kind of stuff, especially here in Serbia. I’m glad that I packed everything that is essential for the user just 2 taps away.


is just static blog like page with couple of stock photos and text about the rest and how important it is (for body surely, but for this case study not much). So, let’s move to complex stuff — calculators!


Basic math calculator was invented all the way back in 1642. but how does it correlate with bodybuilding app? Of course, it is not normal math calculator, rather calorie and and water needs calculator. Now it makes sense more sense, tho. We wanted to have them linked to onboarding screen information by default and to be easy to input them and get quick results. Client gave me special accolades for this one.

Calculators tile is located under rest tab on home screen


Tracking the progress is a must when working with clients, and therefore was very important for the project. We needed to track it by water consumption, notes, pictures and of course weight. I came up with an idea to have charts that will show water and weight over the time, which worked like an interesting solution.

Below the plus button is option to calculate how much water do you need which opens calculators

User testing

When I do user testing, I mostly care about how they feel when they use my apps, and how effectively they complete the tasks I demand from them. I ran the testing on my college and former highschool friends, because the app was mostly build for these types of users. The feedback was very positive, with 94% of successful completing of tasks and after minor changes and polishments, this is the final result.


That was about it, ladies and gentlemen. Chat is just a normal chat which is not user to user, but user to admin, to get in touch with the trainer, and profile is standard profile that almost every app needs to have. Special thanks to my friend and client for this fun opportunity. App will be available on the Playstore in May 2021.


If you liked this case study, please leave a comment. I would love to hear your opinions and critics. If you want to collaborate, feel free to email me on

UI UX Designer and Owner of Nauči Dizajn online learning platform.