motion-ui - 构建具有明确动效的精致界面
使用 Framer Motion 微交互、清晰的界面状态、设计令牌和符合无障碍要求的动画创建现代界面。
标签
更新于: 2026-09-29能力
典型输入
典型输出
该技能可以做什么
- 实现富动效界面组件
- 定义设计令牌
- 动画化组件状态变化
- 添加按钮微交互
- 动画化提示框和模态框
- 处理加载和成功状态
- 支持减少动效偏好
- 验证界面交互状态
输入
- 组件或页面需求
- 项目记忆文件
- 现有设计令牌
- 组件库规范
- 无障碍设置
输出
- 支持动效的界面代码
- 动画化组件状态
- 设计令牌定义
- 无障碍属性
- 更新后的项目记忆文件
要求
- Framer Motion
- CSS 变量
- Tailwind CSS 或全局 CSS
- 前端实现环境
