Single value selection

The user needs to pick a single value from a list of available options.

Problem

The user needs to pick a single value from a list of available options.

Solution

Use this when the user has to choose only one value from a number of available options.

Present the appropriate control based on the data type. If the user needs to pick from a list of text values, use a select list or combo-box. If the list of available options is short (2-5 values) present it as a segmented control or radio button list. If a visual representation of the problem helps the user decide use additional images or iconography.

Make the selected value stand out and easily recognizable.

If the options in the select menu have a hierarchy it is advisable to split them into groups. This allows the user to pick quicker by scanning the group first.

  • Select
  • Segmented
  • Radio button
  • Image
  • Grouping
Showing 5 live examples
Select
Select
Segmented
Single select
Text and Icon
Icon
Segmented
Radio button
On Startup
Snooze tabs on inactivity
Other Settings
Radio button
Image
Image
Grouping
Grouping

Problem

The user needs to pick a single value from a list of available options.

Solution

Use this when the user has to choose only one value from a number of available options.

Present the appropriate control based on the data type. If the user needs to pick from a list of text values, use a select list or combo-box. If the list of available options is short (2-5 values) present it as a segmented control or radio button list. If a visual representation of the problem helps the user decide use additional images or iconography.

Make the selected value stand out and easily recognizable.

If the options in the select menu have a hierarchy it is advisable to split them into groups. This allows the user to pick quicker by scanning the group first.

Share in SMS
  • SMS