TVOЯ Пицца — дизайн лендинга

4 363

Задача: разработать дизайн лендинга для сайта службы доставки Tvoя Пицца и «заглушку» до официального запуска продукта.

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

Решение:

  • разработка дизайна страниц в фирменном стиле бренда с таймером обратного отсчёта на «заглушке»;
  • видеоподложка на лендинге;
  • меню-слайдер с крупными аппетитными фотографиями продукта.

Особенности дизайна

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

Заглушка для сайта

Страница, которая была на домене перед запуском полноценного лендинга. На первом экране — таймер обратного отсчёта до официального запуска проекта с СТА-блоком на подписку за подарок. Цифры таймера разделены на отдельные блоки и расположены на салатовых подложках, стилизованных под стикеры, которые «приклеены» на коробку пиццы.

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

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

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

Лендинг

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

После, на уже узнаваемом крафтовом фоне — переключающийся блок со слайдером, который отражает два основных разделения в меню: на Бруклинскую и Римскую пиццу. При клике на текст «В чём разница?» появляется поп-ап с детальным разъяснением отличий пицц.

Далее раскрывающийся по клику блок в фирменном цвете с описанием различий между тёмной и белой пиццами + кнопка на скачивание приложения.

Блок с описанием преимуществ и кнопка с интересным СТА «Скорее к заказу» и переходом на приложение.

Блок с промокодом на первый заказ и ссылкой на приложение выделен фирменным цветом и привлекает внимание скидкой 20%, стилизованной под гигантские фольгированные шары.

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

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

4 364