Webflow build
A cinematic split-image reveal, built in Webflow
Webflow build: one image split into six frames that separate and reassemble, inspired by a movie trailer reveal.
Type: Webflow build · Built with: CSS grid, Webflow Interactions · Live demo: boxes-on-boxes-reveal.webflow.io
An experiment inspired by a movie trailer reveal. It ended up different from the original, and I think it’s better.
What it does
A portrait is broken into six frames that pull apart, shift and come back together, drawing the eye into the image.
How it’s built
- One image split across six frames on a CSS grid.
- An overlay layered on each frame.
- Scale, movement and opacity animations with precise timing for each piece.
Where it fits
Hero sections, team or founder introductions and feature reveals.
