Austin Treu – Project 05

atreu-proj-05

//Austin Treu
//atreu@andrew.cmu.edu
//Section B
//Project-05

function setup() {
   	createCanvas(580, 580);
    background(0,0,int(random(255)));

    //set vars for circles
    var tw = 20, th = 20, offset = 20, 
    	circSize = 10, loops = 10, 
		backX = ((loops-1) * tw)/2, backY = ((loops-1) * th)/2,
		backSize = loops*circSize, 
		tileSizeX = (loops) * tw, tileSizeY = (loops) * th,
		//randomize color
		colorRandom = int(random(255));
		backColor = 'rgb(100,0,'+colorRandom+')',
		circColor = 'rgb('+colorRandom+',0,200)',
		lineColor = 'rgb(200, 0,'+colorRandom+')';

	//loop to draw multiple tiles
	stroke(lineColor);
	for(var i = 0; i < (height/tileSizeY); i++){
		for(var j = 0; j < (width/tileSizeX); j++){
			//draw big background circle
			fill(backColor);
			ellipse(backX + j*tileSizeX, backY + i*tileSizeY, backSize, backSize);
			//utilize honeycomb pattern for tile
			fill(circColor);
		    for (var y = 0; y < loops; y++) {
		        for (var x = 0; x < loops; x++) {
		            if(y%2 === 0){
		                var py = ( (y * th)) + i * tileSizeY;
		                var px = ( (x * tw)) + j * tileSizeX;
		                ellipse(px, py, circSize, circSize);
		            }
		            else{      
		                var py = ( (y * th)) + i * tileSizeY;
		                var px = ( (0.5 * offset + x * tw)) + j * tileSizeX;
		                ellipse(px, py, circSize, circSize);          
		            }
		        }
		    }
		    //draw lines around each tile
		    line(j*tileSizeX, i*tileSizeY, (j+1)*tileSizeX, i*tileSizeY);
		    line((j+1)*tileSizeX + 0.5*offset, (i+1)*tileSizeY-th, j*tileSizeX + 0.5*offset, (i+1)*tileSizeY-th);
		    line(j*tileSizeX, i*tileSizeY, j*tileSizeX + 0.5*offset, (i+1)*tileSizeY-th);
		    line((j+1)*tileSizeX + 0.5*offset, (i+1)*tileSizeY-th, (j+1)*tileSizeX, i*tileSizeY);
		}
	}

    noLoop();
}


When I started working on this project, I wanted to use the honeycomb code from Assignment B this week because of how interesting that ended up looking by itself. Ultimately I had to simplify it in order to make the math for the rest of the design work out a bit better, as adjusting everything to deal with the square root of three over two can become a difficult task. The shapes’ randomized fills and stroke correspond with each other and utilize the same random value in different ways.

Leave a Reply