Все кейсы
РедизайнB2BКаталогПроизводство

АлюмФасад — редизайн витрины алюминиевых фасадов со стеклом

Пересобрали сайт производителя за неделю: каталог систем профиля и заполнений, видео на первом экране, заявка на расчёт для мебельщиков и дизайнеров.

Открыть алюмфасад.рфалюмфасад.рф

Роль

Полный цикл: структура, дизайн, фронт

Срок

1 неделя

Формат

Редизайн · витрина + заявки

Домен

алюмфасад.рф

Next.js 16React 19TypeScriptTailwind 4Яндекс.МетрикаРФ-VPS

01 · Контекст

Витрина производства алюминиевых фасадов

АлюмФасад делает рамочные фасады со стеклом в алюминиевом профиле. Аудитория — мебельные производства и дизайнеры: им важно быстро понять системы, материалы и оставить заявку на расчёт.

Нужен был новый каркас сайта

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

Плотный B2B-ассортимент

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

Расчёт вместо корзины

Для такого производства нормальный сценарий — заявка на расчёт по проекту, а не онлайн-оплата. Сайт ведёт к диалогу.

Мобильный путь к заявке

Мебельщики и дизайнеры часто смотрят с телефона: нужны быстрые якоря по каталогу и заметный вход в форму.

02 · Задача

Что нужно было сделать

Сжать редизайн в неделю: сохранить глубину ассортимента и сделать сайт удобным инструментом для B2B-заявок.

  • 1Пересобрать сайт с нуля на Next.js за одну неделю
  • 2Перенести и структурировать каталог профиля и стёкол
  • 3Сделать навигацию по брендам и визуальные карточки с цветами и чертежами
  • 4Собрать несколько точек входа в заявку на расчёт
  • 5Выдержать индустриальный тон: металл, точность, производство
  • 6Подключить аналитику и закрыть юридический контур

03 · Решение

Где была сложность — и как её собрали

Сложность кейса не в корзине, а в плотности ассортимента и в том, чтобы за неделю сделать витрину, которой удобно пользоваться.

01

Редизайн как смена архитектуры

Сайт собран заново на Next.js: чистая структура секций, предсказуемая вёрстка, контроль над скоростью и SEO. Медиа и ассортимент переехали со старого сайта в новую систему — без ощущения «временного лендинга».

02

Каталог профиля — система, а не галерея

Футурум, Макмарт и Аристо: десятки позиций с покрытиями и цветами. Для B2B важно показать не «красивую картинку», а линейку решений — с чертежами, оттенками и понятной навигацией по брендам.

  • Якоря и вкладки по брендам
  • Карточки с визуалами и цветовыми образцами
  • Чертежи и разрезы там, где это помогает выбору
  • Описания сложных систем вроде EDGE / EDGE MAX

03

Стёкла и зеркала — вторая ось выбора

Заполнение фасада — отдельный слой каталога: прозрачные, тонированные, матовые, рифлёные и зеркальные варианты. Профиль и стекло читаются вместе, как в реальном подборе на производстве.

04

Hero с видео

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

05

Заявка на расчёт как главная конверсия

Цены и корзина здесь не нужны — нужен качественный лид. Форма встроена в страницу и в модалку, на мобилке появляется sticky-бар. Заявки уходят в рабочий контур, подключена Яндекс.Метрика.

  • Несколько CTA по странице
  • Валидация телефона и обязательное согласие
  • Защита от спама
  • Сценарий «получить расчёт» вместо онлайн-покупки

06

Визуальный язык производства

Красный акцент, графит и металл, спокойная типографика. Сайт выглядит как витрина завода и партнёра для мебельных производств — без шаблонной «студийности».

04 · Сильные стороны

Что делает этот сайт рабочим инструментом

Три бренда профиля

Футурум, Макмарт, Аристо — с цветами, покрытиями и техническими визуалами.

Каталог заполнений

Стёкла и зеркала отдельным блоком: от прозрачных до рифлёных и «шпион».

Видео на первом экране

Продукт и производство с первых секунд — без пустого декоративного hero.

Цветовые образцы

Оттенки и покрытия читаются прямо в карточке: браш, шлифовка, анод, крацовка.

Лиды на расчёт

Форма, модалка и sticky на мобилке — один сценарий в нескольких точках.

Редизайн за неделю

Полный цикл: структура, дизайн, вёрстка, формы, аналитика, запуск.

05 · Технически

Стек и устройство

ФронтендNext.js 16 (App Router) + React 19 + TypeScript
СтилиTailwind 4 + собственная палитра производства
КаталогСтруктурированные данные профиля и стёкол в проекте
ЗаявкиФормы с валидацией, антиспамом и доставкой в рабочий контур
АналитикаЯндекс.Метрика
ЗапускРФ-VPS, nginx, pm2

Живая версия

АлюмФасад — на алюмфасад.рф

Каталог профиля и стёкол, видео-hero и заявка на расчёт — в одном редизайне за неделю.

Открыть алюмфасад.рфОбсудить свой проект