My process started with trying to figure out how to get the strings to “curve” (or have the illusion to curve). After drawing a bunch of hatch marks didn’t work, I studied the photos on the blog of the 7th grade teacher until I understood the pattern. After a bit of experimentation, I was able to get the formula for my for loop. Then I just kept modifying it and adding colors till I was satisfied.
var lx = 20;//width divided by 20
var ly = 15;//height divided by 20
function setup(){
createCanvas(400,300);
}
function draw() {
background(255, 150, 213);
//red heart
fill("red");
noStroke();
ellipse(width/2 - 23, height/2, 50,50);//left heart bulb
ellipse(width/2 + 23, height/2, 50,50);//right heart bulb
triangle((width / 2) - 55,height / 2 + 10, width / 2,(height / 2)
+ 60, (width / 2) + 55,height / 2 + 10);//base of heart
//makes curve on top right
for(var i = 0; i < lx; i += 1){//sets up increment and # of elements
stroke(247, 25, 25);
line(width - lx * i,0, width,height - ly * i);//draws lines
}
//makes curve on top left
for(var j = 0; j < lx; j += 1){//sets up increment and # of elements
stroke(250, 90, 96);
line(0 + lx * j,0, 0,height - ly * j);//draws lines
}
//makes curve on bottom left
for(var t = 0; t < lx; t += 1){//sets up increment and # of elements
stroke(255, 150, 175);
line(width - lx * t,height, 0,height - ly * t);//draws lines
}
//makes second curve on bottom right
for(var z = 0; z < lx; z += 1){//sets up increment and # of elements
stroke(255, 201, 201);
line(height - lx * z,height, 0,height - ly * z);//draws lines
}
//makes second curve on top right
for(var z = 0; z < lx; z += 1){//sets up increment and # of elements
stroke(255, 201, 201);
line(height - lx * z,0, width,height - ly * z);//draws lines
}
}