Inkscape Art: Lattice Deformation
Nick Nagel's Procedural Art with Inkscape Series
To be continued ...
Featured in this Post ...
Inkscape's Lattice Deformation .
Lattice Deformation
In this post I'll focus on lattice deformation -- a subsystem available in Inkscape that can be applied to create interesting artworks in SVG. The lattice deformation tool enables artists to distort and warp shapes and patterns in a controlled manner. I like to use it to create interesting topography on which to ground figures in story telling and illustration. For example, in the illustration below I've applied lattice deformation to create a wavy chess board for an "Alice in Wonderland" type illustration.
There are lots of reasons an artist might want to use the tool, for example;
-
Creating unique perspective effects
-
Warping text in interesting and unique ways
-
Creating patterns and backgrounds
-
Morphing shapes in controlled ways
So lets explore how to use the tool in the context of creating a character for illustration.
The Workflow
Simplified Control
Lattice Deformation provides simplified control to effectively create complex distortions. Instead of having to push and pull hundreds of nodes you only have a handful of control points defined by the lattice that you have to worry about to create complex effects.
Non-Destructive Editing
Inkscape's Lattice Deformation tool is a "Live Path Effect" (an LPE). It's designed to enable non-destructive editing. The means you can open the tool over an object, make changes, go back and compare your creation to the source object -- all while preserving the original shapes and contours of the illustration you're modifying.
The Recipe for Lattice Deformation
To use the tool you can follow this simple recipe:
-
Create an object that you want to shape. The tool can be used to shape anything -- it doesn't have to be applied only to lines and grids. For complex contours you can combine them in inkscape such that all the nodes are defined as a single path.
-
Open the Lattice Deformation Path Effect.
- With your object selected,
- Go to: Path > Path Effects (
Ctrl + Shift + 7) - Find and add Lattice Deformation.
-
To show the lattice overlay select the node tool (or use the
F2keyboard shortcut).
And bang; you're good to go!
Applying Lattice Deformation
In the video I've included below I show how to apply lattice deformation to create a unique character appearance from simpler objects. If you watch the video, you'll see how I start with a a simple set of contours representing a face and use the the lattice interface to "sculpt the lines" to create a unique perspective on the character. This technique is also available to create 3D shapes in tools like Blender.
Notice in the video how I follow the recipe I outlined above. I start with some basic ovals defining a face. The design is OK but comes off as flat -- I'm looking for something a bit more dynamic for the final character. Next I open the lattice tool and reveal the grid by clicking the 'node tool' icon to the left. In the video you can see how I edit the shapes as a whole by pushing and pulling the control points on the lattice. Again, Inkscape will preserve the underlying object until I'm done with this part of the flow.
Finally, once satisfied with my edits, I freeze the effect:
`Path > 'Object to Path'`
Converting the transformed object back to a path provides the pure SVG for final rendering.
Conclusion
So that's about it. Hopefully the examples and demonstration I've provided in this article will inspire you to play with the lattice deformation tool in Inkscape. It takes a bit of practice, but once you get the hang of it it's a powerful means to create inspired artistic creations with SVG.
