Project 05 – Wallpaper

Stereoscopic style wallpaper with randomly generated shapes throughout composition.

sketch
//Aarnav Patel
//Section D
//aarnavp@andrew.cmu.edu
//Project-05

var side = 100;
var radius = 0.8 * side
function setup() {
    createCanvas(600, 600);
    background(0);
}

function draw() {
	noStroke();

	let arr1 = [1, 2, 3];
	count = 0;
	for (var y = 0; y < height; y += side) {
		count = count + 1; 
		for (var x = 0; x < width; x += side) {
			if (count == floor(random(0, 5))) {
				drawTile(x, y);
				drawRandomShape(x, y);
				count = 0;
			} else {
				drawTile(x, y);
			}
		}
	}
	noLoop();
}

function drawTile(x, y) {
	fill(0, 0, 255, 150);
	ellipse(x + side / 2, y + side / 2, radius);
	fill(255, 0, 0, 100);
	ellipse(x + radius / 2, (y + side / 2 ), radius);

	fill(0, 0, 255, 100);
	triangle(x - 5, y - 5, (x + side) - 5, y - 5, x - 5, (y + side) - 5);
	fill(255, 0, 0, 150);
	triangle(x, y, x + side, y, x, y + side);

}

function drawRandomShape(x, y) {
	var r = floor(random(0, 3));
	fill(255);

	if (r == 0) {
		rectMode(CENTER);
		rect(x + (side / 2), y + (side / 2), side * 0.1, side * 0.5);
		rect(x + (side / 2), y + (side / 2), side * 0.5, side * 0.1);
	} else if (r == 1) {
		rectMode(CENTER);
		rect(x + (side / 2), y + (side / 2), side * 0.1, side * 0.5);
	} else {
		rectMode(CENTER);
		rect(x + (side / 2), y + (side / 2), side * 0.5, side * 0.1);
	}
}

Project 04 – String art

Randomly generated string vortex effect

sketch
//Aarnav Patel
//aarnavp
//Section D

var numLines = 100;
var dx1;
var dy1;
var dx2;
var dy2;


function setup() {
    createCanvas(400, 300);
    background(220);

}

function draw() {
	strokeWeight(0.25)	//to better see string

    for (var i = 0; i < 10; i += 1) {	//the amount of vortex triangles drawn
       	let x1 = random(0, width);
    	let y1 = random(0, height);
    	let x2 = width / 2;
    	let y2 = height / 2;
        //centering all lines towards middle on end point – converging vortex
        
        let x3 = random(0, width);
        let y3 = random(0, height);
        let x4 = random(0, width);
        let y4 = random(0, height);

    	line(x1, y1, x2, y2);
    	//line(x3, y3, x4, y4);

    	dx1 = (x2 - x1) / numLines;
    	dy1 = (y2 - y1) / numLines;
    	dx2 = (x3 - x4) / numLines;
    	dy2 = (y3 - y4) / numLines;
    	//creating evenly spaced lines for each "line art pair"

    	for (var j = 0; j < numLines; j += 1) {
    	    if (i == 5) {		//making the middle vortex triangle red
    			stroke("red");
    		} else {
    			stroke(0)
    		}

    		line(x1, y1, x2, y2);
    		x1 += dx1;
    		y1 += dy1;
    		x2 += dx2;
    		y2 += dy2;

    	}

    }
    noLoop();


}

Looking Outwards – Sound Art

One computational sound project that really impressed me is the work of Ryoji Ikeda. Ikeda’s installations work with presenting data through a cinematic immersive experience, and reimagining how data can be visualized through multiple sensory avenues. His work (primarily audio as well) works with the concept of binary input, where there are merely two possible outputs of data (e.g on and off, black and white). Together, it synchronizes with binary visuals that create this immersive method of understanding large complex structures like genetics and biology.

What I especially appreciate about this piece is how natural the integration with technology and music was undertaken. It’s always a risk to “overcompute” a creative practice within these types of projects, which undermine the beauty of arts based performances. However, the project reimagines how sound can be portrayed with binary outputs.

Project 3 Dynamic Drawing

The piece is inspired by 3D Glasses, and the relationship between Red and Blue light in bringing images “off the screen.” I think it has a really cool holographic affect to it that is also brought about with proximity and rotation.

