An Easier Canvas to Draw On
October 22, 2010 @ 9:20am
Updated — November 4, 2010 @ 9:45pm
by Jeff Byrnes
Spotted this one courtesy of Think Vitamin, it’s called Ai->Canvas, and it’s an Illustrator plug-in that exports to an HTML5 canvas element. Very cool stuff.
Basically, you make your shapes in AI, export using the plug-in, and the necessary code to draw your shapes is generated. You can even do animation with it, which is definitely very cool.
For those who haven’t yet read up on it, the canvas element is a JavaScript-based method for drawing vector-based images, which is exactly what Illustrator outputs. So the two are a natural match.
If you’d like to read up more on canvas, the best resource I’ve found so far is Mark Pilgrim’s chapter on canvas at Dive Into HTML5.
Let us know if you build anything cool using AI->Canvas!
Tags
Adobe Illustrator, canvas, code, HTML5, javascript, Web Development






