1实现原理 · 为什么它能做到
总纲:把鼠标光标当成「可见的主角」来用——它从画外进入、把观众视线带到下一个兴趣点、用一次点击**造成**接下来发生的事,然后离场。
A deliberately oversized macOS-style pointer that travels the frame as a _visible protagonist_: it enters from off-screen, walks the viewer's eye to the next point of interest, clicks to cause the next thing that happens, and leaves.
为什么值得做:大光标是发布片里最便宜的高产出运动源——一个元素、纯 transform 的 tween,却同时解决「画面显得死」「形变/转场没有起因」「新场景切换时观众没被切出旧状态」三件事;并给出行之有效的判据「越大越好,真实尺寸在视频尺度上等于看不见」。
Big cursor movement is one of the cheapest high-yield motion sources in a launch video: one element, transform-only tweens, and it (1) brings the eye across the screen on scenes that would otherwise read as dead, (2) gives causal ignition to morphs/transitions ("the click did that"), and (3) segments the eye out of a stale state when kicking off a new scene or a complex animation sequence. Bigger is better — an actual-size cursor disappears at video scale.
尺寸与造型是硬约定:满幅场景 7cqw(1920 宽时≈134px),套在 mock 里 4.6–5.5cqw,绝不更小;形制固定一套 SVG 箭头,白体黑描边或黑体(#1c1c1c)白描边(1.4px),按场景对比度二选一,全片保持一致。
- **Full-frame scenes: `7cqw`** (≈134px at 1920). In-mock / small-frame variants: `4.6–5.5cqw`. Never smaller. - One SVG arrow geometry everywhere. Two proven fills — white body + black stroke, or black body (`#1c1c1c`) + white stroke (1.4px). Pick per scene contrast, keep it constant per film.
入场律:永远从画外进入(标准从下方 top:115–120%),一次减速滑行到首个目标,必须「感觉像进了房间」;绝不允许就位后淡入或遮罩揭示——那会被读成故障(作者标注为反复观察到的真实失败模式)。
The cursor **always enters from off-screen** (canonical: from below, `top:115–120%`) and travels to its first target in one decelerating glide. It must _feel like it entered the room_. Never opacity-fade it in at a resting position, never mask-reveal it — that reads as a glitch (a real, repeatedly observed failure mode).
命中点判据:热点是箭头**尖端**而非包围盒中心;尖端落在目标中心,且所有按压缩放都以尖端为支点(transformOrigin: '21% 14%')。点击 = 非对称压缩/回弹(1:2 比例读作真实点击)。
The hot-spot is the arrow TIP, not the box center. Land the **tip** on the target's center, and pivot all press scaling on the tip: `transformOrigin: '21% 14%'` (for the house arrow path in a 24-unit viewBox). Click = asymmetric compress/expand (1:2 ratio reads as a real tap):
点击必须点火下一拍:形变、打字流、窗口变换、定义场景的动画都不许「自己开始」——把光标停在触发点上,让点击在同一帧造成它(菜单级联 / 打字启动 / 窗口收缩 / logo 点火 / 播放态翻转)。
Never let a morph, typing run, window transform, or scene-defining animation simply _start_. Park the cursor on the trigger and let the click cause it, same-frame:
漂移与静止的边界:不归它管的 beat 里光标以 0.5–0.9s、power2.out 漂到一旁,绝不冻在动作正上方、绝不空闲抖动。
During long beats it doesn't own (typing, narration), the cursor **drifts aside** (0.5–0.9s, `power2.out`) — never sits frozen on top of the action, never wobbles idly.
退场律:两条被许可的退场都必须是物理的,绝不允许原地淡出——① 加速离开画面(就近边缘,power2.in,0.5–0.7s);② cut-the-curve 交接(硬切前最后 ~0.3s 开始加速朝下一场首个点击点,覆盖该路径前 1/3;下一 composition 用 gsap.set 摆在交接位姿后以 power2.out 续跑,速度匹配)——此时光标本身成为缝合接缝的载体元素。
2. **Cut-the-curve handoff**: in the final ~0.3s before a hard cut, the cursor starts accelerating (`power2.in`) toward the NEXT scene's first click point, covering the first ~1/3 of that path; the next composition `gsap.set`s the cursor at the handoff pose and continues with `power2.out` at matched velocity. The cursor itself becomes the carrier element that stitches the seam:
品牌母题光标是「权力招」但需门槛:当主体品牌有可识别的光标身份(协作工具的彩色多人箭头+名牌、创作套件的精准十字准星、独特的产品指针)时用那个光标替代 macOS 箭头——同样法则原样适用(超大尺度、物理出入场、尖端命中、点击点火),名牌变体作为一个刚体整体移动;但只有当母题真的可被指认时才用,没人认得的光标只是个怪箭头,应退回 macOS。
Reach for it only when the motif is genuinely referenceable; a cursor nobody recognizes is just a weird arrow — default back to macOS.
2核心能力
3外部依赖
| 类型 | 依赖 |
|---|---|
| package | 兄弟 skill 依赖(被指名配对):motion-doctrine(carrier / same-frame ignition 的上位法则)、cut-the-curve(退场交接技法)、cursor-click-ripple 与 press-release-spring(目标侧按压/涟漪) |
| package | 运行时库(片段运行于宿主 composition 的 GSAP 时间线;本 skill 不自带库) |
4风险提醒 风险提醒:绿色 · 放心使用
- 触发条件过宽,可能被滥用成「全场都在飞光标」 — description 把「场景显得死/旧」也列为加载条件,而技法本身没有「每片最多几次」的预算(不像 motion-doctrine 的 2–3 个转场预算)。密集使用会抢戏。
- 尺寸与支点是硬编码的房屋约定,跨品牌复用需重算 — 7cqw 与 transformOrigin '21% 14%' 都绑定「house arrow path 的 24-unit viewBox」;换成品牌母题光标时原文只要求「同样法则原样适用」,未给新的支点算法,需自行推导。
- 跨场景交接依赖下一场「首个点击点」在编译期已知 — 交接代码里 handoff 位姿是硬编码坐标(left 40.7% / top 63.7%);若下一场排版变动,速度匹配即失效——这条耦合没有自动检查。
- 规则是文档级约束,无 lint/gate 兜底 — 与 motion-doctrine 的 seam-gate 不同,这里没有可运行验证;不读文档的代理不会被拦,且「点击必须造成事情」这类语义约束无法被机器检查。
- prompt injection 面低但非零:技法依赖代理对画面语义的正确判断 — 「尖端落在目标中心」「点击点火下一拍」要求代理读出正确的目标中心与触发点;弱视觉模型下会点错位置或不点中,观感反而更差。
5第二遍独立确认
- [ok] 是否存在隐蔽的脚本或网络调用(green 档前提) — 全目录仅 SKILL.md;全文无 shebang、无 ```bash 块、无 curl/npx/node 调用;URL 与 process.env 零命中。文中出现的 `// scene A, last 0.3s …` 是给作品用的 GSAP 注释代码,不是本 skill 的执行入口。
- [ok] 第一遍抽取的数值参数是否逐条可回源 — 7cqw / 4.6–5.5cqw、0.4–0.92s + power3.out + immediateRender:false、transformOrigin '21% 14%'、1:2 压缩回弹(0.84/0.1s + 1/0.22s)、漂移 0.5–0.9s power2.out、退场 0.5–0.7s power2.in、交接 0.3s power2.in + 0.6s power2.out、drop-shadow(0 4px 6px rgba(0,0,0,.3))、z-index:20、pointer-events:none — 均在源文件逐字命中。
- [ok] 「品牌母题光标」是否被写成无门槛的鼓励(会误导为「随便换」) — 原文有明确门槛与退回条件(`Reach for it only when the motif is genuinely referenceable; a cursor nobody recognizes is just a weird arrow — default back to macOS.`),且强调同样法则原样适用,并给出门槛示例(Figma 式多人箭头+名牌、创作套件十字准星)。第一遍未夸大。
- [ok] 「点击点火」是否与目标侧反应混淆(第一遍的表述风险点) — 原文把两件事分开:光标的压缩/回弹 tween 在 t 起,目标的反应用**并行独立 tween**(按钮 scale 0.94 + 按压色/影,同 t 起);并明确 `Cursor-only taps (e.g. focusing a text input) get NO target reaction.` 本 JSON 已按此分别表述。
- [ok] 退场是否有「原地淡出」的例外(避免把规则写得比原文更绝对) — 原文 `Two sanctioned exits — both physical, **never an opacity fade in place**`,清单亦写 `exits physically (off-frame or cut-the-curve handoff) — no fade-in-place`。无例外,第一遍表述准确。
6结论
c81758bc876bab42…d2f0bc7f34