2

For a real estate search, the user can specify bedroom count with valid values being 1,2,3,4,5+ or any continuous range in-between (e.g. 2-3) and I'm looking for a way to represent that other than a range slider.

As the first part of a faceted search, the user will input such a value with text, i.e. "3 bedrooms" or "2-3 bedrooms" or "5+ bedrooms". On the results page will be an advanced filter with lots of configurable settings. Right now we have that as a range slider but I don't like it, especially when a majority of the time users choose a single value anyway.

My favoured idea right now is to use 5 "buttons" as pseudo checkboxes, although there is a downside here that it allows users to enter "invalid" inputs such as 2 and 4 selected but not 3. I'm still leaning towards this as I think only a small fraction of users would ever change the values after they have inputted them initially.

Are there any other options I should be considering?

Improve this question
1
  • 1
    Why do you say that having 2 and 4 but not 3 is invalid? Surely it can't be invalid if that is actually what the user wants. (Perhaps they need to have either 3 or 5 bedrooms so their four kids either each have their own room or have exactly one roommate.)
    – AJMansfield
    Jun 29, 2014 at 21:11

2 Answers 2

Reset to default
1

Well, using some javascript it should be possible to enhance either the range or the checkbox idea. If you use buttons (based on checkboxes) you could have it so you can easily preview what will happen if you click:

  • if all are unselected, the one clicked/tapped will be selected
  • if you hover on any of the remaining unselected options, show the range that would be selected (so, one first selects 3, than if hovering on 4 it highlights 4, and hovering on 5 would highlight 4 and 5)
  • if hovering over a selected value at the edge: show it to be unselected
  • if hovering over a selected value and more than two options are selected, take the direction of entrance into account (2-3-4 are selected, if coming from the 2, unselect 2 and 3, coming from 4, unselect 4 and 3.)

For touch, the clickbehavior would be largely the same, people will figure it out, only the unselect in the last case would just guess (test to see which is more likely and then always remove either the lower limit or the top). You should also allow swiping.

There are javascript/jquery plugins that can help you with the direction, and most likely also to swipe.

Improve this answer
1
  • I like this idea and will be implementing it using buttons.
    – rgareth
    Jun 29, 2014 at 20:42
1

Is there any reason why you can't repeat the same text field on your results page?

  • It sounds like you have the solution working already
  • I can't see it taking up that much more space than a slider
  • It's consistent with what the user entered before, so it should be clear to them how to update it
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.