Thread Tools Display Modes
03-13-16, 03:49 PM   #1
MunkDev
A Scalebane Royal Guard
 
MunkDev's Avatar
AddOn Author - Click to view addons
Join Date: Mar 2015
Posts: 431
Cluster action bar solution

So I've been looking into creating an action bar extension lately that would supposedly replace other action bar solutions and have it tailored specifically for controllers. One thing that's lacking with the FFXIV setup is the ability to always see your spells and cooldowns on your bars, which is why I've been trying to create something that keeps all that information visible at all times, while trying to retain a sleek look. Well, it's a lot harder than I thought to make it all just work well, look good AND feel intuitive.

I'll show you what I've got so far, but I'm very open to new ideas on how to improve this solution, since it's looking a bit cluttered and jitters a bit too much when modifiers are pressed in the current configuration. Arguably, the size of the main buttons are in the upper range of acceptable scale and the round style along with the arched placement of the modified buttons might be making things worse rather than better.


If you're confused about what the clusters represent: each controller button has 4 states, which consist of unmodified, shift, ctrl and ctrl-shift. The unmodified input is the large button in the cluster, but while a modifier is held, the large button changes into the modified action instead.


This system is adaptive to the range of inputs on a given controller. With a DualShock 4 or Xbox controller, this equals to 60 bindings drawn on screen. The Steam controller has even more than that. That's a lot of bindings to show at all times, but it has to be doable in some way or another. Grateful for any suggestions.

Note: Icons for static bindings are currently missing and replaced by a temp icon.
__________________

Last edited by MunkDev : 03-13-16 at 03:58 PM.
  Reply With Quote
03-13-16, 06:59 PM   #2
Nynaeve
A Cobalt Mageweaver
 
Nynaeve's Avatar
AddOn Author - Click to view addons
Join Date: Dec 2006
Posts: 245
I've gotten into the habit of always using my Steam controller for D3, but I've not, of yet, truly attempted using it extensively for WoW.

The general look is aesthetically pleasing, and I certainly can't say it's any more cumbersome looking than ordinary bars.

That said, if you keep this orientation/style/popout, will there exist a setting to allow the popouts to grow upwards or downwards, as opposed to sideways? I personally find it slightly off-balance, with it popping out to the left.

Additionally, can the action button clusters be moved independently of each other (or in groups), or are they all tethered together? I can't be the only one who puts the minimap in the bottom middle.

Without trying it out, I can't really give any opinions on the feel, but the overall idea seems lovely.

