This infographic for Cisco was actually one of the most complex animated infographics I've done. There were several tricky components, which required a tricky blend of native SVG image-mask animations, TweenMax animations, and CSS animations, and SVG morphing techniques, all bound to the scroll position. Also, due to the complexity, I had to branch the responsive version into a separate instance, since the mobile animation effects were too far apart from the desktop version.
Also notice how in the circular animation it starts as a simple rotation, but breaks out and morphs into an interactive accordion menu. Crazy stuff.
Back to Top