Difference between revisions of "Cage tool"

Revision as of 17:39, 18 December 2010

Work in progress on the new cage tool. This is more a description of the solutions model than a true specification.

note to nitpicks: no, the ‘i’s have not been dotted, but usability is up by a factor of 18.

goals

The main goal of this interaction design is to make the mode switch—of either editing the cage (a polygon) or deforming the underlying image—as natural and unnoticeable as possible.

before the polygon

The only user-noticeable state shall be the polygon creation state. Some guidelines:

• creating the polygon shall be analogous to creating one with the free-poly select tool, including:
  • hit backspace to erase the last created poly-point;
  • adjustment of the position of any poly-point while creating;
  • closing the polygon by hitting return; double-click to create a final poly-point and close; hit the starting poly-point;
• really, really really check out the spec, source and developer (Enselic) of the free-poly tool to get this right.

after the close

After the polygon is closed, user shall be able to edit any poly-point or deform the underlying image (layer) in any give order, by simply doing it.

note: edit handles and edges shown in current experimental and really not working fat-3-pix style: to be solved

The core of the solution is that each poly-point has two handles attached to it:

1. the edit handle, same as used for creating the polygon;
2. the deform handle:
   • looks both in shape and in fill color (only black and white allowed, btw. for max contrast) different than the edit handle;
   • the diamond shape (a square, 45° rotated) gives a good shape contrast and move kind of feeling; also only block 1/4 of the edit handle;
   • always positioned on the outside of the polygon, its angle being half the angle that the two edges leading up to the poly-point have.

the simple rule

Moving (i.e. click - drag - release) the edit handle shall move the poly point by the same vector, change the cage but not deform the image;

moving the deform handle handle shall move the poly point by the same vector, change the cage and deform the image.

selection

• clicking on either handle of a poly-point selects it;
• click - drag - release on either handle of a poly-point selects it;
• both of the above are cleanly defined event in GIMP (AFAIK);
• when a poly-point is selected, both its handles highlight; there is absolutely no concept of either handle being selected, the poly-point is selected and so are both handles (concurrency principle);

deselection

A poly-point becomes deselected when:

• another poly-point is selected;
• a deselect is done by clicking outside the polygon on the canvas.

(see also multi-select, below)

multi-selection

Multi-selection is optional. It all works without it, but better with it.

Multi-selection shall be based on the multi select model of the icon grid view of a file browser. This includes:

• using <shift> to add or delete poly-points to the multi-selection;
• rubber-banding from outside the polygon to multi-select poly-points;
• using <shift> with rubber-banding from outside the polygon to add or delete (first poly-point hit determines the mode) poly-points to the multi-selection;

Both moving modes (edit and deform) and delete operate on multi-selections.

adding poly-points

Starting from the radius of an edit handle, if users click within half this radius from a polygon edge, then:

• a poly-point is added to this edge (the closest from the click in ambiguous cases), closest to where the click was (use projection normal to the edge);
• this poly-point is selected (so in case of a mistake a delete can be made swiftly);
• a click - drag - release creates the point and moves it into the desired position.

deleting poly-points

The selected poly-point (or multi-selected poly-points) are deleted by hitting the backspace or delete key.

end of a polygon

By pressing <enter> the polygon is removed from the canvas, all deformation calculations made using this polygon are finalised and a new polygon can be created in the cage tool.

By pressing <escape> the polygon is removed from the canvas, all deformation calculations made using this polygon are reverted and a new polygon can be created in the cage tool.

the finer points of undo

During the period that a polygon exists, the following actions are undo-able one by one, back to the moment the polygon closed:

• moving (either mode: edit and deforms), also of multi-selects (all at once);
• add poly-point;
• delete poly-point, also of multi-selects (all at once).