2

I'm working on a web app. Now I have to divide a value range into several continuous parts, say, divide 0~100 into four parts: 0~20, 20~40, 40~60, 60~100.

In the simplest way, I can use some text inputs for the values of split points. In the example above, the values would be 20, 40 and 60. However, I have to validate the input values and having several inputs seems not intuitive.

So I prefer a slider with multiple handles like this: enter image description here

I think it more convenient and intuitive.

As far as I see, sliders with one handle or two are common, while sliders with more handles are quite rare. I wonder if such a slider is suitable or are there any better alternatives?

Improve this question
2
  • My experiences with multipoint sliders matches @mgraham. In a somewhat similar question, I argued to remove the constraint from the input, and rather help the user distribute "what's missing". --- ux.stackexchange.com/questions/3736/…
    – peterchen
    Aug 15, 2016 at 9:19
  • @peterchen actually I want to allow users to define some thresholds, so the size of each part may not count. Still I think your idea of relative assignment awesome in that question.
    – jddxf
    Aug 16, 2016 at 5:49

2 Answers 2

Reset to default
3

Sliders output-wise do show the differences between ranges better than a bunch of text inputs. But I've used multi-range sliders a couple of times and people asked for text fields when they had to use them as 'inputs'. Here's a quick sample of the complaints I got as to why that was the case :-) :

a) Difficult to select between overlapping handles (especially with touch, and especially with more than 2 handles in the overlap)

b) Adding/Deleting handles is also difficult in the same scenario

c) Placing handles on precise values is fiddly

Sliders input-wise are generally good for what Shneiderman called "dynamic queries" - http://drum.lib.umd.edu/bitstream/handle/1903/388/CS-TR-3022.pdf - interactively changing the value of a slider and immediately seeing the effect on another variable - usually visually. If this isn't your use case it might be worth going back to the text fields and having a separate visual representation to show the ranges (essentially a stacked, horizontal 100% bar chart of the values)

Improve this answer
3

Perhaps a hybrid of slider points and text input where a change to one automatically changes the other?

In this way there are a number of advantages:

  • If you are typing in the edit fields you get the precision, as well as see a visual representation in the slider points.
  • If you are dragging the slider points you now see the values change in the edit fields, which allows you to achieve precision while dragging.
  • Mobile users can use either but if they need precision they will probably find it easier to use the edit fields.
Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.