Communitygithub.com

thedixitjain/the-mega-skill-library

在构建、审查或重构 Remotion 项目时使用,特别是参数化的发布或演示视频,包含共享属性模式、calculateMetadata、Sequence 和 Series 时序、多种宽高比、终端或素材图层以及渲染脚本。首选官方 Remotion 文档或 MCP 获取 API 详情,因为包行为可能发生变化。

the-mega-skill-library 是什么?

该技能旨在为 AI 智能体(如 Claude Code、Cursor、Codex)提供一个全面的 Remotion 视频构建指南。它涵盖了从项目搭建到参数化视频生成的全流程,遵循官方推荐的最佳实践,确保项目稳定性和可维护性。技能强调统一的依赖版本管理、Zod 模式定义输入合同、使用 calculateMetadata 动态计算视频属性,以及通过 `<Series>` 和 `<Sequence>` 管理复杂的时间线和图层结构。对于可选素材(如占位符或真实素材)提供了标准处理模式,并包含针对特定项目(如 Millrace 发布视频)的引用文档,以处理特殊需求。它支持多种平台(Claude Code、Cursor、Codex 等),并鼓励在不确定 API 行为时查阅官方文档或 MCP 服务器。该技能还提供了一系列默认规则和检查清单,帮助用户避免常见错误,如使用 `random()` 替代 `Math.random()`,以及正确处理多宽高比输出。

兼容平台✓Claude Code✓Codex CLI~Cursor
npx skills add https://github.com/thedixitjain/the-mega-skill-library/tree/HEAD/library/media-and-creative/remotion-video-builder

在你喜欢的 AI 中提问

打开一个已预加载此 Agent Skill 的新对话。

文档

Remotion 视频构建器

你的 Remotion 知识可能已经过时。当确切的 API 行为很重要时,首选官方 remotion-documentation MCP 服务器或 remotion.dev 上的文档。

从这里开始

  • 如果项目尚不存在,使用 npx create-video@latest 搭建框架,并首选空白模板。
  • 确保所有 remotion 和 @remotion/* 包保持完全相同的版本,并避免使用 caret 范围。
  • 标准入口结构:
    • src/index.ts 调用 registerRoot()
    • src/Root.tsx 使用 <Composition> 或 <Still> 注册所有视频

构建顺序

  1. 首先建模输入合同:
    • 顶级属性模式
    • 时间线或事件数据
    • 渲染配置
  2. 使用 zod 定义共享属性,并将模式传递给每个 <Composition>。
  3. 使用 calculateMetadata 派生 durationInFrames、width、height、转换后的属性和 defaultOutName。
  4. 使用 <Series> 构建叙事顺序的场景结构,使用 <Sequence> 构建叠加层、入场效果、素材窗口和标注。
  5. 在 Remotion v4.x 项目中,明确在需要在出现前加载资源的 <Sequence> 元素上设置 premountFor。
  6. 在完善动画之前添加样本数据和渲染脚本。

默认值和规则

  • 默认使用 fps={30} 和 1920x1080 横向模式,除非需求另有说明。
  • 使用 AbsoluteFill 进行图层叠加。
  • 对来自 public/ 的任何内容使用 staticFile()。
  • 使用 useCurrentFrame() 和 useVideoConfig() 实现基于帧的逻辑。
  • 偏好微妙的动画:
    • 使用高阻尼的 spring()
    • 使用带钳位的 interpolate()
  • 不要使用 Math.random()。使用 remotion 中的 random(seed)。
  • 保持文本动画简单且易读。
  • 保持横向和纵向输出使用相同的业务逻辑,除非需求确实要求分叉。

参数化视频检查清单

  • 一个共享的顶级 z.object() 模式
  • defaultProps 匹配组件属性形状
  • calculateMetadata 在输入需要时返回动态时长或尺寸
  • 用于本地预览的示例 JSON 或 TypeScript 数据
  • 每个目标输出的渲染脚本

素材策略

当素材是可选的时,支持至少以下模式:

  • none
  • placeholder
  • real

当没有真实素材时,时间线和叠加层仍应渲染。

Millrace 发布视频

如果请求与 Millrace 或发布视频管线相关,请在实现之前阅读 references/millrace-launch-video.md。

参考资料


来源: hashgraph-online/awesome-codex-plugins → plugins/tim-osterhus/codex-remotion-plugin/skills/remotion-video-builder/SKILL.md

Individual skills in this repo

This repo contains 1 individual skill — each has its own dedicated page.

相关技能