In the image you have 3DSMax in the background with all it’s wireframe goodness.  The render on the right, and as you can see, the Silverlight output in Firefox on the left.

Features in the short term will be more .NET features, as full scene rotation would give fantastic interactivity, and open up the door for useful Silverlight transitions.  Texture mapping is another one I want to look at, mainly focusing on texture scaling and offset.

Enter 3DSMax.  3D Studio has an awesome scripting capability in the form of MaxScript.  Writing 3DSMAX exporters is a past time of mine, and having had a conduit to John Wainwright (aka Mr MaxScript) at that time I became very fond of 3DSMax and MaxScript.  But here ends the history lesson.

The main aim of the Silverlight 3D Studio Max exporter is to create a pipeline for 3D authoring, through to Silverlight in browser, and convenient stops in between.  It shouldn’t ignore or outcast Visual Studio or Blend (or Photoshop etc), and should not replace them.  But where as Visual Studio is a coding environment, Blend an awesome behavioural and layout authoring environment, neither are good 3D authoring environments.  The Silveright 3DSMax Exporter hopefully will fill that gap.

So first up, lets take the following image.

In the screenshot below I’ve taken the above image, applied it as a textures to planes (rectangles), replicated them helix/spiral paths in various directions, textured, translucent, with a blue environment background.  This process took about 2 minutes.

You can see in the image above the front perspective wireframe, the render, and an angled perspective view showing the planes along the various paths.

But with a click of a button, this 2 minutes of work gets exported to XAML in a second.  Alt tab to Blend (Visual Studio doesn’t like ImageBrush for some reason) and voila, instant 3D.

Note that the background is actually blue, but Blend doesn’t stretch it to the full view by default.  A quick stop over in Visual Studio and every object is named and available in Intellisense.

And the real test, taking it to the the browser.  Firing up Firefox gives us…

So in 2 steps, 1) Export, 2) Build, we have a 3D Studio scene in Firefox.

Currently in v0.001 pre alpha, but I thought I’d post some information about what I’ve been working on.  But it truly is 1 click, 1 build.  No smoke, no mirrors.

So what features does it currently have?  For the time being I’m focusing on only 1 shape, being a rectangle.  Simple shape rotation can be done in Blend.  Max is for full scene creation.  Shapes are the easy part, and the hard part is getting coordinate transformations, texturing, and full scene rotation.  These are the real features that I’m currently working on, and I’ll let you all know when it’s ready to get your dirty mitts on.  Stay tuned.

Virtual Earth integration from Silverlight was the highlight. Once again a nice clean API allows developers to pick it up, with fully integrated customised maps in Silverlight developed faster than previously possible. Video and media asset integration, scaling/zooming/”deep zoomesque” capabilities, and the ability to feed in your own map data.

So how easy is it?  Well, first up you need the control DLL.  And once you’ve done that, you’ll need the following XAML…

<UserControl x:Class="MapControlInteractiveSdk.Tutorials.Tutorial1"
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     xmlns:m="clr-namespace:Microsoft.VirtualEarth.MapControl;
                assembly=Microsoft.VirtualEarth.MapControl">
   <Grid x:Name="LayoutRoot" Background="White">
     <m:Map />
   </Grid>
</UserControl>

BAM!  Map with controls in Silverlight in 3 seconds.  Even more impressive is all the small tweaks you can do in only a few lines of code.  Chris Pendleton has a wrap up and other posts over at the Virtual Earth Evangelist’s Blog, so check out further details.

Another session I found interesting was Pigmap. All I could ascertain is that the translated meaning behind the brand could probably translate to ‘cash cow’, and although the presentation had a lot to be desired, the Korean markets tend to push online community concepts many years before the western world picks them up.

Pigmap will be a social networking site.  It leverages Virtual Earth, flickr, and other services (OpenID, Live ID etc). To provide users with mapping, it searches Virtual Earth for certain locations and venues. So search for Las Vegas NV, and BAM, Las Vegas turns up on the map. But then type in ‘Venetian’ as a point of interest, and the platform searches Flickr for photos matching Venetian, grabs their geo coordinates, and drops thumbnails on the map (“The End of Theory” theory strikes again).

The questionable feature of the site is the ability to set “Missions” for people using the product. To be able to go “Dear X, I challenge you to go to this location” doesn’t really appeal to me, but “Dear X, you want to head here tonight?” might work, but many other services provide that functionality. Possibly Korea is too far ahead culturally with social networking that it zips over my head.

