# Smear-frame afterimages

Afterimage smear — a card drags 4 crisp, countable clones while panning fast, merging into one on landing; an animated take on motion blur.

- Category: rhythm · Tags: shotcraft, remotion, rhythm, effects
- Spec: 1920×1080 @ 30 fps · 4.39s (16:9)
- License: Apache-2.0 · Tier: free
- JSON: https://gimgs.net/motion/smear-multiples.json
- Kind: remotion
- Source (TSX): https://gimgs.net/motion/smear-multiples/template.html
- Repo: https://github.com/Vincentwei1021/video-shotcraft
- Credits: video-shotcraft (Vincent Wei) — https://github.com/Vincentwei1021/video-shotcraft
- Page: https://gimgs.net/motion/smear-multiples.html

## Params

_No params._

Default params (base64url for `?p=`): `e30`

## Prompt

## When to use

For fast-moving elements when you want a "comic-strip sense of speed" rather than a "photographic blur"; pick either this or CameraMotionBlur, not both

## Intention

The library's standard answer for fast-motion speed is CameraMotionBlur (a photographic metaphor: shutter drag, continuous blur). This card gives a second answer, the anime smear-frame tradition: the afterimage is **discrete, crisp, and countable** — full copies. The viewer can count 4 cards and read it as "so fast it left clones" rather than "so fast it blurred." The two have completely different temperaments: blur is live-action-grade texture, smears are comic-grade fun; pick one per move — stacking both reads as a render error. Smears also have a practical edge: content inside the afterimages stays legible, good for scenes where "the thing that's moving is itself the information."

## Duration & energy

- Duration: Element-level technique (12f move + 8f converge-and-settle, riding on top of the move)
- Energy: Medium-high

## Shot recipe (original Chinese — timing, easing, parameter table, known pitfalls)

## 意图
快速位移的速度感库内标准答案是 CameraMotionBlur（摄影隐喻：快门拖影，
连续的糊）。本卡给第二个答案，动漫演出的 smear frame 传统：残像是
**离散、清晰、可数的**完整副本——观众能数出 4 张卡，读作"快到留下
分身"而非"快到糊掉"。两者气质完全不同：blur 是实拍级质感，分身是
漫画级趣味；同一次位移二选一，叠用读作渲染错误。分身式还有一个
实用优势：残像里内容仍可辨，适合"移动的东西本身是信息"的场景。

## 动效核心
- 位置写成纯函数 `posAt(f)`（如 12f inOut cubic 到过冲点 + 6f 回弹）；
  第 k 个分身直接求 `posAt(frame − k·2)`——同一条插值换帧号求值，
  天然帧独立可算（disney 延迟采样拖拽层级的同一模式；模式已沉为
  assets/lib/helpers/motion.ts velocityAt/lagged）
- 分身 opacity 0.45/0.30/0.18/0.09 递减，是完整元素副本（不拉伸不变形）
- 速度门限：`v = posAt(f) − posAt(f−1)`，v>25px/f 才渲染分身，
  用 [25,60] 线性渐入避免分身瞬间跳出——低速段无残像是"快才有分身"
  的语义完整性
- 落位合拢：cv∈[0,1]（3f），分身延迟乘 (1−cv) 收缩到 0 + opacity 压零
  ——分身们"追上"本体的一瞬即落位重音，配合 3% 过冲回弹

## 参数表
| 参数 | 典型值 | 调节手感 |
|------|--------|----------|
| 分身数/间隔 | 4 个 / 各差 2f | >5 个读作队伍；间隔 >3f 断成跳帧 |
| 移动速度 | ~900px/12f（峰值 ~100px/f） | 慢移动不配分身（门限管住）；快过 3f/程分身来不及被看见 |
| 合拢窗口 | 落位前 3f 内收干 | 分身残留到落位后读作重影故障 |
| 收尾 | 落位回弹后真静止 ≥20f | R1 |

## 已知坑
- demo 在灰阶/占位素材上调校通过——参数是调校起点非实战定稿，
  首次实战须以真实素材回验
- 与 CameraMotionBlur 同一次位移**互斥**；同片不同镜头可以各用（一次
  漫画式一次摄影式反而立体），但同类位移统一用一种（P4 一致性）
- 分身是"清晰完整副本"——加 blur、拉伸、变形都会滑向另一个手法
  （轴向拉伸在词汇表另案），保持可数是本卡的身份
- 深底浅卡对比度下分身层次才读得开；同色系底上 0.09 那档会消失，
  可减为 3 个分身重配 0.5/0.3/0.15

## 参考实现
demos/rhythm/smear-multiples/
（SmearMultiples.tsx）

## Reference implementation (Remotion)

- demos/rhythm/smear-multiples/SmearMultiples.tsx — https://raw.githubusercontent.com/Vincentwei1021/video-shotcraft/main/demos/rhythm/smear-multiples/SmearMultiples.tsx

The component imports shared fixtures from `demos/_fixtures` and helpers from `assets/lib` in the repo; SKILL.md there documents the render workflow.


## Flow

1. **Read the recipe**
   Prompt = when to use, intention, parameter table with typical values and how each one feels, known pitfalls. Treat values as calibrated starting points.
2. **Get the code** — tool: git
   `git clone https://github.com/Vincentwei1021/video-shotcraft && cd video-shotcraft && npm install`
3. **Register + render** — tool: remotion
   `npx remotion render <CompositionId> out.mp4   # component: demos/rhythm/smear-multiples/SmearMultiples.tsx`
4. **Or re-implement**
   Port the timing/easing from the recipe to HTML + WAAPI (gimgs motion contract) or any engine; keep the same segment windows and easing.

## Render

Clone https://github.com/Vincentwei1021/video-shotcraft (npm install). The component lives under demos/{category}/{name}/ and imports shared fixtures from demos/_fixtures and helpers from assets/lib. Copy it (with those imports) into a Remotion project, register a <Composition> with the template's width/height/fps/duration in Root.tsx, then `npx remotion render <CompositionId> out.mp4`. SKILL.md in the repo documents the full Claude Code / Codex workflow. The prompt below is the shot recipe (timing, easing, parameter table, pitfalls) — enough to re-implement the shot in HTML/WAAPI or another engine if you prefer.

## Contract

React/Remotion composition (TSX) from the open-source video-shotcraft library (Apache-2.0). It is not a browser-playable template: clone the repo, register the component in a Remotion project and render with `npx remotion render`. The recipe (prompt) describes timing, easing and parameters so you can also re-implement the shot in any engine.