James Bannan31 August 2007, 4:53 AM
Microsoft's vision for future web interactivity will revolve heavily around Silverlight - a new development platform that's accessible on Macs and PCs alike.
A major new development from Microsoft is Silverlight – a cross-browser, cross-platform plugin which is designed to deliver a rich, interactive online media experience. It leverages off existing programming languages like AJAX, VB, C#, Python and Ruby, and can integrate with just about anything that’s out there.
At the recent Microsoft Tech.Ed 2007 convention I caught up with Michael Kordahi, a Silverlight product evangelist to find what makes Silverlight tick.
 Michael Kordahi |
MK: The easiest way to describe Silverlight is that it's a plug in for your browser which allows you to experience rich interactive content. If you consider the internet stack today, you have HTML, HTML scripting where you can modify bits of the DOM, and then Ajax came along and loaded with it with really nice, rich content. Ajax does a fantastic job and it's all Javascript, really. We think the next level up is something like Silverlight, which sits within your browser but instead of being part of the DOM, it's a plug in.
JB: An ActiveX control?
MK: Well that depends on the browser – it’s an ActiveX control on IE and an add-in for Firefox. It also runs fine on Safari and Opera. Essentially it's a rich bit of code that runs anywhere within the browser - it can fill the entire browser or just parts of the screen. But it allows you to add interactivity with animation and media. Then there’s the next level again which is based on WPF. WPF allows you to create rich desktop apps that touch the GPU so you can create graphics-intensive browser applications. You can also touch local file systems to cache video and interact directly with .NET. If the world was all Vista, WPF would be a beautiful thing. You can do really rich stuff like zooming into infinite levels of detail because at that point you’re touching the graphics hardware of your machine. You can do great things like creating 3D spinning spheres and all that sort of stuff.
Silverlight is focused on being cross browser and cross platform so that anybody can use it, so it’s best to think of it as a browser-based plugin. Silverlight 1.0 is in RC (Release Candidate) at the moment and the final release will be out soon. 1.0 is all scriptable via Javascript which we’re finding to be of great value for developers - there’s not much of a learning curve for them to start using it straight away.
Orcas is the next release for Visual Studio. From my personal experience, one of the biggest improvements in it is the Javascript capabilities. Now you can do telesense, colour code, bit bugging...all sorts of things, and you can fully interact with the Silverlight object.
The two values of that are:
(a) you’re using a model that you understand, but
(b) you have the ability to interface with other non-specific pages.
If you look at what Discovery Channel did recently – Discovery Channel Asia – they built a site called Never Miss TV. If you missed a show on the Discovery Channel you can go on the website and watch last night’s episodes of the shows. But the bit that they didn’t have right was the video playback method, which they had a lot of trouble with. Now they’ve got Windows Media server at the backend and it's all streaming WMV.
What they did was build a Silverlight player which gave them the basic player framework with slider controls and volumes but the rest of the site was all HTML and AJAX. So when you add a playlist or sign-in, you’re doing it through their existing site but then when they want the media player to play a video, they just pull a method on the player and play the video. And that’s the real advantage of being able to interact with the Silverlight object via Javascript.
So that’s version 1.0. Version 1.1 is in alpha release at the moment and that adds a layer on top, which will enable you to have a runtime on the player. It comes with a CLR which is the common language runtime, which is a cut-down version of .NET Framework. You can write C# code, IronRuby, IronPython or Javascript. There’s a whole bunch of demos demonstrating how fast the performance is. It's going to bring a whole bunch of languages which people already know and understand and allow them to do Silverlight as well.
It’s secure as well – it exists in a virtual environment. The browser essentially controls what happens at the system level to ensure you can’t do anything malicious. It's the same on the Mac too - it's a virtual environment that looks the same on the Mac and on the PC.
The significant thing about this – and this is a problem that many companies are faced with today – is that there’s a lot of investment in Windows Media backend infrastructure. There’s all this WMV content out on the web. How do you put that in the browser? You can embed the media player, and write a whole bunch of code to make it run on non-IE browsers, but it's not the most pleasant nor the easiest way to go.
That’s one of the fundamental things Silverlight addresses. It allows you to create using a cross-platform standard. If a video opens on a Mac it will look exactly the same as on Windows. It allows you to use one standard interface to deliver Windows Media to the client and add richness to it so things like video overlays, tracking and menus work seamlessly.
JB: What tools do you need to build your own Silverlight container?
MK: There’s a suite of products called Expression Suite which came out in April, which is composed of four products – there’s Expression Web, Expression Blend, Expression Design and Expression Media. If you go to silverlight.net there’s information on all those products, as well as a load of Silverlight demos. Expression Web is essentially a web editing tool - HTML, Javascript and CSS.
FrontPage has kind of gone onto a new life as part of the Office Suite and is very much focused on creating content within SharePoint. Internal office productivity stuff. Expression Web is really about considering standards when you’re building sites. So one of the biggest bits of feedback from FrontPage is that it's actually too clever. It adds a whole bunch of features that you didn’t want it to do. So what Expression Web does is it's very much built around CSS, everything happens in DIVs and it's very much a web based, web standards orientated tool.
JB: Very similar to Dreamweaver in that aspect.
MK: They fulfil the same requirements. So that’s Expression Web. Expression Blend is probably the most significant product in the suite in my opinion. Expression Blend is where you create canvases. Expression Blend is a very designer-orientated illustration tool so that you can create canvases in a visual environment.
Then, all the images and assets components of your projects sit in Expression Media. But Blend is where your designer will design and create the canvases, so that’s really the most important application. Significantly Blend produces something called XAML and that’s the key - eXtensible Application Markup Language. When a designer uses Blend and paints a canvas they produce this XML file called XAML. A Visual Studio developer can open the same file. So the Visual Studio developer goes away and works on their aspect of the application, while at the same time the designer can continue to refine the interface.
What happens today is that when a designer goes and designs a site, there’s a point where they have to stop working and hand it over to a developer. Then any changes which come from a designer after that become difficult to implement because the developer has already started to do their thing. What XAML allows you to do is have the project exist in the XML file format end-to-end, so even though they use some nice design tools, it's all unified across the XML file format. The developer codes off that XML file format and they can collaborate for longer. In terms of developer and designer workflow, that’s fairly significant. They’re not using two separate file formats to do things.
You can play around with it XAML now – if you go to silverlight.net you can download a copy of it. One of the nicest things about Silverlight video playback is that you can flip into full screen mode, and it’s true full screen video rather than simply upscaled video. So you can add controls and keep the interface and the experience in a full screen mode, just like you would in Windows Media Player. page.
Go to silverlight.net and you’ll get the install experience. There are loads of demos and presentations, but you must watch the major league baseball video. It's actually one big Silverlight ad but the whole idea is to keep the fan watching the game. So you’re watching the game and all of a sudden your favourite baseballer hits and you can click on the ball and bring up stats. As you’re watching it an overlay happens, like an transferring overlay, with all stats on that player or that game or whatever. Then you can drill down and do stuff while you’re still watching – you never have to deal with a popup window and you never navigate away from the game. Then you can slide that overlay away and pull up other.
 Installing Silverlight 1.0 |
