Join 3,433 readers in helping fund MetaFilter (Hide)


What's the name of this widget?
July 14, 2008 12:47 PM   Subscribe

You know the little draggable overview map in Google Maps? What's that kind of UI control called?

They're pretty common: the Navigation Palette in Photoshop is the first one I remember encountering. It's a small window with a thumbnail view of a larger chunk of a document (maybe the whole document), with a little rectangle representing the area displayed in the larger window. In Google Maps it's at the lower right (honest, it's there, just click on the arrow); in Photoshop it's a separate palette.

What am looking for is (a) what that kind of widget is called in general (so I can google for more info) and (b) any discussions in the UI or HCI literature with guidelines, best practices, that sort of thing. Thanks!
posted by rodii to Computers & Internet (13 answers total) 2 users marked this as a favorite
 
I'm pretty sure it's called a mini-map (Google Maps calls it an "overview map"). Wiki has a short article on it, but it's mostly game-related. Same concept, though.
posted by Rhaomi at 12:53 PM on July 14, 2008


In cartography, it's generally called an "inset."
posted by UrbanEconomist at 1:04 PM on July 14, 2008


In Real-Time Strategy computer games, these are called "mini-maps" and have the same function.
posted by EndsOfInvention at 1:18 PM on July 14, 2008


When Adobe first launched this kind of thing in Photoshop it was called the "navigator", and still is. It seems like it could be called a proxy also, since it is in essence a "proxy" of the larger detail view.
posted by littlerobothead at 1:23 PM on July 14, 2008


From the UI "patterns" side of things, I'd call that the overview (or thumbnail) area of a Overview & Detail interface (see examples here). This is slighly different from a Focus Plus Context design (academic-like dfn, bad example), where, as a very crude analog of human vision, we see the detail *in its proper location* and the context is blurred but is left in the correct spatial relation to the detail.

The advantage of doing the "semantic zoom" at its proper location is that you can see the context. But as you can see from the example I snipped above, it often comes at a very great cost to the readability of the things *near* the focus, but not in it. Overview + detail does not have this problem, but forces the user to integrate the focused view back into the overview. Sometimes this is easy, but sometimes it's cognitively taxing, especially when the user needs to switch back and forth, like when she's looking for a particular target (she'd have to use the overview to navigate and then check the detail to see if it was a "hit" and then go back to the overview to keep looking... on a map, this isn't hard, but for other more abstract data it can get hard).

Hopefully this will give you some new terms to google, at least.
posted by zpousman at 1:40 PM on July 14, 2008


Thanks! "Mini-map" seems to have unlocked the literature somewhat. Unfortunately most of the work seems to be in gaming, which isn't exactly what I was looking for. But it led me to this paper, which tells me what I'm talking about is called an overview+detail (o+d) interface. Onward!

Just to clarify--the mini-map in and RTS game is just a passive display, right? Unlike the Google and Photoshop examples, where you can actually drag the... view rectangle around and the main window changes. I'm interested in the control aspects, not just the display aspects. ("View rectangle" is an example of my problem. I don't want to make up terms if there's already a standard way of describing things.)
posted by rodii at 1:42 PM on July 14, 2008


Just to clarify--the mini-map in and RTS game is just a passive display, right?

No, in most RTS games it behaves just like in the other examples, with a movable rectangle.
posted by Partial Law at 1:47 PM on July 14, 2008


Damn you, zpousman Thanks, zpousman!
posted by rodii at 1:51 PM on July 14, 2008


A tangential note: draggable tile-based maps are increasingly known as "slippy maps".
posted by fishfucker at 2:12 PM on July 14, 2008 [1 favorite]


In cartography, it's generally called an "inset."

Isn't an inset usually a small side map that's drawn on a larger scale?
posted by Johnny Assay at 2:46 PM on July 14, 2008


Sorry for jumping in before you...

In an Overview&Detail display like you're describing (and, I assume, you want to create):
posted by zpousman at 3:00 PM on July 14, 2008


That sort of UI element is also sometimes called a "panner" (because it allows you to pan easily over a large object).
posted by hattifattener at 8:00 PM on July 14, 2008


Thanks all. I'm always amazed at the depth of knowledge that pops up so quickly in even the most obscure areas here.

zpousman, I'm not creating this software, I'm doing usability and documentation on it. It's used for visualizing biological networks, which can be vast hairballs of associations. Users have to be able to zoom in to just about any scale and fly around and still see the whole. It works at a basic functional level, but... let's say some refinements are needed to make it really work *well.* But to tell people about why, I found I needed vocabulary I didn't have, so thanks for all the info.
posted by rodii at 10:52 PM on July 14, 2008


« Older How do I sound like the intell...   |  Does anyone know a place in NY... Newer »
This thread is closed to new comments.