Let's Talk Buff and Debuff Visual Indicators

We’ve been working on creating visual indicators for buffs and debuffs.

 
Desires for such a system can be conflicting. They include;

  • Providing needed information (stack count, duration, etc).
  • Ensuring clarity - which are buffs? Which are debuffs?
  • Preserving screen real estate - we don’t want a list of buffs and debuffs to impair your ability to see and react to what is happening on the screen.
     

Three stacks of this buff have just been applied.

 
Our approach to balancing these concerns includes;

  • Having a retreating outline (green for buffs, red for debuffs) represent the remaining duration. A buff or debuff will begin with the outline completely encasing the icon. When half of the duration has expired, the outline will only be on the right side of the icon. For stack count we will display a small number in the bottom-right corner.
  • Representing buffs with circular icons, while using hexagon-shaped icons for debuffs. Additionally, buffs will be shown on the left while debuffs are located on the right.
  • Keeping the icons small, and positioning them above the action bar between the health and mana globes. This is to minimize the amount of the screen taken up by the UI.

 

Multiple shapes are used to differentiate between buffs and debuffs.

12 Likes

This is huge QoL that a lot of people wanted, will be a great addition to the game ! :slight_smile:

3 Likes

Very nicely done.

1 Like

Would be terrific to be able to see buffs/debuffs on enemies and minions as well, if only just the one under the cursor. Not sure where to put the icons, over the creature’s health bar?
Or make a small panel just for selected creature, akin to party members.
Also, it will be really hard to keep cursor over a creature, because minions tend to roam and enemies are often pushed around. So i’d like a sticky selection on a right click.

1 Like

Will the statuses have tooltips?

Also what happens when you have more statuses applied to you then you have room on a single line? Does it wrap up another line, or do they start getting cut off?

1 Like

Love the combination of colors and shapes to differentiate buffs from debuffs. Will make it really easy to see at a glance.

This is such a great addition, can’t tell you how many times I’ve wanted to know buff/debuff statuses.
I really dig the circle and hexagon differences, that will be a quick way to discern the two.

What options will be available to customize these? Size, colorblind options, etc?

Nice.
Looking for inspiration at other games:

What i really like in D3 is how it includes 2 indicaters in the skill icon. (cooldown in the form of the icon slowly changing tint, remaining uptime with a little bar on top) I hope you will do something similar so that all the info about your skills can be seen right there on the icon.

What i really dislike is icons that change position in the bar of active icons. This is the case with D3 and i think every other RPG i played. If you can do better on this front, that would be totally awesome !

Hey there, great news you guys are tackling this ! I think it looks fantastic so far, at the possible exception of this point :

Additionally, buffs will be shown on the left while debuffs are located on the right.

Now the problem with this is splitting the player’s eyes left and right, forcing players to watch more/different things. It’s a problem which is happening in Path of Exile right now where some (very vocal) streamers and a part of the community are complaining to GGG about buff/debuff visibility and asking for either a grouping up or even better, the ability to move them around a will to suit everyone’s preferences. The “problem” being having to watch the screen for ennemy abilities + buff/debfuf timers + life/mana orbs, which is both very hard to do all at once + very tiring for the eyes.

What would be your take on this? The ability to move around some UI elements, specifically buff and/or debuff locations.

I don’t think a 100% free placement is needed, but if the player could chose to put them in say one of the 4 corners of the screens (including both next to each other), that’d already be a hugely nice QoL and avoid the future problem (which PoE is facing now), a problem that’ll only grow worse with more complexity/things added to the game

There will be information available on mouse-over. The current intention is to have that take the form of regular tooltips, however this hasn’t been implemented yet so is non-final.
 

If a single row provides insufficient space, a new row will appear above the existing one.
 

For anyone with Deuteranopia the different shapes should help. We haven’t gotten any specific settings written in stone for this particular feature just yet. If you suggest any in particular, I’d be happy to raise them at one of our future meetings.
 

Thank you for the feedback.

My personal preference would be for them to be separated, as whether I use a high Mana cost skill may be determined by whether I currently have a specific buff, whereas I would be more inclined to check the debuffs in response to what enemies are doing. Them being separated means that my focused checks involve me parsing fewer icons; it’s quicker.

Would you always be looking at both buffs and debuffs, or would that only be the case some of the time? I’ll speak with the team about this and see what we can come up with.

1 Like

As a quick update on this, we do plan to offer the option to have the remaining duration in seconds displayed over the art. I’ve got a screenshot of the current design below.
 

There are five seconds remaining.

 
Let us know what you think!

1 Like

So I personally prefer this over not having it. The art is always great to look at, but having a number I can quickly refer to is much more helpful. The thing I would be cautious of is finding a balance between the number that goes over the artwork and having the artwork be recognizable. If the number covers too much, you have to mouse over to see what it is, etc.

Long-winded answer for I like this one better, but be careful on obstructing the meaningful artwork :blush::blush:

1 Like

What about something like this? Duration on bottom, stacks on top? Here you can more clearly see the full buff icon, but still a duration and the stack number.

buff_icon

4 Likes

Without having seen the current concept in game, I kinda prefer @ReimerhArts version for the timer and stack count.

1 Like

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.