Четвёртая из цикла статей. Цель цикла — повысить конверсии и сделать онлайн-шопинг удобнее для людей. Мы в Mojo собрали лучшие практики из своего опыта и подкрепили их исследованиями.
Меня зовут Женя Князев. Я продуктовый дизайнер в Mojo. У нас большая экспертиза в дизайне и неплохая база исследований. Недавние eCommerce-проекты вдохновили меня рассказать о дизайне интернет-магазинов.
В первой статье я рассказал о влиянии дизайна на пользовательский опыт. Показал интересную связь между когнитивными искажениями и восприятием сайта. В конце дал 12 шагов, как улучшить магазин малой кровью.
Во второй статье я продолжил погружение. В статье подробно разобрана навигация и звонки. Навигация влияет на опыт использования всего сайта. Ошибаться нельзя.
В других местах тоже нельзя.
В третьей статье темой стал каталог. Ошибки в карточках, фильтрации товаров, инсайты про горизонтальный фильтр-бар и небольшой бонус в конце. Читайте и вдохновляйтесь :)
Еще немного поговорим про каталог: грехи быстрого просмотра и альтернативы, а потом перейдем к странице товара. Обсудим, как сделать её идеальной. Статья получилась слишком длинной, поэтому корзину и оформление заказа перенес в следующий выпуск.
Не знал, куда отнести тему с быстрым просмотром. Это еще не страница товара, но уже не каталог. Начнем с примеров.
Найти быстрый просмотр сейчас уже не так просто. Многие крупные бренды от него отказались, но вот Wildberries Интернет-магазин wildberries.ru
По размеру это почти уже страница товара Интернет-магазин wildberries.ru
На Lamoda все немного скромнее. Быстрый просмотр вызывается неприметной кнопкой «Подробнее», а размер модального окна ближе к классическому Интернет-магазин lamoda.ru
Классическое решение использует и Спортмастер Интернет-магазин sportmaster.ru
Тут даже с каруселью, которая переключается на другой товар Интернет-магазин sportmaster.ru
В интернете легко найти статью, где рассказывается о пользе быстрого просмотра. Большая часть из них опирается на идею «чем меньше времени от товара до добавления в корзину, тем лучше». В случае с быстрым просмотром все далеко не так однозначно.
Быстрый просмотр показывает пользователю дополнительные характеристики, больше фото и акций. Некоторые из испытуемых Бэймэрд считают функцию полезной — так происходит со всеми «костылями». Люди считают их полезными, но хотели бы вы всю жизнь ходить на костылях?
Одна из целей быстрого просмотра — показ дополнительных изображений. В новом окне достаточно места для них. Только пользователю все еще приходится кликать и ждать загрузки модального окна.
Для того, чтобы показать больше изображений есть множество решений.
В каталоге изображения уже достаточно крупные. При наведении на карточку изображение изменяется. Интернет-магазин hm.com