反馈与交互 · 点一下的回应
冲击波Shockwave
- 一圈扩出去
- 有冲击力
- 不带粒子
一个空心圆从落点迅速扩大，圆环在扩大的同时变细、变淡，最后消失。它和涟漪的差别在速度与比例：涟漪是慢的、几乎不动的，冲击波是快的、要占到画面很大一块 —— 快和大加起来才是「冲击」。
什么时候用它
用在有分量的落点上 —— 一次确认、一次打赏、一次「发送」。它天生很吵，所以别放在高频操作上，也别和粒子迸发同时用：两个都在抢「最响的那一下」。
参数
on impact · transform: scale 0.2→1.5 · border-width 3→0.5px · opacity 0.85→0 · 620ms ease-out
配方
冲击波 → on impact · transform: scale 0.2→1.5 · border-width 3→0.5px · opacity 0.85→0 · 620ms ease-out
给 AI 的一句话
做一圈冲击波：在落点放一个空心圆，transform 从 scale(0.2) 扩到 scale(1.5)，同时描边从 3px 收到 0.5px、opacity 从 0.85 降到 0，整段 620ms 用 ease-out。只动 transform 和 opacity；描边变细可以用 border-width，但要放在不影响布局的伪元素上。