sketch

// CJ Walsh
// cjwalsh@andrew.cmu.edu
// Section D
// Final Project

// creating variables for turtles
var trl;
var trl2;
var trl3;
var trl4;
var trl5;

function setup() {
 createCanvas(600, 600);
 frameRate(4); // giving a speed to the movement of the lines
 
}

function draw() {
	background(0);

	
	// drawing the three lines and looping them 
	for (var y = 20; y < height + 10; y += 50) {
		for (var x = 10; x < width + 10; x += 50) {

			
			trl = makeTurtle(x, y -5);
			trl.setColor('red');
			trl.forward(random(2, 15)); // random lengths to create texture
			trl.penUp(); // pulling pen up to move without mark making 
			trl.forward(10);
			trl.penDown();
			trl.forward(random(4, 10));

			
			trl2 = makeTurtle(x, y);
			trl2.setColor('red');
			trl2.forward(random(2, 20));
			trl2.penUp();
			trl2.forward(10);
			trl2.penDown();
			trl2.forward(random(4, 10));

			trl3 = makeTurtle(x, y + 5);
			trl3.setColor('red');
			trl3.forward(random(2, 20));
			trl3.penUp();
			trl3.forward(10);
			trl3.penDown();
			trl3.forward(random(4, 10));


			
		}
	}
	
	//noLoop();

}

function turtleLeft(d){this.angle-=d;}function turtleRight(d){this.angle+=d;}
function turtleForward(p){var rad=radians(this.angle);var newx=this.x+cos(rad)*p;
var newy=this.y+sin(rad)*p;this.goto(newx,newy);}function turtleBack(p){
this.forward(-p);}function turtlePenDown(){this.penIsDown=true;}
function turtlePenUp(){this.penIsDown = false;}function turtleGoTo(x,y){
if(this.penIsDown){stroke(this.color);strokeWeight(this.weight);
line(this.x,this.y,x,y);}this.x = x;this.y = y;}function turtleDistTo(x,y){
return sqrt(sq(this.x-x)+sq(this.y-y));}function turtleAngleTo(x,y){
var absAngle=degrees(atan2(y-this.y,x-this.x));
var angle=((absAngle-this.angle)+360)%360.0;return angle;}
function turtleTurnToward(x,y,d){var angle = this.angleTo(x,y);if(angle< 180){
this.angle+=d;}else{this.angle-=d;}}function turtleSetColor(c){this.color=c;}
function turtleSetWeight(w){this.weight=w;}function turtleFace(angle){
this.angle = angle;}function makeTurtle(tx,ty){var turtle={x:tx,y:ty,
angle:0.0,penIsDown:true,color:color(128),weight:1,left:turtleLeft,
right:turtleRight,forward:turtleForward, back:turtleBack,penDown:turtlePenDown,
penUp:turtlePenUp,goto:turtleGoTo, angleto:turtleAngleTo,
turnToward:turtleTurnToward,distanceTo:turtleDistTo, angleTo:turtleAngleTo,
setColor:turtleSetColor, setWeight:turtleSetWeight,face:turtleFace};
return turtle;}

For my project I wanted to create a series of generated textiles using loops and turtles. Each piece is an experiment with shape, repetition, color, placement and movement. Three are static pieces and three have movement. I really enjoyed creating each one, and they range in work time and difficulty of production. Even though some of them seem simple, each is carefully considered and planned out to get the effect that I wanted. Textile #6 is one of my favorites because it is a version of a precedent project that I wrote about in a Looking Outwards post. In my randomness post, I really enjoyed Georg Nees piece so #6 is my own version using randomness and movement to create a fun generative sketch. Overall I am happy with the outcome and look forward to using what I learned in this class to continue to generate fun imagery. A zip file is attached below containing all of the code for the 6 images.

Final Project

sketch

// CJ Walsh
// cjwalsh@andrew.cmu.edu
// Section D
// Final Project

var trl; // variable for turtle

function setup() {
    createCanvas(600, 600);
    
    frameRate(8);
    
}

function draw() {
	background(220);

	//grid of turtles
	for (var y = 10; y < height + 10; y += 50) {
		for (var x = 10; x < width + 10; x += 50) {
			trl = makeTurtle(x, y); // make turtle

			// random generate to create fun sketch movement quality
			trl.right(random(2, 60));
			trl.forward(random(4, 16));
			trl.left(random(20, 120));
			trl.forward(random(4, 10));
			trl.right(random(60, 145));
			trl.forward(10);
			trl.right(random(40, 227));
			trl.forward(random(5, 15));
			
		}
	}
	
	


}

