The new watershield for shaman works like this:

You cast it and get three charges.
Any time a charge is used, you get 200 mana back
At the end of a minute, any unused charges give you mana back
There is no cooldown on casting it.

It sounds simple, right? But, I'm trying to figure out a good way to graphically represent # of charges left and time left in a compact and "pleasing" way.

I am also a huge fan of not requiring people to read numbers on a bar. I design my mods so your peripheral vision will tell you what you need to know. Making the user read numbers runs counter to this.

So, any brilliant ideas on how to achieve this? I'm pretty much out of them. Some that I've played with so far are:

1) One traditional timer bar, where the height decreases as charges are used, while the width counts down like a normal timer bar.

2) One traditional timer bar, where the color changes as charges are used, wihle the width counts down like a normal timer bar.

3) Three small timer bars, all counting down simultaneously, but one bar disappears each time a charge is used.

4) Three small timer bars, none counting down. They would disappear as charges are used. A very thin timer bar would be overlayed on them which counts down like a normal timer bar.

Any suggestions are definitely welcomed.

*edit nevermind, I just saw you already suggested what I did.

I remember back in the ancient tymes there was a lightning shield mod I enjoyed. it used a circle countdown bar for the overall time and 3 icons to represent the charges. I don't think it gets more compact than a circle overall, and all the data can be evaluated at a glance.

(crude mock up of what I'm talking about)

Something circular?

A circle divided in 3 equal parts.
Each time a charge is used, one part disapear.

The time would be represented as the circle Shading in grey (or some other color), clockwise (like the buff on blizzard UI).


When time is up or when all the charges are used, the circle would flash in red.

I think you already gave some nice suggestions.

But what i think that is the most important that it is clear when you have to recast it. So a warning when it fades, or something to notice it... seems to me that an empty bar won't really get your attention.

EDIT: and something flashing in red like just suggested is always good ;-)

EDIT 2: Or an blue circular bar-timer, with inside that circle a smaller blue circle divided in 3 parts (like a pie). Each pie-piece is a charge, and disappears if used. In the same time the circular timer gets less. If the water shield fades they all (the circular timer and the pie-pieces) turn (or blink in) red. Hopefully this is a little clear without an illustration...
EDIT 3: hmm, would like something like this when at 45 seconds and 1 charge left:

My idea based on Totem Timers' functionality:
It would be a single square shaped scaleable 1x1 button with the water shield's icon and charges on it. Under the button we could see the time left just like it would be a buff or debuff. The icon turns reddish (option for turning this off) when all 3 charges are used. When you press the button you cast water shield (you could also assign a hotkey for it). I like compact things and don't really like to see bars on my screen, but this is my sense of taste.

I think the third option is, without question, the best. It has the highest potential for "on the fly" information gathering. There are two reasons I like it: first, it has the highest potential for accurate "on the fly" interpretation. You don't have to look to two different places to determine charge versus timer (option four) and you don't have to spend time interpreting or guessing what a specific combination of height and width means (option1). The second reason is probably less important, considering your feelings about text based mods. Ultimately, I think that having the "three bars" on screen appeals best to folks who use both symbolic and representational methods of information gathering. As such, it would probably be the most useful to the most number of people.

I would assume the frame for option 1 would have to be rather large to make distinctions about height and width meaningful. Option 2 is pretty okay, but might screw with some folk's color-coordination in their UIs. And Option 4 just seems needlessly complicated.

I'm not sure combining elements like that is really less complicated than numbers. Not to mention circles are ugly.

Maybe you could use Avion to graphically represent it. I haven't had any experience using it, but its just another option for you I guess :P

The way I see it, you could interpret the shield as a mana repository, on a time base.
A time bar on top with some numbers underneath: charges left and expected total mana left, could do the trick and be pretty simple to understand.

I'll try to express myself as best as I can using the code tag:

What I use at present is


The background shows the duration remaining using a shader feature thats quite clear ingame
Text font/size and colour can be changed for clarity

Disquette I like the circular representation mentioned above, although it may not mesh well with some of the other bars on DisqoDice.

Well, I'd like to challenge the assumption that you need to track duration.

The way I read this shield, it's the 'free mana' shield. If you pop it up once per minute and don't care about it you are guaranteed to get 600 mana per minute. It seems almost too good to be true tbh, but nevermind that. If you take dmg and lose charges on your shield you can put up another shield and maximise your return over time from the shield that way. It'll cost a global cooldown, but 600 free mana for one global cooldown is a tradeoff that is a good deal in about 9 out of 10 cases.

The way I see it you want to track your status between any of these three:
1) Shielded, with some charges up - plenty of time before it expires. You want to know how many charges are left, and nothing else really.
2) Shielded, with some charges up - not much time before it expires. You want to know how many charges are left and you want to know that it is about to expire
3) Not shielded

As a graphic I'd go with a 'juggling balls' setup - a triangle of smallish balls. I'd pick a medium/light blue for charges, and dark/shaded red tending towards black for not charged.

Status 3 above would be a graphic of 3 dark/shaded balls showing that it's not up.
Status 1 above would be a graphic of 1-3 blue charged balls and 0-2 dark/shaded balls with no other funny stuff.
Status 2 I would do as a copy of status 1 with a 'this thing is about to expire' flashing warning in the last 5 or so seconds before it expires.

Due to the delay imposed between discharges, I find it highly unlikely that you will want millisecond precision on refreshing the water shield. Any time in the two seconds following expiration will give the same return.

