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.
Profile →npx skills add nexu-io/open-design --skill chat-motion-overlay --agent claude-code
Same command for any agent — swap --agent for codex, cursor, copilot.
Weekly change comes from our own snapshots, not the repository page — it measures attention, not adoption.
# 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/build_chat_overlay_spec.py` with a transcript and optional config JSON. - The script outputs a single JSON spec that Remotion can render directly. 4. Prepare a ren
- Workflow
- Supported Dimensions
- Output Rules
- Question Policy
- Resources
What does the chat-motion-overlay skill do?
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.
How do I install it?
Run `npx skills add nexu-io/open-design --skill chat-motion-overlay --agent claude-code` — it drops the skill into your project so the agent can pick it up. Swap the --agent value for codex, cursor or copilot if you use one of those.
Where does this skill come from?
From nexu-io/open-design, a repository with 83,577 stars. We read it straight from the repository tree rather than a submitted listing, so what you see here is what is actually published.
Is a popular skill a good skill?
Not necessarily. Stars measure attention, not adoption — a repository can trend for a week and be abandoned. That is why we show the weekly change from our own snapshots next to the total, instead of a single flattering number.