Texture — Generative Snacks!
Computers are fantastic companions for creating generative art — they are fast, (usually!) predictable, and can render pretty much anything you can imagine. But, there are a few things they don’t do so well out of the box. One of those things is texture.
Why? “Analog” materials such as paint or paper naturally add depth to a piece. When working digitally, we often sacrifice the organic depth they provide for precision and speed. Here are three ways to add some beautiful texture back into your work!
Tiny random shapes
For our first technique, all we need is some simple shapes added to a canvas at random points. Each of these shapes should usually have a slightly different size, but other than that, there are no rules!
Here’s an example using circles:
Here’s an example using randomly rotated lines:
And here’s an example using randomly rotated lines and circles:
Lovely! Simple but effective.
Painting with lines
Our second technique is fantastic for creating solid shape fills with character. Here’s how it works:
First, we draw a collection of lines between random points on a shape’s bounding box:
Then, we mask those lines to the shape:
Finally, we can randomize the color and size of each line a little for a different look:
Cool, right? I’m using SVG for my examples here, but you can achieve the same effect in canvas, etc.
Poisson Disk Sampling
Our third technique is almost a progression from the first. Here, rather than randomly placing objects, we use Poisson Disk Sampling to add non-overlapping circles to a canvas:
Then, we can use the position and radius values of these circles to place other objects:
From here, we can implement a custom “distance function” to create more intricate compositions:
Awesome! The example above is using a simplex noise grid to drive the placement of its objects, but there is a ton of room for creativity with this technique.
Well folks, that’s all for this generative snack!
As a little creative exercise, try to find an exciting texture in the physical world and recreate it with code. Just remember, it doesn’t have to be perfect. You don’t always need to reproduce the physical world 1:1 — a simple nod to reality is often enough!
Keep in touch!
Sign up for updates on fresh new articles, generative art, and more! No spam, unsubscribe at any time.