Oct 06, 2009

Thoughts on Silverlight

I had the pleasure of diving headfirst into Silverlight in building the Victoria's Secret Fashion Show. I walked in with the same sort of attitude that I believe is prevelant across the industry at the moment -- Silverlight is an inferior platform, that we were working with a Flash wananbe and that this would be to the project's detriment. Why use Silverlight when I can already know Flash so well? It does the same things as Flash anyway, right?

So now that the project is launched, I'm feeling reflective. And I have to say: Silverlight is a worthy competitor to Flash. It is a lot of fun to build in. I recommend it. I think there are times when it'll be faster to build certain things in Silverlight than Flash and vice versa, and it is a matter of learning where the strengths and weaknesses are for each.

There were some things that frustrated me, but overall I found Visual Studio to be a great environment to learn to code in, C# was an extremely easy language to learn and most importantly of all the Silverlight player to be really flexible to the stress we put it under. Our team noted several times that we especially like Silverlight's animation capabilities -- we felt like we had far more "control" over what was happening on the screen than in Flash.


Here are some general observations and got yas that I bumped into:

Timeline animation is different.
Not better or worse, just different. Silverlight has you set up your "base" state... where all the objects on the screen are supposed to begin. From there you can create any number of storyboards that animate them around. What's neat is that the storyboards assume you're always animating from where the object is at to where it's going, and it never resets any properties that are changed -- so you can have one storyboard that alphas an object up with another that moves it across the screen, play them both at the same time and it looks like one animation. It takes some getting used to but the result is that animations will never snap, which is neat.

The downside of this is that if you have a simple two state animation -- for example, rollover/rollout -- and you change a property and forget to animate it back to its initial position in the rollout, it doesn't animate correctly. It's complex to explain, but this brand of timeline tweening is really interesting.

Silverlight is the better videoplayer solution
What's that? Did I just say Silverlight is BETTER at video than Flash? Yes. I think the MediaElement control offers everything the FLVPlayback component does, but it's much more responsive. Smooth Streaming is REALLY cool. In Flash there's NetStream, NetConnection, VideoPlayer, FLVPlayback... so many different levels of access, and so confusing if you try to write your own. MediaElement is somewhere between VideoPlayer and FLVPlayback, but just feels much more straightforward.

It is pretty clear that Microsoft really wanted to stress the video capabilities of Silverlight from the get go -- what with the Netflix player, the Olympics, and so on. I was surprised that it did a lot more than just stream video... it seemed to make it easy to program and to build.

XAPs aren't fun to load... but are a blast to explore.
When you create a Silverlight project, you start with a XAML (MS equivalent to MXML) to describe visuals and use C# to map to add functionality. Your finished XAP is compiled from a "solution"... a group of projects you individually create. So in the case of the Victoria's Secret Fashion show we had a couple of projects: com.bigspaceship, com.victoriassecret and then whatever the built in Microsoft libraries were.

XAPs actually are just standard issue ZIPs, like the AIR extension. When you crack one open you can see the assemblies (dll) inside. Interestingly each project gets its own assembly... so we have the com.bigspaceship.dll file inside our final XAP. These can be pulled out and used in Visual Studio projects, which do some small amount of basic code hinting... great for attempting to reverse engineer logic. I learned a lot this way.

Of course, when loading a XAP at runtime this also means you have to programmatically recreate the process -- extract the assembly you need from the XAP, somehow get C# to convert it into a format it understands and then finally apply. This gets pretty tedious pretty quickly and is obviously much more cumbersome than simply loading a SWF and adding to the stage.

It also gets pretty hard to seriously talk about files. Try it: "Hey Joe, I just zipped xap xamls for you. Zug zug."

Classes can get really messy
C# supports real overloading -- even constructors. This is awesome. I love having multiple methods named the same thing automatically doing something different depending on the variables passed. Take this example:

 
void foo() {}
void foo(string name) {}


If you call foo and pass a string, it knows to go to the second method. I like this way more than optional arguments like ActionScript... it feels stricter and I'm virtually certain it's faster performance wise, though I didn't test.

C# also supports partial classes, meaning you can have a class written across multiple files. Your XAML files are actually converted into partial classes, the other half being a corresponding C# (which I believe is called "code under"). This means you can have classes named anything you want, anywhere you want. No folder structure that matches the package name deal. Imagine the mess you can create if you're not careful.

Easy things should be easy. But they aren't.
The Silverlight version of movieclip.x = 100? usercontrol.setValue(Canvas.LeftProperty,100). Why not just make a wrapper for x and y built into the language? Why make it so hard?

Visibility is just as silly. Each object has a visibility property that can be one of two options: Visibility.Visible and Visibility.Collapsed. What's wrong with just true and false?

Incidentally, I tried combining this with some fun namespaces and I wrote this line of code that I am enormously proud of:

visibility.visibility.Visibility.Visible.Visibility = Visibility.Visible;


Traversing the Silverlight layout tree (DOM) isn't much easier. Since everything is strictly typed, if you want to access a property you know exists in a user control from some other scope you have to say:

usercontrol.FindName("button") as Button;


Of course this gets absurd when you have nested User Controls:

((usercontrol.FindName("uc") as UserControl).FindName("nestedUserControl") as UserControl) // and so on.


Linq is a neat take on XML... but E4X is better.
Parsing XML in Silverlight feels a lot like writing a SQL query:

from foo in xmlDocument.Descendants("moop") where(foo.Attribute("id").Value == "apple") select foo;

Compare with:
xmlDocument.moop.(@id == "apple");


E4X is a lot less code to write and a lot easier to read straight through.

