Author: smudged bison

Project 04 – String Art

In making this I was inspired by the motion artist / music producer Dedouze.

sketch
//First line art
var dx1;
var dy1;
var dx2;
var dy2;

//Second line art
var dx3;
var dy3;
var dx4;
var dy4;

//Third line art
var dx5;
var dy5;
var dx6;
var dy6;

//Fourth line art
var dx8;
var dy8;
var dx9;
var dy9;

var numLines = 50;
var numLines2 = 20;
var numLines3 = 60;
var numLines4 = 40;
function setup() {
    createCanvas(400, 300);
    background(100, 105, 200);

    //First line art placement
    line(0, 0, 0, 300);
    line(0, 300, 350, 300);

    //Second line art placement
    line(0, 300, 150 ,300);
    line(400, 300, 400, 240);

    //Third line art placement
    line(0, 300, 400, 300);
    line(400, 300, 400, -100);

    //Fourth line art placement
    line(-50, 0, 0, 400);
    line(450, 40, 400, -400);

    //First line art deltas
    dx1 = (0 - 0)/numLines;
    dy1 = (300 - 0)/numLines;
    dx2 = (350 - 0)/numLines;
    dy2 = (300 - 300)/numLines;

    //Second line art deltas
    dx3 = (150 - 0)/numLines2;
    dy3 = (300 - 300)/numLines2;
    dx4 = (400 - 400)/numLines2;
    dy4 = (240 - 300)/numLines2;

    //Third line art deltas
    dx5 = (400 - 0)/numLines3;
    dy5 = (300 - 300)/numLines3;
    dx6 = (400 - 400)/numLines3;
    dy6 = (-100 - 300)/numLines3;

    //Fourth line art deltas
    dx7 = (0 - -50)/numLines4;
    dy7 = (400 - 0)/numLines4;
    dx8 = (400 - 450)/numLines4;
    dy8 = (-400 - 40)/numLines4;

}

function draw() {
    var x1 = 0;
    var y1 = 0;
    var x2 = 0;
    var y2 = 300;

    var x3 = 0;
    var y3 = 300;
    var x4 = 400;
    var y4 = 300;

    var x5 = 0;
    var y5 = 300;
    var x6 = 400;
    var y6 = 300;

    var x7 = -50;
    var y7 = 0;
    var x8 = 450;
    var y8 = 400;


    stroke(245, 255, 184);
    for (var i = 0; i <= numLines4; i += 1) {
        line(x7, y7, x8, y8);
        x7 += dx7;
        y7 += dy7;
        x8 += dx8;
        y8 += dy8;
    }

    stroke(254, 189, 255);
    for (var i = 0; i <= numLines3; i += 1) {
        line(x5, y5, x6, y6);
        x5 += dx5;
        y5 += dy5;
        x6 += dx6;
        y6 += dy6;
    }
    stroke(191, 255, 251);
    for (var i = 0; i <= numLines; i += 1) {
        line(x1, y1, x2, y2);
        x1 += dx1;
        y1 += dy1;
        x2 += dx2;
        y2 += dy2;
    }

    for (var i = 0; i <= numLines2; i += 1) {
        line(x3, y3, x4, y4);
        x3 += dx3;
        y3 += dy3;
        x4 += dx4;
        y4 += dy4;
    }
    noLoop();
}

LO – Sound Art

“Weather Thingy”, the invention by Adrien Kaeser uses real-time climate data to produce sound. The two main components are a weather station mounted on a tripod microphone, and a custom-built controller connected to the weather station. The controller will use variations on the weather, and the user’s input, to constrain or amplify values to produce different sounds on Kaeser’s keyboard. I am interested as to how this technology/application can be taken further. It would be interesting to see how this could be used long-term and produce music based on weekly or yearly weather.

Project 03 – Dynamic Drawing

sketch
var squares = [];

function setup() {
    createCanvas(600, 450);
    for (var x = -280; x < 1000; x += 40) {
    	for (var y = -320; y < 1000; y += 40) {
    		squares.push(new Rect(x, y, 20, 20));
    	}
    }

}

function draw() {
    translate(300, 225);
	background(56, 63, 81);
	for (var y = 0; y < squares.length; y++) {
		squares[y].show();
	}
}


