Interesting thread that explains how to successfully bring in assets from Adobe Illustrator into Expression Design. When creating Silverlight content, you can use Expression Design but you can also use Illustrator or Photoshop. If you use Illustrator then you can import your design elements to Expression Design and use the XAML Exporter in Design. Note that not everything will be imported from Illustrator into Design, for example effects or custom brushes might have to be rasterized or lost but for all the normal geometry with color fills, gradients etc, this import method will work great. 

Read thread from bottom to top.

From: Yin

Here’s a way to get correct 96 dpi when importing AI file (assuming the ai format is supported according to William’s comments).

• [Beta only step]  [If you are using Design V2 beta, there’s a bug about automatic DPI when opening ai files, workaround is to create a new blank document and set it to 72 DPI.  This should be solved in the final release of Design 2]
• Open your AI file in Design.
• File->Document size,  this popup a dialog.  Notice the DPI is 72.
• Remember your document width and height, in terms of pixels.
• Change DPI to 96.  (the pixel dimension might change with dpi change)
• Change width/height back to original pixels (the dpi should remain 96)

OK.

You should get an document with the closest visual appearance while preserving the pixel dimensions.
Then you can copy&paste them to another Design document, or export them to Blend.  Everything should be in 96 DPI.

– Yin

Hi Sarah,
Two important things
Make sure the AI file is written out in PDF compatible format, otherwise Design can’t read it.
For the dpi issue do an ‘open’ rather than an ‘import’. With open we automatically set the dpi to 72 in design to match up with AI. For import, the dpi depends on how you’ve set that up when you created the document. This latter assumes you’re using Version 2 of Design. I’m actually not sure if this auto setting made it for the Beta or not (I’m actually doubtful it did), in which case you can use import, just make sure you’ve specified 72 dpi when you create your Design doc.

William

Hi Sarah,

There is some information about importing from Illustrator to Design in Design’s online readme: 

http://www.microsoft.com/expression/products/readme.aspx?key=design

–Dawn

Hello all,

I was wondering if anyone has information or documentation they could point me to that details the process for importing AI files to Expression Design, including things such as setting up files in AI so that when they translate to Expression Design it is as close to the same as possible.

Specifically I am looking for information on:

• When exporting from AI to Expression, the dpi is different what’s the best way to approach this?
• There does not seem to be a setting in AI to use 96 dpi.

We are trying to record exact processes for getting artwork from different programs / formats and would appreciate any information.

Thanks
Sarah

Hello! We got an email letting us know about some video based case studies that show different agencies or customers in action using Silverlight and Expression. Folks like Library of Congress, WeatherBug, Terralever and EasyJet.com who talk in a documentary style their experiences with Silverlight. They are pretty fun. Personally I enjoyed the one from Terralever because they talk about games which I like.

I noticed a problem when using the Silverlight video player in the Case Studies site (they might have fixed by the time you read this). If you rollover the the Pause button in the video controls, you will notice that the cursor changes between Arrow and Hand kind of unexpectedly… just rollover this Pause icon slowly, move the cursor within the icon and you will see the cursor goes back to an arrow when you go in between the two little bars that make out the Pause icon.  This is a typical problem I see in Silverlight apps. What you need to do in these kind of icons is draw a rectangle that helps you define the “hit” area of the button. Flash has something called “hit” area. In Flash, when you create a button… you have Normal, Rollover, Rollout and Hit. In Silverlight you have to provide the Hit area yourself. I created a small chart below to explain the approach to Hit areas using Silverlight. Let me know if you have any questions.

Jerry was asking me how to change the size of the DeepZoom “slide” I used in my MIX session. The DeepZoom is currently displaying at 1024 x 768px and we want to make that bigger. My Silverlight 1 knowledge didn’t help answer the question so I went to Kirupa and this is my conversation with him. Notice that I still don’t have a specific answer but Kirupa pointed me to the right direction which I’ll explore. I wanted to share this with you anyway in case you want to start trying out.

You are right – you probably do need the XAML files for that. I don’t think I have those on my machine anymore unfortunately� The nice thing is that you can do this yourself by downloading the source files here:

and making the modifications yourself! Simply delete the vista wallpapers with your images and change the reference in the XAML file to point to your images. You can open the XAML file and make the size bigger as you see fit. Let me know if you are still running into issues.

Cheers!
Kirupa

From: Arturo Toledo
Sent: Wednesday, March 19, 2008 9:01 PM
To: Kirupa Chinnathambi
Subject: RE: Making the DeepZoom bigger

Hi Kirupa! The HTML file simply says scale to 100% so I assume it is already scaling the whole Silverlight Control… I was then trying to change some kind of XAML to make it bigger but I can’t find any XAML file to change J  it’s all in a “compiled” xap file.. or seems like…:)
Do I need the source for that one?… would I by any chance have to regenerate all the images in DZ Composer?

From: Kirupa Chinnathambi
Sent: Wednesday, March 19, 2008 6:10 PM
To: Arturo Toledo
Subject: RE: Making the DeepZoom bigger

Both the XAML file and (I think) the HTML file�

From: Arturo Toledo Sent: Wednesday, March 19, 2008 5:45 PM
To: Kirupa Chinnathambi
Subject: Making the DeepZoom bigger

Hi Kirupa

