Разработка системы опросов-тестов
Добрый день!Коллеги попросили сделать тест-опросник "как у Медузы" с возможностью поделиться в соцсетях
пример https://meduza.io/quiz/shaurma-zont-i-smartfon-chto-mozhno-kupit-v-mire-za-115-rubley
Сейчас мы делаем функционирующий прототип (MVP), далее будем дорабатывать и допиливать.
Дизайн будет предоставлен нашим дизайнером, по мере подготовки кода.
В целом, функциональные требования:
1. Общие моменты.
1.1. Тест-опрос может быть размещен как на отдельной странице, так и в рамках существующей страницы сайта (возможно, iframe).
1.2. Для настройки опроса требуется административная панель, в которой будут три раздела:
1.2.1. Главная - настройка заголовка, вводного текста, изображения (опционально), текста кнопки
1.2.2. Вопросы - в панели существует возможность добавить/удалить вопрос, указать вопрос, выбрать изображение для фона (опционально), добавить варианты ответов, в том числе выбрать правильный, а также комментарий к ответу.
1.2.3. Окончание теста - функционал позволяет указать как конкретное количество правильных ответов, так и диапазоны (например: 1-3, 4-6, 7-10), указать сопровождающий текст и выбрать изображение.
1.3. По факту прохождения опроса, на странице окончания, есть кнопка "Поделиться результатом на Facebook". По факту нажатия кнопки, на странице респондента в Facebook/Twitter/Vkontakte появляется сниппет с изображением окончания и сопровождающим результат текстом.
2. Страницы опроса-теста
2.1 Главная страница.
Пример:
Изображение горизонтальное, в пропорции 4х2, между заголовком и вводным текстом
2.2. Вопросы
При ответе на вопрос, выделяется правильный ответ, если респондент ответил неправильно, то выделяется и неправильный вариант. Под вариантом ответа респондента выдается комментарий. В верхней части панели опросника указывается прогресс ответов "1 из 10" Ниже располагается собственно вопрос.Под вопросом - изображение, если оно было выбрано в админ-панели.
Пример:
2.3. Результаты
Указывается количество правильных ответов, текстовка и изображение в зависимости от балльности, указанной в админке.
Пример:
При нажатии на кнопку "Поделиться", формируется запись для Facebook/Twitter/Vkontakte, состоящая из соответствующего изображения и текстового комментария, а также ссылка "Пройти опрос".
При переходе по ссылке, посетитель попадает на страницу опроса.
Если вы уже делали что-то подобное, буду рад посотрудничать.
Заранее признателен за ответ, со своей стороны гарантирую порядочность, оперативную коммуникацию и подробный отзыв.