Образ
Тёмный hero, тонкая типографика, золото логотипа — язык премиального фасада.
О проекте
Не прайс в интернете.
Витрина производителя.
Заказчик — производитель премиальных алюминиевых заборов, жалюзи, ворот и бетонных изделий. Аудитория смешанная: владельцы участков, архитекторы, подрядчики. Сайту нужно было сразу сказать «это премиум от завода», а не «дешёвые секции с доставкой».
Главный риск в этой нише — выглядеть как типовой строительный каталог: синий хедер, прайс в таблице, стоковые фото. Мы пошли от обратного: образ ограждения как архитектурного объекта.
Витрина
Крупные категории и реальные объекты, а не сетка SKU без воздуха.
Диалог
Прайс, расчёт и мессенджеры рядом — без лабиринта до менеджера.
Идея
Сайт как пролёт забора
Метафора проекта — горизонтальные ламели. Они задают ритм экранов: тёмный «столб» с брендом, светлые «пролёты» с каталогом, золотая «калитка» как CTA.
- Фото решает — текстура алюминия и столба продаёт статус сильнее любого слогана.
- Золото дозировано — логотип, кнопки, акценты. Не заливка экрана.
- Один главный жест на первом экране — «Открыть каталог».
- Тонкий шрифт — архитектурная лёгкость, а не «строительный жирный».
Визуальная система
Палитра и типографика
Цвета и шрифты собраны из характера продукта: уголь металла, бронза фурнитуры, свет бетона на внутренних страницах.
#1a1c1fоснова
#2c3036шапка
#ca9e67акцент
#735611CTA
#f7f7f7витрина
ПИТЕР
ЗАБОР
Премиальные заборы от производителя
Poiret One держит тонкий архитектурный тон заголовков. Open Sans отвечает за навигацию, карточки и формы — чтобы премиум не мешал читать.Главный экран
Фасад, а не баннер
Первый экран — витрина бренда: фото реального объекта на всю ширину экрана сайта, логотип и имя по центру, один CTA в бронзе.
- 1 Фото ограждения на весь hero сайта — продукт в среде, без коллажей
- 2 Золотой знак и «Питер-забор» — бренд как Hero, не как подпись в шапке
- 3 Тонкий слоган: премиум + «от производителя»
- 4 Единственная кнопка ведёт в каталог — без конкурирующих акцентов
- 5 Телефон и соцсети в шапке — короткий путь к диалогу
Витрина
Каталог как шоурум
После главного экрана — не лента товаров, а крупные направления. Посетитель выбирает тип ограждения так же, как выбирал бы материал на объекте.
Карточка позиции
Объект слева,
расчёт справа
На примере карточки алюминиевых секций «Вертикаль» фото объекта занимает главную площадь. Рядом — короткая форма расчёта: телефон и имя. Это не корзина ради корзины, а приглашение к коммерческому разговору.
- Галерея установленных объектов
- Форма «заказать расчёт» без лишних полей
- Тот же тёмный hero/header и золотой акцент
Доверие
Прайс, компания, контакт
Премиум-образ держит характер. Эти экраны отвечают на вопросы до звонка: сколько стоит ориентир, кто производит, как связаться.
Скриншот мобильной версии · piter-zabor.ru
Адаптив
Тот же фасад
в кармане
На узком экране hero остаётся полнокадровым: логотип, имя бренда, слоган и CTA складываются вертикально. Премиальный тон не сжимается в «визитку».
- CMS
- WordPress
- Каталог
- WooCommerce
- Тема
- The7 + child
- Сборка
- Elementor
- Шрифты
- Poiret One · Open Sans
- Лиды
- Формы · мессенджеры
Результат
Сайт со своим металлом
Цельный digital-образ производителя: тёмный фасад, золотой акцент, сильная продуктовая фотография и понятный путь от витрины к расчёту. Сайт говорит языком премиального ограждения — и остаётся рабочим инструментом для заявок.
Результат: piter-zabor.ru
Нужен сайт, который передаёт статус вашего продукта?
Обсудить проект