1

In a turn based game I'm building you manage a few resources, two of which are related.

  1. Speed: a frequently changing value that you consume over the course of a turn as you act.
  2. Endurance: a rarely changing (but it does change) value that indicates how much Speed you will regain at the start of the next turn.

I'd like to indicate both with progress/health bars (or some other similar UI) so their values are glanceable. I'd also like to clearly indicate the relationship between them: Endurance indicates how much Speed you'll regain next turn.

Here's what I have so far (next to the only other progress bar here for context). What I tried was to have the related bars touching, and to have the Endurance bar have a width that shows it's proportion to the Speed bar. I don't think this communicates it clearly though, it's not obvious why the Endurance bar is shorter.

enter image description here

Can the alignment be adjusted to make this relationship clearer? Can making them share the same bar somehow make it more clear without losing track of Endurance as it's own separate resource? Are progress bars in general just not the right solution here?

Improve this question
2
  • Can you also describe the mechanics of the game? If it is a real-time compared to a turn-based game, I think you might have to come up with different designs to cater to the game play to make it more obvious to the players.
    – Michael Lai ♦
    Jul 26, 2020 at 0:30
  • It's turn based. The main mechanic that is relevant here is that Speed determines how much you can do in a turn, so managing it is important. All actions deduct differing amounts of Speed when you do them. The next turn, you regain an amount of Speed equal to your Endurance. Depending on your stats, that may be less than your maximum speed. For example, with 4 Speed and 3 Endurance, I may want to save 1 Speed this turn so that it will be full next turn, or spend it all knowing I'll only have 3 next turn. You have to manage this across multiple characters.
    – Kris
    Jul 26, 2020 at 5:17

1 Answer 1

Reset to default
1

There are a number of different types of information you are trying to represent/present to the user, and the key is to create a consistent and coherent set of visual signals so you can convey the key information correctly and clearly.

From what I can see, these are the key elements:

  • Current available speed (that can be used)
  • Maximum speed point available (that can be accumulated)
  • Current available endurance (that can be added next turn)
  • Maximum speed point available next turn (once endurance is added to speed)

So I suggest the following changes:

  • Combine endurance with the speed bar since its value is only added to the speed bar (and it is also confusing for the user to have to do the calculation themselves
  • Change the labeling for Endurance (+ ) so that the user knows it is something added to speed
  • Create visual styling to show the connection (e.g. using same type of colour but different shade) between current and future speed points

enter image description here

I think each of these examples show how the design indicates both current and future speed points as you progress through your turn quite clearly, and can be applied to any other attributes that work in a similar manner.

Improve this answer
2
  • This is very good, I'll probably end up doing something similar. I think I originally avoided this because I was focused on Endurance also being a resource, hence the second bar. Combining into a single bar like this seems much more effective. Plus Endurance changes infrequently enough that little information is lost by dining this.
    – Kris
    Jul 27, 2020 at 3:04
  • @Kris To me speed definitely seemed more like a resource while endurance is an attribute. But to me in seems a little bit misleading because most games I have seen use 'stamina' as the resource for actions whereas speed determines the order in which characters can perform actions. Another thing to note is that if you change the design then you might have to also consider the other attributes like Entanglement (which may behave in a similar way or not).
    – Michael Lai ♦
    Jul 27, 2020 at 6:29

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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