Корзинка с покупками

Interaction Design Patterns (Web)
автор: 2002 Martijn van Welie
перевод: Александр Качанов

(назад к списку)


С сайта www.waterpikstore.com
Задача

Посетители хотят купить товар

Условия

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

Решение

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

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

В описание товара, находящегося в корзинке, как правило включают название товара, его количество, наличие/отсуствие на складе и цену. Посетитель может удалить любой ненужный товар из корзинки, либо изменить его количество. Краткое описание товара связано ссылкой с полным описанием. Посетитель всегда может посмотреть, какова общая сумма покупок, включая стоимость упаковки и доставки (если таковые имеются). Посетителю также выводится информация о возможных формах оплаты, например, принимает ли данный магазин оплату по кредитной карточке. Находясь на странице "корзинка", посетители могут продолжить путешествие по магазину, либо перейти к процедуре оплаты. Для посетиелей, уже совершавших покупки в вашем магазине, предусмотрите функцию "покупка одним кликом" ("ONE-CLICK SHOPPING"). Товары, помещенные в корзинку, сохраняются в ней на протяжение определенного периода времени, скажем, 90 дней.

Для оплаты покупок посетитель должен "перейти к кассе". Во время процедуры оплаты посетитель должен выполнить пять действий:

  • Зарегистрироваться
  • Указать адрес доставки
  • Выбрать способ оплаты
  • Сделать заказ

Пользователи могут прервать процесс оплаты в любой момент. Если они хотят вернуться к процессу оплаты позднее, процесс начинается сначала, с первого дейсвтия. Для процесса оплаты воспользуйтесь шаблоном "Помощник/Советник (Wizard)", который проведет посетителя по всем этапам и при этом сократит количество страниц, показываемых посетителю.

Почему

Метафора "корзина с покупками" очень широко известа во многих странах. Эта метафора позволяет посетителю сначала выбрать товары и затем заплатить в любой момент за все сразу. Так как на старнице выводится общая сумма с дополнительными затратами на доставку, посетитель точно знает, во сколько ему обойдется покупка. С помощью шаблона "Помощник/Советник" облегчается сама процедура оплаты.

Еще примеры

На сайте amazon.com посетители могут просмотреть все товары и добавить понравившиеся в свою корзинку без каких-либо обязательств со своей стороны. Одним щелчком мышки по ссылке они могут перейти на страницу, где будет показано содержимое корзинки, и в любой момент вернуться с этой страницы в магазин и продолжить просмотр товара. Ссылка на корзинку доступна на всех страницах сайта. На каждом этапе процедуры оплаты выводятся информативные сообщения:

Сайт Barnes and Noble выводит краткую информацию о состоянии корзинки на каждой странице.

Данный пример отображения содержимого корзинки взят с сайта Waterpik.

Используютwww.amazon.com; www.bol.com; www.bn.com; www.proxis.com; www.apothuis.nl; www.waterpikstore.com Другие шаблоны

Возможно использование таких шаблонов, как Идентификация, когда от посетителей требуется идентифицировать себя, а также Помощник/Советник (Wizard) для процедуры оплаты.

Rambler's Top100
Rating All.BY
Akavita
Valid XHTML 1.0!