Aug 12, 2011

The Amazing World of Deep Zooming

Aug21

Deep Zoom is a technology developed by Microsoft for efficiently transmitting and viewing images. It provides the ability to interactively view high-resolution images, zoom in a large image or a large collection of images. It reduces the time required for initial load by downloading only the region being viewed and/or only at the resolution it is displayed at. Then, the subsequent regions are downloaded as the user pans to (or zooms into them) by enabling a smooth loading and panning by serving up multi-resolution images and using spring animations to hide any jerkiness in the transition.

Deep Zoom Features
Deep Zoom uses multi-resolution images to achieve a high frame-rate and fast open experience for even very large images. On load, only a small amount of data is needed to quickly show something on screen. The initial load experience is to show a low resolution version of the image, and blend in higher resolutions as they become available. This is the reason for the blurry-to-sharp experience in Deep Zoom. It is also the reason that Deep Zoom is able to seemingly open images immediately without much wait time to load image data, regardless of the size of the image. Besides initial loading, this same behavior is experienced as the user interacts with the application (for example, zooming and panning).


Deep Zoom Images

The file format used by Deep Zoom (Ajax Seadragon) is XML based. You can specify a single large image (.dzi) or a collection of images (.dzc). It also allows for "Sparse Images", where some parts of the image have greater resolution than others. 




Single Images
Single large images in Deep Zoom are represented by a tiled image pyramid. This allows the Deep Zoom rendering engine to grab only that bit of data that is necessary for a particular view of an image. If an image is being viewed zoomed out very far, then a small thumbnail is all that’s needed to show the image on screen.
However, if the user is zoomed in to a specific area of a large image, then only those tiles needed to show the specific areas are downloaded. This can lead to very large bandwidth savings because often only some aspects of a large image are interesting to the user. The illustration below shows what the image pyramid looks like conceptually. An image is stored as a tiled image pyramid. At each level of the pyramid, the image is scaled down by 4 (a factor of 2 in each dimension). Also, the image is tiled up into 256x256 tiles.




If, for example, you were zoomed in to see only the highlighted middle part of the image, Deep Zoom only loads the highlighted tiles, instead of the entire 1024x1024 image.


Deep Zoom Scenarios
Deep Zoom can be used in many different areas, but there are three key scenarios where Deep Zoom is particularly useful.

·         Exploration of Very Large or High Resolution Images: A classic example of this would be zooming in on parts of a large map to see different levels of detail and then, using the mouse, moving your view around the map surface. As the user moves their view, animations are used to give the user the impression that they are "moving" from one place to the other on the image. (Ex: Google Earth)
·         3-D Photography: Take pictures of a room, one after the other, creating a collection of photos that make up a 360 degree picture of the room. Now the user can pan around the room with each photo blending into the other.
·         Advertisements: You could create a relatively low-resolution image to represent the overall theme of the ad, and then have progressively higher resolution images containing more impressions and data about the product. When the first load occurs on the page where the advertisement is embedded, the image smoothly sharpens and draws the attention of the reader by loading subsequently higher resolution images. Since the image progressively loads, it does not significantly impact the user's overall experience of the site. In addition, if the user's mouse enters the image, different parts of it can be zoomed in.

Experience the smoothness of Surfing:
http://zoom.it
http://www.deepzoom.com
http://expression.microsoft.com/en-us/gg413363
http://www.microsoft.com/uk/wave/software-deepzoom.aspx

T.M.T.D Dayananda
07'Comp.Sci(sp)






0 comments:

Post a Comment