mcpField
R
remotion

remotion

github.com/podo创意与媒体29214 次安装3 天前更新
代码仓库

关于 remotion

面向 React 视频开发者的 Remotion 官方技能包，提供 12 项技能，用于创建、预览和渲染程序化视频，并涵盖字幕、媒体处理、地图动画及版本升级。

主要功能

  1. 01React 组件式视频创作
  2. 02项目脚手架与标记最佳实践
  3. 03Remotion Studio 预览与视频渲染
  4. 04字幕和多媒体处理
  5. 05地图动画与交互效果
  6. 06文档检索和版本升级

适用场景

  1. 01制作产品演示和解释动画
  2. 02生成数据驱动的可视化视频
  3. 03将视频渲染为 MP4、WebM 或 GIF

安装

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

$npx skills add https://github.com/podo/design-agent-skills --skill remotion

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

附带文件stub.yaml

详细介绍

remotion

目录占位条目 — 完整软件包：remotion-dev/skills

决策树

  1. 是否已安装完整技能？ 此软件包会安装 12 个技能（remotion-best-practices、remotion-captions、remotion-create、remotion-docs、remotion-interactivity、remotion-maps、remotion-markup、remotion-multimedia、remotion-render、remotion-saas、remotion-studio、remotion-upgrade）；检查第一个技能。

    • 全局：f=~/.agents/skills/remotion-best-practices/SKILL.md; [ -f "$f" ] && ! grep -q "^das:" "$f" && echo "installed" || echo "pointer"
    • 项目：f=.agents/skills/remotion-best-practices/SKILL.md; [ -f "$f" ] && ! grep -q "^das:" "$f" && echo "installed" || echo "pointer"
    • installed → 技能已安装为 remotion-best-practices，调用它并继续
    • pointer → 转到第 2 步

  2. 检测范围，然后安装：

    [ -e ~/.agents/skills/remotion ] && echo "global" || echo "project"

    全局：

    npx skills add remotion-dev/skills --skill remotion-best-practices remotion-captions remotion-create remotion-docs remotion-interactivity remotion-maps remotion-markup remotion-multimedia remotion-render remotion-saas remotion-studio remotion-upgrade -g -y

    项目：

    npx skills add remotion-dev/skills --skill remotion-best-practices remotion-captions remotion-create remotion-docs remotion-interactivity remotion-maps remotion-markup remotion-multimedia remotion-render remotion-saas remotion-studio remotion-upgrade -y

    Claude Code： 发送以 ! 开头的命令作为聊天消息，即可在不离开对话的情况下运行。

注意

  • 要求： Node.js 和一个 Remotion 项目（remotion-create 会搭建项目框架）
  • 许可证： skills 仓库没有 LICENSE 文件；Remotion 本身可供个人、非营利组织和员工不超过 3 人的营利团队免费使用，其他情况需要公司许可证（remotion.dev/license）
  • 名称冲突： remotion 也由 google-stitch-skills 编写（其安装程序或目录指针）；同时安装两者会覆盖先安装的那个。

安装后调用

  • 技能名称：remotion-best-practices、remotion-create、remotion-markup、remotion-studio、remotion-render、remotion-captions、remotion-multimedia、remotion-maps、remotion-interactivity、remotion-saas、remotion-docs、remotion-upgrade
  • 不确定该用哪个？从 remotion-best-practices 开始，它会指引你使用其他技能
  • 触发短语：“remotion”、“programmatic video”、“React video”、“animated video”、“render video”

功能

官方 Remotion 技能软件包，用于通过 React 创建程序化视频。将视频序列组合为 React 组件，使用弹簧物理和插值制作动画，并渲染为 MP4、WebM 或 GIF。子技能涵盖搭建新项目（remotion-create）、标记语言最佳实践（remotion-markup）、在 Remotion Studio 中预览（remotion-studio）、渲染（remotion-render）、字幕、Mediabunny 媒体处理（remotion-multimedia）、地图动画（remotion-maps）、交互性、围绕 Remotion 构建 SaaS 应用、搜索文档和升级版本。最适合需要通过代码精确控制的产品演示、数据驱动型可视化和说明性动画。

请注意，Remotion 本身按组织规模授予许可：个人和极小型公司可免费使用；规模较大的营利团队需要公司许可证。

不适用场景

  • 不需要导出视频的简单 CSS/JS 动画（使用 gsap-skills 或 framer-motion-skills）
  • 非 React 视频处理流程（将 HTML 转为视频时使用 hyperframes）

评论

支持 Markdown