(Take all of the above with a grain of salt, as I'm somewhat obsessive about such things and my opinion is likely in an extreme minority.)
__________________
"For in the plot we find more than just a man, we find the idea of that man, the spirit of that man, and that is what we must never forget." Evey (V)
  Reply With Quote
03-13-16, 07:26 PM   #3
Resike
A Pyroguard Emberseer
AddOn Author - Click to view addons
Join Date: Mar 2010
Posts: 1,290
Maybe you could create a fast animation where the smaller cluster swaps place, size and strata with the bigger one, so it would be easier to follow whats happening on the screen.
  Reply With Quote
03-14-16, 01:05 PM   #4
MunkDev
A Scalebane Royal Guard
 
MunkDev's Avatar
AddOn Author - Click to view addons
Join Date: Mar 2015
Posts: 431
That's one of my points and I also like to keep symmetry where it makes sense. The reason I placed them on the left was because the right side is rather busy because of charge counters and placing them on top or below would increase the horizontal span of each button, since the 3 mini-buttons are wider than the large one. It's already crowded as it is.

I was planning on allowing them to be moved independently, since I like to cater to custom interfaces and this might just ruin any chance of playing with this action bar addon and something like ElvUI.

I think a solution like this is generally wasting too much screen real estate. Have there been any other unconventional action bar addons that do something similar in terms of placing buttons? The round button concept is not necessary at all, it was just what I thought would be cool, but I don't think it's helping the case.
__________________
  Reply With Quote
03-14-16, 01:29 PM   #5
Nynaeve
A Cobalt Mageweaver
 
Nynaeve's Avatar
AddOn Author - Click to view addons
Join Date: Dec 2006
Posts: 245
Originally Posted by MunkDev View Post
I was planning on allowing them to be moved independently, since I like to cater to custom interfaces and this might just ruin any chance of playing with this action bar addon and something like ElvUI.
Awesome to hear, even if you don't keep the same button configuration.

Originally Posted by MunkDev View Post
I think a solution like this is generally wasting too much screen real estate. Have there been any other unconventional action bar addons that do something similar in terms of placing buttons? The round button concept is not necessary at all, it was just what I thought would be cool, but I don't think it's helping the case.
It's taking up a bit of real estate; however, this is equal to what, four bars' worth of buttons? It doesn't seem to be taking up any more space than having four small-sized to normal-sized bars shown.
I'm sure there's a configuration that'll take less space, but it all boils down to how much information you need/want visible at one time, I suppose. What's your ultimate goal, here? More information, or minimalism? Some attempt at a hybrid via the popouts?
__________________
"For in the plot we find more than just a man, we find the idea of that man, the spirit of that man, and that is what we must never forget." Evey (V)
  Reply With Quote
03-14-16, 03:07 PM   #6
MunkDev
A Scalebane Royal Guard
 
MunkDev's Avatar
AddOn Author - Click to view addons
Join Date: Mar 2015
Posts: 431
You're probably right, actually, but I also need some space for XP/Rep bar, stance buttons and a pet bar, even if the idea is that the pet will be controlled using the action bar anyway. I'd also like it to somehow feel like one big bar, instead of free floating clusters spread all around.

One of the issues I think new players have with controller gameplay is the bucket load of bindings that are just handed to you (although you're of course free to configure your setup however you want) and it might be cumbersome to keep track of it all for a beginner. Having played with this setup for quite some time, I still look at my bars occasionally since I don't always remember all my spell bindings. I'm aiming at providing a little bit of both worlds; all your controller bindings are always visible, but in a way that's not taking up the entire screen and (ideally) only uses icons and short text strings.

Placing the modified buttons under the main button and moving the hotkey indicator actually looks alright though:

Btw, this is what the bindings look like without the extension enabled:

Weirdly enough, the extension shows 4 more bindings, but it looks like a lot less. Might be because of the menu bar, pet bar and bags though.
__________________

Last edited by MunkDev : 03-14-16 at 03:18 PM.
  Reply With Quote
03-14-16, 03:17 PM   #7
Nynaeve
A Cobalt Mageweaver
 
Nynaeve's Avatar
AddOn Author - Click to view addons
Join Date: Dec 2006
Posts: 245
Originally Posted by MunkDev View Post
One of the issues I think new players have with controller gameplay is the bucket load of bindings that are just handed to you (although you're of course free to configure your setup however you want) and it might be cumbersome to keep track of it all for a beginner. Having played with this setup for quite some time, I still look at my bars occasionally since I don't always remember all my spell bindings. I'm aiming at providing a little bit of both worlds; all your controller bindings are always visible, but in a way that's not taking up the entire screen and (ideally) only uses icons and short text strings.
You're right about the bindings being overwhelming for someone new to controllers in a game like this. I'd say that any new hardware changes are going to be overwhelming, at first. Multi-button MMO-mice and gamepads also take time for adjustment. Anything you can do to alleviate that is always appreciated (e.g. your ability to show all the buttons and their modified counterparts together, as you are here).

Originally Posted by MunkDev View Post

Placing the modified buttons under the main button and moving the hotkey indicator actually looks alright though:
I agree that looks significantly more balanced and less chaotic, with the modified ones on the bottom, as opposed to the side!

Originally Posted by MunkDev View Post
Btw, this is what the bindings look like without the extension enabled:

Weirdly enough, the extension shows 4 more bindings, but it looks like a lot less. Might be because of the menu bar, pet bar and bags though.
Even without the bags and such, and if the petbar were in that spot, your extension would still look like a lot less, imo. Even if you're not happy with the look yet, it is certainly less overwhelming than the default UI and normal bars, for sure.
__________________
"For in the plot we find more than just a man, we find the idea of that man, the spirit of that man, and that is what we must never forget." Evey (V)

Last edited by Nynaeve : 03-14-16 at 03:45 PM.
  Reply With Quote
03-14-16, 04:17 PM   #8
Folji
A Flamescale Wyrmkin
 
Folji's Avatar
AddOn Author - Click to view addons
Join Date: Apr 2009
Posts: 136
Originally Posted by MunkDev View Post
Placing the modified buttons under the main button and moving the hotkey indicator actually looks alright though:
You can definitely also make the modified buttons a bit smaller, as to not distract too much from the main buttons. You've got wiggle room as far as figuring out how small can they be while still being identifiable by icon, and where does the relative sizing need to be to not have the modifiers distract from the active button. If they're too similarly size, the modifier buttons would just distract from identifying the main button at a glance. (Well that was super-well-worded, I pretty much just said the same thing thrice!)

Plus, generally gamepads are universal in having the DPAD on the left side and the other four buttons on the right, aren't they? I'm assuming that the player can bind and arrange a bit at their own behest, but a default setup would be smart to leverage the relative real-world positioning of the respective buttons. DPAD to the left and action buttons to the right with the trigger buttons on the edges. They could even outright mimic the physical button layout, which would make the hand-to-eye co-ordination even more intuitive for the user.
  Reply With Quote
03-14-16, 04:57 PM   #9
MunkDev
A Scalebane Royal Guard
 
MunkDev's Avatar
AddOn Author - Click to view addons
Join Date: Mar 2015
Posts: 431
Don't mind the current order of things. The buttons are generated through a loop that gets the button names from a template file which isn't ordered to suit this action bar in its current state. Consider this an artifact of the mockup and not something that was planned. The same function call that gets the controller layout is also used for a lot of other things, which is why they are not intuitively positioned.

Making the modified buttons smaller might work, but visible cooldowns (charge / normal) have to be kept in mind, along with a clear enough icon to show which spell it is. It also needs room for macro text and the charge counter. Another way would be to reduce the main buttons, but I feel like they should retain a larger size because they represent the current action of the button.

Looking at this image without the modified buttons, it becomes very clear how much room one of these clusters take up on screen currently:
__________________
  Reply With Quote
03-14-16, 05:47 PM   #10
Folji
A Flamescale Wyrmkin
 
Folji's Avatar
AddOn Author - Click to view addons
Join Date: Apr 2009
Posts: 136
Experiment with fading or darkening the modifier buttons, perhaps? There's a lot of ways in which you could make an element "less interesting" to the viewer without reducing readability, thankfully! You definitely want to keep the main button big, though, because the alternative would just be counter-intuitive.

Maybe the current setup does work, though? It's a bit hard to really tell without actually trying it out, but my eyes are trying to look at the button cluster as though it's one unified object, and that tells me that the main button could be made a bit more distinctive from the buttons underneath. Whether by being just a little bigger itself, or by having the buttons under a bit less visible.

You could consider a more solid border around the main button, that would also give it a more distinct separation from the other buttons without taking away from the context.
  Reply With Quote
03-14-16, 07:34 PM   #11
Nynaeve
A Cobalt Mageweaver
 
Nynaeve's Avatar
AddOn Author - Click to view addons
Join Date: Dec 2006
Posts: 245
Originally Posted by Folji View Post
Maybe the current setup does work, though? It's a bit hard to really tell without actually trying it out
Completely agreed. It would be easier to tell from being in action, but without trying, we can still at least suggest tweaks?

Originally Posted by Folji View Post
Experiment with fading or darkening the modifier buttons, perhaps? There's a lot of ways in which you could make an element "less interesting" to the viewer without reducing readability, thankfully! You definitely want to keep the main button big, though, because the alternative would just be counter-intuitive.

You could consider a more solid border around the main button, that would also give it a more distinct separation from the other buttons without taking away from the context.
I didn't get a chance to play with size earlier, but I did play around with saturation, color, and darkness/lightness levels for the modifier keys, and a border for the main button. Maybe one of these will appeal to MunkDev.


This is the original

This is with a Slight Border

This is with a Slight Border and Slightly Darker Mods

This is with a Slight Border and Full Desaturation of the Mods

This is with a Slight Border, Slight Desaturation, and Slightly Darker Mods


When I'm feeling less lazy, I suppose I could put different action buttons, or put a background.

Depending on the intended UI, it could be cool to colorize the modifiers, instead of reducing the saturation, like so:


Or colorized per class, that could be pretty cool (though Priest could present a problem, if it weren't just a straight desaturation for them...)
__________________
"For in the plot we find more than just a man, we find the idea of that man, the spirit of that man, and that is what we must never forget." Evey (V)

Last edited by Nynaeve : 03-14-16 at 07:47 PM. Reason: add pictures
  Reply With Quote
03-15-16, 01:07 PM   #12
MunkDev
A Scalebane Royal Guard
 
MunkDev's Avatar
AddOn Author - Click to view addons
Join Date: Mar 2015
Posts: 431
I uploaded another video to show you what it looks like since the recent changes:
https://youtu.be/U49T6jDiO4U

The bar addon is available on GitHub.

I think it doesn't feel right in the way it's currently designed. The way the buttons pop in and out is a lot of change on screen for something that happens as frequently as a modifier change. It might actually be better to always keep them visible, but indicate in some other way which one in the cluster is focused.
__________________

Last edited by MunkDev : 03-15-16 at 01:09 PM.
  Reply With Quote
03-15-16, 03:23 PM   #13
Nynaeve
A Cobalt Mageweaver
 
Nynaeve's Avatar
AddOn Author - Click to view addons
Join Date: Dec 2006
Posts: 245
Originally Posted by MunkDev View Post
I uploaded another video to show you what it looks like since the recent changes:
https://youtu.be/U49T6jDiO4U

The bar addon is available on GitHub.

I think it doesn't feel right in the way it's currently designed. The way the buttons pop in and out is a lot of change on screen for something that happens as frequently as a modifier change. It might actually be better to always keep them visible, but indicate in some other way which one in the cluster is focused.
The cluster action bars are currently bundled into the controller addon revision on github, then?

After watching that video, I agree the way it's popping in and out is a little much.

Perhaps the currently used modifier and the main button could switch places for the duration of the button press, leaving all buttons up, just switching those out?
If you did it this way, you could then have them all out, and, while things would be switching, it wouldn't be as jarring as everything disappearing? You could then offer the option to only have the main button shown, and just switch the main buttons when the modifer is pressed (for those who feel they know their hotkeys extremely well, and want something more minimal).

Or perhaps the currently used modifer's buttons could be highlighted in some way? Or instead of highlighting the currently used buttons, the rest of the buttons could be de-emphasized, somehow.
__________________
"For in the plot we find more than just a man, we find the idea of that man, the spirit of that man, and that is what we must never forget." Evey (V)

Last edited by Nynaeve : 03-15-16 at 05:32 PM.
  Reply With Quote
03-16-16, 02:49 PM   #14
MunkDev
A Scalebane Royal Guard
 
MunkDev's Avatar
AddOn Author - Click to view addons
Join Date: Mar 2015
Posts: 431
The cluster bar is bundled with the addon because it's using both graphics and API from it to determine how to set up the clusters. It's not a traditional action bar in that sense. ConsolePort stores bindings in a saved variable as opposed to using explicit key bindings. This reduces interference with kb/m and simplifies the initial setup.

I also like the minimal idea, but that's a crap load of bindings to remember. Usually you have the basics narrowed down, like your main rotation and cooldowns, but the harder to reach and infrequent bindings might have you looking at your bars for half a minute before you find the correct binding. I guess this could be remedied with showing all the buttons once the mouse is over the bar or something to that effect. I would still keep modified buttons visible when they are on cooldown though, so that information is always available.

I tried three new versions of swapping...

1) Instead of hiding all the buttons, I tried hiding just the modified button in question, to simulate pulling it into the big button. I think this is alright, but maybe a fast animation would be beneficial:

2) I also tried switching the modified button with the unmodified button, but I think this once again adds too much clutter and visible change on screen to feel intuitive. Maybe that's just my opinion though?

3) Last.. and actually least, I tried just disabling any indication on the modified buttons and just changing the big button to whatever modifier is held.

Maybe going the route of using something else to indicate the modifier override is better to reduce the innate confusion with this design. In the radial action bar that belongs to the main addon, I'm using a highlight behind the button that's being focused, but this effect might be too subtle for peripheral vision:


Btw, thanks for your thoughts thus far.
__________________

Last edited by MunkDev : 03-16-16 at 02:56 PM.
  Reply With Quote
03-17-16, 03:01 AM   #15
Folji
A Flamescale Wyrmkin
 
Folji's Avatar
AddOn Author - Click to view addons
Join Date: Apr 2009
Posts: 136
Originally Posted by MunkDev View Post
1) Instead of hiding all the buttons, I tried hiding just the modified button in question, to simulate pulling it into the big button. I think this is alright, but maybe a fast animation would be beneficial:
That'd likely be a pretty good solution if you assume players probably won't be holding the modifiers for longer than it takes them to press the button they'd have in mind there. And it has enough visual feedback with the button vanishing to give the cue of "okay, that button is now in focus".

