Los controles de selección permiten a los usuarios móviles seleccionar opciones, activar y desactivar la configuración, elegir fechas o un rango de fechas. Algunos controles pueden parecer intercambiables, pero su aplicación incorrecta puede aumentar drásticamente el coste de interacción.

Los controles de selección correctamente diseñados ayudan a los usuarios a avanzar con sus tareas sin siquiera darse cuenta del proceso. Las casillas de verificación, los botones de opción o las palancas mal aplicadas impiden a los usuarios y ralentizan su flujo, obligándolos a aplicar esfuerzos mentales o físicos adicionales que resultan en frustración y, finalmente, abandono.

Casillas de verificación

Las casillas de verificación son componentes de la interfaz de usuario que permiten la selección de opción múltiple simultáneamente y también permiten a los usuarios habilitar o deshabilitar una opción. Cuando están activadas, las casillas muestran una marca de verificación en su interior. Cuando están deshabilitados, están vacíos. A veces, los diseñadores también utilizan un estado indeterminado para las listas de varios niveles para indicar que las opciones subordinadas tienen diferentes estados (habilitados, deshabilitados o en blanco).

Las casillas de verificación son similares a los interruptores de alternancia, pero estos controles tienen diferentes escenarios de aplicación. Utiliza las casillas de verificación para:

• Acciones que requieren la revisión final de los usuarios y entran en vigor después de la confirmación haciendo clic en el botón Enviar (o en cualquier relevante).
• Formularios que tienen otros pasos que los usuarios deben seguir después de seleccionar/deseleccionar las casillas de verificación.
• Listas de selección múltiple de opciones en una categoría.
• Acciones que requieren un estado de encendido/apagado visualmente claro.

Al diseñar casillas de verificación, debes atenerte a las recomendaciones aplicables a otros controles, como los botones. Las casillas de verificación deben tener una forma y un estilo reconocibles de iconos y un tamaño de objetivo táctil accesible.

Las etiquetas de las casillas de verificación suelen ser cortas y rápidas para listas largas de opciones. Sin embargo, una sola casilla de verificación puede ser más descriptiva; por ejemplo, una casilla de verificación para aceptar los Términos y condiciones del producto suele ser larga y explicativa.

Botones de opción

Mientras que las casillas de verificación permiten seleccionar varias opciones, los botones de radio solo permiten una. Están vacíos cuando no se seleccionan y se llenan con un punto cuando lo están.

¿Qué deben tener en cuenta los diseñadores al diseñar botones de opción?

• Los botones de opción deben utilizarse cuando tenga al menos dos opciones mutuamente excluyentes que ofrecer.
• Organiza tus listas verticalmente con una opción por línea para una mejor capacidad de escaneo. La alineación horizontal requiere más espacio entre un botón y su etiqueta. De lo contrario, los usuarios pueden estar confundidos sobre qué etiqueta acompaña a qué botón.
• Si tienes menos de 5 opciones, utiliza botones de opción en lugar de desplegables. Requiere menos costes de interacción y tiene una carga cognitiva menor. Esto hace que los botones de opción sean una mejor opción para las interfaces móviles.
• Muestra la selección de valor predeterminada para los botones de opción. Confíe en los resultados de la investigación de los usuarios para decidir qué opción es más probable que los usuarios seleccionen.
• Permite a los usuarios seleccionar una opción tocando no solo el icono, sino también su etiqueta.