Overview
The card is a WebGL plane, not an image, so opening it is a deformation rather than a crossfade. An activation front runs from the top-left corner outwards, and wherever it has passed the vertices are displaced by a simplex noise field sampled at their own position, so the far corner is still resolving while the near one has already arrived. Amplitude and frequency are split per axis, letting the boil read as a wide horizontal swell or a fine vertical shiver, and the seed picks which region of the noise field the surge reads from. Press Escape or click again and the plane collapses back into the grid along the same path.
Highlights
- Refined, production-ready UI composition
- Organized, reusable Figma components
- Clean layout system you can adapt fast