function turtleLeft(d){this.angle-=d;}function turtleRight(d){this.angle+=d;}
function turtleForward(p){var rad=radians(this.angle);var newx=this.x+cos(rad)*p;
var newy=this.y+sin(rad)*p;this.goto(newx,newy);}function turtleBack(p){
this.forward(-p);}function turtlePenDown(){this.penIsDown=true;}
function turtlePenUp(){this.penIsDown = false;}function turtleGoTo(x,y){
if(this.penIsDown){stroke(this.color);strokeWeight(this.weight);
line(this.x,this.y,x,y);}this.x = x;this.y = y;}function turtleDistTo(x,y){
return sqrt(sq(this.x-x)+sq(this.y-y));}function turtleAngleTo(x,y){
var absAngle=degrees(atan2(y-this.y,x-this.x));
var angle=((absAngle-this.angle)+360)%360.0;return angle;}
function turtleTurnToward(x,y,d){var angle = this.angleTo(x,y);if(angle< 180){
this.angle+=d;}else{this.angle-=d;}}function turtleSetColor(c){this.color=c;}
function turtleSetWeight(w){this.weight=w;}function turtleFace(angle){
this.angle = angle;}function makeTurtle(tx,ty){var turtle={x:tx,y:ty,
angle:0.0,penIsDown:true,color:color(128),weight:1,left:turtleLeft,
right:turtleRight,forward:turtleForward, back:turtleBack,penDown:turtlePenDown,
penUp:turtlePenUp,goto:turtleGoTo, angleto:turtleAngleTo,
turnToward:turtleTurnToward,distanceTo:turtleDistTo, angleTo:turtleAngleTo,
setColor:turtleSetColor, setWeight:turtleSetWeight,face:turtleFace};
return turtle;}

Included below are some process shots of playing with color and pattern:

The two artists I have chosen to highlight for this Looking Outwards are Roz Dimon and Claudia Hart. Both are digital artists with work mainly in the areas of computation and graphic design. I found that their work relates well to the pieces that I want to create through a series of programs in my final project, which will explore collage, prints, and patterns.

I found the collage element of this project to be really intriguing. Dimon takes imagery from archive collections and uses custom programming to develop digital collaged elements that tell the story of the collections she has pulled from. In addition to being visual, these pieces also have audio and motion elements. I think as a standalone image and with the full experience the project is powerful and really fun.

Dimon’s work: https://www.rozdimon.com/

I thought this project was also very close to my goals for the final project. I really enjoy the combination of images and textures to create really dynamic prints. The other fun thing about this project was that it utilized augmented reality to create a user experience of viewing the wallpapers. As, with Dimon’s work, I really appreciate the fact that this project is a visual product and an experience.

Hart’s Work: https://claudiahart.com/

Overall I feel really inspired by these two pieces because of the extended element of designing an experience. It makes me consider what I could do with the programs that I generate to make them into more of an experienced piece of artwork. Both artists have a very distinct style and method, but at the heart the are both combining imagery and objects to create unique visual patterns and compositions.

For my final project I want to create a series of generative textile prints that could be used for different mediums, such as fabric, lasercut materials, or printmaking practices. One of my favorite projects from this past semester was creating my wallpaper design, so my plan is to expand upon those methods and use new skills I have learned to create fun and interesting patterns and prints. Using primarily loops and turtles, I want to experiment with color, shape, repetition, and other visual characteristics. I think it would also be fun to tie in the climate issue, either by using imagery or text and using that in the images/compositions that I make. I am also considering playing around with loaded images to collage together programmed and photographic elements. Overall, I am looking to have fun with creating images generated by the programming skills and practices that I have learned this semester.

sketch

// CJ Walsh 
// Section D
// cjwalsh@andrew.cmu.edu
// Project 11 


// establishing variables for movement of environment 
var oceanFloor = 0.002;
var oceanFloorSpeed = 0.0001;

var surface = 0.0008;
var surfaceSpeed = 0.0006;

var seaweed = 1;
var seaweedSpeed = 0.0005;

var coral = 0.06;
var coralSpeed = 0.0003;

var fish = [];
var fishNum = 20;


