Agent skill · creative production · nexu-io

chat-motion-overlay

Generate configurable chat motion overlays from a transcript or screenshot, including plain bubble scenes, app-style chat containers, optional device frames, preset or uploaded avatars, nickname display rules, and transparent-video-ready Remotion bundles. Use when Codex needs to create reusable short-form chat clips for Douyin, demo videos, story reenactments, social-message proof scenes, or embeddable alpha overlays for Hyperframe and Remotion workflows.

Why this skill is useful

Adds specific scripts for generating chat overlays that are tailored for Remotion workflows, which the AI wouldn't reliably generate on its own.

What it needs

Requires remotion installed locally. About 2k tokens when loaded. Last updated 2026-08-07. 84,236 stars on the source repository.

What this skill does

Chat Motion Overlay Turn chat content into a configurable motion overlay clip instead of a single hard-coded WeChat mock. Workflow 1. Normalize the chat input. If the user gives a screenshot, extract the visible messages into the transcript format in references/input-format.md. If the user gives plain text, keep one message per beat and preserve exact wording when authenticity matters. For screenshots, use visible avatars as clues for participant count and message grouping, but do not crop or recreate avatar images by default. Infer participants and sides, then render with preset avatars unless the user provides avatar files or explicitly requests screenshot-derived avatars. 2. Choose a scene config. Read references/config-schema.md. Decide container style, avatar mode, device frame, nickname mode, and delivery format before generating the bundle. When the user has not provided enough information, follow the question policy in references/question-strategy.md. 3. Build the scene spec. Run scripts/buildchatoverlayspec.py with a transcript and optional config JSON. The script outputs a single JSON spec that Remotion can render directly. 4. Prepare a renderable bundle. Run scripts/preparechatoverlaybundle.py. It copies the Remotion template, injects src/chatSpec.ts, and copies any uploaded avatar files into public/. 5. Render the target output. Use the exact export commands in references/output-modes.md. Prefer MOV(透明背景,可直接导入剪映 / PR / FCP 叠加) for editing, WebM(透明背景,适合网页 / 浏览器播放) for browsers, and editable engineering outputs when the user wants to keep composing downstream. …

How to use it

Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:

@skills nexu-io/chat-motion-overlay

View the source on GitHub

Browse the @skills marketplace