Заказчик:

Александр Ласточкин – генеральный директор Capital Engine.

Задача:

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

С чем работаем?

Посадочная страница — веб-страница, основной задачей которой является сбор контактных данных целевой аудитории. Используется для усиления эффективности рекламы, увеличения аудитории. Целевая страница обычно содержит информацию о товаре или услуге.
Именно для создания такой страницы к нам обратились Capital Engine – быстрорастущая и набирающая обороты компания по профессиональному подбору запчастей для легковой и грузовой техники.

Как проходила работа:

Как все начиналось

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

Подготовка «скелета»

Менеджер, проанализировав бриф и уже имеющийся лэндинг, определил конечный вид структуры лэндинга. Всего было выделено 7 основных экранов:

1. Приветственный экран с формой, который ёмко раскрывает и описывает суть деятельности компании и даёт возможность сразу же оставить заявку.
2. Экран преимуществ данной компании по сравнению с другими на рынке.
3. Экран доступных к заказу групп запчастей, для того, чтобы сразу же дать возможность заказать необходимые запчасти из представленных.
4. Экран с развернутой формой со сформулированным УТП — крайне важный экран для воздействия на потенциального покупателя, призывающий совершить отправку заявки.
5. Экран с этапами работ и гарантиями, который получает потенциальный покупатель при сотрудничестве с данной компанией. Этот экран раскрывает алгоритм работы (показывая, что в нем нет места скрытым действиям), а также представляет гарантии компании, показывая, что покупатель сокращает риски.
6. Экран с отзывами уже сотрудничающих с компанией клиентов и их отзывами об успешно проделанной работе.
7. Экран с завершающей формой запроса обратного звонка и контактные данные компании в Москве и Санкт-Петербурге.

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

Первые шаги. Работа с логотипом

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

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

Рис.1 Варианты нового логотипа Capital Engine

Первые версии лэндинга

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

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

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

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

Рис.2 Светлая и тёмная дизайн-концепции лэндинга

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

Обрастая задачами

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

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

Готовый макет снова отправился заказчику, правок после окончания работ над десктопной версии посадочной страницы пришло немного и все носили, в основном, информационный характер, не требующий утверждения. Разработка рекламных материалов и листовки прошла быстро — нарекания возникли только в форм-факторе необычной рекламной листовки в форме таблички для автомобиля, изначально она была формата А5, но её пришлось адаптировать в горизонтальную листовку формата 1/3 А4.

Рис.3 Визитка Capital Engine

Рис.4 Фирменные кружки Capital Engine

Рис.5 Листовки Capital Engine

Как только финальное утверждение прошло на «УРА», все макеты отправились на изучение и растерзание разработчикам.

Счастливый финал

Спустя 5 дней кропотливой работы и оживления макетов, посадочная страница Capital-Engine увидела свет — все это время frontend и backend разработчики верстали, вносили интерактивность и настраивали формы на странице. После небольшого багтестинга страницу бережно перенесли с рабочего поддомена на основной http://capital-engine.ru/

Рис.6 Конечная версия сайта Capital Engine