HOLD DOWN ON MOUSE TO CHANGE SIZE AND COLOR

sketch

//Aarnav Patel
//Section D

var side;
var midX = 0;		//the coordinates of the middle squares (what the other squares are proportional to)
var midY = 0; 
var rotation = 0;
var color1 = 255;
var color2 = 0;


function setup() {
    createCanvas(600, 450);
    background(220);
    text("p5.js vers 0.9.0 test.", 10, 15);
    side = width / 32;	

}

function draw() {

	//change my origin to the middle of the canvas to better organize my rectangles
	translate(width / 2, height / 2);
	background(0);
	noStroke();
	colorMode(RGB);

	//side rectangles are proportionally equidistant from the middle square (based on x value)
	xdiff = min(mouseX / 2, (width / 2) - side);
	ydiff = min(mouseY / 2, (height / 2) - side);
	

	//Red Rectangles (TOP ROW)
	fill(color1, 0, color2, 100);
	push();							//Create its own coordinate system (for rotation)
	translate(midX, midY - ydiff);	//MID square coordinate place
	rotate(radians(rotation));	
	rectMode(CENTER);				//means that the x and y value below are the CENTER of the rectangle
	rect(0, 0, side, side);
	pop();							//reset coordinate sytem for next rectangle

	push();
	translate(midX - xdiff, midY - ydiff);	//LEFT square coordinate place
	rotate(radians(rotation));
	rectMode(CENTER);
	rect(0, 0, side, side);
	pop();

	push();
	translate(midX + xdiff, midY - ydiff);		//RIGHT square coordinate place
	rotate(radians(rotation));
	rectMode(CENTER);
	rect(0, 0, side, side);
	pop();

	//blue rectangles (BOTTOM ROW)
	fill(color2, 0, color1, 100);
	push();
	translate(midX, midY + ydiff);		//MID square coordinate place
	rotate(radians(rotation));
	rectMode(CENTER);
	rect(0, 0, side, side);
	pop();

	push();
	translate(midX - xdiff, midY + ydiff);		//LEFT square coordinate place
	rotate(radians(rotation));
	rectMode(CENTER);
	rect(0, 0, side, side);
	pop();

	push();
	translate(midX + xdiff, midY + ydiff);		//RIGHT square coordinate place
	rotate(radians(rotation));
	rectMode(CENTER);
	rect(0, 0, side, side);
	pop();

	rotation = rotation + 1;	//Increment rotation so squares always spinning

	
	if (mouseIsPressed) {	//if user holds mouse, it changes color (switches blue and red values of each row)
		if (color1 != 0) {
			color1 -= 1;
			color2 += 1;
		} else {
			color1 += 1;
			color2 -= 1;
		}


		if (side >= width) {	//if rectangles get too big for the canvas, it resets back to initial side length
			side = width / 32;
			color1 = 255;
			color2 = 0;
		} else {
			side = side * 1.01;
		}
	}

	

}

Looking Outwards 03 – Computational Fabrication

Purl installation at night – photoluminescent fibers charge during the day with solar power.

One project that especially inspired me was Jenny Sabin’s’ Purl installation in Abu Dhabi. The project is a very immersive example of Computational Fabrication being used to create an environment. The installation serves as an “interactive” canopy, which has digitally weaved photoluminescent fibers. What really inspires me about this piece is the incorporation of computational biomimicry, and this allusion to patterns in nature with this high tech piece. It relates to Andy Lomas’ Cellular Forms exploration, which highlights the beauty of morphogenetic processes through an ambiguously generated form. The piece is extremely organic, which bolsters its intent/message of fostering a community/ecosystem within the commissioned area. 

As per the article, Sabin’s work employs the use of modularity, and understanding how the parameters of these recursive functions produce these overarching environments. In context of the concept of gestaltum and parametric objects, it’s interesting to recognize the variables that were adjusted to create the specific weaves – whether the relationship between the hexagonal shapes indicates the numbers used? 

Purl, Jenny Sabin 2020

aarnavp – Project 2 Variable Face

sketch

The pupils follows your cursor!

