Category: Uncategorized

LO 1 – My Inspiration

Link to the project description.

I have always found the projects by Neri Oxman at MIT Media Lab very fascinating and inspiring. The lab consists of a variety of designers, engineers and scientists that work together to create interdisciplinary projects focused on fabricating materials from nature to replace unsustainable building materials. A project called Vespers is working on a technology that creates architectural skins that can be environmentally responsive. Using digital fabrication and computation that customizes the expressiveness of biological microorganisms, the lab is currently able to create a mask that fabricates living microorganisms to morph and adapt while emulating new colors. I believe that the scripts are custom and experimental, while it could be inspired by the lab’s other projects relating to the fabrication of biological materials.

This is still a conceptual piece that allows us to imagine what can be possible in the future but I think the concept is very inspiring and exciting, and brings out a new chapter of biological and responsive materiality in architecture and more.

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

LO 1 – My Inspiration

Prior to taking this class, a project that I found interesting was one from a student named Vivian. As I was first applying to design programs, I searched the internet for other student’s portfolios to help guide the development of my own. I came across Vivian’s work which introduced me to the concept of creative coding. Although no longer on her online portfolio available for me to share, I remember this coded project to be a real-time clock which she had designed to look like a person’s face. I believe she used p5.js, but other than that, I do not know how she made it. Although this project may sound insignificant, I found it very intriguing that she created a piece of art that was live and constantly changing. I had never seen anything like that before, so it made an impression on me. I am excited to learn how I can also create responsive art. Funny enough, I searched up her name to write this and she ended up studying at Carnegie Mellon.

Project 01- Self Portrait

sketch
function setup() {
    createCanvas(400, 500);
    background(197,180,198);
    
}

function draw() {
    fill(223,225,229); //grey
    stroke(223,225,229); // grey
	rect(20,360,300,140); // grey top

    fill(247,219,184); // cream skin
    stroke(247,219,184);
    triangle(20,360,200,200,250,360); // neck
    fill(247,219,184); // cream skin
    stroke(247,219,184);
    rect(200,280,85,80); // neck 
   
    fill(232,198,156); // head color
    ellipse(185,200,150,200); // head
    fill(0);
    stroke(0);
    quad(100,180,20,360,140,360,120,180); // hair
    triangle(20,360,60,450,140,360); // hair
    quad(180,90,70,150,60,330,180,90); // hair
    point(180,90);
    point(70,200);
    triangle(30,200,50,350,90,170);
    triangle(180,90,275,160,250,300);
    quad(260,150,330,350,260,400,240,200);
    quad(130,89,70,200,245,140,215,89); 
    triangle(330,250,310,330,250,170);

    line(90,250,180,330); //necklace
    line(180,330,230,280); //necklace
    fill(250); //necklace
    stroke(250);
    circle(180,330,12); //necklace

    fill(215,117,148);
    stroke(215,117,148);
    ellipse(180,260,50,30); //smile

    fill(232,198,156);
    stroke(232,198,156);
    rect(140,220,75,40); // cut half smile ellipse

    fill(0);
    stroke(0);
    triangle(50,250,20,280,40,370); //more hair

    circle(150,230,12); //black eye
    circle(208,230,12); // black eye

    fill(250);
    circle(153,230,5); // eye highlight 
    circle(210,230,5); // eye highlight
}

PROJECT01 – Self Portrait

rdrice_por
//Robert Rice
//Section C

function setup() {
    createCanvas(400, 400);
    background(75);
    
    fill(255);
    text("rdrice. p5.js vers 0.9.0", 10, 15);  //ver+author text
}

