Project.01 :Code and Form
01. Balance
pro_01_balance.png
Symmetrical Balance
pro_01_asymmetrical_fin_.png
Assymetrical Balance





02. Rhythm
pro_01_asymmetrical.png
Emergence/Split Rhythm
pro_01_attract_split2.png
Attraction/Emergence Rhythm



01.Balance
//canvas attributes:size,background colour
size(250,250);
background(238,238,238);
smooth();
 
//
fill(0,160,73);
noStroke();
//centre circle
ellipse(125,125,30,30);
//outer circle
ellipse(0,0,110,110);
ellipse(250,250,110,110);
ellipse(0,250,110,110);
ellipse(250,0,110,110);
 
//circle with 20 radius
ellipse(90,90,20,20);
ellipse(160,160,20,20);
ellipse(160,90,20,20);
ellipse(90,160,20,20);
 
//branching off from the circles (horizontal)
ellipse(15,125,30,30);
ellipse(235,125,30,30);
ellipse(73,100,10,10);
ellipse(73,150,10,10);
ellipse(173,100,10,10);
ellipse(173,150,10,10);
 
//branching off from the circlces(vertical)
ellipse(125,15,30,30);
ellipse(125,235,30,30);
ellipse(100,73,10,10);
ellipse(150,73,10,10);
ellipse(100,173,10,10);
ellipse(150,173,10,10);
 
//small circles
 
ellipse(110,110,10,10);
ellipse(140,140,10,10);
ellipse(110,140,10,10);
ellipse(140,110,10,10);
ellipse(102,102,5,5);
ellipse(148,148,5,5);
ellipse(102,148,5,5);
ellipse(148,102,5,5);
 
 
//lines connecting circles(horizontal)
stroke(0,160,73);
strokeWeight(2);
fill(0,160,73);
line(73,100,15,125);
line(73,150,15,125);
line(173,100,235,125);
line(173,150,235,125);
 
//lines connecting the circles (vertical)
 
strokeWeight(4);
line(15,125,110,110);
line(15,125,110,140);
line(235,125,140,140);
line(235,125,140,110);
 
strokeWeight(3);
 
line(125,15,100,73);
line(125,15,150,73);
 
 
save("pro_01_balance.png");
 
 
01.Asymmetrical Balance
 
 
//canvas attribute
 
size(250,250);
smooth();
background(242,243,245);
noFill();
 
//circle
stroke(255,56,21);
strokeWeight(16);
ellipse(250,210,300,300);
strokeWeight(12);
ellipse(260,120,400,400);
 
//lines
 
strokeWeight(7);
rect(40,220,10,10);
strokeWeight(3);
rect(180,7,10,10);
stroke(10);
strokeWeight(8);
rect(50,148,10,10);
 
strokeWeight(6);
rect(80,80,15,15);
 
 
strokeWeight(12);
rect(10,170,30,30);
 
strokeWeight(4);
rect(100,110,10,10);
 
stroke(255,56,21);
 
save("pro_01_asymmetrical_fin_.png");
 
 
 
02.Rhythm(Attract/split)
 
 
//canvas attributes
 
size(250,250);
smooth();
background(234,224,14);
 
 
//recangle shapes
 
noStroke();
fill(31,31,27);
rect(200,0,5,80);
rect(200,85,5,30);
rect(200,100,5,20);
rect(200,200,5,50);
rect(200,155,5,30);
rect(200,125,5,25);
 
//lines
stroke(20,20,27);
strokeWeight(3);
line(210,0,210,250);
 
strokeWeight(3);
line(82,0,82,250);
strokeWeight(4);
line(194,0,194,250);
line(170,0,170,250);
 
strokeWeight(15);
line(238,0,238,250);
strokeWeight(13);
line(215,0,215,250);
line(120,0,120,250);
 
 
 
 
//white lines
stroke(254,255,239);
strokeWeight(2);
line(226,0,226,250);
 
strokeWeight(38);
line(140,0,140,250);
 
fill(254,255,239);
rect(0,0,40,250);
noStroke();
rect(70,0,8,250);
 
 
//attract (upper circle)
 
