プログラミングアート
2DCG
インタラクティブモーショングラフィックス
電子工作
ProcessingとArduinoによるインタラクティブモーショングラフィックス作品
インタラクティブ作品「二人の時間」
2019.04〜2019.06
課題制作
Processing
Arduino
課題内容
色々な「時間」を考察し、プログラミング作品を使って時間を体験する機会をデザインせよ。表現する時間は、任意のテーマからペアとなるような２種類とする。その２つを合わせて体験することで、各々の考える時間の特徴が明らかになるよう、組み合わせること。
コンセプト
人は皆、同じ時間を過ごしている。時間が進む速度自体は変わらない。ただし、1人1人の時間の過ごし方は異なる。ならば、人によって時間の密度やリズムは違うのではないだろうか。 そこで、進む時間は同じだが操作する人によって形や色が変化する様子の可視化を試みた。
この作品は基本的に2人で体験することを想定して作られている。実行するとランダムで図形が選択され、右側で操作する人は中心から右に向かって、左側で操作する人はその逆に向かって図形が描画されていく。設置されたコントローラーのつまみを動かすことで、それぞれ対応する図形の大きさや色、形などが変化する。最終的に両端に到達したら終了。
最初は全く同じ色形だった図形がそれぞれの自由な操作によって全く違う軌跡「時」を描いていることを確認してもらいたい。
この作品は基本的に2人で体験することを想定して作られている。実行するとランダムで図形が選択され、右側で操作する人は中心から右に向かって、左側で操作する人はその逆に向かって図形が描画されていく。設置されたコントローラーのつまみを動かすことで、それぞれ対応する図形の大きさや色、形などが変化する。最終的に両端に到達したら終了。
最初は全く同じ色形だった図形がそれぞれの自由な操作によって全く違う軌跡「時」を描いていることを確認してもらいたい。
操作方法
1 マウスを左クリックする。 2 つまみを自由に動かす。 3 図形が画面端に到達したら終了。
操作イメージ
制作パターン
全部で19種類の図形を用意した。以下の各画像の右側の簡易図はつまみの強弱によってどのように形状が変化するか表したもの。
実行例
Processingコード
void setup(){
size(1000, 1000, P2D);
colorMode(HSB,360,100,100,100);
background(random(0,360),100,5,100);
blendMode(ADD);
ellipseMode(CENTER);
float ii = random(6,9); //"vvv","qqq"nokurikaesikaisuu
zzz(7, 500, 500,
500-216, 500-125, 500, 500-250, 500+216, 500-125,
500+216, 500+125, 500, 500+250, 500-216, 500+125
); //6kakukeiyousankaku
vvv(ii, 500-216, 500-125, 500+216, 500-125, 500, 500+250); //gyakusankaku
qqq(ii, 500, 500-250, 500+216, 500+125, 500-216, 500+125); //sankaku
ooo(4, 5, 500-216, 500-125, 500, 500-250, 500+216, 500-125,
500, 500+250 ,500+216, 500+125, 500-216, 500+125
); //maru
save ("d09_20.png"); //gazouwohozon
}
void ooo(float lv5, float oo, float o1x, float o1y, float o2x, float o2y,
float o3x,float o3y,float o4x, float o4y, float o5x, float o5y,
float o6x, float o6y){
//"zzz"no6tunokakuniboyaketamaruwohyouzi
ellipse(o1x,o1y, oo,oo);
ellipse(o2x,o2y, oo,oo);
ellipse(o3x,o3y, oo,oo);
ellipse(o4x,o4y, oo,oo);
ellipse(o5x,o5y, oo,oo);
ellipse(o6x,o6y, oo,oo);
if(lv5>0){
fill(random(0,360),100,100,0.4);
ooo(lv5-1, oo+23,
o1x,o1y,o2x,o2y, o3x,o3y,
o4x,o4y,o5x,o5y,o6x,o6y);
fill(random(0,360),100,100,0.5);
ooo(lv5-1, oo+4,
o1x,o1y,o2x,o2y, o3x,o3y,
o4x,o4y,o5x,o5y,o6x,o6y);
fill(random(0,360),100,100,0.6);
ooo(lv5-1, oo+2,
o1x,o1y,o2x,o2y, o3x,o3y,
o4x,o4y,o5x,o5y,o6x,o6y);
}
}
void zzz(float lv, float t1x, float t1y, float t2x, float t2y, float t3x,float t3y,
float t4x, float t4y, float t5x, float t5y, float t6x, float t6y,
float t7x, float t7y){
float toumeido =1.0 ; //sennnotoumeido
strokeWeight(random(1,5));
noFill();
stroke(random(0,360), 100, 100,toumeido);
triangle(t1x,t1y,t2x,t2y,t3x,t3y);
stroke(random(0,360),100, 100,toumeido);
triangle(t1x,t1y,t4x,t4y,t5x,t5y);
stroke(random(0,360), 100, 100,toumeido);
triangle(t1x,t1y,t3x,t3y,t4x,t4y);
stroke(random(0,360), 100, 100,toumeido);
triangle(t1x,t1y,t5x,t5y,t6x,t6y);
stroke(random(0,360), 100, 100,toumeido);
triangle(t1x,t1y,t6x,t6y,t7x,t7y);
stroke(random(0,360), 100, 100,toumeido);
triangle(t1x,t1y,t7x,t7y,t2x,t2y);
//sorezorenokakuni1/2noookisano6kakukei
if(lv>0){
zzz( lv-1,
t2x-(t5x-t1x)/2, t2y+(t1y-t5y)/2,
t2x-(t5x-t2x)/2, t2y+(t2y-t5y)/2,
t2x-(t5x-t3x)/2, t2y+(t3y-t5y)/2,
t2x-(t5x-t4x)/2, t2y+(t4y-t5y)/2,
t2x,t2y,
t2x-(t5x-t6x)/2, t2y+(t6y-t5y)/2,
t2x-(t5x-t7x)/2, t2y+(t7y-t5y)/2);
zzz( lv-1,
t3x-(t6x-t1x)/2, t3y+(t1y-t6y)/2,
t3x-(t6x-t2x)/2, t3y+(t2y-t6y)/2,
t3x-(t6x-t3x)/2, t3y+(t3y-t6y)/2,
t3x-(t6x-t4x)/2, t3y+(t4y-t6y)/2,
t3x-(t6x-t5x)/2, t3y+(t5y-t6y)/2,
t3x,t3y,
t3x-(t6x-t7x)/2, t3y+(t7y-t6y)/2);
zzz( lv-1,
t4x-(t7x-t1x)/2, t4y+(t1y-t7y)/2,
t4x-(t7x-t2x)/2, t4y+(t2y-t7y)/2,
t4x-(t7x-t3x)/2, t4y+(t3y-t7y)/2,
t4x-(t7x-t4x)/2, t4y+(t4y-t7y)/2,
t4x-(t7x-t5x)/2, t4y+(t5y-t7y)/2,
t4x-(t7x-t6x)/2, t4y+(t6y-t7y)/2,
t4x,t4y);
zzz( lv-1,
t5x-(t2x-t1x)/2, t5y+(t1y-t2y)/2,
t5x,t5y,
t5x-(t2x-t3x)/2, t5y+(t3y-t2y)/2,
t5x-(t2x-t4x)/2, t5y+(t4y-t2y)/2,
t5x-(t2x-t5x)/2, t5y+(t5y-t2y)/2,
t5x-(t2x-t6x)/2, t5y+(t6y-t2y)/2,
t5x-(t2x-t7x)/2, t5y+(t7y-t2y)/2);
zzz( lv-1,
t6x-(t3x-t1x)/2, t6y+(t1y-t3y)/2,
t6x-(t3x-t2x)/2, t6y+(t2y-t3y)/2,
t6x,t6y,
t6x-(t3x-t4x)/2, t6y+(t4y-t3y)/2,
t6x-(t3x-t5x)/2, t6y+(t5y-t3y)/2,
t6x-(t3x-t6x)/2, t6y+(t6y-t3y)/2,
t6x-(t3x-t7x)/2, t6y+(t7y-t3y)/2);
zzz( lv-1,
t7x-(t4x-t1x)/2, t7y+(t1y-t4y)/2,
t7x-(t4x-t2x)/2, t7y+(t2y-t4y)/2,
t7x-(t4x-t3x)/2, t7y+(t3y-t4y)/2,
t7x,t7y,
t7x-(t4x-t5x)/2, t7y+(t5y-t4y)/2,
t7x-(t4x-t6x)/2, t7y+(t6y-t4y)/2,
t7x-(t4x-t7x)/2, t7y+(t7y-t4y)/2);
}
}
float toumeido2 =2.0; //"vvv","qqq"notoumeido
void vvv (float lv3, float s1x, float s1y, float s2x, float s2y,
float s3x, float s3y){
noStroke();
triangle(s1x,s1y,s2x,s2y,s3x,s3y);
//sorezorenokakuni2tuzutu,1/2noookisano6sannkaku
if(lv3>0){
fill(random(0,360), 20, 100,toumeido2);
vvv(lv3-1,
s1x+(s2x-s1x)/4, s1y-(s3y-s1y)/2,
s1x-(s2x-s1x)/4, s2y-(s3y-s1y)/2,
s1x, s1y
);
fill(random(0,360), 50, 100,toumeido2);
vvv(lv3-1,
s1x-(s2x-s1x)/2, s1y,
s1x, s1y,
s1x-(s2x-s1x)/4, s1y+(s3y-s1y)/2
);
fill(random(0,360), 20, 100,toumeido2);
vvv(lv3-1,
s2x+(s2x-s1x)/4, s1y-(s3y-s2y)/2,
s2x-(s2x-s1x)/4, s2y-(s3y-s2y)/2,
s2x, s2y
);
fill(random(0,360), 50, 100,toumeido2);
vvv(lv3-1,
s2x, s2y,
s2x+(s2x-s1x)/2, s2y,
s2x+(s2x-s1x)/4, s2y+(s3y-s2y)/2
);
fill(random(0,360), 20, 100,toumeido2);
vvv(lv3-1,
s3x-(s2x-s1x)/2, s3y,
s3x, s3y,
s3x-(s2x-s1x)/4, s3y+(s3y-s1y)/2
);
fill(random(0,360), 50, 100,toumeido2);
vvv(lv3-1,
s3x, s3y,
s3x+(s2x-s1x)/2, s3y,
s3x+(s2x-s1x)/4, s3y+(s3y-s1y)/2
);
}
}
void qqq (float lv2, float m1x, float m1y, float m2x, float m2y,
float m3x, float m3y){
noStroke();
triangle(m1x,m1y,m2x,m2y,m3x,m3y);
//sorezorenokakuni2tuzutu,1/2noookisano6sannkaku
if(lv2>0){
fill(random(0,360), 20, 100,toumeido2);
qqq(lv2-1,
m1x-(m2x-m3x)/4, m1y-(m3y-m1y)/2,
m1x, m1y,
m1x-(m2x-m3x)/2, m1y
);
fill(random(0,360), 50, 100,toumeido2);
qqq(lv2-1,
m1x+(m2x-m3x)/4, m1y-(m3y-m1y)/2,
m1x+(m2x-m3x)/2, m1y ,
m1x, m1y
);
fill(random(0,360), 50, 100,toumeido2);
qqq(lv2-1,
m2x, m2y,
m2x+(m2x-m3x)/4, m2y+(m3y-m1y)/2,
m2x-(m2x-m3x)/4, m2y+(m3y-m1y)/2
);
fill(random(0,360), 20, 100,toumeido2);
qqq(lv2-1,
m2x+(m2x-m3x)/4, m2y-(m3y-m1y)/2,
m2x+(m2x-m3x)/2, m2y,
m2x, m2y
);
fill(random(0,360), 70, 100,toumeido2);
qqq(lv2-1,
m3x, m3y,
m3x+(m2x-m3x)/4, m3y+(m3y-m1y)/2,
m3x-(m2x-m3x)/4, m3y+(m3y-m1y)/2
);
fill(random(0,360), 50, 100,toumeido2);
qqq(lv2-1,
m3x-(m2x-m3x)/4, m3y-(m3y-m1y)/2,
m3x, m3y,
m3x-(m2x-m3x)/2, m3y
);
}
}
Arduinoコード
void setup() {
Serial.begin(9600);
}
void loop() {
Serial.print(analogRead(0));
Serial.print(",");
Serial.print(analogRead(1));
Serial.print(",");
Serial.print(analogRead(4));
Serial.print(",");
Serial.print(analogRead(5));
Serial.println("");
delay(10);
}