I am designing a multiselect pattern (using on some fine js) with tight and narrow display in mind. The selectable items are displayed with facet counts. The number of items may range from a few, to thousands. I want the control to be simple and usable, while making optimal use of screen space. The basic pattern is described in the mockup. My questions are:
- In panel 1, is it helpful to show a shaded region above as the destination of selected items?
- Having the selected list above the selectable list, is that clear?
- What other simple visual cues can help to clarify which area is selectable and which is selected?
- Do you foresee any specific problems / solutions as the number of items gets large?
- the use case here is that the items in the list might not be known by the user, so having a visible list of choices is helpful for making the selection.