function setup() {
    createCanvas(480, 480);
    background(220);
    for (i=0; i<fishNum; i++) {
        f = makeFish(width+random(10, 100));
        fish.push(f);
    }

}

function draw() {
	background('#A5F9F5');
	drawNoise();
    drawFishy();
    updateFish();

}
// remove old fish and add new fish 
function updateFish() {
    keepFish = [];
    for (i=0; i<fishNum; i++) {
        f = fish[i];
        if (f.x > 0-f.bodyW) {
            keepFish.push(f);
        }
        else {
            keepFish.push(makeFish(width+50));
        }
    }
    fish = keepFish;
}

// draw the fish
function drawFishy() {
    for (i=0; i<fishNum; i++) {
        fish[i].move();
        fish[i].display();
    }
}
// drawing environment 
function drawNoise() {


	// Surface
	beginShape(); 
    fill('#516FCE');
    noStroke();
    vertex(0, height);

    
    for (var x = 0; x < width; x++) {
        var t = (x * surface) + (millis() * surfaceSpeed);
        var y = map(noise(t * 0.5), 0, 1, 0, 100);
        vertex(x, y); 
    }
    vertex(width, height);
    endShape();

    // coral
    beginShape(); 
    fill('#425689');
    noStroke();
    vertex(0, height);

    for (var x = 0; x < width; x++) {
        var t = (x * coral) + (millis() * coralSpeed);
        var y = map(noise(t * 0.5), 0, 1, 250, 300);
        vertex(x, y); 
    }
    vertex(width, height);
    endShape();

    // Seaweed
	beginShape(); 
    fill('#3E7C6A');
    noStroke();
    vertex(0, height);

    for (var x = 0; x < width; x++) {
        var t = (x * seaweed) + (millis() * seaweedSpeed);
        var y = map(noise(t * 0.5), 0, 1, 250, 480);
        vertex(x, y); 
    }
    vertex(width, height);
    endShape();

    
    // ocean floor
	beginShape(); 
    fill('#E5D9A8');
    noStroke();
    vertex(0, height);
    
    for (var x = 0; x < width; x++) {
        var t = (x * oceanFloor) + (millis() * oceanFloorSpeed);
        var y = map(noise(t * 0.5), 0, 1, 350, 480);
        vertex(x, y); 
    }
    vertex(width, height);
    endShape();

}
// creating an object for the fish 
function makeFish(fishlx) {
    var fsh = {x: fishlx, 
               y: random(height-350, height-50),
               bodyW: random(30, 50),
               bodyH: random(15, 40),
               speed: random(-2, -0.5),
               tail: random(15, 20),
               fColor: [random(0,255), random(0,255), random(0,255)],
               move: fishMove,
               display: fishDisplay
           }
        return fsh;
}

// displaying the fish
function fishDisplay() {
    fill(this.fColor);
    noStroke();
    tx = this.x + this.bodyW/3;
    // drawing fish tail
    triangle(tx, this.y, tx+this.tail, this.y+this.tail/2, 
        tx+this.tail, this.y-this.tail/2);
    // drawing fish body
    ellipse(this.x, this.y, this.bodyW, this.bodyH);
    // drawing fish eye
    fill(0);
    ellipse(this.x-this.bodyW/4, this.y-this.bodyH/4, 4, 4);
}

// moving the fish across canvas 
function fishMove() {
    this.x += this.speed;
}

This project was super fun to make. The idea I started out with was wanting to create an underwater scene with fish and seaweed. Using noise, I was able to create the forms for the waterline, the ocean floor, seaweed and a coral/sea mountain background. After playing with the amount of noise and speed, I was able to create really cool movements with both the water and the seaweed. The surface looks like it undulates in waves like the ocean and the seaweed has a fun flowing motion. I then created the fish and randomized their size and color to create some fun forms. Im really happy with how it came together.

The person I have chosen to focus on this week is Jenny Sabin, an experimental architect with her own studio based in Ithaca, NY. While I found many of her projects to be super interesting, I wanted to focus on the myThread Pavilion, which was designed for Nike. I was drawn to this project by the video above, which goes into detail about the creative process and research conducted that lead to the final form. Through a series of creative workshops, her team wanted to make connections between physical activity and architecture. Using data from a workshop focused on exercise and movement, Sabin created personalized algorithms that translated the data into methods of weaving and creating pattern. These developed patterns and methods were then created at a large scale for the pavilion structure.

