Ai>Canvas — новый плагин для Adobe Illustrator

Для популярного приложения Adobe Illustrator вышел новый инструмент, позволяющий разработчикам превратить свои векторные рисунки и анимацию в HTML5 код. Новый плагин недвусмысленно называется Ai>Canvas.

Предполагается, что ты можешь взять любой векторный рисунок, сделанный в Adobe Illustrator, и представить его в виде 2D графики, которую можно поместить на веб-страницу при помощи элемента HTML5 Canvas, включая анимированные изображения.

Плагин может обрабатывать градиенты, прозрачности, сложные узоры, тени и текст. В случае, если рисунок содержит элементы, не поддерживаемые Canvas, то плагин преобразовывает проблемные фрагменты в растровое изображение и располагает в нужной позиции.

Ai>Canvas также способен анимировать рисунок: можно добавить вращение, масштабирование объекта, исчезание и перемещение. Все параметры определяются в Illustrator, но при экспорте изображения в HTML5 код ты можешь изменять полученный код для более точной настройки эффектов анимации. Также возможно добавление музыки и привязки отслеживания события мыши.

Плагин работает в Illustrator в версиях 5, 4 и 3. Сразу выпущены версии для Windows и Mac OS X.

Как ни странно, Ai>Canvas разработан не самим Adobe, а группой Mix Labs от Microsoft. Microsoft проявляет все большую заинтересованность в открытыми веб-стандартами с тех пор, как начались работы по внедрению поддержки HTML5 и других передовых веб-технологий в Internet Explorer. А один из создателей плагина — Майк Свонсон (Mike Swanson), девелопер из Microsoft — является также автором плагина XAML для Illustrator — плагин позволяет получать картинки из Illustrator в WPF или Silverlight и, хотя он может работать с довольно сложными иллюстрациями, используется в основном для преобразования иконок и отдельных элементов интерфейса пользователя. Майк заинтересовался возможностями HTML5 Canvas после увлекательных бесед об этой технологии со своим коллегой Томасом Льюисом (Thomas Lewis) и вот теперь радует нас своим творчеством.

Про Adobe тоже невозможно сказать, что они сидят без дела — недавно был выпущен Adobe ® Illustrator ® CS5 HTML5 Pack, который экспортирует рисунки в SVG-формат и, по мнение разработчиков, оказывает «фантастическую поддержку этому формату». Просто HTML5 Canvas сейчас имеет более широкую поддержку в браузерах и предоставляет возможности, недоступные для формата SVG и актуальные для разработчиков браузерных игр и прочих анимационных красот. В своем блоге Майк Свонсон приглашает поделится мыслями по поводу плагина, чтобы знать над чем работать в следующей версии, и оценить тестовые файлы, иллюстрирующие его возможности.

Материалы

• Ai>Canvas
• Export Adobe Illustrator Drawings and Animations to HTML5