Сайт для дилера ALUTECH
9 мин 336 Обновлено 30 сентября
Факты проекта
- Моя работа
- Маркетинг, дизайн, разработка, наполнение, аналитика
- 1С-Битрикс: Управление сайтом, 2026
Что умеет сайт
- Каталог входных групп и автоматики ALUTECH с разделами готовых решений
- Онлайн-калькулятор стоимости прямо на сайте
- Два пути пользователя: для частного клиента и для организации
- Акции, блог и отзывы, которыми клиент управляет сам
- Формы заявок под разные сценарии: замер, расчёт, сервис, шоурум
- Наполнение каталога с ИИ по утверждённым правилам, с ручной проверкой характеристик и сертификатов
- Сквозная аналитика: цели Яндекс Метрики, Roistat и передача заявок в Битрикс24
- Карта проекта и визуальная инструкция в Figma для самостоятельной работы клиента
Что было и что нужно было решить
Задача разработки сайта для дилера ALUTECH
// Создать сайт для регионального дилера федерального бренда в условиях, где у всех конкурентов одна и та же продукция, одни и те же прайсы и почти одинаковые аргументы.
(01) Что было
Минималистичный сайт с базовыми категориями и калькулятором. Сильные стороны компании – шоурум, инженерная экспертиза, обучение специалистов – на сайте почти не читались. Не было портфолио, отзывов, прозрачных условий, гарантий и внятного отличия от самого производителя и других дилеров.
(02) Что нужно было решить
- Найти позиционирование, которое не конкурирует с заводом-производителем напрямую
- Собрать сайт, одинаково работающий для частного клиента и для промышленного объекта
- Дать клиенту систему, которой он сможет управлять сам
Как это выглядит сейчас
Этапы работы над сайтом
Семь этапов, каждый со своим результатом на выходе. Ни один следующий не начинался, пока предыдущий не был принят клиентом.
1. Анализ рынка и разработка позиционирования
Четыре исследования
Самый объёмный этап проекта. Он состоял из четырёх исследований, и каждое дало материал, который потом лёг в конкретные блоки сайта.
Анализ рынка и отрасли. Кабинетное исследование рынка ворот, автоматики и смежных решений в Перми и Пермском крае: структура спроса, сезонность, каналы продаж, динамика последних лет, PEST-анализ, барьеры входа и регуляторные требования. Отдельно оценила зоны неудовлетворённого спроса – интеграция с умным домом, сервисное обслуживание и модернизация, нестандартные дизайнерские решения.
Целевая аудитория. Сегментация по B2C и B2B с описанием профиля, потребностей, продуктовых предпочтений и модели поведения каждого сегмента. Дальше – CJM по ключевым сегментам, CustDev-инсайты и разбор задач по логике JTBD. Именно отсюда выросли формулировки: "хочу видеть шоурум и гарантии", "хочу доступную цену, но качественный монтаж", "нужны решения под ключ, включая сервис".
Анализ конкурентов. Разбор официального представительства бренда и региональных игроков: ассортимент, ценовая политика, УТП, коммуникация, цифровое присутствие, клиентский опыт. Сравнительная таблица по единым критериям, отдельный разбор сайтов, SWOT-анализ "Колибри".
Позиционирование. Итоговое позиционирование сформировано на основании результатов анализа рынка, целевой аудитории и конкурентов. Дополнительно определены архетипы бренда, tone of voice, рекомендации по типографике и цветовой палитре.
Ключевое решение проекта
Конкуренты продают ворота. Завод продаёт продукт. Свободной осталась позиция того, кто продаёт результат.
"Колибри" – входные решения ALUTECH с инженерным подходом.
Ворота и автоматика ALUTECH – под ключ, с инженерной точностью, премиальной эстетикой и умной интеграцией.
Логика простая. Производитель – это завод и логистика: у него "вот ворота". Дилер с инженерной экспертизой может дать другое: расчёт под конкретный дом или объект, учёт архитектуры, реальную интеграцию в умный дом, сопровождение после монтажа. Клиент в этой категории покупает не изделие, а уверенность, что сделают правильно и потом не бросят. Это и стало территорией бренда.
Архетип: Мудрец. Эксперт и инженер, который делает сложное понятным. Доверие строится через системность, а не через обещания.
Архетип: Опекун. Партнёр, который сопровождает от первой консультации до долгосрочного сервиса. Спокойно, предсказуемо, без давления.
Tone of voice. Уверенно и профессионально, на "вы", без воды и без пафоса. Впечатление "профессионалы, которые решают", а не "продавцы, которые убеждают".
Как позиционирование определило структуру сайта
Каждый вывод исследования получил свой блок на странице. Это и есть проверка, что маркетинг был не для отчёта.
Инженерный подход. Бесплатный инженерный замер с точностью до миллиметра, расчёт нагрузок, учёт архитектуры объекта – вынесено в отдельный сквозной блок, а не спрятано в "услугах".
Страх "сделают не так". Главный барьер премиального сегмента снимается открытой командой с именами, стажем и зонами ответственности, многоступенчатым контролем и понятной гарантией по трём направлениям.
Умная интеграция. Зона неудовлетворённого спроса из анализа рынка стала полноценной темой на сайте: интеграция ворот и рольставен с системами умного дома.
Два пути пользователя. Каталог разведён на частные решения и промышленные, включая перегрузочное оборудование и шлагбаумы – без смешивания аргументации B2C и B2B.
Быстрый расчёт. Онлайн-калькулятор как ответ на поведение среднего сегмента: сравнить варианты и спланировать бюджет до разговора с менеджером.
Сервис как продукт. Обслуживание, регламентное ТО и время реакции сервисной службы описаны отдельно – это то, чего нет у большинства конкурентов в коммуникации.
Контент вместо баннеров. Рубрика "Взгляд инженера": разборы типовых ошибок и выбора конструкций. Экспертность подтверждается текстами, а не словом "профессионалы".
Шоурум в сценарии. Визит в шоурум оформлен как отдельный шаг воронки с понятным сценарием консультации, а не как строка с адресом в контактах.
Результат на выходе: четыре исследования рынка, целевой аудитории, конкурентов и позиционирования; сформулированное позиционирование, архетипы бренда и tone of voice – каждый вывод получил свой блок на странице.
2. Прототипирование сайта в Figma
Структура сайта и логика каждой страницы до отрисовки дизайна. Ключевая задача прототипов – развести два пути пользователя, которые в этой отрасли постоянно мешают друг другу: частный клиент, который хочет быстро посчитать и посмотреть, как это будет выглядеть у него, и представитель компании, которому нужны характеристики, ресурс циклов, сертификаты и условия сервиса. Одновременно проектировала сценарии калькулятора и точки входа в заявку на разных стадиях выбора.
Результат на выходе: структура сайта и логика каждой страницы, разведённые пути B2C и B2B, сценарии калькулятора и точки входа в заявку – утверждённые прототипы для перехода к дизайну.
3. Дизайн корпоративного сайта для дилера ALUTECH
После утверждения позиционирования и прототипов появилась визуальная система сайта. Задача была не просто оформить страницы, а передать через интерфейс три свойства бренда: инженерную точность, премиальную эстетику и человеческий сервис.
Дизайн продолжил позиционирование "Колибри" как инженерного бренда и партнёра: точного и технологичного, но без холодной корпоративности. Мудрец отвечает за структуру, ясную типографику, логику интерфейсов и ощущение инженерной точности. Опекун – за спокойную коммуникацию, человеческую подачу и ощущение сопровождения, а не продажи.
Отсюда – строгая структура и геометрия, крупная типографика, много свободного пространства, спокойные нейтральные поверхности и выраженный терракотовый акцент. Техническая информация подаётся структурно и без перегруза, а фотографии команды, шоурума и реализованных объектов добавляют бренду человеческое присутствие. При этом визуальный язык остаётся совместимым с продуктом ALUTECH, но формирует самостоятельный образ "Колибри".
Результат на выходе: визуальная система сайта – типографика, отступы, палитра с терракотовым акцентом – и утверждённые дизайн-макеты, совместимые с продуктом ALUTECH.
4. Разработка сайта на "1С-Битрикс"
Всю разработку вела на отдельном dev-сервере, не затрагивая действующий сайт клиента: пока создавалась новая версия, старый сайт продолжал работать и принимать заявки. Каталог, разделы решений, акции, блог, отзывы, формы и онлайн-калькулятор реализованы на "1С-Битрикс" с использованием его стандартной архитектуры и механизмов управления контентом.
Параллельно с разработкой собирала полную карту проекта для клиента: какие разделы существуют, из каких инфоблоков они собираются, какое поле за что отвечает и что изменится на сайте, если это поле поправить. Этот документ потом стал основой обучения.
Результат на выходе: рабочий сайт на "1С-Битрикс" на отдельном dev-сервере – каталог, разделы решений, акции, блог, отзывы, формы и онлайн-калькулятор – и карта проекта для клиента.
5. Наполнение сайта с помощью ИИ и перенос на продакшен
Каталог дилера – это большое количество однотипных товарных и технических страниц, где структура повторяется, а параметры меняются от модели к модели. Для такого объёма я выстроила процесс наполнения с ИИ по заранее заданным правилам: утверждённый tone of voice, единая структура описаний, фактура из технической документации ALUTECH и отдельные требования для каждого типа страницы.
ИИ формирует черновики карточек, описаний разделов, SEO-метаданных и служебных текстов. Я редактирую их, сверяю с первоисточниками и утверждаю перед публикацией. Технические характеристики, сертификаты, гарантии и нормативные данные проверяются вручную по документации производителя – здесь автоматическая генерация не заменяет верификацию.
После наполнения и приёмки сайт переносится с dev-сервера на production: подключаются домен и почта, настраиваются редиректы, robots.txt и sitemap.xml, затем повторно проверяются формы, заявки и основные пользовательские сценарии.
Результат на выходе: наполненный и проверенный сайт, перенесённый на production – с доменом, почтой, редиректами, robots.txt и sitemap.xml.
6. Обучение работе с сайтом на "1С-Битрикс"
После запуска клиенту важно самостоятельно управлять сайтом, а не обращаться к разработчику за каждым изменением. Поэтому обучение вошло в проект отдельным этапом.
Собрала визуальную инструкцию в Figma: как добавить товар, завести акцию, опубликовать новость или статью, изменить контент на главной и работать с заявками. Вместо большого текстового регламента – схема со скриншотами и пояснениями, где видно, какой раздел открыть, какое поле изменить и как это отразится на сайте.
Инструкция продолжает карту проекта, которую я собирала параллельно с разработкой: клиент получает не только готовый сайт, но и понятную систему для дальнейшей самостоятельной работы.
Результат на выходе: визуальная инструкция в Figma для контент-менеджера – как добавить товар, завести акцию, опубликовать материал и работать с заявками.
7. Настройка аналитики сайта: Яндекс.Метрика, Roistat и Битрикс24
Финальный этап – настройка аналитики. В Яндекс.Метрике настроены цели на ключевые действия: отправку заявки, расчёт в калькуляторе, вопрос инженеру, запись в шоурум и звонок. Roistat связывает источники трафика с обращениями и сделками, а интеграция с Битрикс24 позволяет продолжить этот путь уже внутри CRM.
В результате можно анализировать не только посещаемость сайта и количество заявок, но и весь путь от рекламного источника до обращения и дальнейшей работы с клиентом. Эти данные становятся основой для оценки рекламы и дальнейшего развития сайта.
Результат на выходе: настроенная сквозная аналитика – цели в Яндекс.Метрике, Roistat и интеграция с Битрикс24, показывающие путь от источника трафика до сделки.
Что в итоге получил бизнес
Если сложить всё вместе, с чем компания осталась после запуска:
- сайт, который отличается от завода и от соседних дилеров не ценой, а тем, как показана работа: инженерный замер, открытая команда, гарантия и сервис;
- частный клиент и организация ходят по сайту разными путями и не спотыкаются о чужие аргументы;
- каталог, акции, блог и отзывы клиент ведёт сам, по инструкции, без разработчика;
- путь от рекламного источника до обращения и сделки виден целиком, а не обрывается на заявке;
- карта проекта и визуальная инструкция остались у клиента: сайт можно передать новому сотруднику, а не разбираться в нём заново.
Кому подойдёт то же решение
Такая работа нужна не каждому дилеру, и я скажу прямо, где она себя не окупит.
- Подойдёт, если вы продаёте то же, что и соседи: один завод, одни прайсы, одни и те же фотографии в каталоге. Отличаться приходится не товаром, а тем, как вы работаете, и это нужно показать на сайте.
- Подойдёт, если на одном сайте встречаются частный клиент и организация. У них разные вопросы, разные аргументы и разная скорость решения, а сайт обычно пишут под кого-то одного.
- Подойдёт, если вы хотите вести сайт сами: добавлять товары, заводить акции, публиковать материалы, не обращаясь к разработчику за каждой правкой.
- Скорее не подойдёт, если задача – быстро поставить каталог и запустить рекламу. Исследование и позиционирование здесь самый длинный этап, и он окупается на горизонте года, а не месяца.
// Если не понимаете, в какую половину попадаете, напишите мне – по вашему рынку и по тому, кто у вас покупает, это видно за один разговор.
Что учесть, если готовите такой же сайт
// Все семь этапов здесь вела одна я: исследование и позиционирование, прототипы и дизайн, разработку на "1С-Битрикс", наполнение с ИИ, обучение и аналитику. Это и есть ответ на вопрос, зачем нужен человек на стыке маркетинга, дизайна и разработки: выводы исследования доходят до вёрстки без потерь на передаче между подрядчиками, а аналитика ставится тем же человеком, который знает, какие действия на сайте вообще имеют смысл.
Частые вопросы
Зачем дилеру своё позиционирование, если продукт тот же, что у завода и у других дилеров?
Потому что продукт, прайсы и аргументы у всех одинаковые, и без своей позиции сайт конкурирует только ценой. В проекте "Колибри" исследование показало свободную территорию: производитель продаёт изделие, а дилер с инженерной экспертизой может продавать результат – расчёт под конкретный объект, интеграцию с умным домом и сопровождение после монтажа. Это и легло в основу сайта.
Можно ли начать сразу с дизайна и пропустить исследование?
Можно, но тогда структура и визуальный язык строятся на вкусах, а не на стратегии, и каждый блок становится предметом спора. В этом проекте исследование заняло больше всего времени, зато каждый его вывод получил свой блок на странице, и на этапе дизайна вопросов "почему здесь так" уже не было.
Что будет со старым сайтом, пока делается новый?
Он продолжает работать и принимать заявки. Новая версия создаётся на отдельном dev-сервере, а переезд на боевой домен становится плановым шагом: подключаются домен и почта, настраиваются редиректы, robots.txt и sitemap.xml, повторно проверяются формы и основные сценарии.
Как наполняется большой каталог и можно ли доверять ИИ технические характеристики?
ИИ готовит черновики карточек, описаний разделов и метаданных по заранее заданным правилам: утверждённый tone of voice, единая структура, фактура из документации производителя. Технические характеристики, сертификаты, гарантии и нормативные данные проверяются вручную по документации ALUTECH – генерация экономит недели на объёме, но не заменяет верификацию фактов.
Сможет ли компания сама менять сайт после запуска?
Да, это отдельный этап проекта. Клиент получает карту проекта, где видно, из каких инфоблоков собирается каждый раздел и какое поле за что отвечает, и визуальную инструкцию в Figma: как добавить товар, завести акцию, опубликовать статью и работать с заявками. После обучения контент меняется без обращения к разработчику.
Зачем настраивать аналитику до запуска, а не потом?
Чтобы у первых месяцев работы сайта была точка отсчёта. В проекте настроены цели в Яндекс Метрике на заявку, расчёт в калькуляторе, вопрос инженеру, запись в шоурум и звонок; Roistat связывает источники трафика с обращениями, а интеграция с Битрикс24 продолжает путь клиента внутри CRM. Так видно весь путь от рекламного источника до сделки.
Материалы по теме
Что почитать дальше по этой теме