I think it is a really compelling project because of all the elements that went into creating it. It combines a mixture of branding, creative workshopping, computation, data physicalization and environments/architectural design. I am really inspired by both the creative process and the physical itself.

Link: http://www.jennysabin.com/mythread-pavilion

Jenny Sabin is considered to be at the forefront of innovation in architecture in the 21st century. Her practice often focuses on the intersection of architecture and science, pulling information from biology and mathematics to inform the structural possibilities of material. In addition to working at her firm, she is also a professor of architecture at Cornell.

Her education path is pretty interesting. She completed her undergrad at the University of Washington, getting degrees in ceramics and interdisciplinary visual art. She then went on to get her masters of architecture from the University of Pennsylvania. I think that its really interesting that she didnt begin studying architecture as an undergrad. She discovered this path after already starting a different one and has become very successful with a line of work she was really passionate about.

Overall, I find her practice and work to be super exciting and it is cool to see a blend of so many different mediums, styles and elements. Her work really reflects the pathways she has taken in order to create really amazing spaces.

For this week’s Looking Outwards I decided to focus on Imogen Heap, a British singer-songwriter and audio engineer. I really admire her work as an artist because she has taken her musical vision beyond just creating music but has experimented with new ways in which to create. One of the projects she is best known for is the Mi Mu gloves, which use mapping technology to transfer the movement of the hands into musical compositions. In the video above, Heap explains many of the different uses for the gloves and the different movements that create changes in pitch, filter of the sound, and many other elements. I find the product to be really interesting and it adds a really cool dynamic to the way an artist can perform on stage. Heap has talked a lot about the fact that she hated having to have so much equipment on stage in order to create the kind of music she wanted to perform. The gloves give her the ability to not be locked down in a location and create a music experience that envelops both sound and movement.

While I dont know too much about the details of the programming, the gloves use a network of bendable sensors that track the movement of the hand and fingers. This in addition to create an invisible map of the users space allows the software to recognize shifts in motion and attribute those to different music elements and sound qualities.

Overall I just find this to be a really intriguing project. I think that Heap’s vision toward the future of music and performance is really interesting because I dont think its something we see from a lot of musical artists. This enables the user to create a wide variety of new musical experiences and its really interesting to see how work like this will develop into the future.

Website: https://mimugloves.com

sketch

// CJ Walsh 
// Section D
// cjwalsh@andrew.cmu.edu
// Project 09

var baseI;
// loading the image into my code
function preload() {
    var myImageURL = "https://i.imgur.com/ItvWF6f.jpg";
    baseI = loadImage(myImageURL);
}
function setup() {
	createCanvas(360, 480);
 	background(0);
    baseI.loadPixels();
    frameRate(15); // speed at which the pixels appear
}

function draw() {
	// setting up conditions for pixels to appear
    var px = random(width);
    var py = random(height);
    var ix = constrain(floor(px), 0, width-1);
    var iy = constrain(floor(py), 0, height-1);
    var baseColor = baseI.get(ix, iy);
    // drawing ellipses and rectangles to respresent the pixels of the image 
    noStroke();
    fill(baseColor);
    ellipse(px, py, random(0, 15), random(0, 15));
    rect(px, py, random(0, 15), random(0, 15));

}

While this was a pretty simple and straightforward project, it was fun to experiment with the different ways to present the color of the image through other shapes and forms. Ultimately I decided to go with both rectangles and ellipses because I liked the combination of the curved and angular forms in the images by code created. It was interesting to see the image build itself and lead up to looking closer to the base image. Overall, a fun project!

After looking through the reflections of several other students, I found a post from Julia Nishizaki that she wrote for the Week 6 Looking Outwards on randomness. It was the series of images that she included that really attracted me to wanting to learn more about this project.

The project is called Windwalks, created by British artist Tim Knowles. A lot of his work is focused on movement and creating images through the movement of forms and objects that he can not control. This project utilizes the movement of the wind to create line drawings. Participants in the project are made to wear helmets with large arrows affixed to them. As the participant moves, the arrow is pushed by the wind, and the direction of the arrow determines where they will move next. Knowles collects data from the helmet about the path that the wearer took and uses that to create drawings.

