Sharon Yang Project 03 Dynamic Drawing

Project 03

function setup() {
    createCanvas(640,480);
}

function draw() {
    background(245,189,65);
    noStroke();
    fill(255);
    //arms
    var bodyWidth=280;
    var leftArmCenterX=mouseX;
    var leftArmCenterY=mouseY;
    leftArmCenterX=constrain(leftArmCenterX,20,160);
    var rightArmCenterX=mouseX;
    var rightArmCenterY=mouseY;
    rightArmCenterX=constrain(rightArmCenterX,480,620);
    //left arm
    push();
    translate(leftArmCenterX,leftArmCenterY);
    rotate(radians(135));
    fill(255);
    ellipse(0,0,80,80);
    pop();
    //right arm
    push();
    translate(rightArmCenterX,rightArmCenterY);
    rotate(radians(225));
    ellipse(0,0,80,80);
    pop();
    strokeWeight(60);
    stroke(255);
    line(leftArmCenterX,leftArmCenterY,width/2-(bodyWidth*0.35),280);
    line(rightArmCenterX,rightArmCenterY,width/2+(bodyWidth*0.35),280);
    //body
    noStroke();
    arc(width/2,420,bodyWidth,540,PI,2*PI);
    arc(width/2,420,bodyWidth,80,0,PI);
    //collar 
    var collarWidth=bodyWidth*0.7;
    fill(255,0,0);
    ellipse(width/2,220,collarWidth,100);
    fill(245,189,65);
    ellipse(width/2,270,40,40);
    //ears
    strokeWeight(1);
    fill(255);
    //left ear
    var earChangeY=mouseY/48;
    var earHeight=20+(earChangeY*1.5);
    var earChangeX=mouseX/64;
    var earLPos=(width/2)-110-(earChangeX*3);
    triangle(earLPos,earHeight,380,100,200,150);
    fill(255,0,0);
    triangle(earLPos+10,earHeight+15,370,100,210,150);
    //right ear
    fill(255);
    var earRPos=(width/2)+110+(earChangeX*3);
    triangle(earRPos,earHeight,260,100,440,150);
    fill(255,0,0);
    triangle(earRPos-10,earHeight+15,260,100,430,150);
    //head
    fill(255);
    ellipse(width/2,140,240,200);
    //face
    fill(0);
    //mouth
    fill(255);
    stroke(0);
    strokeWeight(3);
    var mouthMoveX=mouseX/64;
    var mouthMoveY=mouseY/32;
    var endMouthLeft=0.7*PI+(mouthMoveX/PI);
    var endMouthRight=2.3*PI-(mouthMoveY/PI);
    endMouthLeft=constrain(endMouthLeft,0.5*PI,1.2*PI);
    endMouthRight=constrain(endMouthRight,1.8*PI,2.5*PI);
    arc(width/2-15,170,30,30,0,endMouthLeft);
    arc(width/2+15,170,30,30,endMouthRight,PI);
    //nose
    fill(0);
    triangle(width/2,170,width/2-15,150,width/2+15,150);
    //eyes
    var strokeD=((mouseX/64)+(mouseY/48)/2);
    strokeD=constrain(strokeD,3,5);
    var eyeD=strokeWeight(strokeD);
    //left eye
    noFill();
    arc((width/2)-50,130,40,30,PI*1.1,2*PI);
    //right eye
    arc((width/2)+50,130,40,30,PI,1.9*PI);
    //whiskers
    var whiskerMoveX=mouseX/64;
    var whiskerMoveY=mouseY/32;
    var whiskerLeftX=width-width/1.7+whiskerMoveX-20;
    var whiskerY=135+whiskerMoveY;
    var whiskerRightX=width-whiskerLeftX;
    stroke(0);
    strokeWeight(3);
    line(whiskerLeftX,whiskerY,280,145);
    line(whiskerLeftX,whiskerY+30,280,165);
    line(360,145,whiskerRightX,whiskerY);
    line(360,165,whiskerRightX,whiskerY+30);
    //feet
    fill(255);
    var footPos=430;
    stroke(0);
    arc(width/2.7,footPos,70,90,1.05*PI,2.05*PI);
    arc(width-(width/2.7),footPos,70,90,0.95*PI,1.95*PI);

}

Through the project, I understood better setting the variables as well as the motion using push and pop function. I found changing the position and size of objects using mouseX and mouseY is interesting highly applicable.