Adding Microsoft Silverlight to Your Companys Skill Set

Adding Microsoft Silverlight to Your Company's Skill Set

Introductions

8

Why We're Here Perception, Reality & Potential For developers and designers

Perception, Reality & Potential Developer’s Designer’s

Anatomy of a Project

Design Effects Fonts Think of Expression as Design as Photoshop meets Illustrator

Breakup / Integration Bitmap Export Vector Export XAML Layout Creation Optimal situation: Collaborative plan upfront

Tips for Developers Loading Additional XAP files is not easy http: //tinyurl. com/loadxaps

Animation/Video More than one timeline Clipping Masks vs. Image Brushes Expression Encoder

The Project Guitar Hero: GHTunes Widget

Re-Using Existing Content http: //www. mikeswanson. com/swf 2 xaml/

Start with FLA

Open AI in Illustrator

Expression Design

Expression Blend

Expression Blend

Expression Blend

Preloader Code <object id="Xaml 1" data="data: application/x-silverlight-2, " type="application/xsilverlight-2" width="100%" height="100%"> <param name="splashscreensource" value="Client. Bin/Splash. xaml"/> <param name="on. Source. Download. Progress. Changed" value="on. Source. Download. Progress. Changed" /> <param name="source" value="Client. Bin/GHTunes. MIX. xap"/> <param name="onerror" value="on. Silverlight. Error" /> <param name="background" value="white" /> <param name="min. Runtime. Version" value="2. 0. 31005. 0" /> <param name="auto. Upgrade" value="true" /> <a href="http: //go. microsoft. com/fwlink/? Link. ID=124807" style="textdecoration: none; "> <img src="http: //go. microsoft. com/fwlink/? Link. Id=108181" alt="Get Microsoft Silverlight" style="border-style: none"/> </a> </object>

Preloader Javascript function on. Source. Download. Progress. Changed(sender, event. Args) { var my. Host = document. get. Element. By. Id("Xaml 1"); var txt. Counter = my. Host. content. find. Name("txt. Counter"); var gauge. Needle. Angle = my. Host. content. find. Name("gauge. Needle. Angle"); var current. Progress; if (event. Args. progress) { current. Progress = event. Args. progress; } else { current. Progress = event. Args. get_progress(); } txt. Counter. Text = Math. floor(current. Progress * 100) + "%"; gauge. Needle. Angle = 25 + Math. floor(current. Progress * 125); if if if } (current. Progress > > > (1 (2 (3 (4 (5 (6 / / / 7)) 7)) 7)) my. Host. content. find. Name("bulb 1"). Visibility my. Host. content. find. Name("bulb 2"). Visibility my. Host. content. find. Name("bulb 3"). Visibility my. Host. content. find. Name("bulb 4"). Visibility my. Host. content. find. Name("bulb 5"). Visibility my. Host. content. find. Name("bulb 6"). Visibility = = = "Visible"; "Visible";

Event Handlers / Storyboards

Button Controls

Visual State Manager

PNG Sequence

Wrap Up – Q & A

Please Complete an Evaluation Form Your feedback is important!

© 2009 Microsoft Corporation. All rights reserved. Microsoft, Windows Vista and other product names are or may be registered trademarks and/or trademarks in the U. S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.