On the 22nd of July I attended the UK launch of Silverlight and Expression Studio 3 over at Microsoft London. As you may have realized Silverlight isn’t really my main area of expertise, and I’m not planning to change that, just in case you were worried :).

The start time was at 1:30pm and the afternoon was split into two sessions but were really just a mix up of case studies and demos for agencies currently using Silverlight in their projects. The first session was about SketchFlow and Blend, and the second was on Expression Web and also on Silverlight it’s self. There was a lot of interesting stuff in the presentations but also some things that I wasn’t quite happy about.

Better Composition and Planning.

Expression SketchFlow is a piece of software which enabled the designers to import sketches, or create wireframes using components provided to create a version of a site for the client that exactly mimics the functionality of how the final product will look. To help with this process, ‘Sketch’ components are provided that function exactly like you would expect components too, for example a scroll bar, but they appear as if they were sketched. This is useful because;

1. It saves time having to create any graphics.
2. It prevents clients from focusing on the graphical side of things and just understanding how the function will work, not the form.

Once you have created you ‘sketch’ layout and used the components you need to, you can then to mimic even more functionality, can use SketchFlow’s built in states which are used for things like tabs, where you have an over, up, down, etc state. With SketchFlow you can plan for all of these and create basic animation which is not dissimilar to timeline animation in Flash. Also new to Silverlight 3 is built in easing effects to achieve are more professional animation.

The next part of the composition stage of the workflow is presenting the comp to the client. There are many ways in which Blend can do this like exporting to a Word document, but there is an even better way. It can generate an online application which is on your web server and loads in the current composition, and then the client can browse through all the revisions and leave feedback. All animation can be viewed and components can be interacted with, which means that the client can gain the full idea of what the user interaction is going to be like. This method is far superior to most used before like building a HTML version. This was hard to maintain and used up a lot of valuable time.

A streaming experience like never before. Pfft.

With Silverlight’s new media capabilities like real HD and adjustive streaming it’s not hard to see why NBC broadcasted Wimbledon and the Olympics in it.

According to the presenter, loading times are a thing of the past. Silverlight’s streaming capabilities have been designed so that they adapt to the current bandwidth. So if they are being used on a 3mb broadband connection they it will provide if possible full HD video so long as it can load it all without any delays, but if the connection is slow, the plugin realizes this and the decreases the quality of the video being played so that it can still load it all without delays. This is great as the majority of views move off a site after a while if they are sat waiting for something to load. A good example of this is the popular video sharing site YouTube which has an average watching time of 5 seconds! This is because users leave the site if they have to sit there and wait for it to load. When generating revenue from video it is crucial that you don’t loose visitors and Silverlight seems to cure one of the biggest headaches that a video sharing site faces.

Now one of the other problems with YouTube and the main reason behind its 5 second visiting time is that the player loads all off the video right to the end instead of just the first bit which is the bit people are mostly likely only going to watch. Silverlight uses a different method by dividing the video file into separate chunks and then loads them in order. This helps saves a lot of bandwidth as if people only stay the watch the first few seconds then the bandwidth won’t be wasted trying to load the whole video, but just the first bit which the user actually watched.

10 second install.

Those of you who have installed Silverlight know that it is an extremely easy install process, which Microsoft claims only takes 10 seconds. I have found this to be roughly true and I another major bonus is that I don’t even exit my browser! Compared to Flash’s installation which requires you to actually visit the Adobe site, and then quit your browser this is an oasis. It makes accessing Silverlight content even easier.

Let’s not forget good old HTML.

A lot has changed in Expression Web since I last looked at it, which I have to say was quite some time ago. One of the major new features and quite a useful one at that is SuperPreview. This is similar to Adobe BrowserLab which has recently been launched (coincidence?). In a nutshell SuperPreview allows you to view your web page using different browser rendering engines and compare them side by side. It can also tell you the position of every element in the HTML page and then show you how much it differs in one browser to another. This helps you to correct it to pixel perfection.

Also Expression Web comes with the ability to easily create and insert Silverlight DeepZoom and also Flash and other general Silverlight content with ease. Another helpful tool that works in conjunction with the other parts of the studio is Expression Encoder which allows you to take the pain out of converting and resizing video. Web utilizes this well as you can insert, convert and resize video ready for a HTML page right from within the tool with only a few clicks. This is something that is long overdue for Dreamweaver.

A very good question, 3D?