And that’s a wrap from MIX09. There is just so much more to talk about, and many of that will come with some of the posts that grow out of playing with the new toys. Head on over to the downloads page to grab your favourite preview/beta/CTP/SDK… and remember to check out the sessions at sessions.visitmix.com.

MIX oh-ten has been announced, and I’m excited to see where the designer and developer community has taken these tools by then. 

Catch you online when I land back in Australia. 

The team over at Microsoft have laid down the gauntlet with a deep zoom collage of the photography going back to 1978!  There are hundreds of photos, all easily filtered in realtime, and the experience is impressive.  The entire application was developed in just 6 days, and is stored on the Windows Azure Storage Services.

Hurry!  You can still check it out HERE. And for more information on how those delicate geniuseseses put it together, head over the Michael Kordahi‘s blog.

Javascript is an exteremely powerful language, and for products such as Sproutcore and Silverlight, it is a great thing.  I questioned it in Silverlight initially, but came to love the Javascript support.  Rather than being proprietary, it opens the door to so many more businesses who can not step into the realm of Flash due to lack of skills and toolsets within their delivery teams.  With Silverlight 2 just around the corner, you will be able to take an array of languages that have excellent application building tools, even allowing Ruby could power your applications front and back, with Silverlight as the glue.  These languages have a solid history, experienced developers, MVC frameworks, mature tools, and online communities.

Of course the main place Sproutcore is going to be exciting for Apple, adding ease of development, and more depth to browser applications, is on the iPhone.  In general the current selection of iPhone applications are good.  Not great, not cool, just good.  But writing iPhone applications is cool.  With the cool factor driving development and innovation, Sproutcore applications written for iPhone are likely targets for the Nokias and LGs in the market. 

Could it be that the ultimate mobile combo a Silverlight RIA front end with a Sproutcore MVC driving it in the background?  Only if banner advertising is brought to you by Flash.

First up, my usual disclaimer… I don’t recommend using this format for real architecture diagrams.  They will have too much detail that will make this process too fiddly and prone to error.  I do however recommend this for Deep Zoom presentations.

Creating architecture in deep zoom is easy.  But there are a few hurdles.  The main issue people face that their diagram software does not allow for minute fonts.  I use Visio, and have exactly that issue.  Here is the solution…

1. Create your overview architecture.

   

2. Create place holders where you require extreme detail.  A space, an X, a tiny descriptor, whatever works for you.
3. Create new slides with GIANT versions of the slides you have made placeholders for.

   
   

4. Either print to PDF and import into Photoshop, or save
   the document as PNG.  Unlike Powerpoint, Visio and other vector drawing
   tools allow you to pick your export dpi.  I use very high dpi for great
   results.  It is probably overkill.

   

5. Import all the images into Deep Zoom, and lay out the architecture overview.
6. Export
7. Done

Note
that if you are doing this as part of a presentation, first lay your
architecture overview slide, then start laying out the pieces
architecture.  Working from the bottom up is the best approach. 
However, you will need to rejig it from time to time, and using ‘layer
view’ in Deep Zoom Composer will stop your brain doing back flips when
trying to find components of the architecture.

For those at Remix let me know if you want any of the originals.

Now you have stopped playing with it, and decided to read this paragraph, there is one thing I should say.  I do not recommend everyone jumping ship and moving to a Deep Zoom slide deck, it is slightly technical, but there are certain situations where it shines.

So here are some easy steps to moving from a Powerpoint slide deck, to a high quality Deep Zoom slide deck.

Thinking about it

The Deep Zoom slide deck was always something I was thinking of doing… time permitting.  I had a grand vision for something that was more driven by the multimedia experience than any practical reasons.

What I found however was that I had produced a high level architecture diagram in Visio for the presentation of the ABC Preview Player and video download project.  At the same time I wanted to be able to include fine details alongside the broader view.  Deep Zoom was a natural fit allowing me to show minute detail, while still having the context of where the detail sat in the overall architecture.  Initially only the achitecture diagram was going to be in Deep Zoom, but then it made too much sense to do the entire thing in Deep Zoom.

So what did Deep Zoom give me that Powerpoint could not?  First up was the ability to zoom right into architecture diagrams, right down to code.  The big general bonus was the ability to include hi-res screenshots on a slide as a thumbnail, and being able to zoom in, let everyone take in what they were seeing, and then return to the discussion.

