В 2012 году в ходе работы над редизайном Сотмаркета было уделено много времени изучению работы интерфейсов других российских интернет-магазинов. Были проанализированы наиболее популярные из них, в сегменте электроники и техники. Ниже представлена таблица с экспертной оценкой удобства корзин некоторых интернет-магазинов:
Хорошая корзина обладает следующим чертами:
- Крупная фотография товара, добавленного в корзину, его название и статус наличия
- Указания количества и цвета товаров, с возможностью их редактирования и удаления
- Поле для ввода промо-кода; демонстрация примененных акций и скидок, как инструментов маркетинга
- Предложение сопутствующих товаров и рекомендации
- Дополнительные возможности оформления заказа: обратный звонок и кредит
- Наличие заметной кнопки “Оформить заказ” и итоговой стоимости заказа
А еще, идеальная корзина отзывчива и помнит о том, что пользователь в нее добавил и не выкупил, даже если он не авторизован.
Среди наиболее распространенных проблем можно выделить:
- Отсутствие альтернативных способов заказа: кредит и заказ в один клик
- Слабо выраженный основной CTA-элемент страницы, при высоком общем визуальном шуме
- Отсутствие рекомендаций и сопутствующих товаров
Проблема: представление товара в корзине
В обоих случаях выполнен минимум: достаточно крупная фотография, заметный ценник.
В обоих случаях плохо:
- Не очевидно, что есть цена — стоимость за штуку, или сумма двух позиций
- Невозможно сменить опцию цвета из корзины
- Несколько неуклюже размещенные кнопки «Удалить»
В случае Техносилы плохо и то, что цветовая опция даже не названа, отсутствует информация по наличию Последнее важно в случае «брошенных корзины», когда пользователь возвращается инструментами ремаркетинга и должен в моменте видеть какие товары действительно доступны для заказа.
Немного разные подходы у Связного и М.Видео в отражении количества товара. Простое решение указать руб./шт. подойдет и для вашего магазина, как быстрое, превентивное решение проблемы. В М.Видео же блок товара в корзине представлен таблицей — несколько топорное, не элегантное решение, но абсолютно работоспособное с точки зрение восприятия.
В обоих случаях неплохо и то, что кнопки удалить товар из корзины не так сильно бросаются в глаза, как на первом примере.
Недостатком корзины Озона можно считать лишь удаление товара из корзины в 2 клика и отсутствие возможности сменить опцию цвета. В Сотмаркете же можно менять цвет, количество, цена показывается суммированная с расшифровкой калькуляции, недорогие сопутствующие товары до 1450 руб. предлагаются прямо под данным предложением.
Проблема: блок покупки в карточке товара
Взаимодействие пользователя с корзиной начинается со страницы товара. Здесь распространенной ошибкой является отсутствие обратной связи при добавлении товара в корзину. Несколько неудачных примеров приведены ниже. На картинке слева до добавления товара в корзину, справа — после.
На Сотмаркете блок покупки существенно видоизменяется после добавления товара в корзину, в других интернет-магазинах этот блок, обычно, претерпевает лишь небольшое изменение.
Не стоит упускать из виду и техническую реализацию, в т.ч. скорость загрузки страниц на сайте. Например, на сайте Эльдорадо вы заметите отсутствие блока покупки до полной загрузки страницы, равно как и фотографии товара.
Проблема: заказ в один клик
Часто на сайтах можно встретить форму «Быстрого оформления заказа» или «Заказа в 1 клик». В ней наблюдается больше всего маразматичных интерфейсных решений в виде рукотворных барьеров из усложненных форм. Например:
Чудовищно выглядит один клик в представлении М.Видео
Связной и Enter исповедуют похожий друг на друга подход к быстрому заказу.
Евросеть оказались заботливее, всего 2 обязательных поля, но чтобы клиент не расслаблялся, ему предлагается расшифровать капчу.
Викимарт просит изучить множество полей, интересуется с какой целью заказываются обратный звонок, задает, зачастую, неуместный вопрос «Не смогли дозвониться?».
Форма быстрого заказа должна состоять из одного поля ввода, при этом если пользователь авторизован и совершал покупки ранее, то поле телефона должно быть уже предзаполнено.