Техническое задание: Верстка интерактивного квиза
Цель проекта
Создание полностью рабочего, адаптивного и интерактивного фронтенда для опросника (квиза) на основе готового дизайна.
Исходные материалы
- Макет дизайна в Figma (ссылка предоставляется исполнителю).
- Рабочий прототип для понимания логики и взаимодействия (ссылка предоставляется исполнителю).
Технические требования
Стек технологий:
- HTML5 - семантическая, валидная разметка.
- CSS3 - чистые стили, без использования препроцессоров или фреймворков (Bootstrap, Tailwind).
- JavaScript - ванильный (нативный) JS для реализации логики квиза (переход между шагами, валидация, расчеты, отправка данных).
Ключевые функциональные требования:
- Точное соответствие предоставленному дизайну (pixel-perfect).
- Полная адаптивность под все основные разрешения экранов.
- Реализация пошаговой логики квиза с возможностью перехода вперед/назад.
- Интерактивные элементы (кнопки, радиокнопки, чекбоксы, поля ввода) должны иметь состояния (hover, active, focus).
- Валидация полей ввода (где это необходимо по логике прототипа).
- Чистый, комментированный и структурированный код.
Что НЕ входит в задачу:
- Интеграция с бэкендом (Django) или CMS.
- Настройка хостинга или деплой.
- Написание бэкенд-логики.
Результат работы
Архив с файлами (HTML, CSS, JS, изображения/шрифты) полностью готового к интеграции фронтенда квиза.