Аудитория мобильного интернета в России составила 70,5% в феврале 2020 года. Со смартфона в интернете россияне проводят 2,5—3 часа в сутки, а с компьютера — 1,5—2 часа. Активнее всего пользуются смартфонами в группе 12—24 лет, следуют за ними пользователи 25—34 лет. Все это по данным Mediascope WEB-Index.
Мы разрабатываем m-commerce приложения для различных отраслей рынка. Поэтому решили поделиться опытом того, как создать карточку товара в b2c-приложении, чтобы она не оставила сомнений у пользователей.
Также ранее мы писали про онбординг и чекаут в приложениях.
Обязательные элементы карточки товара
Собрали лучшие практики из своего портфолио и подсмотрели у ведущих игроков рынка.
Описательное название товара
Название лучше делать подробнее чем категория товара и бренд. Название обычно включает категорию (рубашка, часы, дрель), бренд, модель, основные особенности.
Название товара может идти как над изображением, так и после. Последний вариант чаще используется для магазинов одежды и косметики, чтобы не отвлекать от снимков.
Несколько снимков товаров
Хорошая карточка товара не ограничивается парой снимков, а показывает продукт с нескольких ракурсов и открывается на весь экран.
Важно, чтобы изображение можно было приблизить, при этом учесть 2 типа жестов: двойной тап и масштабирование двумя пальцами («щипок»). У фото должно быть хорошее разрешение — при масштабировании снимок должен оставаться четким. Это особенно важно для одежды и аксессуаров, так как пользователи захотят рассмотреть фурнитуру или принт.
Описание продукта
Пользователи ищут в описании подробные характеристики товара, область его применения, советы по эксплуатации, а не пространные рассуждения о достоинствах.
Пользователи больше внимания уделяют началу описания, поэтому самую важную информацию стоит поместить туда.
Добавьте форматирование: подзаголовки, разбивку текста на абзацы, списки — это упростит чтение. Для технических характеристик используйте таблицы.
Стоимость
Стоимость должна быть указана за единицу товара. Если есть скидки или снижение цены по бонусной карте — указать ее. Стоимость должна располагать сразу под снимком.
Параметры продукта
Укажите все доступные цвета, размеры и другие модификации товаров сразу в карточке. Дополнительно можно добавить подробную таблицу размеров.
Наличие
Сообщайте о наличии товара и количестве доступных единиц. Так пользователя не будет ждать сюрприз в корзине: если он добавил товар, который закончился; выбрал больше товаров, чем есть в наличии; решил отложить покупку до завтра.
Например, в приложении наших клиентов 12 STOREEZ (дизайн выполнила студия genue) напротив каждого размера указано, если товара осталось мало или нет в наличие. Если товар закончился, то на него можно подписаться, чтобы получить уведомление в случае появления.
Информация о получении
Если пользователю непонятно, как к нему попадет товар, он может покинуть приложение. Дополнительный плюс — сразу вывести стоимость доставки или информацию о том, что она бесплатна.
Кнопка покупки
Пользователь должен точно понимать, что он добавил товар или определенное количество товаров в корзину. Эту задачу решают: изменение состояния кнопки покупки, уведомления о количестве добавленных товаров и быстрый переход к корзине.
Если пользователь хочет приобрести несколько товаров — дайте такую возможность на странице продукта. При этом идеально, если вы сразу покажете итоговую сумму покупки.
Также можно сделать 2 разные кнопки — для быстрой покупки и добавления в корзину.
Рейтинг товара и отзывы
Получить ответ на вопросы, выходящие за рамки карточки, услышать непредвзятое мнение и подтвердить свой выбор позволяют рейтинг товара и отзывы на него.
Пользователь должен иметь возможность быстро просмотреть как отрицательные отзывы, так и положительные — с этим поможет сортировка.
Читать удобнее структурированные отзывы. Да и клиенту будет проще оставить мнение, если он будет знать, о чем писать. Поэтому при сборе отзывов можно выделить разделы: достоинства, недостатки, цель покупки и подобные.
Еще один способ ответить на вопросы пользователя — добавить раздел с часто задаваемыми вопросами.
В шапке отзыва можно указать возраст, размер одежды, профессию, город проживания или любую другую информацию, которая поможет соотнести себя с обозревателем.
Допродажи
В смартфонах пользователи охотнее изучают категории с похожими товарами, так что стоит воспользоваться этим.
Есть несколько вариантов того, как оформить допродажи в карточке товара в приложении:
- Похожие товары
- Недавно просмотренные
- Дополнительные товары
Дополнительные товары важны для продуктов, которые предполагают их наличие. Они помогают пользователю не забыть приобрести товар и быстрее найти его. Например, при покупке люстры — стоит рекомендовать подходящие лампочки. Для fashion-приложений это могут быть предметы, которые дополнят образ.
Сравнение товаров
Пользователи часто выбирают из нескольких вариантов, поэтому информация о товарах из одной категории должна располагаться в одинаковой последовательности.
Для сопоставления технических характеристик можно добавить таблицу сравнения товаров.
Пользователи часто выбирают из нескольких вариантов, поэтому информация о товарах из одной категории должна располагаться в одинаковой последовательности.
Для сопоставления технических характеристик можно добавить таблицу сравнения товаров.
Вывод: что учесть в карточке товара
Карточка товара должна отвечать на все вопросы и возражения пользователя, давать адекватный ответ на его действия. Мы постарались перечислить универсальные элементы m-commerce карточки товара, которая решает задачи клиентов.
Подозреваете, что что-то не так с карточками товаров в вашем приложении? Обращайтесь к нам в Heads and Hands — разберемся вместе.
Карточка товара должна отвечать на все вопросы и возражения пользователя, давать адекватный ответ на его действия. Мы постарались перечислить универсальные элементы m-commerce карточки товара, которая решает задачи клиентов.
Подозреваете, что что-то не так с карточками товаров в вашем приложении? Обращайтесь к нам в Heads and Hands — разберемся вместе.