Your browser does not support the canvas tag.

previous        Show / Hide Source        Download        next
void setup(){
  size(400, 400);  // Set the size of the window
  background(255); // Draw a white background 
  smooth(); 
}

void draw(){
  //background(255); // Draw a white background 
  frameRate(60);
  
  //Here I set the sky background
  //main sky color: 
  noStroke();
  fill(204, 240, 255, 50);
  rect(0, 0, width, height);
  
  //sky shades:
  noStroke();
  fill(200, 230, 255, 50);
  rect(0, 0, width+100, height-100);
  
  noStroke();
  fill(192, 217, 255, 50);
  rect(0, 0, width+200, height-200);
  
  noStroke();
  fill(177, 198, 255, 50);
  rect(0, 0, width+300, height-300);
  
  //In this part, I set up the components of the person
  //Person:     
  //Arm #1
  noStroke();
  fill(255, 225, 146);
  quad(360, 340, 380, 320, 420, 380, 400, 380);  
  //Shading color
  noStroke();
  fill(255, 173, 110);
  triangle(360, 340, 380, 320, 410, 350);
    
  
  //Neck
  noStroke();
  fill(255, 225, 146);
  quad(300, 260, 320, 260, 320, 300, 305, 300);
  //Shading color
  noStroke();
  fill(255, 173, 110);
  quad(300, 260, 320, 260, 320, 280, 305, 280);
  
  //Hair #2
  noStroke();
  fill(35, 16, 65);
  triangle(240, 180, 200, 260, 260, 240);
  
    
  //Head
  noStroke();
  fill(255, 225, 146);
  ellipse(300, 200, 140, 140);  
  //Shading color
  noStroke();
  fill(255, 173, 110);
  triangle(240, 180, 360, 180, 350, 220);
  
    
  //Blush
  noStroke();
  fill(255, 204, 228);
  ellipse(248, 220, 30, 30);
  ellipse(332, 220, 30, 30);
  
  //Hair #3
  noStroke();
  fill(35, 16, 65);
  quad(400, 100, 360, 130, 400, 240, 450, 210);
  
  //Bow
  noStroke();
  fill(255, 30, 112);
  ellipse(370, 130, 20, 20);
  triangle(360, 100, 330, 130, 370, 130);
  triangle(400, 120, 370, 160, 370, 130);
     
  //Hair
  noStroke();
  fill(60, 36, 99);
  triangle(300, 120, 200, 180, 360, 180);
  fill(35, 16, 65);
  quad(350, 120, 300, 120, 360, 180, 400, 180);
  quad(400, 180, 360, 180, 330, 260, 380, 240);
  
  //Eyes
  noStroke();
  fill(0, 0, 0);
  ellipse(260, 200, 10, 30);
  ellipse(322, 200, 10, 30);
  
  //Nose
  stroke(0);
  noFill();
  line(280, 210, 290, 220);
  
  //Mouth
  stroke(255, 30, 112);
  noFill();
  line(260, 230, 280, 245);
  line(280, 245, 320, 240);
  
  
  //Ear
  noStroke();
  fill(255, 225, 146);
  ellipse(370, 210, 20, 20);
 
  
    
  //This is a part of the dress component.  
  //Sleeve 2
  noStroke();
  fill(196, 67, 99);
  ellipse(360, 320, 40, 40);
  
  
    
  
  //The face changes if you move the candy closer to the person. 
  if(mouseX < width/2 || mouseY < height/2){
    //Neck
    noStroke();
    fill(255, 225, 146);
    quad(300, 260, 320, 260, 320, 300, 305, 300);
    //Shading color
    noStroke();
    fill(255, 173, 110);
    quad(300, 260, 320, 260, 320, 280, 305, 280);
    
    //Hair #2
    noStroke();
    fill(35, 16, 65);
    triangle(240, 180, 200, 260, 260, 240);
    
      
    //Head
    noStroke();
    fill(255, 225, 146);
    ellipse(300, 200, 140, 140);  
    //Shading color
    noStroke();
    fill(255, 173, 110);
    triangle(240, 180, 360, 180, 350, 220);
    
      
    //Blush
    noStroke();
    fill(255, 204, 228);
    ellipse(248, 220, 30, 30);
    ellipse(332, 220, 30, 30);
    
    //Hair #3
    noStroke();
    fill(35, 16, 65);
    quad(400, 100, 360, 130, 400, 240, 450, 210);
    
    //Bow
    noStroke();
    fill(255, 30, 112);
    ellipse(370, 130, 20, 20);
    triangle(360, 100, 330, 130, 370, 130);
    triangle(400, 120, 370, 160, 370, 130);
       
    //Hair
    noStroke();
    fill(60, 36, 99);
    triangle(300, 120, 200, 180, 360, 180);
    fill(35, 16, 65);
    quad(350, 120, 300, 120, 360, 180, 400, 180);
    quad(400, 180, 360, 180, 330, 260, 380, 240);
    
    //Eyes
    noStroke();
    fill(0, 0, 0);
    ellipse(260, 200, 10, 30);
    ellipse(322, 200, 10, 30);
    
    //Nose
    stroke(0);
    noFill();
    line(280, 210, 290, 220);
    
    //Mouth
    stroke(255, 30, 112);
    noFill();
    line(260, 230, 280, 225);
    line(280, 225, 320, 240);
    
    
    //Ear
    noStroke();
    fill(255, 225, 146);
    ellipse(370, 210, 20, 20);
   }
    
  
  //These are the Bush components. 
  //Bushes:  
  //Bush4
  noStroke();
  fill(45, 123, 65);
  ellipse(220, 400, 200, 220);
  
  //Bush2
  noStroke();
  fill(117, 193, 93);
  ellipse(140, 400, 160, 160);
  
  //Bush1
  noStroke();
  fill(162, 226, 142);
  //ellipseMode(CORNER);
  ellipse(50, 400, 100, 100);
  
  //Bush3
  noStroke();
  fill(45, 91, 123);
  ellipse(220, 400, 80, 80);
  
  //This is part of the person's components
  //Arm #2
  noStroke();
  fill(255, 225, 146);
  quad(280, 320, 300, 340, 240, 400, 220, 400);
  //Shading color
  noStroke();
  fill(255, 173, 110);
  triangle(270, 320, 260, 380, 300, 340);
  
    
  //These are the other components for the dress:  
  //Chest
  noStroke();
  fill(196, 67, 99);
  ellipse(315, 340, 80, 80);
    
  //Collar
  noStroke();
  fill(196, 67, 99);
  ellipse(315, 300, 40, 20);
  
  //Sleeve 1
  noStroke();
  fill(196, 67, 99);
  ellipse(280, 320, 40, 40);
      
  //Skirt
  noStroke();
  fill(196, 67, 99);
  ellipse(320, 400, 160, 80);  
  
  
  //These are the Lollipop components
  //Candy parts:
  //Candy stick
  stroke( 228, 65, 123);
  fill( 255, 255, 255);
  rect(mouseX-5, mouseY+5, 10, 100);
  
  //Candy shape
  noStroke();
  fill(255, 280, 280);    
  ellipse(mouseX, mouseY, 80, 80); 
  
  //Inner circles:
  noStroke();
  fill(255, 146, 189);    
  ellipse(mouseX, mouseY, 60, 60); 
  
  noStroke();
  fill(249, 85, 133);    
  ellipse(mouseX, mouseY, 40, 40);
  
  noStroke();
  fill(223, 26, 89);    
  ellipse(mouseX, mouseY, 20, 20);
  
  
  
  
}

//If the mouse is pressed, the following sentence will be printed
void mousePressed(){
   println("Please give me the candy already");   
}