Разработка сайта для дилера ALUTECH: от анализа рынка до запуска на "1С-Битрикс"

1. Анализ рынка и разработка позиционирования

Четыре исследования

Самый объёмный этап проекта. Он состоял из четырёх исследований, и каждое дало материал, который потом лёг в конкретные блоки сайта.

Анализ рынка и отрасли. Кабинетное исследование рынка ворот, автоматики и смежных решений в Перми и Пермском крае: структура спроса, сезонность, каналы продаж, динамика последних лет, PEST-анализ, барьеры входа и регуляторные требования. Отдельно оценила зоны неудовлетворённого спроса – интеграция с умным домом, сервисное обслуживание и модернизация, нестандартные дизайнерские решения.

Целевая аудитория. Сегментация по B2C и B2B с описанием профиля, потребностей, продуктовых предпочтений и модели поведения каждого сегмента. Дальше – CJM по ключевым сегментам, CustDev-инсайты и разбор задач по логике JTBD. Именно отсюда выросли формулировки: "хочу видеть шоурум и гарантии", "хочу доступную цену, но качественный монтаж", "нужны решения под ключ, включая сервис".

Анализ конкурентов. Разбор официального представительства бренда и региональных игроков: ассортимент, ценовая политика, УТП, коммуникация, цифровое присутствие, клиентский опыт. Сравнительная таблица по единым критериям, отдельный разбор сайтов, SWOT-анализ "Колибри".

Позиционирование. Итоговое позиционирование сформировано на основании результатов анализа рынка, целевой аудитории и конкурентов. Дополнительно определены архетипы бренда, tone of voice, рекомендации по типографике и цветовой палитре.

Ключевое решение проекта

Конкуренты продают ворота. Завод продаёт продукт. Свободной осталась позиция того, кто продаёт результат.

"Колибри" – входные решения ALUTECH с инженерным подходом.
Ворота и автоматика ALUTECH – под ключ, с инженерной точностью, премиальной эстетикой и умной интеграцией.

Логика простая. Производитель – это завод и логистика: у него "вот ворота". Дилер с инженерной экспертизой может дать другое: расчёт под конкретный дом или объект, учёт архитектуры, реальную интеграцию в умный дом, сопровождение после монтажа. Клиент в этой категории покупает не изделие, а уверенность, что сделают правильно и потом не бросят. Это и стало территорией бренда.

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

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

Tone of voice. Уверенно и профессионально, на "вы", без воды и без пафоса. Впечатление "профессионалы, которые решают", а не "продавцы, которые убеждают".

Как позиционирование определило структуру сайта

Каждый вывод исследования получил свой блок на странице. Это и есть проверка, что маркетинг был не для отчёта.

Инженерный подход. Бесплатный инженерный замер с точностью до миллиметра, расчёт нагрузок, учёт архитектуры объекта – вынесено в отдельный сквозной блок, а не спрятано в "услугах".

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

Умная интеграция. Зона неудовлетворённого спроса из анализа рынка стала полноценной темой на сайте: интеграция ворот и рольставен с системами умного дома.

Два пути пользователя. Каталог разведён на частные решения и промышленные, включая перегрузочное оборудование и шлагбаумы – без смешивания аргументации B2C и B2B.

Быстрый расчёт. Онлайн-калькулятор как ответ на поведение среднего сегмента: сравнить варианты и спланировать бюджет до разговора с менеджером.

Сервис как продукт. Обслуживание, регламентное ТО и время реакции сервисной службы описаны отдельно – это то, чего нет у большинства конкурентов в коммуникации.

Контент вместо баннеров. Рубрика "Взгляд инженера": разборы типовых ошибок и выбора конструкций. Экспертность подтверждается текстами, а не словом "профессионалы".

Шоурум в сценарии. Визит в шоурум оформлен как отдельный шаг воронки с понятным сценарием консультации, а не как строка с адресом в контактах.

Результат на выходе: четыре исследования рынка, целевой аудитории, конкурентов и позиционирования; сформулированное позиционирование, архетипы бренда и tone of voice – каждый вывод получил свой блок на странице.

Анализ рынкаPESTСегментация ЦАCJMCustDevJTBDКонкурентный анализSWOTПозиционированиеАрхетипы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, показывающие путь от источника трафика до сделки.