Difference between revisions of "Specifications"

From GIMP GUI Redesign
Jump to: navigation, search
(the ratio/widht/height constraint and the shift key)
(Design Work 2012)
 
(16 intermediate revisions by 2 users not shown)
Line 1: Line 1:
 
Solution models get further developed into UI specifications, ready for implementation.
 
Solution models get further developed into UI specifications, ready for implementation.
  
==version 2.4==
+
== Design Work 2012 ==
  
===selection/crop tool specification===
+
===[[Rethinking GIMP Tool Options]]===
  
This is the specification for the rectangle + oval selection, and the
+
A solutions model for the Tool Options.
crop tools. It is based on the state of GIMP 2.3.13, and is now updated with the realities of 2.3.18.
 
  
====on units, sizes and visible====
+
===[[Text-Handling in GIMP]]===
  
All sizes in this spec are in '''on-screen pixels'''. This means that the zoom level has an influence on everything. A 30x20 in-image rectangle can be displayed on screen as 300x200, and vice versa.
+
beyond the Text tool: a redesign of the complete [[Text-Handling in GIMP]]
  
Also the panning of the image has an influence on everything. Only the visible part of the bounding rectangle goes into the size calculations. Example: a 123x45 image rectangle is viewed at 1000%, only the left-most 2/3rd and top half of the rectangle is visible in the image window: 820x225 on-screen pixels go into the calculations ( 123*10*2/3 and 45*10/2).
+
==SoC 11==
  
====decision time====
+
===[[warp tool specification]]===
  
The right moment to recalculate handle sizes and decide if there is a narrow situation shall be '''after''' through zooming, panning or actual bounding rectangle size change, the on-screen pixel size of the bounding rectangle has changed. It is explicitly '''not''' desirable to do this during zooming, panning or actual bounding rectangle size change.
+
iWarp goes [[warp tool specification | to the toolbox]].
  
====handling the bounding rectangle on the canvas====
+
==SoC 09==
  
The algorithm for the size of the corner handles as implemented ('''new''' handle height = bounding rectangle height / 4, CLAMPed by 5 and 50, handle width  = bounding rectangle width  / 4, CLAMPed by 6 and 50) allows fast interaction:
+
===[[paint dynamics specification]]===
  
[[image:2.4_basic_corners.png]]
+
This is the [[paint dynamics specification  | specification]] for controlling paint dynamics.
  
what is black in this image shall be rendered inverted on the canvas. ''note that at any time the marching ants of a selection edge can obscure an inverted line.''
+
==version 2.8==
  
Each corner handle shall enable users to resize the bounding rectangle by dragging one of them, where the diagonally opposite corner of the bounding rectangle shall be the anchor point.
+
===[[cage tool]]===
  
The rectangle cornered by the corner handles shall be the move handle: one big handle where users shall be able to move the bounding rectangle around the canvas by initiating a drag in this handle:
+
Work in progress on the [[cage tool]].
  
[[image:2.4_move_area.png‎]]
+
===[[single-window mode specification]]===
  
''the gray area shown here is purely for illustration in this spec and shall not be rendered in GIMP''
+
This is the [[single-window mode specification  | specification]] for the single-window mode, in addition to the multi-window one.
  
Areas between two adjacent corner handles are called side handles.
+
===[[transformation tool specification]]===
  
The height of the two horizontal side handles shall be exactly the corner handle height, ('''new''') and their width shall be the (bounding rectangle width - 3 * corner handle width), CLAMPed on the lower side by 6.
+
This is the [[transformation tool specification  | specification]] for the unified transformation tool.
  
The width of the two vertical side handles shall be exactly the corner handle width, ('''new''') and their height shall be the (bounding rectangle height - 3 * corner handle height), CLAMPed on the lower side by 6.
+
===[[save + export specification]]===
  
All side handles shall be exactly centred on the side they are attached to. If the side of the of the bounding rectangle is an odd number of pixels long, then the attached side handle shall be an odd number of pixels long. Similarly: if even, then even. When this adjustment is needed, it shall be done by increasing the handle size by one pixel.
+
This [[save + export specification | specification]] defines a clear separation between saving and export, based on version 2.6.
  
[[image:2.4_side_handles.png‎]]
+
==version 2.6==
  
''the gray area shown here is purely for illustration in this spec and shall not be rendered in GIMP''
+
===[[selection + crop tool specification]]===
  
This all makes the size of the side handles predictable (and thus faster to use each time) where it counts most (their smallest dimension) and uses their largest dimension to leave a gap to reach the corner handles from within.
+
to be [[selection + crop tool specification  | completed…]]
  
