#002 CircRect

どうも。気ままにクリエイティブコーディング。気に入ったものができたので投稿します。

作品紹介

CircRect - OpenProcessing

ランダムな位置に円がかかれます。クリックすると四角がかかれます。マウスの位置に応じて図形は大きくなります。マウスのY座標が小さいほど透過されます。簡単で美しい。

Circle and Rectangleを文字ってCircRectと命名しました。

コードの解説

カラフルな色を扱いたい場合はカラーモードをHSBにするのが手っ取り早いですね。RGBだと、色の混合を想像しにくいですが、HSBモードだと第一引数だけで、数字の大小で色が変わります。

色については、また詳しく語りたいです。

＜参考：コード＞

function setup() {
 createCanvas(800, 800);
 colorMode(HSB,100);
 background(220);
}

function draw() {
 //background(220);
 var a = random(800);
 var b = random(800);
 var c = random(100);
 fill(c,100,100,mouseY/10);
 if(mouseIsPressed){
   rect(a,b,mouseX,mouseX);
 }else{
   ellipse(a,b,mouseX,mouseX);
 }
}

function mousePressed(){
 background(220);
}

最近ようやく慣れてきたので、凝ったことをしたくなってきました。

おしまい