sketch
I was inspired by islamic geometric patterns as well as oriental window seals that overlapped and intersected perpetually. There are three components in this pattern, a vertical line and two zigzag lines. I created my own functions, “vertStrip” and “zigzag” to reduce redundancy in coding the overlapping strips.
//Jihoon Park
//Section A
//jihoonp@andrew.cmu.edu
//project-05
var i; //horizontal loop value for vertical strips
var j; //vertical loop value for vertical strips
var k; //horizontal loop value for black zigzag
var l; //vertical loop value for black zigzag
var m; //horizontal loop value for gray zigzag
var n; //vertical loop value for gray zigzay
function setup() {
createCanvas(800, 400);
background(236, 245, 255); //lightblue
//WHITE VERTICAL STRIPS
for (j=0; j<height+20; j+=20) {
strokeWeight(0.5);
fill(255, 142, 84); //orange red
for (i=0; i<width+20; i+=20) {
if ((i%40)==0) { //odd number columns
vertStrip(i, j);
} else { //even number columns
vertStrip(i, j-10);
}
}
}
// HORIZONTAL ZIGZAG
for (l=0; l<height+20; l+=20) {
for(k=0; k<width+80; k+=80) {
if ((l%40)==0) { //ODD ROWS
fill(160, 255, 99);//green //draws green zigzag strips
zigzag(k, l);
fill(78, 232, 194); //draws turquois zigzag strips
zigzag(k+20, l+10);
} else { //EVEN ROWS
fill(160, 255, 90); //draws green zigzag strips
zigzag(k-40, l);
fill(78,232,194);
zigzag(k+-20, l+10); //draws turquois zigzag strips
}
}
}
noLoop();
}
function vertStrip(i,j) {
beginShape(); //function that draws vertical strips
vertex(i, j+5);
vertex(i+5, j+2.5);
vertex(i+5, j+17.5);
vertex(i, j+20);
endShape(CLOSE);
}
function zigzag(k, l) { //function that draws zigzag strips
beginShape(); //all vertex of shapes are listed clockwise
vertex(k-15, l+2.5);
vertex(k-10, l+5);
vertex(k-15, l+7.5);
endShape(CLOSE);
beginShape();
vertex(k-10, l+5);
vertex(k+5, l-2.5);
vertex(k+10, l);
vertex(k-5, l+7.5);
endShape(CLOSE);
beginShape();
vertex(k+10, l);
vertex(k+15, l-2.5);
vertex(k+20, l);
vertex(k+20, l+5);
endShape(CLOSE);
beginShape();
vertex(k+25, l+2.5);
vertex(k+30, l+5);
vertex(k+50, l-5);
vertex(k+60, l);
vertex(k+60, l+5);
vertex(k+50, l);
vertex(k+30, l+10);
vertex(k+25, l+7.5);
endShape();
}