function draw() {
    noStroke();

    fill(255, 255, 0);
    triangle(200,-280, 350,400, 50,400);

    fill(170, 50, 50);
    rect(240, 290, 30, 110);
    fill(180, 70, 70);
    circle(255, 290, 30);   //left sleeve

    fill(180, 50, 50);
    rect(135, 290, 120, 110);
    fill(190, 60, 60);
    circle(195, 290, 120);
    fill(245, 205, 155);
    circle(195, 260, 60);   //body

    fill(170, 50, 50);
    rect(120, 290, 30, 110);
    fill(180, 70, 70);
    circle(135, 290, 30);   //right sleeve

    fill(230, 190, 145);
    quad(180,195, 180,240, 200,240, 210,195);   //neck

    fill(245, 205, 155);
    rect(155, 65, 90, 130); //head

    fill(185, 145, 95);
    rect(200, 181, 47, 2); //mouth

    fill(110, 85, 55);
    triangle(245,80, 269,83, 245,95);
    fill(170, 130, 80);
    triangle(155,130, 155,65, 135,62);
    fill(155, 120, 75);
    triangle(155,65, 270,85, 200,50);
    fill(135, 105, 65);
    triangle(230,65, 245,65, 270,85);   //hair

    fill(230, 180, 120);
    triangle(242-2,165, 262-2,160, 242-2,110);    //nose

    fill(230, 180, 120);
    circle(155, 130, 20);   //ear

    fill(150,0,150);
    circle(190,113, 10);
    circle(260,113, 10);    //eye bags

    fill(0);
    circle(190,110,10);
    circle(260,110,10);     //eyes

    strokeWeight(1);
    stroke(185, 145, 95);
    line(200,113,197,123);
    line(250,113,253,123);  //wrinkles

    noFill();
    stroke(0);
    arc(194, -101, 413, 413, 1.345998, 1.614255);
    arc(264, -101, 413, 413, 1.345998, 1.614255);   //eyebrows

    noLoop();
}

-Robert

L01 – My Inspiration

An interactive project I admire is Club Penguin. Club Penguin before its discontinuation was an online children’s game that became popular among people of all ages. I admire the simplicity of the game itself, but also the community built by the chat feature within the game. Even years after original players of the game had become “too old” to play, many still enjoyed it as well as created a multitude of different forms of art from it. Memes and YouTube videos were created daily about Club Penguin which shows the lasting impact the project had. The idea was started by a singular person and then developed by himself, Lance Priebe, and a co-founder, Lane Merrifield. The company itself was formed with 10 employees and eventually grew to over 10 times that. The game was developed for years and there is no information regarding how long the bare bones of it took to create. Sources state the game was created with commercial software, utilizing Flash Player to run. The code itself uses many things, such as java, ActionScript, and more. It has also been said that the company did create its own custom extensions for preexisting software for optimization. The fan page for the game states the founder got his inspiration from a newspaper depicting a penguin and a banana peel. The futures Club Penguin pointed to have already been seen. As an old, discontinued game, it still has a strong fan-base and inspires media. A simple project has had a lasting impact which gives insight into how influential computational projects can be. The game itself was even sold to Disney for a guaranteed $350 million dollars, revealing that someone with a passion and an idea can become successful no matter what it is.

A link is not possible as the game has been shutdown.
Official Title: Club Penguin
– Creator/Founder: Lance Priebe
– Co-Founder: Lane Merrifield
Source of Information: https://clubpenguin.fandom.com/wiki/Club_Penguin#:~:text=They%20never%20advertised%20at%20all,Puffle%20temporarily%20for%20the%20party
*This information may not be accurate as it is simply a fan made forum
*however it was one of the sole places I could find any information on the
*history and creation of the project.

Club Penguin Shuts Down After Disney Claim, U.K. Child-Porn Arrest - Variety

LO: Voicing those Unheard- My Inspiration.

This past July, media-artist collective Breakfast (based in NY) released a Flip-Disk computational art piece to facilitate their ‘Don’t Go Quiet’ campaign in light of recent events with the murder of George Floyd and the insurgence in Black Lives Matter support.

“Dont Go Quiet” by Breakfast (2020) // 34.7 x 34.7 x 3.3 in // Flip-discs, software, camera + computer

The piece is composed of flip-discs triggered by the system’s real-time detection of new social media posts uploaded using the #blacklivesmatter hashtag or mentioning BLM, creating ripples (due to flip-disc movement) on an upside-down American flag. Through this piece, Breakfast hopes to highlight a collective, and hopefully, ongoing conversation to bring about an end to racism.

Flip-disc art has been around for quite some time, sometimes presenting itself in more practical forms: clocks, calendars, sign displays, etc. However, implementing a live internet tracking software to represent these current and highly important conversations brings another meaning to this technology. As an audience, we are drawn to artwork we can relate to; Breakfast has created an experience for its viewers to see the impact of each and every person speaking out against racism. I, like many, are inspired to stand alongside Black people today, tomorrow, and each day until we have created a world equitable enough. Let this be a time where we march harder, protest louder, and create with more empathy to see a world more diverse and inclusive than ever. Let your impact be seen.

