Кейс

Разработка landing page Порта

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

https://www.avtomatika-came.ru/

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

https://www.avtomatika-came.ru/

Клиент

ООО «ПОРТА» является сертифицированным дилером систем CAME в Санкт-Петербурге, предоставляет услуги по продаже автоматики для ворот, установке и сервисном обслуживании этого оборудования.

Задача

Создать landing page для компании ПОРТА и обратить внимание пользователей на 2 основных типа оборудования: автоматика на откатные и распашные ворота от производителя CAME.

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

Анализ целевой аудитории

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

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

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

Разработка прототипа

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

При разработке прототипа сайта-одностраничника мы сделали упор на два вида продукции CAME:

Автоматика для откатных ворот;

Оборудование для распашных ворот.

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

Лендинг «ПОРТА» не перегружен большим количеством описаний – мы оставили только ту информацию, которая действительно важна для потенциального клиента.

Анализ целевой аудитории

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

Параллельно мы вели работу над адаптивной версией сайта, поскольку около 60-65 % пользователей пользуются интернетом с мобильного телефона. Адаптивность также является важным фактором для поискового продвижения ресурса.

Подбор стиля

Цвета

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

#FFFFFF

#000000

#00B0ED

Типографика

Normal

заказать рассчет

Active

заказать рассчет

Normal

Active

Разработка лендинга

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

Первый экран

Фотография показывает главное преимущство оборудования

Преимущества

Используем простые и понятные иконки

Калькулятор

Разработали калькулятор для быстрого и удобного расчета стоимости услуги

Оборудование

На странице представлены 2 вида автоматики и галереи с выполенными работами по установке

Сервис

Кроме основных услуг, компания так же предоставляет сервис по обслуживанию

Карта

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

Форма обратной связи

Форму подчеркиваем фотографией с воротами и машиной, чтобы клиент обратил внимание

Разработка мобильной версии

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

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

Итоги

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

Результатом стал современный функциональный landing page, полностью отвечающий запросу нашего клиента.

Вам требуется разработка продающего сайта или лендинга? Специалисты «Студии ХОД» придут вам на помощь! Мы беремся как за типовые задачи, так и за нестандартные и сложные проекты. Оставьте заявку, и мы свяжемся с вами и обсудим все детали.

мы делаем не просто сайты

Хотите работать с нами? Мы ответим на Ваши вопросы

С удовольствием проконсультируем вас.
Заполните форму и наш менеджер свяжется с вами.

Заказать

[contact-form-7 id="149" title="Форма в окне"]