My process for creating this wallpaper assignment was to first create the repeating sun pattern and then the repeating snake pattern. To accomplish this, I created a separate sun function and snake function. After I created the two functions, I used a series of for loops to create the patterns. The symbols of the snake and the sun were inspired by the Temple of the Feathered Serpent in Teotihuacán.
sketchDownload
function setup() {
createCanvas(500, 500);
background(220);
text("p5.js vers 0.9.0 test.", 10, 15);
}
function draw() {
background(97,104,181);
//sun pattern
push();
for(sunRow = 0; sunRow <= 9; sunRow += 1){
sun();
translate(50,0);
}
pop();
push();
translate(0,50);
for(sunRow = 0; sunRow <= 9; sunRow += 1){
sun();
translate(50,0);
}
pop();
push();
translate(0,100);
for(sunRow = 0; sunRow <= 9; sunRow += 1){
sun();
translate(50,0);
}
pop();
push();
translate(0,150);
for(sunRow = 0; sunRow <= 9; sunRow += 1){
sun();
translate(50,0);
}
pop();
push();
translate(0,200);
for(sunRow = 0; sunRow <= 9; sunRow += 1){
sun();
translate(50,0);
}
pop();
push();
translate(0,250);
for(sunRow = 0; sunRow <= 9; sunRow += 1){
sun();
translate(50,0);
}
pop();
push();
translate(0,300);
for(sunRow = 0; sunRow <= 9; sunRow += 1){
sun();
translate(50,0);
}
pop();
push();
translate(0,350);
for(sunRow = 0; sunRow <= 9; sunRow += 1){
sun();
translate(50,0);
}
pop();
push();
translate(0,400);
for(sunRow = 0; sunRow <= 9; sunRow += 1){
sun();
translate(50,0);
}
pop();
push();
translate(0,450);
for(sunRow = 0; sunRow <= 9; sunRow += 1){
sun();
translate(50,0);
}
pop();
translate(-20,0);
for(drawSnake = 0; drawSnake <= 5; drawSnake += 1){
snake();
translate(0,105);
}
noLoop();
}
function sun() {
noStroke();
fill(97,104,181);
square(0,0,50);
fill(249,235,219);
//sun 1
circle(25,25,25);
//sun rays 1
stroke(249,235,219);
line(25,25,25,5);
line(25,25,25,45);
line(5,25,25,25);
line(45,25,25,25);
line(25,25,10,10);
line(25,25,40,40);
line(25,25,10,40);
line(25,25,40,10);
}
function snake(){
noStroke();
fill(10,random(100,255),0);
//body
beginShape();
vertex(125,25);
curveVertex(150,35);
curveVertex(200,25);
curveVertex(250,35);
curveVertex(300,25);
curveVertex(320,30);
curveVertex(350,40);
curveVertex(375,30);
curveVertex(400,25);
vertex(475,32.5);
curveVertex(400,34);
curveVertex(350,50);
curveVertex(300,35);
curveVertex(250,50);
curveVertex(200,35);
curveVertex(150,50);
curveVertex(125,30);
endShape(CLOSE);
push();
//tongue
stroke(255,10,0);
line(90,29,80,29);
//head
noStroke();
ellipse(110,29,40,15);
//eye
fill(255);
ellipse(110,27,5,3);
strokeWeight(3);
stroke(0);
//pupil
point(110,27);
}