var Rect = class {
    constructor(pX, pY, w, h) {
        this.pX = pX;
        this.pY = pY;
        this.w = w;
        this.h = h;
    }

    show() {
        rectMode(CENTER);
        noStroke();
        var scale = Math.pow(mouseX - this.pX - 300, 2) + Math.pow(mouseY - this.pY - 225, 2);
        scale = min(40*225/scale, 1);
        fill(200*scale, 120/scale, 150*scale);
        rotate(scale/100);
        rect(this.pX, this.pY, this.w * scale, this.h * scale);
    }
}

LO 3 – Computational Fabrication

The project I am looking at is Meshu, a company that uses computational fabrication to create and sell products. They make jewelry that connects locations to make a pendant out of various shapes. I think this project is a unique way of connecting people to locations, that is more than a map. I am not sure what algorithms are used, but it seems like they are just connecting “points” which represent cities on a map. Since the purpose of this project is to create pieces of art for other people, there is not a lot of room for the artist to add their own artistic sensibilities.

Link: https://meshu.io/

Procedural Lantern

Akari Lanterns

Robert Hodgin is a generative artist who creates both 2D data visualizations and immersive 3D terrains in Houdini. One project that showcases his talents in a unique way is his procedurally generated Akari Lanterns. In wanting to get better at procedural modeling, Hodgin created an algorithm in Houdini that created the geometry, mesh, and hardware for each lantern. As a product designer, I am fascinated by different methods to create form. I have only dabbled in virtual 3D form, but after seeing this project, I would love to explore the world of procedural modeling. This does not seem to use any “traditional” method of programming, but I know that he used a node/module based system to create the algorithm to make the polygons. Robert Hodgin received a degree in ceramics from RISD, and it is apparent that he values the form of objects.

Project 1 – Self Portrait

This is my self portrait

Portrait
function setup() {
    createCanvas(300, 300);
    background(81, 170, 223);
    
}

function draw() {
	noStroke();
	//sky
	//fill(255, 255, 255);
	//circle(30, 40, 30);
	//rect(30, 25, 80, 30);
	//circle(110, 40, 30);
	//circle(80, 20, 30);
	//rect(80, 5, 80, 30);
	//circle(160, 20, 30);
	//circle(200, 30, 30);
	//rect(200, 15, 80, 30);
	//circle(280, 30, 30);
	//Ear
	//80 Down
	fill(244, 195, 162);
	ellipse(200, 140, 10, 20);
	//Head
	//80 Down
	rect(100, 80, 100, 120);
	//Neck
	//200 Down
	rect(140, 200, 20, 60);
	//Body
	//260 Down
	fill(79, 106, 230);
	rect(90, 260, 120, 40);
	//Top of Hair
	fill(247, 227, 131);
	rect(100, 80, 100, 20);
	//Left Side of Hair
	rect(100, 100, 10, 20);
	//Right Side of Hair
	rect(190, 100, 10, 20);
	//Right Eye
	fill(255, 255, 255);
	ellipse(115, 145, 20);
	//Left Eye
	ellipse(175, 145, 20);
	//Eyes Cont.
	fill(0, 0, 0);
	ellipse(112, 145, 10);
	ellipse(172, 145, 10);
	//Nose
	fill(200, 140, 120);
	triangle(140, 150, 145, 170, 135, 170);
	//mouth
	rect(110, 180, 30, 15);


}

LO 1 – My Inspiration

Generative Portrait by Sergio Albiac

Before taking this course, I did not come across, at least to my knowledge, a lot of computational art. One area of computational art that I have heard of is generative portraits. These pieces of art use an algorithm to create graphic elements that as a whole, represent a portrait. Since I did not know of a specific artist or project that focused on this form of art before this course, I found one artist to speak about. Sergio Albiac, a generative artist, made a project where he used images taken by the Hubble space telescope and created generative portraits by placing a series of circles on top of them. I am not sure how long it took to create the algorithm that made the images, but I know that the project ran from June 2013 to March 2014. During this time, he allowed participants to submit images that would eventually be turned into portraits (he made 15,000 portraits over the course of these ten months). I don’t know the exact software that this artist used, but they did not mention any custom software/scripts, so I imagine it was “off-the-shelf”. A large purpose of this project was to allow for the creation of art in a fast manner. It was not a matter of quantity over quality, but Sergio Albiac felt as though there are pieces of work that are not created due to a limitation of resources of all kinds, and that the ability to create for the sake of an exploration of potential creations was the driving force behind this project. With this at the core of why Sergio creates, I think that this creates a great opportunity for exploration to create what may not have been made.

Link to project:
https://www.sergioalbiac.com/wall/stardust.html