← Назад ко всем проектам

Клиентский проект

Битва Жиров — лендинг для конкурса по трансформации тела с призом 500 000 рублей

Битва Жиров — лендинг для конкурса по трансформации тела с призом 500 000 рублей

Технологии

WordPressPHPJavaScriptCSS AnimationsParallaxLanding Page

Услуги

  • Прототипирование — иерархия информации и путь конверсии
  • UI/UX-дизайн — агрессивная эстетика конкурса, тёмная палитра с акцентами
  • Фронтенд-разработка — параллакс, анимированные отсчёты и эффекты появления
  • Интеграция CMS WordPress и настройка админки
  • Настройка формы захвата и сбора лидов
  • Доработки после запуска и текущая поддержка

Результаты

  • Полностраничный лендинг на WordPress с параллаксом и анимацией
  • Живой таймер обратного отсчёта, привязанный к дате старта конкурса
  • Трёхуровневая сравнительная таблица участия
  • Форма захвата лидов (имя + телефон, без регистрации аккаунта)
  • Админка CMS для всего контента, чувствительного ко времени
  • Адаптивная вёрстка под мобильные на всех брейкпоинтах

Задача

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

Бриф требовал того, что соответствовало бы драйву проекта: смелого, энергичного и способного превращать скептичных посетителей в платящих участников до того, как обратный отсчёт дойдёт до нуля.

Исследование

Исследование аудитории выявило два серьёзных риска отсева: посетители, которые сразу не понимали механику призов, уходили; те, кто понимал, но упирался в барьер на регистрации, отваливались. Работу определили три связанные проблемы:

  1. Нет сигнала срочности — у события была жёсткая дата старта, но без живого обратного отсчёта дедлайн ощущался абстрактно и не мотивировал.
  2. Разрыв в доверии к призу — заявке о 500 000 рублей нужны визуальные и структурные доказательства, чтобы в неё поверили; сухой текст этого не вытянет.
  3. Трение при регистрации — каждый лишний клик между «я в деле» и «я зарегистрирован» съедает конверсию, особенно на мобильных.

Рассмотренные варианты

  1. Готовый конструктор лендингов (Tilda, LP) — отклонено. Шаблоны не могли обеспечить насыщенную мультимедиа, построенную на параллаксе эстетику, которую требовала концепция, а клиенту нужно было самостоятельно управлять контентом после запуска.
  2. Кастомная статическая сборка — отклонено. Отсутствие CMS означало, что любое обновление контента требовало бы разработчика, из-за чего последующий этап доработок был бы неработоспособен.
  3. Кастомный лендинг на WordPress — выбрано. Дал полную свободу дизайна, позволил анимированные и параллакс-слои, предоставил клиенту привычный админ-интерфейс и оставил открытой дверь для долгосрочной поддержки и развития функций.

Решение

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

Реализация

Первый экран открывается суммой приза во весь экран и живым таймером обратного отсчёта — два элемента, которые вместе создают немедленную срочность и задают ставки ещё до того, как посетитель начал прокрутку. Формат «город против города» (Челябинск, Тюмень, Екатеринбург, Пермь) вынесен в первый экран, чтобы каждый посетитель сразу понимал, относится ли он к этому.

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

Три уровня участия (Бронза / Серебро / Золото) представлены в сравнительной таблице с цветовым кодированием цен, делая путь апселла самоочевидным. Единственная форма захвата внизу страницы — единственная точка конверсии: никаких отвлечений, никакой регистрации аккаунта, только имя и телефон.

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

Результат

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

Макет сайта

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

Битва Жиров — полный десктопный макет

Мобильная версия

Битва Жиров — мобильный первый экран

Первый экран — отсчёт и приз

Битва Жиров — мобильная навигация и секция приза

Навигация и секция приза

Промо-видео

Открыт для работы по контракту

Я доступен для работы по контракту. Если у вас есть интересная идея проекта — запишитесь на звонок через Calendly.

Записаться на 30-минутный звонок