I appreciate that Julia mentions that the project is not directly related to computation, but it definitely has to do with random image generation. The path that the wind creates cannot be expected. But it is not just the wind that is random. The wind then informs random movement of the wearers and then informs a randomly generated line drawing. I find the different layers of this project to be super intriguing. The other element that I really enjoy about the project is that we often dont think about the winds affect in our daily movement (except when its super strong…then people notice). But generally, the movement of the wind doesnt usually determine our pathways through an environment, so it is interesting to see the wind being the controlling force in this instance. I also really appreciate the line drawings. You can see the map like qualities in them, but they are also simple line forms that draw attention.

One point of Julia’s that I thought was very interesting was pointing out the ways that the line drawings suggest the environment that the walks take place in. The buildings and other structures inform the movement of the wind and therefore also determine the map that is translated for the drawings.

Overall I found this project super intriguing and Im glad I was able to find something really interesting by looking through someone else’s reflections. Im really interested in learning more about this artist and his other work.

The artist that I chose to focus on this week is Meow Wolf, which is an artist collective, not just a singular artist. With over 400 employees with skills in a variety of media, Meow Wolf is known for creating immersive and interactive artistic experiences. I have heard of their work before in other classes, but had never done much research into what the collective actually is. I was intrigued to choose them for this assignment because the work that they do is what I hope to do in my design career and they are an organization that I would dream to work for.

The talk from Eyeo 2019 features two collaborators of Meow Wolf that have been working with the collective from the early days. I appreciate the talk because it’s not just about what they made, but how and why they make it. Their message is really about informing the audience about how a collective exists and operates. It was really interesting to learn about the way that the group progressed through the difficulty of establishing themselves as a productive artist group. I think a strong aspect of their presentation was including progress videos showing how the work and team was structured. It’s a fun and informative way to have more visuals than just photos and diagrams.

The group is known mainly for their project the House of Eternal Return, which is a large immersive experience in Sante Fe. The space that they occupy was bought for them by George R.R. Martin, and he then leased it to them to begin the installation. The visitor enters the space and the experience begins on the lawn of a Victorian house. The house looks normal, until the audience begins to explore and finds portals into other worlds. The artists wanted to create a space where the multiverse is present, somewhere where different dimensions are crashing into each other. Meow Wolf is beginning the process to install these spaces in other cities.

I think that Meow Wolf is an amazing group that is doing extraordinary work that I would very much want to be a part of. I chose to focus on them because their artistic interests really align with me own, and I think the talk they gave spoke a lot to the strides they have made to create a supportive and productive artist collective.

sketch

// CJ Walsh 
// Section D
// cjwalsh@andrew.cmu.edu
// Project 07
 
function setup() {
    createCanvas(480, 480);
    cx = width/2;
    cy = height/2;
    // list of colors for my larger lines 
    c1 = ['green', 'teal', 'cornflowerblue', 'royalblue', 'darkslateblue', 'navy'];
}
 
 
function draw() {
    background("lightcyan");
    h = cx;
    w = cy;
    s = PI/8;
    noFill();
    mx = constrain(mouseX, 0, cx);
    my = constrain(mouseY, 0, cy);
    // loop to establish all of the curves I draw 
    for (i = 0; i <= 2*PI; i+=s) {
        // thin orchid lines
         for (k = 0; k < 5; k++) {
            push();
                strokeWeight(1);
                stroke('orchid');
                translate(cx, cy);
                rotate(i);
                ellipse(mx - 30 - 10*k, my - 30 - 10*k, 120, 120);
            pop();
        }
        // larger blue/green lines
        for (j = 0; j < 12; j++) {
            push();
                strokeWeight(3);
                stroke(c1[j%6]);
                translate(cx, cy);
                rotate(i);
                ellipse(mx + 4*j, my + 4*j, 3*mouseX/2, 3*mouseY/2);
            pop();
        }
        // small black dots
        for (l = 0; l < 30; l++) {
            push();
                strokeWeight(2);
                stroke('black');
                translate(cx, cy);
                rotate(i);
                ellipse(mx - 60*l, my - 60*l, 5, 5);
            pop();
        }

    }    
}
 

This was a super fun project to make in terms of experimenting with curves and loops. I started out by setting up an initial for loop and just drawing one curve. From there, I established some more loops to duplicate lines, or played around with some of the numbers so that I could create different shapes. This is another project that I could definitely see myself playing with or changing in the future because it was so fun to make. Below I included some of my favorite screenshots of the composition as it moves around.