Квиз для подбора товара на Tilda, пошаговый гайд
Каталог из 200 наименований и посетитель, который не знает, с чего начать, дают типичный bounce rate 60-70 процентов. Квиз решает эту проблему так: вы задаете 3-5 вопросов, человек отвечает, в конце получает три рекомендации и кнопку оставить контакт.
Эта инструкция показывает, как собрать рабочий квиз на сайте Tilda за 30 минут, на примере магазина одежды. Архитектура подходит для любой ниши с выбором, от шин до туристических путевок.
Что должен делать квиз
Хороший квиз решает четыре задачи одновременно: помогает посетителю выбрать товар, собирает контакт без давления, уменьшает нагрузку на менеджеров (они общаются с теми, кто уже определился), и собирает данные о предпочтениях аудитории.
Плохой квиз превращается в форму ради формы. Семь полей про возраст, доход и семейное положение, ни одной рекомендации в конце, и кнопка "Получить консультацию". Это не квиз, это анкета.
Разница в том, что квиз обещает результат вначале. Заголовок первого экрана: "Подберем кроссовки за 4 вопроса". Не "ответьте на наши вопросы для статистики".
Архитектура из 4 вопросов
На примере магазина повседневной одежды. Цель: понять стиль и размер, отсечь любителей рассматривать каталог часами.
Вопрос 1, что вы ищете. Варианты: верхняя одежда, базовый гардероб, спорт, аксессуары. Это сегментирует посетителя по самой широкой оси и определяет, какие три рекомендации показывать в конце.
Вопрос 2, какой стиль. Варианты в зависимости от ответа на вопрос 1. Для верхней одежды: классика, спорт-шик, casual. Для базового гардероба: офис, вечер, прогулки. Адаптивные вопросы работают лучше статических.
Вопрос 3, размер. Стандартные XS-XXL плюс поле "не уверен", которое ведет на отдельный ответ с гайдом по подбору размера. Размер критичен для выдачи в наличии, без него рекомендация бесполезна.
Вопрос 4, цена. Три диапазона: до 5000 рублей, 5000-15000, выше. Этот шаг можно сделать опциональным: посетители часто пропускают цену, если стесняются ответить.
Финальный экран. Три карточки с товарами, подобранными по ответам, кнопка "Хочу примерить" под каждой. Опционально, форма для контакта с обещанием персональной подборки в Telegram или на email.
Сборка в Нотифлоу
В кабинете Нотифлоу разделе Виджеты, кнопка Создать. Тип, Квиз. Откроется конструктор: слева список вопросов и шагов, справа предпросмотр на десктопе и мобильном.
Добавьте 4 вопроса по схеме выше. Для каждого выберите тип ответа: один из вариантов, мульти-выбор, текстовое поле, ползунок. На большинстве вопросов "один вариант" дает лучший UX.
Финальный экран соберите как блок Результат с тремя карточками. Поле "Картинка товара" принимает URL изображения. Удобно держать товары в Tilda Catalog или на отдельном CDN.
Логика выдачи рекомендаций задается через правила: "если вопрос 1 = верхняя одежда И вопрос 2 = классика, показать товары с тегом winter-classic". Правил может быть до 50 на квиз, этого достаточно для каталога из 200 SKU.
Установка на Tilda
Способ один и тот же, что для чата: в разделе Виджеты получите код установки, вставьте в настройки сайта Tilda, в раздел Дополнительный код, поле HTML перед закрывающим body.
Опубликуйте сайт. Через 30 секунд квиз появится на странице.
Триггер открытия настраивается в кабинете. Варианты: иконка-кнопка в углу (сдержанный режим), всплывающий попап через 30 секунд (агрессивный режим, конвертит лучше но раздражает), кнопка-якорь в баннере на главной (для лендинга акции).
Для магазина одежды на Tilda оптимально: иконка с пульсирующей анимацией в углу плюс попап на странице каталога, если посетитель просмотрел больше 3 карточек товара. Это поведенческий триггер, настраивается в правилах показа.
Сценарий с лид-формой
После показа трех рекомендаций следующий шаг, опциональная форма. Поле имя, поле телефон или email, кнопка "Получить персональную подборку".
Контактные данные вместе с ответами на квиз попадают в кабинет Нотифлоу как контакт. Карточка контакта содержит ответы как теги: "стиль:классика", "размер:M", "цена:до-5000". По этим тегам строятся сегменты для рассылок и автоматизации.
Если у вас CRM (amoCRM или Bitrix24), webhook отправит лид сразу туда. Настройка webhook в кабинете занимает 2 минуты, шаблон события chat_message с привязкой к сделке.
Реальный пример
Магазин повседневной одежды на Tilda. Каталог 180 SKU. До квиза: средняя сессия 2:15, bounce rate 64 процента, заявок с сайта 12 в неделю.
После запуска квиза с описанной архитектурой: средняя сессия 4:40, bounce rate 41 процент, заявок 28 в неделю. Из 100 посетителей 35 проходят квиз до конца, 18 оставляют контакт после результата. Запуск занял 1 рабочий день, включая фотосессию для карточек товаров и заполнение каталога.
Цифры не каждому магазину гарантированы. Они зависят от каталога, цены, фотографий, доставки. Но направление улучшения предсказуемое: квиз дает структуру выбора там, где раньше посетитель скроллил случайным образом.
Что не делать
Не делайте квиз длиннее 5 вопросов. На шестом вопросе процент завершения падает на 30 процентов. Если у вас сложный продукт и нужно 10 вопросов, разбивайте на два этапа: короткий квиз для рекомендации плюс длинная анкета после контакта менеджера.
Не давайте в результате слишком много вариантов. Три рекомендации работают лучше, чем десять. Парадокс выбора: больше опций уменьшает вероятность принятия решения. Если у вас в нише много моделей, отсортируйте по критерию (популярное, новое, со скидкой) и покажите top-3.
Не маскируйте квиз под обязательную форму. Кнопка "Закрыть" должна быть видна на каждом шаге. Иначе посетитель теряется и закрывает вкладку, что вы не отследите.
Не отправляйте квиз без размышления через тариф Старт, если каталог больше 100 SKU. Лимит 100 диалогов в месяц закончится быстро, потому что каждое прохождение квиза = одна сессия. Команда тариф (3 490 ₽) снимает лимит.
Сборка квиза
Квиз для подбора товара живет на Tilda как отдельный виджет, который вы собираете в кабинете Нотифлоу за 30 минут и устанавливаете одним скриптом.
Запустить квиз или прочитать подробный гайд по конструктору квизов.