Graham Murtha
Section A
For this project I wanted to make a boat move through a fiery landscape, like the final world in Mario or Mustafar from Star Wars. I made moving embers, meteors, and randomly generated spires in the background to illustrate this volcanic landscape.
//Graham Murtha
//Section A
//gmurtha@andrew.cmu.edu
//Project 11- moving landscape
// A fire Nation boat sails through Mustafar AND world 8 of Mario - so many universes in one!
var embers = [];
var spire = [];
var meteors = [];
var ship; // fire nation ship from Avatar lol- it seemed to fit the color scheme, and is steam powered
function preload(){ // input boat image
ship = loadImage("https://i.imgur.com/v5MzkRY.png");
}
function setup() {
createCanvas(450, 300);
frameRate(10);
//initial embers in the sky
for(var i = 0; i < 6; i++){
var sx = random(width);
embers[i] = makeEmber(sx);
}//initial spires
for(var i = 0; i < 10; i++){
var sx = random(width);
spire[i] = makeSpire(sx);
}
//random meteors
for(var i = 0; i < 1; i++){
var sx = random(width);
meteors[i] = makeMeteors(sx);
}
}
function draw() {
//fiery sky
background(200, 100, 0); //mid-tone neutral orange
// generates sequence of random embers slowly panning left
updateAndDisplayEmber();
removeEmberOutOfView();
addNewEmber();
// generates sequence of random meteors quickly panning left
updateAndDisplayMeteors();
removeMeteorsOutOfView();
addNewMeteors();
// generates sequence of random spires quickly panning left
updateAndDisplaySpire();
removeSpireOutOfView();
addNewSpire();
//water
fill(120,70,30); // darker orange- reflects sky a bit
noStroke();
rect(0, 230, 500, 75);
//ship stays stagnant, but as its surroundings move left it seems to move right
image(ship, width/2 - 200, 180, 200, 100);
}
//Ember object
function makeEmber(emberLocationX){
var ember = {x : emberLocationX,
y : random(0, 170),
emberScale : random(0.5, 2.5),
speed : -1,
move : moveEmber,
display : displayEmber}
return ember;
}
function displayEmber(){
push();
translate(this.x, this.y);
fill('gold');
noStroke();
scale(this.emberScale);
ellipse(0,0,5,5);
pop();
}
//recoordinates ember positions and display
function updateAndDisplayEmber(){
for(var i = 0; i < embers.length; i++){
embers[i].move();
embers[i].display();
}
}
function addNewEmber(){
var newEmberProbability = 0.01; // controls scarcity of embers in background
if (random(0, 1) < newEmberProbability){
embers.push(makeEmber(width));
}
}
function removeEmberOutOfView (){
//if ember dissappears on the left, remove it from the array
var embersToKeep = [];
for (var i = 0; i < embers.length; i++){
if (embers[i].x + 50 > 0) {
embersToKeep.push(embers[i]);
}
}
//embers left
embers = embersToKeep;
}
function moveEmber(){
this.x += this.speed;
}
//Spire object
function makeSpire(spireLocationX){
var spire = {xt : spireLocationX,
yt : 240,
spireScale : random(0.1, 0.5),
spireColor : color(random(20,80),0, 0),
speedT : -6,
moveT : moveSpire,
displayT : displaySpire}
return spire;
}
function displaySpire(){
push();
translate(this.xt + 60, this.yt); //add 60 so transitions onto screen
noStroke();
scale(this.spireScale);
//Spire defining shape
noStroke();
fill(this.spireColor);
beginShape();
vertex(-80,-10);
vertex(80,-10);
vertex(10,-200);
vertex(40,-250);
vertex(0,-300);
vertex(-40,-250);
vertex(-10,-200);
endShape();
pop();
}
//update spire positions and display
function updateAndDisplaySpire(){
for(var i = 0; i < spire.length; i++){
spire[i].moveT();
spire[i].displayT();
}
}
function addNewSpire(){
var newSpireProbability = 0.04; // controls scarcity of rock spires
if (random(0, 1) < newSpireProbability){
spire.push(makeSpire(width));
}
}
function removeSpireOutOfView (){
//if ember dissappears on the left, remove it from the array
var spireToKeep = [];
for (var i = 0; i < spire.length; i++){
if (spire[i].xt + 100 > 0) {
spireToKeep.push(spire[i]);
}
}
//spires left
spire = spireToKeep;
}
function moveSpire(){
this.xt += this.speedT;
}
//meteors object
function makeMeteors(locationX){
var meteors = {xs : locationX,
ys : random(75, 125),
meteorsScale : random(0.5, 3),
speedS : -13,
moveS : moveMeteors,
displayS : displayMeteors}
return meteors;
}
function displayMeteors(){
push();
translate(this.xs + 80, this.ys); //adds 80 transitions on screen
fill("gold");
noStroke();
scale(this.meteorScale);
//meteor
fill('orange');
triangle(0,6,0,-6,50,0)
fill(40,20,20)
ellipse(0,0,20,20);
fill('orange');
ellipse(1,2,3,3);
ellipse(3,6,3,3);
ellipse(-4,-6,3,3);
pop();
}
//update Spire positions and display
function updateAndDisplayMeteors(){
for(var i = 0; i < meteors.length; i++){
meteors[i].moveS();
meteors[i].displayS();
}
}
function addNewMeteors(){
var newMeteorsProbability = 0.01; // controls scarcity of meteors
if (random(0, 1) < newMeteorsProbability){
meteors.push(makeMeteors(width));
}
}
function removeMeteorsOutOfView (){
//if ember dissappears on the left, remove it from the array
var meteorsToKeep = [];
for (var i = 0; i < meteors.length; i++){
if (meteors[i].xs + 100 > 0) {
meteorsToKeep.push(meteors[i]);
}
}
//Spires left
meteors = meteorsToKeep;
}
function moveMeteors(){
this.xs += this.speedS;
}Graham Murtha
Section A
Sebastian Smee’s interpretation of Beeple’s piece “First 5000 Everydays” proves that opinion writers on the topic of art must not make any of their own, and only look at the “industry” through a commercial lense. Beeple, for those who don’t know, is a world-famous artist/graphic designer who is known to his fans as someone who invests 4-5 hours of everyday to make Cinema4D artwork. To everyone else, he is the artist who sold the largest NFT and 3rd most expensive artpiece in the world. Smee has an astonishingly agreigious, damning look on Beeple’s art, for two main reasons. His first objection is that because it is digital and non-tangible, it does not count as art. I guess this means that every movie Smee has ever seen is also not considered art either. His second point is that the sale of this piece only proves that Beeple is a succumbent to late stage capitalism, as if he is not paid heavily by the Washington Post to spite artists. What Smee’s point fails to acknowledge about this piece is that 5000 daily artworks equates to near 14 years. I think it is inspiring that an artist such as Beeple could love their craft enough to spend 13+ years of their life consistently investing a massive chunk of their time into an unpaid passion. It seems like poetry that Beeple, after almost 14 years, would finally be enabled by Metakovan (the buyer) to make this passion an occupation, a dream that millions of artists around the world have. “First 5000 Everydays” is certainly cause for discussion on what “Fine Art” is these days, or raises the question of how to categorize digital collage (Beeple’s medium). However, it is an outright ridiculous claim to denounce his work as art in any form, as an immense amount of skill, creativity, and determination go into Beeple’s 3D digital collage work.
Smee, Sebastian. “Perspective | Beeple’s Digital ‘Artwork’ Sold for More than Any Painting by Titian or Raphael. but as Art, It’s a Great Big Zero.” The Washington Post, WP Company, 17 Mar. 2021.
]]>Graham Murtha
Section A
I looked into the work of artist Toni Dove, an experimental filmmaker based in New York City. Her work challenges the idea of what the moving 2d image is through the synthesis of tactile experiences and reactive live performance. A project of hers that I find particularly interested was a recent installation at the Ringling exhibition, entitled “The Dress that Eats Souls”. The concept of this project was to create a massive, hollow, motion capture suit, and to allow people to control its movement. As the performer wore this mo-cap suit, they experienced what others may have seen while wearing the dress, over the course of 200 years (fictitious). I feel that projects such as these, which involve the audience member on such an intimate and personal level, are re-shaping the medium of cinema, and creating something completely new from the aggregate of different senses and actions. I additionally love her philosophy on what the dress means to the human body, as, in the mo-cap relationship, the looming suit starts to “colonize” your body as you merge with it.
Toni Dove, The Dress That Eats Souls, 2018.
]]>Graham Murtha
Section A
The designer I looked into this week was Lindsay Grace, an American artist who’s body of work focuses on exploring how games and interactive media shape the culture, education, and ethics of different communities. He was an esteemed professor at American University, and ran the “Gamelab” JOLT Studio there as well. He is from Miami, Florida, and, despite his many years in New York City, recently moved back to Miami to teach at University of Miami. He is also an award winning author. What I find fascinating about his body of work is how unique it is in the world of design academia, as I feel that “gaming” and “play” are bad words in that sphere. I’ve always had an issue with that fact, as games are one of the best ways to teach both children and adults alike. I have seen that, oftentimes, people my age remember more about the videogames they played in middle school, rather than the classes they took. Kids are automatically expecting to have fun while playing a game, and so if we integrate games with education, kids will automatically be more engaged in the topics. Professor Grace illustrates this through his discussion of gaming competition, and how it works as a catalyst for academic prowess and innovation.
Professor Lindsay Grace’s Website
Graham Murtha
Section A
For this project, I wanted to make a series of layered petal-like formations with linework, all with different reactions to mouseX and mouseY. However, the cardioid caused some trouble, since despite how many times I manipulated the equation, it remained an very slow-growing shape on the left of the screen.
//Graham Murtha
//Section A
//Assignment 7
//gmurtha@andrew.cmu.edu
var vertices = 150; // number of vertices or coordinates
function setup() {
createCanvas(480, 480);
background(0);
text("p5.js vers 0.9.0 test.", 10, 15);
}
function draw() {
push();
//moves origin to the center of the canvas
translate(width/2,height/2);
//draws loop for the three shapes
background(120,0,60);// dark magenta-red
Ranunculoid();
Cardioid();
Nephroid();
pop();
}
function Ranunculoid(){
//https://mathworld.wolfram.com/Ranunculoid.html
//variables
var x;
var y;
var a = mouseX/7
var b = mouseY/100
beginShape();
noFill();
stroke(255,180,255); //light purple
for(var i=0; i<vertices; i++){ // parametric equations
var Ag = map(i,0,vertices,0,TWO_PI); // angle/theta
x = a*((6*cos(Ag))-(b*cos(6*Ag)));
y = a*((6*sin(Ag))-(b*sin(6*Ag)));
vertex(x,y);
endShape(CLOSE);
}
}
function Cardioid(){
//https://mathworld.wolfram.com/Cardioid.html
//variables
var x;
var y;
var a = mouseX/4
var b = mouseY/30
beginShape();
noFill();
stroke(255,150,0);//orange
for(var i=0; i<vertices; i++){ // parametric equations
var Ag = map(i,0,vertices,0,PI+QUARTER_PI); // angle/theta
x = (a*cos(Ag)*(1-cos(Ag))*b);
y = (a*sin(Ag)*(1-cos(Ag))*b);
vertex(x,y);
endShape(CLOSE);
}
}
function Nephroid(){
// https://mathworld.wolfram.com/Nephroid.html
//variables
var x;
var y;
var a = mouseX/6
var b = mouseY/4
beginShape();
noFill();
stroke(255); // white
for(var i=0; i<vertices; i++){ // parametric equations
var Ag = map(i,0,vertices,0,PI); // angle/theta
x = a*(3*cos(Ag))-((cos(3*Ag))*b);
y = a*(3*sin(Ag))-((sin(3*Ag))*b);
vertex(x,y);
endShape(CLOSE);
}
}Graham Murtha
Section A
One of the most fascinating visually represented datasets is perhaps one of the largest single-website collections of information on the internet- OneZoom’s tree of life Explorer. This website graphically represents all of science’s current understanding of biology in the universe, starting from eubacteria, eukaryotes and biota. As you can imagine, there is a ridiculously expansive number of species included in this data set, and the tree emphasizes that by it’s scale- human beings and most familiar mammals happen to take up .001% of the tree’s entire figure, according to the resources’ “about” info. The more you zoom out from where we are in the tree of life, the more you come to realize how insignificant we are in the grand scheme of biology- our species is in no way special, despite the leaps and bounds we’ve come. Only a vectorized graphic such as this could convey such a shockingly accurate scale of life as we know it, and how puny humanity is to nature. The graphic conventions of the tree itself is also fascinating- each species is represented as a circular leaf on a tree, and the closer two species are in evolution, the closer their leaves are on their respective branch. The branches are represented as bending curves that spiral off of their larger parent, which emphasizes the connection between all living things, rather than just linear branches shooting off in their own direction.
It really is an incredible and informative dataset- I recommend everyone to explore it a little!
Graham Murtha
Section A
For this project, I wanted to document time with an apple tree/ deciduous tree. As the minute passes, the leaves change color from green to red, and at the end of each minute wilt off and blow away. As the hour passes, the ground that the tree is on grows more and more red as the leaves/apples fall to the ground. As the day passes, the background color (sky) gets darker and darker, until the last hour of the day, where it goes totally black. There is also a person under the tree trying to collect the falling foliage/apples.
// Graham Murtha
//Section A
//gmurtha@andrew.cmu.edu
//Project 06 Abstract Clock
// IF YOU STICK AROUND FOR A BIT THE LEAVES WILL WILT AND BLOW AWAY!!
var y = 0
function setup() {
createCanvas(420, 480);
background(200,200,255);
text("p5.js vers 0.9.0 test.", 10, 15);
angleMode(DEGREES);
}
function draw() {
//background color of sky// CHANGES THROUGHOUT THE DAY- DARKEST AT THE 24TH HOUR
var h = hour()
var sky = map(h,0,24,255,0)
background(50,100,sky);
// outline
stroke(200)
noFill();
strokeWeight(.5);
ellipse(width/2,height/2.75, 300);
// Tree trunk
noStroke();
fill(100,60,0)
rect((width/2)-10,height-100,20,-210)
triangle(width/2,height-130,(width/2)-20,height-100,(width/2)+20,height-100)
//GROUND COVER - CHANGES WITH EVERY HOUR- BECOMES MORE RED AS THE HOUR CONTINUES
var m = minute()
var g = map(m,0,60,0,255) // red for ground fill
fill(g,255-g,0);
rect(0,height-100,width,100);
//recentering origin to the middle of the tree circle
translate(width/2,height/2.75);
//APPLE PICKER
var s1 = second()
var p = map(s1,0,60,-100,100) // changing position under the tree
fill(10)
rect(p,150,20,40);
ellipse(p+10,140,20);
strokeWeight(3);
stroke(10);
line(p+2,190,p,210)
line(p+18,190,p+20,210)
line(p,150,p-12,170)
line(p+20,150,p+33,170);
//basket
strokeWeight(1);
fill(255,255,140);
rect(p-15,170,50,20);
// BRANCHES (STATIC)
stroke(100,60,0);
strokeWeight(6);
line(0,0,150,0);
line(100,0,150,-30);
line(100,0,150,30);
line(0,0,-150,0);
line(-100,0,-150,-30);
line(-100,0,-150,30);
push(); //top left quad
rotate(120);
line(0,0,150,0);
line(100,0,150,-30);
line(100,0,150,30);
pop();
push(); // top right quad
rotate(60);
line(0,0,150,0);
line(100,0,150,-30);
line(100,0,150,30);
pop();
push(); // bottom right quad
rotate(-60);
line(0,0,150,0);
line(100,0,150,-30);
line(100,0,150,30);
pop();
push(); // bottom left quad
rotate(240)
line(0,0,150,0);
line(100,0,150,-30);
line(100,0,150,30);
pop();
//APPLES
var s = second()
var rg = map(s,0,60,0,255) // changing color (red-green)
var x = 150
var r = .2 // fall rate
for (var i= 0 ; i < 30 ; i++) {
//base geometry for apples
rotate(15);
x -= r*sin(15);
noStroke();
fill(rg,255-rg,0);
ellipse(x,y,30,15);
ellipse(x-50,y,15,10);
// falling geometry for apples (wilting)
if(s>50 & s<60){
rotate(15);
noStroke();
fill(rg,255-rg,0);
ellipse(x,y,30,15);
ellipse(x-50,y,15,10);
x -= r*sin(15);
y+=r
}
}
}
Graham Murtha
Section A
The randomly generated computational art that I looked into this week is called the “Gallery of Randomly Generated Flames” by JWidlfire, an independent artist/blogger. This German artist uses T.I.N.A, a electronics design software by DesignSoft, to generate a series of randomly generated images that all include some depiction of a flame. The flames are generated through a series of random sin/cos waves, arrays, string art, and lighting effects, all with a black background. What I find particularly fascinating about this exhibition is the sequential nature of it, since we know that these 64 different images come from one identical code. The differences in each image are drastic, and yet at the sametime there is a strong visual acuity and pattern througout all 64 pieces. Even some of the flames that look almost biomorphic share commonalities with flames that appear gaseuous. By depicting all different variations in this series, JWildfire demonstrates to us how randomness can provide massive variety, while at the same time preserving certain biases or qualities.
Graham Murtha
Section A
For the wallpaper, I tried to recreate a typical celtic cross pattern, which is made of overlapping and interlocking loops and cusps.
// Graham Murtha
//Section A
//gmurtha@andrew.cmu.edu
//Project 05- CELTIC CROSS!!
var cell = 80; // cell size
function setup() {
createCanvas(500, 500);
}
function draw() {
background(0, 60, 20);
for (var y = -60; y < height +60; y += 80){
for (var x = -60; x < width +60; x += 80){
knot(x, y);
}
}
noLoop();
}
function knot(x, y){
push();
translate(x, y);
noFill()
// base circle outline
stroke(0);
strokeWeight(6);
ellipse(0,0,cell-5);
//base circle color fill
stroke(120,130,0);
strokeWeight(4);
ellipse(0,0,cell-3)
//center circle outline
stroke(0);
strokeWeight(6);
ellipse(0,0,cell/3)
//center circle color
stroke(120,130,0);
strokeWeight(2);
ellipse(0,0,cell/3)
// TINY center circle outline
stroke(0);
strokeWeight(4);
ellipse(0,0,cell/6)
// TINY center circle color
stroke(120,130,0);
strokeWeight(1);
ellipse(0,0,cell/6)
stroke(0)
strokeWeight(4)
//crossing leaf shape OUTLINES (rotated in all 4 quadrants)
beginShape();
curveVertex(0,0);
curveVertex(cell/4,cell/8);
curveVertex(cell/2,cell/2);
curveVertex(cell/2,cell/2);
curveVertex(cell/8,cell/4);
curveVertex(0,0);
endShape();
rotate(radians(90))
beginShape();
curveVertex(0,0);
curveVertex(cell/4,cell/8);
curveVertex(cell/2,cell/2);
curveVertex(cell/2,cell/2);
curveVertex(cell/8,cell/4);
curveVertex(0,0);
endShape();
rotate(radians(90))
beginShape();
curveVertex(0,0);
curveVertex(cell/4,cell/8);
curveVertex(cell/2,cell/2);
curveVertex(cell/2,cell/2);
curveVertex(cell/8,cell/4);
curveVertex(0,0);
endShape();
rotate(radians(90))
beginShape();
curveVertex(0,0);
curveVertex(cell/4,cell/8);
curveVertex(cell/2,cell/2);
curveVertex(cell/2,cell/2);
curveVertex(cell/8,cell/4);
curveVertex(0,0);
endShape();
stroke(120,130,0)
strokeWeight(2)
//crossing leaf shape FILLS (rotated in all 4 quadrants)
beginShape();
curveVertex(0,0);
curveVertex(cell/4,cell/8);
curveVertex(cell/2,cell/2);
curveVertex(cell/2,cell/2);
curveVertex(cell/8,cell/4);
curveVertex(0,0);
endShape();
rotate(radians(90))
beginShape();
curveVertex(0,0);
curveVertex(cell/4,cell/8);
curveVertex(cell/2,cell/2);
curveVertex(cell/2,cell/2);
curveVertex(cell/8,cell/4);
curveVertex(0,0);
endShape();
rotate(radians(90))
beginShape();
curveVertex(0,0);
curveVertex(cell/4,cell/8);
curveVertex(cell/2,cell/2);
curveVertex(cell/2,cell/2);
curveVertex(cell/8,cell/4);
curveVertex(0,0);
endShape();
rotate(radians(90))
beginShape();
curveVertex(0,0);
curveVertex(cell/4,cell/8);
curveVertex(cell/2,cell/2);
curveVertex(cell/2,cell/2);
curveVertex(cell/8,cell/4);
curveVertex(0,0);
endShape();
strokeWeight(5)
stroke(0);
// central lobe OUTLINE - wide ellipses
rotate(radians(45));
arc(0,0,cell*sqrt(2)/2,cell/2,radians(0),radians(180));
arc(0,0,cell*sqrt(2)/2,cell/2, radians(180),radians(0));
rotate(radians(90));
arc(0,0,cell*sqrt(2)/2,cell/2,radians(0),radians(180));
arc(0,0,cell*sqrt(2)/2,cell/2, radians(180),radians(0));
strokeWeight(3)
stroke(120,130,0);
// central lobe FILL- wide ellipses
rotate(radians(90));
arc(0,0,cell*sqrt(2)/2,cell/2,radians(0),radians(180));
arc(0,0,cell*sqrt(2)/2,cell/2, radians(180),radians(0));
rotate(radians(90));
arc(0,0,cell*sqrt(2)/2,cell/2,radians(0),radians(180));
arc(0,0,cell*sqrt(2)/2,cell/2, radians(180),radians(0));
pop();
noLoop();
}
Graham Murtha
Section A
James Jean Woodcutter Awakening
This week, I’m looked into the 3D artwork of James Jean, specifically his video called “Woodcutter Awakening.” In this video, a sculpture that he created begins to slowly move, and then is engulfed in flame and emerges as a painted mosaic. This mosaic sculpture then becomes enveloped in flowers, and as the petals wilt away is reborn again as the original sculpture. I find this particular piece interesting for numerous reasons. For starters, I love that photogrametry programs allow for us to take objects from the real world and manipulate them in a digital space. This is exactly what James Jean did in this process- after creating many technical drawings of his character, he used Maya and 3d printing software to make an actual, stone sculpture with natural imperfections from existing in the wilderness. After weathering the sculpture, he used photogrametry to bring the sculpture back into Maya, to create it’s incendiary transformation into a porcelain mosaic, a feat that never could have been accomplished naturally. The vines and flowers that engulf the statue (returning it to its natural state) referencing the natural physicality of the base model. The transformation that this stone sculpture goes through represents the transformation of the 3d art world with the introduction of 3d programming and modeling software.
]]>