
吐出排列讲功能
同一个元素连续变形成下一个元素,代替切镜,整段没有硬切。
上一段的元素直接成为下一段的主体,画面里始终只有一个形体在变,周围留空;形状、圆角、文字反白在同一帧发生,变形读成一次连续动作。
cubic-bezier(0.65,0,0.35,1)(power3.inOut);胶囊加厚、页面区块、缩成卡片和收尾胶囊 cubic-bezier(0.16,1,0.3,1)(expo.out);发送按压 back.out(1.7)#111111)同时插值宽、高、圆角:960×3 的横线、960×96 的胶囊(圆角 48)、920×88 的输入框(圆角 44)、1440×820 的窗口(圆角 18,填充 #f6f1e8),最后缩成 0.26 倍的画廊卡片并入其他 11 张;标题缩小成输入框里的占位文字,头像和按钮 0.3s 淡入(1.8s),页面区块上升 24px#ffffff → #e9e9e9)配黑色形体;全程只有一个主体;画廊缩略图用 11 种不同网站风格;收尾字标白字,放在 440×112 的黑色胶囊里用「形变接力(Morph Relay)」做一段无切镜的连续变形,整段 11 秒,背景近白色柔光。64px 黑色标题按词组上升。标题下展开一条黑色横线(960×3px,0.2s,power3.inOut,cubic-bezier(0.65,0,0.35,1))。横线用 expo.out(cubic-bezier(0.16,1,0.3,1))0.3s 加厚成 96px 的胶囊,标题晚一帧反白。胶囊再用 0.4s(power3.inOut)收窄成 88px 的输入框,标题缩成占位文字,头像和按钮淡入;2.4s 起打出提示词,4.2s 点发送,然后输入框用 0.75s(4.55–5.3s)长成 1440×820、圆角 18px 的浏览器窗口,填充翻成米色,页面区块从 5.0s 起各上升 24px(expo.out 0.5s,错开 0.04–0.06s)。线性慢推 3%,再把整个窗口缩成画廊卡片(scale 0.26,expo.out 0.8s),周围每隔 0.04s 带入另外 11 张卡片。最后开场那条线回来,加厚成黑色胶囊,字标出现在胶囊里。周围元素保持空白,全程只有一个形体在变。













