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.

Below are two options for a multiple selection widget.

The drop down is very similar to Gmail when you add multiple recipients. The shuttle control is very common in a lot of enterprise software which is what I'm designing for.

What do you guys think of each option? What are the pros and cons of each one?

enter image description here

share|improve this question
1  
How much screen space do you have, because this is obviously one of the difference between the two approaches. –  Michael Lai Mar 17 '13 at 23:43
    
@MichaelLai. You are right the space is definitely one factor. But We are doing the comparison without worrying too much about that but merely on the selection experience. –  wcdomy Mar 18 '13 at 4:11
    
Well, the other thing is that you have a 'Select All' and 'Remove All' feature. How will you do that for the dropdown? –  Michael Lai Mar 18 '13 at 6:34
    
@MichaelLai Users need to use keyboard shortcut. I know it's not convenient but it's a very very rare case. Our goal is to make selecting a couple values easy. –  wcdomy Mar 18 '13 at 6:53
add comment

1 Answer

While the dropdown looks more simple, I would go for the second option. The reasons are:

  • the use of a visually and functionally separated module should help users to focus on the task of selecting the names from the list (you can use a semi-transparent layer over the rest of the interface while the shuttle control dialogue is open)
  • the list of already selected users to the right will not shift the dropdown list down after adding a person
  • the lists height can be way higher in this approach, as it is triggered as a modal view, while when using a dropdown it would depend on other elements of the interface (dropdown would have to adjust to the rest of the interface). The higher the lists, the less need of scrolling inside of them and more effective selection review made by the user.
  • actually, you can use almost full application window size to display this modal if necessary
  • aditional buttons [Select all] and [Remove all] can be very handy

I can see just one disadvantege, which is triggering a new view in general, but I think it is not important considering the pros.

By the way, in my opinion it will be more natural if you put the Cancel and [Done] (in this order) in the bottom right corner. Refer to this question: Submit Buttons on the Left or the Right?

share|improve this answer
add comment

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.