Browsing collections of digital images is a common task. This may be photographs, scanned document pages, drawings, renderings, etc., that are located on the user's computer or on the World Wide Web. If the amount of images is large, it is important to maintain a good overview of the material, while still allowing users to examine each image in detail. Visualizations that provide such a view are sometimes called focus+context methods, since they give both an overview (context) and details (focus) at the same time.
Many applications provide overviews over image collections by presenting a set of thumbnails (smaller versions of the images) in a display area separate from the main picture. However, this is not always the most natural approach. In real life, we often put all images on the same work space, for instance a desktop. We then optimize the working space by placing the images we are currently interested in close at hand, while maintaining an overview over the whole set. When we bring an image into "focus", it does not stay in the surrounding context, since there is no thumbnail representation that exists separately from the actual image. Furthermore, images often fall naturally into categories and sub-categories, i.e. they have some kind of hierarchical ordering. This can be reflected on the work space by grouping similar images together or placing them in different stacks.
We have developed flip zooming, a focus+context approach to presenting image sets which attempts to mimic this way of working with images [1]. The main image and the thumbnails are presented on the same display area rather than in different windows. When an image is selected for viewing, the thumbnails are reduced in size and re-arranged to accommodate the main picture, which replaces the thumbnail representation. Our first implementation of the technique was a text-only web-browser, the Zoom Browser. We then generalized the method to allow browsing of any image collection. An evaluation of our first prototype made us aware of some problems with the technique, which have been addressed in the current prototype. In particular, users found it confusing that the place where the main image would appear was not fixed; this was because we wanted to pack as much information as possible on the display. We have now made a trade-off between information density and usability, and the main image is fixed to always appear in the middle of the display.
The prototype makes it possible to group images together in hierarchies, by presenting different categories in separate container areas on the display. These containers can be brought in and out of focus just like images and thumbnails. Categories can have sub-categories, which in turn can have sub-categories, allowing for any depth in the hierarchy. Since users can zoom in and out to any desired degree in each area, and bring each area in and out of the focus, it is possible to work deep down in an image hierarchy without losing the overview. Even though images outside the focus can become very small, it is still easy to identify categories, since the individual layout of each area is maintained.
The figures show examples of browsing a collection of images on the Web, in this case portions of the collection of The Louvre Museum (www.louvre.fr). The categories are Prints and Drawings; Paintings (with sub-categories for the French, Italian, Flemish/Dutch/German and Spanish/English schools); Greek, Etruscan and Roman Antiques; and Egyptian Antiques (with sub-categories for sculptures and paintings). For browsing such image collections, we believe our method can present a useful alternative to traditional image-browsing applications for local file systems and the Web.
Some examples of zooming and browsing images while keeping an overview of the complete set. Images at various depth can be zoomed simultaneously, and users can choose to focus completely on one category or sub-category.