Phantom Terrains – 2014 – Stefanie Posavec, Frank Swain, Daniel Jones

Kat Hua’s post on week 7 for looking outwards was a report on the abstract visualization from the work of Phantom Terrains by Frank Swain, Stefanie Posavec, and Daniel Jones. I had only looked at acstract work that had apurpose of manipulating different data such as math equations or preset numbers, but it was interesting to see the way people would abstractly represent the data from something such as the internet data. I agree with Kat on her admiration of the project and how the project’s purpose was to present the data of streaming wireless data surges from our everyday lives. What I can add to it is that I liked out they had an abstract view of the data, but also a more commonly known set of data which is the sound waves, which helps the viewers to read the data better.

Nina Yoo- Project 09- Portrait

sketch


var underlyingImage;
var words = ['bee','key','lee','see','me','knee','allie','nina','i','love'];

function preload() {
    var myImageURL ="https://i.imgur.com/3K9LA06.png"
    underlyingImage = loadImage(myImageURL);
}

function setup() {
    createCanvas(500, 500);
    background(0);
    underlyingImage.loadPixels();
    frameRate(100);
}

var x = -5;

function draw() {
	x += 5;
	for (y = 0; y <height; y+= 10) {
		var theColorAtLocationXY = underlyingImage.get(x,y);
		fill(theColorAtLocationXY);
		rect(x,y,10,10);

	}
    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 theColorAtLocationXY = underlyingImage.get(ix, iy);

    noStroke();
    fill(theColorAtLocationXY);

    var randomwor = words[round(random(0,words.length))];
    print(randomwor);
    text(randomwor,ix,iy);
  
}

This project was super fun in playing with different ways to load an image. I loved to figure out how to put on the words and create a sweeping image. It was cool to upload an image, but also see the process of developing the pixels.

Julie Choi – Project 09 – Portrait

julie and alice

/*Julie Choi
15-104 Section E
jjchoi@andrew.cmu.edu
Project-09
*/
var underlyingImage;

function preload() {
    var myImageURL = "https://i.imgur.com/re8jPYz.jpg";
    underlyingImage = loadImage(myImageURL);
}

function setup() {
    createCanvas(700, 700);
    background(0);
    underlyingImage.loadPixels();
    frameRate(1000);
}

function draw() {
    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 theColorAtLocationXY = underlyingImage.get(ix, iy);
    var ballSize = map(mouseX, 0, width, 4, 20);

    stroke(theColorAtLocationXY);
    strokeWeight(2);
    line(px + random(10), py + random(10), px + random(30), py + random(30));

    push();
    rotate(random(0, PI));
    noStroke();
    fill(theColorAtLocationXY);
    quad(px + random(30), py + random(30), px-random(30), py-random(30), px+random(30), py+random(30), px - random(30), py - random(30));
    pop();
}

I had a lot of fun doing this project because I had the chance to use my personal photo as a visual element of the project. I chose a photo of me and my friend that we took during the sunset of an afternoon.

Elena Deng – Project 9 Portrait

sketch
This project was fun because we were able to add aspects of our daily life and apply it to the code. I decided to use a photo of my friend and I together. I used the words “wow” and “cute” to describe us & the photo. If you scroll over the image, you will see little ellipses forming on the photo, reflecting the colors of the underlying image.

var underlyingImage;

function preload() {
    var fallImage = "https://i.imgur.com/pUlrsst.jpg";
    underlyingImage = loadImage(fallImage);
}

function setup() {
    createCanvas(500, 500);
    background(0);
    underlyingImage.loadPixels();
    frameRate(10);
}

function draw() {
    var posX = random(width);
    var posY = random(height);
    var ix = constrain(floor(posX), 0, width-1);
    var iy = constrain(floor(posY), 0, height-1);
    var theColorAtLocationXY = underlyingImage.get(ix, iy);

    noStroke();
    fill(theColorAtLocationXY);
    text("wow",posX, posY, 200);
    text("cute",posX * random(-1,5), posX * random(-3,5), 200);

    var theColorAtTheMouse = underlyingImage.get(mouseX, mouseY);
    fill(theColorAtTheMouse);
    ellipse(pmouseX, pmouseY, 10, 6);

}

Looking Outwards 09 – Sara Frankel

caption: Terry Riley’s “In C” results in a different performance guaranteed eery time played.

The looking outwards assignment I am reviewing is Kyle Leve’s week 6 post about In C by Terry Riley. Listening to it, at first it sounded kind of jarring and unsettling because of the lack of harmonic progression, but the more I listened to it the more I appreciated it. Kyle mentions that this “piece… allows each player to make their own artistic decisions and have freedom from the written page”. I agree with this comment as there are legitimately infinite combinations and interpretations as it is dependent on how many or littles musicians there are and their own musicianship. I do agree with Kyle though to a degree about randomness as if one listens to it in passing, it would really not make sense. However, if you stop and listen and allow yourself to be open minded to the momentum of the music, the music should not feel random at all but in fact, the nonsense you hear should seem coherent.

Kevin Riordan Looking Outwards-09 Section C

Video Demonstration of the Three Desserts

I found Sharon’s Looking Outwards 04 post very interesting. She talked about how the creator wanted to add a new dimension to food and meals. I found the most interesting of the three projects to be the edible robotics embedded in a dessert, and think this has the most applications. I feel that the project focused too much on tying art into it, and I feel this could have valuable practical applications. For example, the idea of edible robotics is something that should definitely be explored further. Though this idea is very interesting, I think that further projects into this area could do much more imaginative and visually cooler stuff than this. I agree with Sharon that tying food and art together in this way is very cool though.

