hyt-Project-05: Wallpaper Drawing

hyt-05-project

// helen tsui
// 15-104 section d
// hyt@andrew.cmu.edu
// project-03-dynamic-drawing


//var x1; // wave left coordinate;
//var x2 = 30; // wave right coordinate

var angleL = -160;
var angleR = -20;
var span = 40;
var wx; // waveX;
var wy; // waveY;
var r = 245; 
var g = 245;
var b = 230;


function setup() {
  createCanvas(400, 400);
  angleMode(DEGREES);
  background(24, 42, 81);
}

// a wallpaper of small fishes swimming down the ocean
function draw() {

    for(var wy = 0; wy < 30; wy ++) { // wave y coordinate increment
            
            for (var wx = 0; wx <= 10; wx++) { // wave x coordinate increment
            
            if (wy % 2 == 0) {
                noFill();
                strokeWeight(1.8);
                stroke(r, g, b);
                arc(15 + wx * span, 25 + wy * 30, 40, 40, angleL, angleR); // first wave
                strokeWeight(1.5);
                stroke(r, g, b - 30);
                arc(18 + wx * span, 30 + wy * 30, 40, 30, angleL + 15, angleR - 10); 
                strokeWeight(1);
                stroke(r, g, b - 60);
                arc(4 + wx * span, 35 + wy * 30, 40, 30, angleL + 5, angleR - 20); 
                strokeWeight(0.8);
                stroke(r, g, b - 90);
                arc(20 + wx * span, 42 + wy * 30, 40, 30, angleL - 5, angleR - 0); 
            }

            if (wy % 2 == 1) {
                noFill();
                strokeWeight(1.8);
                arc(30 + wx * span, 25 + wy * 30, 40, 40, angleL, angleR); // first wave
                strokeWeight(1.5);
                arc(33 + wx * span, 30 + wy * 30, 40, 30, angleL + 15, angleR - 10); 
                strokeWeight(1);
                arc(19 + wx * span, 35 + wy * 30, 40, 30, angleL + 5, angleR - 20); 
                strokeWeight(0.8);
                arc(35 + wx * span, 40 + wy * 30, 40, 30, angleL - 5, angleR); 
            }
        }
        }
    noLoop();
    }




For this project, I started out searching through the wallpaper links provided by the instructions, and i became intrigued by one of the Japanese wave-like prints (which is often used for clothing and paper prints). Inspired by that, I sketched some images down, hoping to create a similar pattern with a bit more dimensionality. For the end result, the most challenging parts were the wave movements created by crossing arc functions, as well as the gradient color choices which took me a while to figure out.

Leave a Reply