Правила проектирования конверсионных форм
Для широкого холодного трафика на продукт по низу пирамиды Маслоу (микрозаймы, кредиты, срочные юр. услуги, эвакуаторы и т.д.).
Специфика этого трафика в том, что тут очень много вариаций сценариев пользовательского восприятия и поведения, которые надо охватить по максимуму. А так же, что людям надо «срочно», по этому долго вникать и разбираться в форме они не будут. Все должно быть интуитивно понятно даже бабушке.
Следуя этим базовым правилам, при адекватном трафике, можно получить конверсию в заполнение и отправку формы ≈40% (если делать сходу) и ≈60% (если хорошо подготовиться).
Определи задачу формы:
1) собрать лида (контакты человека, заинтересованного в покупке) для передачи его в отдел продаж, где с ним будут работать.
В этом случае, форма состоит из МИНИМАЛЬНОГО числа полей. В идеале, только номер телефона (ник в тг или емейл) и кнопки «отправить заявку». Добавлять ещё поля тут я не рекомендую, так как для выхода на связь с лидом этого достаточно. А вот наличие дополнительных полей повышает когнитивную нагрузку на пользователя.
На многих проектах, по данным сквозной аналитики, конверсия формы значительно увеличивалась, когда составляли только одно поле.
Ещё рекомендую делать дизайн поля ввода без подсказок, заголовков, украшательств и прочего. Это упрощает восприятие формы — снижает когнитивную нагрузку, а значит пользователь будет меньше «тупить». Это снижает процент отказов от заполнения формы, в данном случае.
2) получить максимум данных пользователя для пополнения баз данных или скоринга.
А вот тут уже, полей будет, мягко говоря, дохрена. Чтобы снизить когнитивную нагрузку и не пугать пользователя простыней из полей, форму стоит РАЗБИВАТЬ НА ШАГИ.
Но есть и исключения, когда лучше все впихнуть в один экран — например, когда форма находится на первом экране лендоса потому, что переход на другую страницу, для дальнейшего заполнения формы сбивает пользователя и он может отвалиться.
Дизайн полей тут должен быть максимально понятным:
-
с заголовками, чтобы пользователь, при заполненном поле понимал, что там вообще должно быть.
-
с подсказками и пояснениями. Пояснения «зачем нужно заполнить это поле» и «что будет дальше» нужны, чтобы снять у пользователя стресс и убрать страхи вроде: «вот введу данные паспорта и на меня кредит оформят!», а подсказка поясняет, что это надо для того-то и того-то (ахаха чтобы кредит оформить). Подсказки, КАК заполнить поля, нужны для того, чтобы пользователь не тупил «а че тут писать то? цифрами или прописью?», а сразу заполнил как нужно. Это радикально облегчает и ускоряет процесс заполнения, а значит снижает процент отказов и увеличивает глубину заполнения формы. Ну и не забудь задизайнить варианты корректного и некорректного заполнения полей с подсказками.
-
внедряй ГЕЙМИФИКАЦИЮ! Оч. сильно поднимут процент полного заполнения формы и качество данных бонусы за заполнение полей, прогресс-бар (или вроде него что-то) и подобные штуки.
3) комбинированная задача. Это когда и лид нужен, и побольше данных собрать о нём надо (типичная ситуация для тех, кто скоринг лидов делает — финансовые организации например).
Здесь важно сегментировать форму на «быстрый» блок, где мы просто собираем лида (обычно это ФИО и номер телефона) и блок с доп. инфой, которая заполняется «по желанию». Желание заполнить доп. инфу вызывается у пользователя геймификацией 👆🏻
Ну и общие рекомендации по дизайну любой формы 👇
— Дизайн формы должен быть «как у всех, как и везде».
— Не выпендривайся с креативом. Визуальный образ формы и пользовательская привычка как форму заполнить, уже сформирована. Если отступать от привычного дизайна формы, то у пользователей будет возникать стресс и тупняки.
— Не надо дизайнерских шрифтов и причуд дизайна в полях ввода! Я видел случаи, где заголовочный шрифт впендюривали в поле ввода настолько неуместно, что процент заполнения формы опускался до нуля!
— Окно «спасибо» после заполнения формы. Укажи там, что будет происходить дальше. Это даст пользователю подтверждение, что форма отправилась и уберет страх неизвестности.