function setup() {
createCanvas(400, 300);
}
function draw() {
background(95, 138, 128);
var xpt1; //starting x coordinate
var ypt1; //starting y coordinate
//background blue lines
strokeWeight(1);
stroke(45,72,94,100);
for (var xpt1 = 0; xpt1 < 30; xpt1 += 1) {
line(0,10*xpt1,50*xpt1,300); //bottom grid background
line(399,10*xpt1,20*xpt1,1); //top grid background
}
//thick transparent blue lines
strokeWeight(7);
stroke(82, 88, 135,130);
for (var xpt1 = 0; xpt1 < 250; xpt1+=25) {
var ypt1 = 200;
line(130, 50, xpt1, ypt1); //starting from top right
line(130,250,xpt1,ypt1); //starting from bottom right
}
//thin brown line inside the blue lines
strokeWeight(1.5);
stroke(140, 126, 15);
for (var xpt1 = 0; xpt1 < 250; xpt1+=25) {
var ypt1 = 200;
line(130, 50, xpt1, ypt1); //starting from top right
line(130,250,xpt1,ypt1);
}
//think transparent red lines
strokeWeight(10);
stroke(140,69,94,130);
for (var ypt1 = 0; ypt1 < 300; ypt1+=40) {
var xpt1 = mouseX;
line(230,200,xpt1,ypt1+10);
}
//turquoise lines
strokeWeight(2);
stroke(111,138,95,150);
for (var ypt1 = 0; ypt1 < 300; ypt1+=20) {
var xpt1 = mouseX;
line(227,200,xpt1,ypt1+10)
}
//eyebrow + eyes
strokeWeight(10);
stroke(0,0,0,150);
line(40,120,80,130); //eyebrow
ellipse(50,150,10,10); //outer eye
stroke(255);
ellipse(50,150,2,2);//inner eye
}
I was able to further practice the function “for loop” to create the abstract lines in the background. I then used the template to make the body and the moving tail of the fish. I thought the project turned out to be interesting, but not as aesthetically pleasing as I wanted it to be.