HOMEWORK DAY 3 -CODE

Animation of the geometric drawing

 

first frame:

 

intermediate frames:

int xPos;
int yPos;

int speedX;
int speedY;

int x;
int y;

float radius= 261;

void setup(){
size (900, 900);
background (244,239,193);
xPos=0;
yPos=0;
speedX= 8;
speedY= 3;
x=0;
y=0;

}

void draw(){

// first group of circles

stroke(0,0,0);
strokeWeight(7);
fill(255,255,255);
ellipse(187, 530, 270, 270);
stroke(0,0,0);
strokeWeight(7);
fill(0,0,0);
ellipse(330, 330, 580, 580);
stroke(255,255,255);
strokeWeight(14);
fill(0,0,0);
ellipse(330, 330, 2*radius, 2*radius);
ellipse(330, 330, 2*radius, 2*radius);
noStroke();
ellipse(330, 330, 20, 20);
stroke(61,74,88);
strokeWeight(30+x);
ellipse(330, 330, 280,280);
stroke(74,130,119);
strokeWeight(18+x);
ellipse(330, 330, 164,164);
x+=speedX;
y+=speedY;

//main lines group
strokeWeight(3);
stroke(0,0,0);
line (650, 500, 650, 200);
strokeWeight(5);
stroke(0,0,0);
line (620, 350, 750, 350);
strokeWeight(14);
stroke(0,0,0);
line (620, 370, 750, 370);
strokeWeight(5);
stroke(0,0,0);
line (620, 290, 750, 250);

// second grup of circles
noStroke();
fill(0,0,0);
ellipse(680, 650, 170+x, 170+x);
stroke(210,138,98);
strokeWeight(8+x);
fill(255,255,255);
ellipse(680, 650, 150+x, 150+x);

noStroke();
fill(0,0,0);
ellipse(846, 590, 170+y, 170+y);
stroke(210,138,98);
strokeWeight(8+x);
fill(255,255,255);
ellipse(846, 590, 150+y, 150+y);

//semicircles
stroke(0);
strokeWeight(8);
fill(0,0,0);
arc(620, 590, 180, 180, radians(160+x), radians(340));
stroke(210,138,98);
strokeWeight(8);
fill(255,255,255);
arc(620, 590, 150, 150, radians(160+x), radians(340));
stroke(0,0,0);
line (420+x, 660+x, 900+x, 480);

//arcs
//stroke(0);
//noFill();
//strokeWeight(4);
//arc(1100, 700,900, 900, radians(150), radians(300));

//Ask how I can rotate from one point not (0,0)
//strokeWeight(8);
//stroke(175,92,79);
//fill(255,255,255);
//rotate(radians(30));

//triangle lower part
stroke (0,0,0);
noFill();
strokeWeight(16);

// I can’t animate de points of the triangle properly

//if (xPos < 800 || yPos < 790){
//xPos+= speedX;
//yPos+= speedY;
//}

//else {}
//triangle(xPos,yPos,770,780,810,740);

strokeWeight(16+x);
triangle(800,790,770,780,810,740);

 

//3 dots
noStroke();
fill(214,202,156);
ellipse(270+x, 730, 10, 10);
fill(214,202,156);
ellipse(300+(x*2), 720, 10, 10);
fill(214,202,156);
ellipse(330+(x*3), 710, 10, 10);
}

HOMEWORK DAY 2 – CODE

Geometric drawing in processing

 

 

 

 

float radius= 261;

void setup(){
size (900, 900);
background (244,239,193);

}

