Какой должна быть корзина в интернет-магазине?

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

Один молодой человек так описал свой первый опыт покупки через Интернет.

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

Эта кнопка является ключевой в интерфейсе интернет-магазина. Она должна соответствовать нескольким требованиям:

После нажатия кнопки "Добавить в корзину" пользователь должен получить некую обратную связь. Например: после нажатия меняется вид кнопки: теперь на ней написано "В корзине". Пользователя можно сразу перенаправлять в корзину, или показать ему всплывающее сообщение о добавлении товара в корзину.

Хороший пример: в интернет магазине Е5 кнопка добавления в корзину называется "Заказать", она проста и ее трудно не заметить – даже на небольшом скриншоте.

Плохой пример: ну-ка, попробуем догадаться, как заказать пирог на сайте pirogidomoy.ru? То, что для этого нужно нажать на знак + рядом с пирогом, далеко не очевидно. Пользователь, не понявший это с первого взгляда, может просто уйти с сайта.

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

Плохой пример: на сайте madrobots.ru вы не найдете изображения корзины – только надпись “Корзина пуста” в правом верхнем углу.

Интересный, но спорный пример: на сайте pichshop.ru кнопка для добавления в корзину выполнена в виде коробки, показанной сверху (см. правый нижний угол). Неплохое решение, но дело осложняется тем, что корзина непривычного вида расположена еще и на нетипичном для интернет-магазина месте. Чтобы корзина стала заметнее, к ней ведут рисованные “следы”. И все-таки нетипичное расположение и непривычный вид могут затруднить поиск для пользователей, которые привыкли видеть корзину в правом верхнем углу страницы и обычно - в виде иконки с тележкой из супермаркета. Лично мне найти корзину сразу не удалось, пришлось потратить несколько секунд. Лучше бы такой дизайн сначала хорошо протестировать.

Когда мы находимся на странице товара, то обычно видим красивые фотографии, внятное описание. Если же посмотреть на список товаров в корзине, там товар, как правило, представлен не в лучшем виде. Чаще всего нет даже изображения, есть только название товара. В итоге, если пользователь "соблазнился" красивой фотографией товара или идентифицировал свою покупку только по изображению, то при переходе в корзину он может подумать-подумать – и отказаться от заказа.

Хороший пример: интернет-магазин Enter.ru в корзине показывает изображение товара. Пользователю легко вспомнить, что он добавлял в корзину.

Плохой пример: в корзине интернет-магазина orderit.ru представлены только названия товаров мелким, неудобочитаемым шрифтом. Если покупатель следовал логике "сначала добавить все понравившиеся товары в корзину, а потом выбрать нужные", то ему будет сложнее завершить покупку.

В корзине должна быть возможность легко перейти к карточке выбранного товара. Пользователь может забыть, что именно он смотрел, или захотеть уточнить детали.

Кроме того, у пользователя должна быть возможность отказаться от товара в корзине. Для этого ему нужна кнопка "Удалить" рядом с каждым товаром. При этом, надо сделать эту кнопку такой, чтобы пользователь не мог случайно нажать на нее.

Хороший пример: в корзине интернет-магазина top-shop.ru есть возможность как просмотреть товар, кликнув на него, так и удалить. При этом кнопка "Удалить" (см. в правом нижнем углу) хоть и невелика, но заметна, и маловероятно, что пользователь нажмет на нее случайно.

Плохой пример: у интернет-магазина remont-vann.ru в корзине есть возможность удалить товар. Но она совершенно не очевидна покупателям: это микроскопическая кнопочка с красным крестиком перед номером заказа. Мало того, что трудно догадаться, для чего она нужна, по ней еще сложно попасть с первого раза.