Generative Design with p5.js / Sketch P_2_1_2_01 を試しながらアレンジ。
元ネタ:https://editor.p5js.org/generative-design/sketches/P_2_1_2_01
新たに覚えたコマンドなど
特になし。
もはや今までに出てきた基本的なコマンドだけで、アイディア次第で多様な表現が可能なことが分かる。
ロジックのポイント
タイル状に並べた円を、カーソルの位置に応じて移動や変形をさせている。
カーソルのX座標が移動量に、Y座標が拡大率に連動している。
移動量にはランダム性をもたせているので、途中からグリッドが認識できなくなるのが面白い。
var shiftX = random(-mouseX, mouseX) / 20;
var shiftY = random(-mouseX, mouseX) / 20;
さらに、拡大率にもランダム性を追加してみた。
var scale = random(10, 25);
ellipse(posX + shiftX, posY + shiftY, mouseY / scale, mouseY / scale);
複雑性が増加して面白くなった。
ただCPU負荷は高いようだ。