think-cell technical report TC2003/01 A GUI-based Interaction ...

4.3 Specifying the User Interface INTERACTION CONCEPT
(a) Halving the insertion works for all edges . . . (b) . . . of the proposed bounding box.
Figure 19: Moving the mouse pointer near the edge of the proposed insertion area
of figure 18(b) cuts the area in half.
(a) The new element can fill an entire area . . . (b) . . . or leave a gap to the next shapes.
Figure 20: By simply moving the mouse cursor, many reasonable placements can
be realized with a single click.
Drag-and-Drop with Snapping
Drag-and-drop requires more user interactions and more attention, therefore taking
more time and effort than single-click insertion. However, while with single-click
only predefined placements can be chosen, with drag-and-drop the user is free to
choose an arbitrary rectangular placement. The drag-and-drop insertion behaves
the same like in ordinary PowerPoint, with the only exception that the caret is
snapped to existing gridlines. That way, the smart grid provides guidance to support
effortless and yet precise alignment with existing shapes. Again, only the placement
relative to existing gridlines is relevant; as before, the details of sizes and proportions
are up to the solver.
Figures 21 and 22 show, how snapping can be used to align one or more edges
of the new element. As before, these figures are live screenshots from my prototype
(Chap. 5) with only little touch-up for better understanding. The circled numbers
indicate the steps of the interaction: At (1) the left mouse button is pressed. Then,
with the button down, the mouse is dragged to position (2), where the button is
released. Step (3) shows the result of the interaction, which is meant to be further
adjusted by the solver.
55