Московские окна: от базовой техподдержки — к масштабному проекту

О клиенте 

«Московские окна» — одна из крупнейших компаний по производству пластиковых окон в Москве. История компании началась в 1992 году, и с тех пор она уверенно растет и развивается. Сейчас это целая инфраструктура: офисы по всей России, собственные производственные площадки с высокотехнологичным оборудованием. И главное достижение — доверие 3 миллионов клиентов, которые выбрали надежность и качество «Московских окон».

Сложности проекта

История сайта mosokna.ru началась в 2007 году. За прошедшее с тех пор время над проектом успели поработать разные подрядчики — и в результате на страницах скопилось немало неактуальных данных. Они создавали путаницу и дополнительную нагрузку на систему, и в итоге этот багаж заметно снижал скорость работы сайта.

В 2024 году команда RocketDev разработала для «Мосокон» новый сайт — о нем мы и расскажем.

Ход работы

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

Как не потеряться среди конкурентов? Один из главных козырей — современный и быстрый сайт.

Первым этапом стала детальная аналитика конкурентов. На её основе мы выделили ключевые требования к разработке сайта:

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

Новый сайт реализован как веб‑приложение на базе React. Фронтенд разработан с использованием фреймворка Next.js, а бэкенд построен на платформе 1С:Битрикс. Ключевое преимущество такого решения в том, что интерфейс работает бесшовно, без перезагрузки страниц — пользователь получает более приятный опыт взаимодействия с ресурсом.

Мы добились:

• мгновенной загрузки страниц — благодаря технологии ISR пользователи получают контент моментально, а нагрузка на сервер остается минимальной, даже если контента много и он разнообразен;
• гарантированной стабильности — автоматические тесты в CI/CD отсекают любые ошибки до публикации;
• простого управления — редактирование происходит через привычную админ‑панель Битрикса, обмен данными через API в формате JSON.

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

Интегрированные сервисы

Главная цель интернет‑магазина — чтобы покупатель совершил покупку. И когда покупатель готов, важно не испортить момент, не спугнуть клиента ошибкой во время оформления заказа или сбоем в момент оплаты. Мы серьезно прокачали этот этап: упростили и ускорили оформление заказа, устранив все барьеры на пути клиента. Интеграция платежной системы Альфа‑Банка через REST API позволила автоматизировать ключевые процессы:

• данные по всем оплатам мгновенно сохраняются в админ‑панели;
• callback‑уведомления от банка обеспечивают актуальность статусов заказов в базе данных;
• информация оперативно передаётся в CRM.

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

Мы сделали работу контент‑менеджеров «Мосокон» комфортнее и продуктивнее. К привычной админ‑панели Битрикса добавлен визуальный редактор Editor.js — такой же, как на vc.ru, Tinkoff Journal и DTF. Теперь, благодаря готовым блокам и встроенным конверсионным элементам, менеджеры могут легко и быстро пересобирать страницы прямо в панели управления — без лишних согласований и ожидания помощи от техподдержки.

Отдельное внимание уделили ключевым точкам конверси: интегрировали онлайн-оплату, связали сайт с CRM и аналитическими системами, настроили корректное отслеживание лидов через идентификатор формы, UTM-метки, страницу отправки заявки и IP-адрес пользователя. Это позволило дать маркетингу точные данные для принятия решений.

Калькулятор как УТП

Калькулятор окон — не редкость. Но для «Московских окон», лидера московского рынка оконных решений, требовался по‑настоящему уникальный инструмент. Старый калькулятор, перенесенный с предыдущей версии сайта, был собран на двух фреймворках, Angular и Vue.js, и размещен на нескольких доменах. Он работал медленно и нестабильно из‑за архитектурных недочетов, из‑за ошибок логики каждое нажатие кнопки отправляло избыточные запросы — это нагружало сайт и API, пользователи уходили до завершения расчёта.

Новая версия калькулятора — самостоятельный сервис на отдельном сервере. Мы существенно улучшили функционал калькулятора:

• оптимизировали базу данных, чтобы упростить обновление цен и ассортимента, а также ускорить выгрузку данных для сотрудников;
• связали калькулятор с CRM, Яндекс.Метрикой, Calltouch, организовали передачу UTM‑меток;
• добавили предварительный расчет стоимости остекления без оформления заказа — результат будет отправлен клиенту на почту, он сможет вернуться и продолжить работу с калькулятором.

Фронтенд реализован на React, бэкенд — на Laravel. Структура проекта разработана с учётом проблем предыдущих версий — и все они устранены. Интерфейс соответствует фирменному стилю «Мосокон». Кнопка активации размещена на главной странице и в поисковой строке, переход к инструменту незаметен для пользователя — как будто это просто страница на сайте.

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

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

Обновленный калькулятор увеличил конверсию в лид на 21%:

Калькулятор «Мосокон» стал официальным УТП компании. Мы кратно ускорили его загрузку и создали эффективный конверсионный инструмент, у которого нет аналогов на рынке.

Результаты

Релиз сайта обеспечил полную готовность компании к старту сезона продаж на 100% — новый сайт успешно прошел все тесты, оптимизированы и способен бесперебойно работать даже в условиях резкого всплеска трафика. Это значит, что в самый горячий сезон:

• сайт не «упадет» под наплывом покупателей;
• заказы будут обрабатываться быстро, без лишних задержек;
• клиенты получат безупречный пользовательский опыт — и с большей вероятностью совершат покупку;
• бизнес не потеряет прибыль из‑за технических сбоев.

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

На старом сайте процент отказов из поисковых систем достигал 17,5%. Благодаря постоянной оптимизации работы нового сайта мы сократили этот показатель более чем в 12 раз — до 1,39%.

В первый же сезон повышенных продаж трафик на новый сайт вырос на 30 %. Позиции сайта в поисковых системах вышли на стабильно высокий уровень — где и сохраняются до сих пор.

После успешного запуска проекта работа не остановилась — сайт перешёл на режим постоянной профессиональной техподдержки. Мы создали надежную систему, которая гарантирует стабильность, развитие и безопасность онлайн‑присутствия «Мосокон». Наша команда круглосуточно следит за работоспособностью сайта, оперативно реагирует на любые отклонения и предотвращает сбои.