Turn Your Vector Art Into Canvas-based Animations With Opacity
The latest version of Opacity, a vector graphics editor for Mac OS X, is able to export animations to code that can be pasted into web pages and played back in any browser that supports HTML5.
We’ve written quite a bit about HTML5 and the power of its proposed <canvas> tag. While the spec isn’t quite finished, the Canvas element in HTML5 promises to eventually give web developers a way to display complex 3-D graphic animations in the browser without plug-ins. Right now, the dominant technologies for doing so are proprietary players like Flash and Silverlight.
There is, however, a trade-off. Canvas-based animations must be written in pure code, and most easy-to-use graphics creation applications like Adobe Flash can’t export the browser-ready animation code, which is complex. Such a limitation is going to put off some of the most talented graphic designers and animators, many of whom are not trained programmers.
That’s why we were excited to hear that Opacity’s new capability to save animated vector shapes and their paths as browser-native code.
Opacity is a bit like Adobe Illustrator, but considerably simpler and easier to use. And with its new export feature, Opacity has a clear leg up on Illustrator when it comes to supporting the next generation of web graphics.
Opacity is a Mac OS X application and costs $90 — not cheap, but cheaper than than Adobe Illustrator. There’s also a lighter version known as Opacity Express, which still has the code export option, but lacks some other features and retails for $40.