function setup() {
    createCanvas(400, 400);
    background(220);
    text("p5.js vers 0.9.0 test.", 10, 15);
}
var r = 220;
var g = 220;
var b = 220;
var faceW = 150; 
var faceH = 150;
var randomR = 221;
var randomG = 161;
var randomB = 119;
var eyeSize = 5;
var eyeGap = 50
var noseW = 30;
var noseH = 30;
var mouthType = 1;
var mouthSize = 50;
var bodyW = 200;


function draw() {

	background(r, g, b);
	//body
	fill(255 - r, 255 - g, 255 - b);
	ellipse(width / 2, height, bodyW, height);

	//face
	noStroke();
	fill(randomR, randomG, randomB);
	ellipse(width / 2, height / 2, faceW, faceH);

	//eye
	fill(255);
	ellipse((width / 2) - (eyeGap / 2), height / 2, eyeSize * 2);
	ellipse((width / 2) + (eyeGap / 2), height / 2, eyeSize * 2);
	fill(0);
	var y;
	if (mouseY >= (height / 2) + (eyeSize / 2)) {			//if pupil goes past top of eye
		y = min(mouseY, (height / 2) + (eyeSize / 2));
	} else if (mouseY  <= (height / 2) - eyeSize / 2) {		//if pupil goes past bottom of eye
		y = max(mouseY, (height / 2) - (eyeSize / 2));
	} else {												//if pupil is in eye gap
		y = height / 2;
	}

	var xL; 
	var xR;
	if (mouseX >= (width / 2) + (eyeGap / 2)) {								//if pupil goes past right eye
		xR = min(mouseX, (width / 2) + (eyeGap / 2) + (eyeSize / 2));
		xL = min(mouseX, (width / 2) - (eyeGap / 2) + (eyeSize / 2));
	} else if (mouseX <= (width / 2) - (eyeGap / 2)) {						//if pupil goes past left eye
		xL = max(mouseX, (width / 2) - (eyeGap / 2) - (eyeSize / 2));
		xR = max(mouseX, (width / 2) + (eyeGap / 2) - (eyeSize / 2));
	} else {																//if pupil is in eye gap
		xL = (width / 2) - (eyeGap / 2);
		xR = (width / 2) + (eyeGap / 2);
	}

	ellipse(xL, y, eyeSize);	//leftEye
	ellipse(xR, y, eyeSize);	//rightEye

	//nose
	fill(randomR - 20, randomG - 20, randomB - 20);
	ellipse(width / 2, (height / 2) + (faceH / 5), noseW, noseH);
	fill(randomR, randomG, randomB);
	ellipse(width / 2, (height / 2) + (faceH / 5) - 10, noseW, noseH);

	//mouth
	fill(0);
	if (mouthType <= 2 & mouthType >= 1) {
	    rect((width / 2) - (mouthSize / 2), (height / 2) + (faceH / 5) * 2, mouthSize, 3);
	} else {
		circle(width / 2, (height / 2) + (faceH / 5) * 2, mouthSize * 0.25);
	}

}

function mousePressed() {
	bodyW = random(width / 1.5, width / 3);

	faceW = random(width / 4, width / 2);
	faceH = random(height / 4, height / 2);

	randomR = random(150, 200);
	randomG = random(110, 130);
	randomB = random(70, 90);

	eyeGap = random(faceW / 2, faceW / 5);
	eyeSize = random(5, 20);

	noseW = random(20, 40);
	noseH = random(30, 50);

	mouthType = random(0, 2);
	mouthSize = random(faceW / 2, faceW / 10);

	r = random(255);
	g = random(255);
	b = random(255);

}

aarnavp – LO 02 Generative Art

In the topic of Generative Art, I was especially inspired by Mitchell Whitelaw’s “Generative Heritage” pieces on New Castle, UK. Strictly from an anthropological standpoint, there is a lot of significance to the concept Whitelaw intends on emulating, as he intends on capturing the various facets of history embedded within this place as a “digital artifact.” Moreover, there is this idea of modernizing the practice of “collaging” in a way that effectively speaks more to the significance of the content. Mitchell talks about this idea of automation simplifying all the possible permutations of a design, whereas traditional art methods would involve a lot more selectability/omission of content. While this may apparently speak to the artists’ decisions, it diminishes the ability to emphasize the concept, which is the history of New Castle. This project especially changed my outlook on generative art, as it represents the idea of possibility as opposed to “meaningless art.”

