observations:
1. Two colors are used: black and white.
2. The artwork is square.
3. There's a bit of margin on all sides
4. All lines are equal length.
5. The lines are rotated at random angles.
6. The center point of the lines are precisely positioned on a grid.
7. There are a total of 57x57 spots
8. There are empty spots. Some are small with just one or two lines missing. Some have grown bigger.
9. There is either a horizontal or vertical grain.
10. The length of each line is the twice that of the spacing between center points of adjacent lines (or maybe a bit shorter).
sketch:
var NOISE_SCALE = 0.13; var NOISE_SCALE_ROT = 1; var NOISE_THRESHOLD = 0.3; var UNIT_SPACE; var grains = ['H', 'V']; var defaultRotation; var justClicked = true; var initialSeed; function setup() { createCanvas(720, 720); UNIT_SPACE = width/61; stroke(0); strokeWeight(1); initialSeed = random(1000); noiseDetail(8, 0.5); } function draw() { if (justClicked) { // set grain between "horizontal" and "vertical" if (random(grains) === 'H') defaultRotation = 0; else defaultRotation = PI/2; // set a new noise seed value noiseSeed(initialSeed++); // draw pattern background(255); for (var y = 3; y < 59; y++ ) { for (var x = 3; x < 59; x++) { // generate noise var noiseValue = noise(NOISE_SCALE*x, NOISE_SCALE*y); // low-pass filter if (noiseValue > NOISE_THRESHOLD) { // draw individual line push(); translate( x*UNIT_SPACE, y*UNIT_SPACE ); rotate(defaultRotation); // apply noise to rotation rotate(map(noise(NOISE_SCALE_ROT*x, NOISE_SCALE_ROT*y), 0, 1, -PI/1.8, PI/1.8)); // rotate based on noise line( -0.95*UNIT_SPACE, 0, 0.95*UNIT_SPACE, 0 ); pop(); } } } justClicked = false; } } function mouseClicked() { justClicked = true; } |
thoughts:
Writing down the observations really helped me realize certain details that might have gone unnoticed such as the horizontal or vertical grain. The images also grew on me as I looked more at them. I set off to learn more about the Perlin noise. Soon I figured that the pattern of the empty spots and line rotations could be achieved with Perlin noise. I started coding right away, only to find out that I didn't understand Perlin noise correctly. So I took my time reading the p5 documentations and some texts on the mathematical foundation of Perlin noise. I was really surprised when I found out that Vera Molnar made Interruptions before Perlin noise was invented. If there was any particular difficulty with this sketch, it was trying to get both outcomes right--the empty patterns and line rotation--with the same parameters for the noiseDetail() function.