in Actionscript 3

Silverlight Deep Zoom is Nothing New for Flash

One of the best Silverlight examples is the Hard Rock memorabilia site. This site employs a highly-touted feature of Silverlight 2 called Deep Zoom. The Microsoft hype machine has been in full gear trying to claim that this is something original and that Flash can’t do the same. Uh, sorry wrong.

There has been a lot of this type of stuff in the Flash world for a while. To prove the point, I’ve used Zoomorama to create an example which uses technology similar to the Silverlight stuff. They keep touting the full size of all the photos together which is irrelevant when it comes to this technique because you only load the pieces you need at that moment in time. You could have a million high-res images and it wouldn’t make a difference, other than taking up a ton of hard drive space.

The example below consists of some high-res photos taken from the DEA website. You can scroll wheel, click, and even download the individual photos when you are over them. These are separate photos of different resolutions, just like the Hard Rock site.

So what is cool about the Hard Rock site? I really like the filtering and easing effects that Vertigo employed. But the underlying technology is not new no matter how hard Microsoft tells you it is.

Lee

Write a Comment

Comment

63 Comments

  1. There is this rumour… Silverlight will shift Flash. Silverlight is great, Silverlight is cool.

    Well, it is not cool and it’s miles before greatness. MS wants to control every bit that is floating on the Net…

  2. Hu,

    what would be never-seen-before I dont see the innovation at all and yes we have seen this before oh-so many times (maybe too many already).
    Lee, do you have a link where M$ is claiming its innovativeness?

  3. What’s new is they have a component (Deep Zoom Composer) that takes care of this functionality for you. As I understand it’s built on SeaDragon, that does look powerful. Looks like something that could be built into a streaming server though like FMS or Red5.

  4. Thanks for showing Zoomorama’s stuff. The nice thing about Zoomorama is that you can easily create you own layout of zoomable pictures, and video too. Drag and drop ease. For now the authoring is only for PC, but Mac is coming very soon. Authoring is free, as well as initial membership to the site (2Gb of storage). http://www.zoomorama.com

    Check out these nature pictures: http://www.zoomorama.com/e4f47a173d0ecca72a5e3bb99c6fe518

    Or these family pictures: http://mail.zoomodev.com/81ba7d953a355bab6eb7cdb50db793fe

    Looking forward to some community feedback. See more examples on my blog at http://www.zoomorama.typepad.com

    On with Flash !

  5. hi,
    can u elaborate more that approach, i always wanted to download only the big image in a gallery and get rid of the thumbs as separate images (with their own folder, place in xml etc.), being able to scale without losing quality.
    Thanks!

  6. While Flash (and even AJAX) have been capable of delivering large images via progressive downloads for a while, neither have supported it natively.

    Zoomorama is neat, but it’s an advertising supported service; that wouldn’t be appropriate in the Hard Rock scenario at all. Zoomify is a more appropriate comparison for professional use, but at $795 per server. By comparison, Deep Zoom is built into the Silverlight plugin. You’re free to host your photos where you’d like, without restrictions on ad support or licensing requirements.

    Plus, having Deep Zoom built in as a native Silverlight element also means that you have full control over how it works, including application composition and layout, user interaction, and programmatic integration.

    I’m sure I don’t need to explain why the actual pixel sizes do make a difference. Yes, you could composite a million gigapixel-sized individual images at all possible scales manually. Good luck with that.

  7. Like I mentioned before, the Deep Zoom component is very cool. What I’m responding to is the notion that it isn’t possible in Flash. That is completely false. And yes please explain why pixel sizes make a difference. You are only ever seeing the number of pixels that make up the dimensions of your movie. The total number of pixels of the images is irrelevant at runtime. The only effect it has is on the amount of time to author and lay them out. This true in either Deep Zoom or Zoomorama.

    But I agree that the Silverlight component is very useful. I wish there was something like it for Flash. Hint, hint, Zoomorama.

  8. This is in fact really cool. People squeeze a lot of mileage out of Flash. However, I wouldn’t short change what was done with Deep Zoom in Silverlight. As Jon points out, there is a really compelling tools story as well no need for anything on the server with Deep Zoom.

    The most compelling aspect of Deep Zoom however is the fact that you can’t only do single images with high resolution and zoom into those – you can also do collection of hundreds of very high resolution images and move them all independently – as the Hardrock Memo demo shows.

    What’s more – since Deep Zoom is built into Silverlight it allows those smooth animations you see in the demo – the framerate is never affected by the server or the internet connection. I haven’t seen these kinds of smooth animations in Zoomify or Zoomorama.

  9. Lutz, Zoomorama also zooms into multiple images of different resolutions as can be seen in the example. But I agree that the Deep Zoom component is cool and I really like what Vertigo did.

  10. I few of the Flash Devs here at SXSW actually stated that it would take them quite some time to implement this and seem to be quite impressed. I’m not sure that the overall idea of the zoom was meant to be considered something that is innovative but rather the implementation.

  11. Tito, isn’t there a lot of drinking at SXSW? Maybe that explains it. Got anymore? I can go on all night baby!

  12. If you want to check out some sample code and a demo of Deep Zoom with mouse and keyboard support I’ve written a little here:
    http://www.soulsolutions.com.au/Blog/tabid/73/EntryID/394/Default.aspx
    Shows just how little code there is (its basically just how you want it to navigate)
    Scary thing is its all C# (.net) so the hard core programmers will be entering the world of RIA!
    Other note is I do a tonne of stuff with Virtual Earth. The competition with Google Maps is huge and it just drives innovation. Flash developers should actually welcome Silverlight as it forces flash to truely innovate, and hey we the developers win in the end.
    John.

  13. Programmers generally like to compare feature to feature. Honestly, deep zoom feature can be realized in HTML, Ajax, VB, Java … you name it. But the cost of implementation, integration, and the last mile would make a drastically different bottom line.

    Flash does not invent any new cool gadgets, but it does invent a new cross platform environment that is very focused on high performance GUI. And I would it would live up to that instead of going feature creep competition with Silverlight.

  14. I think the point is that Microsoft is the one who makes comparisons and says things that are flat out lies. They built a cool component but the underlying technology is not new as some have said. In fact Google has a patent on this stuff.

  15. I would like to see a zoom component/code for Flash/Flex that uses a high resolution image. Not streaming from a server.

  16. http://www.bdcc.co.uk/GoogleCrunch/Crunch.htm
    http://en.wikipedia.org/wiki/Quadtree

    Those links are some details on how tile based zooming works in case anybody fancies giving it a shot – it’s not really that tough, but making it simple and straight-forward and transparent is the tricky part – and it sounds like Microsoft has managed that – but I’m sure it is possible in Flash – I was actually going to look into doing something AS3 – it has a ‘getBytes’ method which can take an offset param – surely if you understand how png/jpg compression works and store it’s images you could request only the portion that is required and then wrap new ‘headers/metadata’ around it to display it? Maybe it’d still require a decent server delivery mechanism tho. I dunno – just some food for thought…

  17. “the underlying technology is not new no matter how hard Microsoft tells you it is”
    no news here, it’s been like that since the beginning ;) fortunately there are other options.

    The component approach just probes one thing, there is people who likes or needs things already chewed, nothing more.

    other thing: since when is a killer feature to have deep zoom? and btw. the iPhone does just that, but with whole web page contents, not just pictures.

  18. I wouldn’t underestimate what .net will do for Rich Internet Applications. Keep in mind the tools surrounding .net for things like unit testing, code coverage, detailed performance analysis, automated testing will carry over to Silverlight.
    As I mentioned developers and designers don’t need to be threatened by Silverlight, Flash isn’t going away but hey maybe some great new tools will become available for everyone.
    Classic example is thanks to competition (Silverlight 1.0), Flash now has better video support.
    I’m sure a simlar control will be coming to Flash soon enough.
    John.

  19. At the moment I’d try to mimic deep zoom using Flash purely because of plugin perpetration. But Silverlight blends the new images in super smoothly and Deep Zoom Composer does make it really simple prepare images for Silverlight though, but I guess those could be loaded into Flash?

  20. Quote:
    “Franklin
    March 9th, 2008 | 12:06 pm

    Thanks for showing Zoomorama’s stuff. The nice thing about Zoomorama is that you can easily create you own layout of zoomable pictures, and video too. Drag and drop ease. For now the authoring is only for PC, but Mac is coming very soon. Authoring is free, as well as initial membership to the site (2Gb of storage).”
    Zoomorama is a nice piece of Flash-programming,but what Franklin (CEO) doesn’t tell you:
    you can ONLY store the created flash-files on your zoomorama-account,
    AND NOWHERE ELSE!
    And there they are DELETED after 3 MONTHS,unless you remember to go back in time and prolong them:THEN they are DELETED after 6 MONTHS after you made them!PERMANENTLY….PERIOD.
    Just imagine what this blogposting looks like in 3 months….
    Just hope you can make it with Silverlight,by that time,and store it where YOU see fit!

  21. I agree Josh. Zoomorama is an example of how it can be done in Flash, but it would be nice if we had the flexibility to modify and host it elsewhere. Maybe someone in the community will create a component :).

  22. Zoomorama is not the only Flash-project that has critical flaws:
    another example is Sliderocket (http://sliderocket.com/).
    The demo looks fantastic,and I was happy getting an invitation to try it out.
    It turns out to have tons of features,but operating it on their servers isn’t exactly a breeze:waiting 8-10 seconds for even a menu to open makes it completely useless!
    But I would be drooling with a Silverlight equivalent!

  23. Just to be clear, there aren’t any problems with Zoomorama. Their technology works flawlessly but they are trying to make money on it. You can’t blame them for that. But it would be cool to have a similar service with an open API. As for Sliderocket, I have to disagree with you there but that’s a whole other thread :).

  24. True,Zoomorama’s offline editor is very nice:I wished Sliderocket had one like it!
    DivX tried to make money too:they had the superior quality…now they’re history!

  25. I’m an avid flash fan.. but i gotta disagree with the some of the negativity towards M$’s release.. (not typical)

    First and most importantly.. Flash lacks GPU.. or better put Deep Zoom is utilizing GPU whether running on desktop or on web. And I think this is one reason the Hard Rock example runs so smoothly.. I have yet to see anything comparable in Flash.. however i am sure it will come, for now flash coders have to be more creative :)

    Second.. look at Seadragon/Photosythand the World Wide Telescope project… M$ is putting a lot thought towards the ZUI space…

    And also Deep Zoom has a sexy blur filter effect.. we all know how much flash filters suck (performance)… especially blur :P

  26. More classic MS disinformation. There is no blur effect at all on the Hard Rock site. Are you referring to photos as they load in? Deep Zoom doesn’t utilize the GPU in Silverlight as far as I understand. Let me know where you heard that as I may have simply missed it. BTW Flash is utilizing the GPU for things like fullscreen video.

  27. Also as I am playing around with the deep zoom stuff I noticed that none of the navigation (scrollwheel, panning, etc) is included in the component. You have to program that yourself. Also, you need to conditional logic for different browsers in your code like if (HtmlPage.BrowserInformation.UserAgent.IndexOf(“Macintosh”) != -1). I like the composer tool though.

  28. Yes I was referring to the load in effect… while not exactly a “filter”.. its a much better transition than I’ve seen in any ZUI flash or other… lol thats funny “no filters in slight” considering its just a subset of WPF(.net) in which filters exist… just wait for beta 2.5 :P

    Flash hardly utilizes GPU… especially where it counts… for example.. a simple paint app in AS3 still runs rather sluggish.. and it just breaks down when trying to create multi-touch paint app

    As for separation of the component and input logic, that’s actually a good thing.. esp when looking beyond the mouse/keyboard.. which I’m not sure adobe does much yet… considering how much flex components are reliant on MouseEvent

  29. There is no load ‘effect’. What you are seeing are JPEGs loading just like they do everywhere. Silverlight doesn’t have any of the WPF effects which is a good thing since they are all software rendered and are slow as hell. Maybe you aren’t aware of this but I did a ton of WPF work in my last job so I’m not talking out of my ass on this. “Flex components are reliant on MouseEvent” as opposed to Silverlight components that rely on what?

  30. http://memorabilia.hardrock.com/ – View Bo Diddley and look at “More Info” for the orange guitar. Looks like Silverlight doesn’t have scrollbars for text. If you close the info window and try to reopen it … it breaks … no text.

    I do like the overall performance. Pretty nice and smooth.

  31. Yeah there are some bugs with it but the guys at Vertigo, who I’m friends with, have done an excellent job and I don’t want all the SL/Flash debate going on to water that down. I should make a separate thread just for that as I’m sure it would be my highest comment count :)

  32. You all give this FAR too little credit. What you’re looking at in Silverlight is NOT an image all sliced into chunks of which various resolutions are displayed and tiled, but rather a SINGLE JPEG2000 image. If you were to host a gigapixel image to display in flash, it takes tons of processing, organization, and bandwidth to display the result. Just count how many server requests your flash movie makes when you’re looking at flashearth and you’ll get an idea as to its inefficiency.

    Silverlight/Seadragon however… The image is loaded progressively. you could load 5kb of a 1GB JPEG2000 image and you’ll have a VERY good idea of what the whole thing looks like. Need more detail?? Just read more into the file and it will refine itself. You just can’t do this with flash and you’re all understating its importance and potential impact.

    In fact, I just added JPEG2000 support to Adobe’s wish department 5 minutes ago because standard JPEG’s just won’t cut the bacon.

  33. sounds like we need a bake off….

    a Flash developer and a Silverlight developer sit in a room with nothing but their preferred IDEs and a web server. Between them sits a portable HDD with 5GB of images … some 10mp, some 150mp in a variety of formats.

    First one to produce something like the Hard Rock site gets bragging rights.

    It’s not who came up with the technique first (I suspect Leonardo da Vinci probably invented it), it’s what’s actually usable for a typical developer.

  34. The fact that you guys don’t understand the technology behind Deep Zoom doesn’t mean that it’s not new or innovative. Deep Zoom IS NOT just resizing an image to multiple different zoom levels and tiling them together.

    There’s a reason that the Silverlight example kicks the ass of what you posted.

    You guys need to get serious about performance and programmability in Flash. Silverlight has some MAJOR problems (like craptastic text rasterization quality), but it’s getting better.

    What is YOUR competitive advantage? Right now it’s browser support, authoring tools, and rasterization quality. None of those advantages are likely to last forever.

  35. Note: Deep Zoom doesn’t render on pre-Intel Macs! What BS! Even Zoomify has been working on old computers for years.

  36. Sorry but the Hard Rock demo is way smoother and more detailed (“deeper zoomable”?) than your Flash demo.

    Anyway, it’s all cool.

  37. Zoomorama simply retain the rights to delete your account if inactive for more than a year. Sounds resonable doesn’t it ?

    We do not erase your albums after a set amount of time !

    Silverlight is not a single JPG2000. You would not be able to move the images around. It’s a bunch of JPGs tile spread through directories and sub-directories, like Google Maps. Same everywhere.

  38. Pardon me, I was mistaken! After some further research, it looks like Zoomorama was released in March 2007. Deep Zoom in March 2008.

    I was confusing Deep Zoom with SeaDragon. Apologies to Zoomorama.

  39. I don’t care what anyone says about Silverlight. As most MS reproductions of established innovations, it will always be a second rate product. An after-thought of what they need to to do to stay competitive while Flash will continue to push forward into new realms. The issue with Flash though is that it tries to be everything. The ‘do all’ language sometime without regard to processing speed. Adobe is aware of these things though and as they push forward with things that no one ever thought flash would do, the speed issues will be corrected in last year’s innovations that choked most browsers.

  40. Haha you guys are just scared of the rise of Silverlight. Unlike Flash I can use native C# as behindcode. Even if the rest is equal, that feature kills Flash.

  41. I really don’t understand this fear of Silverlight that so many Flash designers seem to have.
    I’ve been working as a Silverlight contractor for a while now and the main reason people are adopting Silverlight over Flash is to keep technology within products consistant. By that I mean if a company has a lot of .NET server side code and services but they want to include specific client side elements beyond ASP.NET then Silverlight is a natural choice.
    It’s not that Silverlight is better than Flash, it’s because the company has .NET devs and .NET solutions which Silverlight sits naturally with.

    Another company which isn’t developing solutions around .NET may well choose Flash. Maybe they have inhouse Flash devs or they just want to use an established technology.

    Silverlight isn’t going away. MS is putting a lot behind Silverlight and WPF with Silverlight 4 due out with many new practical features such as printing. You may think printing is dull but I’ve been asked about this feature many times from clients and it’s just one of those dull but practical needs companies have.
    Flash will no doubt evolve and continue to be strong and I expect other technologies will spring up to challenge both Flash and Silverlight. It’s called progress and an open market, enjoy it.

  42. Hi lee,

    First of all props to those who commented on this article by lee, pros and cons are highly constructive. Darren, I agree with you as these are the same points why the current company I’m with is using Silverlight. Lee, cool stuff what you did right here. Although I hope you fix the example site because its not working.

    Well, after 10 months of SilverLight from SL2 to now SL3 & 4 I think I’ll move back to Flash. :j

    Back to topic, (1)I would like to know if flash has an answer to SL’s deep zoom utilizing google maps api up to street level. (2)Plus tying it up with a real-time chat app (or GPS would be better) which points out the chatters exact location.

    This was done by my colleague in SL and as a flash developer I’d like to know if this can be done in flash as well and which of the two is more optimal in terms of design and development time + optimized rendering speed.

  43. If you want to avoid storing hundreds of separate tiles for each image, as you need to do with DeepZoom or Zoomify, there are also single source solutions such as the open source IIPImage – http://iipimage.sourceforge.net

    IIPImage is based on a dynamic imaging server that supports TIFF and JPEG2000 and allows you to connect to a variety of clients in Flash, Javascript or Java. It can even communicate using the Zoomify or Deepzoom protocols if you want to use their zoom clients.