Стратегии работы с ошибками в цифровых продуктах

Хороший дизайн помогает пользователям избегать ошибок и восстанавливаться после них. Однако далеко не все цифровые продукты справляются с этой задачей.

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

Однако на моем пути встретилась одна небольшая UI-проблема:

В этой форме слишком легко случайно нажать на кнопку Reset (Сбросить) вместо Calculate (Рассчитать).

Я ввел все свои данные и нажал на кнопку Calculate (Рассчитать), чтобы узнать, сколько еще мне осталось жить. Однако вместо этого я случайно попал по кнопке Reset (Сбросить). Как видно на скриншоте выше, эти две кнопки оформлены одинаково. Подписи трудно прочитать из-за низкой контрастности (средне-серый на светло-сером и всё это на еще более светло-сером фоне). Кроме того, они фактически прилеплены друг к другу, что необычно для дизайна интерфейсов.

Но, что самое главное, — призыв к действию «Calculate» размещен прямо под кнопкой Reset. Я инстинктивно нажал на кнопку, расположенную ближе всего к этой большой черной подсказке. В итоге все мои ответы стерлись, и мне пришлось начинать процесс заново.

На этом сайте пользователю слишком легко совершить ошибку. Такие недочеты раздражают. Возможно, я единственный случайно нажал на «Сброс», и тогда это моя личная проблема, но я в этом сомневаюсь. Даже неформальное юзабилити-тестирование могло бы выявить риски, связанные с подобным расположением элементов управления.

Чтобы улучшить этот дизайн, достаточно трех простых изменений:

• Сделать отступ между кнопками «Рассчитать» и «Сбросить» и расположить призыв к действию рядом с соответствующей кнопкой. В качестве альтернативы можно полностью отказаться от подсказки «Calculate», поскольку на кнопках есть понятные подписи.

• Оформить кнопки «Рассчитать» и «Сбросить» по-разному, например, сделать кнопку целевого действия (Calculate) более крупной и зеленой, а кнопку деструктивного действия (Reset) — красной и меньшей по размеру.

• Защитить пользователей от ошибок, попросив их подтвердить деструктивное действие, в этом случае — удаление всех введенных данных. На случай, если они по неосторожности выберут не ту опцию.

Будь то программное обеспечение или физический объект, хорошо продуманный интерфейс облегчает правильное использование продукта.

В первом случае текстовые подсказки и пункты меню должны быть написаны понятным, простым языком. Дизайнер должен предусмотреть возможность возврата к предыдущему экрану или повторного выполнения задачи, желательно без ввода уже предоставленной информации. Поля отображаются в логическом порядке, а подходящие значения очевидны благодаря четкой структуре (выпадающие списки и другие элементы управления) и сопровождающему тексту.

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

1. Сделать ошибку невозможной.
2. Максимально затруднить совершение ошибки.
3. Упростить восстановление после ошибки.
4. Просто позволить ей случиться. (Пожалуйста, не делайте так).

(1) Сделать ошибку невозможной

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

Главное, позаботиться о том, чтобы все эти значения действительно были корректными. Я видел выпадающие списки для даты истечения срока действия кредитной карты, которые включали более ранние годы, чем текущий. Я видел элементы управления, которые позволяли пользователю вводить несуществующие даты, например 30 февраля. Наличие подобных недопустимых значений — прямой путь к ошибкам при обработке данных.

(2) Максимально затруднить совершение ошибки

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

Одно из решений — обозначить кнопки в диалоговом окне так, чтобы каждый вариант логически отвечал на поставленный вопрос. Слишком часто в сети попадаются кнопки с невнятными текстовыми метками OK (продолжить) и Cancel (отменить). Я также встречал подписи «Принять» и «Отклонить», которые не дают никакого понимания о том, что именно произойдет дальше, поскольку они не отвечают на вопрос, который система задает пользователю.

Предположим, я пытаюсь отменить подписку на журнал, и на экране появляется это диалоговое окно:

«Вы уверены, что хотите отменить подписку на журнал?»

Что произойдет, если я нажму на кнопку «Отменить»? Это закроет диалоговое окно или подтвердит мой запрос на отмену подписки? Я не уверен. Формулировки типа «Да, отменить» и «Нет, оставить» дают более однозначный ответ на поставленный вопрос и вызывают меньше путаницы.

Еще один способ минимизировать ошибки — не заставлять пользователя дважды вводить одну и ту же информацию. Это занимает в два раза больше времени и удваивает вероятность совершения ошибки. Например, если в форме есть два отдельных поля для адреса доставки и адреса выставления счета, предоставьте людям возможность указать, что они одинаковые, поставив галочку в соответствующем чекбоксе.

(3) Упростить восстановление после ошибки

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

Надежность — это характеристика, которая описывает, насколько хорошо продукт справляется с неожиданными данными, событиями и условиями работы. Она значительно повышается, когда в интерфейсе есть многоуровневая функция Undo/Redo (отменить/повторить) и четкая обратная связь, которая помогает пользователям исправлять ошибки.

Меня выводит из себя, когда я ввожу недопустимый символ в какое-то поле ввода, например, при создании пароля или имени файла, а система отвечает «некорректные данные» или «операция не удалась». Программа точно знает, в чем проблема, так почему бы не сказать мне, какой именно символ нужно заменить? Содержательные сообщения об ошибках гораздо удобнее и эффективнее, как и четко прописанные требования к заполнению.

(4) Просто позволить ошибке случиться

Худший вариант — просто позволить ошибке произойти и оставить пользователя разбираться с последствиями. Предположим, человек инициирует сценарий, сопряженный с определенными предварительными условиями, которые должны быть выполнены, чтобы система справилась с задачей. Программное обеспечение должно проверить эти предварительные условия и при необходимости помочь с их выполнением, а не бездумно действовать и надеяться на лучшее. Дизайн должен выявлять потенциальные барьеры, которые могут помешать работе, как можно раньше, чтобы не тратить время пользователя.

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

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

Спасибо за внимание!