Прототип лендинга или сайта — это черновой эскиз, схема будущей страницы и результат долгой маркетингового анализа и той подготовки, которую я описывал в предыдущих частях. Создается до дизайна и верстки.
Задачи прототипа:
- экономия времени на правках;
- показывает общую картину будущего продающего сайта;
- строится базовая композиция;
- облегчить разработку дизайна
Прототипы бывают в формате эскиза, текстовом или mindmap.
Условно Формулу составления CTA можно определить так:
Заголовок + что получите или внутри + как это получить + что будет после
Прототип-эскиз:
- Показывают всю картину клиенту или вам самим если делаете для себя
- Строится базовая композиция
- Легче делать дизайн
- Трудозатратно и долго
Если дизайн будете делать не сами, а нанимать дизайнера — такой прототип существенно сэкономит вам время на объяснение задачи для дизайнера. Прототип заменяет одновременно и техническое задание и копирайтинг проекта. При работе с любым подрядчиком в сфере диджитал помните про поговорку “без хорошего ТЗ - результат ХЗ”
Текстовый прототип или mindmap
- Быстро делается
- Не даёт полного представления
- Сложнее делать дизайн
Я также использую текстовые прототипы, когда для меня понятна и изъезжена мной несколько раз. Или когда бюджет или сроки сильно ограничены.
Как сделать прототип лендинга?
- Собираем все смыслы которые мы уже подготовили (из анализа компании, анализа ЦА, анализа конкурентов, УТП);
- Распределяем смыслы по блокам (в одном из постов я показывал более 50 вариантов блоков);
- Создаём продающую структуру лендинга (расставляем порядок, добавляем призывы к действию CTA, кнопки итд);
- Пишем для каждого блока текст. Используйте короткие формулировки на языке выгод клиента;
- Делаем прототип-эскиз. Я использую для этого Figma или Tilda.
В 90% случаев подойдет модель продающей структуры AIDA:
Attention – внимание (за это отвечает Первый экран);
Interest – интерес ( за это отвечают Блоки презентации);
Desire – желание (за это отвечают Блоки доверия);
Action – действие (за это отвечают Конверсионные блоки).
Interest – интерес ( за это отвечают Блоки презентации);
Desire – желание (за это отвечают Блоки доверия);
Action – действие (за это отвечают Конверсионные блоки).
Как создать продающую структуру лендинга:
1. Создаем продающую структуру и настраиваем порядок блоков соответствии с моделью AIDA
- Главный экран
- Блоки презентации
- Блоки доверия
- Конверсионные блоки
- Технические блоки
2. Распределяем блоки призывов к действию
(1 призыв через каждые 2-3-4 блока. Не впаривать, чувствуйте логику)
- Главный экран
- Блоки презентации
- Блоки доверия
- Конверсионные блоки
- Технические блоки
2. Распределяем блоки призывов к действию
(1 призыв через каждые 2-3-4 блока. Не впаривать, чувствуйте логику)
Как написать тексты для лендинга или сайта?
- Убираем всю воду из продающей структуры. Оставляем законченные лаконичные формулировки. Каждая формулировка должна быть ценной — она закрывает потребность, боль, критерий выбора, возражение, сомнение, трудность выбора.
- Делаем формулировки интересными для читателя. 90% ошибок во всех лендингах и сайтах это то что тексты не хочется читать. Вода водой.
- Шлифуем тексты через сервис Главред (После того как вы написали формулировки, нужно их сделать правильными и чистыми. Для этого используем специальный сервис. Он полностью бесплатный.)
- Придумываем заголовки для каждого блока
Как написать тексты для лендинга, которые будут читать?
- Пишите максимально просто, понятно и коротко. Никто не хочет читать длинную научную статью на лендинге. Короткие емкие предложения, без воды и без причастных и деепричастных оборотов.
- Не пишите на лендинге про себя как делают большинство формулировками “мы развивающаяся компания”, или “мы обеспечиваем” и подобными фразами, Пишите о клиенте. Используйте «Вы-позицию» (вы получите, вы узнаете, мы вам сделаем итд)
- Опирайтесь на факты и цифры. Если экономия, то сколько в рублях? Если качественно, то сколько гарантия? Если профессионалы, то сколько работаете лет? Какой опыт у каждого сотрудника?
По этим правилам сделайте формулировку к каждому смыслу.
Вообще любой смысл старайтесь делать в формате “заголовок + текст”. На сайте нам будет легче донести до посетителя сначала мысль коротким заголовком, а затем уже подробно пояснить предложением из 2-3 коротких строчек
Как придумывать заголовки для лендинга:
- Сначала вам нужно помнить что Лендинг читают бегло по заголовкам. Прочитав их посетитель должен понять, что вы предлагаете и захотеть с вами остаться.
- Возьмите самое ценное и цепляющее во всём тексте для блока
- Сформулируйте заголовок. Не более 2-3 строк. 8-12 слов.
- Если формулировка не влезает в 1 заголовок — поместите оставшееся в подзаголовок
- Проверьте копирайтинг — если пробежаться бегло по заголовкам, понятна ли суть предложения? Закрывают ли тексты потребности, боли и критерии выбора?
По сути как только вы сделали заголовки и тексты - текстовый прототип у вас готов.
Чтобы превратить его в прототип-эскиз необходимо расставить формулировки по блокам в схематичном виде.
При расставлении блоков помните, что лучше донесение смысла это картинка + текст. Если уместно то старайтесь комбинировать текст с картинкой.
Прототип можно сделать и руками, схематически изобразив каждый блок, или использовать Tilda или Figma.
При расставлении блоков помните, что лучше донесение смысла это картинка + текст. Если уместно то старайтесь комбинировать текст с картинкой.
Прототип можно сделать и руками, схематически изобразив каждый блок, или использовать Tilda или Figma.