Building on OS X is critical.
Apple understood that in order for the iPod to reach its full potential it had to reach out to a market outside of their specific hardware and software. The result was iTunes for PC, which was about as critical to it's success as anything.

Microsoft needs to take the same approach to Silverlight. Whether they like it or not, designers are mostly working on Apple computers these days. If developing for Silverlight is going to require the purchase of a separate operating system or the performance hit of emulating windows, the market for creative professionals choosing it as their platform is exponentionally smaller.

Learning C# and Blend is empowering
I felt like I learned a dozen different languages all at once. I moved straight into Windows EXE development from here... same XAMLs, same C#, slightly more functionality. Yeah I can make full fledged apps in AIR, which is great... but there's just something really rewarding about Objective-C and C# in that feeling that you're making a "real" app. That learning one thing allows you to really build even more.

Obviously there's so much more to discuss... this is just scratching the surface. Silverlight's potential is really exciting to me... I can't wait to build the next project.

For you scripters out there intimidated by a new language, there was a single resource that I found critically helpful: shinedraw.com. Terence Tsang is a developer who executes simple tasks in both Flash and Silverlight, then posts the source code for each on his blog. There's no easier way to learn than to look at how he loaded a file in AS3 and the equivalent in C#.

Share this Post


                           

Comments


oyunlar     Feb 04, 2010
nice to read this post but "Easy things should be easy. But they aren't." You're right, why the heck in Flex I can't set width and height using styles? Why can't I combine multiple selectors?

oyunlar     Dec 23, 2009
Silverlight is a cut down version of WPF, CLR and C#. It ain`t "two years" old.
The animations and transitions were a little jumpy on my Mac and the video playback didn't seem much better than the equivalent Flash site

one giant media     Dec 13, 2009
Great post, thanks for sharing. I recently worked with Microsoft on a project and the brand police insisted we delve into the depths of SilverLight, and I have to agree with most* of your points... especially with NetStreams and all the video hooplah, jeez Adobe what happened there?

Still, I have to go with Flash/Flex on this one- more specifically Flash / FlashDevelop 3+ w/ Flex SDK

In Microsoft's defense, though, this flash/flexSDK/FD3 workflow would not be nearly as slick without great libraries like Greensock, Core Lib, Senocular, etc. They've really brought performance and development speed way up for the community- I think Silver Light probably needs some time to build up this kind of base to make it as easy to jump into development as fast...

I've also heard great things about Catalyst + FlashBuilder and am looking forward to all the great Suite-wide features there.

Shon Mogharabi     Nov 02, 2009
I think the site looks great regardless. Thanks for the 'behind the scenes' outlook on the whole project and on silverlight in general.

cipriano     Oct 28, 2009
Very interesting post. Nice to read what seems like an unbiased opinion.

In my limited experience with SL (1 and 2), I found it easier if you look at it like manipulating the DOM with Javascript. I think the less parallels you try to force between SL and Flash the easier it is to learn.

I read some comments/complaints that C# is too complicated. Personally I think that is not an excuse not to use a product. If you think C# is complicated, take a look at Objective C!



Andrei Potorac     Oct 18, 2009
To me an my team, Silverlight is a no-no. The language seems much more complicated, thus the development time will definitely increase.

The reach of the player is not even close to that of the Flash Player.

The Windows OS sucks. And since one can't build for Silverlight on a MAC, I guess a lot of us simply don't even want to try it.

Plus, we need a real motivation for getting onto Silverlight wagon. I presume in your case the motivation was an investment from Microsoft into the project of some kind, but Microsoft won't do that for every Silverlight project.

I don't think we'll ever work with Silverlight, and I am sure a lot of Flash Developers out there won't switch either. We all know how "good" Microsoft products really are: IE, Vista, Zune, etc..

NaY     Oct 15, 2009
Thanks a lot for this post! I really appreciated your very objective analysis and I think this kind of testimonial will be useful to those who are skeptical about Silverlight and are a priori reluctant to even give it a try.
I am working for Microsoft and as I am a very enthusiastic person, my opinion is certainly biased when talking about our products and platform, but I try to remain as critic as possible and your feedbacks on what is good and what could be better are so welcome...
I've suggested my blog readers to read your article and again, "BRAVO" for the Victoria Secret's site!

Jamie     Oct 13, 2009
@Daniel Thanks for the compliments. You know, I think these communities are just begging for some sort of joint meet-up or conference. There is a lot of misunderstanding between camps. Bias is one thing -- I'll always prefer ActionScript to any other language because I know it so well -- but wholesale hatred of a platform can only be detrimental... and not just potentially to your users, but your business as well.

(And bring the "standards people", too!)

Daniel     Oct 13, 2009
@jamie,

First, the website looks fantastic. As a developer, I dream of design (and then I wake up and code lol ). I also really enjoyed your blog post. I liked that you admitted your reluctance at first to work with Silverlight but then were able to be honest about what you liked (and didn’t like) about Silverlight. I was equally as impressed with your ability to handle the comments section of the blog and not let it turn into a flame war. That is a skill indeed.


Silvie Gratisspiele     Oct 13, 2009
Let´s see if silverlight can become a competitor to flash. In my opinion it will.

Jamie     Oct 12, 2009
@Edward J. Stembler I'm glad to hear we're not the only ones trying to come to terms with the Mac thing. :)

IronPython and IronRuby are interesting, but I prefer a java based language just because I know them so well. That said, C# was super easy to learn and I don't mind sticking with that at all.

Edward J. Stembler     Oct 11, 2009
I like this article. I'm the opposite, a Silverlight guru forced to work on a Flex project. I'll re-inforce two points you made which I agree strongly with:

