Ай-стопперы: Как привлекать внимание и убеждать без продавцов. Инструкция по созданию мотивационных триггеров для сайтов

Статья для начинающих маркетологов, UX/UI специалистов, исследователей и аналитиков. В статье рассказывается о мотивационных триггерах — ай-стопперах, что это и как их применять для максимальной эффективности.

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

Один из инструментов мерчендайзинга – это ай-стопперы (с англ. eye-stopper останавливающий взгляд), коммуникативный прием, направленный на привлечение внимания. Часто применяется в офлайн супермаркетах в виде воблеров, шелфтокеров, некхенгеров, экстендеров (в зависимости от формы и места расположения).

Ай стопперы в офлайн-магазине: воблер (слева), шелфтокер (справа)

Форма и место у ай-стопперов могут быть разными, но цель одна – это привлечение внимания потенциального покупателя. Ай-стопперы выступают в качестве мотивационных триггеров, направленных на то, чтобы вызвать любопытство, выделить из общего ряда и обеспечить, тем самым, интерес к товару и последующую за ним покупку. Эти же приемы привлечения внимания работают и в интернет-магазинах.

Ай-стопперы в каталоге интернет-магазина Связной (за 4 года наблюдений) svyaznoy.ru

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

1. Избегайте большого количества ай-стопперов

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

Пользователи пропускают ай-стопперы взглядом, если их много svyaznoy.ru

Если каждый товар в каталоге «кричит» и пытается привлечь к себе внимание путем указания ай-стоппера, то ни один из них не получит особого внимания. А цель ай-стопперов состоит в том, чтобы выделить одни товары на фоне других. Например, когда необходимо реализовать определенные товары, которых больше на складе. Поэтому желательно выделять не все товары, а лишь некоторые (1-3 ай-стоппера в экране). Вот как это реализовано в каталоге Amazon.

Решение: небольшое количество ай-стопперов выделяет товары на фоне остальных amazon.com

Аналогично, большое количество ай-стопперов работает хуже и на мобильных устройствах. Здесь ай-стопперы и без того слабозаметны, ввиду небольшого экрана смартфона, а если их много, то они только создают визуальный шум, который пользователи пропускают.

Пользователи пропускают ай-стопперы взглядом и в мобильной версии, если их много eldorado.ru

2. Не применяйте одинаковые ай-стопперы

Другая проблема, которая снижает эффективность ай-стопперов – это одинаковые ярлыки. Другими словами, если большинство ай-стопперов в каталоге имеют одинаковые или похожие ярлыки, то такой ай-стоппер перестаёт быть уникальным и будет упущен взглядом пользователя. Здесь тот же принцип, если каждый товар требует одинакового внимания к нему, то ни один не получит особого внимания. Поэтому желательно выделять только уникальные характеристики. На изображении ниже, на сайте ЦУМа, пользователь выбрал раздел «Новинки для мужчин» в котором показано множество одинаковых ай стопперов «ВЕСНА-ЛЕТО 2021», хотя это и без того понятно по выбранному разделу. Нет необходимости указывать данный ай-стоппер под каждым товаром.

✖ Ошибка: повторяющиеся ай-стопперы игнорируются пользователями tsum.ru

3. Включите ай-стопперы в фильтры

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

Ай-стопперы добавлены в фильтры каталога интернет-магазина Спортмастер sportmaster.ru

4. Используйте заметные ай-стопперы

Ещё одна ошибка из-за которой пользователи не замечали ай-стопперы заключалась в том, что они были (внимание!) – незаметны. Простите за тавтологию, но по прежнему встречаются сайты с совершенно незаметными ай-стопперами. Так, например, в каталоге интернет-магазина Laredoute ай-стопперы указаны мелким шрифтом и запрятаны в названии.

Ай-стопперы в каталоге интернет-магазина не оформлены и потому слабозаметны laredoute.ru

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

Заметные ай-стопперы в каталоге e-commerce Home Depot homedepot.com

5. Используйте понятные ай-стопперы