noFill();
stroke(32,93,2);
strokeWeight(7);
ellipse(50,50,120,120);
 
stroke(42,72,12);
ellipse(50,50,140,140);
 
stroke(21,39,12);
ellipse(50,50,160,160);
 
stroke(54,126,17);
ellipse(50,50,100,100);
 
stroke(78,165,32);
ellipse(50,50,80,80);
 
stroke(89,198,32);
ellipse(50,50,60,60);
 
stroke(141,227,98);
ellipse(50,50,40,40);
 
stroke(199,255,170);
ellipse(50,50,20,20);
 
//attract (middle circle)
 
noFill();
strokeWeight(6);
 
stroke(255,242,242);
ellipse(195,170,10,10);
 
stroke(252,186,186);
ellipse(195,170,25,25);
 
stroke(255,152,152);
ellipse(195,170,40,40);
 
stroke(255,95,95);
ellipse(195,170,55,55);
 
stroke(255,36,36);
ellipse(195,170,70,70);
 
stroke(255,8,8);
ellipse(195,170,85,85);
 
//attract (bottom circle)
 
noFill();
strokeWeight(8);
 
stroke(180,181,185);
ellipse(80,250,80,80);
stroke(108,115,147);
ellipse(80,250,60,60);
stroke(39,47,82);
ellipse(80,250,40,40);
stroke(23,32,72);
ellipse(80,250,20,20);
 
 
save("pro_01_attract_split2.png");
 
02.Rhythm (Emergence/split)
 
 
//canvas attributes:size,background colour
size(250,250);
background(227,227,227);
smooth();
 
//
fill(0,160,73);
noStroke();
//centre circle
ellipse(125,125,30,30);
//outer circle
ellipse(0,0,110,110);
ellipse(250,250,110,110);
ellipse(0,250,110,110);
ellipse(250,0,110,110);
 
//circle with 20 radius
ellipse(90,90,20,20);
ellipse(160,160,20,20);
ellipse(160,90,20,20);
ellipse(90,160,20,20);
 
//branching off from the circles (horizontal)
ellipse(15,125,30,30);
ellipse(235,125,30,30);
ellipse(73,100,10,10);
ellipse(73,150,10,10);
ellipse(173,100,10,10);
ellipse(173,150,10,10);
 
//branching off from the circlces(vertical)
ellipse(125,15,30,30);
ellipse(125,235,30,30);
ellipse(100,73,10,10);
ellipse(150,73,10,10);
ellipse(100,173,10,10);
ellipse(150,173,10,10);
 
 
 
 
 
 
ellipse(110,110,10,10);
ellipse(140,140,10,10);
ellipse(110,140,10,10);
ellipse(140,110,10,10);
ellipse(102,102,5,5);
ellipse(148,148,5,5);
ellipse(102,148,5,5);
ellipse(148,102,5,5);
 
ellipse(55,55,35,35);
ellipse(195,195,35,35);
ellipse(55,195,35,35);
ellipse(195,55,35,35);
 
 
ellipse(81,81,3,3);
ellipse(169,169,3,3);
ellipse(81,169,3,3);
ellipse(169,81,3,3);
 
 
ellipse(77,77,6,6);
ellipse(173,173,6,6);
ellipse(77,173,6,6);
ellipse(173,77,6,6);
 
 
//lines connecting circles(horizontal)
stroke(0,160,73);
strokeWeight(2);
fill(0,160,73);
line(73,100,15,125);
line(73,150,15,125);
line(173,100,235,125);
line(173,150,235,125);
 
//lines connecting the circles (vertical)
strokeWeight(3);
 
 
strokeWeight(4);
line(15,125,110,110);
line(15,125,110,140);
line(235,125,140,140);
line(235,125,140,110);
 
strokeWeight(3);
 
line(125,15,100,73);
line(125,15,150,73);
line(125,235,100,173);
line(125,235,150,173);
line(100,73,125,125);
line(150,73,125,125);
line(100,173,125,125);
line(150,173,125,125);