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.
page-transition
Expanding Rounded Menu Animation
In Playground, by Manoela Ilic
An expanding menu animation with a cover unreveal effect in the background.
Alternate Column Scroll Animation
In Playground, by Manoela Ilic
A grid layout with columns that scroll in opposite directions and a content preview animation.
Grid Zoom Layout
In Playground, by Manoela Ilic
A simple image grid layout where a small grid image zooms to become larger while a content view opens.
SVG Overlay and Infinite Menu Background Animation
In Playground, by Manoela Ilic
A little menu effect with an SVG overlay and an infinite background CSS animation.
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.
Menu and Thumbnail Stack Animation
In Playground, by Manoela Ilic
An animation on an image stack for a menu where the images get rearranged from a column into a row.
Layout with Reveal Animations and Content Preview
In Playground, by Manoela Ilic
Some experimental reveal animations on typographic elements as repeating pattern for a website design.
Inline to Menu Link Animation
In Playground, by Manoela Ilic
An experimental inline-to-menu-link animation based on a concept by Matthew Hall.
Magnetic 3D Grid Interaction with Content Preview
In Playground, by Manoela Ilic
A grid layout with a magnetic 3D interaction effect and a content preview animation.
Preview to Full Content Page Transition
In Playground, by Manoela Ilic
An experimental page transition concept for magazines and blogs where an excerpt item opens for a full page view.
Distributed Letters Animation Layout
In Playground, by Manoela Ilic
A distributed letters animation in the context of a triple panel layout with hover effect.
Circular SVG Text Animation
In Playground, by Manoela Ilic
Exploring some experimental circular SVG text effects for an intro animation.
Inline Menu Layout with Gallery Panel
In Playground, by Manoela Ilic
An inline menu layout with a playful hover animation and a gallery content preview panel.
WebGL Video Transitions with Curtains.js
In Playground, by Yuri Artiukh
Some experimental video transitions using Curtains.js and shaders.
Menu to Inner Page Animation with Image Grid Background
In Playground, by Manoela Ilic
A layout with a menu and background image grid that animates to an inner content page.
Thumbnail to Full Width Image Animation
In Playground, by Manoela Ilic
An experimental animation where an image goes from thumbnail to full width, allowing for a classy entry to an article view.
Making Stagger Reveal Animations for Text
In Tutorials, by Manoela Ilic
A short tutorial on how to recreate a letter stagger animation with GSAP and Splitting.js.
