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.
SkillScore74Maintained
Automatic
◆Marketing & Content pack
Last verified 8/28/2026
What it changes
Passed 17 of 23 test cases with the skill, and 9 of 23 without it.
Without skill39%
With skill74%
Checks it passed that the model alone missed
Sets container parameter to none.
Assigns exactly one message per beat.
Sets nicknameMode parameter to hidden.
and 6 more in the full report
9 fixed8 passed either way5 still failing1 broke
Pass-rate lift
+35 pp
Tokens
+6%
Agent turns
0%
Response time
-49%
Model gemini-3.6-flashMeasured 8/28/2026v117 of 23 cases passed with skill
Tokens, turns and time describe resource use, not a dollar price.
See it in action
One of 9 test cases the skill fixed. Same model, same prompt, with and without the skill.
1 of 9
Prompt
I have supplied avatar files avatar1.png and avatar2.png for my chat overlay bundle preparation. Into which folder in the Remotion template must these asset files be copied?
What was checked, without and with the skill
Checked
Without skill
With skill
Copies uploaded avatar files into the public/ folder.
Missed
Passed
case-14 · gemini-3.6-flash · 8/28/2026 · answers are capped and redacted
What's inside
The instructions your model reads when the skill loads.
SKILL.md70 lines10 filesincludes scripts
Chat Motion Overlay
Turn chat content into a configurable motion overlay clip instead of a single hard-coded WeChat mock.
Workflow
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.
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.
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.
Prepare a renderable bundle.
Run scripts/prepare_chat_overlay_bundle.py.
It copies the Remotion template, injects src/chatSpec.ts, and copies any uploaded avatar files into public/.
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.