Всплывающие подсказки — зло

Перевод статьи Пулкита Агравала (Pulkit Agrawal) «Почему всплывающие подсказки — зло. И почему их нужно использовать».

Сервис Braid пригласил его исправить процесс знакомства. Положение было плачевным:

«Добавьте сюда нового участника», — блин, разве можно эту кнопку трактовать иначе?
«Добавьте сюда нового участника», — блин, разве можно эту кнопку трактовать иначе?

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

Согласно модели Б. Ж. Фогга, они делают это, когда:

  • Мотивированы, хотят это сделать;
  • Могут сделать;
  • Сработал триггер, есть повод к действию.

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

Эффективность подсказки зависит от того, кто и когда её видит.

Хороший пример в Facebook Ads.
Хороший пример в Facebook Ads.

Подсказка появилась, когда пользователь вошёл в Facebook Ads после долгого перерыва, и оказалась интересной, релевантной и ценной. Пользователь узнал что-то полезное, на что сам не обратил бы внимания, и запомнил — можно не показывать подсказку повторно.

Второй и третий шаг знакомства с обновлениями Facebook Ads.
Второй и третий шаг знакомства с обновлениями Facebook Ads.

Это отличное знакомство — короткое и энергичное, обзорное и при этом конкретное. Оно показало, что меня не держат за дурака, и быстро освободило дорогу, чтобы я перешёл к своей задаче.

Подсказки Фейсбука, Гугла, Пинтереста и других компаний эффективны в том числе за счёт отличного текста. Отчасти он появляется усилиями инженеров, которые проводят эксперименты и на практике находят хорошие формулировки.

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

Показывайте подсказки, когда они релевантны: когда нужна помощь и когда пользователь может ей воспользоваться. Иначе он окажется не готов и воспримет их как помеху при выполнении текущей задачи.

В левом нижнем углу конструктора форм Typeform — предложение ознакомиться с «крутыми штуками».
В левом нижнем углу конструктора форм Typeform — предложение ознакомиться с «крутыми штуками».

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

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

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

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

Всплывающая подсказка (уведомление в продукте) чётко предлагает узнать больше.
Всплывающая подсказка (уведомление в продукте) чётко предлагает узнать больше.

Правила создания хороших подсказок

  1. Если просите пользователя что-то прочитать, убедитесь, что информация будет полезна ему прямо сейчас.
  2. Объясняйте только то, что нельзя понять из интерфейса.
  3. Сделайте подсказки как можно более контекстными. Показывайте их в ответ на действия пользователей и только тем, кто с большей вероятностью их воспримет.
  4. Показывайте только одну подсказку одновременно и не более трёх-четырёх подряд. Пользователи быстро устают, нужно время для действия или осознания новой информации.
  5. Анализируйте и тестируйте подсказки как и всё остальное в продукте.

Это поможет создать продукты, с которыми проще разобраться (более эффективные) и которые не будут раздражать (более вовлекающие) в одно и то же время.

Также опубликовано на Медиуме.