Tag Info

New answers tagged

0

Why dont you do all of the above: Graph with details: or graph with sub-graphs: You can use a bar with color and relative size to its container to quickly show the items capacity. Under that you can show the percentages for people who need to know the specifics. When you click (or touch on mobile) a panel slides down giving details for each of its ...


0

Using color alone as a differentiation may not work for some users (e.g. users color blindness). Consider using another visual difference e.g. height difference (example 1) or make the green brighter than the yellow and the red darker than it (example 2) or perhaps add HIGH/MED/LOW (example 3) if you don't want to specify percentage (even though I think ...


0

Have you considered a more web friendly layout. Such as a menu usage to split the data in separate pages instead of one page with a filtering system.


10

When one slider is adjusted, auto-adjust the remaining unlocked sliders to keep their total at 100%


9

You can present a simple UI that allows all four values to be set at once. I created a mockup that illustrates this principle. Note that I haven't particularly focused on making sure that the UI doesn't always present exactly 100% (due to rounding). I leave that as an exercise to the reader. This control scheme is an "inverted control scheme," where the ...


15

Make the user's job easy Ask yourself if it's the system or the user that's concerned with 1% accuracy. Does the user really want to think about the distributed percentages, or just the priority of each point? Ask for simple relative values If a high level of precision is purely the domain of the system, consider asking your users how much they care about ...


-1

I like TJennins answer, but considering the move from A to C comment: Check out partitioning tools like gparted on linux. http://gparted.org/screens/gparted-main-window.png There it is easy to shrink the third element, then move around the second and then make the first one larger. All depends on how accurate you need the numbers. Or add some padding ...


22

There is also possibility using four sliders to normalize the results, that is, if they sum up to x%, multiply each value with 100/x. Then you wouldn't have to worry the user with constraints while retaining the proportions desired by the user.


31

Is it necessary to use sliders? Note that a slider is a good choice when you know that users think of the value as a relative quantity, not a numeric value. For example, volume or brightness control. If the user has to determine value, you can also give a simple value entry interface along with a "Remaining Value" indicator. Somewhat like this: ...


73

You could use a single bar, partitioned into four sections, labelled (or possibly coloured, as I've used in my example image) accordingly. The area where each partition meets would be resize handles, and resizing would accordingly expand and shrink the adjacent partitions, while the entire bar is capped at 100%. With a legend showing the exact percentages ...



Top 50 recent answers are included