Adobe adds HTML5 controls to Illustrator

A new expansion pack to Adobe Illustrator allows designers to build one interface for multiple Web and print platforms

Adobe Systems has released an add-on package for its Illustrator CS5 design editor that will allow developers to export their designs to the Web and mobile platforms, using the emerging HTML5 set of Web formats.

With these capabilities, designers can build out a visual display once and export it to multiple platforms, such as Web pages, smartphones and tablets, as well as for print media, said Adobe senior product manager David Macy.

The pack can render designs using CSS (Cascading Style Sheets) version 3 as well as the HTML5 Canvas element and the SVG (Scalable Vector Graphics) XML image format.

Adobe's HTML5 pack shows that the company, even as it continues to position its own Flash format as a way to bring rich functionality to the Web, is also acknowledging the potential ubiquity of HTML5. Apple, for instance, declined to support Flash on its own consumer electronics, in favor of HTML5 (although it recently recanted somewhat by allowing the use of cross-platform compilers to rebuild Flash files into device-native code).

By using CSS, designers can export a page they created in Illustrator to a Web page. CSS can capture many, though not all of the capabilities of Illustrator, so designers may have to jump back and forth between a Web rendition of their creation and the original, Macy admitted.

Nonetheless, this feature could dramatically cut the time it takes to design a product for multiple platforms, he said.

By using SVG and the Canvas elements, designers can add data and interactive elements to their images, Macy said. For instance, someone could build a stylish calendar template and have the different dates of each month populate the calendar at the appropriate locations, depending on the month.

With SVG, users can "zoom into" an image for greater detail, Macy said. The designer can also make each pixel "reactive," meaning that a workflow could be triggered if the user clicks on the pixel.

Using this approach, Macy demonstrated a Web page that allows the user to pick the background color and logo color of a T-shirt. When the user clicks on a color from the color chart below an illustration of the shirt, the page re-renders the shirt in that color.

In order to deploy the HTML5 pack, users must have version 15.0.1 of Adobe Illustrator CS.

Joab Jackson covers enterprise software and general technology breaking news for The IDG News Service. Follow Joab on Twitter at @Joab_Jackson. Joab's e-mail address is Joab_Jackson@idg.com

Join the newsletter!

Or

Sign up to gain exclusive access to email subscriptions, event invitations, competitions, giveaways, and much more.

Membership is free, and your security and privacy remain protected. View our privacy policy before signing up.

Error: Please check your email address.

Tags mobilesoftwareapplicationsapplication developmentAdobe SystemsDevelopment tools

Keep up with the latest tech news, reviews and previews by subscribing to the Good Gear Guide newsletter.

Joab Jackson

IDG News Service
Show Comments

Cool Tech

Toys for Boys

Family Friendly

Stocking Stuffer

SmartLens - Clip on Phone Camera Lens Set of 3

Learn more >

Christmas Gift Guide

Click for more ›

Brand Post

Most Popular Reviews

Latest Articles

Resources

PCW Evaluation Team

Maryellen Rose George

Brother PT-P750W

It’s useful for office tasks as well as pragmatic labelling of equipment and storage – just don’t get too excited and label everything in sight!

Cathy Giles

Brother MFC-L8900CDW

The Brother MFC-L8900CDW is an absolute stand out. I struggle to fault it.

Luke Hill

MSI GT75 TITAN

I need power and lots of it. As a Front End Web developer anything less just won’t cut it which is why the MSI GT75 is an outstanding laptop for me. It’s a sleek and futuristic looking, high quality, beast that has a touch of sci-fi flare about it.

Emily Tyson

MSI GE63 Raider

If you’re looking to invest in your next work horse laptop for work or home use, you can’t go wrong with the MSI GE63.

Laura Johnston

MSI GS65 Stealth Thin

If you can afford the price tag, it is well worth the money. It out performs any other laptop I have tried for gaming, and the transportable design and incredible display also make it ideal for work.

Andrew Teoh

Brother MFC-L9570CDW Multifunction Printer

Touch screen visibility and operation was great and easy to navigate. Each menu and sub-menu was in an understandable order and category

Featured Content

Don’t have an account? Sign up here

Don't have an account? Sign up now

Forgot password?