Каталоги для бизнеса сильно отличаются от потребительских магазинов. В них важны не эмоции, а точность, скорость и удобство. Покупатель не листает страницы ради вдохновения — он ищет конкретный товар с нужными характеристиками, чтобы быстро сравнить и сделать заказ. Если интерфейс перегружен, непоследователен или требует слишком много действий, человек уходит.
Рассказываем, как дизайнеру сделать такой интерфейс, который поможет продавать и не отвлечёт от сути.
Понять, кто именно будет пользоваться каталогом
Первое, с чего нужно начать — не с дизайна, а с изучения целевой аудитории. В B2B-сегменте сайты используют:
- Закупщики, которые ищут конкретную модель под ТЗ, ориентируются на цену и наличие;
- Инженеры, которым важно изучить технические параметры и совместимость;
- Менеджеры, которым нужно сравнить варианты, запросить КП или отправить ссылку начальству.
В отличие от B2C-пользователей, они не станут изучать витрину, читать рекламные описания и смотреть слайдеры. Их цель — за 1–2 минуты найти подходящую позицию и понять, что с ней делать.
Например, инженер ищет погрузчик электрический вилочный, который поднимет 2 тонны на высоту 3,5 метра, работает от 48 В и проходит в узкие проходы. Его не интересует дизайн обложки каталога, но он точно оценит удобный фильтр и краткие характеристики прямо на карточке.
Продумать фильтры в первую очередь
Фильтры — главный инструмент B2B-каталога. Если они не работают или плохо оформлены, пользователь просто не сможет отобрать нужные модели.
Советы:
- Размещайте фильтры в левом или верхнем блоке, всегда в пределах видимости.
- Не прячьте параметры в выпадающие меню без необходимости. Лучше сразу показывать основные характеристики.
- Используйте термины, принятые в отрасли. Если вся индустрия говорит «грузоподъёмность», не заменяйте это словом «нагрузка».
- Добавьте фильтр по наличию, бренду, типу управления — это поможет отсеять лишнее.
- Показывайте количество найденных товаров при каждом изменении фильтра, чтобы пользователь не терялся.
Хорошая идея — сохранить выбор пользователя, чтобы при возвращении на страницу не пришлось настраивать заново.
Сделать карточки товаров техническими и лаконичными
В B2B карточка товара — это не эмоция, а лист ТТХ. Но это не значит, что она должна быть скучной или нечитаемой.
Что должно быть в карточке:
- Фото товара или схемы;
- Название и артикул;
- Краткие характеристики (грузоподъёмность, габариты, тип двигателя);
- Кнопка «Запросить цену» или «Скачать спецификацию»;
- Индикатор наличия;
- Ссылка на PDF-файл с подробным описанием.
Полезно разместить блок с аналогами или рекомендациями: «Похожие модели», «Может подойти для…». Это помогает пользователю, если нужной позиции нет в наличии.
Убрать всё лишнее и не пытаться вдохновлять
В потребительских интернет-магазинах любят использовать баннеры, акции, яркие заголовки. В B2B-каталоге это только мешает.
Не стоит добавлять:
- Слайдеры и видео на главной;
- Поп-апы с «успей заказать»;
- Оформление в духе маркетплейсов.
Если пользователь зашёл на сайт, чтобы найти погрузчик или сварочный аппарат, он хочет решить задачу. Оформление не должно мешать: нейтральные цвета, строгая типографика, понятная структура.
Главная цель — не привлечь, а не отпугнуть. Интерфейс должен быть инструментом, а не витриной.
Придумать логичную иерархию каталога
Каталог должен повторять логику мышления пользователя. Если человек ищет погрузчик, он сначала выбирает тип, потом характеристики, потом производителя.
Ошибки:
- Слишком сложная структура с 5–6 уровнями вложенности;
- Креативные названия разделов типа «Машины нового поколения»;
- Разделение по внутренним бизнес-единицам компании.
Лучше:
- Простой список категорий: «Погрузчики», «Штабелёры», «Тележки»;
- Упорядочивание по назначению, а не по бренду;
- Возможность быстро вернуться на уровень выше.
Не забывайте про хлебные крошки и удобную навигацию в верхней части страницы.
Добавить действия без регистрации
Закупщик не хочет регистрироваться, чтобы скачать спецификацию. Ему нужно:
- Скачать PDF без лишних шагов;
- Сравнить 2–3 модели по ключевым параметрам;
- Отправить ссылку коллеге;
- Запросить цену без ввода ИНН, КПП и наименования юрлица.
Удобные функции:
- Кнопка «Отправить в Telegram» или «Скопировать ссылку»;
- Сравнение по таблице;
- Простой pop-up с формой на 2 поля: имя и телефон или e-mail.
Чем меньше препятствий между пользователем и действием, тем выше шанс, что контакт произойдёт.
B2B-каталог техники — это не шоурум и не витрина. Это рабочий инструмент, которым пользуются люди, решающие конкретные задачи. Чем быстрее и проще они смогут найти нужный товар, тем выше вероятность покупки.
Хороший дизайнер не старается впечатлить пользователя. Он делает интерфейс, который помогает выбрать и заказать.
Если хотите потренироваться, найдите на сайте любого крупного поставщика нужный вам электрический вилочный погрузчик. Засеките время. Если уложились в минуту — интерфейс работает. Если нет — теперь вы знаете, как его улучшить.