Each side handle shall enable users to resize the bounding rectangle by dragging one of them, moving the side it is attached to, where the mid-point of the opposite side of the bounding rectangle shall be the anchor point.
+
===[[no image open specification]]===
  
What is left within the bounding rectangle are the ('''new''') dead areas, a drag by users starting in these shall do nothing, neither move, nor resize. This is to prevent accidental move when trying to resize, or accidental resize when trying to move:
+
This is the [[no image open specification  | specification]] for the state of GIMP when no image is open. It is still based on a multiple document interface model.
  
[[image:2.4_dead_areas.png‎]]
+
===[[free-polygon tool specification]]===
  
''the gray area shown here is purely for illustration in this spec and shall not be rendered in GIMP''
+
This is the [[free-polygon tool specification  | specification]] for the straight cross between the free selection tool and the new polygon selection tool, developed by Martin Nordholts.
  
In the implementation the dead areas shall be used as ‘bumpers’ to reconcile the rounding-off effects in the sizes of the corner and side handles. The dead areas are simply  what is left over in area of the bounding rectangle.
+
==version 2.4==
 
 
====highlighting====
 
 
 
When the sprite (mouse cursor) hovers over a corner handle, it shall highlight by inwardly doubling its perimeter line, and by hiding the other 3 corner handles:
 
 
 
[[image:2.4_corner_highlight.png‎]]
 
 
 
When the sprite hovers over a side handle, it shall highlight along the whole side of the bounding rectangle with a 2-pixel line, to communicate that it moves the side. The other dimension of the highlight rectangle shall be that of the corresponding side handle. Also there shall be ('''new''') two single-pixel lines to show the edge of the side handle itself. This is important because this is the only opportunity we have to communicate the size of the handle in a non-obstructive way. The two corner handles on the opposite side shall be hidden:
 
 
 
[[image:2.4_side_handles_highlight.png‎]]
 
 
 
====rubber-banding====
 
 
 
When the mouse goes down inside a corner handle and dragging commences, it shall be displayed and the other 3 hidden, to achieve a minimal-obstruction display:
 
 
 
[[image:2.4_corner_drag.png‎]]
 
 
 
When the mouse goes down inside a side handle and dragging commences, it shall display a rectangle along the whole side of the bounding rectangle with a 1-pixel line. The other dimension of this rectangle shall be that of the corresponding side handle. The two corner handles on the opposite side shall be hidden:
 
 
 
[[image:2.4_side_handles_drag.png‎]]
 
 
 
Corner handles shall '''not''' change in size during the rubber-banding of the size of the bounding rectangle. This is necessary to achieve a stable cause-and-effect relationship between the position of the sprite, and the size of the bounding rectangle. Side handles shall track the dimension of the bounding rectangle on their longer side, while their short side shall '''not''' change in size during the rubber-banding.
 
 
 
====cursor keys====
 
 
 
The most important thing about enabling cursor keys for moving/resizing the bounding rectangle is that it shall be exactly the same ''user experience'' as performing the same operation with a mouse click. The only exception to this is that when resizing due to a cursor key press, the rubber-banding display shall be skipped.
 
 
 
* When the mouse is over one of the corner or side handles, and one of the up/down/right/left cursor keys is pressed, the rectangle shall be resized by one (shift: 15) '''image''' pixel in that direction and ('''new''') the the canvas shall be scrolled in such a way that the position of the bounding rectangle under the sprite shall be constant.
 
*  When the mouse is over the move handle, and one of the up/down/right/left cursor keys is pressed, the rectangle shall be moved by one (shift: 15) '''image''' pixel in that direction and ('''new''') the the canvas shall be scrolled in such a way that the position of the bounding rectangle under the sprite shall be constant.
 
 
 
====think small====
 
 
 
(all '''new''') Both corner and side handles have a minimum size of 6 pixels. This will work for bounding rectangles down to a size of 18 pixels. Here we see rectangles with one and two dimensions of 18 pixels, also showing the side handles:
 
 
 
[[image:2.4_mini_sizes.png]]
 
 
 
''the gray area shown here is purely for illustration in this spec and shall not be rendered in GIMP''
 
 
 
If the size of one of the sides of the bounding rectangle is below 18 pixels, we have a '''narrow situation'''. This can be caused by actually narrow-sized bounding rectangles, but also by zooming out and panning out of view. The obvious work-arounds for this (zoom in, pan in) are productivity eaters, we need a real solution.
 
 
 
Move the handles outside. Here we see rectangles with one and two dimensions of 17 pixels:
 
 
 
[[image:2.4_maxi_narrow.png]]
 
 
 
