mcpField
R
remotion-create

remotion-create

github.com/remotion-dev创意与媒体69.1k108 次安装今天更新
代码仓库

关于 remotion-create

用于搭建 Remotion 视频项目和制作合成内容的指引,涵盖项目初始化、先预览再编辑,以及时间线、多场景和交互式视频的注意事项。

主要功能

  1. 01初始化 Remotion 项目
  2. 02搭建前检查文件夹
  3. 03编辑前打开 Studio 预览
  4. 04片段时间线制作指引
  5. 05多场景与交互视频指引

适用场景

  1. 01启动 Remotion 视频项目
  2. 02借助 Studio 预览编辑合成
  3. 03制作由片段组成的时间线视频
  4. 04创建连续场景视频

安装

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

$npx skills add https://github.com/remotion-dev/remotion --skill remotion-create

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

包含的文件

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

tailwind.md
video-layout.md
agents/
openai.yaml

详细介绍

这些说明介绍了如何创建新的 Remotion 项目和合成。 如果这不是下一个任务,请参阅 Remotion 最佳实践

搭建项目

如果项目已存在,请跳过此步骤。 确保已安装 Node.js 和 Git,并且当前文件夹适合用于启动新项目。

选择搭建位置前,请检查当前文件夹,包括隐藏文件。

空文件夹

如果文件夹为空,或仅包含 .DS_Store 等可删除的操作系统元数据,请直接在当前文件夹中创建项目。 先只删除这些可删除的元数据文件,因为 create-video 不接受非空文件夹。 不要将所有隐藏文件都视为可删除内容:.env 等文件和 .git 等目录都是有意义的内容。

在现有文件夹中搭建:

npx create-video@latest --yes --blank --no-tailwind .
npm i
非空文件夹

如果当前文件夹包含有意义的内容,且尚无项目,请在新的子文件夹中搭建。 将 my-video 替换为合适的项目名称。

npx create-video@latest --yes --blank --no-tailwind my-video
cd my-video
npm i

构建视频前打开预览

项目一旦可以运行,就在编写或修改合成前,于浏览器中打开 Remotion Studio。对于新项目,请在搭建项目并安装依赖后立即执行。对于现有项目,请在编辑视频前执行。工作期间保持 Studio 运行,让用户能看到变化并及时指导结果。

设计视频

保留搭建好的项目,并添加 React Markup。 遵循 Remotion React Markup 最佳实践和视频布局规则,获取以视频为优先的布局和文本尺寸指导。

在编写用于注册 <Composition> 或 <Still> 元素的根组件前, 请遵循合成与静帧。

是否为片段时间线?

如果视频将多个视频或音频片段排列在时间线上,请在编写时间线前遵循 视频剪辑。为每个需要单独编辑的片段创建专属的 JSX 节点。

是否为多场景视频?

如果视频包含多个连续场景,请遵循多场景视频中的指导。

交互最佳实践

按照 Remotion 交互最佳实践构建 React Markup,用户便可在 Studio 中进行编辑,并将更改写回代码。

TailwindCSS

如果用户要求使用 Tailwind,请参阅 tailwind.md,了解如何在 Remotion 中使用 TailwindCSS。

后续步骤

视频创建流程已完成。 对于后续提示,请使用 Remotion 最佳实践

评论

支持 Markdown