void draw(){

// first group of circles

stroke(0,0,0);
strokeWeight(7);
fill(255,255,255);
ellipse(187, 530, 270, 270);
stroke(0,0,0);
strokeWeight(7);
fill(0,0,0);
ellipse(330, 330, 580, 580);
stroke(255,255,255);
strokeWeight(14);
fill(0,0,0);
ellipse(330, 330, 2*radius, 2*radius);
ellipse(330, 330, 2*radius, 2*radius);
noStroke();
ellipse(330, 330, 20, 20);
stroke(61,74,88);
strokeWeight(30);
ellipse(330, 330, 280,280);
stroke(74,130,119);
strokeWeight(18);
ellipse(330, 330, 164,164);

//main lines group
strokeWeight(3);
stroke(0,0,0);
line (650, 500, 650, 200);
strokeWeight(5);
stroke(0,0,0);
line (620, 350, 750, 350);
strokeWeight(14);
stroke(0,0,0);
line (620, 370, 750, 370);
strokeWeight(5);
stroke(0,0,0);
line (620, 290, 750, 250);

// second grup of circles
noStroke();
fill(0,0,0);
ellipse(680, 650, 170, 170);
stroke(210,138,98);
strokeWeight(8);
fill(255,255,255);
ellipse(680, 650, 150, 150);

noStroke();
fill(0,0,0);
ellipse(846, 590, 170, 170);
stroke(210,138,98);
strokeWeight(8);
fill(255,255,255);
ellipse(846, 590, 150, 150);

//semicircles
stroke(0);
strokeWeight(8);
fill(0,0,0);
arc(620, 590, 180, 180, radians(160), radians(340));
stroke(210,138,98);
strokeWeight(8);
fill(255,255,255);
arc(620, 590, 150, 150, radians(160), radians(340));
stroke(0,0,0);
line (420, 660, 900, 480);

//arcs
//stroke(0);
//noFill();
//strokeWeight(4);
//arc(1100, 700,900, 900, radians(150), radians(300));

//Ask how I can rotate from one point not (0,0)
//strokeWeight(8);
//stroke(175,92,79);
//fill(255,255,255);
//rotate(radians(30));

//triangle lower part
stroke (0,0,0);
noFill();
strokeWeight(16);
triangle(800,790,770,780,810,740);

//3 dots
noStroke();
fill(214,202,156);
ellipse(270, 730, 10, 10);
fill(214,202,156);
ellipse(300, 720, 10, 10);
fill(214,202,156);
ellipse(330, 710, 10, 10);
}

Code Homework 1 – Animated Processing Art

The inspiration behind the Processing Art I created below is the course of life or time. This is represented by the circles moving at the top from left to right,  an infinite movement.

The rectangles stacked below represents the random happenings of life.

The target board (dart board) represent the different goals we are pushing to hit daily in life.

The color scheme of black and white represents the diversity of life.

Finally, the flickering of the art represents the uncertainties of life.

Processing Animated Art

coding day3 homework add interaction

//2017.7.31 homework sketching
//written by joyce

String printThis = “The first homework:” ;
int r =239;
int g =232;
int b =164;
int opacity =255;

void setup(){
size(600,250);
println(printThis);

println(600+ “x” + 250+”pixcels”);
background(r,g,b);
println(“bgcolour”+”=”+r+”,”+g+”,”+b+”,”);

}
void draw(){
background(r,g,b);
noStroke();
fill(255);
ellipse(80,80,100,100);

stroke(0);
strokeWeight(1);
fill(255);
ellipse(50,125,30,30);

stroke(0);
strokeWeight(3);
noFill();
ellipse(80,80,100,100);

noStroke();
fill(0);
ellipse(80,80,90,90);

stroke(24,45,55);
strokeWeight(4);
noFill();
ellipse(80,80,50,50);

stroke(43,88,93);
strokeWeight(3);
noFill();
ellipse(80,80,25,25);//circle

stroke(0);
strokeWeight(0.1);
line(200,40,250,190);

stroke(0);
strokeWeight(0.1);
line(100,160,300,100);

stroke(0);
strokeWeight(0.1);
line(300,180,500,180);

fill(74,65,107);
triangle(280,80,295,60,300,78);

fill(74,65,107);
triangle(300,78,320,180,350,90);

fill(255);
triangle(360,180,400,30,420,180);

}