Take the 2-minute tour ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

In a web app, let's say I have a list of options for the user to select from. I would usually use a drop down in this case,if there is a reasonably small number of options, but how should i approach this differently if there are 50 options? or 100? or 1000?

share|improve this question
2  
What's the nature of these options? Can they be categorized? –  Steve Wortham Aug 26 '10 at 22:23

5 Answers 5

up vote 11 down vote accepted

Perhaps combine a two pane approach with a search?

django admin multiselect

The UI filters dynamically on the client side as you type in the search box. I like it better than search only, because you can discover what all the options are.

For bonus points, you can construct this on the fly from a regular select/multiple control.

share|improve this answer
1  
Better than Sruly's example because of the search. Search FTMFW. –  Rahul Aug 26 '10 at 22:38

A couple of ideas:

  1. Combobox (or some kind of search with autocomplete)
  2. Divide options into groups and let the user select group first, then the option from the list which would be smaller in this case
share|improve this answer
    
+1 for search. Really the only way to do it right. –  Rahul Aug 26 '10 at 21:24

Well, if you have an app where a user can select from 1000s of options, my first response would be that you've designed something incorrectly. Try zooming out and considering the information architecture leading to so many options and see what you can do about that. Does the user really need all those choices? Can you get rid of a few for her or choose some sensible defaults? How do you deal with the paradox of choice problem?

But in more practical terms, try breaking the information up into categories and presenting them that way. I could be more helpful if I knew what information you were designing for, since that often influences what kind of visualisation or controls you can use.

Consider time zones. You can be really specific and offer each individual time zone, leading to a huge list thst you have to do some hardcore work on to make digestible for the user. Or, you can choose only the time zones nearest to most places, which might leave a few exceptional users out, but cover 99% of them.

Same thing with choosing a time for an event. Being specific means a user can choose down to the minute. 60 item dropdown menus? Or you can segment time by 5 minutes. Suddenly the user only has to choose from 12 options, and it's specific enough for the use case.

share|improve this answer

for that many options any type of multi select would be annoying. Think one wrong click and a half an hour gone.

You should use 2 boxes with arrows like thisalt text

it's not too hard to do with a few lines of JS

share|improve this answer
3  
Still doesn't help if the lefthand list has hundreds of items, though. –  Rahul Aug 26 '10 at 21:23
  1. Use a drop down with all the elements logically sorted.
    For example - a timezone list is ordered according to the offset, a country list is alphabetized.
    Moreover, make sure the user can type in the value and it'll auto suggest/jump to the correct one.

  2. Group them logically. If it's just names, you could first select the first letter and then have the subset of items that fit. It would be better if the items can be categorized logically, for example people in an organization, which nicely fit into departments, regions, etc.
    You could even have several levels deep.

share|improve this answer

Your Answer

 
discard

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.