# List stack press

List cards fly up from the bottom of the frame one by one to stack up, each landing squashing and rebounding the whole pile while a counter ticks up in sync.

- Category: ui-entrance · Tags: shotcraft, remotion, ui-entrance
- Spec: 960×540 @ 30 fps · 3.5s (16:9)
- License: Apache-2.0 · Tier: free
- JSON: https://gimgs.net/motion/list-stack-press.json
- Kind: remotion
- Source (TSX): https://gimgs.net/motion/list-stack-press/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/list-stack-press.html

## Params

_No params._

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

## Prompt

## When to use

For feed/radar/inbox shots that say "something new every day"; emphasizes a continuously accumulating asset list.

## Intention

"Stacking has weight": each new card landing presses the settled pile down and lets it rebound — the audience reads "this was genuinely accumulated" from the physical feedback. The counter ticking in sync locks in the sense of quantity.

## Duration & energy

- Duration: About 3s (18–88f)
- Energy: Medium

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

## 意图
"堆叠有重量"：每张新卡落上来，已落定的整摞被压下再弹回——观众从物理反馈里读出"这是实打实攒下来的东西"。计数器同步跳格把数量感钉死。

## 动效核心
- **预备拍（anticipation，借鉴迪士尼法则 2）**：首张升入前给一拍段落级预备——计数器先于首卡 4–6f 亮起归零/微缩 scale(0.96)→1，把视线引到堆叠区，再让首卡入画。只做段落级一次，不逐卡加
- 卡从画面下方升入，交替微倾斜收平，等距节拍逐张摞起
- 每张到场压下整摞 6px、8f 弹回（stackPress 脉冲——即法则 5 的 follow-through：新卡的动能传给整摞再缓冲耗散，这一笔就是"有重量"的来源）
- 落地后按拖拽层级依次收尾（法则 5）：卡体先停 → 整摞弹回 → 高亮条再长出（滞后 2–4f）——三者同帧发生读作贴图切换
- 收尾一道 glaze 扫光掠过整摞
- 屏幕空间 DigitRoll 计数器落一张滚一格；相机跟随堆叠向下

## 参数表
| 参数 | 典型值 | 调节手感 |
|------|--------|----------|
| 节拍 | CUES=[18,30,42,54,66]（12f 等距），每张飞 22f，bezier(0.45,0.05,0.25,1.12) 末端过冲 | 少量卡（5 张）可以等距；大批量入场才需要递加速（对照 deck-deal 的 R2） |
| 入场 | 从下方 600px 升入，交替 ±2° tilt 收平，scale 1.06→1 | 交替倾斜打破对称；同向倾斜读作复制粘贴 |
| 堆叠压感 | 后一张到场时整摞压下 6px、8f 弹回（脉冲 [cue,cue+4,cue+8]→[0,6,0]） | 这是"有重量"的关键一笔，砍掉后堆叠变成简单排版 |
| 阴影 | 空中 `0 32px 64px`、落定 `0 2px 8px` | 阴影随高度收敛，和 deck-deal/spotlight 同一套语言 |
| 联动高亮 | 落地后滞后 2–4f 于 72% 高度处长出 40% 宽强调色（模板片为琥珀）底色（7f 长 + 5f 淡）；最后一张离切点仅 ~12f 需压缩节拍 | 高亮是次级动作（法则 5/8）：在主动作（落地压弹）之后跟进，不与之同帧抢戏；末尾元素的节拍要按剩余帧预算压缩，不能照抄前面的 |
| glaze 扫光 | 420px 宽、rotate 14°、mixBlendMode overlay，帧 82→96 从 −700 扫到 2600 | 扫光全镜头只此一次、扫整摞不逐卡（Q4） |
| 计数器（digit-roll 手法） | 连续里程计位置 pos：每张卡落地让 pos 沿数字带 +1 格，单格 8f 滚定，bezier(0.25,0.8,0.25,1)；滚动量=pos·lineH 沿双份 0-9 带连续下滚 | 计数与落地不同步立刻穿帮；**单格滚动必须短于落卡间距（12f）且尾格在镜头收尾前滚定**——以 count 为 key 重挂重滚的写法每次都要从 0 滚 22f，12f 节拍下前一次永远滚不完、尾帧停在 4（PR #40 判例）；数字带双份拼接+overflow hidden+tabular-nums（不开 tabular 会横向抖） |
| 相机 | zoom 1.35→0.9 五键跟随堆叠向下 | 正视机位（见已知坑），相机只做纵向跟随 |

## 声音
每张落地不逐张配长音；计数落定钉 click-camera（模板片钉在 f648）、段落切入钉 transition-soft（f623）。若逐张配 pop 参照 S2 三招防机枪。

## 已知坑
- 堆叠/列表信息镜头必须正视（Q6）——全片倾斜化时本镜头曾被单独回滚回正视；风格化机位逐镜头验证，不全局套用
- 逐卡 glint 高亮扫过被否两次（Q4），高亮用静态强调色底色条即可，动感交给压弹
- 与 history-list-stack（document-typewriter-reveal 卡尾段）是同一动作词汇——全片同一手法只当一次主角（P4），两处并用时一处必须降为配角
- anticipation/拖拽层级参数借鉴自迪士尼 12 法则（pixel2motion skill 内置提炼版），非用户判例——是默认建议不是令；与判例冲突时判例优先
- 预备动作幅度必须过肉眼阈值（deck-deal 判例 2026-07-09：小幅度用户完全无感，放大 12 倍才通过）——渲染后自查"不逐帧能否看出蓄力"

## 参考实现
demos/ui-entrance/list-stack-press/ListStackPress.tsx（原 template/src/aifl/live/ScenePapers.tsx）

## Reference implementation (Remotion)

- demos/ui-entrance/list-stack-press/ListStackPress.tsx — https://raw.githubusercontent.com/Vincentwei1021/video-shotcraft/main/demos/ui-entrance/list-stack-press/ListStackPress.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/ui-entrance/list-stack-press/ListStackPress.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.