сайт-пример · Вымышленный завод ЛСТК «Уралпрофиль» · сборка демо: около 1 рабочего дня, 24.10.2026
Сайт завода металлоконструкций: каталог, калькулятор ангара, заявка в CRM
Каталог с таблицами типоразмеров, калькулятор ангара с эскизом и разбивкой, объекты и заявка с UTM-метками для amoCRM или Битрикс24.
Откройте «Калькулятор», посчитайте ангар 96×30×10 с PIR и краном и нажмите «Получить точную смету» — после отправки видно, какие поля и метки получил бы менеджер.
Данные никуда не отправляются и не сохраняются.
Задача
Типовой тендер на сайт производителя: каталог с характеристиками и документами, калькулятор, портфолио объектов, заявка с UTM в amoCRM или Битрикс24, SEO и быстрая загрузка. Покупатель — инженер или снабженец, он сравнивает цифры, а не картинки.
Что сделано
- Каталог на 9 позиций с фильтрами и сортировкой; карточка с таблицей типоразмеров на 12–16 строк, документами и кнопкой «запросить» с подстановкой товара.
- Калькулятор ангара: габариты, обшивка, снеговой район, кран, ворота. Вилка цены с разбивкой, срок и эскиз с размерами; расчёт переносится в заявку.
- 10 объектов с фильтром по отраслям: габариты, тоннаж каркаса, панели, срок.
- Заявка с проверкой полей и экраном «так ушло бы в CRM»: сделка, контакт, UTM, ответственный, задача и уведомление менеджеру.
- SEO: title и description на каждой странице, Schema.org, sitemap, canonical, og-теги.
Роли
- Снабженец — каталог, калькулятор, заявка
- Менеджер продаж — получает карточку лида и уведомление (показано экраном)
Ключевой момент
Калькулятор, заявка и CRM работают одной цепочкой: посетитель считает ангар, жмёт «Получить точную смету», форма приходит с габаритами и ориентиром цены, а после отправки видно, какие поля и UTM-метки менеджер получит в amoCRM.
Замеры
На демо-данных, методика указана в каждой строке. Реального клиента у демо нет, поэтому цифр «выручка выросла» здесь нет.
Скриншоты
Нажмите, чтобы увеличить. Листайте свайпом или стрелками.
Стек и архитектура
- HTML, CSS, JavaScript без фреймворков
- сборка на Python
- шрифты локально
- webp с srcset
- Caddy
- Исходники страниц собираются скриптом: общая шапка, подвал, meta и sitemap.
- Каталог, калькулятор и заявка — три небольших модуля.
- Пользовательский ввод экранируется перед выводом (проверено пробой XSS через адрес).
Интеграции
amoCRM, Битрикс24 и Telegram показаны экраном-имитацией. В проде: форма уходит на сервер, оттуда в API CRM (сделка, контакт, UTM), уведомление в Telegram, антиспам, защита от дублей по телефону, Яндекс Метрика с целями.
Как было бы в проде
- Открытая индексация, реальный прайс из 1С или таблицы.
- Редактор каталога и объектов по выбору заказчика.
- Реальные фото объектов вместо сгенерированных, страница политики персональных данных.
- Срок называю после разбора каталога и интеграций.
Честно: Картинки объектов сгенерированы, это не фото реальных зданий. Цены калькулятора — правдоподобная модель, а не прайс завода.
Сроки по факту
Сборка демо: около 1 рабочего дня, 24.10.2026. Код пишу вместе с ИИ-агентами, проверка — автоматическая, в браузере на сервере. Сроки проекта у заказчика — в последнем пункте «Как было бы в проде» и в разделе «Процесс и сроки».
Попробовать
Откройте «Калькулятор», посчитайте ангар 96×30×10 с PIR и краном и нажмите «Получить точную смету» — после отправки видно, какие поля и метки получил бы менеджер.
Данные никуда не отправляются и не сохраняются.
Обсудить задачу
Нужна такая система под вашу задачу? Напишите, что болит, — разберу и покажу прототип на ваших данных до договора. Как я работаю и как оплачивать — на странице портфолио.