In a narrow situation, the following specs change:
 
 
 
* The corner handle size shall be 15x15 pixels, always.
 
* If the the bounding rectangle has a non-narrow side, the long side of the side handle shall be (bounding rectangle side length - 2 * 15), CLAMPed on the lower side by 18, the short side of the side handle shall be 15 pixels.
 
* On the narrow sides, the size handles shall simply fill the space between the two corner handles:
 
 
 
[[image:2.4_narrow_side_handles.png‎‎]]
 
 
 
''the gray area shown here is purely for illustration in this spec and shall not be rendered in GIMP''
 
 
 
There shall be only dead areas on a non-narrow side:
 
 
 
[[image:2.4_narrow_dead_areas.png]]
 
 
 
''the gray area shown here is purely for illustration in this spec and shall not be rendered in GIMP''
 
 
 
The move handle shall be equal to the bounding rectangle:
 
 
 
[[image:2.4_narrow_move_handle.png]]
 
 
 
''the gray area shown here is purely for illustration in this spec and shall not be rendered in GIMP''
 
 
 
Highlighting is unchanged:
 
 
 
[[image:2.4_narrow_highlight.png]]
 
 
 
As is dragging:
 
 
 
[[image:2.4_narrow_drag.png]]
 
 
 
====interaction with the canvas edge====
 
 
 
In general it shall be possible to start a crop/selection rectangle outside the canvas, or to take the edges of the bounding rectangle outside the canvas. Below is specified what happens in these cases:
 
 
 
=====selection tools=====
 
 
 
When one or more edges of the bounding rectangle is outside the canvas, then the canvas edge shall clip the effective selection. The interaction shall reflect this by showing the bounding rectangle in whatever size and position that users take it and the effective selection marching ants along the canvas edge where clipped. Especially with the elliptic select tool, this is part of creative workflow.
 
 
 
''However:''
 
 
 
* If users enforce a constant ratio of the bounding rectangle and one or more edges of the bounding rectangle is outside the canvas, then all of these edges shall be aligned with the corresponding canvas edges, and the from the resulting new bounding rectangle sizes the ratio enforcement shall be calculated. The interaction shall reflect this by showing the bounding rectangle in the newly calculated position;
 
* If users enforce a constant width of the bounding rectangle and the left or right edge of the bounding rectangle is outside the canvas, then this edge shall be aligned with the corresponding canvas edges, and the from the resulting new bounding rectangle sizes the width enforcement shall be calculated. The interaction shall reflect this by showing the bounding rectangle in the newly calculated position; if the constant width is greater than the actual canvas width, then the full width of the canvas shall be used;
 
* If users enforce a constant height of the bounding rectangle and the top or bottom edge of the bounding rectangle is outside the canvas, then this edge shall be aligned with the corresponding canvas edges, and the from the resulting new bounding rectangle sizes the height enforcement shall be calculated. The interaction shall reflect this by showing the bounding rectangle in the newly calculated position; if the constant height is greater than the actual canvas height, then the full height of the canvas shall be used;
 
 
 
=====crop tool=====
 
 
 
When the 'allow growing' option has been invoked by users, then the crop tool shall be in no way limited by the canvas or layer edge. In the other case:
 
 
 
When one or more edges of the bounding rectangle is outside the canvas, then all of these edges shall be aligned with the corresponding canvas edges. The interaction shall reflect this by showing the bounding rectangle in the newly aligned position.
 
 
 
For constant ratio/width/height: see selection tools above.
 
 
 
If the 'Current layer only' option has been invoked by users, then all all behaviour specified above shall apply, substituting the layer (edge) for the canvas (edge).
 
 
 
====the ratio/widht/height/size constraint and the shift key====
 
 
 
Between the 'Expand from centre' and Highlight checkbox there shall be the Fixed ratio/width/height control:
 
 
 
[[Image:2.4_constant_ratio_control.png]]
 
 
 
It is a checkbox, with a pop-up list in the first row, combined with a single textfield and two icons( portrait landscape) in the second row. The pop-up list shall contain the items 'Aspect ratio', Width, Height, Size, in that order.
 
 
 
The width and height modes shall not display the icons:
 
 
 
[[Image:2.4_constant_wh_controls.png]]
 
 
 
The size mode is very similar to the ratio mode:
 
 
 
[[image:2.4_constant_size_controls.png]]
 
 
 
It is extremely important that the textfield shall be
 
a single textfield with no up/down arrows. This allows for
 
quicker input. The textfield shall accept the formats
 
A/B and A:B, where A and B are two floating point numbers.
 
 
 
