Location and mile radius layout pattern?

Question

I'd like our users to enter a location (probably city or zip) and a mile radius when they are doing a search.

Any good ui patterns for doing this in a slim way?

AndroidHustle · Answer 1 · 2012-04-20T08:46:21.087

6

I would be careful with filtering results using a continuous parameter, which distance is. The reasoning behind my take on this is because potentially nice search results may be filtered because they in theory could be located 1 distance unit beyond the threshold, which may be set to 10,000 distance units, a minuscule difference in the context.

As far as I'm concerned, an approach that the user could benefit more from is by having the search result ordered by distance by default. This way the user may spot a search result outside her initial scope of distance but that it's intriguing enough to stretch the distance threshold just a little, because the gain is greater.

All be it I don't know the purpose behind the application you're developing, but if it resides to ads/job-opportunities or similar I would really consider using an ordering approach instead of a filtering.

EDIT: There's a Swedish ad-site that handles the Loci selection pretty well. I've made a mockup to depict how you could adapt a similar solution with an interactive map to chose location. Only difference is that here the user is able to disregard distance and search in the entire nation, something that the Swedish ad-site for some reason lacks...

enter image description here

mockup

^{download bmml source – Wireframes created with Balsamiq Mockups}

The user may also check that they want to search in states adjacent to the chosen one. This utilizes a direct manipulation concept, a user interactive approach that most users, experienced as well as inexperienced, usually are comfortable with due to clear mapping to the real world.

edited Apr 20 '12 at 08:46

answered Apr 18 '12 at 08:22

AndroidHustle

16,241
2
53
80

+1 When prompted, I always enter ridiculous distances for precisely this reason. – msanford Apr 19 '12 at 21:16
This is indeed for hiring so while distance is important it is not the most important and candidates are ranked/sorted based on multitude other factors. I agree that bigger radius is almost always better - I am thinking that a drop down at intervals is easier than requiring the user to type in the distance. – Max Apr 20 '12 at 00:14
@msanford same here. The biggest Ad-site here in Sweden actually lacks this feature. The user is demanded to chose a specific area in Sweden, an area that maybe covers 100 x 100 miles, and then later they can specify that they want to search the entire country. That this option is missing from the site landing page is a mystery to me. – AndroidHustle Apr 20 '12 at 07:17
@Max In that case Max I would advise that you still leave a option that the user can chose to not have distance as a search parameter. I realize that the US (if that now is where this will be utilized) is a BIG country compared to Sweden where I come from. But one have to remember that people are quite open to relocating if there's an attractive opportunity on the table. – AndroidHustle Apr 20 '12 at 07:23
What if there are other options provided to sort the search results(example, sort by rating or cost, in addition to the default sorting by distance), one would have to assume a search radius value and sort the results that are within that radius. – Jarnal Mar 18 '14 at 07:29
@Jarnal Yes, that was my thought as well. The user specifies which area is of interest. And then the sorting is done for the search result within that area. – AndroidHustle Mar 18 '14 at 08:14

score 3 · Answer 2 · answered Apr 19 '12 at 20:23

The cleanest/most minimal UI for this situation might be to do away with the radius input. If users enter a location then obviously they're interested in the locations nearest that. Displaying a list sorted by ascending distance solves that. Laying these locations on a map might be another good alternative to offer as well. (Very similar to what @AndroidHustle proposed)

mockup

^{download bmml source – Wireframes created with Balsamiq Mockups}

score 1 · Answer 3 · answered Apr 19 '12 at 21:33

Frankly, outside the context of aviation, linear radial searches don't actually mean as much as we'd like to think. This is chiefly because real distances aren't measured in straight lines. Is it 12 km from my house to my office? No, it's 3, but the city's topography and urban landscape make it 12 because I have to cross a bridge.

What is the distance filtering meant to achieve? A much more user-friendly option to me would be to provide a clickable map with regions sensibly defined for your context (city, borough, block, country, etc.) Not exactly what I mean, but the BBC language switcher might be inspirational, especially as it combines two data sets: geography and language.

I'm also very much in favour of simply ordering search results by distance.

The Question · Answer 4 · 2012-04-18T16:32:35.490

0

Have a look at job search websites. They are very keen to solve this as well as they can. Mostly though they are just two boxes and defaulted distance (which can be customised). Remember though that if the search if very local that users perception of 'their area' differs widely. It becomes a rarer issue at a higher level.

edited Apr 18 '12 at 16:32

answered Apr 18 '12 at 07:23

The Question

709
4
9

score 0 · Answer 5 · answered Apr 18 '12 at 07:49

0

How about showing 2 textboxes for city and zip (pre-fill them using GPS/Location APIs if available) and below these show a slider UI control to set radius.

answered Apr 18 '12 at 07:49

Aziz Shaikh

399
2
17

Definetely think a slider could make it more interesting and easier on the eyes. – Max Apr 20 '12 at 00:13

Location and mile radius layout pattern?

5 Answers5