tzi-hub/requirements-pro.md

Техническое задание и методические указания по разработке PWA-моделей (проект «Диводел»)

1. Общие требования к интерактиву

PWA (Progressive Web App) — это одностраничное локальное веб-приложение, которое работает прямо в браузере, может быть установлено на устройство и функционировать без доступа к интернету (офлайн).

Ваша задача — создать не просто красивую анимацию, а интерактивный образовательный тренажер.

1. Визуальный стиль (Дизайн): Приветствуется уникальная стилистика советских 50–70-х годов (пионерская, военная, комсомольская тематика). Оформление должно быть аккуратным, современным и адаптивным (корректно отображаться на смартфонах и ПК).
2. Интерактивность: Приложение должно реагировать на действия пользователя. Большим плюсом будет использование мультимедиа (Web Audio API для звука, видео, анимация Canvas/SVG, тактильная отдача).
3. Объем и вовлеченность: Время полного прохождения приложения — не менее 5 минут.
4. Образовательный компонент (2D):
   • В конце сценария должна быть кнопка «Итоговое тестирование», запускающая тест из 5–10 вопросов для проверки усвоения материала.
   • Важно: на устной защите вы демонстрируете понимание содержания темы (физика, принципы работы, алгоритмы), а не только техническую реализацию кода.

2. Выбор тематики

Вы можете выбрать тему из любого предложенного направления (в порядке убываний приоритетов):

1. ТЗИ (Техническая защита информации): УЗИ, тепловизоры, оптика глаза, трансформаторы, ПЭМИН.
2. Принцип работы прибора: «Интерактивная модель прибора» (пожарная/охранная сигнализация, видеокамеры и пр.).
3. ЗИ (Защита информации): Криптография, сетевые технологии, программная защита.
4. Смежные дисциплины и хобби: Любой другой учебный предмет, а также экология, краеведение, история, палеонтология, аквариумистика, ботаника (кактусы, фиалки, тюльпаны), умные скворечники и другие ваши увлечения.

3. Техническое задание (ТЗ)

1. Сценарий: Оформляется в отдельном разделе Листа спецификации.
   • Сценарий состоит из «Сцен». Одна «Сцена» — это один этап/экран приложения.
   • В каждой «Сцене» должны быть описаны:
     • элементы интерфейса, из которых она состоит;
     • действия, которые пользователь может выполнить;
     • условия, необходимые для перехода на следующую сцену.
   • Минимум — 5 сцен.
   • Пример оформления ТЗ: http://213.155.192.79:3001/ypv/Maya-bee/ТЗ.md
2. Графические материалы: Если в приложении используются изображения, вы должны предоставить их исходники (или подтвердить права на использование).

4. Методика работы с ИИ (Vibe-coding)

Разработка ведется итеративно, в несколько этапов:

• Этап 1. Спецификация. До начала промптинга вы пишете физическую/логическую основу (формулы, граничные значения, единицы измерения). Без этого листа к работе не приступаем.
• Этап 2. Генерация. Вы загружаете в нейросеть весь контекст (сценарий, спецификацию, требования к дизайну). ИИ выступает в роли «стажера» и выдает предварительный результат (код).
• Этап 3. Верификация и итерации. Вы тестируете полученный код. Ищете «галлюцинации» ИИ: неверные формулы, сломанные крайние случаи (например, деление на ноль при нулевом расстоянии). Исправляете недостатки, добавляете новые функции и повторяете цикл до полного соответствия спецификации.
• Этап 4. Устная защита. Вы показываете работающую модель и объясняете, какие ошибки допустил ИИ и как вы их нашли и исправили.