Now when we were in the Q&A session there was a very good question about what Microsoft has planned for gaming in Silverlight and how it compared to Unity3D. The speaker said he wasn’t familiar with Unity3D but that the 3D features would be improved. The next thing that was of interest was that they said that it might eventually possible to develop a game using the XNA framework and the have it run using the Silverlight plugin. Obviously the main problem with improving the graphics on a cross platform browser plugin is that you have to deal with so many different libraries and runtimes, and trying to get all these to the same level of performance and ease of use must be quite a challenge.

If Microsoft pull this off right then they could quite possibly be Unity3D’s biggest competitor and I cant see that they can stand up against something that is already on 1 in 3 internet enabled devices in the world. It’s a shame though that the presenter didn’t seem to give the impression that Microsoft were giving gaming much of a thought for the future versions of Silverlight.

What’s the catch?

So far, I have portrayed Silverlight 3 in a very good light, and with good reason. It has come on along way since I last looked at it, and if it carry’s on it’s rapid production cycle then Adobe better watch out. As the saying goes though, nothing is perfect and Silverlight is no exception. I couldn’t help but feel that all the new features and the tools themselves were aimed at big agency’s and companies with employees in their hundreds. The reason I think this is that for the average freelancer who can sit down and explain to their client what is going on, the new SketchFlow features wouldn’t really help that much. For example, the online tool to show clients what different comps the designer had come up with and the option to leave feedback would be pretty redundant for someone who can be right next to the client and explain. Although spoken explanation can only go so far and there is nothing like having a working demo with full interactivity, with SketchFlow can achieve with ease.

The next major problem that you will have all worked out by now is that the tools are still only for Windows! This is the biggest disadvantage for me as I have a MacBook and a Dell XPS. Although I can run it on my XPS, it would be nice not have to get Bootcamp up and running every time I want to work in Expression Studio. I can imagine that for studios that are 100% Mac, Silverlight will be a straight no. I expect that in time *hopefully* the tools will be released for Mac.

This last one is obvious and one that is to be expected but never the less a very important factor and on that puts of a lot of studios adopting Silverlight for projects other and research and development. It’s the adoption rate. As I mentioned earlier Silverlight is on 1 in 3 internet enabled devices but Flash player 9 is installed on 99% of all computers in the US/Canada and this is pretty much the same over all the world.

Conclusion.

Overall Silverlight has some good prospects if Microsoft carry on the rapid releases they have been while including major features in each release at the same time. Although I still feel that the penetration figures are not good enough for use right now, the easy install makes it easy to access Silverlight content so hopefully this should change. I look forward to playing around with the new Expression studio and I can’t wait to see what appears in Silverlight 4, and hopefully I’ll get invited to that launch as well!

Feel free to leave thoughts in the comments section below, and happy Silverlighting!

Harry.

Over the past few months I have acumilated quite a few interesting links in my ‘Favorite’ section on Twitter. So I thought instead of being an anti-social nerd, I could share them out to my readers. So here we go!

1. Open-source ActionScript libraries for creating Flash games : http://bit.ly/3BqFjr (via @mesh)
2. A showcase of some of the best PV3D projects out there : http://www.papervisionshowcase.com/ (via @c4rlo5)
3. Very interesting blog about games & flash to add to your reader: http://www.stephencalenderblog.com/ (via @mesh and @bartekd)
4. Amazing stop-motion video! How do they do this? http://bit.ly/wwALI (via @michaeledge)
5. ARhrrrr – An augmented reality shooter prototype http://post.ly/seY (via @rickwilliams)
6. 43 iPhone Development Resources http://bit.ly/jn3ra (via @creattica)
7. Stefano Dembro’s Robots http://www.stefanodembro.com/index.php?l=item&q=Papalote (via @joshspear)
8. Version 1.0 of today’s most popular applications, a visual tour http://bit.ly/b4Mkx (via @PSDTUTS)
9. Nice video of Flash builder 4 Developer Productivity new Features shown by David Zuckerman http://bit.ly/2XIafH (via @swfgeek)
10. Plug-in Media’s Big & Small Papervision site blends 3D with 2D very smoothly. A cut above, very nice job indeed. http://bit.ly/EXWge (via @richardleggett)

So there you go, my top 10 links for a while! I hope they are useful to you.

Harry.

You may have noticed that I have just updated my homepage with a little sign up feature that lets you enter your e-mail address and I’ll let you know when my portfolio is ready. *Don’t worry, these address will be destroyed after the notification has been sent and will not be sold or abused in anyway!* .

You can view the new page here: http://www.harrynorthover.com/, so head over there and stick your e-mail address in and i’ll let you know when my sites *finally* ready!

Harry.

This is just a quick note to say that I have just found out that my first tutorial over at The Tech Labs has gone live! It is entitled ‘Create and Skin a Photo Gallery with Flickr, Flex and Actionscript 3.0′ It can be found here:

http://www.thetechlabs.com/tutorials/flex/create-and-skin-a-photo-gallery-with-flickr-flex-and-actionscript-30/

You can follow The Tech Labs over at twitter here: @thetechlabs. Make sure you spread the word around about the tutorial!

If you have been following me on Twitter, then you may have noticed that I have been getting into Augmented Reality. This is the coolest thing I have seen in a long time! Now if you don’t know what this is, then it is a means of mapping 3D objects to a marker in the real world through a web cam.

Here is a simple guide to getting setup using the Augmented Reality in Flash. This includes downloading the library’s and then getting a simple demo up and running.

The name of the library used for Augmented Reality in Flash is called FLARToolkit which is developed by Saqoosha. It is a port of the ARToolkit which is written in C. You can download it from here through SVN. If you haven’t got a SVN client setup then I highly recommend SmartSVN which is a free client and I must thank Richard Leggett for recommending this to me!

Now once you have got the code, add it to your global Actionscript folder, then print out this marker and run the example. You can either compile the source in the ’src’ folder or just run the SWF in the ‘bin-debug’ folder. Hopefully this gives you a idea of what AR/FLARToolkit is all about.

If you can run the example yourself, here is a video of it in action.

FLARToolkit / Augmented Reality Basic Demo. from Harry Northover on Vimeo.

I have also written a base class for a FLARToolkit application. It is designed so that all you have to do is override the function ‘add3d()‘ to add your 3D objects to ‘FLAR_Container” object, and then override another function, ‘addAnimation_3d()‘ to add the animation. My description here is very brief so read the readme file in the package. You can download the class here. If you want to see how much code this can reduce then here is an example class using the base class:

package
{
	import com.harrynorthover.ar.flar.base.FLARSingleMBase;
 
	import flash.filters.BlurFilter;
 
	import org.papervision3d.lights.PointLight3D;
	import org.papervision3d.materials.shadematerials.FlatShadeMaterial;
	import org.papervision3d.materials.utils.MaterialsList;
	import org.papervision3d.objects.primitives.Cube;
 
	[SWF(width="640", height="480", frameRate="30", backgroundColor="#FFFFFF")]
 
	public class Demo_BaseClass_Test extends FLARSingleMBase
	{
		private var cube:Cube;
 
		public function Demo_BaseClass_Test()
		{
			/*This is the function 'Init' you need to call to setup the FLARToolkit scene.
			     WIDTH, HEIGHT, FRAMERATE*/
			Init(640,   480,    30);
		}
 
		/*
		...
		This function is the one you need to override
		to add things to your 3D scene.
		*/
 
		override protected function add3D():void
		{
			// Add you 3D stuff here. The more the better :-)
			var pl:PointLight3D = new PointLight3D();
			pl.z = -1000;
			pl.y = 1000;
			pl.x = 1000;
			pl.flipped = true;	
 
			//var blurFilter:BlurFilter = new BlurFilter(24, 12, 1);
			var matList:MaterialsList = new MaterialsList();
			var fsm:FlatShadeMaterial = new FlatShadeMaterial(pl);
 
			matList.addMaterial(fsm, "all");
 
  			cube = new Cube(matList, 60, 60, 60, 5, 5, 5);
  			//cube.useOwnContainer = true;
  			//cube.filters = [blurFilter];
 
  			// FLAR_Container is the FLARBaseNode that you
  			// add your 3D objects to.
	        FLAR_Container.addChild(cube);
		}
 
		/*
		...
		This is the function to which you override to add
		your 3D animation.
		*/
 
		override protected function addAnimation_3d():void
		{
			//Add you animation here.
			cube.yaw(10);
		}
	}
}

See? Lots of code that has been got rid of!

Other demos I have been working on are here:

FLAR + Lines3D:

FLARToolkit and Lines3D / Augmented Reality from Harry Northover on Vimeo.

Incorporating AS3DMod:

FLAR + As3DMod from Harry Northover on Vimeo.

So there you go, my first few demos. Yes, I know, they are not very special but now I’m working on getting mutliple markers working and just more advanced demos in general. If you are looking for more advice on how to get set up with FLAR go over to this blog here. This has everything you need to get going. Also, check out squidder.com for some cool demos.

Happy ARing!

This video was made by Tim Smit, who is a dutch student. For the video above, he did most of the work by himself. This mean filming the footage in his local village, adding in the special effects using After Effects and 3Ds Max and all with a budget of $150! The video is a test movie of his film ‘What’s In The Box’ and the official site can be found here.

I’ve heard that several Hollywood studios have been in contact with him and some are even discussing making his movie!