Portrait

portraitDownload
function setup() {
    createCanvas(600,600);
    background(142,97,79);
    text("p5.js vers 0.9.0 test.", 10, 15);
}

function draw() {
	stroke(55,42,31);
	strokeWeight(5);
	noFill();
	arc(100,450,200,200,0, HALF_PI);    //left neck
	arc(420,450,200,200, HALF_PI, PI);  //RIGHT NECK
	noStroke()
	fill(55,42,31)
	arc(250,300,300,350, PI + PI + HALF_PI, HALF_PI + PI );   // left most arc
	fill(60,45,28);
	arc(260,300,300,350, PI + PI + HALF_PI, HALF_PI + PI );  //2nd left most arc
	fill(70,50,24);
	arc(275,300,300,350, PI + PI + HALF_PI, HALF_PI + PI );  //3rd lest most arc
	fill(80,55,20)
	arc(300,300,300,350, PI + PI + HALF_PI, HALF_PI + PI ); //4th left most arc
	fill(90,60,15) 
	arc(350,300,300,350, PI + PI + HALF_PI, HALF_PI + PI );  //5th left most arc
	fill(88,63,53);
	stroke(55,42,31);
	strokeWeight(5);
	circle(115,330,40);   //right nostril
	strokeWeight(4);
	circle(115,330,30);
	strokeWeight(3);
	circle(115,330,15);
	strokeWeight(2);
	circle(115,330,5);
	strokeWeight(5);
	circle(65,325,35);     //left nostril
	strokeWeight(4);
	circle(65,325,25);
	strokeWeight(3);
	circle(65,325,15);
	strokeWeight(2);
	noStroke();
	circle(65,325,5);
	fill(152,113,94);
	triangle(150,290,40,290,80,350); // triangle nose
	fill(135,100,100);
	triangle(160,290,50,290,90,350);
	ellipse(140,410,150,50);     //lips
	stroke(55,42,31);
	strokeWeight(5);
	line(69,415,212,405);
	noFill();
	square(200,220,45,20);
	square(95,220,45,20);
	fill(0);
	ellipse(221,242,40,25);
	ellipse(118,242,40,25);
	
	noLoop();

}

here is my project from last week

sketch3 
// Amyas Ryan section A
function setup() {
    createCanvas(600, 600);
    background(140, 203, 211);
}

function draw() {
    strokeWeight(0);
    fill(34, 68, 34);  //shirt
    quad(0, 600, 600, 600, 530, 530, 50, 500);
    quad(50, 500, 530, 530, 380, 430, 230, 400);
    fill(201, 114, 65); //skinshadow
    ellipse(290, 450, 175, 75);
    quad(205, 450, 375, 450, 365, 320, 230, 340);
    ellipse(390, 250, 30, 70);
    fill(277, 132, 72); //skinlight
    quad(265, 390, 320, 390, 365, 350, 235, 360);
    quad(235, 360, 365, 350, 385, 290, 215, 325);
    triangle(215, 325, 385, 290, 205, 290);
    quad(205, 290, 385, 290, 395, 160, 195, 160);
    ellipse(200, 250, 30, 70);
    fill(69, 23, 16);  //hair
    ellipse(295, 150, 195, 75);
    quad(380, 250, 395, 220, 400, 180, 375, 180);
    quad(200, 220, 210, 250, 215, 180, 195, 180);
    quad(225, 220, 235, 215, 275, 207, 230, 205);
    quad(315, 207, 360, 205, 365, 220, 355, 215);
    fill(210, 115, 58);  //hatlight1
    quad(195, 200, 295, 150, 295, 135, 195, 170);
    fill(166, 82, 35);  //hatdark1
    quad(295, 150, 410, 210, 400, 185, 295, 135);
    fill(246, 213, 153); //hatlight2
    quad(195, 170, 295, 135, 295, 35, 200, 60);
    fill(211, 182, 136); //hatdark2
    quad(295, 135, 400, 185, 390, 60, 295, 35);
    fill(85, 255, 16, 50);
    ellipse(295, 90, 75, 75);
}

Project-01 Face

NW Face SketchDownload
function setup() {
	/*
	Nicholas Wong
	Section A
	*/
	
    createCanvas(600, 600);
    text("p5.js vers 0.9.0 test.", 10, 15);

    //White Background
    background(255);

}

