After hearing a lot about Microsoft's Silverlight recently (that and the possibility of loot to be had via a Silverlight coding competition at work :)), I decided to try my hand at a bit of Silverlight development. Basically the idea was to try and build a small demo app that showed off some really wacky stuff that isn't really possible (or practical) to implement using existing web based technologies.
I pretty soon settled on the vague idea of interacting with some sort of third party web service in order to test out Silverlight's ability to leverage existing services and visualise them in strange new ways. Once I'd decided on this I pretty quickly decided to do something with Amazon.com's e-commerce API as I had had some previous experience using it. At the same time I was also fooling around with creating a game based around swarm intelligence (and since got bored of before finishing) which had me thinking about cells and networks.
Combining these two thoughts gave me the idea of writing an application which could search over Amazon's catalogue of books and visualise the results as a group of physical nodes. The user would then be able to drill down into the nodes to find books that were similar, where similar nodes would be connected to the original node creating a visual network.
So after coming up with the idea I looked into actually implementing it and to my dismay I found that Silverlight 1.1 was designed only to work with the upcoming Visual studio Orcas, not Visual Studio 2005. However with a bit of jiggery pokery I was able to get it all running fine in Visual Studio 2005 sans the ability to debug (but my programs contain no errors anyway so that was no problem!).
The web service
Silverlight 1.1 has the ability to with asmx web services using JSON, however it (as of the alpha release) allow you to make cross domain web service calls. This meant that in order to query Amazon's services I would have to write a proxy web service sitting on the same domain that forward the requests on to Amazon then send the results back to the Silverlight client. Though this makes accessing 3rd party services more work, it is relatively painless as there is no difference in writing a Silverlight accessible web service from a standard asmx web service apart from tagging the service class with the [ScriptService] attribute.
Rag-doll physics?
Since I was going to create a visual representation of nodes and links, I thought that the whole app would function much better if everything had a physical tactile feel to it and that the nodes would self arrange in to easily viewable formations, and that meant adding... physics. In the end I decided to model the system as a series of particles which repel one another (meaning that they would arrange themselves nicely on screen) and can optionally be connected by springs (for related nodes).
I implemented this physics model using a simplified Verlet integration scheme (sounds very elaborate but its actually quite straightforward - there's a good article on implementing it here). This method used to be quite popular in the games industry for simulating cloth and rag-doll effects and was used in titles such as Hitman: codename 47 before the industry moved toward more advanced techniques such as inverse kinematics and constrained-rigid-body approaches.
A handy thing I found while developing the physics engine was that because Silverlight uses the same CLR as the full .net framework I could write the physics engine as a standard .net 2.0 class library and test it using a simple Winforms client (as I couldn't do any debugging with Silverlight) then when I was happy with it, I could import it straight into my Silverlight solution, and after changing some references from the standard .net assemblies to the silverlight assemblies it ran fine.
Silverlight client
After implementing the web service back-end and the physics model it was time to hook it all up with some Silverlight eye-candy. Due to the fact the I was working with an alpha release, there is very little in the way of user controls available. This means that unfortunately many standard components such as text boxes and buttons have to be made from scratch. In saying this though, Dave Relyea has produced a controls framework (found here) containing many of these standard controls and though I didn't use his framework I did use some elements of his text-box control when developing my own.
While most of the effects found in WPF are present in Silverlight there are still a few omissions which I found to be a bit annoying, in particular the bitmap effects such as blur are not included in Silverlight which meant that I couldn't add in all the effects I had originally planned, hopefully these effects will be added in for the final release.
On the plus side, I was impressed by Silverlight's rendering speed even at this early stage in its development, as I went out of my way to fill the whole screen up with as many shiny gradients and subtle animations as possible (in addition to the physics modelling) and it still ran along at a decent clip and was responsive to user input even on lower spec machines.
Not just eye candy
In addition to the draggable books and physics already in-place I wanted to try and implement something that would at least hint at the fact the having all this rich client functionality allows developers to create experiences that are not only more attractive, but also more responsive and in some ways fundamentally different to what is possible using traditional web technologies. My attempt at this was to implement some gesture based controls into the application such that if you shook a book that was connected to another book it would break the link between them, this made it much easier to keep books you wanted on screen and delete unwanted items in a way that felt natural given the physical representation of the books on-screen. While I didn't have the opportunity to pursue further gesture based controls, It certainly would have been possible to remove almost all the buttons from the GUI and have an entirely gesture based interface.
While its very debatable whether my application is useful rather than just fun to play around with, I think it does illustrate the point that Silverlight has a lot of potential to create some very interesting and powerful experiences on the web, and while there are certainly some issues present in the current releases, I can only see it getting better from here.
If you want to check it out my app, I've got a demo here. If you want to take a look at the source code I've got a copy here (updated to run with Silverlight)
Comments
James Says
Awesome app man :-) very impressive!
Ritesh Says
This looks awesome. I tried it but couldn't get it running. I download silverlight 2.0 but still getting some errors..not sure why...still this really looks great..congrats
Glenn Says
Cheers, It doesn't currently run on silverlight 2.0, but I'm working on porting it over now :)
Live Says
Hello Mr Sharpoblunto, I wanted to ask you if I could use the code that you provided as a part of an application. The application might have commercial application in the future and I've wanted to know the copyright policy that you adopted. Thanks in advance, Miguel Grade
Glenn Says
The code is released under the terms of the MIT license so its very permissive in terms of using the code for pretty much anything you want. The only condition is the software must include the copyright declaration found in the license.txt file in the source (If the file isn't in there download the latest copy of the source)
Pete Says
this doesn't appear to be working with the latest client...any chance on it being updated?
Glenn Says
If you see some of my later blog entries on this app, I have kept it updated. It works with the latest version of the silverlight runtime (2 Beta 2), are you sure you have this version installed? What problem did you have when you tried to use it?
Osiris Says
You are a very sick man! You UML-afied Amazon!!! Twisted, disturbing... neato! I would have never thought of something as weird as this and it makes me MAD. I am highly impressed with your "outside of the box" thinking. Excellent mashup with some serious potential for other areas of application. Take care and keep it up; Robb
New Comment