Клиенты чаще всего приходят с одной и той же жалобой: обычная форма «Оставьте заявку» не конвертирует, а у конкурентов квиз собирает в разы больше лидов с того же трафика. Я разбирался, как сделать квиз в Тильде, ещё в 2021 году на лендинге для строительной компании, и с тех пор собрал десятки таких воронок: от коротких опросников на 3 вопроса до многошаговых конфигураторов с ветвлением и расчётом стоимости. Дальше разложу процесс так, как делаю его сам: от структуры блока до передачи готовой заявки в CRM.
По теме статьи
Готовое решение
Ограничение доставки по зонам на карте в корзине Tilda
Виджет доставки в шапке сайта + ограничение оформления в корзине по зонам на Яндекс.Карте.
от9 000 ₽
Кастомный скрипт
Когда стандартных блоков не хватает
Доработка сайтов на Тильде: скрипты для корзины, промокоды, зоны доставки, интеграции с CRM и Telegram. Простой скрипт от 3 000
от3 000 ₽
Зачем опросник на Тильде вместо обычной формы
Форма с полями «Имя, телефон, email» требует от посетителя решения сразу и целиком: отдать контакты незнакомому сайту. Квиз дробит это решение на серию мелких шагов, где каждый следующий вопрос кажется логичным продолжением предыдущего. К пятому вопросу человек уже вложился временем, и бросать на середине жалко, это обычный эффект принятых обязательств, а не какая-то магия конструктора.
На практике разница заметна почти всегда. На лендинге по ремонту квартир обычная форма давала 2-3% конверсии из посетителя в заявку. После переделки в квиз с 6 вопросами про метраж, состояние квартиры и бюджет тот же трафик стал давать 8-11%. Цифры не универсальные и зависят от ниши, но направление стабильное: квиз почти всегда обгоняет форму там, где решение клиента требует уточнения деталей, а не мгновенной покупки.
Есть и обратная сторона. Для интернет-магазина с прайсом на сайте квиз скорее раздражает, там форма или кнопка «В корзину» работает быстрее. Квиз имеет смысл там, где цена или условия зависят от параметров заказа: ремонт, дизайн, страхование, юридические услуги, обучение, подбор оборудования.
Как сделать квиз в Тильде: собираю блок и вопросы
У Тильды есть два пути. Первый, официальное приложение «Тильда Квиз» из магазина блоков, доступное на тарифе Business. Оно закрывает базовый сценарий: линейная последовательность вопросов, готовый прогресс-бар, автоматическая передача ответов в форму заявки. Для простого опросника на 4-5 линейных вопросов этого достаточно, ставится за 20-30 минут без единой строчки кода.
Второй путь, кастомная сборка на Zero Block. Я перехожу на него, как только в проекте нужно ветвление, расчёт по формуле, показ разных вопросов в зависимости от предыдущего ответа или нестандартный дизайн, который не вписывается в шаблон приложения. Структура простая: каждый вопрос это отдельный div с классом вроде quiz-step и атрибутом data-step, все шаги кроме первого скрыты через display:none, а переключение делает небольшой JS-модуль.
Каркас переключения шагов выглядит примерно так:
document.querySelectorAll('.quiz-answer').forEach(function (btn) {
btn.addEventListener('click', function () {
var current = document.querySelector('.quiz-step.active');
var nextStep = btn.dataset.next;
current.classList.remove('active');
document.querySelector('[data-step="' + nextStep + '"]').classList.add('active');
updateProgress(nextStep);
});
});Каждая кнопка ответа несёт data-next с номером следующего шага, а прогресс-бар обновляется отдельной функцией по общему количеству шагов. На готовом проекте это 40-60 строк JS без библиотек, вставляется в настройки блока «Ещё код» в Zero Block.
Ветвление вопросов и логика квиз-воронки
Ветвление я строю на тех же data-атрибутах кнопок, просто у одного вопроса появляется несколько вариантов «следующего шага» в зависимости от выбора. Пример из недавнего проекта для компании по остеклению балконов: на первом вопросе клиент выбирает «Квартира» или «Офис». Если «Квартира», следующий вопрос про тип дома и площадь балкона. Если «Офис», второй вопрос сразу про юридическое лицо и сроки. Итоговых сценариев получилось четыре, но пользователь в каждом видит только свою ветку из 4-5 вопросов, а не все 9 существующих.
Ответы я всегда складываю в один JS-объект по ходу прохождения квиза, а не читаю их из DOM в конце. Так проще и передать их в скрытые поля формы, и на будущее прикрутить логику скидки или расчёта стоимости прямо во время прохождения квиза, без ожидания заявки.
Пара правил, которые экономят нервы на ревизии:
- Кнопка «Назад» есть на каждом шаге, кроме первого, иначе часть пользователей просто закрывает вкладку, если ошиблись с ответом
- Прогресс-бар показывает реальное количество шагов в выбранной ветке, а не общее число вопросов в квизе, иначе он либо не дойдёт до 100%, либо прыгнет вперёд
- На мобильном каждый шаг помещается на экран без скролла, длинные тексты вопросов сокращаю до одной строки
Бесплатный материал
🎁 Полезный скрипт в подарок
Подпишитесь на Telegram - пришлю готовый скрипт по этой теме.
Без спама. Отписка в 1 клик.
Экран заявки: как довести квиз до заявки, а не до отказа
Финальный экран, где я теряю больше всего конверсии на чужих проектах, когда прихожу их дорабатывать, это форма с полями «Имя, телефон, email, комментарий» после пяти шагов квиза. Человек уже потратил время на ответы и на последнем шаге видит форму размером с анкету в банке. Хватает одного поля: телефон. Имя можно спросить голосом на созвоне, email нужен не всем нишам вообще.
Второй момент, персонализация. На финальном экране я обычно показываю фразу вида «Рассчитаем стоимость остекления балкона 6 м на юге здания» с подстановкой ответов пользователя. Это не расчёт цены, а подтверждение, что квиз всё правильно понял, и оно ощутимо снижает число отказов на последнем шаге по моим замерам через Яндекс Метрику.
Технически финальную форму я оставляю нативной формой Тильды (T‑форма), чтобы не терять встроенные плюшки: уведомления на почту и в Telegram, сохранение заявок в CRM-блоке Тильды, защиту от части спам-ботов. Перед отправкой формы JS квиза просто прописывает ответы пользователя в скрытые input-поля этой формы, так все данные квиза долетают вместе с телефоном в одну заявку, а не теряются где-то между шагами.
От спама помогает связка из honeypot-поля (невидимое поле, которое боты заполняют, а живые люди нет) и простого ограничения повторной отправки одной формы за короткий промежуток времени. Капчу ставлю только если спам реально начинает мешать, обычно на квизах с большим охватом в контекстной рекламе.
Передача заявок в CRM, Telegram и n8n
Встроенных интеграций Тильды (amoCRM, Bitrix24, почта, Telegram-уведомление) хватает в половине проектов. Заявка падает в CRM, менеджер видит её в своей рабочей панели, дальше работает обычная воронка продаж.
Вторая половина проектов просит что-то нестандартное: маршрутизацию заявок между менеджерами по типу услуги из квиза, мгновенное уведомление в отдельный Telegram-чат с расшифровкой всех ответов, а не только телефона, или запись лида одновременно в CRM и в таблицу для отчётности. Здесь я вывожу вебхук из Тильды в n8n и уже там собираю сценарий: одна ветка пишет в CRM, вторая форматирует ответы квиза в читаемое сообщение и отправляет его через Telegram-бота на aiogram прямо ответственному менеджеру, третья при необходимости кладёт запись в таблицу. Настройка такого сценария занимает у меня обычно один рабочий день вместе с тестами на реальных заявках.
Если логика квиза меняется чаще, чем раз в квартал, такую связку удобнее держать гибкой: доработка простого элемента формы или добавление вопроса стоит от 3 000 ₽, а вот комплексная интеграция квиза с CRM и уведомлениями через Telegram-бота обычно обходится от 40 000 ₽, в зависимости от количества сценариев маршрутизации.
| Способ сборки квиза | Гибкость ветвления | Нужен ли JS | Куда попадают ответы |
|---|---|---|---|
| Приложение «Тильда Квиз» | заданные сценарии разработчика приложения | не нужен | автоматически в форму Тильды |
| Кастомный Zero Block | любая, включая расчёт по формуле | нужен, минимум 40-60 строк | настраиваю сам, обычно в скрытые поля формы |
| Внешний сервис (Marquiz и аналоги) | средняя, зависит от тарифа сервиса | не нужен | в кабинете сервиса, дальше нужна отдельная связка с CRM |
Частые вопросы
Нужен ли Zero Block, чтобы сделать квиз в Тильде
Для простого линейного опросника без ветвления хватит официального приложения «Тильда Квиз» без единой строчки кода. Zero Block нужен, как только появляется ветвление вопросов, расчёт стоимости по формуле или дизайн, который не укладывается в шаблон приложения.
Можно ли сделать ветвление вопросов без программиста
Частично да, через логику приложения «Тильда Квиз», если она поддерживает нужный сценарий на вашем тарифе. Сложное ветвление с несколькими условиями и переменными обычно проще и дешевле сразу заказать на Zero Block, чем упираться в ограничения готового блока.
Как передать заявку из квиза в CRM
Для стандартных CRM вроде amoCRM или Bitrix24 обычно хватает встроенной интеграции Тильды в настройках формы. Для маршрутизации по менеджерам, уведомлений в Telegram-бота или записи в несколько систем сразу я собираю сценарий через вебхук и n8n.
Сколько стоит доработать готовый квиз на Тильде
Точечная доработка вроде добавления вопроса или правки логики перехода стоит от 3 000 ₽. Комплексная интеграция с CRM, расчётом стоимости и уведомлениями менеджеру обходится от 40 000 ₽ в зависимости от числа сценариев.