While I'm no fan of Eclipse, being able to work on my Mac is a pleasure. I wish Microsoft had Visual Studio or Blend equivalents for Mac OS X. Though, I can develop IronPython or IronRuby Silverlight apps on my Mac, but not with an IDE.

Also, I've been using LiNQ to XML since it was in beta, and have missed it sorely on other platforms (Java for example). However, I was pleasantly surprised with E4X! Very easy to use, and less verbose.

You're right, XAML / Dependency properties / binding needs to be improved in Silverlight.

On the language front I abhor ActionScript mainly due to it's JavaScript ancestry. I prefer C#, but would really like to use IronPython or IronRuby if they were better integrated.

Jamie     Oct 09, 2009
@Steph Célibataire Thanks! Really nice of you to say. We're really proud of it. And do give it a try. It's going to be frustrating to learn at first, same as anything new. But it's really powerful and satisfying to work with so keep an open mind.

@Nic There's something interesting going on now that I don't think anyone has really touched on yet, but I think there's a movement in Microsoft from being perceived as the all-function-no-form company to one that embraces design much more. It's certainly the effects of Apple and Nintendo and what have you on them, but they're starting to get it. And there's growing pains with that they'll have to address. That's why I mentioned bringing Blend to OS X -- it's a great olive branch to the vast community of designers and artists that Microsoft has already lost to Apple.

I tried to think of Blend as a competitor to Flash CS4, and so I found it a little more cumbersome. The truth is it's probably closer a competitor to Flex, which comparing to Flash CS4 I ALSO find to be cumbersome. XAML and MXML both are simultaneously amazing in how much you can do and frustrating in some of the workflows you have to deal with to achieve. It's funny how in both platforms, the effort to making trivial tasks like skinning buttons easy, they made them unnecessarily generic and bloated. Rather than focus on differentiators like the adoption rate of the plugin or even performance, I'd like to look for things Silverlight does well that Flex doesn't and then know "Oh, if we build in Silverlight it will save us X hours and provide the user a better experience." And vice versa,of course. We prefer to think of how the technologies are supposed to be used, not whether we like Adobe or Microsoft more. It's hard to do right now, but the only other option is to choose a platform and hope it never goes away. And that's no way to sustain yourself in this industry.

Nic     Oct 09, 2009
Good post from the author.

Let the rant begin from a dev that is into design and coding yes you can do both...

----------------
A view from above:
----------------

I must add a BIG negative to this post and that is Microsoft isen´t a designer oriented software company they are a engineer driven software company they do not fully grasp what developers/designers need or want.

Do Adobe get this ? well they do understand it more than Microsoft does at least :-/

----------------
A quick Conclusion:
----------------

Skinning of controls in sliverligth is a nightmare ! Poor documentation and very little resources can found out on the net to help you on the way (YES GOOGLE but there aren´t that many peps using siliverlight yet ! penetration is loooooow.) Blend software is horrible to work with the words "cluttred by default" is ever present.

The idea behind Microsoft WPF controltemplate and skinning is good but as usually with the Microsoft "think tank" they always overcomplicate everything taking the fun out of everything just try to skin the controls in sliverlight and you grow grey hairs FAST !!!!

----------------
Just a designer view example:
----------------

If you work at a web dev firm were you one day get a pretty .psd layout from a designer where the designer wants combobox with a pretty skin on it in siliverlight you are totally SMOOOOKED in aspect of how much time its going to take, and getting it done on a deadline.

As pixel perfect isne´t easy at all in siliverlight trust me I tried.

Skinning WPF is hard and It takes time ! so someone has to pay for the dev to learn how to do it and with prices getting lower it hard to motivate dev time for "learning" as boss people want there project done on time with no excuses silverlight is not a good choice for any application that needs a pretty skin, Im sorry to say this but I feel its true.

/ Rant over and out


Steph Célibataire     Oct 09, 2009
I'm glad I found out about your article, I got mixed feedbacks from my friends on the software so I'm giving it a try.
ps : website looks great !

Jamie     Oct 08, 2009
@rad_g This is exactly what I did. Just having the main page or a user control from an external assembly doesn't mean that I could then get to say... a canvas with a property of "foo" with a usercontrol nested inside named "bar", and anything inside of that. The article you pointed me to doesn't seem to say anything different. And while I would LOVE to learn the better way if it exists, my point is that the better way isn't really intuitive in any shape or form. It certainly might fly for those with a lot of coding experience, but for the programmer who just wants to make their band's page, this is a barrier to entry.

rad_g     Oct 08, 2009
You can load DLLs directly and get strong typing on them: http://forums.silverlight.net/forums/t/14941.aspx

AFAIR when loading SWF there is no strong typing on loaded objects as well.

Jamie     Oct 08, 2009
@rad_g I'm comparing XAPs to SWFs. Unless I've completely missed something, the only way I could pull artwork from one compiled external Silverlight solution into another is to load the XAP, extract the assembly I needed and then generate a UserControl.

rad_g     Oct 08, 2009
I do not treat your post as comparing Flex to Silverlight, I'm just pointing out where the things could be improved ;) I understand C# is more verbose, requires more typing and sometimes unfortunately planning as well. Been there, done that. I'm not trying to convince anyone which one is better though I've been doing exactly that in the past.

Regarding FindName, I won't give that quickly ;) When loading modules, are you comparing those XAPS to RSLs or modules in Flex (or SWFs perhaps)?

