mcpField
W
wechat-2d-render

wechat-2d-render

github.com/vibe-motion创意与媒体1.4k840 次安装3 周前更新
代码仓库

关于 wechat-2d-render

此 Skill 运行 Remotion 工作流，将 WeChat 2D 动画渲染为 MOV 文件。它会在可用时复用本地项目，支持自定义 props，默认输出适用于透明背景工作流的 ProRes 4444 文件。

主要功能

  1. 01运行 Remotion 渲染脚本
  2. 02指定工作区和输出路径
  3. 03传入自定义 props JSON
  4. 04默认输出 ProRes 4444
  5. 05克隆或复用本地项目

适用场景

  1. 01渲染 WeChat 聊天动画
  2. 02制作透明背景 MOV
  3. 03使用自定义合成参数渲染

安装

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

$npx skills add https://github.com/vibe-motion/skills --skill wechat-2d-render

安装后在 Claude Code 中输入/wechat-2d-render确认已加载。

附带文件scripts/render_wechat_2d.sh

详细介绍

WeChat 2D 渲染

工作流

  1. 使用此技能中的 scripts/render_wechat_2d.sh。
  2. 如果用户指定了文件夹，将 workspace_dir 作为第一个参数传入；否则使用当前目录。
  3. 如果用户指定了输出路径，将 output_path 作为第二个参数传入；否则使用 out/wechat-2d-transparent.mov。
  4. 如果用户提供了自定义 Remotion props，将 props JSON 路径作为第三个参数传入；否则使用 shared/project/render-presets/default.json。
  5. 运行脚本并等待完成。
  6. 返回脚本打印的最终绝对输出路径。

命令

bash scripts/render_wechat_2d.sh [workspace_dir] [output_path] [props_file]

已安装技能的解析

使用已安装的技能副本，而不是源代码仓库检出版本：

skill_dir=""
for base in "${AGENTS_HOME:-$HOME/.agents}" "${CLAUDE_HOME:-$HOME/.claude}" "${CODEX_HOME:-$HOME/.codex}"; do
  if [ -d "$base/skills/wechat-2d-render" ]; then
    skill_dir="$base/skills/wechat-2d-render"
    break
  fi
done
[ -n "$skill_dir" ] || { echo "wechat-2d-render skill not found under ~/.agents, ~/.claude, or ~/.codex"; exit 1; }

bash "$skill_dir/scripts/render_wechat_2d.sh" "$(pwd)" "$(pwd)/out/wechat-2d-transparent.mov"

行为

  • 如果 workspace_dir/wechat-2d 存在，则复用本地仓库；否则从 GitHub 克隆。
  • 更新现有仓库时，跟踪远程默认分支（origin/HEAD）。
  • 使用 pnpm install 安装依赖；如果缺少 pnpm，则通过 corepack 启用。
  • 运行项目的 Remotion 脚本：
    • pnpm run remotion:ensure-browser
    • REMOTION_OUTPUT=... REMOTION_PROPS_FILE=... pnpm run remotion:render
  • 默认渲染目标是 shared/project/projectConfig.js 中的活动合成，目前为通过 ScaffoldDemo30fps 使用的 wechat-chat-motion 插件。
  • 默认输出为 ProRes 4444，使用 yuva444p10le 像素格式和 PNG 图像格式，适用于透明背景工作流。

项目说明

  • 项目采用脚手架／插件分离结构：
    • preview/* 用于本地 UI 控件和浏览器预览。
    • remotion/* 用于 Remotion 入口封装。
    • shared/scaffold/* 用于通用运行时。
    • shared/project/* 用于插件和合成注册表。
    • shared/features/demoMotion/* 用于微信聊天场景。
  • 每一帧的动画状态都必须具有确定性。Remotion 会并行且乱序渲染帧，因此不要依赖计时器、可变游标、先前的渲染结果或渲染顺序。
  • 应在 buildSceneProps 中根据 {frame, fps, loop, sceneContext, pluginParams} 构建特定帧的数据。
  • 将 videoWidth 和 videoHeight 保留为布局属性；自定义尺寸请使用 props JSON 文件。

要求

  • git
  • node
  • corepack 或 pnpm
  • 用于克隆／更新和安装依赖的网络访问

评论

支持 Markdown