User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

I’m currently working on a project which need a distance filter show on both list view page and map view page. It allows one to decide how far he wants to show posts nearby. Here are two examples attached. I would like to know if it is just personal preference or is there any hiding principles to use them. Thanks in advance!

enter image description here

enter image description here

share|improve this question
Curiosity: What are the ribbons (1st, 2nd, 3rd) for in the list view? – Marjan Venema Jan 2 '14 at 10:22
@ Marjan Venema that just someone's visual work from somewhere. I don't really know about the app either – gracekan Jan 5 '14 at 12:58
up vote 3 down vote accepted

Some notes on a distance:

  1. Dealing with distance there could be different distance metrics.

    enter image description here
    Taxicab geometry versus Euclidean distance: In taxicab geometry all three pictured lines (red, yellow, and blue) have the same length (12) for the same route. In Euclidean geometry, the green line has length approx 8.48, and is the unique shortest path.


    The metrics are different for the same points, and the difference could be significant. So make sure of using right metric.

  2. 5.813 miles in your first example doesn't look user friendly. People don't need such exact value as it brings excessive complexity. This looks good for robots, not for humans.

    5.8 miles or ~6 miles look more simple.

  3. People are not good in abstract numbers manipulations. Sometimes distance is a metric which should be mentally processed to get some inference or take some decision. This lead to high mental load while task execution. Then it's better to transform the distance (number) to more concrete unit, which could be processed more easy. Look at the picture, the scale of a map has meaningful detalization cues (world, country, etc.).
    enter image description here

share|improve this answer

Well, the one on top has no bottom limit, meaning that your range always begins at 0. The bottom one lets you specify a "doughnut", without returning results too close to the center. If that's not a requirement, then functionally the two are identical - you just set the radius.

The bottom one allows for much finer definition of the range, but it's mostly relevant for a mouse interface. If you use a continuous slider on mobile it will still provide better granularity than the example on top with the 5 fixed values, but you won't get a resolution as fine as with the mouse.

share|improve this answer

I vote for 1.

Two reasons:

1- Simple, easy to understand and intuitive interface. Way easy to quickly see the distance selections, this makes it easy for someone on a device to make a decision fast. Remember the users context, on mobile you never know where they are and what their situation is in real life... easy the better.

2- If they are deciding how far to show posts nearby, then they are 0. You don't need to set a beginning point, you already have it - it should be them.

share|improve this answer

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.

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