Sarah Kim – Dynamic Drawing

sketch

// the height of the moon&lines stay constant.
//the lines and day and night should change colors.
var start = 20;
var angle = 0;
var y = 100;
var night = (0, 0, 0);
var r = 25; // colors for the background.
var g = 25;
var b = 112;

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

function draw() {
    background(r,g,b);
    noStroke();
    //largest ring
    fill(255);
    ellipse(pmouseX, y, 700, 700);
    fill(night);
    ellipse(pmouseX, y, 698, 697);
    //pink ring
    fill("pink");
    ellipse(pmouseX, y, 310, 310);
    fill(night);
    ellipse(pmouseX, y, 303, 303);
    //smaller white ring
    fill(255);
    ellipse(pmouseX, y, 300, 300);
    fill(night);
    ellipse(pmouseX, y, 299, 299);
    //blue ring
    fill("skyblue");
    ellipse(pmouseX, y, 150, 150);
    fill(night);
    ellipse(pmouseX, y, 149, 149);
    //moon
    fill(255,250,205);
    ellipse(pmouseX, y, 50, 50);
    fill(night);
    arc(pmouseX+30, y-10, 50,50,0,PI+QUARTER_PI, PIE);
    //mountains at night. some change colors randomly.
    fill(pmouseX, pmouseY, 255);
    triangle(120, 300, 0, 480, 240, 480);
    fill(pmouseX, pmouseY, 210);
    triangle(520, 480, 620, 205, 700, 500);
    fill("blue");
    triangle(400, 480, 520, 210, 640, 480);
    fill("skyblue");
    triangle(520, 210, 520, 480, 640, 480);
    fill("white");
    triangle(140, 480, 250, 225, 500, 480);
    fill("lavender");
    triangle(250, 225, 250, 480, 500, 480);
    //bug in left
    push();
    translate(300,250);
    rotate(radians(angle+90));
    fill("yellow")
    ellipse(-start, start, 3, 3);
    pop();
    angle = angle + 1;
    start = start + .05;
    //bug in the middle
    push();
    translate(100,100);
    rotate(radians(angle));
    fill("white")
    ellipse(start, -start, 5, 5);
    pop();
    angle = angle + 1;
    start = start + .05;
    //bug on the right
    push();
    translate(500,80);
    rotate(radians(angle));
    fill("yellow")
    ellipse(start, start, 5, 5);
    pop();
    angle = angle + 0.2;
    start = start + .0003;
    //bugs with changing colors with mouse movement.
    push();
    translate(320,200);
    rotate(radians(angle));
    fill(pmouseX, pmouseY, 213);
    ellipse(-start, start, 5, 5);
    pop();
    angle = angle + 0.2;
    start = start + .001;

    push();
    translate(600,76);
    rotate(radians(angle));
    fill(pmouseX, pmouseY, 143);
    ellipse(start, -start, 5, 5);
    pop();
    angle = angle + 0.2;
    start = start + .00001;
    // as mouse moves to the right, night changes to day.
    if (pmouseX >= night+320) {
     night = night + 5;
    }
    if (pmouseX < night+320) {
     night = night - 2;
    }
    //background changes color along with the movement of the moon.
    if (pmouseX >= 320) {
     r = 230;
    }
    if (pmouseX >= 320) {
     g = 230;
    }
    if (pmouseX >= 320) {
     b= 250;
   }
    if (pmouseX < 320) {
     r = 25;
   }
   if (pmouseX < 320) {
    g = 25;
   }
   if (pmouseX < 320) {
    b = 112;
  }

}

I used color transitions and the spiral rotation that we learned this week to create the image. The moon is created with an arc and ellipse.