I'm having a hard time coming up with a solution for this. I'm working on a travel site, and one question is "How many days do you want your trip to be?"

I want to handle two cases, "7 Days" or "7-9 Days".

Having two fields is a bit awkward if they know exactly how many days they want. But can anyone come up with a cleaner, intuitive solution?

  • 7-9 days already includes 7 days. You just let users filter the results. – dnbrv Jan 11 '12 at 16:32

Since there are too many options that users can enter, why not give them freeform entry field?

ITA's (now, Google's) Matrix does just that:

Matrix varied length trip search

It even has a limit to how many nights can be selected:

Matrix varied length trip search error

However, their solution isn't perfect because users are notified of the limit only when the field is moved out of focus and some people will submit the query without changing other options. Thus, it's better to validate it in real-time.

They also handle the results of such a search very well showing on the lowest price for the departure date, graphically showing trip duration on the calendar, and giving quick access to other trip lengths starting that date.

Matrix varied length trip search results

  • 1
    I knew I was missing something obvious, thanks! Accepted your answer for finding an identical use case :) – Colin Jan 11 '12 at 17:42

Why not just go with how you've described it? Allow them to type either a single, or a range of numbers into the single field? Similar to how Microsoft Office print dialog works; you can specify single pages or a range of pages within the same field.

This concept has been around for a reasonable amount of time so isn't a new type of request to throw at a user. Provided the field is annotated correctly this should suit your situation.

Print dialog

  • 1
    Darn, Jon! You beat me to it while I was making screenshots. =) – dnbrv Jan 11 '12 at 16:17
  • 1
    But my screenshots are more relevant than yours. – dnbrv Jan 11 '12 at 16:26

On a related theme, Hipmunk uses a -/+ button to extend the date from -2 to +2 days from that entered - thus using a single field and an optional use of the button to broaden the range. Very nice feel to it - especially with the visual feedback on the calendar view.

enter image description here

  • I find this somehow less intuitive. – Kris Jan 12 '12 at 11:00

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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