Animation Generator 是一款面向开发者的动画代码生成工具，核心用途是把自然语言描述的动画效果翻译成可直接使用的动画代码。它由 LXGIC Studios 开发，属于 LXGIC Dev Toolkit 系列（该系列包含 110 多个免费开发者工具）。
主要能力：
- 将英文自然语言描述转换为实际的动画代码。
- 支持 CSS keyframes 和 Framer Motion variants 两种输出格式。
- 能够处理复杂的多步骤动画。
- 输出可直接投入生产环境的代码。
使用方式： 通过 npx 运行，无需安装。推荐 Node.js 18+，需要设置 OPENAI_API_KEY 环境变量。
快速开始命令： npx ai-animation "fade in from left with bounce"
使用示例：
获取 CSS keyframes
npx ai-animation "pulse glow effect" -f css
获取 Framer Motion variant
npx ai-animation "staggered list entrance" -f framer
保存到文件
npx ai-animation "smooth slide up reveal" -f both -o animations.ts
复杂动画
npx ai-animation "shake horizontally three times then settle"
查看帮助： npx ai-animation --help
工作原理： 工具接收自然语言描述，将其翻译为动画原语。AI 理解常见的动画术语，如 "bounce"、"ease"、"stagger"，并将其转换为合适的时序函数和关键帧值。
最佳实践：
- 描述要具体，例如 "bounce twice then fade" 优于 "make it move"。
- 提及时间，如 "slow"、"fast"、"0.5s"。
- 指定方向，如 "from left"、"upward"、"diagonal"。
- 在设备上测试，动画在移动端的感觉会不同。
适用场景：
- 构建落地页，需要吸引注意力的效果。
- 为 UI 添加微交互。
- 能想象出动画效果但不会写数学计算。
- 在手动微调前快速制作原型。
限制与要求：
- 需要 OPENAI_API_KEY 环境变量。
- 推荐 Node.js 18+。
- 无需安装，通过 npx 运行。
- 许可证为 MIT，永久免费，可随意使用。
更多信息： GitHub: https://github.com/LXGIC-Studios Twitter: https://x.com/lxgicstudios Substack: https://lxgicstudios.substack.com Website: https://lxgicstudios.com GitHub（项目）: github.com/lxgicstudios/ai-animation Twitter: @lxgicstudios