iTAB — редизайн карточки БАДов, чтобы выбор давался легче
iTAB — российский маркетплейс товаров для здоровья; все экраны в кейсе — живой интерфейс с реальными товарами. Я переделала карточку товара для веба и мобильного: понятнее ценность, сигналы доверия и действия покупки.
- Воронка
- Отвал ниже · NDA
- Покупка
- Добавлений в корзину больше · NDA
- Раскатка
- Разошлась по всему каталогу
Проблема
В БАДах доверие решает всё, а карточка товара была слабым звеном воронки — люди уходили, не доводя покупку до конца. Решение приходилось принимать почти вслепую: польза, состав, лабораторное подтверждение, отзывы и наличие были разбросаны по странице или не выстроены по важности.
Задача
Переделать карточку для веба и мобильного и снизить отвал в категории БАДов. Карточка должна была упростить оценку товара, усилить сигналы доверия в момент решения и удержать человека в воронке, когда нужного товара нет в наличии.
Пользователи
Товары для здоровья выбирают придирчиво. До покупки человеку нужно понять, что это за продукт, можно ли доверять составу, чем он отличается от аналогов и что делать, если его нет в наличии.
Что изменилось
Я пересобрала карточку вокруг того, как человек принимает решение: понять товар, довериться, сравнить, купить — и что делать, если купить не получилось.
Исследование и процесс
Начала с двух заходов параллельно: аудит текущей карточки по тем вопросам, которые человек задаёт себе перед покупкой, и разбор пяти карточек конкурентов из смежных категорий — посмотреть, какие конвенции уже сформировали ожидания. Оба захода указали на одни и те же четыре дыры. То, что уехало в продакшн, — третий подход: две полные итерации до него прошли через ревью команды.
Обратная связь при покупке
После нажатия непонятно, что произошло
Сигналы доверия
Отзывы, лабораторное подтверждение и исследования не складывались в один сюжет
Состояние «нет в наличии»
Товару не в наличии нужен следующий шаг, а не тупик
Перегрузка сигналами
Бейджи, плашки и маркеры боролись за внимание без всякой системы
1. Состояния покупки — понятные и с продолжением
Я описала состояния покупки для товаров в наличии и без. Если товар есть, кнопка после нажатия превращается в счётчик количества и сразу отвечает действием. Если товара нет, карточка предлагает подписку на поступление и держит связь с альтернативами, а не обрывает путь.
2. Доверие через отзывы и доказательства
Я развела слои доверия внутри карточки: карточки исследований дают дополнительный контекст, а отзывы и AI-саммари помогают быстрее увидеть, что повторяется в обратной связи. Уверенности больше, а основная зона покупки не перегружена.
Доказательства остались вспомогательным слоем — чтобы карточка укрепляла доверие, а не превращалась в длинную медицинскую статью.
3. Порядок среди вспомогательных сигналов
Бейджи, лабораторное подтверждение, категорийные маркеры и промо-плашки я собрала в понятную визуальную систему. Маркерам доверия добавила интерактивный слой: подробности открываются по запросу и не занимают место в карточке постоянно.
Результат
После запуска воронка сдвинулась в нужную сторону на каждом шаге, который мы переделывали. Точные цифры под NDA iTAB — готова голосом рассказать, как мы их мерили.
Отвал ниже: на шаге карточки стало уходить меньше людей.
Добавлений в корзину больше: в категории БАДов до этого шага стало доходить больше людей.
Нет в наличии — больше не тупик: заметная доля визитов продолжилась через подписку на поступление или альтернативы, а не закончилась уходом.
Новый стандарт каталога: система карточки разошлась по всему каталогу — один язык для доверия, наличия и состояний покупки.