Hi,

I'm currently struggling with a player input / User interface issue I'm trying to fix and would like your feedback.

I'm working on a project where you manage a single resource towards various poles.

Think of it as trying to manage people to do different tasks:

'how many people should do task "a"'

'how many people should do task "b"'

'how many people should do task "c"'

...

Now, most games I've seen use multiple 1-dimension sliders and some form of a total.

Many of them will make it so that when you increase one slider, it will automatically substract from one of the others in such or such way.

I find this system to be suboptimal at best and irritating to use, but lack more efficient implementation to really substantiate it.

Since there are 6 different allocations in my game, I initially went for a sort of hexagon where you could just drag your allocation balance, but it was limited in that, if you would move towards B, you'd also inherently move closer to A and C, while moving away from D,E,F and my system really doesn't have much correlation by proximity.

I was wondering if you know of, or have thought about potential implementations to make manipulating such a system simpler and less irritating?

With 6 variables, I'd say the only workable option is sliders of some sort. The geometric method (i.e. your hexagon idea) requires, if all the variables are intended to be uncorrelated with one another, an (n-1)-dimensional figure for n variables, and there's not really a convenient and intuitive way to place an arbitrary point in a 5D space.


if you don't like the idea of other sliders automatically adjusting when you move one, consider instead making the sliders a bit more indirect: instead of directly controlling the resource allocation for each pole, they dictate the weight of each pole in determining the final allocation.

