Wechat 2d Render

vibe-motion/skills/wechat-2d-render

by vibe-motion4c86c0d016a3ba22ee673428a494f3c44f84111fNo licenseListed Oct 9, 2026Updated Oct 9, 2026

Clone or update https://github.com/sxhzju/wechat-2d and render the default WeChat-style 2D chat motion video with Remotion. Use when users ask for 微信聊天动画, wechat 2d chat render, 微信视频消息动效, or exporting the default demo from the wechat-2d project.

Includes scriptsDesign & Creative
AI-generated overview

Clones or updates the wechat-2d project and renders a WeChat-style 2D chat motion video with Remotion.

What it does
This skill runs a bundled shell script that clones or updates the wechat-2d repository, installs its dependencies, and renders the default WeChat-style 2D chat motion composition with Remotion. It accepts an optional workspace directory, output path, and Remotion props JSON file, and prints the final absolute output path. The default output is a ProRes 4444 .mov with a transparent background.
When to use it
Use it when a user asks for a WeChat chat animation, a WeChat 2D chat render, a WeChat video message motion effect, or wants to export the default demo from the wechat-2d project.
Requirements
Requires git, node, and corepack or pnpm, plus network access for cloning or updating the repository and installing dependencies. It ships an executable script at scripts/render_wechat_2d.sh and expects the skill to be installed under ~/.agents, ~/.claude, or ~/.codex.

WeChat 2D Render

Workflow

  1. Use scripts/render_wechat_2d.sh from this skill.
  2. Pass workspace_dir as the first argument when the user specifies a folder; otherwise use the current directory.
  3. Pass output_path as the second argument when the user specifies output; otherwise use out/wechat-2d-transparent.mov.
  4. Pass a props JSON path as the third argument when the user provides custom Remotion props; otherwise use shared/project/render-presets/default.json.
  5. Run the script and wait for completion.
  6. Return the final absolute output path printed by the script.

Command

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

Installed Skill Resolution

Use the installed skill copy, not the source repo checkout:

bash
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  fidone[ -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"

Behavior

  • Reuse local repo if workspace_dir/wechat-2d exists; otherwise clone from GitHub.
  • Track remote default branch (origin/HEAD) when updating an existing repo.
  • Install dependencies with pnpm install; if pnpm is missing, enable it through corepack.
  • Run the project Remotion scripts:
    • pnpm run remotion:ensure-browser
    • REMOTION_OUTPUT=... REMOTION_PROPS_FILE=... pnpm run remotion:render
  • Default render target is the active composition from shared/project/projectConfig.js, currently the wechat-chat-motion plugin via ScaffoldDemo30fps.
  • Default output is ProRes 4444 with yuva444p10le pixel format and PNG image format, suitable for transparent-background workflows.

Project Notes

  • The project uses a scaffold/plugin split:
    • preview/* for local UI controls and browser preview.
    • remotion/* for Remotion entry wrappers.
    • shared/scaffold/* for common runtime.
    • shared/project/* for plugin and composition registry.
    • shared/features/demoMotion/* for the WeChat chat scene.
  • Animation state must be deterministic per frame. Remotion renders frames in parallel and out of order, so do not rely on timers, mutable cursors, previous renders, or render order.
  • Frame-specific data should be built from {frame, fps, loop, sceneContext, pluginParams} in buildSceneProps.
  • Keep videoWidth and videoHeight as layout props; use a props JSON file for custom sizes.

Requirements

  • git
  • node
  • corepack or pnpm
  • network access for clone/update and dependency install

Source and attribution

Source:vibe-motion/skillsinwechat-2d-renderat commit4c86c0d

License: No license

Content belongs to its original authors. SourceWeft indexes it from a public repository.

Report or request removal