Самая подробная инструкция
Квизы — эффективный способ узнать потребности клиента, помочь с выбором, сегментировать аудиторию и собрать данные пользователей. Пока ваши читатели узнают о себе что-то новое (например, на какого героя сериалов они похожи), вы можете предложить им товар или услугу, которые им действительно нужны.
В этой статье расскажем, как самостоятельно создать маркетинговый квиз без помощи программиста и дизайнера в бесплатном онлайн-конструкторе Интеракти.
Но вначале 2 слова о том, какие квизы бывают.
Два вида квизов
«Проверь себя» (Trivia) —квизы, с помощью которых пользователи могут проверить свои знания (например, разбираетесь ли вы в современной музыке?). Пользователи отвечают на вопросы и получают результат, которым можно поделиться в социальных сетях.
«Узнай себя» (Personality) — это квизы, в которых нет правильных и неправильных ответов (например, на какого героя сериалов вы похожи?). Такие тесты — эффективный способ узнать потребности клиента, помочь с выбором, сегментировать аудиторию и собрать данные пользователей.
Создаем свой квиз
Свой собственный квиз можно создать за 30–40 минут с помощью универсального конструктора интерактивного контента Interacty. Если вы уже определились, какую механику хотите использовать, откройте галерею шаблонов и выберите подходящий шаблон. Мы же расскажем, как сделать квиз на основе механики «Проверь себя».
Выберем шаблон «English school» и сделаем на его основе маркетинговый квиз для онлайн-курсов про здоровое питание.
Нажмите «Использовать шаблон». Если вы не зарегистрированы, то сервис предложит создать аккаунт (это бесплатно и займет меньше минуты). Если у вас уже есть аккаунт, то вы сразу же попадете в редактор Interacty.
Итак перед вами — редактор. В верхней части находятся превью всех страниц проекта. Давайте сразу перейдем к оформлению страниц с вопросами, а обложку и результаты оставим «на сладкое».
Создаем страницы с вопросами
Откроем первую страницу с вопросом и впишем наш собственный текст. Для примера мы взяли текст из похожего теста в журнале Сноб )
Готово? Теперь выделим все блоки и сдвинем их вниз, чтобы вверху осободилось место — туда мы добавим картинку. Для этого включите режим «Эксперт» на панели справа (1), нажмите на иконку картинки (2) и кликните по круглому изображению (3). Перетаскивание тоже работает.
Теперь заменим картинку. Для этого выделим круглое изображение и на панели справа нажмем на кнопку загрузки («Изменить»).
Перед вами появится всплывающее окно с возможностью выбрать или загрузить изображения. Для тестов вроде нашего отлично подойдут изображения из бесплатной библиотеки Unsplash.
Немного подкрутим цвета и у нас получится стильная страница с вопросом и ответами. Например такая:
Не забудьте указать, какой ответ является верным. Для этого выберите нужный ответ и в появившемся меню нажмите «Назначить верным».
Важным компонентом теста «Проверь себя» является пояснение к ответу (так называемый фидбек). В тестах Интеракти фидбек показывается в виде попапа после ответа на вопрос. Включите галочку на панели слева (1) и нажмите на иконку странички фидбека под слайдами (2).
Здесь вы можете расписать, где верный, а где неверный ответ и почему. Слева подсвечен тот ответ, к которому этот фидбек относится. Добавим наш текст на все 3 страницы фидбека и можно двигаться дальше!
Проверьте, как выглядит страница с вопросом на мобильных девайсах. Для этого перейдите в режим мобильного редактора и при необходимости подвиньте «расползшиеся» элементы.
Теперь удалим остальные страницы шаблона — нам они ни к чему. Гораздо удобнее воспользоваться функцией клонирования страниц :) При клонировании наследуется дизайн не только самой страницы, но и страниц фидбека, которые мы только что настроили. Вот так:
Теперь останется только пройтись по страницам и вставить нужный текст и картинки — ваши вопросы готовы!
Делаем обложку
Теперь настало время сделать обложку. Здесь все просто — дайте волю своему внутреннему дизайнеру. При желании вы можете добавить логотип или информацию о бонусах для прошедших тест. Все элементы, которых нет в шаблоне, можно добавить при помощи уже знакомой панели в режиме «Эксперт».
У нас получилась такая обложка:
Настраиваем результаты
В нашем шаблоне изначально 2 результата («неважно» и «хорошо»). Чтобы добавить больше градаций — добавьте больше страниц с результатами. Распределение результатов произойдет автоматически. Посмотреть его можно во вкладке «Проверка».
С результатами поступим также, как и с вопросами — настроим одну страницу (не забыв про мобильную версию) и клонируем ее. При этом первый результат слева будет для наименьшего результата, последний (справа) — для наилучшего.
Настройки для соцсетей
Редактор Интеракти позволяет настроить отображение вашего проекта в соцсетях. Для этого перейдите в таб «Проверка» и в блоке «Настройка отображения публикаций в соуцсетях» нажмите на кнопку «Редактировать».
В открывшемся окне вы сможете указать нужный вам заголовок и пояснительный текст, а также загрузить картинку, если автоматически созданное изображение вам не подходит. Кроме того, иожно указать ссылку, которая будет открываться при клике на пост в соцсети. Это важно, если вы захотите встроить проект на сайт или в блог (в этом случае укажите ту страницу, на которой будет находиться ваш проект).
Если вы не планируете встраивать ваш проект, но хотите, чтобы он был доступен по прямой ссылке, вы можете выбрать себе красивый линк (эта опция доступна для платных тарифов, начиная со Starter).
Подключаем лид-форму
Если вы хотите ограничиться бесплатным функционалом — то все готово к публикации! Но если вы хотите, чтобы ваш квиз помог вам собрать лиды, имеет смысл подключить платную лид-форму. Лид-форма доступна начиная с тарифа Starter ($19/мес).Чтобы включить лид-форму, поставьте соответствующую галочку в редакторе в настройках слева, и на панели слайдов сразу перед результатами появится страница «Форма сбора данных» (лид-форма).
Настройте форму так, как вам нужно. На панели справа можно выбрать, какие поля вы бы хотели показать вашим пользователям. Также вы можете указать ссылку на вашу политику конфиденциальности.
Сделали? Публикуйте!
Готово
После того, как вы нажали «Опубликовать», вы получите ссылку на ваш проект, которую можно скопировать и запостить в социальных сетях или мессенджерах. Если вы хотите встроить проект, выберите опцию «Встроить на сайт или в блог» — и вы получите код для вставки.
На этом все! Если в процессе создания проекта у вас возникнут вопросы, вы можете нажать на иконку Facebook мессенджера в нижнем левом углу редактора и получить консультацию команды разработчиков.
Статистику проекта и лиды вы сможете найти, перейдя по кнопке «Статистика» в разделе «Мои проекты».
Успешных проектов!
Подписывайтесь на наш канал, чтобы быть в курсе самых крутых механик и инструментов! Пишите в комментариях ваши вопросы!