Checkerboard animation 2
A much more complicated checkerboard animation. Made right after checkerboard animation 1 for a TilingTuesday post on Mastodon.
function setup() {
createCanvas(windowWidth, windowHeight);
}
function draw() {
background(220)
let s = 40
noStroke()
for (let z = 0; z < 2; z ++) {
for (let i = -1; i < width / s + 1; i ++) {
for (let j = -1; j < height / s + 1; j ++) {
let t = frameCount * 22 / 5000
t += noise(i*0.1, j*0.1, frameCount/400)
// t = 0.45 + i/100
t = t % 1
t = (1 - cos((t % 0.5 * 2) * PI)) / 2 / 2 + floor(t * 2) / 2
t = (1 - cos((t % 0.5 * 2) * PI)) / 2 / 2 + floor(t * 2) / 2
push()
translate(i * s, j * s)
if (z == 0) {
fill(t < 0.5 ? 0 : 255)
rect(-s/2, -s/2, s, s)
} else if (((i + j) % 2) == (t < 0.5)) {
fill(t < 0.5 ? 255 : 0)
rotate(t * PI * (noise(1000+i*0.1, j*0.1, floor(t) / 2)>0.5 ? -1 : 1))
//scale(1 + sin(t % 0.5 * 2 * PI) ** 5 * 0.1)
rect(-s/2, -s/2, s, s)
}
pop()
}
}
}
}(Originally seen at https://editor.p5js.org/bojidar-bg/sketches/j3T6PwfH1)
Browse more articles?
← Checkerboard animation 1 Experiments tagged p5 (42/85) Spinning hexagon cubes →
← Checkerboard animation 1 Experiments tagged tiling (3/6) Spinning hexagon cubes →
← Checkerboard animation 1 Experiments on this site (42/85) Spinning hexagon cubes →