Pattern guides are created in order to gain a perspective of the project’s parts and inner workings. This process helps developers arrive at an educated decision based on the project’s context. By working in this fashion authors can identify possible coding issues and collectively organize these shared principles across an interface. Read More →
Tag Archives : SVG July 2015
-
-
Transformicons
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 →
-
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 →
-
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 → -
SVG & CSS Grayscale Filter: Retina Bug
Way back in the time machine of dreams I was reworking my blog in CodePen, until I ported my work to a local machine. During that time on CodePen I was playing with CSS Filters as I was writing about them for the CSS-Tricks Almanac. Of course like the good little developer I am I decided to try a grayscale filter on my SVG logo and the following are the results as I began my cross-device testing. Read More →