Using sliders to filter results
Sliders in web design are becoming as ubiquitous as the fading yellow highlight. They certainly offer a more interesting and sophisticated way of interacting with a lengthy data set (remember the old days: choose from a drop-down, click Submit, wait, look at new page, click Back button, get lost …).
Some sliders allow changes to the top and bottom of a range of values:
Other sliders are designed to help the user choose a value (especially useful when it’s a hard value to remember):
Yahoo! UI Library – RBG Slider Control
Some sliders even include sparklines (small data displays), a very data-rich approach:
Prisjakt.nu (via IXDA-Discuss):
Other than the obvious cool factor, there are definite advantages to using sliders:
- instant feedback allows the user to focus on the data itself, rather than on manipulating it
- it’s much faster to modify a number of criteria at once (price, bedrooms, bathrooms) while keeping the cursor in one place (compared to a bunch of drop-down lists)
- small changes to the chosen ranges display right away, allowing for faster decision making
There’s always a downside:
- Sliders aren’t good for small adjustments or for choosing very specific values, because they require too much fine coordination (not everyone uses a mouse, and some of us have a lot of cat hair on the mouse’s infrared sensor, which makes it jump around a lot)
- People who aren’t used to seeing sliders may not even notice it’s there, and get frustrated.
Nonetheless, sliders are a very useful design element, so get going and use one! Better yet, use one on every page!
Great post!
But you say “aren’t good for small adjustments or for choosing very specific values”.
What do you think the use of sliders on the site of volkswagen.co.uk in the section of new cars?