Редизайн B2B-сайта за 2 месяца и полтора года развития

«Нержавейка.ру» — поставщик нержавеющего металлопроката с 20-летней историей. Пришли с сайтом, который годом раньше сделал другой подрядчик: трафик падал, позиции проседали, пользоваться каталогом было неудобно.

Пропустили этап макетов и стартовали сразу в коде на Nuxt UI. Структуру разделов взяли из старого сайта — ради преемственности для поиска. Работали двухнедельными спринтами с демо и отчётом по расходам в конце каждого.

Запустились за 2 месяца вместо оценки в 3–4. Обмен с 1С по ценам и остаткам был уже в первой версии.

На старте корзины не было — сознательно. Снабженцы в металлоторговле работают многопозиционными спецификациями, заказывают почтой и в мессенджерах, а доставку и резку им всё равно считает менеджер. Вместо корзины мы сделали каталог с фильтрами и формы заявок, к которым можно приложить файл спецификации.

Через год гипотеза не выдержала — по двум причинам сразу. Яндекс ограничил товарную выдачу: сайт с каталогом и ценами не соответствовал типу «интернет-магазин», пока на нём нет корзины. И сами покупатели просили складывать позиции по ходу подбора, а не собирать список в блокноте.

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

Снабженец редко ищет просто «трубу». Он ищет трубу круглую электросварную AISI 304 диаметром 20 и стенкой 1,5 — и в обычном каталоге на такой путь уходит несколько переходов и настройка фильтров.

Отдельный раздел «Подбор» разворачивает путь в четыре поля: вид проката, марка стали, диаметр, толщина стенки. Параметры выбираются в любом порядке, в каждом следующем списке остаётся только то, что действительно есть, подходящие позиции пересчитываются на лету и складываются в заказ прямо на странице. Вид проката ищется словами покупателя — «футорка», «отвод», — а не названиями номенклатуры из 1С.

Начинали с демо на двух видах проката, закрытого от индексации. Сейчас подбор охватывает весь каталог: 9 групп, 59 видов проката и почти 9 000 позиций. На каждый шаг конфигуратора заведена цель в Метрике — видно, где путь обрывается.

Каталог. Таблица вместо карточек: характеристики колонками, сортировка на сервере, фильтры по диаметру, толщине и марке стали. Появились страницы-агрегаторы поверх нескольких разделов и посадочные под размер и марку — под запросы, с которыми приходят из поиска.

Поиск. Нечёткий поиск на pg_trgm: находит с опечатками и при разной записи размеров.

Обмен с 1С. Отдельная ручка приёма выгрузки: цены, остатки, типы цен, обновление названий. Если розничной цены нет, вместо неё показывается «Узнать опт». Фасованный товар заказывается упаковками, а не произвольным весом.

Калькулятор веса. Восемь форм проката, пересчёт на лету, из результата — сразу в каталог или в заявку.

Контент и доверие. Гарантия, возврат, оплата и рассрочка, сертификаты, отзывы с виджетом Яндекс.Карт, вакансии, история компании и галерея склада.

Аналитика и надёжность. Продуктовые цели и электронная коммерция в Метрике, отслеживание ошибок, ограничение частоты обращений к формам.

Личный кабинет. Прототип на демо-данных: показываем и обсуждаем с клиентом состав первой версии.

Сайт живёт непрерывно: за полтора года — больше 1 300 изменений в коде. Каждое обновление проходит через демо на отдельном контуре, часть текстов и разделов клиент правит сам через Directus.

Часть задач приходит не от нас: работает подрядчик по SEO, отдел продаж приносит запросы от менеджеров. Мы переводим это в задачи разработки и объясняем, что даст рост, а что — косметика.

Nuxt 4, Vue 3, TypeScript, Nuxt UI Pro, Directus, PostgreSQL, 1С, Docker

B2B-порталы и личные кабинеты

Персональные цены, остатки, резерв товара, договоры и счета. Оптовые продажи переезжают из почты и мессенджеров в систему.