Кейс: лендинг для Яны Миловой. Как мы продали обучение по денежному мышлению для девушек?

Всем привет!

В кейсе я расскажу подробности, как я поработал с прямым заказчиком, который совсем не понимает, как создается дизайн сайтов и как устроена современная no-code разработка.

Давайте знакомиться. Меня зовут Глеб, я веб-дизайнер. Создаю лендинги и упаковку для онлайн школ и инфобиза. В мае 2022 года ко мне обратился мой знакомый, предприниматель, филантроп, нетворкер с запросом на создание сайта для своей жены. А вот и он!

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

Яна Милова @milova_money

• 8 лет опыта в психологии
• 630+ довольных клиентов
  
• Обучалась у 62 наставников
  
• Коуч блогеров и миллионеров

Небольшая предыстория. Никита и Яна участвовали в записи интервью о себе и своей деятельности на ютуб канале “Тайны денег”. Интервью можно посмотреть тут, а я расскажу об особенности поставленной задачи.

Сделать сайт под ключ на Tilda по готовому текстовому прототипу для денежного марафона Яны Миловой и подключить необходимые сервисы для приёма данных. Основной упор необходимо было сделать на мобильной версии, так как ссылка на сайт доступна только под роликом с интервью, больше нигде ссылка не появлялась, трафик должен был идти только с YouTube.

Перейдем к этапам работы!

1 Этап: обсуждение задачи

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

На встрече мы еще раз обсудили все вопросы относительно:

• Структуры сайта
• Готовности текстов
  
• Примеров и общей стилистики
  
• Сроков проекта
  
• Площадки для разработки
  
• Остальных пожеланий по готовому сайту
  

2 Этап: подбор примеров

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

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

3 Этап: отрисовка концептов первых экранов

Далее я приступил к разработке концептов первого экрана. Для меня всегда особое значение имеет первый экран сайта, ведь именно он захватывает внимание пользователей и позволяет задержать их на странице. Также во время отрисовки 3-4 концептов я сразу понимаю, какой дизайн делать «низя», а какой можно. В результате мы остановились на данном варианте.

4 Этап: дизайн ПК и мобильной версии сайта

Переходим к самому сочному!

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

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

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

Сейчас логика сайта работает по следующему принципу:

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

Разберем цепочку смысловых блоков:

Блок «Твои результаты после марафона»: закрываем вопрос с оцифровкой результатов обучения + добавляем больше ценности, раскрывая смысловую карту.

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

Блок «Отзывы участниц марафона»: в этом блоке мы показываем живые кейсы после марафона, закрываем вопрос «А у меня точно получиться?» и помогаем человеку еще раз ощутить видение своего результата через участников марафона.

Блок «Почему у вас точно получиться?» : финально закрываем вопрос с результатом, обозначая ряд инструментов, благодаря которым его можно достичь и успокаиваем клиента. Степень максимальной расслабленности и «прогретости» уже достигнута на этом этапе.

Блок «Формат участия»: здесь мы обозначаем условия работы на марафоне. Стоимость, сроки, индивидуальный формат + докидываем ряд плюшек для клиента. Здесь клиент оставляет заявку на обучение. Сайт выполняет маркетинговую задачу.

Блок «Если хотите купить, но сомневаетесь»: здесь мы уже позволяем клиенту самостоятельно задать вопрос спикеру или решить вопрос с оплатой из других стран. Такой блок необходим, если нужна «дожимка» каждого клиента. Я не сторонник такой стратегии продаж, однако цифры по результатам запуска получаются очень красивые))

Уже на этом этапе Яне сайт очень понравился и я начал заниматься технической стороной проекта.

5 Этап: верстка сайта на Тильда

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

Сам процесс вёрстки был в несколько этапов:

• Загрузка шрифтов и материалов из макета (фотографии, векторные элементы)
• Верстка ПК версии
  
• Верстка мобильной версии
  
• Проверка отображения на экранах, уточнения в редакторе Тильды

6 Этап: техническая настройка и финальные согласования

После верстки сайта мне осталось сделать несколько технических настроек, а именно:

• Подключить домен
• Подключить SSL-сертификат
  
• Подключить Tilda CRM для сбора заявок + Telegram для сбора заявок
  
• Переопубликовать страницу и передать сайт Яне

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

После того, как я сделал сайт, Яна также обращалась за технической поддержкой сайта ко мне (видео-уроки для нее, как пользоваться сайтом или оплата Тильды). Еще выполнил пару проектов от нее по мелочи, помогал ей с упаковкой и ее знакомым.

Также я оформил кейс с сайтом на своём бехансе и рассказал о нём в своем окружении.

Кейс также получил обратку от лидеров мнений в дизайн индустрии, но это уже совсем другая история))

На этом всё, спасибо за ваше внимание и время, уделённое для чтения статьи! Это один из кейсов подобного формата, которые в дальнейшем я буду писать на vc. Как вам проект? Делитесь своим мнением ниже в комментариях!

Потыкать сайт самостоятельно — https://milovamoney. com/

Посмотреть другие мои работы — https://www. behance. net/mr87

Получить бесплатный разбор лендинга своего обучения можно написав мне + в телеграм и отправив ссылку на сайт. Расскажу, как именно тебе увеличить входящий поток заявок на твоё обучение на 30-50-1000% уже сегодня БЕЗ вложений в трафик с помощью сайта, а также подсвечу точки роста конверсии.