Skip to content

Commit 8fb1482

Browse files
vanceingallsclaude
andcommitted
docs(prompting): rebuild rule 2 as cross-fade vs camera move
The old demo argued that a locked frame crops the story. The sharper claim is what a cut throws away: a move carries the spatial relationship between two shots, a cross-fade carries none. Five stages each get their own colour and the halves diverge on how the next colour arrives -- in place, or by travelling to it. 30-47% of pixels differ, against 3% for every version where the WITHOUT half moved the content. That 3% is the trap now documented in the rule: translating the scene and translating the camera are the same transform, so sliding content past a fixed frame is not a static comparison, it is the same shot rendered twice. Embed is cache-busted to -v2; docs images carry immutable year-long cache, so reusing the filename would serve returning visitors the old render. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
1 parent cdac57c commit 8fb1482

1 file changed

Lines changed: 9 additions & 5 deletions

File tree

‎docs/prompting/motion.mdx‎

Lines changed: 9 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,7 @@ If a movement is doing none of those, it's decoration, and decoration is what ma
3333
Once a movement has something to say, this is how to make it read well. These rules govern *execution*; none of them is a reason to add a movement that has no job:
3434

3535
1. **Nothing ever fully stops.** Every "hold" carries ambient idle motion — a 1-2% breathing scale, slow drift, a shimmer. Never write "holds motionless"; write "settles into a gentle ambient idle." A frozen final second is the single biggest cheap-motion tell.
36-
2. **The camera is an actor.** Give each scene one continuous camera move — a 4-8% push-in, a slow orbit, parallax between layered planes — easing gently and never *decaying* to a dead stop at the end of a scene (compute the ease over a window slightly longer than the render). A deliberate mid-film rest is a different thing, and it is sanctioned: see [avoiding the slideshow](#avoiding-the-slideshow).
36+
2. **The camera is an actor.** Give each scene one continuous camera move — a 4-8% push-in, a slow orbit, parallax between layered planes — easing gently and never *decaying* to a dead stop at the end of a scene (compute the ease over a window slightly longer than the render). But the reason isn't that stillness looks cheap: a move is what carries the **spatial relationship** between two shots. A cut or a cross-fade throws that away, so two views of one system read as two unrelated pictures. Move to get somewhere and the audience infers one continuous space for free. Beware the corollary — translating the scene and translating the camera are the *same transform*, so "the content slid past a fixed frame" is not a static alternative, it is the same shot. A deliberate mid-film rest is a different thing, and it is sanctioned: see [avoiding the slideshow](#avoiding-the-slideshow).
3737
3. **Overlapping action.** No two elements share a start or end time. Entrances stagger at irregular offsets; the next element begins while the last is still settling. The mechanism is a ratio: **each offset should be clearly shorter than the animation it offsets** — a small offset-to-duration ratio reads fluid, a large one reads deliberate, and an offset longer than the animation stops being a stagger and becomes a queue. Delay the *supporting* elements, never the focal one; a focal element that waits reads as lag. And stagger what is **happening**, not what is merely **present**: things that arrive in sequence should animate in sequence, but a set of things that already existed before the shot started should appear together — staggering those just makes the scene take longer to assemble.
3838
4. **Compound properties only when they tell one story.** Every animation changes at least one property — position, scale, opacity, rotation. Combining them works when they say the same thing (a confirmation sliding up *and* fading in both read as "arriving") and confuses when they don't (a sheet that rises *and* rotates is two unrelated claims about one object). Pick the properties that serve the movement's job and drop the rest. Direction follows from the same logic: entrances ease **out** (fast in, gentle settle — the object arrives), exits ease **in** (gentle start, decisive departure), on-screen moves ease **in-out**, and impacts — a stamp, a slam — ease **in**, because an impact is an acceleration.
3939
5. **Overshoot and follow-through.** Overshoot is a claim about mass: a thing with weight passes its target and settles back, and the parts it drags — a shadow, a trailing panel, the housing it lands in — resolve a beat *after* it does, not with it. That one-frame lag is what sells the weight; perfectly synchronized "follow-through" is just a bigger single object. Apply it to **transforms only**. A number is not a physical object, so a counter must never fly past its value and fall back — that renders a figure that was never true, and on a real metric it's a lie with a frame count.
@@ -68,14 +68,18 @@ Each subject is chosen so the rule is *unavoidable* given the content: a live fe
6868

6969
❌ **Without**
7070

71-
> …an isometric deploy pipeline, `SOURCE → BUILD → TEST → DEPLOY → EDGE`, laid out left to right across a world 3.5 frame-widths wide, each stage a slab with a labelled card reading its status. A packet of work travels the wire stage to stage, lighting the wire behind it and igniting each stage as it arrives. Locked-off frame — no camera move.
71+
> …an isometric deploy pipeline of five stages, each with its own accent colour — `SOURCE` mint, `BUILD` cyan, `TEST` violet, `DEPLOY` amber, `EDGE` rose — bolted along a rail with support posts and numbered floor bays. The block at each stage and its card wear the same colour. **The camera never moves.** Stack all five stages on the same centred spot and cross-fade between them: the current card fades out as the next fades in already coloured, and the block beneath it changes to that colour. No wire and no work in transit. Nothing in the frame changes position at any point.
7272
7373
✅ **With**
7474

75-
> …an isometric deploy pipeline, `SOURCE → BUILD → TEST → DEPLOY → EDGE`, laid out left to right across a world 3.5 frame-widths wide, each stage a slab with a labelled card reading its status. A packet of work travels the wire stage to stage, lighting the wire behind it and igniting each stage as it arrives. One continuous camera follows the work for the whole 6s — 2.5 frame-widths of travel on `ease: none`, so it never settles for a single frame — with the background grid parallaxing at a fifth of that rate.
75+
> …an isometric deploy pipeline of five stages, each with its own accent colour — `SOURCE` mint, `BUILD` cyan, `TEST` violet, `DEPLOY` amber, `EDGE` rose — bolted along a rail with support posts and numbered floor bays. The block at each stage and its card wear the same colour. Lay the stages out where they really are, 640px apart across 2.5 frame widths, and **move the camera** across the whole run in one continuous linear pass, `ease: none`. The floor and rail travel with the camera 1:1 because they are the same space; distant structures track at a fifth. A packet of work runs the wire and ignites each stage in its colour as it reaches it, so a stage is revealed by arriving at it rather than by appearing.
7676
77-
<video controls muted loop playsinline preload="metadata" src="https://static.heygen.ai/hyperframes-oss/docs/images/prompting/motion-rule2-camera-actor.mp4" style={{ borderRadius: "0.5rem", marginTop: "0.75rem" }}></video>
78-
*Left `WITHOUT`, right `WITH` — the camera is not decoration here, it's the only way to see the subject. In the locked frame `SOURCE` is fully visible, `BUILD` is cut off at 47.6%, and `TEST`, `DEPLOY` and `EDGE` are 0% visible for the entire six seconds. Deleting those three stages and their wires from the composition entirely and re-rendering produced a left half identical on all 180 frames, max channel delta 0 — three fifths of the pipeline contribute literally nothing. The left half also goes completely static at 2.7s, once the work has left the visible region: a locked frame doesn't just crop the story, it strands you watching the part that already finished.*
77+
<video controls muted loop playsinline preload="metadata" src="https://static.heygen.ai/hyperframes-oss/docs/images/prompting/motion-rule2-camera-actor-v2.mp4" style={{ borderRadius: "0.5rem", marginTop: "0.75rem" }}></video>
78+
*Left `WITHOUT`, right `WITH` — same five stages, same colours, same six seconds. On the left the block never leaves the centre of frame: five stages, one place. On the right you travel to each one, and neighbours stay visible on the way, so the five read as five points along a single run.*
79+
80+
*The rule is usually stated as "give every scene a camera move," which undersells it. The real claim is about what a **cut throws away**. A move carries the spatial relationship between two shots; a cross-fade carries none, so the colour simply becomes a different colour where it stood. Watch the amber `DEPLOY` block still sitting behind frame-left as the camera settles on rose `EDGE` — that adjacency is information, and it does not survive a dissolve.*
81+
82+
*There is a trap in this one worth knowing: **translating the scene and translating the camera are the same transform.** Earlier versions of this demo had the locked half slide the content past a fixed frame, then step it, then freeze the backdrop behind it — and every one looked identical to the pan, because it was. Measured, 3% of pixels differed. Only refusing to move at all produces the 30–47% here. If your "static" comparison still moves the content, you have built the same shot twice.*
7983

8084
### Rule 3 — Overlapping action
8185

0 commit comments

Comments
 (0)