Jamie     Oct 08, 2009
@rad_g Your points are taken. I don't want to do much more comparing on Flex vs. Silverlight and which is better where. They both have strengths and weaknesses in the language and the platforms. Some of it is preference and comfort, for sure. I noted some of the things I found frustrating about C# in much the same way we've done about ActionScript in the past because well... this is a general first impression post on Silverlight. As time progresses we'll be going deeper not just into some other frustrations, but also how we solved them. By no means was this post supposed to be a condemnation of Silverlight or Flash... I hope nobody read it that way at all. It's just my impressions.

I will say this as a last note about the FindName: Yes, the generated code automatically creates a public typed variable of whatever an object is named in the XAML. The problem is this only flies when you're doing all of your work inside of a single solution -- when all of your assemblies are compiled together. When you get into externally loading XAPs, these pre-generated variables aren't there. XAP A doesn't know XAP B has a property "foo" if you generate it by creating a new UserControl from XAP B's assembly. Our Fashion Show site uses significantly more externally loaded XAPs than what I think is the norm. There were other options on the table -- using an Interface or having all of the XAMLs use something other than UserControl as it's root type -- but when all we really needed was locating an object name, these seemed a little more upkeep than just using FindName. (We worked out a solution for that, too, which will be a separate post.) I glossed over in this post that loading external XAPs is not made particularly easy to do -- at least not as easy as loading SWFs in Flash. What I'm getting at is that the combination of loading a XAP and then pointing to a specific object in the DOM in that is not as easy as it could be.... but that gets into the how's and why's of what we made. We'll need to dissect how we chose to architect the site, which is yet another blog post coming and I promise will be a fascinating read for you. :)

rad_g     Oct 08, 2009
@Jamie:

1. Yeah, personal preferences. I on the other hand go with LINQ :)

2. Basics are good but the fact that you can just add a method to the object is priceless, you have no chance of doing so in Flex other than using dynamic class.
But there is significant difference. To make the class dynamic you have to modify its source code, in C# you can do it on a loaded assembly, without source code.

3. :)

4. I know what you mean but there is a price one have to pay to have complete insight of what's going on in the code and avoid things like:

this.parentDocument["myControl"].someMethod();

