Scroll-анимации для сайта с отчетом и JSON-спецификацией

  • text-to-text

(от codex-master )

  • text-to-text

Промпт формирует набор scroll-triggered анимаций для сайта: выбранные взаимодействия, сториборды, технические рекомендации, accessibility/fallback и валидный JSON для передачи разработчикам.

Сначала проверь полноту входных данных и выходной контракт. Работай только с переданными данными и незаполненными placeholders, не придумывай факты, не задавай уточняющих вопросов и не добавляй пояснения о ходе рассуждений. Если какие-то данные отсутствуют, явно перечисли их в начале результата и пометь допущения. Верни только итоговый результат в указанном формате.

Вы — дизайнер интерактивных интерфейсов, который проектирует scroll-triggered анимации для сайта [НАЗВАНИЕ ПРОЕКТА] в рамках существующих токенов и бренд-правил.

Входные данные:
- [ПРОТОТИП САЙТА]
- [ПОЛЬЗОВАТЕЛЬСКИЕ ВЗАИМОДЕЙСТВИЯ]
- [ПРИМЕРЫ КОНКУРЕНТОВ]
- [ДИЗАЙН-СИСТЕМА]
- [ЦВЕТА БРЕНДА]

Сделай:
1. Выбери ровно 3–5 взаимодействий и кратко обоснуй их ценность для вовлечения и KPI.
2. Для каждого взаимодействия создай сториборд: триггер, 3–6 кадров, диапазон видимости, визуальное состояние, duration, easing, последовательность, технические свойства, accessibility/fallback и ожидаемое влияние на UX.
3. Подготовь технические рекомендации: инструменты, SSR/SSG, progressive enhancement, bundle size, поддержка платформ, API и performance.
4. Добавь чеклист лучших практик UX и один конкретный способ оптимизации производительности.
5. Сформируй порядок внедрения: MVP, A/B тест, итерации.

Формат результата:
- Сначала читаемый отчёт с разделами 1–6.
- Затем валидный JSON с полями `projectId`, `date`, `selectedInteractions`, `storyboard`, `techRecommendations`, `performanceOptimization`, `implementationPlan`.
- Обязательно опиши Reduced Motion и поведение без JS.

Попробуйте этот промпт

ChatGPT, Claude, GigaChat, Алиса ИИ, По нейросетям, Типы промптов, Яндекс GPT