animation Archives | Page 7 of 9

Notification Styles Inspiration

By Mary Lou on July 23, 2014

Some simple ideas and effects for unobtrusive website notifications. A little script is employed for showcasing some styles and CSS animations are used for the effec

How to Create a Tiled Background Slideshow

By Mary Lou on June 11, 2014

A tutorial that shows how to recreate the four tiles slideshow effect seen on the website of Serge Thoroval. Using 3D transforms, transitions and animations, the aim

Recreating the “Design Samsung” Grid Loading Effect

By Mary Lou on May 15, 2014

A tutorial on how to achieve the grid loading effect seen on the "Design Samsung" site. The effect will show a colored element sliding in first and then sliding out

Freebie: Flat Style Squared Preloaders (GIF, AEP, PNG)

By PixelBuddha on April 25, 2014

A set of really nice and modern animated GIF preloaders by PixelBuddha. The colorful set comes with seven unique square style activity indicators in three sizes and

Page Loading Effects

By Mary Lou on April 23, 2014

A set of creative page loading effects that use SVG animations with Snap.svg. The idea is to show an overlay with a interesting shape animation while new content get

Inspiration for Item Transitions

By Mary Lou on March 18, 2014

Some inspiration and ideas for item transitions considering different scenarios and use cases, including a small component, a full-width image header and a product i

Tilted Content Slideshow

By Mary Lou on March 13, 2014

A tutorial on how to recreate the slideshow seen on the FWA landing page with 3D effects involving random animations.

SVG Drawing Animation

By Mary Lou on December 30, 2013

A little experiment that explores the usage of SVG line drawing animations to precede the appearance of graphics or website elements, simulating the loading of them.

SVG Icons FTW

By Oleg Solomka on November 27, 2013

Despite the growing popularity of SVG, its time around and excellent browser support, we have a lack of good vector icon approaches. It's time to fill this gap and u

Animated SVG Icons with Snap.svg

By Mary Lou on November 5, 2013

Using SVGs on websites is becoming more and more easy with great libraries like Snap.svg. Today we want to explore what we can do with it and animate some SVG icons

Animations for Thumbnail Grids

By Mary Lou on October 23, 2013

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

Animated Checkboxes and Radio Buttons with SVG

By Mary Lou on October 15, 2013

By animating an SVG path with JavaScript, we can do many fancy things. Today we want to show you some effects for checkboxes and radio buttons. The idea is to hide t

Animated Border Menus

By Mary Lou on September 30, 2013

A tutorial on how to create a off-canvas icon navigation with an animated border effect. The menu effect is inspired by CreativeDash's bounce menu for mobile apps.