For example, if all six sliders have the same value, they all receive 1/6 of the total resources, regardless of whether all six are at 100% or at 10%. (i.e. the amount of resources devoted to each pole is equal to (total resources)*(that pole's slider value)/(the sum of all slider values).)

Interesting.

My concept thus far was to drag portions of a pie chart so that each element became more or less important. This was however, not very user friendly.

Perhaps I'll look into less geometric avenues. I'm pretty sure I'm not the first to tackle this problem, perhaps its all a matter of presenting it differently?

What ever choice you go with, make sure it includes the ability to lock a given value so you can toggle which ones you are actually changing at the time.

What about having the different tasks be variables that you can drag around and group in a tree structure. Have the root be your entire resource amount, and then be able to group your different tasks however you want in multiple levels to manage their ratios.

So say you have the 6 options, A: Military, BCE... as 'everything else'. (I have no idea what your tasks are)

R is your root pool, from R the player chooses to split between two nodes: A and BCDEF. The sliders adjust the split of the entire node above, leaving nothing more.

The player then chooses to split three ways, BE, CF, and D. each node gets a slider, and in this case BE and CF split again and get their final slider adjustments.

Dragging any value around in the tree should auto adjust the tree such that the amounts each.

So if I were to split 50:50 between A and BCDEF, A gets 50, BCDEF gets 50.

Then I split 15:20:15, BE gets 15, CF gets 20, D gets 15.

Later I change my mind and want to group D with A, so I drag D over to A's node. D joins A's node out of Root, and they split off into their respective leaf nodes. But since no values actually change on a simple move the split out of Root turns to 65:35, and AD splits to 50:15. I can then go back and adjust the Root split back to 50:50, which then auto adjusts the values in the sub trees based on their previous ratios.

This is the only way I can see any kind of improvement over "Moving one slider splits the difference among all other unlocked sliders" method that seems to be the common solution.

(I should patent this idea.)

Argh! I had tasks planned for today and now this interesting problem came up :/

• Is it possible to make the variables dependent on each other?
• You could perhaps group them into pairs, then one slider would be manipulating the proportion between two variables instead of one.
• Is it integers or real values you are manipulating? Sliders work well for real values but for integers you could use some "add/remove" buttons.

My best suggestion is to use a "megaslider":

All values are stuffed into the same slider. The black box indicates how much stuff you have unused. When you slide any arrow, the value of that variable changedand the segment is getting changed proportionally. In the lower image the light blue arrow has been manipulated to the right. As a result, the purple arrow is pushed to the right and the black box is reduced.

• It's clear that they all use the same resource pool.
• You see the proportions of the values.
• Problem is that if some of the values are supposed to be small and some large, it might lead the user into thinking that they should all be large. Example: if soldiers/priests/worker proportion is perhaps 40/2/5000, it will be poorly represented in this system.
• You can attach nice icons on the arrows.

if you don't like the idea of other sliders automatically adjusting when you move one, consider instead making the sliders a bit more indirect: instead of directly controlling the resource allocation for each pole, they dictate the weight of each pole in determining the final allocation.

For example, if all six sliders have the same value, they all receive 1/6 of the total resources, regardless of whether all six are at 100% or at 10%. (i.e. the amount of resources devoted to each pole is equal to (total resources)*(that pole's slider value)/(the sum of all slider values).)

This. I have seen the "other bars adjust as you click one" in the old games and I did not like it. The only one that is fine with me is the proportional/percentage system (you move one to the right and then you have to move all other to the left - this way you have 100% in the first one and 0% in others).

What about having the different tasks be variables that you can drag around and group in a tree structure. Have the root be your entire resource amount, and then be able to group your different tasks however you want in multiple levels to manage their ratios.



So say you have the 6 options, A: Military, BCE... as 'everything else'. (I have no idea what your tasks are)



R is your root pool, from R the player chooses to split between two nodes: A and BCDEF. The sliders adjust the split of the entire node above, leaving nothing more.



The player then chooses to split three ways, BE, CF, and D. each node gets a slider, and in this case BE and CF split again and get their final slider adjustments.



Dragging any value around in the tree should auto adjust the tree such that the amounts each.



So if I were to split 50:50 between A and BCDEF, A gets 50, BCDEF gets 50.



Then I split 15:20:15, BE gets 15, CF gets 20, D gets 15.



Later I change my mind and want to group D with A, so I drag D over to A's node. D joins A's node out of Root, and they split off into their respective leaf nodes. But since no values actually change on a simple move the split out of Root turns to 65:35, and AD splits to 50:15. I can then go back and adjust the Root split back to 50:50, which then auto adjusts the values in the sub trees based on their previous ratios.

*Brain needs image to understand*

I think I'm a visual type of person. Didn't quite get the tree structure from your idea (which also means I didn't understand the idea).

Is it possible to make the variables dependent on each other?
You could perhaps group them into pairs, then one slider would be manipulating the proportion between two variables instead of one.

They are really standalone items and are not related to one another. It's basically like saying, my city has 1000 population, 100 of which I want to work in healthcare, 200 of which I want to work in retail, 200 of which I want to work in schools, etc. They are all strictly different and shouldn't represent a binary choice (a or b) but a complex decision (a or b or c or d or e or f)

Is it integers or real values you are manipulating? Sliders work well for real values but for integers you could use some "add/remove" buttons.

I'm using integers (actual population count) but could represent them as proportions in %. That really doesn't matter so long as its user-friendly.

I've indeed toyed with the concept of various side-by-side boxes with their own +/- buttons. So far, this is the best looking system but its still very complex.

All values are stuffed into the same slider. The black box indicates how much stuff you have unused. When you slide any arrow, the value of that variable changedand the segment is getting changed proportionally. In the lower image the light blue arrow has been manipulated to the right. As a result, the purple arrow is pushed to the right and the black box is reduced.
It's clear that they all use the same resource pool.
You see the proportions of the values.
Problem is that if some of the values are supposed to be small and some large, it might lead the user into thinking that they should all be large. Example: if soldiers/priests/worker proportion is perhaps 40/2/5000, it will be poorly represented in this system.
You can attach nice icons on the arrows.

I had such a slider in mind as well. It is incredibly hard to be precise though, and its much harder for the user to determine what will happen (how can I make the blac box grow? as they'd be expecting that dragging section A will transfer to the section besides it (B)).

Still interesting though.

This. I have seen the "other bars adjust as you click one" in the old games and I did not like it. The only one that is fine with me is the proportional/percentage system (you move one to the right and then you have to move all other to the left - this way you have 100% in the first one and 0% in others).

How exactly does it work? Do you have any example I could check?

Quick sketch of my idea. Yay for MS Paint!

Drag stuff around, push nodes together to join them. Could also vary the size of the bubble based on how much you are allocating. Makes it easy to swap stuff around. In this example the player could use the left side of the tree for the 'fixed' values, and the right for ones they are adjusting. The actual amount allocated to a given task would stay fixed when moving the node around the tree, so you fiddle with numbers on the right, then when you are happy with one you toss it into the left node, and the computer calculates how much it was set to and adds that to the slider going to that node.

It could even be expanded to have a section above the Root for Fixed Values. If you only ever want X number going to a given Task, and this doesn't change if your root pool grows, then drag them up top. As more is added to the root it flows down to the lower nodes and adjusts all the ratios as needed. Again if you drag something out of the fixed values section to the lower part, then it wouldn't actually change the assigned numbers, just adjust the sliders as needed to keep everything the same.

Mipmap's slider could also work well, but I would want to be able to drag and drop the sections to reorder stuff. That way you can quickly adjust two values accurately when you are already at max resource usage. Moving units from the left most to the right most would be annoying otherwise, as you would have to adjust each value.

Another option could be a more visual option. Your options are then pools, and to change the value of one you click and drag different sized circles from one to another. They could auto sort based on different sizes, and would need to be played with to get good values that work well in game. Add two or three units to one task? Drag two or three small icons from one to the other. Major changes? Drag that 50% ball out of one. Maybe keep a center 'table' so you can drop a large value there and it splits into smaller ones. Double click on a large ball and it splits into smaller or something.

Not sure if that would really be more usable than just a text box, and the user directly enters changes.

• What kind of device are you building this for? I was assuming you are building for desktop (keyboard and mouse).
• What is the range of the variables? 10s, 100s or 1000s of units to manipulate?

Here is another one:

You select the variables (x) you would like to manipulate and then spin the "wheel" below.

Acharis, on 06 May 2013 - 09:21, said:

This. I have seen the "other bars adjust as you click one" in the old games and I did not like it. The only one that is fine with me is the proportional/percentage system (you move one to the right and then you have to move all other to the left - this way you have 100% in the first one and 0% in others).

How exactly does it work? Do you have any example I could check?

? It's the simpliest system possible... Old Settlers used it: http://imageshack.us/f/337/settlers.jpg/