Sharon’s Post: https://courses.ideate.cmu.edu/15-104/f2018/2018/09/20/sharon-yang-looking-outwards-04/

Sharon Yang Project 09 Portrait

Project

/*Sharon Yang
Section C
junginny
Project-09
*/

var underlyingImage;

function preload() {
    var myImageURL = "https://i.imgur.com/ZnYAlHy.jpg"; //image of my boyfriend smiling
    underlyingImage = loadImage(myImageURL);
}

function setup() {
    createCanvas(480, 480);
    background(0);
    underlyingImage.loadPixels();
    frameRate(300);
}

function draw() {
    var px = random(width); //the coordinates of where shapes created are randomized
    var py = random(height);
    var ix = constrain(floor(px), 0, width-1); 
    var iy = constrain(floor(py), 0, height-1);
    var theColorAtLocationXY = underlyingImage.get(ix, iy); //get the colors of the pixel

    noStroke();
    fill(theColorAtLocationXY);
    drawShape(px, py, 5, 10);
}

function drawShape(x, y, radius1, radius2) { //draw star shape
    var angle = TWO_PI/5;
    beginShape();
    for (var i = 0; i < TWO_PI; i += angle) {
    var starX = x + cos(i) * radius2;
    var starY = y + sin(i) * radius2;
    vertex(starX, starY);
    starX = x + cos(i+angle/2) * radius1;
    starY = y + sin(i+angle/2) * radius1;
    vertex(starX, starY);
  }
  endShape(CLOSE);
}

I have used an image of my boyfriend. The project incorporated a very interesting concept. However, because I used the star shape, and also the image was quite blurry, it became really hard to make out of what the image is.

Yoo Jin Shin-LookingOutwards-09

Prismverse

I came across Yingyang’s post and was introduced to Chris Cheung’s Prismverse (2017) exhibition. The thumbnail of the video was enough to capture my attention—it looks like a scene from some sci-fi, futuristic movie with the chrome geometric patterns on the black floor. I love how the colors transition and how the light and water effects actually make it seem like you’re inside a diamond. It was so unexpected that this project is part of Dr.Jart+, which I was already familiar with as a skincare brand. After looking up the product that this was designed for, I thought it would have been nice if at least some part of the packaging reflected this eye-catching exhibition.

Yingying Yan-LookingOutwards-09

sketch

/*
Yingying Yan
Section E
yingyiny@andrew.cmu.edu
Project - 09
*/

var zoey; //a picture

function preload() {
	var zoeyPic = "https://i.imgur.com/QcSx6L4.jpg"
    zoey = loadImage(zoeyPic);
}

function setup() {
    createCanvas(480, 320);
    background(0);
    zoey.loadPixels(); //get pixels from the picture
    frameRate(30);
}

function draw() {
    var x = random(width); //x position of the storke
    var y = random(height); //y postotion of the stroke
    var px = constrain(floor(x), 0, width-1); //x position of each pixel
    var py = constrain(floor(y), 0, height-1); //y position of each pixel
    var theColorAtLocationXY = zoey.get(px, py); //get the color of each pixel
    stroke(theColorAtLocationXY); //draw out zoey with small stokes
    strokeWeight(random(1,5));
    line(x, y, x - random(0, 9), y - random(0, 9));
}

I regret using my little sister’s picture. She is so cute but I am not good enough to render her picture to something better. But that is ok because she will never see this. Overall I think this project is interesting. It is like making a filter for photoshop. I started the project by trying to do something fancy, but I failed. I will try to fix that after I turn this in.

add

Jessica Timczyk – Project 09 – Portrait

Portrait

// Jessica Timczyk
// Section D
// jtimczyk@andrew.cmu.edu
// Project-09-Portrait

// global variables
var underlyingImage;
var sx = [];
var sy = [];
var dx = [];
var dy = [];

function preload() { // preloads image
    var myImageURL = "https://i.imgur.com/CKGh2Ed.jpg?1";
    underlyingImage = loadImage(myImageURL);
}

function setup() {
    createCanvas(300, 400);
    background(255);
    underlyingImage.loadPixels();

    for (i = 0; i < 1000; i++){ // for loop to randomly pick the positions and speed of each square
        sx[i] = random(width);
        sy[i] = random(height);
        dx[i] = random(-5, 5);
        dy[i] = random(-5, 5);
    }
    frameRate(10);

}

function draw() {
    background(255);
    noStroke();
    for (i = 0; i < 1000; i++) {
        var colorAtSquare = underlyingImage.get(sx[i], sy[i]); // the color of each square changes as it moves across
        // the screen to match the photo under neath
        fill(colorAtSquare);
        rect(sx[i], sy[i], 20, 20); // drawing the rectangles and updating their locations with the speed
        sx[i] += dx[i];
        sy[i] += dy[i];

        // lets the rectangles wrap arround to the other side when they go off screen
        if (sx[i] > width){
         sx[i] = 0;
        } else if (sx[i] < 0) {
        sx[i] = width;
        }
        if (sy[i] > height) {
            sy[i] = 0;
        } else if (sy[i] < 0) {
            sy[i] = height;
        }
        
    }




}

It took me a while to decide on how I wanted to make this portrait. Although I knew which photo I wanted to do, I wasn’t sure how I wanted to manipulate it. I ended up really like this project because it allowed me manipulate photos in fun and interesting ways.

Month: October 2018

Nina Yoo- Looking Outwards- 09