When to use
- Structural transitions for tech, data, and editorial
- Tile mosaic feel
- 톤: tech, minimalist / editorial
- Recommended duration: 0.5–0.8초
Installation
npx hyperframes add transitions-grid
→ compositions/transitions-grid.html.
Wiring
<div data-composition-src="compositions/transitions-grid.html"
data-start="4.5" data-duration="0.7"
data-track-index="1"
data-width="1080" data-height="1350">
</div>
Parameters
- Grid size and stagger direction vary within the showcase
짝
- Good fit:
grid-pixelate-wipe(same aesthetic),sdf-iris - Avoid:
transitions-blur— structural vs organic conflict