Mitchell discussed part of the algorithm, which takes 5 source images from a dataset of 2000. The randomly selected images are then compositionally arranged with “semi-random” patterns/rules that allow for formal visual elements (such as unity and repetition) which create the aesthetic digital collages. The images’ opacities are all lowered for more interaction between the images. 

While the process may seem extremely predetermined/predictable, there were several creative choices made within the code that correlate to artistic choices one would make on a physical medium. One method is that the compositor treats images differently depending on the textures/qualities of the material of images – lineweight drawings are treated in a different manner than photographic artifacts, which result in appropriate digital collaging that properly curates elements from the both of them.

Mitchell Whitelaw – Generative Heritage

Project 01-Face

this is my project

sketch
//Aarnav Patel
//Section D

function setup() {
    createCanvas(500, 500);
    background(220);
}
var pos = (500 / 7 / 2);

function draw() {
	var randomR = random(1, 256);
	var randomG = random(1, 256);
	var randomB = random(1, 256);
	if (mouseIsPressed) {
	    background(randomR, randomG, randomB);
	}
	//body
	fill(255);
	ellipse(width / 2, height, width / 1.5, height);
	//face
	noStroke();
	fill(221, 161, 119);
	ellipse((width / 2), (height / 2), (width / 3),  (width / 2));


	//hair
	fill(0);
	ellipse((width / 2), ((height / 2) - (width / 3 / 2)), (width / 3), (width / 4));
	rect((width / 2) - ((width / 3 / 2)) - 10, ((height / 2) - 50), 20, 50);
	rect((width / 2) + ((width / 3 / 2)) - 10, ((height / 2) - 50), 20, 50)
	triangle((width / 2) - ((width / 3 / 2)) - 10, ((height / 2) - 50), (width / 2) - ((width / 3) / 2), ((height / 2) - (width / 3 / 2)), (width / 2) + ((width / 3 / 2)) + 10, ((height / 2) - 50));
	triangle((width / 2) - ((width / 3 / 2)) - 10, ((height / 2) - 50), (width / 2) + ((width / 3) / 2), ((height / 2) - (width / 3 / 2)), (width / 2) + ((width / 3 / 2)) + 10, ((height / 2) - 50));

	//eyes
	ellipse((width / 2) - ((width / 3) / 4), (height / 2), 10);
	ellipse((width / 2) + ((width / 3) / 4), (height / 2), 10);

	//nose
	fill(170, 130, 100);
	ellipse((width / 2), (height / 2) + 50, 50);
	fill(221, 161, 119);
	ellipse((width / 2), (height / 2) + 40, 50);

	//smile
	fill(0);
	rect((width / 2) - ((width / 10) / 2), (height / 2) + 100, (width / 10), 3);


 
}

LO: My Inspiration

One “creative technologies” project that really stands out to me is the Gravity Harps installation. The piece was commissioned by Icelandic musician Björk’s Biophilia tour, who wanted custom instruments for her studio album, requesting the help of Robot Music inventor Andy Cavatorta (who partnered with Pattern Studios for the electronics of the piece). The collaborative project involved mechanics, sound engineers, designers, and musicians and took one year to complete. The piece involves 11 harp strings attached to mechanical pendulums that use python code to formulate specific melodies that are played in succession of each swinging harp.

What I especially appreciate about this piece is how natural the integration with technology and music was undertaken. It’s always a risk to “overcompute” a creative practice within these types of projects, which undermine the beauty of arts based performances. However, the project reimagines how a traditional instrument can be computed in a way that makes one still appreciate the creative elements in its practice – e.g rhythm, timing, notes, etc. In context of the musician’s tour biophilia (which refers to humans’ tendency to seek connection with nature), the piece makes use of “natural” elements like physics and motion to create music. This project suggests ways to compute more instruments, possibly creating a machine based orchestra.

Source #1: Inventing Björk’s Gravity Harp, The New Yorker
Andrew Marantz

https://www.pattenstudio.com/works/gravity-harps/