The default value for the textfield shall be "1:1" for
 
the selection tools and
 
<current layer/canvas width>:<current layer/canvas height>
 
for the crop tool. When the user enters a value and confirms
 
it by enter/return or removing the input focus from the textfield,
 
this is the override value for this tool. It shall be displayed and
 
used for this tool for the rest of the runtime session, for every file.
 
This enable a pro to work 8 hours a day to cut out hundreds of 16:9
 
images.
 
 
 
This override value is cleared by clearing any numerical content from the field before confirming. This resets to displaying and using the default value for the tool.
 
 
 
When the checkbox is checked, the ratio shall be enforced while rubber-banding a rectangle. Pressing the shift key while rubber-banding shall toggle the checkbox in the other state.
 
 
 
The two icons shall be just icons, not in pushbuttons like in
 
the New dialog. Clicking one of the icons shall simply enforce
 
portrait or landscape in the textfield by swapping the two
 
number values when necessary.
 
 
 
=====rectangle feedback=====
 
 
 
When users are enforcing constant width or height in the tool options, the rectangle handles shall reflect this. Showing corner handles does not make sense, because only two of the sides can be adjusted. Therefore in simple pending state (i.e. not highlighting or rubber-banding) these two side handles shall be displayed (constant height, top; constant width, bottom):
 
 
 
[[image:2.4_constant_wh_handles.png]]
 
 
 
With no corner handles to compete with, the side handles shall occupy the whole side of the bounding rectangle. The height
 
of the top and bottom handles and the width of the left and right handles shall be calculated as usual. Highlighting of the side handles work as usual. Note that the full size of the side handles in this case makes that there shall be no need to draw the single-pixel size indicators.
 
 
 
====the tool option panels====
 
 
 
From all three tool option panels, remove all the Fix buttons,
 
The line with the Aspect fields, and the three buttons below it.
 
 
 
Selecting more than one of constant ratio/width/height actually
 
sets a constant rectangle size and this makes for wild, chaotic
 
rubber-banding behaviour. We could implement a radioing system
 
for these 3 constraints, but the complexity and UI bandwidth
 
usage is too much. So I chose the simple solution: specific
 
widths and heights shall be typed and confirmed by enter/return
 
or removing the input focus from the textfield. Clearing any
 
numerical content from a field before confirming shall just
 
restore the value displayed before the typing commenced.
 
 
 
All lines that contain textfields shall be sized such
 
that they just fit inside a tool option panel that is
 
6 tool icons wide (the default, I believe...).
 
 
 
The guides pop-up menu left side shall be aligned with
 
the left sides of the checkboxes, the pop-up menu right
 
side shall be aligned with the left sides of the textfields.
 
 
 
For the crop tool there shall be a new checkbox in the options panel: 'allow growing' (default: unchecked). Normally limiting cropping to the exact edges of the layer/canvas has the highest priority, hence the rules above. This checkbox overrides that, and the layer/canvas can be size up by dragging a bigger rectangle around it.
 
  
====highlight====
+
===[[selection + crop tool specification]]===
  
Even when the Highlight checkbox is checked, the darkening
+
This is the [[selection + crop tool specification  | specification]] for the rectangle + oval selection, and the crop tools. It is based on the state of GIMP 2.3.13, and is now updated with the realities of 2.3.18.
effect shall not be displayed during rubber-banding. This
 
allows for precise adjustments.
 

Latest revision as of 07:59, 16 July 2012

Solution models get further developed into UI specifications, ready for implementation.

Design Work 2012

Rethinking GIMP Tool Options

A solutions model for the Tool Options.

Text-Handling in GIMP

beyond the Text tool: a redesign of the complete Text-Handling in GIMP

SoC 11

warp tool specification

iWarp goes to the toolbox.

SoC 09

paint dynamics specification

This is the specification for controlling paint dynamics.

version 2.8

cage tool

Work in progress on the cage tool.

single-window mode specification

This is the specification for the single-window mode, in addition to the multi-window one.

transformation tool specification

This is the specification for the unified transformation tool.

save + export specification

This specification defines a clear separation between saving and export, based on version 2.6.

version 2.6

selection + crop tool specification

to be completed…

no image open specification

This is the specification for the state of GIMP when no image is open. It is still based on a multiple document interface model.

free-polygon tool specification

This is the specification for the straight cross between the free selection tool and the new polygon selection tool, developed by Martin Nordholts.

version 2.4

selection + crop tool specification

This is the specification for the rectangle + oval selection, and the crop tools. It is based on the state of GIMP 2.3.13, and is now updated with the realities of 2.3.18.