Menu to Grid Layout Animation
In Playground, by Manoela Ilic
A simple layout animation where the thumbnails of a menu row animate to their position in a content preview grid.
102 posts tagged with
3D Perspective Glitch Hover Effect
In Playground, by Manoela Ilic
A fun hover effect that shows a pixelated image with a glitch animation inspired by the one seen on buōy’s website.
Fullscreen Scrolling Slideshow
In Playground, by Manoela Ilic
A fullscreen scroll-based slideshow with a content view powered by GreenSock’s Observer plugin.
Large Image to Content Page Transition
In Playground, by Manoela Ilic
A simple scroll effect and page transition inspired by Vitalii Burhonskyi’s Dribbble shot.
Tiny Grid Layout Animation
In Playground, by Manoela Ilic
A simple layout transition where a small grid animates to a larger view, using the Flip plugin from GreenSock.
How to Create a Cover Page Transition
In Tutorials, by Manoela Ilic
Today we are looking under the hood of a page transition based on Vitalii Burhonskyi’s Dribbble shot.
Make Way Grid Effect
In Playground, by Manoela Ilic
A little grid interaction effect where adjoining items make way to a selected one that expands.
How to Animate SVG Shapes on Scroll
In Tutorials, by Manoela Ilic
A short tutorial on how to animate SVG paths while smooth scrolling a page.
Scroll Animation Ideas for Image Grids
In Playground, by Manoela Ilic
Some ideas for animations on images in a grid when scrolling a page.
Image To Grid Transition
In Playground, by Manoela Ilic
A simple transition where a large image animates to its place in a grid.
Stack to Content Layout Transition
In Playground, by Manoela Ilic
An experimental layout transition where a stack of images animates to a gallery view, showing some more content.
On-Scroll Text Repetition Animation
In Playground, by Manoela Ilic
An on-scroll animation that shows repeated fragments of a big text as seen on the website of Dr. Dabber.
Lines to Content Layout Animation
In Playground, by Manoela Ilic
A simple layout switch example where we go from a typography row view with inline images to a large image preview with more content.
Expanding Rounded Menu Animation
In Playground, by Manoela Ilic
An expanding menu animation with a cover unreveal effect in the background.
Building a Scrollable and Draggable Timeline with GSAP
In Tutorials, by Michelle Barker
Learn how to build a scrollable and draggable horizontal timeline using GSAP’s ScrollTrigger and Draggable plugins.
Kinetic Typography Page Transition
In Playground, by Manoela Ilic
A concept for a kinetic typography based page transition where background letters come into the foreground and reveal a new content level.
Create an Abstract Image Slideshow with OGL, GLSL, and GSAP
In Tutorials, by Francesco Michelini
Learn how to create a WebGL-powered image slideshow animated using a single value.
Dynamic CSS Masks with Custom Properties and GSAP
In Tutorials, by Michelle Barker
Learn how to animate CSS masks based on the cursor position using GSAP and custom properties for a unique spotlight effect.
