39
votes
Accepted
Best way to find and select a country
How about just using a Combo Box?
download bmml source – Wireframes created with Balsamiq Mockups
By a user being required to just choose what country they are from, it removes the unnecessary ...
39
votes
Accepted
Is there a good way to communicate choose at least one?
The normal way to solve this problem is to use validation (or errors as you put it).
I would not advise mixing control types within a single field as it's overly complex and confusing to a user who ...
33
votes
Accepted
What is the most appropriate way to ask a user to select a few (10 for example) categories from a list of thousands to proceed with the app?
I would suggest creating a short list of broad "top-level categories" that every other category can be grouped into (maybe around 20 of them). For example:
Technology, Art, Leisure, etc.
...
26
votes
What is the most appropriate way to ask a user to select a few (10 for example) categories from a list of thousands to proceed with the app?
This is a frame challenge. What you ask for is impossible.
If you require users to select ten categories of interest before you let them access the app, most users will not proceed beyond that step. ...
21
votes
What is the most appropriate way to ask a user to select a few (10 for example) categories from a list of thousands to proceed with the app?
This sounds like a job for a type-ahead -- the user starts typing a category of interest, and the system returns valid responses that can then be selected.
Bonus points if you account for fuzzy ...
15
votes
Multiple selection
I actually think your slider idea is not that bad and might be interesting.
Depending on how effortless the implementation has to be, it can also be a simple dropdown in the end:
Edit
Ok, in response ...
14
votes
Accepted
Selecting multiple folders
I am as surprised as you that users have difficulties to add a folder with this standard dialog window. But users are surprising, that is why we like them
I don't think there is a perfect solution ...
14
votes
Selecting age between 6 and 18
One idea: draggable multiple range sliders
Instead of 13 checkboxes you could use one slider, on which the user can select multiple ranges and single values.
See an example of such a slider here: ...
13
votes
Accepted
What control should I use to indicate multi-select lists on iOS?
Apple likes switches
Sliding switches were a nifty looking control way back when. They were one way for iOS to announce
"Hey, look! I like gestures. You should swipe stuff."
In a short list ...
12
votes
Selecting multiple folders
I have nothing but anecdotal evidence, but I know exactly what the issue is.
Average people don't know where their files are.
I'm going to broadly group everyone into two categories.
Power users
...
12
votes
Is there a good way to communicate choose at least one?
If you can dynamically add question fields, then another solution is to break it into stages:
1) Ask the null state question first with radio buttons.
2) If the option(s) which requires multiple ...
11
votes
How do I display an 'all' option to users in a multi-select box?
Your "All" option needs to be first, not last. Otherwise a user who needs all airlines might go through the list and tick all of them before he gets to the end of the list and sees that he could've ...
11
votes
Accepted
Selecting age between 6 and 18
Maybe something like this could work:
Since you have such a small number of options just make them large, press-able buttons which display a checkmark once you tap them.
This list obviously scrolls ...
9
votes
Selecting Multiple USA States from List
Whatever design you choose, think about placing some container which displays the current selected items, so that way users won't have to remember what they've selected previously by themselves, ...
9
votes
Accepted
Radio input appearance for mixed values
Short answer: do not select any radio button. Leave them all unselected.
However:
This is a misuse of radio button control where (by convention) there always should be one (and only one) selected ...
9
votes
Accepted
What is the name of this moveable multiselect list?
What names are there?
Microsoft calls this a List Builder. As does the 2006 book 'Designing Interfaces' by O'Reilly.
Google calls this in Material Design UI a "transfer list" (or "shuttle").
...
9
votes
Accepted
Does Material Design have a guideline for styling a "select all" checkbox?
Try combining the section header title and master checkbox above the list.
I'm not sure what the rest of your ui looks like, but oftentimes a selectable list has the 'select all' up along the table ...
8
votes
iOS - multiple selection
Keep it simple: use radio buttons.
Checkboxes and your rules governing what can be selected and when will be confusing for both your users and programmers alike. Someone will try to select only ...
7
votes
Accepted
Multi-selection dropdown list implementation best practice
Thoughts on drop-down lists:
I think all dropdown including the multi-select lists have probably reached the end of the line. Their versatility also proved to be their Achilles heel:
Drop-down menus ...
7
votes
What is the best way to contain 20 or more checkboxes in form
Ergonomically it would be best to make the dropdown with height that shows all checkboxes at once. However, this is a bit extreme, and will take a lot of horizontal space. You should do that only if ...
7
votes
Alternative to Radio buttons
What about a drop-down a.k.a combobox?
download bmml source – Wireframes created with Balsamiq Mockups
There can be as many options as you like (it is dynamically sized), if the options don't ...
7
votes
Is this a good concept: "Select one or multiple items using checkboxes and use a radio button to select all"?
Hmm, I'm finding your prototype quite confusing to use. I find it very confusing that, after selecting all the values, it automatically deselects them and selects the "All" button at the top. Also, ...
7
votes
Multiple selection
If you want to avoid the sliders, you can just opt for a very simple grid of checkboxes/radio buttons.
Something like this:
This makes it very easy for the user to understand exactly which options ...
6
votes
Accepted
What are some creative patterns for viewing and selecting individual items in a large non-hierarchical list?
A couple of months back we did an overhaul of a multiselector that looked exactly like the wireframe shown in your link: two fields, one populated with items and the other one for selected items. (and ...
6
votes
What is the best UI for multi-selecting from a list?
Depending on the number of options, you could go with a graphical drop-down list option like the following. Tapping/clicking toggles whether that item is selected.
This doesn't work very well with ...
6
votes
Accepted
What is the best way to allow users select items from a very long list in a responsive web app?
For very long lists, it's better to use a different UX for mobile
Multi-select is a complex operation, so it's difficult to use the same interface for both web and mobile. You already recognize this ...
6
votes
Best way to find and select a country
Definitely a dropdown list with the autocomplete (you press C, list scrolls to Czech Republic). One list for a region, the other one below that reacts to first one, for the country. If there is no ...
6
votes
Accepted
Is it a good practice to remember checkbox selection across multiple pages in a grid?
In general: NO
This is really bad UX: creating actions that affect other pages the user can't see and maybe don't remember is the definition of an anti-pattern. You'll always need to make sure that ...
6
votes
iOS - multiple selection
No B check box until they select A
No C check box until they select A and B
6
votes
Accepted
What's the best UI to use when asking a user for a negative selection (i.e. avoid X)?
You're overthinking this and causing some kind of weird double negative. You're asking for active user input - in order to deselect - what the user doesn't want. That is a very confusing anti-pattern.
...
Only top scored, non community-wiki answers of a minimum length are eligible
Related Tags
multi-selection × 295selection × 64
checkboxes × 47
forms × 33
gui-design × 29
lists × 29
dropdown × 20
usability × 19
interaction-design × 17
filter × 17
drop-down-list × 16
mobile × 15
radio-buttons × 13
website-design × 12
web-app × 12
tables × 12
tree × 11
grid × 10
design-patterns × 9
controls × 9
input-fields × 8
input × 7
hierarchy × 7
navigation × 6
user-expectation × 6