Menü
将模糊的 React 动效诉求拆解为明确的动画目标、触发条件、范围边界和验收标准，为后续项目分析与选型提供清晰输入。
Mit Codex oder Claude installieren Kopieren Sie diesen Prompt, fügen Sie ihn in Codex, Claude oder einen anderen Assistant ein und lassen Sie die Skill-Seite prüfen und installieren.
Basierend auf der SOC-Berufsklassifikation
根据动效目标和 React 项目上下文，在 CSS、WAAPI、Framer Motion、GSAP、Lottie、Remotion 等方案之间做合理取舍，并输出可执行选型结论。
对 React 动效实现做闭环验证，检查性能、SSR、reduced motion、清理逻辑和代码维护性，确保结果适合真实项目交付。
将已选定的动画方案映射为 React 组件、页面、样式和依赖改动，直接完成动效代码实现，并保持代码可维护。
分析 React 项目的框架、依赖、SSR 边界、样式体系和已有动画能力，形成后续动画库选型与实现的技术上下文。
Build, edit, and troubleshoot Remotion video projects and compositions. Use when Codex needs to create or refine React-based motion graphics, timed scenes, transitions, audio or video layering, still renders, or frame-driven animation inside a Remotion app.
Git 提交规范，涵盖 commit message 格式（feat/fix/refactor）、Issue 关联、分支命名、PR 提交准备、rebase 使用。当用户提交代码、编写 commit message、创建分支或准备 PR 时使用。
| name | motion-requirement-alignment |
| description | 将模糊的 React 动效诉求拆解为明确的动画目标、触发条件、范围边界和验收标准，为后续项目分析与选型提供清晰输入。 |
| license | MIT |
| metadata | {"author":"Aki workspace","version":"1.0.0","category":"planning","estimated_tokens":"1800"} |
把用户对 React 动效的模糊表达整理成可执行的需求结构，明确动效要服务的界面层级、触发方式、性能约束和不可触碰的边界。
react-project-context-analysis 和 animation-library-selection 直接使用。## Motion Goal
- 目标：
- 层级：
- 触发方式：
## Scope
- 影响范围：
- 是否允许新增依赖：
- 是否需要 SSR 兼容：
## Constraints
- 性能约束：
- 可访问性约束：
- 禁止项：
## Success Criteria
1. ...
2. ...
A: 优先把“酷”翻译成具体效果，例如更明确的入场节奏、更好的按钮反馈或更顺滑的页面切换，不直接放大为全页复杂动画。
A: 当需求涉及首屏复杂滚动联动、全页大面积动画、资源型动画或 SSR 场景下的强客户端依赖时。
react-project-context-analysisanimation-library-selection