Hot answers tagged

115 votes

Boolean switch with a third state

Here: You are creating a search-filter? Just add an option that means you don't care about this filter option. male | female | doesn't matter Other names: Any Either Everyone N/A (Not Applicable)...
user avatar
  • 1,465
80 votes
Accepted

Boolean switch with a third state

If I understood correctly the premises of the question, what the user should decide is: If the user wants to consider (filter by) one of the following options If the answer to 1 is Yes, then choose ...
user avatar
  • 16.7k
65 votes
Accepted

Should a select all toggle button get activated when all toggles get manually selected?

I am not a fan of the approach you have suggested. I find that having a global toggle can be confusing. The reason for this is exactly why you are unsure and asking this question - because there are ...
user avatar
  • 6,961
63 votes
Accepted

Why does the Caps Lock not toggle upper and lower case for selected text?

History The Caps lock key origins are in the Shift lock key found on old mechanical typewriters. An early innovation with these typewriters was the introduction of a second character per type bar - ...
user avatar
  • 32k
59 votes
Accepted

Checkbox vs toggle

This has been discussed in much depth in many other related questions (see right pane on this page). So I'll make it brief. Toggle switches are anti-usability Despite their relative popularity (eg, ...
user avatar
  • 32k
55 votes
Accepted

How to indicate a checkbox/toggle is "always on"

Consider removing UI elements that have no function, and add labels to emphasize the options the user does have. For a simple form, there's a lot going on in this interface. Not only are you letting ...
user avatar
  • 8,840
48 votes

Cookies - Should the toggles be on?

Simple answer, the law states that they must be off per default. Privacy by default: https://www.ics.ie/news/what-is-privacy-by-design-a-default Accept all/reject all buttons are a nice touch, go ...
user avatar
  • 1,076
45 votes
Accepted

Toggle states display

Material Design Shows the Locked State by a greyed-out version like this: But the problem here is the accessibility. Users with vision-related disabilities won't be able to differentiate these two. ...
user avatar
  • 3,540
34 votes

Mutually exclusive Switches

The way I see this is that you have two exclusive groups of options, it just happens that the second group only contains one option. Something as simple as the word 'or' will help a lot - that way it'...
user avatar
  • 972
32 votes
Accepted

Does an on/off switch still means on/off when positioned horizontally?

I think your assumption that vertical switches are always up=on and down=off is wrong. In instances where two switches control the same thing then it is very easy for them to get out of sync. For ...
user avatar
  • 6,961
31 votes

Should a toggle button show its current state or the state to which it will change?

A reasonable compromise would be to have the button not highlighted (have a neutral background color perhaps) when it is on the off state, and highlight it (change background color) when it is in the ...
user avatar
29 votes

Mutually exclusive Switches

Your constraints limit you to only four valid choices: A and B Only A Only B Only C I would just use a set of 4 radio buttons.
user avatar
  • 399
28 votes

Boolean switch with a third state

What you're searching for is "both", "any" or "all" (in case you add more gender categories). All - Female - Male So that makes it clear that results from both (or all) genders will be included. And ...
user avatar
  • 1,166
23 votes

Should a toggle button show its current state or the state to which it will change?

There's already 18 answers here so this might be late to the party, but it makes sense to use checkboxes in such situations. Some examples: And when selected: This is similar to the "dim / lit" ...
user avatar
  • 489
21 votes
Accepted

Cookies - Should the toggles be on?

As the most highly voted answer is simply false I am writing this answer just clarify the legalities in the EU. Under GDPR there are 6 lawful bases for processing personal data. The two we care about ...
user avatar
  • 3,304
21 votes

Mutually exclusive Switches

Option 1 Note: this was the original answer before the question was updated (see comments). I think what you essentially have here is two groups. You have the "A and/or B" group, and you ...
user avatar
  • 6,961
21 votes

Mutually exclusive Switches

What I understand from the question is that A, B, and C are independently selectable but selecting C disables A or B. What is the way to graphically show three selectors where one is linked to the ...
user avatar
  • 13.6k
20 votes

Toggle states display

While having a "faded" style for disabled controls is quite standard, the problem here is that the difference is too subtle for the user to clearly see. You could change the colour from ...
user avatar
  • 6,961
16 votes
Accepted

How to represent a switch "tabbed" state in Material Design?

Just use the style is recommended on Material design | Components– Selection controls | Switch
user avatar
15 votes

Why does the Caps Lock not toggle upper and lower case for selected text?

Given your list Ctrl + B, Ctrl + U, Ctrl + I, to be consistent, if you want to convert the selected text to Upper / Lower case you should be using the Ctrl key (you also of course have Ctrl + C and ...
user avatar
  • 7,168
14 votes

How to indicate a checkbox/toggle is "always on"

Since the enabled-disabled and required-optional fields are interdependent, why not combine them to make the concept of enabled implicit? Field | Disabled Optional Required --------------+---...
user avatar
  • 636
13 votes

How should a multi-state toggle slider with more than two states be implemented?

I've used Twitter Bootstrap button groups in the past for this same idea. Since they are actually buttons, and not parts of a slide, I don't think the selected states are confusing (and you can style ...
user avatar
13 votes
Accepted

Radio buttons or Toggle switch for one out of two options?

I think you're referring to toggle switches here. That being said, Radio buttons let users select one option from two or more choices whereas a toggle switch mimics a physical switch that allows ...
user avatar
  • 3,410
12 votes

What's the difference between a toggle switch, radio buttons and a tickbox? What's the best cases these patterns can be used?

Well, it kind of depends on which system you are. There are mobile guidelines for Android, iOS and Windows. iOS, for example, doesn't use regular checkboxes (they are not called tickbox btw) or radio ...
user avatar
  • 6,716
12 votes

Boolean switch with a third state

How about adding a Third Radio button for the Third state?
user avatar
  • 16.1k
12 votes

Boolean switch with a third state

In many situations, context is really really important, and it may be sensible to look at a consistent way to do all filters, and not just the male/ female one. As the question states: The form of ...
user avatar
  • 1,434
12 votes

Should a toggle switch's label be on its left or right?

Labels on either side serve different purposes. In reading order, Labels before the switch (on the left or top for LTR languages) indicate what the switch is for. Labels after the switch (on the ...
user avatar
  • 9,407
12 votes

Does an on/off switch still means on/off when positioned horizontally?

You're possibly using a two-state switch to control three states: Off | Auto | On "Activating the switch when the fan is on will turn it off, and vice versa." Like a lightswitch in a room ...
user avatar
  • 8,027
11 votes

Checkbox vs toggle

Context might be a consideration in this debate rather than focusing purely upon the control itself. The context might be a long data-heavy survey intended to be filled in with a keyboard, or it ...
user avatar
  • 236
11 votes

Should a select all toggle button get activated when all toggles get manually selected?

Personally, I prefer to have it toggled on/off too, depending on the children state. At least with the design above, it makes sense to also change the 'parent' state, because should the user want to ...
user avatar
  • 363

Only top scored, non community-wiki answers of a minimum length are eligible