Возьмём сложный продукт, автоматизирующий бюрократию. Все углы уже срезаны, остался только необходимый минимум форм, которые заполняют люди с низким уровнем подготовки и гибкости. Перед использованием продукта они проходят обучение.
Как улучшить UX продукта, когда пройдены уровни структуры и компоновки? И сделать это минимальными силами разработчиков (то есть без геймификации и машинного обучения).
Сделать понятнее:
Сделать быстрее:
Сделать приятнее:
Если в интерфейсе задействованы плейсхолдеры, стоит поискать типовые ошибки:
1. Чтобы уменьшить визуальный шум и сэкономить место, дизайнеры иногда размещают подпись в плейсхолдере. Такое решение нагружает краткосрочную память и затрудняет перепроверку заполненных форм:
Старая форма заказа dostaevsky.ru (в новой форме подписи расположены над полями).
В примере с сайта dostaevsky.ru на самом деле есть подпись — «Адрес доставки». Проблема со второстепенными подписями (secondary labels) к полям, разделяющим адрес на «улицу», «дом» и так далее. Отображать их лучше так:
Также можно использовать плавающую подпись (floating label):
Форма входа tinkoff.ru.
2. Образец заполнения помогает пользователю понять, что нужно ввести в поле. Если образец оказывается в плейсхолдере:
3. В плейсхолдере иногда сообщают требования к вводимому тексту. В этом случае к указанным выше проблемам добавляется отображение объёмного текста. Есть много других способов сообщить требования:
4. Пустое текстовое поле призывает ввести данные. Плейсхолдер должен быть менее контрастным, чем введённый текст:
Но при этом оставаться читаемым:
5. Не прячьте плейсхолдер сразу после того, как пользователь нажал на текстовое поле или переключился на него табом. В первом случае нагружается краткосрочная память. Во втором, скорее всего, пользователь переключит внимание на поле только после нажатия на таб и плейсхолдер просто не заметит.
Показывайте плейсхолдер, пока пользователь не начал вводить текст.
…
Из статьи Эндрю Койла «Alternatives to Placeholder Text».
Первая рекомендация в моём списке — тюнинг микротекста. Плейсхолдеров это тоже касается.
На sports.ru в текстовом поле для комментирования новости был плейсхолдер «А вы что об этом думаете?» — как когда-то на Ютубе.
Его замена на «Можете что-то добавить?» увеличила количество комментариев в 1,74 раза. Сегодня они используют текст «Что думаете о происходящем?», который проиграл лидеру, но тоже обошёл исходный — в 1,64 раза.
В разделе «Блоги» плейсхолдер «Есть возражения?» принёс комментариев в 1,58 раза больше, чем «Поддержите автора…». Правда, сейчас на сайте непонятно почему стоит именно исходный вариант.
Регулярно возвращайтесь к служебным текстам, устаревают даже лучшие.
…
Из записи в блоге Михаила Калашникова «Почему важно выбирать слова».