Wavy Infinite Carousel
Three curved columns of work that ripple and flex as you scroll.
The Wavy Infinite Carousel turns a project archive into moving fabric. Three columns of photography arc gently across the screen, and the moment the visitor scrolls, every image flexes in the direction of travel, the centre column flowing against the outer two. Let go and the columns settle back into their calm curve.
How it works
Every image is a small WebGL surface arranged into three vertical columns. Scrolling feeds the page's velocity into a shader that bows each image in the direction of travel, so the pictures bend like paper being pushed, while a gentle cosine curve arcs each whole column across the screen. When an image leaves one end of its column it rejoins at the other, so the archive streams forever in both directions, with the centre column running against its neighbours.
When to use it
Built here for a London architecture practice, it suits any studio whose archive is deep and vertical: architects, interior photographers, fashion editorials, galleries. It wants at least a dozen strong portrait images, and it works best as a full screen archive page rather than a strip inside a longer layout.
Why it works
The flex is what separates it from every static grid. Because the images physically respond to the visitor's scrolling, browsing feels like touching the archive rather than reading it, and people scroll longer just to feel the page push back. The endless wrap means nobody ever hits a dead end, so the tour of the work never gets a chance to stop.
Recommended for
- Architecture and interiors
- Photography archives
- Fashion editorials
- Galleries and exhibitions
Common questions
What makes the images bend while scrolling?
Each image is rendered in WebGL, and the scroll speed is passed into its shader. The faster the visitor scrolls, the more each surface flexes, then it relaxes flat as the page settles.
Does the carousel ever reach an end?
No. Images that scroll out of one end of a column rejoin at the other, so the stream is endless in both directions and there is never an empty frame.
Is this based on open source work?
Yes. It builds on an MIT licensed Codrops tutorial about wavy infinite carousels, adapted into a complete page. Using and adapting it commercially is exactly what that licence permits.