Другой пример ошибки – это сложные или непонятные ай-стопперы. Так в ходе модерируемых сессий «думай вслух» часть пользователей не понимали значения ай-стоппера «Сделай комбо» в каталоге интернет-магазина Связной. Один пользователь задался вопросом «Комбо – это 2 или 3 товара?». Другая испытуемая спросила «Какая скидка даётся за комбо?». И так как рядом никаких подсказок не оказалось, то оба испытуемых отказались кликать по товару и ушли искать дальше. Вероятно, так происходит потому, что большинство людей склонны выбирать знакомые или понятные шаги, нежели идти в неизвестность. Поэтому желательно указать простой и понятный текст на ай-стоппере, в котором ясно указана выгода. Например, вместо «Сделай комбо» указать «2-й товар со скидкой 30%». Или показывать всплывающую подсказку при наведении курсора мыши на ай-стоппер, в которой объясняются все нюансы.

Варианты слева: непонятный ай-стоппер. Варианты справа: понятный ай-стоппер. svyaznoy.ru

В данной статье очень кратко разобран лишь один способ повышения конверсии и улучшения пользовательского опыта. Если вы хотите узнать больше о повышении конверсии, на основе поведенческой экономики, инженерной психологии и UX-исследований, то специально для вас мы составили электронный учебник «Конверсия на стероидах», в котором собрано множество подобных точек роста конверсии в виде удобного курса. Ссылка с подробностями ниже.

Электронный учебник «Конверсия на стероидах»  UX-аналитик: Эдуард Файзуллин
0
15 комментариев
Написать комментарий...
boj Ko

Это всё весёло! А теперь покажите тепловую карту  по всем вашим примерам  с показателями MUA Dua QUA в часовой привязке графиков, во это будет тогда интересно реально.

Ответить
Развернуть ветку
Al Pr

ОФфтоп:iStopper! iStupid.
Извини - не удержался
А вот теперь пошёл читать статью.

Ответить
Развернуть ветку
Эдуард Файзуллин
Автор

В продолжение оффтопа: Я только пару лет назад узнал о том, что буква «i» перед названиями продуктов Apple означает слово «интернет». На момент выхода iMac (1998) это была важная возможность нового ПК. Любопытная деталь, особенно сегодня, когда даже с электрического чайника можно выйти в интернет.

Ответить
Развернуть ветку
greg chudnoff

eye stopper, вообще-то

Ответить
Развернуть ветку
Al Pr

Ай-стопперы в заголовке. А вообще знаю. Просто eye  и i  это как бы 

Ответить
Развернуть ветку
Ильяна Левина

Хорошая идея с включением в фильтры, за неё прям лайк

Ответить
Развернуть ветку
Эдуард Файзуллин
Автор

Лайк от маркетинг-сенсея приятен вдвойне :)
Спасибо за прочтение и фидбек!

Ответить
Развернуть ветку
am8am

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

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

Ответить
Развернуть ветку
Эдуард Файзуллин
Автор

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

Что касается повышения общей конверсии, то ай-стопперы это один из способов повышения конверсии. Другие точки роста конверсии разобраны в других наших статьях на VC или на нашем сайте. Все точки роста в одной статье уместить нереально :)

Ответить
Развернуть ветку
Al Pr

По первому абзацу:
Вариант 1: Берем фокус-группу и тестируем 2-4 гипотезы дизайна на них, потом выносим на сайт и тестируем там.
Вариант 2: Заказываем Эдуарду тоже самое.
считаем профит от "затеи" чего-то прикрутить: если эффект + 1000 покупок это одно, а если +1 - то "оно вам надо" (но ведь в обоих случаях Вы получили  +10% к продажам).
По второму абзацу: присоединюсь к вопросу

Ответить
Развернуть ветку
Эдуард Файзуллин
Автор

Комментарии, вопросы и собственный опыт по теме статьи приветствуется :)

Ответить
Развернуть ветку
Николай Мясников

Отличная подборка! Спасибо! В примерах Ваши проекты, или Вы просто проанализировали сайты?

Ответить
Развернуть ветку
Эдуард Файзуллин
Автор

Мы аудировали русскоязычные проекты из подборки, с некоторыми работаем до сих пор. А за англоязычными (Amazon и Home Depot) лишь наблюдаем «со стороны», там много инсайтов.

Ответить
Развернуть ветку
Николай Мясников

Спасибо!

Ответить
Развернуть ветку
Al Pr

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

Ответить
Развернуть ветку

Комментарий удален модератором

Развернуть ветку
12 комментариев
Раскрывать всегда