The DeepZoom with my presentation is 1024 x 768.  What do I need to change to make this bigger?… the XAML file?  The HTML file?…

Thanks!

Hello! I just wanted to write a note of THANK YOU for your super nice comments on my MIX08 session. I really appreciate your feedback. Yesterday we were sent the results from the eval forms and my session got:

Average Eval Score – 8.66
Overall Satisfaction – 8.54
Effectiveness of the Speaker – 8.77
(out of 9)

I just feel really grateful for some of your comments and more than posting this to highlight the good session it’s a reference for you, trainers, book publishers, faculty members to use this session for your own purposes. I guess the comments simply validate that the approach for the session connected with designers.

• I appreciate the very fast pace, given that we can view the presentation on line. Thanks! Also loved the “deep Zoom” alternative to boring powerpoints.
• Good over view on how to get off the ground.
• Amazing/fast /valuable. Best for designers of conference.
• Cool
• Made the whole show “worth it” for me. AWESOME!!! I wish this session had lasted all day.- this is the kind of staff that will made adobe-using designers into “converts” great job!
• Excellent session! (from a developer)

To keep this objective, I got to think about the key things that made this session successful:

1. Fun assets. In this one I feel I’m describing this as “wearing designer clothing” … I used assets by Dan Cook, Celso Gomes, Sam Paye and Kim Sealls. All great designers/artists.
2. DeepZoom instead of Powerpoint.  Thanks Kirupa (PM for Blend) who helped me create the DeepZoom experience to use instead of Powerpoint.
3. Fast paced session. Quick snippets of knowledge… the session included answering the some 20-30 typical questions from designers new to Expression Design/Blend. We didn’t take more than 5 mins on a topic. We did “design” during the session… we not only showed features but tried to do with style
4. It was a technical session. No marketing… the marketing was achieved by having a fun session but not by talking beauties about the tools… simply showing them.
5. We used Flash as a reference. I tried not to add “adjectives” like better, worse, faster, slower etc etc… but simply used Flash as a point of reference to explain certain concepts in Expression Blend. I remember a couple years ago we didn’t use this approach when talking about our tools and platforms to designers. Now that the tools are more mature we can more comfortably use Flash as a point of reference. For example: “Where are my Movie Clips?!”… or “Screen transitions in Flash”… and them map those concepts to our Silverlight world. Sometimes there are no easy answers like: “where is my Stop(); GoToAndPlay(); GoToAndStop(); GoToFrame();”…  no easy answer here. But tacklind down these questions proactively, from Microsoft to designers, will continue helping us engaging better.

You can find the assets for the session here and the video for the session here.

Please join us to watch the first live concert cybercast by Microsoft Silverlight - Tomorrow Saturday March 15th, 8pm Central/6pm Pacific

Microsoft has partnered with UVNTV.com to cybercast Ice Cube Live from SxSW Music festival in Austin, TX. Ice Cube, hip hop legend, performing classics and his new album “Raw Footage”. Register online- http://home.uvntv.com/events/view/event/sxsw_ice_cube

More info… http://www.billboard.com/bbcom/news/article_display.jsp?vnu_content_id=1003723151

I’ve posted a summary of the MIX08 event with the items I believe are most relevant for Designers.  Check it out here…

Hello!  After two years of having announced Expression for the first time, we have now released something everyone wanted: the Expression Community site.  This will be place where you can read blogs for the different product team blogs, like Encoder, which just got added with new content about version 2 during MIX or the Blend team blog which included access and info on how to use DeepZoom.

In this Community site we will have blogs, forums, galleries, samples, tutorials and more coming up.

Hello!

We had such a blast at MIX08!  I hope you had a great time too. I had a session on Friday called XAML-Ready Design Agency with Expression Blend. I feel very happy for meeting all the folks that were able to join us during the session. I have published all the assets for my session including the DeepZoom “slide deck” we used during the session (I decided I wouldn’t use PowerPoint anymore, just DeepZoom ). I’m also including my source Expression Design file to my slides.  Feel free to re-use, just add a note mentioning the source  - Arturo Toledo | ux.artu.tv

I was reviewing the www.visitmix.com site yesterday night and I discovered all the videos for entire event are already published there!  All these videos represent an amazing source of training and information. I personally learned Silverlight 1 by watching the MIX07 sessions. Now with the MIX08 you literally have days of recorded video with amazing content, technical, creative and even on Design theory with the UX track.

Shane Morris, Microsoft User Experience Evangelist and Michael Kordahi, Microsoft Developer Evangelist joined us for the Microsoftie Artist in Residence event here in Redmond. This training even helps us get our internal designers and developers ready in the use of Silverlight by creating a fun/crazy one week Silverlight mini project.

Shane and Michael are both based in Australia, and together they represent our ultimate tag team in the field. Just the way we are talking about developer-designer collaboration, we see in our worldwide field tremendous potential to do the same. By having our Design-Developer evangelists working together, it is easier for us (Microsoft) to help you in a better way and provide better advice since we are doing what we preach for. Look for your local evangelists and talk to them about Expression, Silverlight and Designer-Developer collaboration.

One thing Shane and Michael are totally amazing at is communicating with the community. Both of their blogs (both eh!) are very popular and after participating in the Artist in Residence program they published a video with their experience. Lovely! you gotta check it out.

Shane’s Blog

Michael’s Blog