Can I change the words and colors?

Yes. Supply messages and placeholder in JSON and choose one of the four palettes, with optional semantic overrides. The Conversation heading is fixed in the effect code; changing that heading requires an edit to the implementation.

Do I need to supply footage?

No. This effect uses a portrait image, not presenter video. The generated default avatar is supplied automatically; --images lets you replace chatAvatar. General cutout instructions for other CreatorMotion effects do not apply here.

Can I revise the motion?

Yes. Keep the fixed conversation canvas, downward growth and copy-dependent message wrapping if you want to preserve this effect. Adjust timing in the editable project and render again after changes.

Does it send messages or run an AI conversation?

No. The messages, placeholder and controls form a motion composition. Supply the wording yourself and label illustrative exchanges appropriately; no chat backend or model call is part of this sequence.

What should I check with longer copy?

Inspect the full stack at its final state and each message at reading speed. The simple width/height rules can leave long text or the fourth balloon crowded; revise the wording or layout if the last message competes with the input area.

CreatorMotion · Chat Message Stack

Previews from the publisher

Reveal a short exchange without moving the conversation around. Speech balloons appear one after another inside a fixed chat canvas, while the speaker portrait and input line stay in place. The result is an editable seven-second conversation animation for explaining a prompt or idea; it does not connect to a chat service or generate replies.

What you get

A local generator, effect implementation and documented motion/review workflow. Running the generator creates an editable HyperFrames composition, which you can render to a 1920×1080, 30 fps video segment.
Up to four message balloons, editable through messages, plus a placeholder for the input line. The default three-message exchange arrives at 0.50, 1.55 and 2.60 seconds; a fourth uses the same spacing. Earlier messages remain in place as the stack grows.
A raster speaker portrait through chatAvatar and editable speech balloons, tails and input treatment. Width and height use a simple copy-length rule rather than equal-height list rows; unusually long text needs manual inspection.
Four palettes share the same sequence: White & Yellow (white-yellow), Charcoal & Lime (charcoal-lime), Paper & Orange (paper-orange) and Black & White (midnight-ice). Semantic overrides can adapt the colors; check contrast after changes. Dark canvases carry a fine static grid. Bundled local fonts include Inter, IBM Plex Mono for measurements and ordinals, and the Chinese faces Smiley Sans and Noto Sans SC. Chinese content automatically uses Smiley Sans, including Latin text in the same composition; --zh-font noto-sans-sc selects the plainer alternative, while --font supplies your own font. Recheck wrapping after changing typography.

Before you choose

Choose this for a short readable exchange, not a screenshot full of transcript text. If contrasting two speakers matters, the shared marker and one-sided bubbles need deliberate adaptation rather than suggesting the default already distinguishes both people.

Good fit

A short creator explanation that introduces a question and develops the answer over several readable messages.
Teaching a prompting pattern or a small conversational example with concise copy and a clear reading order.
A series using the same chat treatment, palette and typography for different examples.

Not for

An interactive chat interface, automatic model responses or a recording of a real conversation. All displayed messages are supplied content.
A long transcript or unrestricted automatic text fitting. Only four messages are shown and the fixed canvas has finite space.
Automatic editing of an entire production, generation of a presenter performance or soundtrack, or copying a reference creator’s identity and footage.

How to use

You say

/creatormotion-cards-chat-stack Turn my supplied explanation into a white-yellow B-roll scene using the Chat Message Stack effect. Use the text, data and media I provide, and ask for any required input that is missing.

Write messages in the order viewers should read them and choose the placeholder text. The animation uses one shared speaker marker and visual treatment rather than alternating left/right speaker identities; make the authorship of your example clear.
Keep the exchange concise. The code assigns a taller balloon above 62 characters and caps its width; it does not measure every possible line break. Four long messages can crowd the input area, so shorten the copy or edit the layout rather than relying on the input array alone.
Use the illustrative bundled chatAvatar or replace that named slot with an appropriate portrait. Do not present a generated avatar as a named real participant. No presenter take or alpha matte is used by this effect.
Use Node.js 22+, FFmpeg and the documented HyperFrames CLI 0.8.30. From the extracted package, run node scripts/create.mjs --out PROJECT --data CONTENT.json, adding --style and optional --overrides for styling. An --images JSON map replaces named local image slots; relative paths resolve beside that map and unlisted slots retain defaults. Read the image policy before changing visual materials.
Inspect the generated project, then render with npx --yes hyperframes@0.8.30 render PROJECT --output VIDEO.mp4 --fps 30 --quality high --strict. Review the actual opening, each change and final reading hold for wrapping, cropping and overlap. This produces one segment; assemble narration, music and surrounding shots separately. Read every balloon at playback speed, and check that its solid tail stays attached and that the final message does not collide with the input line.

Requirements and costs

You bring: messages: provide your own content or retain the illustrative default. · placeholder: provide your own content or retain the illustrative default.
Dependencies: HyperFrames CLI 0.8.30 or compatible — required · Node.js 22 or newer — required · FFmpeg — required
Outside costs: Not collected yet
Tools used: HyperFrames
Publisher testing: v1.0.1 — Claude Code / Claude Desktop / Cowork / Codex / ChatGPT