Con el ascenso del HTML5, ahora podemos hacer cosas que hace unos años eran un sueño. Una de estas cosas es la posibilidad de dibujar imágenes directamente en el navegador, lo cual es posible con la API Canvas. La cual es fácil de entender, pero algo laboriosa de poner en práctica.
Afortunadamente, en este artículo vamos a comentar una muy buena solución: Ai->Canvas es un útil plugin de Adobe Illustrator que nos permite convertir cualquier vector (creado o importado) o bitmap en un dibujo canvas válido de HTML5.
Ai->Canvas te provee herramientas para dibujar, animar y programar eventos que te permiten construir aplicaciones web en canvas interactivamente.
Instalar Ai->Canvas
Para empezar a usar Ai->Canvas necesitas descargar una versión para Windows u OS X y extraer el archivo del plugin a la carpeta de plugins de Adobe Illustrator.
Por defecto, la instalación de Adobe Illustrator CS5 se encuentra en C:\Program Files\Adobe\Adobe Illustrator CS5\Plug-ins. En Mac, deberíamos tenerlas en /Applications/Adobe Illustrator CS5/Plug-ins.
Una vez que el plug-in esta instalado necesitaras reiniciar Illustrator (si ya esta corriendo). Ahora ya deberíamos ser capaces de utilizar el plug-in, para ello vamos al menú Archivo, seleccionamos Exportar y veremos la opción "canvas (*.html)" dentro de Guardar. Y listo, esto es todo lo que necesitamos hacer para convertir nuestra ilustración de Illustrator en una de HTML5.
Lo dicho hasta ahora es válido para usarios de Illustrator CS3, CS4 y CS5. Pero, si tienes la última versión del programa, debes darle una mirada a lo que Mike Swanson explica en su blog.