Los Switches o Toggles, se llaman de forma diferente dependiendo del sistema de diseño, son componentes que permiten con una sola interacción del usuario cambiar o alternar un estado.
Es un interruptor que sirve para ayudar a las personas a elegir entre dos valores opuesto que afectan al estado del contenido de una página, pantalla o vista.
Qué es un Switch o Toggle y cuándo se usan
Un Switch o Toggle, es un componente dentro de un sistema de diseño para generar interfaces digitales que, simula un interruptor del mundo físico.
Este tipo de componente permite a los usuarios que elijan entre dos opciones. Siempre, una opción excluirá a la otra y tendrán un valor predeterminado. Los Switches o Toggles proporcionan resultados inmediatos a los usuarios al interactuar con ellos.
Un Switch, permite a los usuarios cambiar el estado de las funcionalidades o preferencias del sistema. En ocasiones pueden llegar a reemplazar dos botones Radio Button o un Checkbox para elegir dos estados completamente opuestos.
Los Checkboxes y Radio Buttons pueden llegar a generar confusión a los usuarios. Por este motivo es importante valorar, siempre que sea posible, sustituirlos por Switches o Toggles siempre que cumplan funcionalmente con las condiciones adecuadas para tal caso.
Básicamente, como norma, se puede definir que un Switch o Toggle puede ser usado cuando cumpla con los sientes requerimientos funcionales:
- Sólo existe una opción disponible.
- El usuario puede realizar 2 selecciones (activar / desactivar).
- Hay una opción predeterminada.
- Las opciones se excluyen mutuamente.
- Tras la interacción del usuario el cambio o efecto es inmediato.
Aspectos claves y recomendaciones para usar Switches y Toggles en una interfaz
A continuación podemos encontrar algunas pautas definidas, por Alita Joyce, sobre los Switches o Toggles:
- Los switches tienen que tener un efecto inmediato. Al interactuar con el componente y cambiar de un estado al otro el sistema debe devolver una respuesta a través de la interfaz al usuario.
- No debe de requerir al usuario que haga clic en ningún componente más, como puede ser un botón, para aplicar el cambio de estado del Switch o Toggle.
- Los label o etiquetas que acompañan al Switch deben ser concisas y contextualizar su funcionalidad. Las etiquetas deben de describir lo que hará el Switch en su estado activo.
- El diseño del Switch debe utilizar colores significativos que ayuden a representar el estado del mismo. Su forma o diseño visual ya está estandarizado por numerosos sistemas de diseño. Hay que utilizar un diseño familiar.
- Deben de funcionar de forma consistente y coherente en todo el producto digital.
Créditos
La imagen de cabecera.
Toggle-Switch Guidelines
Toggles
Switches toggle the state of a single item on or off