UI Distiller

REPORT.mdpatterns.json

• [01] Overscroll footer reveal scroll · motion · microinteraction At the scroll limit, further wheel deltas become pressure that lifts the whole page off a fixed footer, then drops it back on a different curve. Medium fidelity: high score 4.8 trigger: wheel at scroll limit Open demo → README
• [02] Push-and-cover page transition page-transition · navigation · motion The outgoing page is pushed upward while a panel in the destination's own colour rises over it; the swap happens under cover and the new page arrives from the same offset. Medium fidelity: high score 4.5 trigger: click Open demo → README
• [03] Section progress navigation navigation · scroll · motion A side nav generated from the page's own sections, each item carrying a progress line scrubbed across that section's range, anchored to the viewport centre. Medium fidelity: high score 4.4 trigger: scroll Open demo → README
• [04] Reversible line mask reveal typography · scroll · motion Per-line clip-path masks that open at the bottom for descenders, with an authored exit at 0.6x duration, different easing and reversed stagger. Medium fidelity: high score 4.2 trigger: scroll Open demo → README
• [05] Drag-spring 3D object 3d · webgl · scroll · motion Scroll scrubs a base rotation while dragging adds a clamped tilt integrated by a real spring; orthographic frustum rebuilt from container aspect. Hard fidelity: approximate score 4.2 trigger: drag + scroll needs network Open demo → README
• [06] Three-state spring cursor cursor · microinteraction · motion Three cursor heads sharing one lerped position, transformed from the viewport centre and crossfaded by delegated hover state. Easy fidelity: high score 4.0 trigger: pointer-move Open demo → README
• [07] Gated preloader loading · motion · microinteraction Three independent readiness gates converge on one exit; the looping mark always finishes its current cycle, and a session flag picks full or short intro. Medium fidelity: high score 3.7 trigger: page-load Open demo → README