Разработка Landing page по продаже автоматики для ворот
В digital-агентство «XOD.Agency» обратилась компания «ПОРТА» с целью повышения количества продаж оборудования.
ООО «ПОРТА» является сертифицированным дилером систем CAME в Санкт-Петербурге, предоставляет услуги по продаже автоматики для ворот, установке и сервисном обслуживании этого оборудования.
Задачи
- Разработать landing page для увеличения продаж оборудования компании «ПОРТА»;
- Сделать акцент на автоматике для откатных и распашных ворот CAME, как на наиболее популярных позициях;
- Создать калькулятор для расчета стоимости индивидуальных услуг.
Анализ целевой аудитории
Анализ целевой аудитории — неотъемлемая часть работы над проектом. По итогу анализа, а иногда уже и в процессе, приходят новые решения для бизнеса.
По результатам анализа мы выявили, что:
Целевая аудитория проекта – мужчины от 27 лет, индивидуальные предприниматели и владельцы бизнеса. Клиенты ценят свое время, и приходят на сайт за конкретными услугами. Это подтолкнуло нас к решению выполнить дизайн в минималистичном стиле, без отвлекающих внимание деталей.
Разработка прототипа
Одним из важнейших этапов в разработке сайта является прототипирование. Для разработки качественного прототипа дизайнер изучил сайты конкурентов в сфере автоматики для ворот, выполнил аналитику рынка, исследовал целевую аудиторию. В процессе работы было создано около 5 прототипов.
При разработке прототипа мы сделали упор на два вида продукции CAME:
- Автоматика для откатных ворот;
- Оборудование для распашных ворот
От заказчика поступила просьба сделать онлайн-калькулятор для расчета одного из типов оборудования вместе с монтажом.
В прототипе также учитывали расположение других блоков, кнопок, изображений и фрагментов текста.
Лендинг «ПОРТА» не перегружен большим количеством описаний – мы оставили только ту информацию, которая действительно важна для потенциального клиента.
Что делали?
Главное правило хорошей работы — комплексность. Поэтому мы начали постепенно решать все поставленные задачи. Для начала было решено создать полноценный каталог. В нем потенциальные клиенты могли увидеть все доступные позиции, отсортированные по категориям.
Адаптация сайта
В первую очередь мы разработали дизайн-макет для десктопной версии, поскольку она содержит больше элементов. Во время отрисовки калькулятора было важно учесть все ограничения в мобильной версии. Мы постарались сделать его интуитивно понятным и удобным для пользователя.
Подбор стиля
Цвета
Основной фон одностраничника – нейтральный белый, а шрифт классический черный, что позволяет быстро считывать все важные данные. Ссылки и кнопки выполнены в классическом голубом цвете.
Типографика
Разработка лендинга
В дизайне чередуются блоки с инфографикой, карточками товаров, текстом и изображениями. На сайте присутствуют реальные фотографии с примерами работ. Кроме того, для повышения доверия пользователей размещен официальный сертификат на продукцию CAME.
Разработка мобильной версии
Верстка и программирование
После окончательного утверждения макета и дизайна, мы перешли к верстке и программированию калькулятора. Все кнопки лендинга ведут на онлайн-форму, где посетитель может оставить свои контакты. Перед сдачей готового проекта заказчику провели тестирование и убедились, что все формы и калькулятор работают корректно.
Итог работы
В общей сложности работа над проектом составила 1 месяц. В разработке принимали участие маркетолог, дизайнер и программист. Фотографии для сайта были предоставлены клиентом. Весь остальной контент мы разработали сами.
Результатом стал современный функциональный landing page, полностью отвечающий запросу клиента.
Отзыв от клиента