Although you can enforce on your developers not to use such code are you sure none of them writes it when in a hurry? And final point - in Flex you have to cast parentDocument and parentApplication anyway (they're of type Object). So the above code written like this:

this.parentDocument.myControl.someMethod();

would not work as well. To make it work you would have to change it to:

SomeControl(this.parentDocument).myControl.myMethod();
or
(this.parentDocument as SomeControl).myControl.myMethod();

Similar to what you have to do in Silverlight.

FindName, to be honest I knew there was something wrong with using it (didn't use Silverlight for quite a while now). I just tried the following document:

<UserControl x:Class="MMSTest.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d" d:DesignWidth="640" d:DesignHeight="480">
<Grid x:Name="LayoutRoot">
<Canvas x:Name="Control">
<Canvas x:Name="Lol" />
</Canvas>
</Grid>
</UserControl>

And in C# I can easily do:

void MainPage_Loaded(object sender, RoutedEventArgs e)
{
Debug.WriteLine(this.Lol.Name);
}

Which outputs "Lol". Each time VS knows what is the type of the control. So no, you don't have to use FindName and all those casts. And it works across custom controls as well...

Jamie     Oct 08, 2009
@Richard I don't buy the unnecessary proprietary plugin argument. There's lots of things you can do with browser plugins that the browser itself doesn't natively do (or do well) -- the whole idea is to augment the browser with richer capabilities. I don't mind if a company has financial intentions in creating it. I love making things. I can't tell you how happy I am that the likes of Mozilla, Sun, Microsoft, Apple and Adobe (to name a few) have created the tools to make a whole career out of making the things I love.

Microsoft definitely made some mistakes with some strategies in the past. I don't think offering competition in this space is one of those mistakes. As for the whole "take over the web" statement... well, MS definitely has a perception problem they need to work on. :)

@rad_g To your points:

1. I think my example speaks for itself in the Linq v. E4X debate. I didn't do a performance test. I'm not looking at the "other" things it can do. E4X is easier to write and easier to read when it comes to XML. Don't confuse that for criticism of Linq. I got it quickly, I agree that it's REALLY powerful and it is a solid solution. All I'm saying if you offered me either option, I'd use E4x first.


2. Of course. And when it came to a lot of the pain points I mentioned above, I either wrote or found workarounds that wrapped the pain points and moved on. My point in my gripe is that I had to do that in the first place. I've always felt like whenever I'm writing a workaround for the way a language I'm fixing an engineering oversight. This is prevalent in every language, just seems like too many of the basics (x,y,visibility,etc) required that with C#.

3. I don't know, and you should be able to. :)

4. You're right. My example is not a great one because you probably wouldn't need a recast nested inside. I do have another example of this sort of recasting being an issue though. Consider this:

myUserControl.Parent.Children // fail.
(myUserControl.Parent as SomethingThatContainsChildren).Children

These are the sorts of things that I was trying to articulate in the entry... there's a lot of casting to do when the software doesn't know exactly what type of object you're talking about. In this case, I think it's safe to assume that if Parent exists, it's already going to be something that has Children by the whole nature of the system. No cast should be required.

Along the way I felt like I was writing "as" more often than I typically do. The compiler is very strict. My point was that while languages like PHP go too easy on you, C# goes too hard.

Richard     Oct 08, 2009
My beef with Silverlight is that it is unnecessary. If microsoft had put as much effort into improving the basics of their browser, like a decent Javascript interpreter and support for Canvas and Video tags, then we would not need yet another proprietary plugin.
Please, no complaints like "Javascript is not good enough", just use a cross-compiler like GWT, Or, "Javascript is not fast enough", yes it is, see Chrome. I see Silverlight as just another microsoft push to take over the web instead of working with and improving open standards. No thanks.

rad_g     Oct 08, 2009
1. LINQ and E4X: perhaps for you E4X is "better", that doesn't change the fact that LINQ is more powerful. And simple enough to understand. Oh, and you can actually replace XDoc with any other value implementing IEnumerable and IQueryable. So in design view you may use collections but in production replace it with XML.

2. Visibility argument: simple fix, use extension methods, http://blah.winsmarts.com/2006/05/18/demystifying-c-30--part-3-extension-methods.aspx

3. "Easy things should be easy. But they aren't." You're right, why the heck in Flex I can't set width and height using styles? Why can't I combine multiple selectors?

4. "((usercontrol.FindName("uc") as UserControl).FindName("nestedUserControl") as UserControl) // and so on." AFAIR FindName traverses whole hierarchy so your comment is possibly invalid, you could do just: usercontrol.FindName("nestedUserControl"). Also don't need to use 'as' cast. ((UserControl)usercontrol.FindName("nestedUserControl")).whatever...

pixjm     Oct 08, 2009
Flash betta watch itself, there is a new kid on the block
http://www.pixjm.com

Jamie     Oct 07, 2009
@Negative I'm not arguing that the Visibility property has more than two parameters... I'm saying that a new developer to C# doesn't know and doesn't care. Virtually every other programming language *at least* wraps their visibility parameters to true and false. I don't see why false couldn't double for Visibility.Collapsed and true for Visibility.Visible. There are short form code wrappers for lots of common logic annoyances and this one is no different. I feel just as strongly about each of the other points I mentioned in my post.

@Jan Erik Paulsen I can't really speak much on the way Silverlight scaling algorithms... I was just happy with the results and the ease of creation. The one thing I did really dislike is a bug with the MediaElement reloading the video if you reparent it. I didn't dive much further into the actual internals...


mycall     Oct 07, 2009
You should check out IronRuby and IronPython for your next Silverlight project.

Jan Erik Paulsen     Oct 07, 2009
I just compared MediaElement/C#, JMC/Java and Phonon/C++ development on my blog and Silverlight looks pretty good. Though, I really dislike their scaling algorithm. Too "pretty" for my taste.

@MS guy
Silverlight is a cut down version of WPF, CLR and C#. It ain`t "two years" old.

Negative     Oct 07, 2009
As has been said before, Visibility has to be three-state. Visible, Collapsed, and Hidden.

As for why you can't set Object.Property = x, why can't you? In most cases, you can as long as the 'Object' class has property wrappers, which all WPF/SL classes do. Of course it's different for attached properties, but in that case 'Object' doesn't even own the property 'Property'.

You should rarely have to use FindName, and definitely not nested like you did.

For anyone new to XAML/SL/WPF, definitely buy a book because while the learning curve is steep, it's THE ultimate UI language. I can't even count the number of times I've been frustrated with XAML and then later been like... "Ohhh, that's genius."

The HTML of the future is here... and it is XAML.

Jamie     Oct 07, 2009
@MS guy I definitely agree with you that Silverlight has come an amazing distance very quickly. We talked about that a lot as we were building. Microsoft did a great job navigating treacherous waters and I tip my hat to their team.

You know what I hope? That a solution can be done in any technology - HTML/JS/CSS, Flash, Silverlight, some other plugin, whatever - and that each solution offers something unique enough to justify it's workflow over the other for a given situation. I would like for HTML/CSS to be the hammer and nails, Flash to be a screwdriver and Silverlight to be an allen wrench or something like that. I'd like to see the competition between each platform be replaced with knowledge sharing. We're all trying to do the same thing -- create meaning and great user experience.

I'd also like peace on earth and everyone to have a free bunny rabbit. Unless they're allergic.

MS guy     Oct 07, 2009
@Jamie I can't say that Flash sucks. Each one platform has its own pro and con. Indeed I don't think it is appropriate to compare a technology which is mature enough (I don't know but maybe Flash is already around 10 years) with a technology which was released almost 2 years ago. But I am quite happy with the progress of the Silverlight team. And after few years Silverlight will be the Flash killer, I am absolutely sure about this.

Jamie     Oct 07, 2009
@Dave Lopez Okay, I certainly can't qualify my statement on what designers preferred design platform is beyond every designer I know prefers a Mac. I could be wildly off base. Who knows?

I don't agree with Silverlight "blowing away" anything either. They're both great platforms and both worth investing time into. I can't stress enough that taking a "side" is boxing yourself into a solution in an industry where the next thing is always around the corner. Keep experimenting. Have an open mind. Eat your vegetables. It's good for you!

Matt Kenefick     Oct 07, 2009
@Dave Lopez : Agreed. Silverlight is in no way, shape, or form an inferior competitor to Flash. They have some issues at the moment with market share and accessibility of the plug-in, but when these get resolved... I'm sure you'll see a much more rapid penetration rate. The platform itself has strengths and weaknesses as this post highlights and I think THIS is where you're going to see the separation. Perhaps video heavy sites will be run on Silverlight but games will be on Flash. Silverlight isn't trying to be Flash, it's just trying to exist in the same realm.

And maybe.. just maybe.. there'll be a time when all of these can exist together! *gasp* Silverlight, Flash, AND HTML/CSS/JS ?? Maybe I'm dreaming now.

Dave Lopez     Oct 07, 2009
"Whether they like it or not, designers are mostly working on Apple computers these days."

That's obviously not true.

Dave Lopez     Oct 07, 2009
"I walked in with the same sort of attitude that I believe is prevelant across the industry at the moment -- Silverlight is an inferior platform, that we were working with a Flash wananbe and that this would be to the project's detriment."

I don't know why anybody in their right mind would think that Silverlight is an inferior platform, when it's completely obvious that from a technology standpoint it blows away thing in the Flash world.

Now of course there's more than technical superiority....market penetration....tooling, etc..

Jamie     Oct 07, 2009
@MS guy I would hope you don't think Flash sucks... it's a really killer platform, a lot of fun to develop in and really powerful. You shouldn't box yourself in to a specific platform -- you're undervaluing your own expertise as a programmer by not tinkering and exploring.

The findName debate needs to be properly framed, as you aren't the first to point this out. We built an unconventional Silverlight application an unconventional way, and couldn't rely on code behind for our logic. I'll draw up a post on it at some point and you'll see why we leaned on it. There were other options available, but nothing proved faster than assuming we knew the instance name and accessing it from there.

MS guy     Oct 07, 2009
OK I am a pro Microsoft technologies. And what should I say ? Flash sucks ? No I wouldn't say it because I don;t have any experience with Flash. Currently I can;t imagine my self studying Action Script and other shits, provided that Microsoft offers me a complete platform ( Visual Studio + Net framework + C#). What do I want more ?
I understand you because you are in the my shoes (but from the other side) - you are flash guy and you should study completly new technologies.
p.s. Once you declared your button in the XAML and sets its Name property you could access is directly in the code behind.
So forget about "usercontrol.FindName("button") as Button;" and use directly "this.button;"

Dom     Oct 07, 2009
still, Silverlight - never ..... :)

Jeff     Oct 07, 2009
As others have noted, I think any dev would be hard pressed to say that SL is not a viable competitor to Flash - I am not a big fan of MS, but I will use whatever provides the most standards compliance coupled with ease of use, stability, and, most importantly, market penetration, and (as has also been said) SL just can't compete in that regard. Also, (and maybe this is true maybe not) I have noticed that SL seems to be moving pretty quickly through version numbers - SL 3 coming out soon when SL 2 hasn't even been widely tested it seems? Seems like typical MS tactics... they probably want to get the version to around 10 as quickly as possible to give users the perception that they have been around as long as Flash (now in v10) - good ol' release now fix later mentality we've come to expect in MS products...

doesntwork     Oct 07, 2009
"Microsoft Silverlight may not be supported on your computer's hardware or operating system. "

Jamie     Oct 07, 2009
@Davide Andrea: I laughed out loud at your comment. I'm still running Windows over here -- haven't switched back to the Mac (but I will). I've got a bare bones install here -- no word processor! I guess I should've at least used Google to create the document but I just sort of manually edited it. Never realized how bad I was with my its and it's until you pointed it out!

@Richard: I left out a lot, good and bad. Let me put it this way: For everything that was amazingly better than what I'm used to developing in ActionScript with, I found something that was catastrophically worse. I expect I'll be writing more thoughts in the future about these things that will continue this sort of constructive dialogue. The bottom line is that I agree with you that both Silverlight and Flash are great platforms. They both have imperfections. And I for one am rooting that they push each other to be better than either by themselves.

@Flash Framer and @Al: You know a lot of people have the same concerns about Flash. "What if the user doesn't have the plugin?" "I don't want this plugin installed on my machine." There's no chicken or egg thing for me when it comes to plugin installs -- if you build it, they will come. Make good work and people will download to see it. This is how Flash got to where it is. As far as not downloading it on principle? Microsoft hasn't made decisions I agree with on a lot of things in the past -- but neither has Google, Adobe, Apple or really any business. To me this is like stating Babe Ruth is a bad baseball player because he was a womanizer. He might not have been the greatest off the field, but he was on while playing and I prefer to look at the specific body of work in question. And while I wouldn't say Silverlight is the Babe Ruth of browser plugins, I will say that keeping an open mind to the platform regardless of it's manufacturer is a healthy mindset. Especially in an industry that changes so rapidly.

@Vanja: Never say never. ;)



Al     Oct 07, 2009
I still refuse to install the plugin.

Richard     Oct 07, 2009
Interesting perspective. Although I agree with a number of your points I think you are skipping over some pretty great Silverlight features. To name a few; Visual Studio actually has a debugger (!!!). It boggles my mind how the Flash community continues to tolerate debugging using traces. The ability to drop in break points, step through execution, etc has saved me many hours of debugging. ReSharper for C#, can't speak highly enough of this extension to Visual Studio, if you haven't had the pleasure of coding with this extension you owe it to yourself to look into it. Some of the Silverlight controls combined with the databinding functionality are huge time savers and make development a breeze. Not to mention that by using XAML files its easier to merge and diff when working with multiple developers (no more blackbox binary FLAs). I'd keep an eye on Silverlight, in just a year or two since its release I think its a very serious competitor to Flash.

Flash Framer     Oct 07, 2009
I understand developing in silverlight is not that bad but the problem is that it only has around 20% penetration. A lot of users don't have the plugin.

Davide Andrea     Oct 07, 2009
Would you mind terribly correcting all your "it's" to "its"? Sorry for being anal, but it detracts from an otherwise informative article. Thanks.
("It's" = "It is" or "It has"; "its" = belonging to it")

Daniel Martin     Oct 07, 2009
The Silverlight platform sounds like it would suit me better than flash, but I don't think I'd use it simply because far fewer people have it installed. Do you know why they decided to use it for your Victoria's Secret Fashion Show project.

Alex Wilson     Oct 07, 2009
Great article, lots of good details and a thorough analysis. Thanks!

"animate it back to it's initial position in the rollout" ->
"animate it back to its initial position in the rollout"

Jan Aagaard     Oct 07, 2009
C# 4.0 will get default values as a shorthand for constructor overloading. Overloading is more flexible, so this is still possible. Performance wise I am quite sure that there is no difference between the two methods, since everything is wired up at compile time.

פורומים     Oct 07, 2009
The big question is how hard MS is going to push the silverlight. If they will embed it into all win7, than flash wioll have a serious competitor

Alberto     Oct 07, 2009
Great post Jamie, you definitively make it more clear to me about SL.
I totally agree with you, I would never even think about using it if not in a OSX environment.
Also, the video issue is correct if using the plug-in in windows..I believe in OSX is doing much worse than Flash does..
Anyway, I really liked the project!

Vanja     Oct 07, 2009
Great article, but you should never do something like this:
((usercontrol.FindName("uc") as UserControl).FindName("nestedUserControl") as UserControl)

It defeats the purpose of View / Code separation completely and leaves you vulnerable if the UserControl moves/deletes/renames the "nestedUserControl".

Jamie Kosoy     Oct 06, 2009
@Mike: Excellent points, some of which have already been covered in previous comments. And I definitely appreciate the offer for expertise! A lot was figured out on the fly, so having people to bounce ideas off of is always a good thing. This dialogue between communities is a good one -- much like the ongoing dialogue between the Flash and standards communities is important.

To your points:

- With regards to Visibility, as mentioned before I understand where the intent is here. I'm simply stating that in virtually every other programming language with the intent of manipulating graphics there is a simple boolean value for visibility. It's not a terribly big deal, but you have to agree that anyone coming into the language is going to think typing Visibility = Visibility.Visible is a little wacky. Same deal for the dependency property settings -- if I know it's in a Canvas and I want to change it's Y position, the language should be capable of easing the pain. This is the stuff I typed the most often and while I realize I could just write my own wrapper, the point is that I shouldn't have to. I say the same thing about choosing a random number in ActionScript.

- My Linq example was specifically for querying existing XML. No manipulating, just accessing. It's not that Linq is bad... I just think E4X is better.

- The site we built is atypical from the way conventional Silverlight applications are constructed. I can't possibly get into specifics here -- maybe it's best covered in another post or a session or something -- but the long and the short of it was that we needed all the code to be centralized in a single XAP and then load in artwork separately as needed. There is no code in any XAPs other than our main. As a result, accessing properties required a less strict method and a lot of carefully named objects. We basically applied our model for building Flash sites to Silverlight. More details coming, I promise.

Mike Brown     Oct 06, 2009
Jamie, your post is interesting because it's the first commentary on Silverlight from a Flash developer who has actually created a silverlight app (other Flash Silverlight comparisons usually come from first impressions based on cursory experimentation). I think a few of your issues with Silverlight are a matter of familiarity instead of inherent flaws in the system.

The reason for the Visibility property being an enumeration (Visibility.Visible and Visibility.Collapsed) is for compatibility with WPF (which has a third state Visibility.Hidden which makes the element hidden but it still takes space as if it were there same as if you set Opacity=0).

Linq isn't optimized for manipulating XML as much as for querying. There are simpler XML APIs for manipulation.

When you give an element in your XAML a Name (e.g. using x:Name="Foo") within the context (code-behind) of that control, you will have access to a strongly typed variable of that element with the name you gave it. So if you have MySuperHotVictoriaSecretModelControl with a button named pushMe in your XAML the MySuperHotVictoriaSecretModelControl codebehind will have a button variable named pushMe available to it. No findControl needed.

XML Manipulation will be easier in .NET 4 (when C# will have dynamic support) or as someone else mentioned a Dynamic .NET language. C# is strongly typed and because the compiler doesn't know the structure of dynamically loaded XML file, it cannot provide properties for the elements in the XML. (If that makes sense).

Setting values on attached properties (e.g. UserControl.SetValue(Canvas.LeftProperty,10) is optimized for XAML rather than within C#. For the most part the preferred method of manipulating the UI through C# is to expose properties that represent those values and binding to them in the XAML.

If you'd like to continue your journey of Silverlight enlightenment, I'd be more than happy to provide pointers to resources to becoming more proficient with Silverlight. Once you learn the "Silverlight Way" the platform REALLY shines.

Either way, congratulations on an excellent website and for having the open mind to expand your horizons!

--Mike


Todd Sotheren     Oct 06, 2009
If the bounce rate is already supposedly so bad for Flash sites, how much worse is it going to be for sites requiring Silverlight Player ?!

Jamie     Oct 06, 2009
@Jeremiah: I'm not saying there isn't a rationale for the SetValue, Visibility and other assorted parameters. They're totally grounded in logic... except that they are a barrier to new developers coming in because they don't make a shred of sense at a glance. Maybe x,y only works for Canvas' and true/false is wrapped behind the scenes for Collapsed/Visible. Programming is confusing enough as it stands before you have engineers start making decisions based on their needs and not the end users. In this case, the end user is the C# developer, and every effort should be made to make the language straightforward.

At some point I'll do a write up for how we structured the Fashion Show site and why FindName was vital to it. I'll give you a hint: 16 different XAP files being loaded in on demand. Believe me when I say that I don't think we built a typical Silverlight site, and it was really, really, really REALLY required. :)

Jeremiah Morrill     Oct 06, 2009
Great writeup! It really shows you took the time to learn SL and C#. Some reasoning behind stuff might not be obvious right away, specially if you are coming from another platform. Like the reason there is no movieclip.x and you have to do Canvas.SetLeft(...). The SetLeft(...) method sets the LeftProperty dependency property to the movieclip. This LeftProperty only has meaning if the movieclip is in a canvas. Within something like a Grid panel or a WrapPanel, the layout will have a different behavior, and you would use something like: Grid.SetRow(...).

While I certainly see the argument for visible being a bool, the reason it's not was to make it more compatible with desktop WPF code/xaml. In desktop WPF we have Visible, Collapse and Hidden in the enum, so a bool wouldn't quite fit that.

As for using the SL DOM. I hate to sound snobby (I know it will), but if it seems difficult, it's probably not designed to work that way. You can spend your SL career and never need FindName(...). I think lookless controls (controls w/ a default template in generic.xaml) and OnApplyTemplate() override and use the GetTemplateChild(...) are a more predictable way to pull references to items in your template.

The Visual State Manager might be the hot ticket for you when doing things like rollovers/outs.

Again, great article. Funny at parts too!

Matt Kenefick     Oct 06, 2009
It'll only be a matter of time until jQuery traversing/selectors take over everything for all XML and such.

XML.$('moop #id[value="apple"]');

Sounds simple enough to me.

Jamie     Oct 06, 2009
Thanks for the compliments on the site everyone. Really humbling to hear that kind of feedback.

@Ben: Did not look into IronRuby or any other languages for this one. Didn't really see the need honestly... I think C# is really solid on it's own and would probably stick with it. But we'll investigate our options going forward for sure.

@Jon: We actually used states for everything in the site. I didn't really want to dive too deeply into the entire animation conceptual model because that warrants a blog post all on it's own. I was just highlighting the fundamental difference between the way animations are handled. Maybe rollover/rollout was a bad example. :)

@Ricardo: Excellent link. I have a whole slew of blogs I checked often along the way, I just found shinedraw the single most straightforward resource. I'll share a link dump at some point.

@felix: I'm sensing a little hostility toward the plugin, hahahaha. :) You could argue using a dozen different technologies -- why not build it in standards, or in unity? Or in Flash? The short answer is that Microsoft was a partner on the site, so the technology being used was a foregone conclusion. But that's letting it off too easy. If we don't push the technology to it's limits how will it ever improve? We're psyched to keep trying new platforms and to learn and push the limits of their capabilities. The jumpiness is probably a combination of the plugin at it's limits and our inexperience in optimizing the assets to produce to their fullest. I'm super proud of it. I think it stands tall with any site or application we've produced before.

@Jeff: Hey, give me a break on my Linq! I'm new to this. Hahaha. As I mentioned to Jon, I was simply giving an example of how Storyboards work to the uninitiated. I think they warrant a blog post that clarifies all on their own. As for the iPhone development on Windows, there's a clear difference here: Everybody wants to make iPhone applications. Silverlight is fighting the uphill battle to be recognized as a legitimate platform by the larger development community on the Internet. If it were in Apple's interests to encourage further development by extending to Windows, they'd have already done it. Unfortunate? Yes. But that's where we're at and so the ball is in Microsoft's court to come to where the developers are.

Jeff Klawiter     Oct 06, 2009
The linq could be a bit smaller using lambdas. xmlDocument.Descendants("moop").Where(x=>x.Attribute("id").Value == "apple");

If you want something like E4X you could use the Xpath navigator. Which is definitely more concise and smaller but harder to read for new people.

Another nice thing is you could mimic E4X with a few extension methods. I wonder if someone has already done them.

With Storyboards, you can tween multiple properties at once, so you can combine the alpha and the movement into one story board. This eliminates having to run two storyboards at the same time and the mess that comes with trying to sync them up.

Yes.. I agree visibility is a bit verbose. It should be IsVisible = true/false.

You can create your classes in folders and visual studio will automatically put them into a Namespace of that folder. So you do a add class in Controls/NewControl.cs . Visual Studio would put it into projectNamespace.Controls

I agree with the Setting of the position and not having an X/Y property. It took me a while to get used to it (I come from desktop and windows mobile background.. before that PHP). The reason it is that way is because a control can live in different types of containers. So in essence the container is doing the positioning, the control knows nothing of where it is.

I used to default to using Canvas for everything but lately I've been using grid more and actually finding it easier to control a lot of my layout.

You can do silverlight development on OS X with the eclipse builder. I think you can do some of it in MonoDevelop. Unfortunately there doesn't seem to be much in the way of designer support for OS X yet.

On the flipside I wish Apple would make iPhone development easier in Windows. Or at least allow OS X to be virtualized.

Ricardo Castelhano     Oct 06, 2009
Great post. I'm a "plugin guy" as I work with FlashPlatform and Silverlight.
You have other resource similar to ShineDraw:

Project Rosetta - http://www.projectrosetta.com

This website is managed by Adam Kinney, Msft Blend and SL evangelist and have "From Flash to Silverlight" and "From AS3 to SL3 C#" tutorials.

Great work on the Victoria's project ... congratulations mate.
Cheers from Portugal

Jon Galloway     Oct 06, 2009
Very interesting post! As a Silverlight deveoper, it was great to read such a thorough comparison with Flash development.

One question - the issue you mentioned with having to handle two animations for things like rollovers is generally a lot easier in Silverlight with Visual States - just set the propertes states and Silverlight handles the animations. Was there a limitation that prevented you from using that?

felix     Oct 06, 2009
Congrats on a great site! About the best I've seen using Silverlight to date. The 3D gallery was nice and smooth. The animations and transitions were a little jumpy on my Mac and the video playback didn't seem much better than the equivalent Flash site. I'm curious why you built it with silverlight?

Ben     Oct 06, 2009
Nice post, Jamie. Very cool to hear impressions from a pro. The VS site is stunning no matter what was used to make it; proof that it's the designers and developers that make the work, not the technology. Way to go. :) Have you considered trying IronRuby or Python to develop silverlight apps in the future?


Speak






Submit »