Как упростить 6 необязательных полей с помощью переключателей
Вашая форма содержит много необязательных полей для заполнения? Цель необязательных полей — предоставить пользователям более персонализированный сервис и опыт. Однако, если представить их неправильно, это снизит процент завершения формы.
Распространённая ошибка — отображать необязательные поля так же, как и обязательные. Важно различать эти типы полей, чтобы минимизировать трение. Пример ниже показывает шесть необязательных полей в трёх секциях, открыто представленных в форме.
Такое представление может показаться нормальным, но когда необязательные поля идут вместе с обязательными, форма перегружает пользователя. В результате начальная когнитивная нагрузка становится слишком высокой, что может привести к отказу от заполнения формы и неудовлетворённости пользователя.
Ключевое отличие необязательных полей в том, что они условные. Другими словами, они не применимы ко всем, и не каждому пользователю нужно их заполнять. Поэтому представление таких полей открыто, как обязательных, тратит их когнитивные ресурсы.
Вместо этого следует снизить начальную когнитивную нагрузку, скрывая такие поля за переключателями (toggle switches). Этот подход может показаться необычным, так как переключатели чаще встречаются на страницах настроек. Однако, они являются эффективным способом отображения необязательных полей.
Заголовки от первого лица
Первый шаг к такому подходу — переписать заголовки разделов от первого лица и разместить рядом с ними переключатель.
• "Особые требования" → "У меня есть особые требования"
• "Иностранный участник" → "Я иностранный участник"
• "Приглашение партнёра" → "Я приведу партнёра"
Так как нажатие переключателя означает подтверждение, пользователи будут включать его, если условие им подходит. Если условие не актуально, они просто его не тронут. В результате когнитивная нагрузка возникает только тогда, когда необязательные поля действительно нужны.
Этот подход позволяет пользователям сосредоточить больше когнитивных ресурсов на заполнении обязательных полей. Форма выглядит короче и не кажется перегруженной с первого взгляда, чего нельзя сказать о варианте с открытыми необязательными полями.
Последовательное раскрытие информации
Пользователи будут включать только те переключатели, которые им подходят, и игнорировать остальные. Таким образом, этот подход представляет собой форму последовательного раскрытия информации, которое, согласно исследованиям, снижает когнитивную нагрузку.(источник)
Еще одно преимущество такого метода — отсутствие необходимости помечать заголовки как "(необязательно)". Меньшее количество текста в форме также снижает когнитивную нагрузку. Пользователи не видят необязательных полей, которые к ним не относятся — они видят только те, которые раскрываются при включении соответствующего переключателя.
Переключатель vs Флажок
Некоторые дизайнеры могут подумать об использовании флажка (checkbox) вместо переключателя. Однако это не лучший вариант, так как пользователи часто не замечают или игнорируют флажки. Кроме того, текстовые метки рядом с ними обычно мелкие и трудночитаемые
Переключатели с заголовками в первом лице — гораздо более удобный подход. Текст легче читать, а сами элементы более заметны и кликабельны. Переключатели также обладают наглядностью, показывая, что изменения вступают в силу сразу после нажатия. Появление полей при включении переключателя соответствует этому принципу
Важно понимать, что переключатели не заменяют флажки. Это изящный способ отображения условных и необязательных полей в формах. Однако эта техника никогда не должна применяться к обязательным полям.
Заключение
Не заставляйте пользователей думать, что необязательные поля являются обязательными. Они не должны визуально мешать обязательным полям. Если это происходит, внимание пользователя рассеивается, и выполнение задачи становится сложнее.
Переключатели — это эффективный способ скрыть условные разделы формы и избежать этой проблемы.