On-Scroll Expanding Image Animation within Typography
by Manoela Ilic
An animation experiment where we expand an image within some typographic element on scroll.
Playground
The Playground features web experiments, concepts, and layouts that push the boundaries of traditional design and showcase the latest in animation techniques.
Grid Item Reveal Animation on Hover
by Manoela Ilic
A recreation of the grid item reveal animation on hover as seen on the website of Metalab.
Reflection Scroll Effect
by Manoela Ilic
A decorative reflection effect where we simulate a reflected page and scroll it along with the content.
On-Scroll Revealing WebGL Images
by Yuri Artiukh
An exploration of on-scroll reveal effects for images in WebGL, using React Three Fiber.
On-Scroll Animation Ideas for Sticky Sections
by Manoela Ilic
Some ideas of how sticky sections can be animated while exiting the viewport.
Experimental CSS-Only Carousels with Scroll-Driven Animations
Three carousel experiments made with CSS scroll-driven animations, based on Francesco Zagami’s designs.
Experimental On-Scroll Text Animations with SVG Clip-Path
by Manoela Ilic
Some experiments with on-scroll typography effects using SVG clip-paths.
On-Scroll Sliced Text Animation
by Manoela Ilic
A scroll-triggered sliced text animation, where segmented elements reunite while scrolling.
3D Glass Portal Card Effect with React Three Fiber and Gaussian Splatting
by Yuri Artiukh
Explore the creation of a 3D glass portal with React Three Fiber, with optimized rendering using Gaussian Splatting and integrating real-world objects.
On-Scroll Shape Morph Animations
by Manoela Ilic
Scroll-driven shape morph animations with tilt interaction inspired by the effect seen on KPR.
Dynamic Tooltip Reveal Animations
by Manoela Ilic
A dynamic tooltip animation with various reveal effects, comprised of different amounts of fragments appearing.
Image Layer Animations with Clip-Path
by Manoela Ilic
Some ideas for speedy page transition animations with layered images using clip-path.
Ideas for Image Motion Trail Animations
by Manoela Ilic
Some ideas for mouse/touch responsive animations where images are shown along the path of the user motion.
Some Ideas for Fullscreen Image Slideshow Animations
by Manoela Ilic
A collection of ideas for slideshow animations on fullscreen images.
Connected Grid Layout Animation
by Manoela Ilic
Some ideas for simple on-scroll animations on “connected” grid layouts.
On-Scroll Column & Row Animations
by Manoela Ilic
Some inspiration for scroll-driven animations on column and row items.
