Adobe Illustrator → HTML5 Canvas. Free. | Hacker News Reader

Adobe Illustrator → HTML5 Canvas. Free.

visitmix.com

118 pointsjoeybaker20 comments

This seems like a proper opportunity for SVG, not Canvas, considering SVG is actually designed to represent vector graphics. I'm not sure about this, but I think Illustrator already includes SVG support.

From the site:

> The purpose of Ai->Canvas is to accelerate your HTML5 canvas development.

I can see this being useful for, for example, <canvas> game development where you don't want to code all the graphics by hand.

Canvas' drawImage() supports painting of SVG graphics.

Illustrator does support SVG, and Canvas supports vector drawing. It looks like Ai→Canvas is capable of outputting vectors when its necessary.

Showing off the benefits of HTML5 while requiring Silverlight to watch the videos? That was a bit odd.

hmm… I watched in Safari 5 (with clicktoflash installed) and saw the videos in raw HTML5 format.

Chrome here, was an html5 video tag for me as well.

thank you microsoft :)

Not only was it Microsoft, but all off demos are in IE9 beta. …and they work! :)

(FYI: the mac version of the plugin has been working just fine for me so far, but I was always under the impression that adobe plugins like this were cross-platform. Isn't it kinda odd that MS separated them out?)

Not so odd: They used the native archive format of each platform. The contents may very well be identical.

Does that rocket under Drawing remind anyone else of Adobe LiveMotion?

Dang, you're right.

It's interesting how it sticks the images in the DOM as hidden image elements. I've been working with canvas for the past year and I've never come across someone doing it that way before. Anyone know pros/cons over doing it that way versus loading an image using the Image object in JavaScript?

So this is a wild guess since I'm unable to look at the source but having the images loaded prior to rendering on canvas might provide a speed boost so less chance ofnwaiting for images to load, and maybe there is a caching advantage you get by also having images in DOM?

I'll dig into it tomorrow when I have a laptop to use.

Interesting idea. I made some quick tests and it reduced a 1MB Illustrator file to a 3kb html file.

Nice way to cross over from illustration to code. Though personally I prefer Opacity since it supports generating drawing code for Quartz, Cocoa, Cocoa Touch, as well as Canvas.

Would excanvas allow older versions of IE to use this?

There's no reason it shouldn't work in excanvas.

However if you add animation to it you'll have the usual excanvas problems (slower framerate over time)

This is great and comes in handy as we are attempting to do an interface in HTML5 with Canvas.

User interface? How do you handle keyboard navigation, focus tracking, assistive technology hooks?

Reply on news.ycombinator.com