Каталог сложной продукции на сайте: как сделать удобные фильтры для инженеров

Продавать промышленные насосы, электрощитовое оборудование или металлопрокат — это не то же самое, что продавать смартфоны. Когда мы переносим логику обычного розничного (B2C) интернет-магазина на сайт завода или крупного дистрибьютора, система ломается.

Закупщик или главный инженер приходит на сайт с готовой спецификацией на 50 страниц. Ему не нужны эмоциональные описания товара, ему нужны точные технические характеристики. Команда НС Диджитал рассказывает, как спроектировать систему фильтрации, которая сэкономит время техническим специалистам и увеличит конверсию вашего B2B-портала.

1. Психология инженера: Как ищут сложный продукт

В B2B-закупках пользователь ищет решение конкретной задачи под строгие физические и юридические ограничения.

Поиск по артикулу и ГОСТу: Это первичный паттерн. В фильтрах и строке поиска обязательно должна быть поддержка внутренних артикулов, артикулов производителя (Vendor Code), штрихкодов и точных названий стандартов (например, «ГОСТ 10704-91»).

Точные диапазоны: Для инженера разница между напряжением 220В и 240В или классом защиты IP54 и IP65 критична. Фильтры должны поддерживать строгий выбор, а не абстрактные категории «мощный / слабый».

Многомерность: Часто товар ищут не по прямому назначению, а по косвенным параметрам — например, по габаритам (чтобы оборудование влезло в конкретный проем) или по весу (ограничения логистики).

2. Архитектура умных фильтров: UX-решения для B2B

Сделать список из 50 параметров в левой колонке — это не решение, это издевательство над пользователем. Правильный UX/UI фильтра сложной продукции строится на следующих принципах:

Иерархия и сворачиваемость: Вынесите 5-7 самых важных, образующих параметров наверх в развернутом виде. Остальные 40 специфических характеристик скройте под спойлер «Все параметры» или сгруппируйте по смыслу (Электрика, Габариты, Материалы).

Связанные (зависимые) фильтры: Если клиент выбирает «Материал: Нержавеющая сталь», система должна мгновенно скрыть или сделать неактивными те диаметры труб, которые не производятся из этого материала. Это исключает тупиковый сценарий «Найдено 0 товаров».

Поиск внутри фильтра: Если у вас 100 вариантов сечения кабеля, заставлять пользователя скроллить этот список нельзя. Добавьте мини-строку поиска прямо над списком значений конкретного фильтра.

Подсказки (Tooltips): Инженеры могут быть компетентны, но стандарты меняются. Добавьте иконки знака вопроса [?] рядом со сложными параметрами. При наведении должна всплывать расшифровка аббревиатуры или методики измерения.

3. Фундамент каталога: Правильная номенклатура в 1С

Идеальный интерфейс на сайте не будет работать, если у вас хаос в базе данных. В 90% случаев при разработке B2B-порталов мы сталкиваемся с тем, что в 1С технические характеристики вписаны единым текстом в графу «Наименование» (например, «Насос К 80-50-200а 5,5/3000»).

Как должно быть:

Сайт может фильтровать только структурированные данные. Чтобы создать мощный фильтр, в вашей 1С (или другой ERP) должны быть заведены отдельные свойства номенклатуры:

Мощность: 5,5 кВт
Обороты: 3000 об/мин
Материал проточной части: Чугун

Интеграция от НС Диджитал позволяет автоматически выгружать эту структуру из 1С на сайт, создавая динамические фильтры без ручного дублирования информации контент-менеджерами.

4. Визуальная эстетика (UI) технического фильтра

Интерфейс для инженера должен быть строгим, чистым и контрастным.

Мы используем премиальный минимализм: глубокие матовые фоны для снижения нагрузки на глаза при долгой работе, тонкие линии разделителей и акцентные неоновые цвета (например, #00ff00) исключительно для индикации примененных фильтров и кнопок целевого действия. Никакого визуального мусора — только данные и инструменты для работы с ними.

Сравнение подходов: B2C vs B2B фильтрация

FAQ: Создание сложных каталогов