用自然语言让Claude帮你做动画：animate Skill 测评

还在用 After Effects 熬夜做动画？或者让 AI 生成分镜后自己一点点拼视频？来试试 animate——一个让 Claude 分分钟帮你生成专业级浏览器动画的 Skill。

它的工作方式很直接：你说人话，Claude 输出一个完整的 Vite + React + Framer Motion 项目，跑起来就是一个自带转场、配好时序、能直接分享的动画短片。不是 GIF，不是视频文件——是一个可在浏览器里播放的互动动画页面。

支持三种动画路线

• Framer Motion（默认）：适合产品介绍、演示文稿、营销页，有大量现成转场预设
• p5.js：适合生成艺术、粒子系统、程序化视觉
• Three.js + react-three-fiber：需要 3D 场景时用

实测怎么跑

装好 Skill 后，告诉 Claude：「做一个 15 秒的产品发布动画，主色调用深蓝+亮橙，结尾有 CTA 按钮。」它会自动拆成 3–7 个场景，每个场景配上合适的转场效果（fadeBlur、scaleFade、slideLeft 等十几种可选），生成完整的 React 组件和 CSS 主题。

你只需要：

• 跑 npm install && npm run dev
• 浏览器打开 http://localhost:5173

有 Gemini API Key 的话还能直接让 Gemini 3.1 Pro 帮你规划分镜、配色和文案，Claude 负责执行——设计感直接拉满。

适合谁

需要快速出动画原型或成品的设计师 / 创作者 / 营销人。不想学动画软件，但又需要专业感动画的时候，这个 Skill 能帮你省大量时间。

GitHub 仓库：https://github.com/OneWave-AI/claude-skills（animate 子目录），主库 285 Stars。

GitHub: https://github.com/OneWave-AI/claude-skills