Каталог и checkout: сценарии выбора и оформления заказа

TL;DR: сценарий покупки — это цепочка из восьми шагов: категории, SKU и варианты, поиск и фильтры, карточка товара, корзина, checkout, промо, подтверждение. Разрыв на любом шаге теряет заказ; исключения (остаток, цена, промо) обрабатываются на момент оформления, а не задним числом. B2B добавляет поверх этой цепочки свои точки: быстрый заказ, персональные цены, согласование.

Назначение страницы

Страница фиксирует функциональные требования к витрине, по которым проверяется любая платформа из обзора моделей поставки. Платёжные механики (hold/capture, жизненный цикл платежа) — в контуре платежей; расчёт и выбор доставки — в контуре логистики. Здесь — только то, что происходит на витрине до передачи заказа дальше.

Товарные данные: категории, SKU и варианты

Структура категорий. Категории — карта каталога для покупателя и для поисковой навигации. Один товар может лежать в нескольких категориях, но у каждой категории свой адрес витрины и метаданные. Глубина вложенности обычно 2–3 уровня; глубже покупатель теряется.
SKU и варианты. Товар (SKU) — учётная единица с собственным остатком и ценой. Варианты (цвет, размер, упаковка) — способы выбора одного и того же SKU на витрине. Спор о том, «вариант это или отдельный товар», решается по остаткам: если остатки и цены различаются — это разные SKU.
Характеристики. Набор характеристик товаров для фильтров держится плоским и согласованным: характеристики, по которым фильтруют, должны быть заполнены у всех товаров категории, иначе фильтр даёт ложные пустые результаты.

Поиск, фильтры и фасеты

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

Карточка товара

Карточка — точка конверсии. Обязательный состав данных:

Медиа: основное изображение, галерея с масштабом, видео при наличии; изображения вариантов соответствуют выбранному варианту.
Характеристики: согласованные с фильтрами, без дублирования полей.
Наличие: актуальное на момент отображения, с явными состояниями («в наличии», «под заказ», «нет»); данные об остатке приходят из контура интеграций.
Цена: текущая цена, старая цена при скидке, явная работа промо-механик.
Действия: «в корзину» с выбором варианта; при недоступном варианте — понятный запрет действия, а не ошибка после отправки.

Корзина

Товары изменяются по количеству и удаляются без перезагрузки; пересчёт суммы виден сразу.
Персистентность: корзина анонимного пользователя сохраняется между визитами (cookie/локальная идентификация), при входе переносится в учётную запись.
Минимум для B2C: строка заказа, сумма, промокод, переход к оформлению.
Корзина — не заказ: до подтверждения ничего нельзя трактовать как сделку; разрыв между корзиной и заказом описан в исключениях ниже.

Checkout: гостевой и авторизованный

Гостевой checkout — базовое требование B2C: обязательная регистрация перед покупкой отсеивает значительную долю заказов.

Шаги гостевого checkout:

Контактные данные (имя, телефон, e-mail) — минимум для связи и чека.
Выбор доставки — интерфейс и расчёт по сценарию из контуре логистики.
Выбор оплаты — варианты и жизненный цикл платежа в контуре платежей.
Подтверждение и создание заказа.

Авторизованный checkout добавляет: сохранённые адреса и способы оплаты, историю заказов, персональные цены (если предусмотрены моделью). Сценарий «зарегистрироваться после первого заказа» — пароль отправляется на введённый e-mail, а не создаётся отдельным экраном с обязательной регистрацией перед оплатой.

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

Промо: промокоды и акции

Промокоды — проверяются на витрине до подтверждения: существование, срок, условия применимости (сумма, категории, товары), ограничения на сумму скидки. Скидка применяется к позициям, а не только к итогу.
Акции — механики типа «скидка на категорию», «+1 к заказу», «фиксированная цена при наборе» должны считаться по правилам, а не вручную; конфликтующие акции не суммируются без явного правила приоритета.
Промо-условия отражаются в строках заказа, чтобы администратор понимал источник скидки; учёт промо-эксплуатации — в контуре роста.

Подтверждение и статусы заказа

После оплаты (или при оплате при получении) создаётся заказ с номером и статусом:

Статусы обязательны к отображению покупателю: принят, подтверждён, собран, передан в доставку, доставлен, отменён.
Каждое изменение статуса приходит в канал с сообщением (e-mail/SMS/пуш) по политике магазина.
Отмена и возврат средств описаны в контуре платежей и контуре логистики, а не в витрине.

Доступность витрины

Доступность — часть сценария, а не отдельная «проверка напоследок»:

Контраст: текст и важные элементы различаются по контрасту на фотофоне и поверх слайдеров.
Клавиатура: всё управление (навигация, фильтры, варианты товара, корзина, формы checkout) доступно с клавиатуры, порядок фокуса логичен, фокус не теряется в модальных корзинах.
Формы: каждое поле подписано, ошибки описаны текстом рядом с полем, а не только цветом; обязательность помечена заранее, а не ругается по факту отправки.
Состояния: загружающиеся и пустые состояния озвучены для скринридера (aria-live), не только «моргают» иконкой.

Требования к доступности витрины дополняются общими проверками, описанными в типах сайтов и в приёмке конкретной платформы.

B2B-дополнения

B2B-сценарий расширяет B2C-цепочку, но не заменяет её; полный контекст модели — в B2B-портале и оптовом каталоге.

Быстрый заказ по SKU и CSV. Контрагент вводит артикул и количество, загружает CSV заказов; система находит позиции, показывает найденные, ненайденные и запросы на замену.
Повтор заказа. Кнопка «повторить» по истории, автоподстановка позиций с текущими ценами и остатками; шаблоны регулярных закупок.
Минимальные партии и кратность. Проверка на витрине и в корзине: нельзя оформить количество ниже минимума или не кратное упаковке; предупреждение отображается до отправки.
Персональный каталог и цены. Видимый ассортимент, цены и условия платежа подбираются по контрагенту (договору); цена в карточке и в корзине — контрагентская, а не базовая.
Согласование заказа. Крупные заказы или заказы вне лимита проходят внутреннее согласование у контрагента (покупатель → одобряющий) с ролями и статусами согласования.
Заказ менеджером за клиента. Менеджер оформляет заказ от лица контрагента в админке с выбором контрагента и его условий; источник изменений в истории заказа — менеджер.

Исключения и ошибки

Каталог и checkout обязаны обрабатывать расхождения между видимым на витрине и фактом на момент оформления:

Исключение	Когда возникает	Требование к поведению
Недоступный остаток	Товар закончился на складе между добавлением в корзину и оформлением	Явное сообщение на шаге оформления, предложение удалить или заменить позицию, не тихая ошибка; заказ не создаётся
Изменение цены	Цена поменялась (акция закончилась, цена обновилась из 1С)	Пересчёт с указанием «цена изменилась», подтверждение новым значением; не молчаливое списание
Отклонённая промо-механика	Промокод не применим (срок, сумма, пересечение), механика отклонена на сервере	Понятный отказ с причиной на шаге применения, а не на подтверждении; итог пересчитывается явно
Разрыв корзины и заказа	Двойное нажатие, «назад» на платёжной странице, разрыв связи на подтверждении	Идемпотентный checkout: один заказ на одну попытку; повторная отправка не создаёт второй заказ
Отказ оплаты	Отклонён платёжный инструмент	Заказ остаётся в статусе «ожидает оплаты», корзина и введённые данные сохраняются, предлагается повторная попытка

Исключения на стороне платежей (не хватило денег на счёте, hold не закрыт) — в контуре платежей; недоставка, невыкуп, возврат товара — в контуре логистики.

Связанные страницы

Обзор контура — критерии выбора платформы и карта контура.
Платформы магазина — что каждая модель поставки даёт для каталога и checkout.
Платежи и документы — жизненный цикл платежа и кассовые события после подтверждения заказа.
Логистика и постпродажа — расчёт доставки, вручение, невыкуп и возврат.
B2B-портал и оптовый каталог — модель торговли, требования которой порождают B2B-дополнения витрины.

Материалы и источники

WCAG 2.1 Quick Reference — подтверждает формулировки требований к контрасту, навигации с клавиатуры и понятности форм.
Практики WPCraft — порядок вопросов сценария заказа в сборке магазина.