Some of you may have read my twitter updates about technical trouble with my PC, and I thought I would post the solution here.

After many hours trying to figure out why my computer was coming up with the error:

"Windows could not start because the following file is missing or corrupt:
 
\WINDOWS\SYSTEM32\CONFIG\SYSTEM"

I still had no solution. The Windows XP CD install just hung on ‘Searching for previous Windows XP Installations…’ and the Windows Setup recovery tool just hung as well after selecting which Windows installation I wanted it to fix.

I then had to get on to Dell support, which is never very pleasant. After running the Dell diagnostics CD, it reported the error:

"Error Code: 0F00:0650.
Msg: IDE Failed: The self-test failed the read portion"

They then sent me 2 new hard drives, which for some reason we double the size of the original :) After installing these and trying to install XP again it still didn’t work. I ran the Dell diagnostics again, it reported the same error. I was stuck.

Then I went into the BIOS settings and turned RAID control off on the 2 hard drivers. You do this by selecting the drive, and changing it status from ‘Raid on’ to ‘On’. This seemed to solved the problem. I am now thinking that it was not really necessary to get 2 now hard drives as well! It so happened that my warranty had run out 10 days earlier so I had to pay for these! >(

I know this isn’t related to the web, but seeing as I couldn’t find a solution I thought I would post it here.

You might have noticed that at the top of the page and on my homepage, I have been sporting a new logo. This was designed by be in Photoshop (surprise, surprise…) and I was just looking for feedback. Let me know what you think.

Here it is:

Oh and sorry there has been a huge lack in activity, but I can promise you there will be more to come soon :)

Harry.

Now, over the past 10 years there have been many new and exciting technologies appear which help us create and develop more advance apps. Over the past 3 – 4 years, companies and individuals have been taking a different approach on the research they have been doing. Instead of creating new technologies (languages, software, etc..) to solve a problem, they have been using existing products in different roles. The two best examples of this is Adobe Alchemy and the Microsoft Research project, Singularity. If you don’t know what either of these are them a) be ashamed ;) and b) keep reading.

Adobe Alchemy.

This is a project Adobe developed that lets you take any C/C++ library/code and use it in Actionscript. Now, if you know anything about C/C++, then you will be aware that the number of libraries and open source tools out there vastly exceeds that of Flash’s, so there is something for everyones need, and now the need to write you own is going to be almost completely redundant in the future. You may have seen some of the extreamly cool projects being developed out there, like Doom in Flash (don’t open this at work, you’ll never close it). Although this isn’t perfect, it is still quite an achievement. In time, the desktop will become the web. Going back to the original topic of this post, role reversal, who would of thought a few years ago, that the same type of code that powers the worlds most famous operating system would be able to run on the web? Now, I hope you see what I am getting at. Instead of Adobe creating a whole new language, they just took an existing language, original designed to be a low level language and made tools that let people use it in another way, which was completely unrelated to its original purpose. 

One way to look at this is that nothing new has been created here, nothing has moved forward. You could say that things have moved sideways or expanded in a different direction to what has been happening in the past few years. Using the same thing, just in a different way. 

Singularity.

Microsoft Windows is developed using a mix of Assembly, C and C++ (the well know ones all are), and anyone who has done some serious development with these languages know that it is very easy to go wrong and that you, as a developer, have to watch you back. C/C++ are unsafe languages which means there is a lot of room for error, but they are also extremely fast, so it’s the best choice for an OS. Now though, people at Microsoft Research have been developing their own OS, Singularity, which is developed using minimal Assembly and C (for the boot code, as you have no choice) and then using a modification of the C# language as their main programming language. Seeing where I’m going here? A high level language that is used as part of the .NET framework and for developing Windows Applications, is being used to write an operating system! Now, this isn’t going to replace the current version of Windows we are using now, or any time soon, as for now it is just a proof of concept. This is amazing though, as now you get all the safety of C# (well, Spec#) in an OS. This means auto garbage collection, array bounds checking, which means a lot less chance of a buffer overflow and the whole system would be so much more stable, but not as fast as the original Windows. The modification of C# they are using is called Sing# which is a superset of Spec#. The difference between Sing# and C# is that Sing# has support for channels and low-level programming language constructs that are needed for system programming.

You can read an overview of the Singularity Project here, and you can download it from CodePlex here. 

The Final Word.

Now, these two projects are the best I could think of to prove my point, which I hope you understand. The fact that no technology is limited to one purpose and that instead of creating new languages/software, there is always the option to bend an existing one to shape your needs. 5 years ago, who would of thought that this could be possible? It will be interesting to see what happens in the future….

-Harry.