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

Статью «Why tooltips are terrible and why you should use them for your product» написал Пулкит Агравал 28 апреля 2016 года.

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

Впервые опубликовано в рассылке 12 декабря 2016 года. Также опубликовано на Медиуме.

Опечатка? Выделите её и нажмите кнопки Control и Enter.

Технологии цифрового маркетинга — книга, где я был соавтором (параграф про создание сайта) и литературным редактором (привёл текст к единой стилистике и упростил формулировки). От 250 рублей.

Теперь электронную версию можно купить и читать на Литресе.