# Gauge readout moves

Two gauge-readout styles: needle-sweep-selftest, a full-arc self-test sweep before settling to the true value, and tape-scroll-fixed-pointer, a fixed pointer with a scrolling tape that sprints then brakes.

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

## Params

_No params._

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

## Prompt

## When to use

For a dashboard opening ritual / performance-metric reveal; use A for a multi-gauge power-on feel, B for a single metric's big jump.

## Intention

Turn "reporting a value" into a gauge's physical action: A is a car's ignition self-test — the needle first sweeps across the full arc (270°) then settles back to the real value, multiple gauges staggered into a wave, showing the range before the number, a launch-declaration feel; B follows an airspeed-tape grammar — the needle/viewport stays pinned dead center while the ruled tape scrolls past underneath; on a big jump the tape sprints at 45px/f then brakes with a spring, overshooting and rocking back — "the world moves, the needle doesn't", turning the size of a number into a visible distance traveled. Division of labor with odometer-digit-roll: that one rolls digits inside a window, B is the whole ruled scale line panning.

## Duration & energy

- Duration: A: 4–5s / B: 4–5s
- Energy: Medium-high (mechanical-ritual type)

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

## 意图
把"报数值"做成仪表的身体动作：A 是汽车点火自检——表盘指针先"唰"地
甩满全弧（270°）再回落定格真实值，多表错峰成波浪，先亮量程再报数，
开场宣誓感；B 是飞机空速带语法——指针/取景窗钉死画面正中，带刻度的
标尺整体从底下滚过，大数值跳变时刻度带 45px/f 冲刺、末尾 spring 刹车
带回摆过冲，"世界动、针不动"，数值大小变成看得见的位移距离。
与 odometer-digit-roll 分工：那是数字在窗里滚，B 是连刻度格线全在平移。

## 两式选型
| 式 | 做法 | 适用 |
|----|------|------|
| A needle-sweep-selftest | 指针去程 ~12f ease-out 甩满弧，回程 ~20f 带 5–8° 过冲回摆落真值；多表错峰 3–5f；落定同帧盘下数值弹出 | dashboard 开场/系统就绪仪式 |
| B tape-scroll-fixed-pointer | 长刻度带 translate：慢爬段→45px/f 冲刺 ~25f→spring 刹车过冲回摆停位；窗内读数同步刷新 | 单指标大跳变（性能翻倍/配额提升） |

## 参数表
| 参数 | 典型值 | 调节手感 |
|------|--------|----------|
| A 甩弧幅度 | 满量程 270° | 只甩到真值=没有自检仪式感；满弧再回落才是"先亮量程" |
| A 过冲 | 回落带 5–8° 回摆 | 无过冲读作电子表；过冲=机械指针的质量 |
| A 错峰 | 3–5f/表 | 齐甩读作复制粘贴；错峰成波浪 |
| B 冲刺速度 | 45px/f（大跳变段） | 慢了读作匀速爬升，"世界动"不成立 |
| B 刹车 | spring 过冲（冲过头再弹回停位） | 词汇原案的回摆是"哐"的来源，直停可惜 |
| 真静止 | 停位后 ≥30f 全锁死 | 指针类最忌尾漂 |

## 已知坑
- demo 在灰阶/占位素材上调校通过——参数是调校起点非实战定稿，
  首次实战须以真实素材回验
- 同批 ring-close-overfill（合环过盈）改改再看无附言——环形进度类
  待重做，别急着当第三式并入
- A 的表盘是自绘 SVG（弧刻度+指针），实战贴真 dashboard 时优先找
  页面里现成的 gauge 组件特写，没有再造
- 声音：A 甩针一声"唰"+落定"嗒"（多表错峰各一声）；B 冲刺段
  低频滚动声、刹车一声闷"哐"

## 参考实现
demos/data/gauge-readout-moves/
（NeedleSweepSelftest.tsx / TapeScrollFixedPointer.tsx）

## Reference implementation (Remotion)

- demos/data/gauge-readout-moves/NeedleSweepSelftest.tsx — https://raw.githubusercontent.com/Vincentwei1021/video-shotcraft/main/demos/data/gauge-readout-moves/NeedleSweepSelftest.tsx
- demos/data/gauge-readout-moves/TapeScrollFixedPointer.tsx — https://raw.githubusercontent.com/Vincentwei1021/video-shotcraft/main/demos/data/gauge-readout-moves/TapeScrollFixedPointer.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/data/gauge-readout-moves/NeedleSweepSelftest.tsx, demos/data/gauge-readout-moves/TapeScrollFixedPointer.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.