6

I've been working on a fitness journal app and have been trying to come up with a design to show your sets in a summary view.

summary screenshot

The sets are displayed in chronological order. A super set is when you alternate between 2 or more exercises. In this case, 1 set for triceps followed by a set for biceps and repeat. The best solution I was able to come up with is what you see. If you press on the slightly opaque exercise name, it switches and highlight that exercise and it's sets.

However I feel like this seems cluttered and disorganized.

I'm not really sure what to even search for to get some inspiration. Looking up alternating lists and such didn't seem to help.

Does anyone have any suggestions to point me in the right direction for how I should go about this?

Just FYI I'm not a designer, I'm a developer so please excuse the rough design

Improve this question

3 Answers 3

Reset to default
3

I would use your lines on the left to display grouping. Right now it seems like it's only merely helping to display chronological order and the order the items are listed (in addition to the time) naturally does that, so it isn't adding much value.

enter image description here

In this image, you can see I've used your line to actually group one item and also the superset item. I've also labeled them as being a super set.

Research

One question to ask yourself (or better yet, your user) is how knowledgable are they with fitness? Do they understand the concept of a superset or do you need to explain it? Do they understand which body part they are working out in each of these movements or do you need to call it out (like you are doing in your comp). It may be better to have these individual items be selectable so if the user is unsure what they are working in a seated calf raise, they can learn more depending on your users knowledge level.

Additional Feedback

I am unsure what you are trying to convey in the items above your listed reps. Listing the max amount of weight lifted for "biceps" is going to completely change based on the bicep movement. When you look at larger muscle groups such as quads, someone will be able to perform 3x the amount in a leg press than a squat and summarizing a max weight via a large muscle group can be very misleading. This space may be better used to call our PRs, time spent on muscle groups (and what groups they should work on next), and other actionable insights.

Best of luck!

Improve this answer
0
1

I'm wondering if you could try being specific.

Instead of 'superset' (or in addition to), you could trying saying what they actually do, which is alternate the exercise.

You also have a lot of repetitive elements overall. The mental model most of us have for weight training is:

Weight (times) Reps

Instead of listing those 2 elements (plus bullet points on each line), try using table headers, and test with users if they can grasp the information as quickly (one disadvantage might be scrolling, if the table headers are temporarily out of the viewport).

Expressing the alternating sequence

v1: try a label system them separate from the exercise names

v2: another thought is to condense each exercise to take the first letters of each word and build a shorthand element you can alternate:

enter image description here Some caveats: The key needs to unique, in that you would need to make sure any 2 exercises do not share the same one or two first letters, but there might be a way here to indicate the alternating between the two exercises.

Improve this answer
3
  • 2
    Maybe even throwing in color-coordinated rows in addition to the RP/SC naming scheme, so you can tell at a glance that the light-red backgrounds were my biceps, light-green were tris, gold were pull ups etc.
    – Robin
    Oct 21, 2022 at 14:23
  • Thanks Mike, you've given me some great ideas to work with. I like both your ideas but the key is probably more practical since users can create their own exercise which could lead to the shorthand being the same for 2 exercises. I notice that most of the answers mentioned the repetitiveness of 'lbs' and 'reps'. I was debating using headers as well but from a design perspective I thought the repetition made it look more aesthetic or is that just me?
    – jdlk07
    Oct 22, 2022 at 10:03
  • @jdlk07 my general direction is to try to remove as many elements as possible, which is why i was inclined towards the table. That and there's only 2 elements: Weight and reps. There's usually some more aesthetic ways of using the repetition, but that's not my emphasis at the moment.
    – Mike M
    Oct 22, 2022 at 17:11
0

Gym Dashboard

These types of designs are called Dashboards, specifically, the one referred to in the question, Gym Dashboard, Fitness Dashboard or Training Dashboard. If what you need are design alternatives, you can find several solutions in Dribbble where you will find quite resolved application interfaces

enter image description here

Regarding the attached image, I would think about:

  • Accompany relevant texts with icons: weight, exercise, repetitions
  • Replace repeated texts with a single one, for example, the reps column should not have the word rep in each case
  • Bulleted lists are fine for text, but they are unclear on screen graphics, I would replace them with frames or graphics
Improve this answer
1
  • 2
    The question asker's question specifically asks about how to display super sets and I don't feel like your answer does that. I'd suggest editing and adding that in.
    – Piper
    Oct 20, 2022 at 19:47

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.