WTF Step by Step guide to installing Silverlight Tools

With Silverlight 4 shipping and Expression Blend 4 RC made available, now was a great time to update the Flash to Silverlight section on the Project Rosetta site.

My main goal was to update the Getting Started series to take advantage of new version 4 features.  I also took advantage of this update to greatly improve the Installation and Setup tutorial.

The content for the site is made for those with an interest in experimenting with Silverlight, who most likely do not have any .NET development experience or in some cases, even Windows.

As a first step, configuring your design and development environment for Silverlight can be a little daunting. Happily the installation process is now much simpler with the advent of the version 4 tools.

Nonetheless, as requested, I’ve put together a simple step by step walkthrough of the install process.

Working towards more Silverlight time and less “WTF?” time.

The new Setup tutorial takes full advantage of the Web Platform Installer (Web PI) which acts as a download and install tool for the needed Tools.  This makes writing the tutorial and installing much easier.

Along with the step by step guide, I’ve also updated the Getting Started series to reflect the new v4 tools and features, specifically CompositionTarget.Rendering (which is like ENTER_FRAME) and CompositeTransform (which makes transforms simpler than before).

Next month, we’ll be updating the Flash to Silverlight site with a new set of tutorials focused on Media (codecs, players, markers, etc) and how it compares to Flash media.

Now for some Taco Bell…

Favorite Tool and Library Downloads for Silverlight

I’ve created my list of favorites tools and libraries and posted them to the Downloads page on the Project Rosetta site.

After posting the updated list yesterday I realized I missed two big ones: SilverSprite and Balder.

Breaking the new list down into categories, I ended up with 3 Essential, 4 Optional and 10 Specialty downloads.

That’s 17 useful tools and frameworks for Silverlight, that are all mostly free and open source.

Thanks Silverlight community, you rock.

What are your favorite downloads for Silverlight?

Big update for the Project Rosetta site today

We just shipped a major update to the Project Rosetta site, including a new a series of Flash to Silverlight tutorials, an updated API Guide with a quick reference list and a full list of recommended tools, code samples and frameworks to download.

Getting Started Series:

• Setting up the Tools
• The Beginning
• Storyboard Animation
• Procedural Animation
• Color Scale and Rotation

API Guide:

• Quick Reference
• Fundamentals and Tools
• Graphics and Images
• Displaying Objects
• MovieClip to UserControl
• Flex Components to Controls

And this is just the beginning – you can look forward to new tutorials in the Getting Started series, along with new series of tutorials that go deeper into a single topic.

To keep track of the latest Project Rosetta content and other similar tutorials Follow us on Twitter or get updates via our RSS Feed.

Flash Skills Applied to Silverlight session at MIX10

It’s official! I will be speaking at MIX10 presenting a session on applying your Flash Skills to Silverlight Design and Development.

The full session description:

If you know how to design and develop Flash applications, you are more than half the way there to creating Silverlight applications. Similar languages, graphic and animation features and skinnable controls, ease the training between the two technologies. Listen and learn how to add a new skill to your skillset and expand your opportunities.

I’m really looking forward to this talk as a continuation of the Flash to Silverlight Guide project I’ve been working on.

If you’ve done both Flash and Silverlight work before, let me know.  I’d like to hear your thoughts on how the platforms compare.

Also, if there’s something specific you’d like to hear about comment here and I’ll try and work that in to the talk.

Perspectives on Flash and Silverlight from Mike Downey on SilverlightTV

Congratulations to John Papa for recently launching a new show on Channel 9 called SilverlightTV.

The show covers the Silverlight platform from a variety of angles including architectural issues, real design and development issues problems solved, community members and the latest happenings with Silverlight.

John’s landed a great interview in Episode 2, Perspectives on Flash and Silverlight with Mike Downey.  A former Flash Evangelist for Adobe, provides his perspective on Silverlight and Flash as RIA technologies. Mike draws comparisons between the Flex and framework and the .NET Framework, Adobe AIR and Silverlight out-of-browser features and the different development tools.

For more comparisons between the two technologies, check out the Flash to Silverlight Guide.

Flash to Silverlight Guide – Graphics, Images and Display List

The second edition of the Flash to Silverlight Guide has been posted!

This edition includes new sections on Graphics and Images and Displaying Objects, as well as a bit of a facelift to the site.

Some of the previous feedback included:

“I wish I would have this when I first started on Silverlight”

– Perfect, we’re hoping to help people just getting started.

“There’s a lot of information on the pages, but its pretty dry.”

– Totally agreed.  So along with other graphics and code samples, I spent some time putting together scenes of the new “movieclip guy” acting out the different properties. Not only does this decrease the dryness and encyclopedia-ish nature of the guide, the icons can also act as quick visual hints.

One of my favorite parts about the artwork is that it comes from a group of assets for a new site that is in the works. Unfortunately I can’t share anything about the site just yet, but I did get the ok to preview the graphics. And the site is going to rock.

Anyways, enough about the graphics, enjoy the Guide.  Next on the list are the Animation, Code techniques and Out of Browser sections.

Silverlight Design Days – Free Blend Training on Tour

Silverlight Design Days have been given a new name and life as .toolbox Events.
Check them out!

Event Schedule

• Jan 29 – Mountain View, CA, US
• Feb 9 – Irvine, CA, US
• Mar 15 – break for MIX10
• Mar 24 – London, UK
• May 7 – Chicago, IL, US
  • register here
