Posts Tagged ‘snap’

Saturday, November 2nd, 2013

Could this be the library that makes SVG the vector replacement for Flash? Snap.svg being based on the SVG standard makes it a better fit for mobile and smaller computing.

Snap.svg is like Raphaël, and actually made by the same author Dmitry Baranovskiy. This library is sponsored by Adobe so this not only looks great as a library, but has the right support. Snap.svg is a very usable way to get vector graphics more accessible to creative iteration and into more content on mobile. It also makes working with SVG very simple over the verboseness of the declarative svg tags.

Silverlight and other xml based declarative markup vector/graphics libraries are nice for interop but it also causes problems with support across many browsers, exporters, etc. It is getting easier and there needs to be a way to get vector based content animating on mobile devices in browsers. d3.js, another awesome svg library,  has made it easy to combine data and svg/vector based beautiful charts, maps and more.  But Snap.svg has the library that looks more friendly to Flash type architecture and libraries combined with the simplicity of jquery like javascript selectors and control. The binary nature of Flash content can’t compare on the standard front so having Adobe interested in sponsoring a vector library that is standard is great. In the end neither Silverlight or Flash won but a combined vector and declarative vector framework in SVG has found new life with mobile and it appears a new contender in vector animation and interactive content.

Adobe, along with CreateJS and Cordova/PhoneGap has really been moving in good directions with sponsoring libraries and open source toolkits for mobile content creators.

Snap.svg makes it easier to use SVG and you can animate it.

Another unique feature of Snap is its ability to work with existing SVG. That means your SVG content does not have to be generated with Snap for you to be able to use Snap to work with it (think “jQuery or Zepto for SVG”). That means you create SVG content in tools like Illustrator, Inkscape, or Sketch then animate or otherwise manipulate it using Snap. You can even work with strings of SVG (for example, SVG files loaded via Ajax) without having to actually render it first which means you can do things like query specific shapes out of an SVG file, essentially turning it into a resource container or sprite sheet.

Finally, Snap supports animation. By providing a simple and intuitive JavaScript API for animation, Snap can help make your SVG content more interactive and engaging.