Due to the way I understand it working you'd practically never gain anything from refreshing it before it expires.

Wow, thanks much for the responses. I didn't think I'd get so many.

Malan, I agree, it doesn't mesh well. However, I do like it as a concept, and could possibly make it its own separately draggable frame so that it isn't forced into the same format.

I could possibly have it toggle with Option 3, just so I can get *something* in there for now. This is because...

I have no idea how to make a circular status bar. If anyone knows off hand a current mod that does this, I'd be really interested in seeing it so I could steal^H^H^H^H^H learn how to code that way.

Kalman - the issue I have with your suggestion is that as the circle gets smaller, the message goes away (much like someone mentioned with a bar disappearing ). I like to have something to look at as opposed to relying on memory when possible, though I suppose my current coding shows that I don't follow this concept very well. This is why I really like the mod that ______ (a poster in here who has kept his mod private thus far) made for watershield reminders. It has a textual equivalent of the red flash when the watershield is gone.

Thanks again, and more options are always helpful to broaden the horizon of possibilities.



EDIT - I'm being swayed by Krennick's ideas. Does anyone have a counter challenge to that?

I would much prefer the 4th option you listed.

3 bars with an underlying bar that counts down, just like the WF/SS bar.

The 3 bars disappear as charges get used.

That would match the style of your mod perfectly.

BTW: I must comment that I use your mod and find it wonderful! Even if they took away totem twisting I would still continue to use your mod! It is VERY useful seeing the last shock used and the WF/SS cooldowns. Please don't discontinue the mod

Can't really challenge what he says.

The only argument would be to know when the shield would fade precisely to prepare for it in your GCD use cycle, but honestly it won't matter to much at the end it would be 1 second lost at most.

Not so much a counter, but I've always found changes in color to be very informative for me. Hunters pets decrease for green to yellow to red. You could do something similar with the color of your bar. I suppose you could also do a gradual color shift over time so that if you have one charge left or 5 seconds left it'll show red either way, so that at a glance the color is telling you the same thing: you need to recast soon.

Yeah, the crux of my argument is that there's a discharge cooldown, so accuracy on the refresh is something that is almost pointless to strive for. I'm assuming here that the discharge of your water shield due to expiration will trigger the discharge cooldown that is also triggered when you are hit and it discharges normally, of course. If I'm wrong in that, a more accurate countdown/bar may have more merit.

It is, as you say, a UI design question. What information is distracting more than it's helpful? Without understanding the mechanism completely it occurs to me that you'd never really want to know the expiration so precisely that it's something you want to spend brain processing power on interpreting - and most of the time you don't want to know if it's 20 or 40 seconds away - both of those are from a tracking perspective merely 'safe' periods to expiration.

Even the 5 or 10 or whatnot warning flashing can be more distracting than helpful. Unlike with other buffs you emphatically do not want to refresh it when it is about to expire. You want it to expire so you get the charges - then you want to recast it.

Maybe what you really want is to let it just discreetly sit, and then when it expires do a one-time brightish (or darkish, but relatively big, fast moving and noticeable) flash to indicate that it has now expired and you need to put up a new one.

So something in the style of your SS/WFcd bar could work. You'd just need to add 3 circles to the bar at 25, 50, 75% positions to represent the charges. The circles would go red as they were used, and the WFcd would be used after each charge to show the cooldown till the next charge could be used. With the cooldown finished and no charges, you would see three red circles and no WFcd, letting you know it was time to refresh. I'll make an image if my explaination isn't clear.

I would incorporate two of the ideas suggested into a single bar, with three discretely (not shaded) colored sections. As charges are used, colors are removed, and as time counts down the bar shrinks.

Examples (assuming RGB for convenience, though R might be reserved for 0/0 Recast! state)


Just Cast, 3 charges, 60 seconds
RRRRRRRRRRGGGGGGGGGGBBBBBBBBBB

One charge gone, 30 seconds remain
RRRRRRRGGGGGG

One charge, 10 seconds
RRRRR

One charge, 40 seconds
RRRRRRRRRRRRRRRRRRRR

6 seconds remain, all charges remain
RGB

Just as I posted, I had an idea for how to show a charge being used: flash the entire bar the color of the charge used: This means that blue and green flashes are not alarming, but are noticable, but a red flash always means that the last charge is gone, whether by time or activation.

Attempt 1 to incorporate some of the suggestions, see attachment. The borders would change, so those aren't too distracting, but when it's out, the border color change is pretty dramatic, and the "empty" charges switch from white translucent to red translucent.

This is, of course, just a mock up using the wonderful drawing tool "Microsoft Excel", so hopefully the misalignments can be overlooked in favor of getting a feel for what it should look like when prettied up.

Re: The just posted mock-up

I, personally, don't see a reason to use a DIFFERENT fill color from border, and care more about known-time-to-recast (so I can plan to have cooldowns free) than about charges left (as charge loss in most situations, is not controllable).

Wow. That's a new one. Pretty cool, in my opinion. It's probably too much information, but just for the neat-o factor it's interesting. I'll try a mock up of this and drats's idea after lunch some time hopefully, though I do have a pretty big coding project (for work work) that I'll be doing then.

Drats, the more I think about it, the more I like your idea. It's unobtrusive, and follows the general look and feel of the current addon. It could also satisfy the non-distracting (Krennick) and time planning (Aloaya) aspects that people have mentioned.