UX пособие:категория и продукты


Содержание:

  1. Главная страница
  2. Меню и навигация
  3. Поиск
  4. Категория и продукты(карточки товаров)
  5. Конверсия
  6. Оптимизация форм

Глава 4: Категория и продукты(карточки товаров)

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

Рекомендации для категорий и карточек товаров

Рисунок №1 — Рекомендации для категорий и карточек товаров

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

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

Примеры сайтов, которые следуют данным рекомендациям:

  1. Добавление целей ориентированных на выгоду на каждой цепи воронки продаж (рис. 2).

https://www.gap.com/

Уникальное торговое предложение на главной, категории и карточке товара(Бесплатная доставка на заказ более $50).

Цели, ориентированные на выгоду

Рисунок 2 — Цели, ориентированные на выгоду

  1. Сортировка и фильтрация на листинге товаров(рис. 3).

https://m.asos.com

Сортировка и различные фильтры

Рисунок №3 — Сортировка и различные фильтры

  1. Расположение цены выше границы экрана телефона(рис. 4).

https://www.target.com

https://thursdayboots.com/

Расположение цены выше границы экрана

Рисунок №4 — Расположение цены выше границы экрана

  1. Элементы срочности(рис. 5).

https://www.juniqe.com/ (размещение информации об остатке товара)

Элементы срочности

Рисунок №5 — Элементы срочности

Элементы срочности являются мощным мотиватором, если все сделано правильно. Есть 3 способа создать элементы срочности:

  • Количество ограничений (только 3 билета осталось по этой цене).
  • Ограничения по времени (билеты со скидкой до 1 июля).
  • Ограничения, связанные с праздниками (приближается День отца, получи подарок сейчас).

Выделенная срочность на товаре увеличивает коэффициент конверсий на 17%(рис. 6).

Выделенная срочность(Торопись! Этот товар продается быстро)

Рисунок №6 — Выделенная срочность(Торопись! Этот товар продается быстро)

  1. Удобочитаемое описание товара(рис. 7).

https://thursdayboots.com

https://www.revolve.com

https://m.asos.com

Удобочитаемое описание

Рисунок №7 — Удобочитаемое описание

Удобочитаемое описание — это описание, содержащее структурированную, полную, правдивую информацию о товаре. Описание размечено заголовками, состав оформлен списками: нумерованным/маркированным.Абзацы короткие, не более 3-4 предложений. Шрифт не менее 14-16px.

  1. Отзывы на товарах и маркеры рейтинга — звезды(рис. 8).

https://www.target.com/

https://www.rei.com/

Отзывы и маркеры

Рисунок №8 — Отзывы и маркеры

  1. Добавление вторичных призывов к действию(рис. 9).

https://www.rei.com/ (добавить в желания)

https://www.asos.com/ (добавить в желания)

https://www.zumiez.com/ (поделиться ссылкой, отметить этот товар)

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

Вторичные призывы к действию

Рисунок №9 — Вторичные призывы к действию

  1. Бонус: сопоставить браузер с цветовыми решениями вашего сайта/логотипа(рис. 10).

https://www.wayfair.co.uk/

https://www.warbyparker.com/

https://www.zalando.co.uk/

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

Сопоставление цветовых решений

Рисунок №10 — Сопоставление цветовых решений

Исследование, проведенное секретариатом Международной выставки цветов в Сеуле, подтверждает следующие взаимосвязи между цветом и маркетингом:

  • 92,6% заявили, что при покупке продуктов, большое внимание уделяют визуальным факторам.
  • 5,6% сказали, что физическое чувство через осязание было самым важным.
  • Слух и запах каждого привлек 0,9%.

Исследования показало, что люди делают подсознательное суждение о человеке, окружающей среде или продукте в течение 90 секунд после первоначального просмотра, от 62% до 90% этой оценки основано только на цвете.

Исследования, проведенные Центром Хенли, показывают, что 73% решений о покупке принимаются в магазине.

Цвет повышает узнаваемость бренда до 80%.

Рассмотрим примеры украинских сайтов(рис. 11).

Карточки товаров и категории

Рисунок №11 — Карточки товаров и категории

https://m.rozetka.com.ua/

Сайт содержит:

  1. Уникальное торговое предложение(акция).
  2. Цена выше границы экрана.
  3. Элемент срочности(слово “Заканчивается”).
  4. Вторичные CTA(В список желаний).
  5. Отзывы.
  6. Структурированные характеристики и хорошее описание товара.
  7. В категориях сортировка и фильтр.

https://comfy.ua/

Сайт содержит:

  1. Элемент срочности, даже более выгоды(для покупателя — кредит, покупка частями и пр.).
  2. Отзывы.
  3. Вторичные CTA(В список желаний, подписка).
  4. Структурированные характеристики и хорошее описание товара.
  5. В категориях сортировка и фильтр, фильтр по акционным предложения.

https://kasta.ua/

Сайт содержит:

  1. Цена выше границы экрана.
  2. Элемент срочности(счетчик акции).
  3. Отзывы.
  4. Вторичные CTA(В избранное).
  5. Структурированный состав товара.
  6. В категориях сортировка и фильтр.

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

Продолжение читайте в пятой главе Конверсия

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *