What makes a cut velocity-matched?

The outgoing element is still moving when the scene changes, and the incoming one is already moving on the same axis, in the same direction and at a comparable speed. Plan that relationship before building and inspect frames on both sides; a smooth-looking individual scene is not enough.

Can the workflow collect my brand assets?

It describes a capture step for a site you own or have explicit permission to capture, collecting actual marks, color values and font references. Supplied mark files and colors are the alternative. If the brand typeface cannot be redistributed, choose an appropriate open substitute and record it in the handoff.

Can I retime or rebrand the film?

Yes. Copy, colors, mark, icons, card contents and canvas are meant to change. A moved scene changes both adjacent seams, so update the cut ledger and verify both again. Remeasure text geometry when copy or fonts change.

Is the project already included?

The package provides the production and motion references. An agent uses them to author a single-file HyperFrames project, its cut ledger and the rendered MP4. There is no finished branded film or executable starter project in the archive.

What is the most useful review at normal speed?

Look for a momentary stop at a cut. If an exit settles or an arrival starts from rest, the sequence feels like separate screens even when the still frames look polished. The ledger and frame checks help locate that break.

Velocity-Matched UI Sting

Previews from the publisher

Make a short sequence of product surfaces feel like one camera movement. Velocity-Matched UI Sting plans each cut around a moving exit and an already-moving arrival on the same axis. The result is intended as a ten-to-thirteen-second launch sting or bumper, with a written cut plan that helps preserve its motion when the brand or timing changes.

What you get

A production method for a ten-to-thirteen-second MP4 at the chosen square, vertical or wide canvas, targeting 30 fps H.264/AAC. Seven slots move through a two-part lockup, entry surface, closer action, meaningful number, navigation choice, create action and end card.
Instructions for creating one HTML-based HyperFrames project without a separate app build step or nested sub-compositions. The handoff should include the project, assets, metadata and a ledger naming the cut time, axis and direction on both sides.
A motion contract using a shared arrival ease and mirrored exit ease, with planned frame-stamped decisions for typing, number changes and list highlights. Motion continues across every cut rather than settling into a slideshow.
Brand-retarget, slot and verification references explaining what must be measured from rendered text and how every adjacent cut must be rechecked after retiming. These are authoring guides; the finished project and MP4 are created when the workflow is run.

Before you choose

Choose this when the product already has recognizable surfaces and the goal is a brief impression of momentum. First fill every slot truthfully, then verify one complete pair of cuts. Rebranding succeeds when new content fits the motion and geometry, not just when the accent color changes.

Good fit

A launch-day post, conference bumper, short loop or energetic opening section of a longer product film.
A product with genuine entry, navigation, meaningful numeric and create-action surfaces to populate the sequence.
A team expecting to rebrand or make related stings and willing to preserve an explicit motion plan across versions.

Not for

Explaining what a product does in detail. This is a fast impression of product surfaces, not a full argument.
A product without a navigation or create affordance, where important scenes would have to imply features that do not exist.
Borrowing a competitor’s or partner’s UI to fill the sequence. The documented workflow uses the caller’s surfaces or neutral original ones.

How to use

You say/hyperframes-velocity-sting Make a 12 second vertical sting for our asset library. Mark and tokens attached.

Gather the actual seven-slot material, real mark files and four tokens: ground, ink, accent and hairline. Choose the canvas and any supplied track. Brand capture is an option for an owned or explicitly permitted site; otherwise start from supplied artwork and color values.
Prepare HyperFrames CLI, Node.js 22 or newer and FFmpeg and locate the motion-stack references named by the guide. Plan the frame timings and cut ledger before writing scenes, giving each exit and entry a shared axis and direction.
Build the single-file project in slot order using the specified ease functions. Stamp discrete choices such as typing rhythm or number steps frame by frame, rather than relying on an interpolation that changes their intended timing.
Render an initial pass and measure text-dependent widths from settled frames. Feed those measurements back into off-screen positions and highlights. Replacing a word or typeface can change the geometry even if all colors and durations stay the same.
For each cut, inspect frames before and after it to confirm both sides move in the planned direction, then preview at full speed. Retiming one scene requires checking both neighboring cuts. Run the documented lint/check steps, snapshot all scenes and verify the final MP4’s canvas, duration, frame rate and audio as applicable.

Requirements and costs

You bring: The product's seven slots: lockup, entry surface, one number, navigation, one create action, endcard · Four brand tokens — a ground, an ink, one accent, a hairline · The mark as a real file, in two parts if it has them · The canvas: square, vertical, or wide · Optionally a licensed music bed
Dependencies: HyperFrames CLI — required · Node.js 22 or newer — required · FFmpeg — required
Outside costs: Not collected yet
Tools used: HyperFrames
Publisher testing: v1.0.0 — Claude Code / Claude Desktop / Cowork / Codex / ChatGPT