Step 1 – Creating Your Slides

Easiest thing to do, create your slides in Powerpoint.  Where you wish to have high detail, leave placeholders, or blank spaces.  If you are using images in your slides, ensure you use the highest resolution version of the image you have available.  This becomes important when presenting your deck.

Step 2 – Export to Extremely High Resolution

Since you’ll be zooming in to 1000+%, you don’t want your fonts pixelating.  Powerpoint does come with a few features to export at higher resolutions, and also has the ability via reg-hacks to push the boundaries of this.  The problem is that this isn’t enough.  1000 or 2000dpi will not cut it.

For best results print a PDF document to pre-press quality.  There are plenty of PDF print drivers out there.  Once printed to file, import this into Adobe Photoshop, Illustrator, or any PDF to Raster program, and you can get 9000 dpi output.  Note in the deep zoom below the difference from the original through to the Powerpoint PNG export. The images have not been resized to give an indication of the loss of quality. Also, in the previous Deep Zoom above you can notice the impact of using original images. Check out the two large images, both similar quality, and then check out the two smaller images. The high res original really shines at high zoom.

TIP: When converting the PDF to Raster, save each slide numerically with a title.  For example: ’4 – Architecture Diagrams.png’.  This will help massively when you are trying to find slides using Deep Zoom composer.

Step 3 – Import into Deep Zoom

Create a new Deep Zoom project.  If you don’t know how to use Deep Zoom, you may pick it up in 5 minutes, or struggle. 

NOTE: If you struggle with composing in Deep Zoom after a while, then porting all your slide decks to Deep Zoom is going to be an expensive and painful process.  Either get someone else to do them, or stick with static decks.

Step 4 – Composition

Once you have imported all your high resolution slides, it’s time to start composing.  General rules for composing slide decks.

1. Start with the slide that will be your first slide, and make it fill the intial Deep Zoom working canvas.  When you load your Deep Zoom deck, it will automatically start on that slide, full screen.  It is important that you play around with your decks, so do not try to perfect them if this is your first go, as many of the concepts become clearer as you play around with it more.

   NOTE: Not having the deep zoom load on your first slide will lead to you digging for your first slide, which in turn spoils the entire wow factor when you move to slide 2.
   

2. Lay out your slides in order, as this will ensure the layers implicitly are correct.  Remember to play around with positioning and zoom levels.
3. Ensure you don’t zoom too deep too many times.  Nested slides look excellent, however Deep Zoom composer will fail during export (and fail silently) if your zoom goes too deep.  The Deep Zoom powers that be inform me that this is a composer issue, and is likely to be fixed going forward.
4. Ensure your slides are easy to locate.  A 10 second search for a tiny 0×0 pixel slide during your presentation will make you look clumsy.  It is better that your slides look good, and you impress, than your slides look great, but you look stupid.

Step 5 – Export

Hit the 3rd step, and export as a Silverlight project and preview in browser once exported.  It looks great… but it is not big enough. Almost there!

Step 6 – Pump the Resolution

You’ve created your project, but it’s too small.  You want full screen 1280×1024 for your projector, or maybe 1024×768 (which was the case at Remix08).  First we round the numbers down.  I used 1000×750 at Remix08.  This gives room for the toolbar and status bar, and avoids any scrollbars turning up. You can modify the code so it automatically lands full screen, but this may be undesirable. I went this way, and then returned to static sizing. Also, I often make the body background black in the HTML so I know exactly where the borders are of the slide deck so I don’t have to double check the projector while presenting. Once again, play around and see what suits you best

Open up the project in Visual Studio 2008.  There are two files within which you need to tweak the resolution.

1. HTML Page – The Silverlight plugin will be loading at a particular resolution.  This needs to be changed from the default to your nicely trimmed full screen resolution.
2. Page.xaml – Any proportions associated to the grid and the multiscale image should be adjusted to the same resolution as used on the page.

Now run the web project.  When the browser opens, hit F11 for full screen browsing. 

Note that you can do deep zoom using Silverlights full screen mode (instead of full screen browsing) but you will lose mouse scroller capabilities which is generally crucial to Deep Zoom.

Done!

Now sit back and enjoy the slides. Practice moving your deck around as much as possible. That wasn’t so bad was it? One would guess that Microsoft will evolve this into their entire Office product range to make this pipeline easier, but until then, happy exporting.