Then, as part of the buddy system, your friend is doing something else and he says ‘Dude you’ve got to check it out – Billy Bob went and hit a home run’ or whatever. They click on a link and they send it to you within the same Silverlight interface. You get a little alert and a video plays with the relevant content. So you’re still watching the game as well as a little video of Billy Bob hitting the ball. You click on that, it goes full screen and the game goes into digital picture mode. At no point in time do you ever stop watching this game.
So this is stuff that’s hard to do today. Without writing a full game and really hard core desktop stuff, it's hard to keep the experience immersive in a way that still maintains performance.
 Zero Gravity - an application written in Silverlight 1.1 Alpha |
JB: How dependant is all of this on high bandwidth availability?
MK: Well, bandwidth is bandwidth andSilverlight doesn’t change that equation. If you’ve got low bandwidth and high quality video then clearly you’re going to have issues with it.
So as a content provider, decisions get made early on. Usually what happens is that you can do multi-streaming. So you can select your stream when you start and you can choose the low bandwidth version or the high bandwidth version. But from a developer point of view because it's all driven by XAML, it's actually pretty lightweight. Regardless of the video that you might be pumping through, it's fairly light because you’ve got this XML which defines your app, then as you bring content in like buddy lists, you’re not doing major refreshes. You’re just bringing in bits of XML and adding that to the canvas at design time.
JB: It sounds ideal for stuff like IPTV on a media centre especially if you’ve got ADSL2+ and a nice widescreen TV. Are there any plans on that sort of take-up or is it still all a bit too new?
MK: Vista Media Centre is kind of a separate story. With VMC you have a guaranteed desktop platform, so you know what you’re working with. With Silverlight you’re working with Macs, PCs, slow machines, fast machines...it’s all different. With Vista Media Centre, you know you’ve got a Vista machine, you know you’ve got a decent graphics card, you know exactly what capabilities you have. So that’s why a lot of the Vista Media Centre add-ons that you see are actually written in WPF.
I haven’t talked enough about WPF and we will run out of time if I go down that path. But they share a lot of similar technologies – you create WPF through Blend and Visual Studio. On the media centre side you’d probably write WPF rather than Silverlight. One of my favourite Vista Media Centre addins is written by a guy in Melbourne - it attaches to Flickr and allows you to navigate a Flickr account. It's a total media centre experience based around Flickr photos. You can go to your friends and look at their photos and all that kind of stuff. Having said that, you can bring up Silverlight through a media centre and distribute it through an extender. So a VMC app can be Silverlight, WPF, or even HTML if you really want to disappointingly use one. But the recommended way to write VMC apps is definitely WPF or MCML which is Media Centre Markup Language and that’s the hardcore way to write VMC apps.
They all share similar kind of attributes but the ones that are most closely related are Silverlight and WPF and then it basically comes down to rich versus richer. If you wanted the richest most possible experience, you’d go WPF. But you have to consider that it's running on .NET, so if you want to be able to reach the greatest amount of customers you’d use Silverlight.