Разработка сайта-каталога для производителя заборов Artline

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

До редизайна продукт объясняли менеджеры по телефону: клиент не понимал, из чего состоит секция, чем комплектация «Лайт» отличается от «Премиума» и почему стоимость считается за погонный метр. Шаблонный сайт-визитка с одной формой такую задачу не закрывает — он не показывает конструкцию и не даёт сравнить варианты.

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

Работы шли от аналитики продукта и его комплектаций к прототипу, дизайну и вёрстке на Tilda.

• Разбор продукта: линейки, комплектации, состав секции, логика ценообразования за погонный метр.
• Прототип каталога и карточек комплектаций.
• UX/UI-дизайн первых экранов, каталога, карточек и блоков дополнительных услуг.
• Вёрстка в Zero Block с адаптивом от 320 px.
• Формы заявки: расчёт стоимости, вызов замерщика, обратный звонок, квиз.
• Подготовка структуры и метатегов под дальнейшее SEO-продвижение.

Навигация построена вокруг продуктовых направлений: заборы, ворота, калитки. Из меню и из слайдера на первом экране пользователь попадает сразу в нужный раздел, а не в общий каталог.

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

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

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

Типографика построена на паре Bebas Neue и Arial: акцидентные заголовки задают ритм первых экранов, основной текст остаётся спокойным и читаемым в описаниях комплектаций.

Продукт подаётся собственным контентом — фотосъёмкой смонтированных объектов, 3D-визуализациями секций и раскладкой элементов. Интерфейсные решения подчинены сравнению: одинаковая сетка карточек, единый порядок характеристик, цена и кнопка расчёта всегда на одном месте.