Documentation Booklet part 1

Prototyping Interactive ExperiencesDevelopment Documentation Booklet

Panagiotis (Peter) Kalpenos40058911Interior and Spatial Design year 3

First experiments with Processing For more details please visit: http://panagiotiskalpenos.tumblr.com/page/4

void setup(){ size(400,400); background(255);}void draw(){ background(255); //noStroke(); //noStroke(); fill(203,193,193); stroke(255,0,0,150); strokeWeight(1); rect(width/8,50,100,100); if(mousePressed == true){ fill(255,0,0); }else{ }else{ fill(250,15,60,10); } stroke(250,0,0); strokeWeight(1); rect(mouseX-100, mouseY-100,mouseX-mouseX+200,mouseY-mouseY+200); line(50,50,mouseX-100,mouseY-100); strokeWeight(1); line(150,50,mouseX+100,mouseY-100); strokeWeight(1); line(50,150,mouseX-100,mouseY+100); strokeWeight(1); line(150,150,mouseX+100,mouseY+100); stroke strokeWeight(1); println(mouseX + ” ” +mouseY);}

void setup(){ size(400,400); background(255); println(“Click and drag your mouse to trace yourself around”);}void draw(){

if (mousePressed == true){if (mousePressed == true){ stroke(8,8,8); strokeWeight(5); ellipse(mouseX,mouseY,20,20);}else{ background(255);} }

void setup(){ size(400,400); background(255); println(“Click to capture”);}void draw(){ background(255); background(255); stroke(mouseX,mouseY,20); strokeWeight(5); ellipse(200,200,10,10); rect(150,150,100,100); rect(50,50,300,300); if (mousePressed == true){ stroke(mouseX,mouse stroke(mouseX,mouseY,20); strokeWeight(5); fill(255,0,0); rect(50,50,300,300); fill(255); rect(150,150,100,100); fill(8,8,8); ellipse(200,200,10,10); ellipse(200,200,10,10); }else{ fill(255); }


First experiments with Processing

void setup(){ size(400,400); background(255); rect(50,50,50,50); rect(175,50,50,50); rect(300,50,50,50); rect(50,175,50,50); rect(50,175,50,50); rect(175,175,50,50); rect(300,175,50,50); rect(50,300,50,50); rect(175,300,50,50); rect(300,300,50,50); println( “Type any letters from A-I and see what happens…”); }void draw(){ stroke(mouseX,mouseY,25); strokeWeight(1); if(keyPressed == true){ if (key == ‘a if (key == ‘a’ || key ==’A’){ fill(255,0,0); rect(50,50,50,50); } else if (key == ‘b’ || key == ‘B’){ fill(20,255,0); rect(175,50,50,50); } else if (key == ‘c’ || key == ‘C’){ fill(255,0,192); rect(300,50,50,50); } else if (key == ‘d’ || key ==’D’){ fill(255,230,0); fill(255,230,0); rect(50,175,50,50); } else if (key == ‘e’ || key == ‘E’){ fill(3,0,255); rect(175,175,50,50); } else if (key == ‘ else if (key == ‘f’ || key == ‘F’){ fill(0,255,240); rect(300,175,50,50); } else if (key == ‘g’ || key == ‘G’){ fill(255,110,0); rect(50,300,50,50); } } else if (key == ‘h’ || key == ‘H’){ fill(206,114,163); rect(175,300,50,50); } else if (key == ‘i’ || key == ‘I’){ fill(70,86,90); rect(300,300,50,50); rect(300,300,50,50); } else fill(255); } }

First experiments with Processing

void setup(){ size(400,400); background(255); println(“To exit, please move your mouse around the centre of the screen,”);}void draw(){void draw(){ fill(255,0,0); stroke(mouseX,mouseY,8); strokeWeight(10); rect(50,50,300,300); stroke(255); rect(180,180,40,40); if (mouseX == 200 || mouse if (mouseX == 200 || mouseY == 200){ println(“Please exit”); fill(255); stroke(8,8,8); strokeWeight(10); ellipse(200,200,300,300); }else{ println(“ println(“To exit, please move your mouse around the centre of the screen”); fill(255,0,0); stroke(mouseX,mouseY,8); strokeWeight(10); rect(50,50,300,300); stroke(255); rect(180,180,40,40); rect(180,180,40,40); }}

void setup(){ size(400,400); background(255); println();

}void draw(){ noStroke(); background(255); fill(255,0,0); ellipse(200,mouseX,50,50); ellipse(mouseX,200,50,50); fill(156,25,45); fill(156,25,45); rect(mouseX,mouseX+5,50,50); rect(mouseX+50,mouseX-20,20,20); fill(260,10,80); ellipse(100,mouseX+10,70,70); ellipse(mouseX-50,mouseX,15,15); ellipse(50,50,mouseX-10,mouseX+15); mouseX=mouseX+1; mouseX=mouseX+1; if (mouseX>width+20){ mouseX=-20; }else{ mouseX=mouseX+1; }}

For more details please visit: http://panagiotiskalpenos.tumblr.com/page/4


Everyday Interactions with technology. Watch at: http://www.youtube.com/watch?v=ACNQqIjmc8s

int diameter = 10;int positionX = 50;int Switch = 0;void setup(){ size(200,200);}void draw(){void draw(){ background(192); fill(mouseX,mouseY,60); if(positionX >= width-diameter/2){ Switch = 1; } if(positionX == diameter/2){ Switch = 0; Switch = 0; } if (Switch==0){ positionX++; //position = position + 1; }else{ positionX--; } ellipse(positionX,100,diameter,diameter); } }

int diameter = 50;int Switch = 0;int positionY = 25;void setup(){ size(400,400); background(190);}}void draw(){ background(190); fill(mouseX,mouseY,mouseX); if (positionY >= height - diameter/2){ Switch = 1; Switch = 1; }if (positionY == diameter/2){ Switch = 0;}if (Switch == 0){ positionY++;}else{}else{ positionY--;}ellipse(mouseX,positionY,diameter,diameter);}


int diameter = 50;int positionX = 25;int Switch = 0;int positionY = 25;void setup(){ size(400,400); background(190); background(190);}void draw(){ background(190); fill(mouseX,mouseY,mouseX-mouseY); if (positionX >= width - diameter/2) { Switch = 1; Switch = 1; } if (positionX == diameter/2){ Switch = 0;}if (Switch == 0) { positionX++;}}else{ positionX--; } if (positionY >= height - diameter/2){ Switch = 1; }if (positionif (positionY == diameter/2){ Switch = 0;}if (Switch == 0){ positionY++;}else{ positionY--;}}ellipse(positionX,positionY,diameter,diameter);}


Concept for Interaction with Cigarette end disposal.


PImage a;PImage b;PImage c;PImage d;PImage e;PImage f;PImage g;PImage g;PImage h;PImage i;PFont ArialMT;void setup(){ size (800,600); background(0,0,0); a = loadImage("o.jpg"); a = loadImage("o.jpg"); b = loadImage("1.png"); c = loadImage("oquestion1.jpg"); d = loadImage("1a.png"); e = loadImage("ofinal.jpg"); f = loadImage("projection2.jpg"); g = loadImage("2a.png"); h = loadImage("projection1.jpg"); h = loadImage("projection1.jpg"); i = loadImage("oexc.jpg"); String[] fontList = PFont.list(); ArialMT = createFont("FFScala",20); image(b,0,267,width/1.8,height/1.8); textFont(ArialMT); text("Type the letters from a-f to see how the Interactive column works...",20,20); } }void draw(){ if (keyPressed == true){ if (key == 'a' || key == 'A'){ background(0,0,0); image(b,0,267,width/1.8,height/1.8); textFont(ArialMT); text(" Smoker approaches the cigarette disposal column.", 50,50); text(" Smoker approaches the cigarette disposal column.", 50,50); image(a,380,100,340,500); } if (key == 'b' || key == 'B'){ background(0,0,0); image(b,0,267,width/1.8,height/1.8); image(a,200,100,340,500); textFont(ArialMT); textFont(ArialMT); text(" Smoker reads the projected data on its sides while smoking.", 50,50); } if(key== 'c' || key =='C'){ background(0,0,0); image(b,0,267,width/1.8,height/1.8); image(c,200,100,340,500); textFont(ArialMT); textFont(ArialMT); text("Smoker is surprised by the projections...",50,50); } if (key == 'd' || key == 'D'){ background(0,0,0); image(d,0,267,width/1.8,height/1.8); image(e,200,100,340,500); image(f,600,140,100,400); image(f,600,140,100,400); textFont(ArialMT); text("As soon as the smoker disposes of their cigarette,onto the column's",50,50); text("touch sensitive surface, the projections change...",50,68); } if (key == 'e' || key == 'E'){ background(0,0,0); image(g,0,267,width/1.8,height/1.8); image(g,0,267,width/1.8,height/1.8); image(i,200,100,340,500); image(h,600,140,100,400); textFont(ArialMT); text("Funny yet serious, anti-smoking, projections appear for a short time...",50,50); } if (key == 'f' || key == 'F'){ if (key == 'f' || key == 'F'){ background(0,0,0); image(b,0,267,width/1.8,height/1.8); image(e,600,100,220,350); textFont(ArialMT); text("Finally the projections finish and the smoker leaves...", 50,50); } } } }

First experiments with Processing For more details please visit: http://panagiotiskalpenos.tumblr.com/page/3http://panagiotiskalpenos.tumblr.com/page/2

Experimenting with Audio

import ddf.minim.*;Minim minim;AudioPlayer player1;PFont ArialMT;PImage a;void setup(){ size(600, 400); size(600, 400); background(0,0,0); minim = new Minim(this); player1 = minim.loadFile("meow.mp3"); String[] fontList = PFont.list(); ArialMT= createFont("FFScala",20); a = loadImage("cat.jpg"); image(a,0,0,600,400); image(a,0,0,600,400); textFont(ArialMT); text("caress the cat... " ,20,30);

} void draw(){ textFont(ArialMT); if (mousePressed == true){ if (mouseX> 279 && mouseX< 500 && mouse if (mouseX> 279 && mouseX< 500 && mouseY >169 && mouseY<380){ player1.play(); image(a,0,0,600,400); text("meow...",20,30); } else{ else{ image(a,0,0,600,400); text("caress the cat...",20,30); player1.pause();

} } }

Documents

Documentation Booklet part 1