Wobble-head
Coding a interactive mask with processing
purpose:
university project
date:
June 2018
Processing is a Java-based coding software that allows various graphic and interactive solutions.
This project was about creating a mask that features different input methods to interact with the mask.
features of this mask:
-
the background wobbles, the head expands depending on the volume a connected mic picks up.
-
When hovering over it, the head is colored, the hue slowly changes. This changes faster on louder volumes.
-
On left mouseclick a cigarette appears.
-
pressing any key while clicking LMB lights up the cigarette.
float y;
float xoff = 0.0;
PShape s;
float b;
float k;
void setup () {
colorMode(HSB);
size(800, 800);
background(0);
smooth();
setupAudio();
}
void draw () {
background(0);
translate(400, 450);
getVolume();
float y = 1.3*(volume);
//(volume) an mikro Sensibilität anpassen
noFill();
stroke(255);
//Kreise
strokeWeight(0.4+y/80);
ellipse(0, 0, 312+y, 312+y);
strokeWeight(0.6+y/80);
ellipse(0, 0, 320+y, 320+y);
strokeWeight(0.8+y/80);
ellipse(0, 0, 330+y, 330+y);
strokeWeight(1+y/80);
ellipse(0, 0, 350+y, 350+y);
strokeWeight(2+y/80);
ellipse(0, 0, 370+y, 370+y);
strokeWeight(4+y/80);
ellipse(0, 0, 390+y, 390+y);
strokeWeight(8);
ellipse(0, 0, 425+y, 425+y);
strokeWeight(16+y/80);
ellipse(0, 0, 475+y, 475+y);
strokeWeight(24+y/80);
ellipse(0, 0, 550+y, 550+y);
strokeWeight(32+y/80);
ellipse(0, 0, 650+y, 650+y);
strokeWeight(40+y/80);
ellipse(0, 0, 800+y, 800+y);
strokeWeight(48+y/80);
ellipse(0, 0, 1000+y, 1000+y);
//Kopf
//headphones
noStroke();
fill(90);
ellipse(0, -10, 460+y/2, 440+y/2);
rect(-150-y/8, 0, -100-y/8, 120,20,20,20,20);
rect(150+y/8, 0, 100+y/8, 120,20,20,20,20);
//face
fill(240);
//Hals+Kopf
rect(-150, 200, 300, 200);
rect(-200, -200, 400, 470, 240, 240, 100, 100);
ellipse(0, -10, 380+y/2, 380+y/2);
//farbe innen
if (mouseX >= 230 && mouseX <= width-230 && mouseY >= 230 && mouseY <= height-230) {
//fill(random (120));
//fill(lerpColor(int(random(255)),int(random(255)), 0.5));
//float n = random(0.5,0.7);
xoff = xoff + (0.002+(y/500));
float n = noise(xoff) * 360;
float i = 1000;
//float i = noise(xoff) * 255;
//float o = noise(xoff) * 255;
float o = 1000;
//HSB Modus ändern und dann H als noise Variable festlegen
color c = color(n, i, o);
fill(c);
println(y);
//fill(200);
} else {
fill(240);
}
//”Gehirn”
noStroke();
arc(0, -10, 320+y/2, 320+y/2, PI, PI*2, PIE);
arc(0, -10, 320+y/2, 250+y/8, 0, PI*2, PIE);
//ellipse(0, -10, 320+y/2, 320+y/2);
strokeWeight(6);
stroke(0);
noFill();
arc(0, 180, 80, 20, 0, PI);
//CLICKACTION
if (mousePressed && (mouseButton == LEFT)) {
noStroke();
fill(200);
quad(30,190,40,185,130,220,115,235);
colorMode(HSB);
fill(0,255,1.2*k);
ellipse(122,227,18,18);
fill(0,200,1.2*k);
ellipse(122,227,17,17);
fill(0,150,1.2*k);
ellipse(122,227,12,12);
fill(0,110,2*k);
ellipse(122,227,9,9);
fill(0,40,255,1.2*k);
arc(-120,140,80,50,0,PI);
arc(120,140,80,50,0,PI);
stroke(0);
line(-160, 140, -80, 140);
line(160, 140, 80, 140);
if (keyPressed){
k = k+1;
} else {
k = 0;
}
} else {
line(-160, 140, -80, 140);
line(160, 140, 80, 140);
}
}