Илья
23 августа 2016
Советы почтой каждую неделю
Пожалуйста, получите наше письмо, чтобы подтвердить свой адрес:
Вы подписаны на «Советы за неделю»:

Расскажите об обратной связи в интерфейсе

(Часть первая)


У меня в почтовом отделении работает электронная очередь. У входа стоит машинка с единственной кнопкой. Нажимаешь кнопку, и через две секунды на чековой ленте печатается номерок.

Эти две секунды — целая вечность. Многие решают, что кнопка не сработала, и жмут ещё раз. Рядом с машинкой всегда валяются «лишние» номерки. Если бы машинка делала хоть что-то сразу в ответ на нажатие — издавала звук или мигала лампочкой — такой проблемы бы не было.

Действия пользователя должны вызывать в интерфейсе адекватную и заметную реакцию — обратную связь.

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

Компьютер заменяет символы пароля точками:


Чтобы скрыть пароль достаточно было бы просто ничего не выводить, как это происходит в командной строке:


Но появляющиеся по мере ввода точки говорят пользователю, что символы вводятся, программа не зависла.

О подсветке ссылок при наведении

Если пользовать запускает длительную операцию, компьютер показывает, что она ещё не закончена, например, с помощью анимированного индикатора:


Ещё лучше, если индикатор показывает степень завершённости и оставшееся время:


Интернет-магазин «Самсунга» одним из первых научился добавлять товары в корзину без перезагрузки страницы. Добавление сопровождалось изменением кнопки и подписи:


Если бы добавление происходило без таких изменений, человек бы нажал пару раз на кнопку, решил бы, что сайт не работает, и ушёл бы, оставив в корзине два холодильника.

Но обратная связь не должна быть слишком грубой. Если каждое добавление в корзину сопровождать появлением диалогового окна, покупателю это быстро надоест:


Об индикаторах загрузки

О повышении информативности через добавление полезной информации

Когда пользователь ошибается в пароле, Мак не выводит сообщение об ошибке, а просто «покачивает» полем ввода, как бы говоря «нет».

В совете о привычках мы обсуждали это окно Фотошопа, которое появляется, если выделить прозрачную часть слоя:


Это окно призвано предотвратить ошибку, но больше похоже на наказание за небезупречность в движениях. В данном случае достаточно было бы сообщить о произошедшем, скажем, в строке состояния, и не требовать нажатия кнопки «OK».

Непрерывный писк сканеров на кассах супермаркета сводит с ума. Когда-нибудь его заменит тактильная обратная связь вроде той, что используется в часах Эпл.

Иногда вместо явной отрицательной реакции достаточно отсутствия положительной. При перетаскивании мышью Мак выделяет области, в которых можно «бросить» объект:


Отсутствие выделения означает невозможность перетаскивания в текущую точку. Виндоус в этой ситуации показывает явный кукиш в виде зачёркнутого курсора:


Продолжение

Математика в дизайне: как покачивание формы реализовано в «Эгее»

P. S. Я проведу практический курс «Пользовательский интерфейс и представление информации» 22, 23, 24 и 26 апреля в Москве

 

Запись открыта до ВС 16 апр


Поделиться

Комментарии

Марина Сафонова
8 февраля 2017

«Непрерывный писк сканеров на кассах супермаркета сводит с ума. Когда-нибудь его заменит тактильная обратная связь», — по-моему, писк сканера на кассе — для покупателя, а не для кассира. Чтобы кассир не пробил случайно или специально один и тот же товар два раза. У меня случалось такое, теперь слежу за писком сканера.


Цель рубрики — обсуждение вопросов дизайна всех видов, текста в дизайне и взаимоотношений дизайнеров с клиентами.

Мы публикуем комментарии, которые добавляют к уже сказанному новые мысли и хорошие примеры. Мы ожидаем, что такие комментарии составят около 20% от общего числа.

Решение о публикации принимается один раз; мы не имеем возможности комментировать или пересматривать свое решение, хотя оно может быть ошибочно. Уже опубликованные комментарии могут быть удалены через некоторое время, если без них обсуждение не становится менее ценным или интересным.

Вот такой веб 2.0.





Недавно всплыло

3 Это я неправ, что долго думал, или магазин, что допустил такую ситуацию? 3 Столкнулся с проблемой, когда долго общаешься с клиентом, и потом выясняется, что его не устраивает порядок цен. Часть 1 2 Как флексить. Отступить от идеала 2