In my previous couple of posts, I explored some methods for coding some imperfection into the drawing of basic geometric shapes, where the imperfection was created through the use of a fractal subdivision process. First I drew circles, then rectangles. These imperfect curves have proven to be a rich source for some experiments in generative art, and below I share several variations on a common theme.

Click on each screencap to see randomized images generated in real time. Each page has a button at the bottom to allow for exporting the image that is created: the image will be opened up in a new window, and you can then right click on the image and select “save as…” to save the image in PNG format.

After checking out the live demos, scroll down to the bottom of the page for the full source code for all of these applications, and also to read my notes about how the images are created.

[Update 2021: I’m afraid I had to remove my code as it seems people may be profiting from NFTs built with my ideas and code, without attribution.

I’m afraid I have also felt the need to remove the ideas behind the code. In short, it works this way: deformed circles move across the canvas, and trace out these shapes.]

Transparent blue, radial gradient:

HTML5 generative art 1
Transparent orange, linear gradient:

HTML5 generative art 1
Solid with gradient:

HTML5 generative art 1
Solid created with an offset drawing method:

HTML5 generative art 1
Solid gray:

HTML5 generative art 1
Two intersecting (random colors):

HTML5 generative art 1
Two intersecting on black:

HTML5 generative art 1