4 ms·

Am I the only one who think that <switch> https://open-ui.org/components/switch https://open-ui.org/components/switch is a usability disaster? Distinguishing o

Am I the only one who think that <switch> https://open-ui.org/components/switch https://open-ui.org/components/switch is a usability disaster? Distinguishing on/off state only by color is highly non-usable. Neither from a13y perspective nor for ordinary users. And to keep in mind LTR/RTL problems if someone rely on knob position. What's wrong with classic check box for that purpose?

hanniabu 7y ago
I absolutely hate them. 80% of the time it's confusing as to which way is on/off either because of design or because of the wording for that setting/option.
- viseztrance 7y ago
  This. I almost always click on them twice to see the other state, so I can be sure it's on the correct setting.
dragonwriter 7y ago
> Distinguishing on/off state only by color is highly non-usable. All of the examples use at least color and position, the majority also add an additional icon in the checked state (one of those also has a different icon on the unchecked state) and Material Design uses a relative contrast distinction (which, unlike a simple color distinction, is readily distinguishable for the colorblind.) There is exactly one (ANT design) that uses only color and position to distinguish between checked and unchecked states.
superhuzza 7y ago
Check boxes don't imply immediate effects. They require 'saving' to take effect. Like when you're filling out a form, the checkbox doesn't do anything until the form is 'interpreted' by a human. Switches(toggles) on the other hand, imply immediate effects. Like a light switch, we expect the change to occur immediately. https://www.nngroup.com/articles/toggle-switch-guidelines/ https://www.nngroup.com/articles/toggle-switch-guidelines/
- saagarjha 7y ago
  I have never heard of or expected this from my "binary choice components". To my knowledge, switches are used on iOS, while checkboxes are a macOS thing (though they just added support for iOS-style switches, but with a very specific purpose).
  - pvg 7y ago
    I have never heard of or expected this from my "binary choice components". It's fairly standard in 'traditional' desktop UI where actions are supposed to be initiated by regular buttons and things like radio buttons and checkboxes are for setting the options of the action. "Radio buttons never initiate an action" says the classic MacOS HIG, for instance.
    - saagarjha 7y ago
      Right, but on macOS, checkboxes often apply immediately. Just look through System Preferences, which largely doesn't even have a "save" action: checkboxes have take effect instantaneously. (So do many radio buttons…)
      - pvg 7y ago
        Yep, that's why I said 'traditional', this has drifted a fair bit because there's a benefit to providing immediate feedback, especially if the action is some visual and reversible change like turning on dark mode. Windows ribbons are also full of such radio buttons and checkboxes.
      - Koshkin 7y ago
        I.e., “right, but [wrong].”
- abledon 7y ago
  thank you for clearing up the difference. Switches were always ambiguous to me in a settings page... I'm like.. so... is it saved?
aliveupstairs 7y ago
if you open iOS settings, you'll see them all over the place. They are not a usability disaster and any shortcoming in articulating intent should be attributed to the designer themselves. Switches can also be used when the binary state is not on/off and you don't want to imply a default state necessarily such as dark/light theme switches.
mtm7 7y ago
I also prefer checkboxes to switches – at least on desktop. Although anecdotally, I've helped a few older, technophobic people learn how to use websites/phones, and the majority of them know exactly what to do when presented with a switch, but they don't realize that they can click a checkbox. To them, it just looks like a square and they ignore it. (Take this with a grain of salt, my sample size is <10.)
- jiofih 7y ago
  This is especially true with the current flat design era where all you have is boxes everywhere.
imvetri 7y ago
Its an on-going work. If you strongly believe their system seems faulty, provide your solution and comments for improvements.

hanniabu 7y ago

I absolutely hate them. 80% of the time it's confusing as to which way is on/off either because of design or because of the wording for that setting/option.

viseztrance 7y ago
This. I almost always click on them twice to see the other state, so I can be sure it's on the correct setting.

dragonwriter 7y ago

> Distinguishing on/off state only by color is highly non-usable. All of the examples use at least color and position, the majority also add an additional icon in the checked state (one of those also has a different icon on the unchecked state) and Material Design uses a relative contrast distinction (which, unlike a simple color distinction, is readily distinguishable for the colorblind.) There is exactly one (ANT design) that uses only color and position to distinguish between checked and unchecked states.

superhuzza 7y ago

Check boxes don't imply immediate effects. They require 'saving' to take effect. Like when you're filling out a form, the checkbox doesn't do anything until the form is 'interpreted' by a human. Switches(toggles) on the other hand, imply immediate effects. Like a light switch, we expect the change to occur immediately. https://www.nngroup.com/articles/toggle-switch-guidelines/ https://www.nngroup.com/articles/toggle-switch-guidelines/

saagarjha 7y ago
I have never heard of or expected this from my "binary choice components". To my knowledge, switches are used on iOS, while checkboxes are a macOS thing (though they just added support for iOS-style switches, but with a very specific purpose).
- pvg 7y ago
  I have never heard of or expected this from my "binary choice components". It's fairly standard in 'traditional' desktop UI where actions are supposed to be initiated by regular buttons and things like radio buttons and checkboxes are for setting the options of the action. "Radio buttons never initiate an action" says the classic MacOS HIG, for instance.
  - saagarjha 7y ago
    Right, but on macOS, checkboxes often apply immediately. Just look through System Preferences, which largely doesn't even have a "save" action: checkboxes have take effect instantaneously. (So do many radio buttons…)
    - pvg 7y ago
      Yep, that's why I said 'traditional', this has drifted a fair bit because there's a benefit to providing immediate feedback, especially if the action is some visual and reversible change like turning on dark mode. Windows ribbons are also full of such radio buttons and checkboxes.
    - Koshkin 7y ago
      I.e., “right, but [wrong].”
abledon 7y ago
thank you for clearing up the difference. Switches were always ambiguous to me in a settings page... I'm like.. so... is it saved?

aliveupstairs 7y ago

if you open iOS settings, you'll see them all over the place. They are not a usability disaster and any shortcoming in articulating intent should be attributed to the designer themselves. Switches can also be used when the binary state is not on/off and you don't want to imply a default state necessarily such as dark/light theme switches.

mtm7 7y ago

I also prefer checkboxes to switches – at least on desktop. Although anecdotally, I've helped a few older, technophobic people learn how to use websites/phones, and the majority of them know exactly what to do when presented with a switch, but they don't realize that they can click a checkbox. To them, it just looks like a square and they ignore it. (Take this with a grain of salt, my sample size is <10.)

jiofih 7y ago
This is especially true with the current flat design era where all you have is boxes everywhere.

imvetri 7y ago

Its an on-going work. If you strongly believe their system seems faulty, provide your solution and comments for improvements.