# Speed ramp and freeze-annotate

Two frame-remap pacing moves — speed-ramp (fast → 0.2x gaze → fast) and freeze-annotate (flowing → freeze with a circled callout → unfreeze).

- Category: rhythm · Tags: shotcraft, remotion, rhythm
- Spec: 1920×1080 @ 30 fps · 4.54s (16:9)
- License: Apache-2.0 · Tier: free
- JSON: https://gimgs.net/motion/speed-ramp-freeze.json
- Kind: remotion
- Source (TSX): https://gimgs.net/motion/speed-ramp-freeze/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/speed-ramp-freeze.html

## Params

_No params._

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

## Prompt

## When to use

For slowing/stopping on one highlight in a card stream or long pan; use freeze-annotate in tutorial/explainer contexts

## Intention

A constant-speed stream reads as a slideshow (R2); an all-fast stream leaves viewers unable to catch the highlight (R3). Speed-ramp creates a "sprint–gaze–sprint" inside one motion; freeze-annotate goes further — it simply stops, marker-circles the highlight, then moves on. Both share the same technical root (frame-number remap) but differ in meaning: speed-ramp is "a second glance while passing by," freeze is "stopping class to underline the point."

## Duration & energy

- Duration: Speed-ramp: 4–5s total (slow window ≥40f); freeze-annotate: 4–5s total (freeze hold ≥45f)
- Energy: Medium-high (the speed contrast itself is the energy beat)

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

## 意图
匀速流读作 PPT（R2），全程快流观众抓不住重点（R3）。变速在一条
运动里制造"冲刺-凝视-冲刺"；定格标注更进一步——干脆停下来，
马克笔圈出重点再走。两款同一技术根（帧号 remap），语义不同：
变速是"路过时多看一眼"，定格是"停课划重点"。

## 动效核心
- 源动画匀速，输出帧对源帧做非线性 remap：
  `src = interpolate(frame, [0,40,85,135], [0,88,97,207])`（斜率即速率）
- 变速款：快段斜率 ≥2、慢窗斜率 ≈0.2（≥10 倍反差才可感）；
  **blur 联动速率开关**——快段包 CameraMotionBlur、慢窗裸渲，
  "快糊-慢清"反差是手法成立的一半
- 定格款：定格段斜率 =0（瞬时切换，无缓入——定格要干脆）；
  定格期强调色马克笔 SVG 椭圆 8f 描边（stroke-dashoffset）圈住目标 +
  箭头 6f 点题，feTurbulence（scale≈7）给手绘抖动；解冻段斜率 >1
  补偿时长，圈注 8f 淡出
- 目标卡用高清纹理并对位屏中（凝视/圈注对象必须锐利、居中）

## 参数表
| 参数 | 典型值 | 调节手感 |
|------|--------|----------|
| 慢窗/定格时长 | ≥40f / ≥45f | 短了凝视不成立（R3 宁慢勿快） |
| 快慢斜率反差 | ≥10 倍 | 反差不足读不出"慢下来了" |
| 圈注描边 | 8f 划完 + 抖动 scale 7 | 太慢像加载动画；无抖动像机械标注 |

## 已知坑
- 变速段 SFX 钉帧跟**输出帧**不跟源帧（画面动作在输出时间轴上发生）；
  拟音槽位：定格款配马克笔沙沙声（S4），本卡转正时未配、实战补
- 定格标注一支 30s 片 ≤2 次（同 D 式克制原则）
- 参数经占位素材调校转正，非实战定稿，首次实战后回验

## 参考实现
demos/rhythm/speed-ramp-freeze/
（FreezeAnnotateReal.tsx / SpeedRampReal.tsx）

## Reference implementation (Remotion)

- demos/rhythm/speed-ramp-freeze/FreezeAnnotateReal.tsx — https://raw.githubusercontent.com/Vincentwei1021/video-shotcraft/main/demos/rhythm/speed-ramp-freeze/FreezeAnnotateReal.tsx
- demos/rhythm/speed-ramp-freeze/SpeedRampReal.tsx — https://raw.githubusercontent.com/Vincentwei1021/video-shotcraft/main/demos/rhythm/speed-ramp-freeze/SpeedRampReal.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/speed-ramp-freeze/FreezeAnnotateReal.tsx, demos/rhythm/speed-ramp-freeze/SpeedRampReal.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.