When Written: June 2007
I am sitting beside the Ring of Brodgar in Orkney, the second largest stone circle in the British Isles, when my Blackberry Perl mobile phone pings me with an email reminding me of a project I need to quote for. Surrounded by this great Neolithic monument, engulfed in the silence of the area, broken only by the frantic birdcalls of the oyster catchers, my thoughts turn to some of the conversations I’ve had over the last month or so about application development and the need and desire for this to be as rapid as possible. Back in Neolithic times we can only wonder what made them build such monuments, and guess at how long it would take them. It is now thought that they only needed three days work each week to fulfil their food needs, the rest of the week was free! With such long weekends there was no need for speed, and if we consider, as many do, that this circle of stones was some kind of device for calculating events in the calendar, then it could possibly
be considered a very early application.
Fast forwarding to today’s requirements of web application development, I was treated to lunch by Microsoft, which turned out to be most enjoyable, although when the initial single Microsoft person, increased to three plus one from their PR agency, I did start to wonder if I was not being fattened up for the slaughter! I need not have worried though, and the topics of conversations varied from the future of TV through web application development and not unexpectedly to WinFX ( now known as .NET Framework 3 ) and WPF ( Windows Presentation Foundation ) and XAML ( an XML based language for describing design elements). One of the people at the table was an old friend from Macromedia, Jon Harris who has been appointed User Experience evangelist (UXe) for Microsoft UK. His knowledge and enthusiasm for the subject of user interface design means that it is always worth listening to what he has to say. He was one of the instigators of the ‘Halo’ design philosophy at Macromedia and turns out that several of the people from Macromedia are now working for Microsoft since Macromedia’s take over by Adobe. This probably explains the appearance of web development tools like the Expression range. It seems that Microsoft is making real efforts to woo the designer community, traditionally an Adobe and Mac based sect of people. One such product which addresses this previously ignored area by Microsoft, Silverlight. This uses the new technology of XAML, and has been referred to in many articles as Microsoft’s Flash killer. Microsoft are very keen to point out to anyone who is prepared to take the time to listen that whilst Silverlight will achieve similar results to Flash it does so in a completely different fashion, and has different aims, so pull up a chair and I will attempt to explain how XMAL works and why you or your designers should start looking at it.
Silverlight and Flash
One of the first questions anyone involved in web application design should ask about a new technology is which browsers and what operating systems will it run on? If it is very limited in this area then its usefulness to the web application builder is also limited. Previously this limitation was something that was justifiably levelled at XAML as it would only work with an Active X plug in to IE on Windows. However now it will work on IE, Firefox, Netscape on Windows and OSX, and Safari on OSX. Support for the Opera browser and Linux was also announced this week as I write. It does this via a downloadable plug in much like the Flash player, ( no honestly it is different to Flash! ). XAML enables the web developer to apply custom user interfaces and add animation as well as playing video clips and streams within a web page ( yes I know Flash does this as well but it is different ). The animation is designed using timelines and key frames in the design tool ( yes, yes just like Flash! But how else would you provide an animation design tool without using timelines? ) .
Where things get different is also where some people who have just ‘dabbled’ with Silverlight also criticize it. Silverlight is supposed to be a way of building a user interface and yet in the selection of items that can be dragged into the design area it has no text boxes, nor dropdown lists nor buttons, nor anything that looks like the sort of objects you might need to design a user interface. Sure, it has box and circle drawing tools as well as line and fill controls, but surely Microsoft don’t expect us to draw a text box from scratch each time we need one? Well the answer is that of course they don’t. With Silverlight ,the way you might design a particular user interface is to build a web page using the standard form controls in HTML, this will give us the text boxes, drop down lists, check boxes and buttons that we need. You might do this in Dreamweaver for example, just as you would for any web form you might design. Then you open this page in Silverlight and start to enhance the design by drawing boxes, colouring the controls, and letting your creative skills run riot. This ‘design layer’ is created as a text XAML file which is used to ‘skin’ the web form.
With a little thought one can start to see the advantages to this ‘skinning’ technique compared to the Flash way of designing a user interface, where the whole form including validation of controls, linking to data sources as well as deciding on what type of controls were needed, is all done within the Flash design environment. In Flash if you need to change some of the functionality of your application, the design tool has to be opened, the design edited, and then a new Flash movie file compiled. The same process needs to be done for a simple change of text or a colour in the same application. Now consider the way Microsoft proposes to achieve the same result. The basic form is built ( design is not a term that would be used at this point ) the functionality and validation would be coded and tested. Then this web page would be passed on to the design stage, perhaps to a different person with such skills but no or little coding skills. This person would then work their magic converting a simple web form into an interactive web application. I have seen a demo where a simple dropdown list is converted to a fan of images which fly in and out depending on the user’s selection, and this transformation was done only with an XAML ‘skin’. Should a small change, say of a colour to match some other image or logo, then as XAML is just a text file one could edit it the respective colour value with notepad, rather than, with Flash, having to rebuild the Flash movie file again.
Silverlight, attempts to keep programmers and designers appart
What is xbap?
By now you should be able to start to see one of the major aims of Microsoft. Using this technology they hope to separate the programmer’s job from the designer’s, a move that many of us would applaud. Being able to separate these two areas would help a lot of developers as well as designers; I have yet to be convinced that we are there yet but it’s a move in the right direction. Certainly developing under Flash and Adobe’s Flex development environment which they have just made Open Source means that the two roles are very much combined. I think any Flash designer needs to learn action script to achieve anything of note, which makes them currently a rare and valuable resource, being both a designer and a programmer.
The British library book viewer shows the XAML way to go
Silverlight applications will also run on mobile devices but the plan is for them only to run within the browser. Desktop applications may talk to back-end web services but currently the view is that they will be written as a more conventional application that needs to be installed. Currently Microsoft has no plans for Silverlight to work outside the browser, unlike Adobe who is trailing their Apollo technology which allows web applications to run on a desktop machine. There are possible security considerations to allowing web applications full access to the desktop machine but allowing such access would enable much more functionality to be built into the web application. If you want to see the sort of thing that can be done with this technology, first you will need .NET 3 Framework installed on your machine ( a free download or it should be already there if you are running Vista ) , then take a look at the British Library beta book viewer at http://ttpdownload.bl.uk/browserapp.xbap .Whenever I show this to people their jaws just drop, particularly when they are told that this is a web application and not some huge application installed from a CD. You can view some of the most famous books in the Library and turn the pages with a very realistic animation effect, you can use a virtual magnifier to view things like the author’s margin comments; if the text is difficult to read there is a plain text panel that can be opened as well as an audio feed that reads the book to you. If you are a registered user you can also use the notepad window provided to make notes which are then bookmarked to the relevant page, it really is an amazing piece of work. If you ever had any doubt that Web applications had a future and thought that perhaps they were just a curious ‘flash in the pan’ then this one web application should be enough to get you thinking.
For more ideas of what can be done just take a look at http://sp.warnermycal.com/vista/contents/preview.xbap for a trial of a film preview site or perhaps http://weathernews.com/wpfglobal.xbap if weather is your interest. You may be wondering at the file extension, it stands for XAML Browser application and you can consider it like .exe but these applications only run within a browser. These are just some of the stunning demonstrations that are being done, I’m sure there are many more, if you know of a particularly good one please email me at firstname.lastname@example.org. Currently search engines will not be able to index xbap applications, but I would guess that many sites will use these new applications to enhance their current site which would be indexed. Hopefully the search engines will do some work on their crawlers so that they aren’t confused by modern web application sites, it is really about time that we had to stop coding around a search engine crawler who’s job it should be to simply index web sites instead of censoring pages if it doesn’t like a piece of code on the particular page, but that is probably for another article!
Article by: Mark Newton
Published in: Mark Newton