лендинг для онлайн-курса по копирайтингу

praktika.school

Задача

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

Дизайн решения

Идея дизайна опирается на 2 визуальных образа:
Газета – то место, куда изначально писали статьи (а статьи – конечный продукт копирайтинга) и объявление – сайт о продаже курса своего рода тоже является объявлением. Два этих слова объединяются под темой онлайн-курса по копирайтингу.

Отсылка к газете – обработка фото на главном экране. На фото изображен куратор курса Константин Рудов. Отсылка к объявлению – обводка на главном экране, фиксированная на протяжении всего сайта, отрывающиеся карточки, формы с целевым действием, иллюстрации в виде наклеек.
{наброски первого экрана}
дизайн-концепция сайта
главный экран сайта
газетный стиль на сайте
иллюстрации и типографика на сайте
Итоговым вариантом стала концепция с газетной обработкой фото и упрощенной рамкой вокруг главного экрана – эта идея наиболее четко отражает суть проекта и является концептуальной.

Посколько заказчик выбрал разработку 1 дизайн-концепции, я довела ее до итогового вида и презентовала идею.
{дизайн-концепт}
вебдизайн
Обоснование:

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

Второй блок:
Форма с кнопкой для получения файлов оформлена в виде отрывного объявления

Третий блок:
Оформлен в виде объявления, в котором карточки будут анимированы (будто отрываются) и показаны последовательно.
После обоснования дизайна получила такой ответ:
Существенная часть контента на сайте оставалась от прошлой версии сайта, нужно было заменить только визуальный стиль. Я добавила подложки и карточки в общей концепции дизайна: карточки с обводкой похожие на объявления, отрывные листочки в карточке кейсов студентов. А в некоторые блоки добавляла только наклейки и стикеры.
{блоки сайта}
дизайн карточка спикера
иллюстрации на сайте
карточка товара на сайте
дизайн сайта по копирайтингу
{иллюстрации}
Анимация
Основной акцент в анимации сделан на второй блок – с информацией о том что получат студенты курса. Использовала здесь метафору отрывного объявления. Карточки результатов при скролле отрываются влево и вправо в десктопной и мобильной версии сайта.
{анимация}
{мобильная версия}
Результат
Страница показала высокие результаты в органике и рекламных кампаниях Яндекс.Директ. Три кампании были сегментированы по отдельным аудиториям со средним показателем конверсии в 13%, что довольно неплохо на первом релизе. Результат достигнут за счет совокупности нескольких факторов: ux-редактуры, визуального стиля, и авторских подходов к настройке кампаний.
{статистика рекламных кампаний}
{статистика страницы в тильде}
Награды
Сайт попал в подборку лучших проектов, созданных в рамках фреймворка Tilda Publishing.
{MADE ON TILDA}
Сайт доступен по ссылке – sitefromlooo.tilda.ws
Если вас заинтересовал мой подход к работе, мои идеи и способы их реализации — напишите мне))
Made on
Tilda