3D Grid Effect
by Manoela Ilic
A proof-of-concept effect recreation of the animation seen in a prototype app by Marcus Eckert. The idea is to flip a grid item in 3D, expand it to fullscreen and re
+ more#grid
Google Grid Gallery
by Manoela Ilic
A responsive Masonry grid with a gallery view using 3D Transforms. Based on the gallery seen on the Chromebook Getting Started guide by Google.
+ more
Animations for Thumbnail Grids
by Manoela Ilic
There are many parts of a website where we can apply nice transitions to make things more interesting. Images are certainly great entities for playing with fancy eff
+ more
Loading Effects for Grid Items with CSS Animations
by Manoela Ilic
Some inspiration for loading effects of grid items using CSS animations.
+ more
Responsive Icon Grid
by Manoela Ilic
A responsive grid of anchors with icons, text and some example hover transitions.
+ more
View Mode Switch
by Manoela Ilic
A simple view mode switch that has two example layouts, a grid and a list.
+ more
Dynamic Grid with Transitions
by Manoela Ilic
A dynamic grid layout that let's you choose how many rows and columns of items are shown. Partly based on the visualization of Google Trends, except that you can ad
+ more
Product Grid Layout
by Manoela Ilic
A responsive product grid layout with some UI details for inspiration.
+ more
Responsive Full Width Grid
by Manoela Ilic
A responsive grid layout for multiple items in a row that fill all the available width.
+ more
App Showcase with Grid Overlay
by Manoela Ilic
A tutorial about creating a simple grid overlay with subtle transitions for an app showcase.
+ more
Thumbnail Grid with Expanding Preview
by Manoela Ilic
A tutorial on how to create a thumbnail grid with an expanding image preview similar to the effect seen on Google Images.
+ more
Creating Nestable Dynamic Grids
by Larry Botha
Learn how to create flexible and fluid grids which make nesting at arbitrary depths easy, while allowing full freedom for how the grid behaves in all viewports.
+ more
Three Script Updates
by Manoela Ilic
The animated responsive grid, the direction-aware hover effect and the swatchbook have all been updated and added to GitHub.
+ more
Adaptive Thumbnail Pile Effect with Automatic Grouping
An experimental jQuery plugin that will group thumbnails by a shared data-attribute into a pile. When clicking on the pile, the thumbnails that belong to that pile w
+ more
Gamma Gallery: A Responsive Image Gallery Experiment
by Manoela Ilic
Gamma Gallery is an experimental responsive image gallery that attempts to provide an adjustable responsive images approach taking its grid layout and the full slide
+ more
Animated Responsive Image Grid
by Manoela Ilic
A jQuery plugin for creating a responsive image grid that will switch images using different animations and timings. This can work nicely as a background or decorati
+ more
Direction-Aware Hover Effect with CSS3 and jQuery
by Manoela Ilic
How to create a direction-aware hover effect using CSS3 and jQuery. The idea is to slide in an overlay from the direction we are moving with the mouse.
+ more
Draggable Image Boxes Grid
by Manoela Ilic
Today we want to create a template with a fullscreen grid of images and content areas. The idea is to have a draggable grid that shows boxes of thumbnails and menu l
+ more