Eric A. Bier, Ken Fishkin, Ken Pier, Maureen C. Stone
Xerox PARC
3333 Coyote Hill Rd.
Palo Alto, CA 94304 USA
+1-415-812-4000
E-mail: {bier, fishkin, pier, stone}@parc.xerox.com
At the CHI'94 conference we presented a new user interface paradigm, the See-Through
Interface(TM), that allows movable tools to readily be brought to computer-based work. On a
computer display, see-through tools appear on a semi-transparent sheet that can be positioned over
applications using either hand. The tools are applied by clicking through them with a cursor controlled by
the dominant hand. This video quickly reviews the see-through paradigm, and then illustrates a taxonomy
of see-through tools [1, 4] with examples from graphical editing and text editing tasks.
At the CHI'94 conference we presented a new style of graphical user interface, the See-Through
Interface(TM) [2]. We have subsequently renamed this interface the Magic Lens(TM)
interface. This interface includes semi-transparent interactive tools, called click-through tools, that
are used over application work areas. Tools appear on a virtual sheet of transparent glass, called a
Toolglass(TM) sheet, between the application and a traditional mouse cursor. The user positions a
sheet over application objects and then points through the tools to apply them to those objects. The user
can move a Toolglass sheet in two ways: by dragging it with the mouse or by connecting it to a trackball
operated with the non-dominant hand. Using both input devices, the user can move a sheet and a mouse
cursor simultaneously [3]. For example, a set of simple tools called click-through buttons [Fig. 1]
can be used to change the color of objects below them. The user positions the tool in the vicinity and
indicates precisely which object to color by clicking through the button with the cursor over that object.
This video illustrates a taxonomy of see-through tools that partially describes this design space. Each scene
in the videotape treats an axis of the taxonomy. As see-through tools enable a vast new design space, many
axes are possible; we present a sample set of axes.
A Toolglass sheet may contain a mixture of tools, some of which the user clicks through, and some
of which the user clicks on. Click-on tools are traditional tools, like buttons and sliders that act on
cursor coordinates themselves; they do not pass coordinates on to any other application. Click-through
tools pass cursor coordinates through for further processing by entities below them including applications,
click-on tools, or other click-through tools. Users can distinguish tool types by tool appearance: click-on
tools are opaque to make them visually distinct from click-through tools. For example, click-on buttons are
used to select parameters for click-through tools such as setting the type of filter to use in a tool or selecting
a new tool shape from a set of alternative shapes. Click-on sliders adjust viewing parameters, such as the
magnification of a scaling lens. Figure 2 illustrates.
Figure 2. The Lens Sampler tool.
Figure 3. Property Sampler/Applicator. (a) Sampling fill color. (b) Applying
dashes. (c) The result.
A variety of user actions can trigger a see-through tool. Triggering actions are matched in a natural way to
the tool action that they invoke. A simple button-down/drag/button-up sequence is used to select a
graphical shape from a Toolglass sheet and then to drag a copy of that shape into position on the underlying
application. Alternatively, the user can make a stroke from one tool region to another. This kind of
stroking motion is very effective in transferring application object properties between an object and a tool.
We illustrate with a graphical property transfer pie-shaped tool [Fig. 3]. Stroking from the object to the
"Fill color" button picks up the color; stroking from the "Dashes" button to the object deposits the dash
pattern [Fig. 3]. Finally, we show a gesture interpreter tool that transforms simple gestures made with
mouse or stylus into commands and objects in the underlying application.
Tools may differ in the way data flows between the tool and the application. We have already discussed the
case of transferring a graphical shape to an underlying editor. In that case, a single object passes
down from the tool to the application. When we use a property transfer tool, object properties move up
from the application to the tool. A click-through clipboard is a bi-directional tool; when a clipboard
tool copies an object, data flows from the application to the tool. When a clipboard pastes an object, data
flows from the tool to the application. While many tools transfer only a small amount of
information, they may also transfer a large amount of information, such as invoking the read of a large data
file or a data base query. Figure 4 demonstrates an example clip-art library browser.
The Magic Lens Interface has the potential to unify interfaces across diverse applications. For example,
operations that many applications have in common, such as cut, copy, paste, move, apply and read
properties of application objects, can have a single interface that makes it easy to, for example, pick up a
color from a graphics editor and apply that color to a word or paragraph in a text editor. One unusual
application uses see-through tools to perform operations on traditional control panels. That is, by receiving
a set of widgets literally picked up from traditional control panels, users can create a customized graphical
macro that applies the operations from those separate widgets in a meaningful sequence with a single mouse
click. Figure 5a illustrates a traditional control panel with iconic menu buttons for stroke joints, stroke
ends, and dash patterns. Figure 5b shows a macro tool that has picked up a dash pattern and a stroke end
type and applied it to an oval shape.
Figure 5. Making a macro. (a) A traditional control panel. (b) Applying a
macro to an oval.
Tools may change the appearance of the application seen through them in order to enhance the tool's
function. A vertex selection tool, for example, may provide a wire-frame view of a local area in a solidly
shaded drawing so that hidden vertices can be seen and selected [Fig. 6]. Simple magnification views allow
easier operation in crowded, detailed sections of graphic illustrations. Tools may themselves have unusual
appearance, such as semi-transparency that indicates the tool presence without obscuring the application
objects below. It may also be desirable for see-through tools to have a consistent graphical appearance that
clearly distinguishes them from more common applications and widgets.
Figure 6. Three tools. (a) Vertex selector. (b) X-ray filter. (c) Vertex selector
with x-ray filter.
Most see-through tools move rigidly with the Toolglass sheet. Others move relative to the sheet in order to
dynamically align themselves with interesting objects underneath. Geometric construction aids such as
straight lines and circles can be used for precise construction of new graphical objects by drawing through
see-through alignment tools to the underlying application. Tool parts may be created dynamically in
response to underlying context. We show a font size see-through tool [Fig. 7] which has been positioned
over two text strings. A font size controller appears next to each text string, which displays the current font
size and also provides click-on interactors for changing the size.
Abstract
Keywords:
taxonomy, user interface, see-through, transparent, multi-hand, lens, viewing filter, button, menu, control
panel, macro
SCENE 1: Introduction AND REVIEW
SCENE 2: INPUT TRANSPARENCY
SCENE 3: TRIGGERING METHODS
SCENE 4: DATA DIRECTION AND MAGNITUDE
SCENE 5: APPLICATIONS
SCENE 6: APPEARANCE
SCENE 7: MOTION
SCENE 8: CONCLUSION
The examples of see-through tools in this video show that the Magic Lens Interface system is a large new
design space for user interface tools. Effective tools can be found throughout the space, making it well
worth exploring.
