Thursday, April 2, 2009

Story Board Animation with Expression Blend

Deep Zoom provides the ability to zoom almost arbitrarily large images in Silverlight in a performant manner. Images can be displayed at very small and very large scale without affecting performance of the application displaying the image. The only property affecting performance is the number of pixels to be displayed on screen.




Scenarios

The main scenarios for Deep Zoom center on displaying and navigating large images and/or a panorama of images. Normally, loading large images is not an optimal experience for users because of the lag required for the images to load. Deep Zoom mitigates this difficulty by loading progressively higher resolution images. This creates a "blurry to crisp" experience for users (for more information, see Inside Deep Zoom later in this topic). In addition, Deep Zoom provides functionality to allow users to change their view of an image, using spring animations giving users the impression of a smooth movement around the image(s). For example:

  • 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. Another example would be exploring a professional photo composition made up of high-resolution pictures.

  • 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 page the ad is embedded in first loads, the ad smoothly sharpens and draws the attention of the reader by loading subsequently higher resolution images. In addition, if the user's mouse enters the ad, different parts of the ad can zoom in.