I'm currently working a sliding filter in a UI that presents a "distance to" option.
Which of the following would best in my situation?
- < 2.1 miles
- under 2.1 miles
- 2.1 miles or less
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It only takes a minute to sign up.Sign up to join this community
If you want sex just say it - You should strive to convey information in the clearest way possible, when possible.
< 2.1 miles is < clear than
less than 2.1 miles.
In the form
< 2.1 miles people could infer
< as "look left".
less than 2.1 miles is not the same as
2.1 miles or less - the former is exclusive (2.1 miles) whilst the later is inclusive. Given the unit though, I don't think anyone will care so the shorter version wins.
2.1 miles or less the important quantity is front-loaded, whereas in
less than 2.1 miles it is the third token.
You could equally use the caption
Max distance to venue, which will leave you having not to think about this - just put
Don't Repeat Yourself - There is already
miles in the scale, so you can just use
2.1 instead of
2.1 miles. Can you tell 60 what in this :
And as seen above, you can use a thumb; but that's not great if users need to see the value when not interacting with the slider (unless the thumb is always there).
It all depends, but my vote is
Max distance to venue with
The other answers seem to be missing the forest for the trees. The problem isn't visual, but semantic.
When creating key-value pairs, the least ambiguous solution tends to involve defining your left-hand keys such that you can keep the right-hand value side as elementary as possible (e.g., numeric scalars). In your case:
Maximum distance to Venue 2.1 miles
By redefining your "distance" key as a "maximum distance" key, you can avoid your presentation issues completely.
You could place the minimum value on the left and increments throughout the rest of the bar:
The "distance" in the title implies that values "up to" the selected one will be included in the filter.
If the min/max and steps would logically change based on availability and you want to avoid displaying "sorry, no results", you could use checkboxes with user-friendly ranges and show the number of results next to each. (To answer your original question - the example below uses "Less than".)
There are a lot of good answers here, but one thing I haven't seen addressed is that you can add clarity by using the more specific set of descriptors for your type of value (distance in this case), rather than the generic ones that work for any type of value (min/max/less/more). These brings in extra information without needing extra words.
Maximum distance 2.1 miles
No further than 2.1 miles
Less than 2.1 miles
Closer than 2.1 miles
You can apply this to lots of things: Price (
Cheaper instead of
Less), Weight (
Heavier instead of
In your specific case, it might depend on how the search is working:
Closer might imply that it is close to the user's location, rather than the origin of the search (which may be actually or conceptually the same, of course). If you want to guard against that, I might use
(Venues) within 2.1 miles.
The UI issue here is that "< 2.1 miles" is contradicted by the slider, which is about halfway between right here and ten miles. It must be nonlinear.
Here is how we fix everything:
Firstly, give me the exact figure. Don't tell me it's a secret number less than 2.1 miles—especially if the only other clue you give me is a position on a nonlinear slider whose only labels are on the endpoints.
Secondly, if the slider has a nonlinear scale, learn from a 1970's audio slider knob and put in some ticks which indicate that.
I would also use round numbers for the slider endpoints: how about 0 miles and 10.0 (or just 10) miles.