Creative Coding

三〇六輪試行錯誤05・身近な空気を可視化する

身近な話題で恐縮ですが、言いたいことを言わない(言えない)状況が気づいたら多くなってるなあという感じです。会社に例えると、自分<先輩<上司<部長、みたいなのが延々と規則正しく並んでいる感じでしょうか。その状態を輪で表すには同心円(中心が同じ位置にある複数の円)かなと思ったのです。最初はランダムな色でやってみたのですが、身近ということで、一見赤の塗りに見えるような306個の同心円にしました。

※この記事は、7月までに三〇六輪100個作る企画の第5弾です。

306個の同心円、線の太さは1、1〜306回のループで直径2〜612の輪を作っていきます。色は赤、アルファチャネルで透明度を次第に出していき、一番大きな輪はほどんど見えない状況。ブログ投稿ということで余白は最小限でやってます。背景は白っぽいグレーにしました(下記のコードの4行目の明度96の指定)。

float wd, pos;
size(630,630);
colorMode(HSB,360,100,100,100);
background(0,0,96,100); 
smooth(); 
noFill();  

pos = float(630 / 2);
for (int itr = 1; itr <= 306; itr++) {
  strokeWeight(1);
   wd = float(itr*2);
  stroke(0,100,100,(100-(itr-1)*100/306));
  ellipse(pos,pos, wd, wd);   
}
 save("306rin.png" );

背景はグレースケールで4つほどパターンを考えましたが、試した中で一番明るいグレーがよいかなと(明度が100が白、96、90、80を試した)。

背景:白
背景:グレー(明度96)
背景:グレー(明度90)
背景:グレー(明度80)

上記の画像は塗りに見えますが、同心円です(中心が塗られていない)。コンパスで少しずつ大きくして円を描くとこんな感じでしょうか?
ちなみに、アルファチャネル変化させずに透明度なしで行った場合の同心円と塗りで同じ大きさの円を描いた場合の違いは以下。

306個の同心円
赤の塗り

ぱっと見どっちだっていいよって感じですが、結構このやり方好きですね。もう少し時間をおいてやり直してみようと思いました。