Разработка эксклюзивного сайта для компании «АльтРоСтрой»

ООО «АльтРоСтрой» — компания, специализирующаяся на разработке организационно-технологической документации для строительных компаний (как генподрядных, так и субподрядных).

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

Поэтому на старте мы определили цель проекта — создать впечатляющий, информативный и лидогенерирующий (в сегменте В2В) сайт для повышения доверия к компании «АльтРоСтрой», как к эксперту на рынке разработки ППР в РФ.

Для ее достижения мы определили список задач:

― Разработать WOW-сайт для привлечения клиентов «премиум» сегмента.

― Сделать грамотную подачу предложения о сотрудничестве как с точки зрения информации, так и дизайна, для увеличения количества заявок.

― Заложить хорошую основу для дальнейшего продвижения сайта по всем городам.

― Сайт должен быть адаптивный, так как мобильный трафик из года в год растет.

Процесс разработки эксклюзивного сайта — непростой, но очень интересный и занимательный. Проходит он в 4 этапа:

― Аналитика и проектирование.

― Дизайн.

― Верстка и программирование.

― Наполнение и тестирование.

А теперь подробнее.

Аналитику проводили по трем показателям:

― Анализ текущей аудитории сайта.

― Анализ сайтов конкурентов.

― Популярные запросы по тематике.

Целевая аудитория: руководители и инженеры компаний, заинтересованные в качественной разработке ППР. Они ищут ответственного, опытного подрядчика и готовы заплатить крупную сумму за ППР, во избежание дополнительных затрат на работы.

На основе данных Яндекс.Метрика (на старом сайте), Similar Web (по сайтам конкурентов), а также, исходя из опросов нашего клиента: 74% — это мужчины, в возрасте от 25 до 55 лет, аналитического склада ума, с доходом выше среднего и высоким, как правило, имеющие высшее техническое образование.

Для понимания мотивов поведения пользователей (зачем они приходят на сайт, как они принимают решения и какие факторы на это влияют) методом персонажей, мы выделили несколько портретов из целевой аудитории:

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

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

Изучение популярных запросов по тематике дало понимание о спросе на данные услуги и о тех вопросах, которые волнуют потенциальных клиентов в первую очередь.

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

Прототип — это низко-детализированное представление дизайна. Он четко должен показывать:

― Основные группы содержимого. Что?

― Информационную структуру. Где?

― Описание взаимодействия пользователя с интерфейсом и его примерную визуализацию. Как?

Особое внимание мы уделили 3 страницам сайта:

Проекты. На предыдущем сайте данный немаловажный раздел отсутствовал. А клиенту действительно было чем гордиться! Мы устранили эту «ошибку» и спроектировали данный раздел. В нем пользователь может ознакомиться детально с выполненными компанией проектами: посмотреть ППР и фото готового объекта, прочитать подробное описание, а также ознакомиться с отзывом от компании-заказчика. Также, есть возможность фильтрации проектов по отраслям деятельности, что удобно для тех, кого волнует опыт работы подрядчика именно в его отрасли.

Отзывы. Мы не встречали клиента в сегменте В2В, которому так важна обратная связь о своей работе. В разделе «Отзывы» пользователь может ознакомиться с обратной связью от клиентов компании и оставить отзыв. Имеется возможность привязки видео и скана отзыва, а ключевые моменты вынесены на выделенные плашки. Также, есть возможность отфильтровать отзывы по направлениям деятельности.

Команда. У клиента работают настоящие профессионалы, и данный раздел позволяет ознакомиться с трудовой деятельностью, достижениями каждого сотрудника, кому вы доверите разработку проекта производства работ.

Для наглядности прототипы всех страниц сайта доступны по ссылке.

После недолгих согласований прототипов, мы перешли ко второму этапу разработки — дизайну.

Перед нами встала задача разработать дизайн, который соответствовал бы следующим критериям:

1. Минимализм: строгий, чистый, лаконичный дизайн.

2. Тонкие чертёжные линии в элементах сайта (кнопки навигации, акцент на типографике и фотографиях).

3. Аккуратная анимация элементов сайта, интерактивные переходы между экранами и блоками сайта.

4. Типография: шрифты без засечек.

5. Цвета: строгие, вызывающие ассоциации: «престижно», «статусно», «солидно».

Ранее мы говорили о том, что предыдущий сайт клиента был недостаточно презентабельным и неориентированным на сегмент «премиум». Поэтому мы отказались от сложных фонов, ярких цветов, разработали стильную инфографику, а также добавили в холодную цветовую гамму теплый желтый цвет, чтобы расставить акценты на формы обратной связи.

Утверждение дизайна происходило в конструктивном диалоге, как с заказчиком, так и с контекстологами и SEO-специалистами нашей студии. Каждый внёс свою лепту, но обоснованную.

После того, как все макеты были утверждены, мы перешли к третьему этапу разработки, где происходит основная магия: статичные макеты превращаются в полноценные динамичные страницы сайта. Секрет вуншпунша из таких инструментов как Bootstrap, FancyBox, AOS, Swiper, ScrollMagic + GSAP (TweenLite), amCharts4 известен только frontend-волшебникам, а пользователи лишь видят плавные анимации, красивые переходы и реакции элементов сайта, и самое важное — адаптивность дизайна сайта под любые разрешения, что позволяет сохранять удобство в его использовании с мобильных устройств.

В качестве панели управления была выбрана CMS 1C-Битрикс. Функциональные возможности сайта позволили не прибегать ни к каким собственным разработкам: для реализации всего функционала были использованы только стандартные компоненты. Поэтому быстродействие, с точки зрения сервера, максимально возможное на данной CMS.

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

Тестирование проводилось несколькими способами:

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

Затем мы выслали ссылку на тестовый поддомен клиенту и нашим коллегам, чтобы выявить моменты, которые ранее были неочевидны, ввиду «замыливания» глаза проектной группы.

И в завершении сайт прошел проверку в программе Netpeak Spider. Данная программа позволяет провести комплексный технический SEO-аудит сайта и, перед запуском проекта, устранить все замечания программы, препятствующие последующему продвижению сайта в поисковых системах.

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

В заключении нами были установлены системы аналитики и записаны подробные видео-инструкции для того, чтобы клиент мог самостоятельно администрировать свой сайт (да-да, заказывая у нас эксклюзивный проект, вы не только получаете готовый инструмент продаж, но и подробные инструкции по управлению этим инструментом).

Результатом нашей работы стал современный, лаконичный сайт, с уникальным контентом, подчеркивающий авторитетность компании в своей сфере: www.sibppr.ru

Проект «АльтРоСтрой» очередной раз убедил нас в том, что только активная работа обеих сторон — гарант оперативности и результативности, а тщательная предпроектная аналитика дает четко поставить цели перед будущим сайтом для дальнейшего их достижения.

Отдельную благодарность хотелось бы выразить директору компании «АльтРоСтрой», Виктору Гутфройнду, за то, что вникал во все нюансы процессов, оперативно предоставлял информацию, все время был на связи, а также регулярно приезжал к нам в офис для фиксации контрольных точек. Нам было очень приятно, что он «влился» в проектную группу и наравне со всеми специалистами, принимал активное участие в разработке.

На текущий момент настроена рекламная кампания на сайт в Яндекс.Директ и Google.Ads, а также определяется стратегия дальнейшего продвижения сайта в поисковых системах. Для нас ценно, что и в данных услугах выбор был сделан в нашу пользу. Уверены в долгом и, главное, результативном сотрудничестве и дальше.