Silverlight Deep ZoomA Walkthrough

Apurva LawaleWeb Developer Evangelist

Developer & Platform EvangelismMicrosoft Singapore

Mix-it-Up (the F1 Edition)25 September 2008

AgendaAgenda

• Silverlight Deep Zoom Silverlight Deep Zoom (why)(why)

• Tools Tools (what)(what)

• Demo Demo (how)(how)

• Q & AQ & A

Silverlight Deep Zoom Silverlight Deep Zoom (why)(why)

• View large imagesView large images• Sends portions of the image to your Sends portions of the image to your

browserbrowser

Some scenarios:Some scenarios:• Consumers – adds to photo-sharing Consumers – adds to photo-sharing

experienceexperience• Engineers – huge system drawingsEngineers – huge system drawings• Builders – huge floor plansBuilders – huge floor plans• Designers – High-Res Designs to show Designers – High-Res Designs to show

clientsclients

Tools Tools (what)(what)

• Deep Zoom ComposerDeep Zoom Composer

Demo – Part 1 Demo – Part 1 (how)(how)

• Simple Deep Zoom ProjectSimple Deep Zoom Project– Adding images– Exporting the project– Previewing in Browser– Looking at Visual Studio Project

• Creating a simple Deep Zoom Creating a simple Deep Zoom project with no code at allproject with no code at all

Tools Tools (what)(what)

• Deep Zoom ComposerDeep Zoom Composer• Expression Blend Expression Blend • Visual Studio 2008Visual Studio 2008

Demo – Part 2 Demo – Part 2 (how)(how)

• Interactive Deep Zoom ProjectInteractive Deep Zoom Project– Making the UI look better– Adding data/information– Adding the necessary UI to display

data/information– Adding code to make it work

• Some code and we have an Some code and we have an interactive deep zoom demointeractive deep zoom demo

SummarySummary

• Creating Interactive Deep Zoom Creating Interactive Deep Zoom Projects is easyProjects is easy

• Download the Deep Zoom Download the Deep Zoom Composer and get startedComposer and get started

Q & AQ & A

ResourcesResources

• http://www.apurvalawale.com/http://www.apurvalawale.com/silverlight.aspxsilverlight.aspx

• http://blogs.msdn.com/jaimer/http://blogs.msdn.com/jaimer/archive/2008/06/23/working-archive/2008/06/23/working-with-collections-in-deep-with-collections-in-deep-zoom.aspxzoom.aspx

DemosDemos

• http://learnet.npm.gov.tw/silverlight/http://learnet.npm.gov.tw/silverlight/• http://www.kbb.com/kbb/PerfectCarFinder/PhotoEdition.aspxhttp://www.kbb.com/kbb/PerfectCarFinder/PhotoEdition.aspx• http://www.xrez.com/yose_proj/yose_deepzoom/ClientBin/http://www.xrez.com/yose_proj/yose_deepzoom/ClientBin/

TestPage.htmlTestPage.html• http://www.wssmithers.com/InteractiveGallery/tabid/128/http://www.wssmithers.com/InteractiveGallery/tabid/128/

Default.aspxDefault.aspx