Концепт сайта для завода сэндвич-панелей «Стенопан-Юг»: КП за три минуты
«Стенопан-Юг» — завод стеновых и кровельных сэндвич-панелей в Краснодаре, который продаёт подрядчикам и застройщикам по всему Югу. Сайт должен отвечать на вопрос «сколько и когда» раньше конкурентов — и выдавать ответ документом, который снабженец сразу несёт руководителю.
Концепт-проект: «Стенопан-Юг» — вымышленная компания. Результатов работы здесь нет: только решения и гипотезы.
О заказчике
- Отрасль: Производство сэндвич-панелей
- Город: Краснодар, доставка по ЮФО и Крыму
- Масштаб: Две линии, стеновые и кровельные панели
- Клиенты: Прорабы, снабженцы подрядчиков, застройщики, проектировщики
- Модель продаж: Расчёт → КП → счёт → производство → отгрузка
- Средний чек: Около 2,5 млн ₽ за заказ
Задача
«Стенопан-Юг» — завод сэндвич-панелей в Краснодаре: две линии, стеновые и кровельные панели на минеральной вате и PIR, отгрузка по Югу — от Ростова до Ставрополья и Крыма. Покупают у завода прорабы, снабженцы подрядчиков и отделы закупок застройщиков. Все они приходят с одним вопросом: сколько будет стоить моя площадь и когда её привезут.
Сейчас на этот вопрос сайт не отвечает. В каталоге — таблица характеристик и кнопка «Запросить цену». Дальше заявка уходит на почту, менеджер пересчитывает площадь в панели, уточняет цвет, добор и доставку и присылает КП в Word через день, а то и через два. За это время снабженец успевает разослать запрос ещё пяти заводам и выбирает того, кто ответил первым.
Вторая проблема — доверие. Для объекта с технадзором панель без сертификата и протокола пожарных испытаний не пройдёт, а на сайте документы лежат архивом «Документы.zip» внизу страницы «О компании». Проектировщику нужны узлы в DWG, прорабу — схема монтажа, закупщику — карточка предприятия. Каждый из них пишет менеджеру, и каждый ждёт.
Бизнесу нужен сайт, который работает как первый менеджер: сам считает, сам выдаёт документ, который можно положить на стол руководителю, и передаёт в отдел продаж не «заявку с сайта», а готовый расчёт с контактом, объектом и объёмом.
Что мешает купить
«Цену скажут только после звонка»
Снабженец выбирает того, кто ответил первым. Калькулятор показывает цену за м² и итог с НДС сразу, а КП в PDF можно скачать без ожидания менеджера.
«Посчитают площадь, а панелей не хватит»
Покупатель думает квадратными метрами, завод продаёт штуки. Калькулятор раскладывает площадь в панели по рабочей ширине 1 190 мм, добавляет добор и показывает, сколько это будет в штуках и тоннах.
«Не успеют к монтажу»
Срок производства зависит от загрузки линий. Он выводится в калькуляторе и каталоге по текущим данным: «Отгрузка с 7 октября» — вместо обтекаемого «в кратчайшие сроки».
«Не пройдём технадзор»
Сертификаты, протоколы пожарных испытаний, класс пожарной опасности и узлы в DWG собраны в блок документов у каждой панели. Их можно скачать до разговора с менеджером.
«Доставка выйдет в полцены»
Калькулятор считает число машин по весу и длине панелей и стоимость рейса до города. Покупатель видит полную цену объекта, а не только стоимость металла и утеплителя.
Решение
Главная идея — перевернуть порядок. Сначала цена, потом разговор. Калькулятор коммерческого предложения стоит прямо на первом экране, а не в глубине каталога: тип панели, утеплитель, толщина, площадь, цвет по RAL и город доставки. Справа — живой расчёт: цена за м², число панелей, вес, машины, доборные элементы, срок отгрузки и итог с НДС.
Результат калькулятора — не цифра на экране, а документ. Кнопка «Скачать КП в PDF» формирует коммерческое предложение с номером, датой, сроком действия цены, реквизитами завода и контактом менеджера. Снабженец прикладывает его к служебной записке, не переписывая. Для того чтобы получить файл, достаточно телефона и названия компании — этого хватает отделу продаж, чтобы перезвонить уже по делу.
Визуальный язык — инженерный. Графит и холодная сталь, сигнальный жёлтый как у разметки на производстве, моноширинные цифры, чтобы колонки цен и размеров читались как спецификация. Страница выглядит как хороший технический документ: ничего лишнего, каждая цифра на своём месте, каждая таблица выровнена.
Вокруг калькулятора — всё, что снимает риск закупки: срок производства по текущей загрузке линий, блок документов с сертификатами и протоколами, узлы в DWG для проектировщиков, объекты на карте Юга с площадями и типом панелей. Отдельная ветка — для застройщиков с большими объёмами: график поставок по этапам и персональный менеджер.
Посадочная блок за блоком
- Первый экран. Заголовок «Сэндвич-панели с завода. КП — за три минуты», короткий калькулятор-вход (площадь, толщина), строка с ближайшей датой отгрузки и три цифры о заводе. Зачем: Сразу даёт снабженцу главный инструмент и называет срок. Первое действие — ввести площадь — требует меньше усилий, чем форма заявки.
- Каталог панелей. Четыре карточки: стеновая МВ, стеновая PIR, кровельная МВ, кровельная PIR — с толщинами, ценой от, классом пожарной опасности и сроком. Зачем: Показывает, что завод делает, и сразу задаёт порядок цен. Каждая карточка ведёт в калькулятор с выбранным типом.
- Калькулятор КП. Полный калькулятор: тип, утеплитель, толщина, площадь, цвет RAL с двух сторон, город. Справа — спецификация: цена за м², штуки, вес, машины, добор, срок, итог с НДС и кнопка «Скачать КП в PDF». Зачем: Главная механика: закрывает вопросы цены, объёма, доставки и срока в одном окне и отдаёт документ, который можно переслать.
- Как выглядит КП. Превью первой страницы PDF: номер, срок действия цены, спецификация, реквизиты. Зачем: Показывает, что на выходе будет серьёзный документ, а не скриншот. Снимает страх «опять придётся всё переписывать».
- Производство и сроки. Загрузка двух линий на ближайшие недели, мощность, контроль качества, фото цеха. Зачем: Доказывает, что срок в калькуляторе — не маркетинговая цифра, и объясняет, почему заказ стоит размещать сейчас.
- Документы и объекты. Сертификаты, протоколы пожарных испытаний, узлы в DWG, карточка предприятия; ниже — объекты с площадями и отзывы подрядчиков. Зачем: Блок доверия для технадзора и закупок. Документы доступны без запроса, объекты подтверждают опыт поставок по Югу.
- Доставка по Югу. Зоны доставки, типы машин, стоимость рейса до крупных городов, правила разгрузки. Зачем: Отвечает на вопрос полной стоимости и логистики до того, как он станет возражением.
- Для застройщиков. Поставки по этапам, фиксация цены на объём, персональный менеджер и форма запроса графика. Зачем: Отдельный сценарий для крупных объёмов: другой вопрос — не «сколько стоит», а «как вы обеспечите график».
- Частые вопросы. Минимальный заказ, срок действия цены, оплата, возврат, монтаж. Зачем: Добирает остаточные возражения и даёт текст для разметки FAQPage.
- Контакты и реквизиты. Адрес завода, часы отгрузки, телефон отдела продаж, реквизиты, короткая форма обратного звонка. Зачем: B2B-покупатель проверяет компанию по реквизитам. Короткая форма — для тех, кто всё же хочет сначала поговорить.
Механики заявки
Расчёт до контакта
Итог с НДС, штуки, вес и машины показываются без ввода телефона. Контакт нужен только для PDF: «Укажите компанию и телефон — пришлём КП и закрепим цену на 10 дней». Цена в обмен на контакт воспринимается как честная сделка, а не как ловушка.
Площадь → штуки → машины
Под полем площади — поле «Проёмы, м²», которое вычитается автоматически. Калькулятор округляет до целых панелей, добавляет 6% на подрезку и показывает раскрой: «178 панелей по 6 000 мм». Прораб видит объём в тех единицах, в которых будет принимать груз.
Срок из загрузки линий
Дата отгрузки берётся из данных производства и меняется вместе с загрузкой. Подпись «Цена действует 10 дней, место в очереди — после оплаты» объясняет правила без мелкого шрифта.
КП с номером и сроком действия
PDF содержит номер, дату, срок действия цены, спецификацию, реквизиты и прямой телефон менеджера. Тот же номер попадает в CRM, поэтому при звонке менеджер открывает расчёт, а не просит продиктовать всё заново.
Сравнение толщин в один клик
Переключатель «Сравнить 100 / 150 / 200 мм» показывает три итога рядом с сопротивлением теплопередаче. Снабженец сразу видит цену каждого варианта и может согласовать выбор с проектировщиком.
Что замеряем после запуска
- Доля посетителей, начавших расчёт — Проверяем гипотезу, что калькулятор на первом экране привлекает больше людей, чем кнопка «Запросить цену». Сравниваем с исходной долей заявок по старому сайту.
- Доля скачавших КП от начавших расчёт — Главная метрика механики. Если она низкая — смотрим, где обрываются: на поле телефона или раньше. Проверяем A/B-тестом формулировку обмена «контакт на КП».
- Время от КП до первого звонка менеджера — Сайт выигрывает скорость ответа — важно, чтобы отдел продаж её не потерял. Цель — звонок в течение рабочего часа.
- Конверсия КП с сайта в счёт — Показывает качество лидов. Сравниваем с КП, которые менеджеры готовили вручную, по данным CRM.
- Скачивания документов и узлов — Отражают интерес проектировщиков. Рост скачиваний DWG — ранний сигнал будущих объектов, по которым стоит связаться с генподрядчиком.
Стек
Next.js, TypeScript, Node.js, PostgreSQL, 1С:УНФ, Битрикс24, Puppeteer.