Редизайн сайта строительной компании «Медный всадник»
О клиенте
Компания «Медный Всадник» более 15 лет занимается строительством загородной недвижимости для клиентов из Москвы и области, Санкт-Петербурга, Ленинградской области, а также других регионов России.
Фирма предоставляет полный комплекс услуг, начиная с архитектурного проектирования и заканчивая благоустройством территории коттеджа, что является одним из ключевых преимуществ, которые компания активно подчеркивает на своем сайте для привлечения новых клиентов.
Какой сайт был нужен клиенту
Компания сотрудничает с нами уже довольно давно и разработанный в 2016 году корпоративный сайт СК «Медный Всадник» тоже делали мы. Несмотря на универсальность предыдущего дизайна, внешний вид за 7 лет устарел, а маркетинговая составляющая нуждалась в доработке.
Фирма значительно развилась за время работы, а с ростом ее экспертизы, повысился и уровень ее клиентов. Визуальная составляющая сайта теперь не вполне соответствовала ожиданиям целевой аудитории. Чтобы поддерживать высокий стандарт и соответствовать требованиям потенциальных клиентов, было принято решение обновить сайт.
Таким образом, через новый дизайн требовалось:
Задачи
- Провести аналитику на страте работ. Требовалось определиться с целевой аудиторией и позиционированием, собрать семантику, изучить и переосмыслить лучшее у конкурентов. И на основе этого построить пользовательские сценарии и сформировать структуру посадочных страниц и навигацию.
- Создать дизайн страниц и элементов, позволяющий сайту СК «Медный Всадник» выделяться на фоне конкурентов, выглядеть современно и быть интересным для пользователя.
- Внедрить дизайн и маркетинговые рекомендации в текущую структуру сайта.
Основное содержимое и функционал сайта предполагалось оставить прежним. То же касалось и системы управления контентом — мы использовали 1С-Битрикс. Конечно, добавились и новые связи и блоки на страницах. Но основные изменения коснулись именно внешнего вида.
Что клиент получил в итоге
- современный и информативный сайт с проработанным UX, четким позиционированием и работающими конверсионными элементами;
- страницы, гармонично наполненные креативной микроанимацией, минималистичным декором и качественными изображениями, которые цепляют взгляд и запоминаются пользователю;
- наглядное отображение блоков и страниц, показывающих опыт и компетенции компании, строящей загородную недвижимость премиум качества под ключ.
Аналитика
1. Целевая аудитория
Перед началом работ мы провели подробные интервью с представителями заказчика, на основании которых мы составили портрет целевой аудитории. Мы разделили потенциальных посетителей сайта на 6 сегментов. Каждый сегмент мы описали с точки зрения методологии JTBD, рассмотрев пользу, которую принесёт человеку продукт компании.
2. Позиционирование
3. Семантика
4. Пользовательские сценарии
Затем по данным проведенных исследований мы построили пользовательские сценарии и сформировали поблочную структуру основных посадочных страниц и главного меню.
Ниже — небольшая часть структуры раздела с проектами:
Дизайн
Визуал сайта основан на разработанном нами ранее фирменном стиле и логотипе «Медного Всадника». Графика строится на ассоциациях с геометрией зданий и линиях чертежей.
Ниже — несколько страниц из руководства по фирменному стилю:
Креативная анимация и иконки
Отстроиться от конкурентов помогает продуманная динамичность, авторские анимированные иконки и уникальные декоративные элементы. Вот несколько приёмов, которые мы использовали:
- баннер на первом экране мы «оживили» с помощью эффекта загорающегося и затем гаснущего в доме света
- кнопки сделали более заметными за счет заливки цветом со смещением
- в каталоге и на карточках товаров мы добавили блоки с уникальными анимированными иконками
Аккуратная анимация и легкий интерактив делают сайт еще более «залипательным», задерживают внимание пользователя, увеличивая время проведенное на сайте и формируя желание узнать о компании больше и довериться ей. В то же время страницы получаются не перегруженными, благодаря крупным блокам и минимуму элементов, выводящимся на одном экране одновременно.
Главная страница
В первую очередь мы переработали главную страницу.
- Сделали ее чище, убрав лишние поля на первом экране и спрятав габаритное меню под кнопку.
- Учли маркетинговые работы на старте: четко сформулировали позиционирование клиента и разместили его в самом заметном месте, сразу формируя у посетителей понимание того, чем именно занимается компания.
- Добавили креативную микроанимацию, минималистичный декор, блок с горизонтальным скроллом и другие элементы, «цепляющие глаз».
- Наглядно показали экспертизу «Медного Всадника», добавив слайдер «Проект-реализация», отображающий как построенный дом полностью соответствует проекту на рендере.
Каталог
В каталоге проектов мы перенесли блок с фильтрами наверх, тем самым увеличив ширину контейнера для карточек товаров. Анонсы карточек сделали крупнее, а важную информацию на них — заметнее.
Ниже списка карточек располагаются блоки с основными возможностями и преимуществами компании как строителя и проектировщика. Предлагаются ссылки на информацию об оплате, специалистах фирмы. Предусмотрено место для seo-текста и, конечно, форма обратной связи.
Карточка проекта и объекта
Страницы всех проектов и объектов (домов построенных компанией) сделаны в виде промостраниц:
- первый экран содержит всю необходимую информацию на фоне слайдера с лучшими рендерами проекта или наиболее удачными фотографиями построенного объекта;
- при скролле нижняя часть первого экрана фиксируется в виде полосы с основной информацией о проекте и формой обратной связи, чтобы пользователь мог в любой момент оставить заявку;
- далее идет описание проекта с возможностью добавить фотогалерею, вставить видео, добавить таблицы с комплектациями и график строительства;
- добавлена перелинковка с другими проектами, объектами, способами оплаты.
Информационные страницы
Корпоративный сайт «Медного Всадника» — это не просто каталог проектов. Доверие пользователя поддерживают информационные страницы, на которых потенциальный покупатель может найти всю интересующую его информацию:
-
о компании, включая описание и список команды, сертификаты, контакты, подробности о собственном производственном комплексе;
-
об опыте и компетенциях, подтвержденных историями заказчиков, реальными отзывами, описанием возможностей и т.д.;
-
о строительстве и технологиях — в виде статей, фото-подборок и видеороликов.
Отдельного внимания заслуживает страница этапов строительства. Каждая технология имеет такую страницу. Здесь мы наглядно показываем пользователям процесс строительства дома, с фотографиями и описанием. Механизм реализован с помощью горизонтального скролла, придающего странице интерактивности и динамики.
Выводы
В итоге клиент получил оригинальный современный и информативный сайт с проработанным UX. На сайте «Медного Всадника» пользователь найдет ответы на все вопросы, появляющиеся у того, кто собирается строить свой дом: какой материал выбрать, сколько времени займет стройка, какой опыт есть у фирмы, как будет выглядеть дом, сколько будет стоить и т.д. Страницы наглядно и эстетично предоставляют посетителю всю необходимую информацию, захватывая внимание, но не перегружая лишними данными.
На текущий момент мы продолжаем плотно сотрудничать с компанией «Медный Всадник»: развиваем и улучшаем сайт, выполняем работы по SEO и ведем контекстную рекламу.