Difference between revisions of "Tiling tool"
(Added guide behavior, replaced "mode" with actions, added transformation options. Still need to finish and add visual elements.) |
(Added image mockups, added guides options helping the creation of seamless tiles for all tile types) |
||
Line 18: | Line 18: | ||
|- | |- | ||
! scope="row" | Clone along path | ! scope="row" | Clone along path | ||
| Clones are created along a path. This can be used to create a string of decorations, for repeating frill designs etc. | | Clones are created along a path. This can be used to create a string of decorations, for repeating frill designs, for page borders etc. | ||
|} | |} | ||
Line 30: | Line 30: | ||
== Symmetry or tiling options == | == Symmetry or tiling options == | ||
[http://postimage.org/image/9w57ujh1l/ List of Toolbar designs] | |||
=== Symmetry or tiling type === | === Symmetry or tiling type === | ||
Line 45: | Line 47: | ||
* Y Symmetry | * Y Symmetry | ||
* Point Symmetry | * Point Symmetry | ||
| Inkscape internally keeps track of an X-axis and a Y-axis, using their intersection for point symmetry. The X/Y axis group can be rotated. | | Inkscape internally keeps track of an X-axis and a Y-axis, using their intersection for point symmetry. The X/Y axis group can be rotated. | ||
| | | | ||
* | * Inkscape generates an X and Y axis, aligned by default to the bottom-right of the object's bounding box. | ||
* | * The 3 symmetry types can be simply toggled on and off. They can all be chosen at the same time. | ||
|- | |- | ||
! scope="row" | Tiling | ! scope="row" | Tiling | ||
Line 59: | Line 59: | ||
! scope="row" | Radial Clones | ! scope="row" | Radial Clones | ||
| | | | ||
* None | |||
* Simple symmetry | * Simple symmetry | ||
* Symmetry + rotate | * Symmetry + rotate | ||
| Inkscape generates an angle guide that by defaut is centered on the object's center of rotation. The user can control both the center and the angle of the guide. Two default orientations are available. | | Inkscape generates an angle guide that by defaut is centered on the object's center of rotation. The user can control both the center and the angle of the guide. Two default orientations are available. | ||
| All advanced transformations are according to polar coordinates. | | | ||
* By default, the Radial Clone type is "none." Just Select simple rotation or Symmetry + rotate to apply desired radial clone. | |||
* Rather than specify a base angle, the toolbar asks you to specify the number of times the sphere must be divided by (example: 60). The reasoning behind this is that it's more intuitive for most users, and avoids rounding problems. | |||
* You can enter a number of copies higher than the number of divisions (for example, when Dynamics are applied) | |||
* All advanced transformations are according to polar coordinates. | |||
|- | |- | ||
! scope="row" | Clones Along Path | ! scope="row" | Clones Along Path | ||
Line 69: | Line 74: | ||
* Clone at each node along the path | * Clone at each node along the path | ||
| A path must be selected when "Clones Along Path" is applied | | A path must be selected when "Clones Along Path" is applied | ||
| By default, the point at which the clones snap to the selected path is its rotation center. | | By default, the point at which the clones snap to the selected path is its rotation center. All advanced transformations use Normal/Tangential coordinates. | ||
|} | |} | ||
=== | === Break tiling === | ||
By default, all tiles generated are clones of the original. 3 actions are available to the generated clones: | By default, all tiles generated are clones of the original. 3 actions are available to the generated clones: | ||
* Unclump: all generated clones are unlinked from the original. Subsequent transformations to the original no longer apply. | * Unclump: all generated clones are unlinked from the original. Subsequent transformations to the original no longer apply. | ||
* Combine: Union ('Ctrl' + '+') is applied to the object and all its generated tiles. | * Combine: Union ('Ctrl' + '+') is applied to the object and all its generated tiles (note: this option may not be useful...). | ||
* Fuse paths: All end nodes located on guide points (see Guide Points for seamless tiling) are fused into a single node. | * Fuse paths: All end nodes located on guide points (see Guide Points for seamless tiling) are fused into a single node. | ||
[http://postimage.org/image/cdbx4oumh/ Behaviors for breaking tilings] | |||
=== Guide alignment === | === Guide alignment === | ||
Line 87: | Line 90: | ||
* See also [https://blueprints.launchpad.net/inkscape/+spec/transformation-anchors Transformation anchor]. | * See also [https://blueprints.launchpad.net/inkscape/+spec/transformation-anchors Transformation anchor]. | ||
* Rather than serve as transformation anchors though, the guides get aligned to the corresponding corner (they're just to make alignment faster). | * Rather than serve as transformation anchors though, the guides get aligned to the corresponding corner (they're just to make alignment faster). | ||
* However, although the guide gets aligned after a command, it can still be freely moved and transformed. | * However, although the guide gets aligned after a command, it can still be freely moved and transformed. | ||
* Why no starting angle for Radial tiles? Well, save yourself a bit of trouble and make the starting pattern vertical. | |||
=== Guide lock === | === Guide lock === | ||
Line 94: | Line 97: | ||
* '''Guide locked to object''': the guide moves and scales with the object. For example, if a vase is made by applying a symmetry to half a vase, moving the original will also move the other half, so the whole vase is moved. In the same way, scaling a tile scales its guide. If an on-canvas axis or node was chosen to apply a transformation, a copy of the resulting two axis are created and move with the object. | * '''Guide locked to object''': the guide moves and scales with the object. For example, if a vase is made by applying a symmetry to half a vase, moving the original will also move the other half, so the whole vase is moved. In the same way, scaling a tile scales its guide. If an on-canvas axis or node was chosen to apply a transformation, a copy of the resulting two axis are created and move with the object. | ||
* '''Unlocked guide''': the guide is absolute, so if the original gets moved, the copy will also be re-positioned according to the original guide position. | * '''Unlocked guide''': the guide is absolute, so if the original gets moved, the copy will also be re-positioned according to the original guide position. | ||
[http://postimage.org/image/fzmseg7bd/ Guide locking behavior] | |||
=== Guide visibility === | |||
Guide visibility can be toggled on and off, so the user can edit the original object with other tools with the guide is still visible. | |||
Line 103: | Line 113: | ||
* All guides save symmetry axes can be resized. All guides can be rotated. Toggling occurs by clicking again as with the Transform tool. | * All guides save symmetry axes can be resized. All guides can be rotated. Toggling occurs by clicking again as with the Transform tool. | ||
* The angle for the angle tool for radial clones can be edited on canvas, like for the Circle tool. | * The angle for the angle tool for radial clones can be edited on canvas, like for the Circle tool. | ||
* Skew is available for some tiling options using . | * Skew is available for some tiling options using parallelogram guides. | ||
* Input of numerical values could be available by double clicking a guide corner. | * Input of numerical values could be available by double clicking a guide corner? | ||
[http://postimage.org/image/qxy1wmvwp/ Guide editing options] | |||
=== Guide points for seamless tiling ==== | === Guide points for seamless tiling ==== | ||
* Double-clicking on the side of a guide creates a guide point for seamless tiling. | * Double-clicking on the side of a guide creates a guide point for seamless tiling. Copies of this guide point are automatically created at the relevant location on all concerned sides of the guide. | ||
* These points can be moved around. All the other copies move as well. | * These points can be moved around. All the other copies move as well. | ||
* | * Shift-drag on a guide point creates an angle guide, so users can better create smooth transitions. | ||
* '''When "Fuse paths" is applied, all end points snapped to guide points are fused, forming a single continuous path.''' | * '''When "Fuse paths" is applied, all end points snapped to guide points are fused, forming a single continuous path.''' | ||
[http://postimage.org/image/ae0dae6mh/ Guide points for seamless tiles] | |||
What's more, ctrl-clicking on a guide point creates a new guide point that forms a guide point pair with the first one. | |||
* '''When "Fuse paths" is applied, the segments between these two nodes gets deleted, and the resulting open nodes are joined with the corresponding nodes on the next tile.''' | |||
* Separating guide points and guide point pairs is necessary because Inkscape does a bad job of recognizing two separate lines as defining the borders of a single object. | |||
[http://postimage.org/image/kqmnwh05l/ Guide pairs for seamless tiles] | |||
== Advanced transformation options == | == Advanced transformation options == | ||
Line 124: | Line 142: | ||
* Users can save and use presets. This includes a "No dynamics" option. | * Users can save and use presets. This includes a "No dynamics" option. | ||
Originally I pondered whether presets should be located at the "Advanced" level or at the top level (i.e. presets include tiling type). But I reason that dynamics such as fading and color hues for example work about the same no matter what tiling type you're using. | Originally I pondered whether presets should be located at the "Advanced" level or at the top level (i.e. presets include tiling type). But I reason that dynamics such as fading and color hues for example work about the same no matter what tiling type you're using. | ||
[http://postimage.org/image/qxszzipl5/ Advanced options for tilings] | |||
== To-do == | |||
Think up an interface for Clone Along Path that allows a more advanced version of Pattern Along Path thanks to using guide points on a basic tile. The main issue is that all the tiles, including the original, gets deformed along the path, so editing the base tile must be done separately. |
Revision as of 16:14, 5 February 2012
Symmetry and Tile tool
The current tile interface is hard to use. The current proposal for Symmetry and Tiles tool seeks to expand upon its uses while proposing an interface that is easy to use. This proposal proposes 4 modes or sub-tools:
Tool | Description |
---|---|
Symmetry | This tool is destined for users who just want some basic symmetries. Use cases include pattern design and technical drawing. |
Tiling | This tool allows users to use the 17 wallpaper types. |
Radial clones | This is for radial designs, and uses polar coordinates. |
Clone along path | Clones are created along a path. This can be used to create a string of decorations, for repeating frill designs, for page borders etc. |
General behaviour
Applying any Symmetry or Tile results in the following behaviour:
- If the object isn't a group, a group is made out of the selected object. This allows the user to enter the group and add extra elements.
- A corresponding guide is generated. This guide can be edited with the Tile and Symmetry tool. All guides can be resized or rotated, but further transformations depend on the guide type.
- Copies are generated from the original object.
- The original and its copies can be selected and grouped, and a new transformation can be applied to the group. This allows, for example, for a user to create a symmetrical pattern then use it as a tile.
Symmetry or tiling options
Symmetry or tiling type
Tool | Available options | Guides | Notes |
---|---|---|---|
Symmetry |
|
Inkscape internally keeps track of an X-axis and a Y-axis, using their intersection for point symmetry. The X/Y axis group can be rotated. |
|
Tiling | All 17 tiling options available. | Inkscape generates a guide specific to the transformation type upon application of the tiling. This guide remains editable on-canvas with the Symmetry and Tiling tool. | Because the 17 tiling options use different guide shapes, tiling does not give an option to select existing guides on-canvas. |
Radial Clones |
|
Inkscape generates an angle guide that by defaut is centered on the object's center of rotation. The user can control both the center and the angle of the guide. Two default orientations are available. |
|
Clones Along Path |
|
A path must be selected when "Clones Along Path" is applied | By default, the point at which the clones snap to the selected path is its rotation center. All advanced transformations use Normal/Tangential coordinates. |
Break tiling
By default, all tiles generated are clones of the original. 3 actions are available to the generated clones:
- Unclump: all generated clones are unlinked from the original. Subsequent transformations to the original no longer apply.
- Combine: Union ('Ctrl' + '+') is applied to the object and all its generated tiles (note: this option may not be useful...).
- Fuse paths: All end nodes located on guide points (see Guide Points for seamless tiling) are fused into a single node.
Behaviors for breaking tilings
Guide alignment
- See also Transformation anchor.
- Rather than serve as transformation anchors though, the guides get aligned to the corresponding corner (they're just to make alignment faster).
- However, although the guide gets aligned after a command, it can still be freely moved and transformed.
- Why no starting angle for Radial tiles? Well, save yourself a bit of trouble and make the starting pattern vertical.
Guide lock
- Guide locked to object: the guide moves and scales with the object. For example, if a vase is made by applying a symmetry to half a vase, moving the original will also move the other half, so the whole vase is moved. In the same way, scaling a tile scales its guide. If an on-canvas axis or node was chosen to apply a transformation, a copy of the resulting two axis are created and move with the object.
- Unlocked guide: the guide is absolute, so if the original gets moved, the copy will also be re-positioned according to the original guide position.
Guide visibility
Guide visibility can be toggled on and off, so the user can edit the original object with other tools with the guide is still visible.
Guide editing
Guide transformations
Available transformations depend on the guide type:
- All guides save symmetry axes can be resized. All guides can be rotated. Toggling occurs by clicking again as with the Transform tool.
- The angle for the angle tool for radial clones can be edited on canvas, like for the Circle tool.
- Skew is available for some tiling options using parallelogram guides.
- Input of numerical values could be available by double clicking a guide corner?
Guide points for seamless tiling =
- Double-clicking on the side of a guide creates a guide point for seamless tiling. Copies of this guide point are automatically created at the relevant location on all concerned sides of the guide.
- These points can be moved around. All the other copies move as well.
- Shift-drag on a guide point creates an angle guide, so users can better create smooth transitions.
- When "Fuse paths" is applied, all end points snapped to guide points are fused, forming a single continuous path.
Guide points for seamless tiles
What's more, ctrl-clicking on a guide point creates a new guide point that forms a guide point pair with the first one.
- When "Fuse paths" is applied, the segments between these two nodes gets deleted, and the resulting open nodes are joined with the corresponding nodes on the next tile.
- Separating guide points and guide point pairs is necessary because Inkscape does a bad job of recognizing two separate lines as defining the borders of a single object.
Guide pairs for seamless tiles
Advanced transformation options
The "Dynamics" button opens up a separate dialogue with transformation options corresponding to the current tiling interface. Major differences are:
- Vertical listing
- Checkbox next to every transformation type, so users can easily remove all of them while retaining some values.
- Radial Clones use Polar coordinates.
- Clones along Path use orthogonal coordinates (normal and orthogonal).
- Users can save and use presets. This includes a "No dynamics" option.
Originally I pondered whether presets should be located at the "Advanced" level or at the top level (i.e. presets include tiling type). But I reason that dynamics such as fading and color hues for example work about the same no matter what tiling type you're using.
To-do
Think up an interface for Clone Along Path that allows a more advanced version of Pattern Along Path thanks to using guide points on a basic tile. The main issue is that all the tiles, including the original, gets deformed along the path, so editing the base tile must be done separately.