Формы предоставляют элементы управления, облегчающие сбор данных от пользователей. Использование правильного элемента управления в нужном месте является сложной задачей разработки форм.
Флажок (сheckbox) имеет три состояния: невыбранный, выбранный и неопределенный. Последнее состояние представляет собой ситуацию, когда список подопций группируется под родительским параметром, а подопции находятся как в выбранном, так и в невыбранном состоянии.
Переключатель (toggle) представляет собой физический тумблер, который позволяет пользователям включать или выключать вещи, например переключатель освещения.
При выборе между флажком и переключателем лучше сосредоточиться на контексте использования, а не на их функции.
Ниже приведены несколько вариантов использования, а также рекомендации по выбору между этими двумя элементами управления при разработке формы.
Пример 1: Мгновенный ответ
Используйте тумблер, если:
- Требуется мгновенная реакция на примененные параметры.
- Для отображения результатов настройки функций вкл/выкл или показать/скрыть.
- Пользователю необходимо выполнять мгновенные действия, не требующие проверки или подтверждения.
Пример 2: Подтверждение настроек
Используйте флажок, если:
- Настройки должны быть подтверждены и проверены пользователем перед отправкой.
- Определенные параметры требуют действия, например «Отправить», «ОК», «Далее», «Применить» перед отображением результатов.
- Пользователь должен выполнить дополнительные шаги, чтобы изменения вступили в силу.
Пример 3: Множественный выбор
Используйте флажок, если:
- Доступны несколько опций, и пользователю необходимо выбрать один или несколько параметров.
- Нажатие нескольких переключателей по очереди и просмотр результатов после каждого щелчка занимает дополнительное время.
Пример 4: Неопределенное состояние
Используйте флажок, если:
- Неопределенное состояние требуется, когда несколько вложенных параметров сгруппированы в родительский параметр. Неопределенное состояние будет показывать, что в списке выбрано несколько подопций (но не все из них).
Пример 5: Ясное состояние
Используйте флажок, если:
- Существует вероятность путаницы с состоянием тумблера вкл/выкл. Иногда становится трудно понять, отображает переключатель состояние или действие.
- Нужно четко показать выбранное или невыбранное состояние. (Прим. пер. - Эта проблема может быть решена с помощью хорошего дизайна переключателя. Отображение доп. описания включения/выключения повысит ясность. У Microsoft есть хорошая идея: https://docs.microsoft.com/en-us/windows/uwp/design/controls-and-patterns/toggles)
Пример 6: Похожие элементы
Используйте флажок, если:
- Пользователю нужно выбрать опцию(и) из списка похожих элементов.
Используйте тумблер, если:
- Пользователь переключает независимые функции и режимы.
Пример 7: Один вариант
Используйте флажок, если:
- Дается выбор да/нет.
- Только один вариант может быть выбран или отменен, и его смысл очевиден.
Используйте тумблер, если:
- Нужен один выбор, и вы хотите предложить выбор включения/выключения.
Заключение
Важно поставить правильный элемент в нужном месте в форме, чтобы сделать её удобной для пользователя. Поскольку формы могут быть очень длинными с большим количеством опций, для пользователя утомительно, если он должен сделать дополнительные клики, чтобы заполнить всю информацию. Представленные примеры и рекомендации помогут вам выбрать между флажком и переключателем при добавлении элементов в ваши формы.