edit:

It seems that other’s have also thought of exploiting this metaphor. Over at the Google Geo Developers blog they have an example similar to this. However, I find my implementation of the metaphor somewhat more intuitive and less intrusive towards the disorientation (cognitive load). What do you think?

Anyhow, the important aspect is that there seems to be a potential in this metaphor and I expect that more implementations/applications of this would occur :)

original post:

This is a follow-up to my post on the magnifier-metaphor prototype.  I came across a video of a presentation of Microsofts newest prototype for the Surface “board” called Second Light. Fairly complex technology and everything, but the foundational idea (the wow!) is that you have a “magnifier” over an image and you can “see-through” that image and reveal “hidden” information. Sounds familiar? Well, yeah, I think it’s quite similar to my idea – which is nice:)

The technology is show-cased by Microsoft using maps, aerial-photos, real-life image and text. This inspired me to tweak my prototype to incorporate a little more wow (off course it already has, but a bit more abstract wow :)). You can see the new prototypes and the Microsoft presentation further down.

Microsoft enables this metaphor using highly complex, expensive, non-commercial technology and probably it will be some years before the regular man-in-the-street can get a Surface table. However the technology could be set aside and for instance using a more virtual approach like my scrapped-together prototypes indicate.

If I had more time and more gadgets I would like to see this type of functionality implemented in an IPhone or HTC G2 (Android phone) or similar devices. I strongly believe this is a nice way to navigate an information space, especially with spatial information. (Call for prototypes! :))

Right shifted magnifier

Controls:

• Zoom: Mousewheel scroll recommended (standard Google Maps)
• Show/hide magnifier: Single rapid left click

Centered magnifier

Additionally experimented with opacity on the magnifier layer to see affects on orientation problems

Controls:

• Zoom (with magnifier): Single (rapid) left click.
• Show/hide magnifier: Single right click
• Otherwise standard Google Maps controls

Microsofts presentation of Second Light – note the wow-factor for aerial/map.

Update:

Ideas for other information-layers

• Ground: Metro-map. Magnifier: Area map
• Ground: Data-structures (Graphs, trees etc). Magnifier: Map of som sort:)

As some of you already know I’m specializing in GIS and an interest for maps and especially techniques for visualizing maps are present:)

In an article I read (Nivala: Usability evaluation of web mapping sites) they critique (as far as I remember) the way systems zoom. I don’t actually remember exactly where the inspiration came from, but I came to think on a standard magnifier, which many use as a tool for “zooming” on paper maps. So I decided to experiment on how this would “feel” like in a web map (or digital map). The idea was to extend the magnifier metaphor by shifting what is actually displayed within the magnification display (eg. changing the level of detail). As opposed to a paper map and a magnifier, where the information is static.

The result became to prototypes using Google Maps API. The goal was not to make a perfect implementation of this, but just to investigate, as rapidly as possible, the “feel” of this kind of zooming. I found that it was actually kind of pleasing to browse a map in this fashion. It is very fast – you get an instant zoom/more detail over the area of interest and you don’t loose the orientation as much (as the base map do not change), as for some. There are some problems associated with it, but I haven’t investigated the depressive side effects:)

Below is the two different prototypes, one centers the magnifier over the mouse, the other shifts it a bit down and to the right. Personally I find the latter to be most pleasing. Please do not demand to much of the prototypes – they are prototypes and do not tolerate bad behaviour:) And please share your comments, thoughts, ideas, critique in the comments field or mail me

Centered magnifier

Controls:

• Zoom (with magnifier): Single (rapid) left click.
• Show/hide magnifier: Single right click
• Otherwise standard Google Maps controls

Right shifted magnifier

Controls:

• Zoom: Mousewheel scroll recommended (standard Google Maps)
• Show/hide magnifier: Single rapid left click