Arc reflow

A grid of nine tools goes from two columns to three. Instead of sliding straight, every item travels along its own arc — a quadratic path with the midpoint lifted 40px — and neighbours leave 40ms apart, so the reflow reads as a throw, not a re-layout.

What it is

Switch a grid from two columns to three and, rather than sliding in straight lines, each tile takes a small arc to its new place, one just after the other, like cards being dealt. The same reflow, but it reads as intentional instead of mechanical. A signature move for settings screens, tool palettes and app launchers where the layout changes on the user's command.

Full library — live sample, numbers, prompt and source — is for clients. I have the password

Seen in

@叨叨AI (Douyin) · 第 8 集「8 个高级交互提升 App 和小程序的质感差别」· 06 换列数走弧线 Arc Reflow