UX / B2B-продажи
UX B2B-каталога: как превратить поиск товаров в коммерческое предложение
B2B-покупатель редко оформляет заказ так же, как человек в обычном интернет-магазине. Ему нужны спецификации, единицы упаковки, документы, согласование и понятный итоговый список. Поэтому удобство B2B-каталога измеряется не только скоростью поиска, но и тем, удалось ли подготовить закупку без лишней переписки.
Сначала опишите роли, а не экраны
В одной компании запрос может начать офис-менеджер, уточнить инженер, согласовать финансовый руководитель, а оплатить бухгалтерия. Эти участники предъявляют разные требования. Закупщику важны стоимость и сроки, инженеру — характеристики и совместимость, бухгалтерии — счёт и документы. Если интерфейс строится вокруг кнопки «Купить», он часто теряет сценарии согласования.
До прототипа перечислите роли и решения, которые принимает каждая из них. Например, у закупщика три задачи: быстро найти нужную позицию, не ошибиться в количестве и передать понятный список на согласование. У поставщика — получить заявку, в которой достаточно данных для точного расчёта.
В проекте MOLE поиск, категории, отраслевые задачи и единая корзина связаны в один маршрут. Это пример структуры, а не утверждение об измеренном росте конверсии.
Пять этапов покупательского маршрута
1. Вход в ассортимент
Дайте три самостоятельных пути: поиск по названию или артикулу, навигацию по категориям и вход через задачу («оборудовать офис», «оснастить склад»). Поиск должен учитывать распространённые синонимы и опечатки, но не должен без предупреждения подменять технические характеристики.
2. Сравнение товаров
На карточке категории покажите параметры, по которым реально сравнивают позиции: фасовку, цену за единицу, остаток или срок, бренд, размер. Фотография может быть вторичной для крепежа, но принципиальной для мебели или корпоративной одежды. Порядок полей должен зависеть от товарной группы.
3. Выбор количества
B2B-каталог обязан различать штуку, упаковку, коробку и кратность заказа. Пример: товар продаётся пачками по 500 листов, транспортная коробка содержит 5 пачек, а цена указана за пачку. Отсутствие единицы измерения — прямой риск ошибочной заявки. Минимальное количество и кратность должны проверяться ещё в карточке, а не в конце оформления.
4. Список закупки
У B2B-покупателя корзина — не всегда финальный заказ. Часто это рабочий документ. Полезны редактирование количества, сохранение подбора, комментарии по позициям, итог по категориям, экспорт и возможность поделиться списком с коллегой. Не теряйте список после закрытия вкладки: используйте аккаунт или контролируемое локальное хранение с понятными ограничениями приватности.
5. Запрос КП
Перед отправкой покажите состав, единицы, количество, адрес или рынок поставки, необходимые документы и комментарий. После отправки клиент должен получить идентификатор заявки, а менеджер — структурированные данные, не скриншот корзины. При необходимости формируется PDF, но PDF не должен быть единственным способом передать данные в CRM.
Какой минимум полей нужен карточке
| Поле | Зачем | Типовая ошибка |
|---|---|---|
| SKU и название | Точная идентификация | Только маркетинговое имя |
| Единица продажи | Правильное количество | Цена без единицы |
| Варианты | Размер, цвет, фасовка | Всё в одной карточке без выбора |
| Срок/наличие | Планирование закупки | «В наличии» без контекста |
| Документы | Согласование | Ссылки только после контакта |
| CTA | Переход в список | Несколько одинаково заметных кнопок |
Для каталогов со сложной номенклатурой данные следует приводить к единой модели ещё на этапе импорта XML/CSV/API. UX не исправит отсутствие базовых характеристик.
Когда показывать цену, а когда — запрос
Не все B2B-проекты могут обещать фиксированную цену. Она зависит от тиража, рынка, валюты, скидки, технологии или логистики. В таком случае лучше честно показать «ориентир от», диапазон или состав цены, чем скрыть всё за кнопкой «Узнать стоимость».
Для товаров с вариантами нанесения может понадобиться калькулятор стоимости товара и брендирования. Для стройматериалов — список расчёта комплектации. На редизайне «Теплокровли» этот маршрут начинается либо с конкретного материала, либо с конструкции, которую необходимо утеплить. Важно: представленный проект — демонстрационный редизайн; цифры поискового роста после внедрения не заявляются.
Маршрут закупщика
- 01НайтиПоиск и рубрики
- 02СравнитьХарактеристики и фасовка
- 03СобратьСписок позиций
- 04ЗапроситьДанные для КП
Ошибки в мобильном интерфейсе
На узком экране нельзя просто спрятать всю функциональность в меню. Поиск и выбор категории должны оставаться доступными; фильтры — иметь понятную кнопку, число активных параметров и действие «Сбросить»; нижняя панель — не перекрывать цену или кнопку добавления. Таблицы технических характеристик лучше перестраивать в вертикальные пары «параметр — значение», не обрезая текст.
Проверяйте сценарий не только на 390 px, но и на узких экранах, увеличенном системном шрифте и с виртуальной клавиатурой. Удобная desktop-корзина не гарантирует удобную мобильную закупку.
События аналитики: измеряйте решения, а не клики ради кликов
Полезные события: search_submitted, filter_applied, product_viewed, quantity_changed, quote_list_created, quote_requested. Ключевые показатели — доля поиска без результатов, доля карточек с добавлением, время подготовки списка, количество ошибок в форме и доля квалифицированных КП.
Не считайте каждый клик по товару микроконверсией: интерес к карточке не равен качественной заявке. Для оценки эффективности объединяйте поведение на сайте и исход обращения в CRM.
Проверьте маршрут на одной закупке
Попросите закупщика найти позицию по артикулу, изменить количество, добавить аналог и сформировать PDF. Затем откройте КП на другом устройстве: проверьте единицы, цены, валюту и читаемость списка. Кейс MOLE показывает наличие корзины и PDF-КП; фактическую конверсию определяют отдельным замером.
FAQ
Нужна ли B2B-каталогу полноценная онлайн-оплата?
Не обязательно. Если сделки требуют согласования и индивидуальных условий, важнее точная корзина, запрос КП и синхронизация с менеджером.
Стоит ли скрывать цены для незарегистрированных пользователей?
Только если есть убедительная коммерческая причина. Скрытые цены повышают неопределённость и могут снижать качество первого контакта.
Что важнее: поиск или фильтры?
Оба механизма решают разные задачи. Поиск помогает тем, кто знает товар, фильтры — тем, кто выбирает среди допустимых вариантов.
Как передавать корзину в CRM?
Структурированным объектом: клиент, контакты, товары, SKU, количество, единицы, валюта, условия, комментарии и источник заявки. Документ PDF можно формировать дополнительно.
Как понять, что UX улучшился?
Сравните одинаковые сценарии до и после: число действий, долю успешно отправленных списков, частоту исправлений, время подготовки заявки и качество данных, получаемых менеджером.
Следующий шаг
Нарисуйте не карту экранов, а маршрут одной реальной закупки — от первого запроса до согласованного списка. Затем проверьте, где человеку приходится звонить, чтобы узнать очевидное. Если нужно создать систему с нуля, см. подход к разработке корпоративных сайтов.
Источники: Google: SEO и ссылки; W3C: WCAG 2.2.