В этом кейсе разбираем сайт как инструмент роста из поиска и продаж. А если интереснее именно визуальная часть проекта, посмотреть отдельный кейс по дизайну можно здесь:
Читайте такжеЛучшая оконная компания: дизайн и разработка нового сайтаО клиенте
«Лучшая оконная компания» (Окна ЛОК) выросла из одного офиса в региональную сеть, которая за 11 лет установила больше 50 тысяч окон для 10 000 жителей Приморья. Сегодня это 7 филиалов в шести городах с собственным производством, которое позволяет выполнять заказы быстрее частных бригад.
Главным барьером для бизнеса стала архитектура сайта. По структуре она представляла собой несвязанные страницы без логической вложенности, поэтому алгоритмы поиска не могли соотнести сайт с конкретными намерениями пользователей. Узкие услуги были скрыты внутри общих разделов или вовсе не отражены, из-за чего по точечным запросам – например, «остекление балкона в хрущевке» или «окна с детскими замками» – сайт просто не отображался в выдаче. Компания теряла целевой трафик, хотя успешно предоставляла эти услуги на протяжении 11 лет.
В результате мощное региональное производство в глазах пользователя выглядело так же, как небольшая бригада из нескольких мастеров. В категории с высоким средним чеком и покупкой раз в десять лет сайт не снимал сомнения при первом контакте, а лишь усиливал страх ошибки. Такой визуальный образ лишал компанию доверия и заставлял потенциальных клиентов уходить к конкурентам в поисках более низкой цены.
Задача
Нам предстояло превратить сайт в полноценный e-commerce инструмент: создать структуру под сотни сценариев выбора и внедрить сервисы, подтверждающие статус лидера при первом же контакте.
Цели проекта:
— Создать разветвленную структуру каталога под десятки сценариев принятия решения, чтобы охватить максимум поисковых запросов в регионе.
— Увеличить количество заявок от посетителей сайта: звонки, замеры, расчеты.
— Встроить калькуляторы с возможностью расчета и онлайн-оплаты, чтобы пользователь мог узнать цену и оформить заказ без звонка менеджеру.
— Перенести доказательства надежности компании: сертификаты, реализованные проекты, гарантии, контроль качества на сайте.
— Учесть то, что окна часто ищут прямо на объекте или во время ремонта, все сервисы расчета должны работать на смартфоне так же плавно, как на десктопе.
Исследование и стратегия
Заказчик видел главную точку роста для бизнеса в своем сайте, который считал «в целом неплохим», но он уперся в потолок по инфраструктуре.
А мы как команда понимали, что точечная доработка и косметический редизайн не решит проблему экспансии во Владивосток с его агрессивной конкуренцией. Чтобы превратить сайт в инструмент продаж, мы пересмотрели всю бизнес-логику проекта и начали с исследования:
1. UX-исследование
Проанализировали более 20 конкурентов в регионе в поисках бенчмарков. И увидели общую проблему: большинство сайтов в нише строятся по логике прайс-листа, а не по логике выбора клиента. Они перегружены техническими схемами, которые не закрывают реальные боли человека.
Это дало нам первый вывод: архитектуру нужно строить от сценария пользователя, а не от внутренней структуры компании.
Второй вывод пришел из анализа барьеров аудитории. Окна – покупка с циклом раз в десять лет, где главный страх – ошибиться с подрядчиком и переплатить. Покупатель зачастую ищет подтверждения, что конкретная компания решит именно его задачу. Это значит, что каждая страница должна не только отвечать на конкретный запрос, но и снимать сомнение: почему этой компании можно доверять.
С опорой на исследования построили карту нового сайта2. Wireframes
Следующий инсайт мы получили при анализе барьеров аудитории.Сегментировали пользователей по когортам и прописали сценарии использования сайта, чтобы точно понимать, какую задачу хочет решить клиент в каждой ситуации.
Окна – это сложная покупка с циклом раз в десять лет, где главные страхи – выбрать ненадежного подрядчика или переплатить. Пользователь ищет подтверждение на эти страхи через сайт, чтобы точно понимать, что компания решит его задачу. Поэтому мы проектировали каждую страницу так, чтобы она не просто показывала профиль, а поэтапно снимала сомнения. Мы превратили абстрактное УТП в систему фактов и реализовали на сайте три сценария верификации доверия:
- Сценарий прозрачности. Мы визуализировали процесс работы в 4 понятных шага: от бесплатного замера и производства до монтажа и гарантийного обслуживания.
- Сценарий экспертности. Вместо скучных спецификаций внедрили таблицы сравнения систем, где технические параметры переведены на язык бытовых выгод — например, уровень тишины в децибелах или процент сохранения тепла.
- Сценарий надежности. Переработали блоки доказательств с акцентом на основу из 30-летней гарантии на профиль Rehau, сертификатах официального партнерства и фотографиях реальных объектов в Приморье.
А чтобы сайт начал захватывать поисковый спрос в шести городах по десяткам сценариев, нужна не одна страница про окна, а иерархия из сотни посадочных страниц под конкретные типы домов, форматы остекления и технические задачи. На основе этого спроектировали десятки вайрфреймов – они стали фундаментом SEO-архитектуры нового сайта.
Так у нас получился схематичный каркас новых интерфейсов: макет с экранами, который показывает структуру, расположение блоков и логику взаимодействияТакже на этом этапе мы искали визуальный язык, который будет вызывать доверие и подчеркивать статус лидера отрасли.
Вместо типичных строительных шаблонов мы разработали две полярные концепции: эмоциональный комфорт против технологической точности. Наша задача – позволить пользователю почувствовать качество продукта и сервиса через интерфейс.
На такие визуальные концепции опирались на этапе разработки прототипов дизайнаПереработка SEO‑структуры
После исследований сценариев пользователей и поискового спроса в Приморье, убедились в том, что работу над SEO нужно строить от конкретной бытовой проблемы. Так как у каждого запроса своя ситуация, свой страх и свое ожидание от страницы. На который старый сайт не мог ответить, так как каталог не содержал вложенности и поисковики просто не понимали, что именно эта компания решает задачу конкретного человека. Например, что она делает «шумозащитные окна у дороги». До редизайна в Яндексе по Приморскому краю у сайта было не более 70 запросов в топе.
Для этого перестроили архитектуру: для окон появились отдельные страницы под каждый сценарий. Например, страницы под энергоэффективные окна, арочные, эркерные, французские, угловые конструкции. На старте нового сайта появилось более 100+ новых посадочных страниц.
Так стал выглядеть новый расширенный каталог на сайте Для балконов сделали сегментацию сразу по нескольким признакам: тип дома, площадь, формат работ. Отдельно выделили остекление балконов в домах старого фонда, варианты с расширением, комплексную отделку под ключ.
Каждая такая страница стала самостоятельной точкой входа из поиска, чтобы человек попадал не в общий каталог, а сразу на страницу под нужную ему проблему.
Часть новых страниц с услугами, которые оказывает клиент, но они не были отображены на старом сайте клиентаОтдельно расширили структуру за счет услуг с коротким циклом спроса, ведь окна покупают раз в десять лет, но регулировка фурнитуры, замена москитных сеток или тонировка – это задачи, с которыми люди могут возвращаться и через год, и через три. Страницы под эти услуги сделали сайт точкой, стимулирующей повторные обращения и рост LTV, куда клиент возвращается между крупными покупками.
А чтобы вся архитектура из сотен новых URL работала на бизнес во всех шести городах присутствия – внедрили технологию серверного рендеринга (SSR). С помощью нее поисковые роботы мгновенно получают страницы с готовым содержимым: текстами, ценами и разметкой и не зависят от выполнения скриптов в браузере.
Это позволило поисковикам индексировать все новые страницы с первого дня без ожидания выполнения скриптов в браузере, что критично для сайта, который разом вырос с нескольких разделов до сотни посадочных страниц.
Интеграция калькулятора и CRM
На старом сайте калькуляторы существовали отдельно от воронки продаж. Раньше человек считал стоимость на сайте, а потом заново объяснял параметры менеджеру по телефону. Мы превратили их из простой формы обратной связи в систему квалификации лида, которая автоматизирует работу менеджера еще до первого звонка, а результат из калькулятора становился готовым техническим заданием.
Конфигуратор позволяет выбрать профильную систему, характеристики стеклопакета и даже цвет дистанционных рамок, а интерфейс в реальном времени пересчитывает стоимость с учетом региональной логистики для 6 городов Приморского края. Сформированное ТЗ мгновенно улетает в CRM, где менеджер видит полный состав заказа еще до первого звонка, что исключает ошибки при ручной передаче данных и сокращает время подготовки договора до 20 минут и позволяет компании эффективно обрабатывать поток заявок без расширения штата.
То, как выглядит калькулятор по расчёту окон и москитной сеткиЧтобы расчеты не оставались абстрактными, мы связали калькулятор с разделом выполненных проектов. Пользователь видит фотографии реальных объектов: лоджию на улице Свердлова, балкон на Пограничной или остекление коттеджа на Коралловой, и прямо со страницы кейса переходит к расчету аналогичной конфигурации для себя. Так готовые проекты перестали просто лежать в портфолио и превратились в готовые рецепты, которые клиент может примерить на себя.
Примеры проектов с реальных объектов в ПриморьеДля финального закрытия сделки встроили онлайн-оплату и оформление рассрочки прямо в интерфейсе. В нише с высоким средним чеком возможность зафиксировать цену или разбить платеж без визита в офис снимает последний барьер перед заявкой, особенно для тех, кто выбирает комплектацию прямо на объекте со смартфона.
Редизайн и доказательства
Главный вопрос, который задает себе человек, выбирая между компанией с ценой выше рынка и частной бригадой: за что я доплачиваю? Дизайн решал именно эту задачу – перевести реальные аргументы компании в форму, которая считывается с первого экрана и обосновывает стоимость через экспертность.
Мы отказались от стоковых схем и абстрактных рендеров в пользу фотографий реальных завершенных объектов в Приморье.
Параллельно упаковали одиннадцатилетний опыт в конкретные доказательства: блоки с тридцатилетней гарантией на профиль Rehau, партнерские сертификаты и сравнительные таблицы систем от Blitz 60 до Intelio 80, где технические параметры объяснили через бытовые выгоды: тишина в квартире, сохранение тепла, долговечность.
Примеры того, как описали технические параметры на страницах с профилямиЧтобы снять тревогу перед покупкой, весь путь клиента визуализировали в четыре понятных шага: замер, производство, установка и гарантийное обслуживание. Это позволило показать, что собственное производство компании дает возможность выполнять заказы в два раза быстрее частных мастеров при полном контроле качества на каждом этапе.
Строгая визуальная архитектура с акцентом на деталях и официальной сертификации работает на отстройку от конкурентов: такое оформление не подделать без реального опыта и документов. Для ниши, где доверие решает исход сделки чаще, чем цена, это принципиальный выбор в пользу дизайна доверия.
Все интерфейсные решения и сервисы расчета с самого начала проектировали под смартфоны. Окна часто ищут прямо на объекте в разгар ремонта, когда под рукой только телефон. Если калькулятор тормозит или форма не открывается, то логично, что человек с большей вероятности перейдет к следующему сайту, который у него загрузился. И плавность мобильной версии в нашем проект напрямую влияет на то, превратится ли визит в заявку.
Пример дизайна основной страницы проектаРезультаты
До запуска нового сайта в Яндексе по Приморскому краю у компании было не более 70 запросов в топе. Через три месяца после редизайна сайт вышел на 2 730 запросов в топ-10, из них 640 — в топ-3.
Такого результата удалось добиться за счет новой архитектуры из более 100 новых посадочных страниц, созданных под конкретные сценарии выбора, которых раньше не было в поиске. Органический трафик вырос почти в пять раз с 170 до 800 уникальных посетителей в месяц. Вместе с охватом изменилось и качество визитов: пользователи приходят по точным запросам, дольше остаются на страницах и чаще совершают целевые действия. Просмотры выросли на 60%, время на сайте на 30%, а средняя конверсия в звонки, расчеты и заявки на замер увеличилась на 20%.
Результаты роста поисковых запросовНаши специалисты помогут понять, где сайт тормозит рост бизнеса: в структуре, контенте, поисковой видимости или воронке заявки. Проведем бесплатную консультацию, покажем слабые места и предложим понятный план доработок под ваш спрос и задачи бизнеса.