mcpField
O
open-animate

open-animate

github.com/jacobcwright创意与媒体2668 次安装31 周前更新
代码仓库

关于 open-animate

面向 Agent 的动效制作技能，基于 Remotion 与 @oanim/core 组合场景并渲染 MP4。它还可通过 MCP 工具或 CLI 生成、编辑图像及生成音视频素材。

主要功能

  1. 01项目脚手架与动画预设
  2. 02场景组件和转场
  3. 03字体效果与设计令牌
  4. 04渲染 MP4 与云端渲染
  5. 05生成及处理图像、视频和音频

适用场景

  1. 01制作产品发布或说明视频
  2. 02构建多场景动效
  3. 03生成并合成视觉与音频素材

MCP 相关

提供 gen_image、edit_image、remove_bg、upscale、gen_video、gen_audio 和 run_model 等 MCP 工具，供 MCP 环境生成或处理媒体素材。

安装

复制下面的命令，在终端中运行。

$npx skills add https://github.com/jacobcwright/open-animate --skill open-animate

安装后在 Claude Code 中输入/open-animate确认已加载。

包含的文件

除 SKILL.md 外，安装时一起下载的参考资料和脚本。

references/
animation-cookbook.md
asset-generation.md
composition-patterns.md
media-guide.md
scene-config.md
workflow.md
templates/
explainer.md
investor-update.md
launch-video.md
logo-reveal.md
meme-caption.md

详细介绍

Open Animate — 面向 Agent 的创意套件

制作专业动态图形并生成视觉素材。描述你的需求，即可获得 MP4。

前置条件

此技能基于 Remotion 技能，用于掌握 Remotion API 的核心用法：

npx skills add remotion-dev/skills

工作流

1. 初始化项目
npx oanim init my-video
cd my-video
2. 使用 @oanim/core 进行合成
import { fadeUp, popIn, Background, SafeArea, palettes } from '@oanim/core';

完整预设参考请参阅 references/animation-cookbook.md。

3. 预览
npx remotion studio
4. 渲染为 MP4
npx oanim render
5. 生成并使用媒体素材（可选）

MCP 工具（首选——适用于 Cowork 和任何支持 MCP 的环境）：

工具用途
gen_image根据文本提示词生成图像
edit_image根据提示词编辑现有图像
remove_bg移除图像背景
upscale将图像放大 2 倍
gen_video根据文本生成视频（异步，轮询直至完成）
gen_audio根据文本生成音频／音乐（异步，轮询直至完成）
run_model使用自定义输入运行任意 fal.ai 模型

CLI（备用方案——需要出站 HTTP）：

npx oanim assets gen-image --prompt "dark gradient abstract" --out public/bg.png
npx oanim assets run --model fal-ai/kling-video/v2.5-turbo/pro/text-to-video \
  --input '{"prompt":"cinematic abstract motion","duration":"5"}' --out public/clip.mp4
npx oanim assets run --model beatoven/music-generation \
  --input '{"prompt":"ambient electronic, no vocals","duration_in_seconds":30}' --out public/music.mp3

然后在合成中使用：

import { Img, OffthreadVideo, Audio, staticFile } from 'remotion';

<Img src={staticFile('bg.png')} style={{ width: '100%', height: '100%', objectFit: 'cover' }} />
<OffthreadVideo src={staticFile('clip.mp4')} style={{ width: '100%', height: '100%', objectFit: 'cover' }} />
<Audio src={staticFile('music.mp3')} volume={0.25} />

功能

功能MCP 工具CLI 命令
项目脚手架—oanim init
动画预设（fadeUp、popIn、springs）—@oanim/core
组件（Terminal、Card、Badge、GlowOrb）—@oanim/core
场景转场（fadeBlur、clipCircle、wipe）—@oanim/core
字体排版（AnimatedCharacters、TypewriterText、CountUp）—@oanim/core
设计令牌（5 种配色、字体、间距）—@oanim/core
渲染为视频—oanim render
云端渲染—oanim render --cloud
AI 图像生成gen_imageoanim assets gen-image
AI 图像编辑edit_imageoanim assets edit-image
移除背景remove_bgoanim assets remove-bg
图像放大upscaleoanim assets upscale
AI 视频生成gen_videooanim assets run（视频模型）
AI 音频生成gen_audiooanim assets run（音频模型）
任意 fal.ai 模型run_modeloanim assets run
媒体合成—通过 staticFile() 使用 <Img>、<OffthreadVideo>、<Audio>

参考资料

  • references/workflow.md — Agent 工作流分步指南
  • references/scene-config.md — animate.json 架构参考
  • references/composition-patterns.md — 多场景合成架构
  • references/animation-cookbook.md — 完整的 @oanim/core 预设参考
  • references/asset-generation.md — AI 素材生成指南
  • references/media-guide.md — 在合成中使用生成的媒体（Img、Video、Audio）

模板

  • templates/launch-video.md — 4 场景产品发布视频（5s）
  • templates/explainer.md — 分步骤讲解视频（20s）
  • templates/logo-reveal.md — 带辉光效果的 Logo 动画（5s）
  • templates/meme-caption.md — 竖屏社交短片（6s）
  • templates/investor-update.md — 指标仪表板（15s）

评论

支持 Markdown