function draw() {

	scale(0.4)

	//Face Base Shape
	noStroke();
	fill(250, 215, 172);
	beginShape();
	vertex(459,657);
	vertex(499,816);
	vertex(566,899);
	vertex(623,960);
	vertex(749,960);
	vertex(837,871);
	vertex(884,789);
	vertex(914,688);
	vertex(949,533);
	vertex(933,346);
	vertex(890,278);
	vertex(784,252);
	vertex(659,242);
	vertex(561,261);
	vertex(469,336);
	vertex(459,657);
	endShape();


	//Chin Shading
	noStroke();
	fill(250, 205, 175);
	beginShape();
	vertex(635,837);
	vertex(722,839);
	vertex(737,962);
	vertex(629,963);
	vertex(614,922);
	endShape();

	//Face Shading
	noStroke();
	fill(245, 200, 172)
	beginShape();
	vertex(469,200);
	vertex(445,606);
	vertex(499,811);
	vertex(626,960);
	vertex(686,960);
	vertex(672,852);
	vertex(610,795);
	vertex(510,527);
	vertex(538,429);
	endShape();


	//Left Eye
	noStroke();
	fill(250)
	beginShape();
	vertex(537,510);
	vertex(581,505);
	vertex(617,541);
	vertex(555,544);
	vertex(514,525);
	endShape();

	//Left eye Shading
	noStroke();
	fill(245, 195, 162);
	beginShape();
	vertex(532,451);
	vertex(602,458);
	vertex(641,516);
	vertex(634,550);
	vertex(572,506);
	vertex(533,506);
	vertex(515,508);
	endShape();

	//Right Eye
	noStroke();
	fill(250);
	beginShape();
	vertex(757,538);
	vertex(779,509);
	vertex(835,505);
	vertex(858,519);
	vertex(820,543);
	endShape();

	//Right Eye Shading
	noStroke();
	fill(245, 195, 165);
	beginShape();
	vertex(731,523);
	vertex(763,476);
	vertex(856,460);
	vertex(882,517);
	vertex(821,503);
	vertex(779,511);
	vertex(744,556);
	endShape();

	//Brows
	fill(200, 175, 175);
	quad(751,466,796,443,855,440,877,460);
	quad(507,438,579,437,611,461,496,454);

	//Nose Shading
	noStroke();
	fill(245, 200, 162);
	beginShape();
	vertex(669,573);
	vertex(613,688);
	vertex(617,713);
	vertex(638,694);
	vertex(684,689);
	vertex(674,623);
	endShape();

	//Under Nose Shading
	fill(248, 205, 170);
	quad(643,722,615,789,669,769,674,717);


	//Nostrils
	noStroke();
	fill(230,150,150);
	triangle(643,695,662,707,641,707); //Left
	triangle(715,708,739,706,728,698); //Right

	
	//Mouth
	noStroke();
	fill(250,200,182); 
	beginShape();
	605,792,664,784,690,793,719,787,780,793,739,828,693,832,654,827
	vertex(605,792);
	vertex(664,784);
	vertex(690,788);
	vertex(719,784);
	vertex(780,793);
	vertex(739,828);
	vertex(693,832);
	vertex(654,827);
	endShape();


	//Hair
	noStroke();
	fill(30,25,30)
	beginShape();
	vertex(445,644);
	vertex(364,521);
	vertex(349,402);
	vertex(393,263);
	vertex(447,201);
	vertex(563,81);
	vertex(717,45);
	vertex(793,52);
	vertex(890,107);
	vertex(935,160);
	vertex(950,226);
	vertex(950,272);
	vertex(960,308);
	vertex(970,401);
	vertex(950,478);
	vertex(945,550);
	vertex(942,584);
	vertex(926,603);
	vertex(936,451);
	vertex(925,344);
	vertex(889,278);
	vertex(778,266);
	vertex(698,261);
	vertex(599,262);
	vertex(535,292);
	vertex(464,365);
	endShape();

	//Hair Shading
	noStroke();
	fill(25,15,15)
	beginShape();
	vertex(448,607);
	vertex(461,378);
	vertex(557,286);
	vertex(651,254);
	vertex(782,260);
	vertex(920,288);
	vertex(870,189);
	vertex(764,120);
	vertex(679,126);
	vertex(593,162);
	vertex(509,205);
	vertex(426,279);
	vertex(401,409);
	endShape();


	noloop();





}