Vintage Books Alive - OpenProcessing

mySketch
xxxxxxxxxx
 
var cover;
var rale;
var x;
var y;
​
function preload() {
  cover = loadImage ("Gebrauchsgrafiker.jpg");
  rale = loadFont ("Raleway-Bold.ttf"); 
} 
function setup() {
  createCanvas(575, 800);
  background(100);
  
​
}
​
function draw() {
  background (100);
  noStroke();
  image(cover, 250, 100);
  
  //HINTERGRUND
  fill (24, 143, 232);
  rect (0, 0, 575, 800);
  
  //ANIMATION Quadrate rotieren
  fill(0);
  
  push();
  translate(22, 258);
  if(mouseIsPressed) {
    if(mouseButton == LEFT){
      
      rotate(sin(millis()/1000));
    }
  }
  rect (0,0, 260, 260); //Q1
  pop();
  
  push();
  translate(22, 520);
  if(mouseIsPressed) {
    if(mouseButton == LEFT){
      
      rotate(sin(millis()/1000));
    }
  }
  rect (0, 0, 260, 260); //Q2
  pop();
  
  push();
  translate(284, 256);
  if(mouseIsPressed) {
    if(mouseButton == LEFT){
      
      rotate(sin(millis()/1000));
    }
  }
  rect (0, 0, 130, 130); //Q3
  pop();
  
  push();
  translate(284, 256);
  if(mouseIsPressed) {
    if(mouseButton == LEFT){
      
      rotate(sin(millis()/1000));
    }
  }
  rect (0, 0, 130, 130); //Q3
  pop();
  
  push();
  translate(284, 388);
  if(mouseIsPressed) {
    if(mouseButton == LEFT){
      
      rotate(sin(millis()/1000));
    }
  }
  rect (0, 0, 130, 130); //Q4 
  pop();
  
  push();
  translate(416, 388);
  if(mouseIsPressed) {
    if(mouseButton == LEFT){
      
      rotate(sin(millis()/1000));
    }
  }
  rect (0, 0, 130, 130); //Q5
  pop();
  
  push();
  translate(284, 520);
  if(mouseIsPressed) {
    if(mouseButton == LEFT){
      
      rotate(sin(millis()/1000));
    }
  }
  rect (0, 0, 260, 260); //Q6
  pop();
  
  push();
  translate(416, 254);
  if(mouseIsPressed) {
    if(mouseButton == LEFT){
      
      //rotate(sin(millis()/1000));
      fill(255);
    }
  }
  rect (0, 0, 65, 65); //Q7
  pop();
  
  push();
  translate(416, 321);
  if(mouseIsPressed) {
    if(mouseButton == LEFT){
      
      //rotate(sin(millis()/1000));
      fill(255);
    }
  }
  rect (0, 0, 65, 65); //Q8
  pop();
  
  push();
  translate(483, 321);
  if(mouseIsPressed) {
    if(mouseButton == LEFT){
      
      //rotate(sin(millis()/1000));
      fill(255);
    }
  }
  rect (0, 0, 65, 65); //Q9
  pop();
  
  push();
  translate(483, 251);
  if(mouseIsPressed) {
    if(mouseButton == LEFT){
      
      //rotate(sin(millis()/1000));
      fill(255);
    }
  }
  rect (0, 0, 33, 33); //Q10
  pop();
  
  push();
  translate(483, 286);
  if(mouseIsPressed) {
    if(mouseButton == LEFT){
      
      //rotate(sin(millis()/1000));
      fill(255);
    }
  }
  rect (0, 0, 33, 33); //Q11
  pop();
  
  push();
  translate(518, 286);
  if(mouseIsPressed) {
    if(mouseButton == LEFT){
      
      //rotate(sin(millis()/1000));
      fill(255);
    }
  }
  rect (0, 0, 33, 33); //Q12
  pop();
  //Quadrate
  //rect (22, 258, 260, 260); //Q1
  //rect (22, 520, 260, 260); //Q2
  //rect (284, 256, 130, 130); //Q3
  //rect (284, 388, 130, 130); //Q4 
  //rect (416, 388, 130, 130); //Q5
  //rect (284, 520, 260, 260); //Q6
  //rect (416, 254, 65, 65); //Q7
  //rect (416, 321, 65, 65); //Q8
  //rect (483, 321, 65, 65); //Q9
  //rect (483, 251, 33, 33); //Q10
  //rect (483, 286, 33, 33); //Q11
  //rect (518, 286, 33, 33); //Q12
  
​
  
  
  //ANIMATION kleines Quadrat
  push();
  translate(516, 248);
  if(mouseIsPressed){
    x = random(10);
    y = random(10);
  if(mouseButton == RIGHT){
      rotate (tan(millis()/1000));
  }
  
  if(mouseButton == LEFT){
      rotate(0);
    }
  }
  else{
    rotate(sin(millis()/1000));
  }
  fill(0);
  //translate (516, 248);
  //rotate(sin(millis()/1000));
  rect (x, y, 33, 33); //Q13
  pop();
  
  //TITEL
  fill(255);
  textFont (rale);
  textSize (20,8);
  text ('Der Gebrauchsgraphiker', 22, 35);
  text ('Beruf und Aufgabe', 370, 35);
  
  }