• May 11 – New York, NY, US
  • register here
• May 14 – Boston, MA, US
  • register here
• May 26 – Austin, TX, US
  • register here

A Silverlight Design Day is opportunity to learn about Silverlight and Expression Blend from a design and interface developer perspective.

The first half of the day will start out with a short poll, asking these three questions:

1. How many of you write code?
2. What technologies do you use today?
3. Is there anything specific you want to cover?

The tools and the platform will then be introduced by accomplishing designer tasks based on the earlier poll as much as possible.

The second half of the day will be your opportunity to get your hands on Blend and Silverlight. PCs will be available already configured to run through tutorials, made especially with designer and UI tasks in mind.

SWAG and giveaways will be saved till the end of the day, for those hardy souls that can make it all the way through.

Where and When:
The events will be held in training centers with pre-configured PCs available. Feel free to request during the second half of the day, help configuring your own laptop. Once the Event Schedule (shown above) is complete we should end up with an even number of US and non-US locations.

Cost:
This event is free of charge. However, attendees are responsible for booking and paying for their own travel and accommodation. Both breakfast and lunch will be provided.

Registration:
You register by click next to the location you wish to attend in the Event Schedule above.  Registration is handled via the MSDN events site, so be sure to have your LiveID credentials ready.

Online Training:
Sounds like a great idea but you can’t wait? Here are a few online sources to get you started:

• Project Rosetta – Blend Tutorials and a Flash to Silverlight Guide
• Kirupa.com – Blend and Silverlight Tutorials
• Expression Blend blog – Blend Tutorials

Flash to Silverlight Guide – MovieClip to UserControl

The first sections of the new Flash to Silverlight Guide are up!

The purpose of this guide is to familiarize developers and designers with Silverlight concepts by relating them to Flash concepts. Comparisons are drawn between each pair of concepts in effort to map knowledge from one platform to another.

This is the first edition of the guide covering the topics Fundamentals and Tools, MovieClip To UserControl and Flex Components to Silverlight Controls. The next edition will include comparisons of different features from both platforms including Graphics, Animation, Coding and Out Of Browser.

The guide works as a standalone reference, as well as the base of knowledge for upcoming tutorials covering specific topics. There is a ton of content to cover, so we’ll be posting different sections as we get them completed.

During the research process, I’ve built up a large list of ideas that I’m excited to write about. This will be my main focus for the foreseeable future.  I will be hitting the road next year with this content and will be posting event details on this blog.

One event I’ll be attending for certain is MIX10 (still hoping to get a “Flash to Silverlight” session). I’ve seen some of the behind the scenes planning for MIX10, and let me say – this is going to be the best MIX ever.  For real, it will be a heck of a 5th year birthday for the event. I hope you can make it.

10 Expression Blend 3 Tutorials for Silverlight available for download

The 10 tutorials from the Eyes of Blend series on Project Rosetta site are now available for download in both Word and PDF format. The .zip files also contain source code for the starter projects  and resource files if appropriate. One thing that’s been useful in developing these web tutorials is that I’ve been able to reuse them as demos for talks and now downloadable labs to run offline.  The next format I’m planning will be screencasts, most likely for the more visual demos.

As for using them as demos, they are a good start but need a little extra oomph to work well during a talk.  Adding in the sample behaviors from the Expression Blend Sample Pack is a great way to demonstrate Behaviors as an extensible platform and Blend as an extensible tool.  Very cool stuff going on in the Expression world and I’m looking forward to sharing the next set of tutorials and samples.

	1. Drawing an emoticon in Expression Blend First steps in getting to know the tools and workspace in Blend		Download Word, PDF
	2. Element Transformations Learn to use Scale, Rotate, Skew and 2.5D Transformations		Download Word, PDF
	3. Get Started with Animation A Quick Overview on Creating Time-Based Animations		Download Word, PDF
	4. Playing Video with the MediaElement Using the flexible MediaElement control as a reusable Surface		Download Word, PDF
	5. Arranging Pictures to Learn Layout Use the Grid, StackPanel, ScrollableViewer and Border to position Images		Download Word, PDF
	6. A Look at Text in Silverlight Learn about Displaying Text, Font Properties and Embedding Fonts		Download Word, PDF
	7. Import an Adobe Photoshop File into Blend Convert the assets from a Photoshop file into Interactive Controls		Download Word, PDF
	8. Styling and Skinning Controls Customize the Look by Setting Properties and Building Templates		Download Word, PDF
	9. Styling and working with Design-Time Data Explore how Templates and Bindings are used to display dynamic data		Download Word, PDF
	10. Giving Behaviors a Test Drive A brief overview and walkthrough of the Behaviors included with Blend		Download Word, PDF

New Tutorial: Import an Adobe Photoshop File into Expression Blend

While preparing my demos for the European ReMix Tour (photos), I realized that I was missing an important tutorial in the Through the Eyes of Expression Blend series. One of the great features added in Blend 3 was the ability to Import Adobe Photoshop and illustrator files. I put together a quick Login screen in Photoshop and created an Import demo for my talks.

Today I’ve posted the beginning steps of that demo as a tutorial focused on importing assets from a Photoshop file and easily turning them into controls, such as the TextBox and CheckBox.

This turned into one of my favorite walkthroughs because I think it really highlights how much easier Blend can make tasks like Template creation and editing. And that applies for Developers as well as those doing Interaction Design.

You can find the tutorial on the Project Rosetta site: Import an Adobe Photoshop File into Blend