Unlisted test route for motion, embed, and add-to-cart interaction experiments. Open with a country prefix, e.g. /au/test/animation-widgets. Sections are paginated (?page=2, 10 per page); add-to-cart / button interaction blocks start around page 13 (see footer pagination). The old /test/button-animations URL redirects to that page. Global cursor trail is disabled so the custom cursor demo is visible.
Single u_progress uniform tweened by GSAP 0→1 drives an expanding distortion ring (Codrops pattern). Click to fire.
Click anywhere — GSAP tweens a single u_progress uniform 0→1.
Per-cell luminance maps to one of 5 procedural glyphs in the fragment shader; no font atlas, no DOM characters.
Per-cell luminance → glyph bucket (space, dot, dash, plus, hash). Inline GLSL.
4×4 ordered dither over a pixelized still; slider scales the cell size. Two-color brand palette.
Raymarched 2D metaball field in a single fragment shader, with chrome streaks and pointer-tracking blob.
SDF metaballs in a single fragment shader — no model, no library.
Sine-wave + radial pull distortion crossfade in via u_progress on hover. Awwwards-flavored.
Hover — sine wave + radial pull crossfade in via u_progress.
Text rasterized to a 2D canvas → uploaded as a texture → fragment displacement around the pointer.
Headline → 2D canvas → texture → fragment displacement. Pointer-driven.
Vanilla WebGL noise field in polar coordinates around the cursor — ~50 lines of GLSL, no Three.
Polar-coord value-noise around the cursor — pure GLSL, ~50 lines, no Three.
The pattern Lenis automates: native scroll feeds a RAF-lerped target; one progress value drives any downstream animation.
progress
0.0%
Single source of truth — drives any animation downstream.
dy/dt sampled per scroll event drives a skewY transform with 85%-per-frame decay. Codrops classic; CSS-only.
Motion that guides attention
Without stealing it
Scroll velocity → CSS skew
Decays back to rest at ~85% per frame
Lenis pairs perfectly with this pattern
Try a fast flick, then settle
Reduced motion locks skew at 0
Same RAF you saw in the bridge above
Motion that guides attention
Without stealing it
Scroll velocity → CSS skew
Decays back to rest at ~85% per frame
Lenis pairs perfectly with this pattern
Try a fast flick, then settle
Reduced motion locks skew at 0
Same RAF you saw in the bridge above
Pure RAF AABB-circle physics (no Matter.js). Click to drop chips; gravity, restitution and pairwise impulses run inline.
Click anywhere to drop chips. Pure RAF AABB + impulse — no Matter.js.