If you wanted to make that change even more obvious, the solution would definitely be to either have a quick animation that enlarges the modifier and moves it to the center, so that it visibly slides up and overlaps the main button. Or you could have a quick border flash on the main button just as the modifier key is pressed.
  Reply With Quote
03-17-16, 11:07 AM   #16
MunkDev
A Scalebane Royal Guard
 
MunkDev's Avatar
AddOn Author - Click to view addons
Join Date: Mar 2015
Posts: 431
Originally Posted by Folji View Post
That'd likely be a pretty good solution if you assume players probably won't be holding the modifiers for longer than it takes them to press the button they'd have in mind there. And it has enough visual feedback with the button vanishing to give the cue of "okay, that button is now in focus".
Modifiers are normally not held for longer than a split second, just like you don't hold a modifier on your keyboard for longer than it takes you to trigger the binding you're trying to reach. The idea behind showing it on the main button is not really for a gameplay purpose, but rather giving you an easy way of tracking your bindings and spells. Seasoned players will see a lot of visual chaos on screen while keeping up the average pace of WoW gameplay with some of the examples I've tried.

Originally Posted by Folji View Post
If you wanted to make that change even more obvious, the solution would definitely be to either have a quick animation that enlarges the modifier and moves it to the center, so that it visibly slides up and overlaps the main button. Or you could have a quick border flash on the main button just as the modifier key is pressed.
The tiny animation might be an interesting solution, but it'll take a while longer to code than writing another state swapper since I already sort of created a template system for that. Might be worth trying it out at least, just to see how it feels.

I did try another thing, which was to entirely hide the modifier buttons (as suggested by Nynaeve) unless the bar is moused over. This setup is extremely clean and lightweight (though things like cooldowns and procs should ideally always be visible) and it works well for me personally, but might not be easy to use for a beginner.

https://youtu.be/0l_PmiaPUwU
__________________
  Reply With Quote

WoWInterface » Developer Discussions » General Authoring Discussion » Cluster action bar solution

Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off