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.
+ morePlayground
The Playground features web experiments, concepts, and layouts that push the boundaries of traditional design and showcase the latest in animation techniques.
On-Scroll Shape Morph Animations
by Manoela Ilic
Scroll-driven shape morph animations with tilt interaction inspired by the effect seen on KPR.
+ more
Dynamic Tooltip Reveal Animations
by Manoela Ilic
A dynamic tooltip animation with various reveal effects, comprised of different amounts of fragments appearing.
+ more
Image Layer Animations with Clip-Path
by Manoela Ilic
Some ideas for speedy page transition animations with layered images using clip-path.
+ more
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.
+ more
Some Ideas for Fullscreen Image Slideshow Animations
by Manoela Ilic
A collection of ideas for slideshow animations on fullscreen images.
+ more
Grid Item Hover Effect
by Manoela Ilic
Three hover effects based on a grid design by Alena Orlova.
+ more
Connected Grid Layout Animation
by Manoela Ilic
Some ideas for simple on-scroll animations on “connected” grid layouts.
+ more
On-Scroll Column & Row Animations
by Manoela Ilic
Some inspiration for scroll-driven animations on column and row items.
+ more
On-Scroll Perspective Grid Animations
by Manoela Ilic
On-scroll animations for perspective image grids with different layouts.
+ more
Grid Flow Animation
by Manoela Ilic
A loading and navigation animation where thumbnails “flow” into a grid.
+ more
Scroll-Based Layout Animations
by Manoela Ilic
An exploration of different scroll based layout switch animations using GSAP’s ScrollTrigger and Flip.
+ more
Inspiration for Text Block Transitions
by Manoela Ilic
Some inspiration for transitioning text blocks with different word animations.
+ more
On-Scroll SVG Filter Effect
by Manoela Ilic
Combining GSAP’s Scroll Trigger and Flip with a SVG Filter, based on a demo by Fabio Ottaviani.
+ more
4 Exclusive Demos: Slideshows & Typographic Animations
by Manoela Ilic
Four distinct demos, from image slideshows to on-scroll typography and hover effects.
+ more
Gooey Cursor Effect
by Manoela Ilic
A fun gooey cursor background effect with SVG filters and CSS blend modes.
+ more
On-Scroll Pixelated Image Loading Effect
by Manoela Ilic
A recreation of the on-scroll pixelated image loading effect seen on Felicity Ingram’s website.
+ more
Ideas for Grid to Slideshow Switch Animations
by Manoela Ilic
Some ideas and inspiration for layout animations where we go from an irregular grid to a slideshow or alternative view.
+ more