UX Notes
25.2K subscribers
56 photos
3 videos
1 file
1.09K links
Чат читателей: @uxnoteschat В соцсетях: vk.com/ux_notes и fb.com/uxnotes Вакансии: @uxwork Автор: @zGrav Est. 2016. Реклама на канале: https://uxnotes.ru/ads
Download Telegram
Николай Бабич написал, что такое чекбоксы и переключатели, как их правильно использовать и чем они друг от друга отличаются.

«Когда пользователь взаимодействует с чекбоксами (например, заполняя какую-то форму), он не ждёт мгновенной обратной связи. Изменения произойдут потом, когда он нажмёт „Сохранить“ или „Отправить“.

С переключателями всё наоборот. Когда пользователь двигает переключатель, он ожидает немедленных изменений. Мы привыкли к этому в реальной жизни: когда щёлкаешь выключателем, сразу загорается свет».

In English. #checkbox #toggle
Оксана Киселёва написала о чекбоксах и радиокнопках.

— Радиокнопки используют для списков из двух и более взаимоисключающих вариантов, когда можно выбрать только один;
— Чекбоксы — когда можно выбрать несколько вариантов или не выбрать ни одного;
— Списки вариантов располагайте вертикально, так их легче просматривать;
— Текстовую подпись размещайте рядом с селектором (квадратным у чекбокса, круглым у радиокнопки), так понятнее, к чему она относится;
— Избегайте отрицания в подписи (если вы, конечно, не адепт тёмных паттернов): «Не присылать оповещения» → «Присылать оповещения». Иногда группа из 2 радиокнопок может быть понятнее одного чекбокса;
— В группе радиокнопок один из вариантов должен быть выбран по умолчанию;
— Нажатие и на селектор и на подпись должно приводить к выбору варианта;
— Нажатие на чекбокс или радиокнопку должно приводить к выбору варианта, а не выполнению действия (для действий используют кнопки);
— Сделанный с помощью чекбоксов и радиокнопок выбор сохраняйте не автоматически, а после подтверждения пользователем (нажатие на кнопку «Сохранить» или «Применить»).

#checkbox #radio_button
Саадия Минхас написала о чекбоксах и переключателях.

— У чекбокса есть 3 состояния: выбран, не выбран, частично выбран (бывает у родительского чекбокса, у которого часть дочерних чекбоксов выбрана, а часть — нет);
— У переключателя 2 состояния: включено, выключено;
— При этом нажатие на переключатель — это одновременно и выбор опции и её включение или выключение. За включение или выключение опций, выбранных с помощью чекбоксов, обычно отвечает отдельный элемент управления (вроде кнопки сохранения);
— Используйте переключатель, если пользователь ожидает мгновенной реакции на свой выбор, результатом будет включение или выключение чего-либо, действие не нуждается в проверке или подтверждении;
— Используйте чекбоксы, если есть родительские и дочерние опции, которые можно выбирать произвольно;
— А также если надо выбрать между опциями «да» или «нет» (согласие пользователя с условиями предоставления услуг).

In English. #checkbox #toggle
Никита Прокопов написал о круглых чекбоксах [In English].

— Чекбоксы от радиокнопок отличаются тем, что они квадратные, внутри отображается галочка, когда чекбокс выбран, можно выбрать любое количество чекбоксов в группе. Радиокнопку в группе можно выбрать только одну;
— В ранних версиях операционных систем (Mac OS 7.5, 1994 год и Windows for Workgroups 3.11, 1993 год) можно встретить крестики вместо галочек;
— Но форма радиокнопок и чекбоксов отличалась уже в 90-х, и операционные системы придерживались этого правила;
— В последнее время в вебе можно было встретить радиокнопки с галочками (Twitter), а также квадратные радиокнопки с галочками (Yandex Maps);
— Веб всегда был пластичнее, но подобное стало встречаться и в нативных приложениях (Telegram for macOS);
— В некоторых продуктах (Yandex Maps, опросы в Telegram Web) рядом можно встретить радиогруппу и группу чекбоксов, которые работают по-разному (чекбоксов можно выбрать несколько), но визуально вообще никак не отличаются;
— Создатели операционных систем до сих пор придерживались изначальной концепции, но теперь в библиотеке Apple для visionOS появились круглые чекбоксы. Видимо, стройной концепции с круглыми радиокнопками и квадратными чекбоксами пришёл конец.

#radio_button #checkbox