Importing Adobe Illustrator files in Expression Blend 3
I previously wrote a few blog posts about importing Adobe Photoshop files into Expression Blend 3. This post focuses on the ability to import an Adobe Illustrator .ai file and converting the content to Silverlight 3 or WPF objects. You can also use this import feature to bring in wireframes or comps created in Illustrator to use in a SketchFlow application.
The Illustrator import feature in Blend 3 has the equivalent functionality to the Illustrator import feature in Microsoft Expression Design 3. Let’s use the following file as an example and open it in Illustrator to explore its contents:
The Illustrator file above displays a complex illustration that is composed of an image, a text control, as well as a variety of vectors.
In order to be able to import .ai files into Blend you must ensure that the “Create PDF Compatible file” checkbox is checked when the file is saved otherwise the file will not import.
Once saved with the “Create a PDF Compatible file” setting enabled you can import the .ai file into Blend by selecting the “Import Adobe Illustrator File…” entry in the File menu. You can then select an .ai file and see the following results on the artboard:
The Illustrator layers are converted into equivalent Silverlight 3 and WPF objects and displayed on the Objects and Timeline panel. Many features from Illustrator files are imported and others are not supported. You’ll notice some of the following behavior:
- Images: Images are imported as PNGs and automatically added to a <.ai file name>_images folder in the project.
- Text & Vectors: Text and vector artwork are all converted to editable paths on import.
- Visibility toggle & lock states: These properties are preserved for the imported objects.
- Gradients: Midpoint stops and gradient stops are imported and editable.
- Layer Structure & Groups: Only the top groups are preserved in the file structure.
- Layer Names: These are only persisted only for the top level groups in the file. Object names in Blend can only contain alphanumeric character [A-Z][a-z][0-9] and underscores. Keep this in mind when naming objects in Illustrator :)
Similar to the Photoshop import results, you can add interactivity to all imported Illustrator content! This includes any prototyping features, animation, data-binding, and all of the Blend 3 functionality :)
Questions or future Illustrator import feature requests? Leave a comment!
Smiles,
Janete
Trackbacks & Pingbacks
-
Microsoft Silverlight content
trackbacked Posted August 31, 2009, 5:54 pm
Importing Adobe Illustrator files in Expression Blend 3…
I previously wrote a few blog posts about importing Adobe Photoshop files into Expression Blend 3. This…
-
DotNetShoutout
trackbacked Posted August 31, 2009, 7:24 pm
Sunny Pixels | Importing Adobe Illustrator files in Expression Blend 3…
Thank you for submitting this cool story – Trackback from DotNetShoutout…
-
Easy Site Structure Using ssi, css and Dreamweaver Template | Web Design and all stuff related to it!
pingbacked Posted September 1, 2009, 3:05 am
[...] Sunny Pixels | Importing Adobe Illustrator files in Expression Blend 3 [...]
-
Sunny Pixels | Importing Adobe Illustrator files in Expression Blend 3 | Adobe Tutorials
pingbacked Posted September 2, 2009, 2:50 am
[...] I previously wrote a few blog posts about importing Adobe Photoshop files into Expression Blend 3. Original post: Sunny Pixels | Importing Adobe Illustrator files in Expression Blend 3 [...]
Cool! I love the fact that gradients are imported and editable!
I simply loved it. I t caan save four to five thousand songs and videos which makes my collection simply amazing.. I would like to know if I can save more songs than this… Keep posting more updates…
I m absolutely thrilled to get to read such a good blog. The amount of information that I gained is really great. This is an absolute masterpiece. I m really impressed. I would love to read more of your blogs. This is one of the best blogs I’ve ever read. Please keep posting…….. Keep up the good work………..
With its excellent features and also availability of radio , this gadget is really worth buying… I would surely recommend this for all music lovers..
Zune is the best gadget available in store. I could not resist buying it because I and my friend share a lot of music and videos. Good blog…. Keep posting more and more about Zune. I would love to read them.
This is my most priced possession. I love it and is as precious as diamond for any music freak. I would love to know more features about it as I bought it recently and not much aware of all its applications.
Zune and I pod available offer you almost similar features and are also available in varios colors too. I think they not only offer you entertainment but also provide you with loads of information too.
Can anyone help me out in suggesting which one should I gift to my friend. I don’t have much idea about this product but as my friend loves it I want to have it for him… Waiting for your suggestions..
Hello there,
I drew a button in Illustrator that later was imported to Expression Blend 3. The button contained several layers, with one of them in Screen blending mode. It made it look glossy, but unfortunately after I’ve imported, the desired effect was lost. Did I do something wrong or Blend does not support Screen mode?
Thanks in advance.
i mistakenly came across your blog while searching for something else.but found this post useful hence decided to drop a line.very well done.i dont completely agree with you but still a good agrument.
Adding Adobe Illustrator files to an Expression Design 3 document
Text is converted to a path on Adobe® Illustrator® import, and each character is treated as a separate path object.
You may experience unexpected results when you import text from Illustrator. These results can include unexpected character rotation, kerning, point sizes, and alignment.
Subscripts, superscripts, strikethrough, underline, small caps, and all caps text effects copied from Illustrator create separate text objects when pasted into Expression Design.
A single text object that has hard returns copied from Illustrator creates separate text objects when pasted into Expression Design.
The Illustrator Clipboard export format does not support transparency and blend mode information.
PNG images copied from Illustrator into Expression Design are pasted in as multiple image objects.
Multiple objects are created when you copy objects that have opacity from Illustrator into Expression Design.
When imported from Illustrator, artwork that contains groups is flattened in Expression Design.
When an Illustrator file is imported into Expression Design, the Illustrator artboard may be added as an object in the Layers panel.
Expression Design vectorizes patterns on import from Illustrator.
Illustrator Column Graphs (Charts) are imported as individual objects.
Custom strokes are imported from Illustrator as individual paths.
Strokes and fills on the same object may be separated when you import the object from Illustrator.
Mesh gradients from Illustrator may take a long time to import. Expression Design vectorizes gradient meshes, creating many small shapes that take a long time to render.
Expression Design does not support the following Adobe Illustrator blend modes, and maps them onto the Normal blend mode:
Overlay
HardLight
SoftLight
Exclusion
Hue
Saturation
Color
Luminosity
Expression Design does not support Illustrator knockout groups.
Expression Design does not support Illustrator softmask images.
The colors will not display correctly in Expression Design when objects that use CMYK colors are pasted from Illustrator.