Our Webmonkey friends have featured Opacity, a vector image manipulation tool that has a couple of features that are interesting for Web developers wanting to do HTML5-y things:

To use the new source code feature in Opacity, simply design your vector-based graphic or animation sequence and, once you’re happy with it, head to the Inspector menu where you can use what Opacity refers to as “Factories” to export your image in various formats. To get Canvas-based source code, chose Source Code for the format and Canvas (JavaScript) as the language.

We should note that there are other tools around that can do similar things with just an image file — such as Alistair MacDonald’s Burst engine, which can take SVG animations and convert them to JavaScript objects that are rendered inside of a <canvas> tag.
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.

Nice to see tools embracing the new technology. Of course, the devil is often in the details… specifically how good the code is (We all remember the old Frontpage days!) Inkscape is another example, that embraces SVG.