As of lately, my interests in terms of Web development have gone from a devotion to responsive design techniques to the appreciation of finely, well-made animations and interactions. Today I’d like to share a project called “Transformicons” that’s inspired by the work of Bennett Feely and Sara Soueidan. Read More →
Tag Archives : Animation February 2015
-
-
Animated Polygon Art
Recently, I began writing my series for Tuts+ discussing in-depth how to use and understand TimelineMax by GreenSock. The results of my studies and research has thrusted me from a CSS animation lover to someone that appreciates the fine control achieved with the GreenSock Animation Platform (GSAP). Let’s examine the benefits of this control using a couple of amazing pieces of artwork presented as SVG. Read More →
-
How to ScrollMagic
ScrollMagic is a complete rewrite of its predecessor Superscrollorama by John Polacek.
Like Superscrollorama it relies on the Greensock Animation Platform (GSAP) to build animations, but was developed with specific regard to former shortcomings. Read More → -
TimelineMax Stagger Animation
If you love animation and interactivity then I’m sure you’ve probably seen or heard of the GreenSock Animation Platform library commonly referred to as gsap. For those unfamiliar, the GreenSock Animation Platform is a suite of tools for scripted animation. We’ll look specifically at TimelineMax and a method called
staggerTo(). Read More → -
Orbit Button Glow
Maybe you’ve seen this type of interaction already if you’ve taken a glance at Polymer’s paper components. The idea is that when a click event is triggered an orb like glow appears and then vanishes at the end of the event. It’s a nice and subtle way to provide user feedback when they interact with an element on your page, but also doesn’t break layout if it sits next to other items. We achieve the effect through the use of keyframe animations, class toggling with JavaScript and using the
animationendlistener made available via JavaScript. Read More →