reasonably distanced ghost

For this, I had a tiny ghost character that would move away from you as you got closer and move forwards again as you came near, maintaining a pseudo-constant distance away from you. It blinks whenever you blink, relies on your scale and position on the screen to move itself around in a pseudo-3D space, and is relatively happy and cutesy.

This is a complete failure! Originally I really, really wanted a multi-eyed monster blob that blinked based on when the viewer did, and delayed the individual eye blinks so you got a visually appealing effect.

look at his beautiful, many eyes

Totally couldn’t get any sort of delay to work (I wrote a nifty little eye class in one of my previous sketches though, which was kind of exciting for me as I’ve tended to shy away from writing any sort of classes).

I have a working understand of classes and OSC now (as well as a continued appreciation for push/popMatrix), but I’m disappointed by the final sketch. I think it’s still pretty cute, but not really all that compelling or interesting. I’d really like to come back to this at some point and create something more like my original goal.

MINIMALIST CLOCK

I went for a more minimal approach with this assignment. The hours and minutes are displayed in binary, with only the necessary bits available for view (ones are filled rectangles, zeroes are blank). The triangles in the background progressively divide, with the amount of seconds represented as the number of triangles in a given row or column. I was really enamored with the idea of neatly subdividing objects as a clock, and thought the execution of the minute and hour representations worked well. Unfortunately, the triangles tended to leave extra space between the right and lower sides of the sketch and the last triangles. Other than that, I’m super pleased with the color scheme.

Madeleine-LookingOutwards-2

Paper Note – Created by Andrew Spitz and Andrew Nip at the Copenhagen Institut of Interaction Design, Paper Note generates a stack of paper disks that represent a sound wave. I’m enchanted by the creation of physical objects through code, and thought it was a clever way to create appealing mementos. I thought that having to string the disks by hand was super inefficient–I think that a different physical method, such as 3D printing, would be more efficient in terms of rapid production. Andrew Spitz, one of the co-creators of the project, specializes in sound design, so the interest in waveforms makes sense!

The Generative Gatsby – Vladimir V. Kuchinov, a typography designer who focuses on contextual narrative, created The Generative Gatsby: Jazzed Up Typography, a book whose words are used to represent big band arrangements from the Prohibition-era. The lovely computationally stitched cover originally caught my eye–I was somewhat disappointed that this wasn’t a sewing project! I enjoyed that this used the text itself to provide a context for its generative aspect.

The Feltron Reports – For several years Nicholas  Felton has compiled huge datasets of information about himself into annual reports. The reports are beautifully designed, conveying vast amounts of information with simplicity and strong color choices. They provide a compelling argument for the quantified self movement, in fact, Felton has founded Daytum, a site that allows users to collect and compile large datasets into graphs for public display. While incredibly visually appealing, in some cases I think that some of his design choices (especially light text on light backgrounds) make the understanding of the data more difficult.

Assignment-04-GIF

eugh-cropped

Originally, I wanted a gif to pair with the Hotline Miami soundtrack (ridiculously good). I had the idea of a rotating 3D diamond with glow lines emanating from it, but realized I didn’t have much experience with .obj import and Processing, and felt it best to stick with the provided primitives.

sketches from my notebook
sketches from my notebook

One of my main goals was to make the emitting glow lines really nice. To get a smooth motion curve, I hopped over to Grapher and plotted out various graphs until I found one I thought would allow for good timing and spacing.

grapher plot
grapher plot

I went with 60 FPS in the original processing file, which is hella decadent for animation. I thought I did a nice job with the lines, but my cube rotation was sort of flat. The background noise really brings the piece together. Next time I’d like to pay more attention to creating coherent timelines for all the separate animated components of the animation as a whole–dealing with different start/end times was a mess! Below is my code:

float a;
float b;
float c;
float d;
float e;
float f;
int i;
float multi;
int count;
float h = width / 60;
int counter = 1;

void setup() {
  size(500, 500, P3D);
  //smooth();
  fill(0, 0, 0);
  stroke(255);
}

void draw() {
  
  //setup
  background(0);
  for (int i = 0; i < height/4; i++) {
    for (int j = 0; j < width/4; j++) {
      if (random(255) > 128) {
        stroke(100);
        point(i*4, j*4);
      }
    }
  }

  counter += 1;

  stroke(255);
  //math
  float frame = frameCount % 60;
  a = (5 * sin((frame/15.0)+4.75)+5);
  b = (5 * sin(((frame+15)/15.0)+4.75)+5);
  c = (5 * sin((45/15.0)+4.75)+5);
  d = (5 * sin((frame/15.0)+12.75)+5);
  e = (5 * sin(((frame+15)/15.0)+8.75)+5);
  f = (5 * sin((45/15.0)+12.75)+5);
  if (frameCount % 90 == 0) {
    count += 1;
  }


  //drawing

  pushMatrix();
  translate(width*.5, height*.55);
  pushMatrix();
  rotateZ(.25*PI);
  if (count % 2 == 0) {
    rotateY( map(frameCount%360, 0, 360, 0, TWO_PI));
  } 
  else {
    rotateX( map(frameCount%360, 0, 360, 0, -TWO_PI));
  }
  strokeWeight(3);
  fill(0, 0, 0);
  box(150);
  popMatrix();
  for (int i = 0; i < 17; i++) {
    multi = (i % 2) + 1;
    pushMatrix();
    rotate(PI*.75);
    rotate(PI*i/16);
    translate(110, 110);
    strokeWeight(1);
    if (frame % 60 < 40) {
      line(a * multi, a * multi, 0, b * multi, b * multi, 0);
    }
    popMatrix();
  }
  popMatrix();
  
    //framez
  
 // if (frameCount < 360) {
//    saveFrame("output/filename-####.png");
 // }
}

Madeleine-Schotter

int side = 20;
 
void setup() {
  size(320, 580);
  noLoop();
}
   
void draw() {
  background(225);
  fill(0, 0, 0, 0);
  smooth();
   
  for (int i = 0; i < 12; i++) {
    for (int j = 0; j < 24; j++) {
      pushMatrix();
      translate(i*side + 40, j*side + 40);
      rotate(random(PI*j/-54.0, PI*j/54.0)); //pick something good for this
      rect(0, 0, side, side);
      popMatrix();
    }
  }
}

Additional screenshot:

Screen Shot 2013-09-05 at 9.03.18 AM

Reminder Bracelet

madeleine-blink

I’m sure I’m not the only one who has the terrible tendency to get distracted and then nearly miss events. It’s not that I haven’t stored the information about the event somewhere I can access, but rather I lose track of time and only realize until after the fact. My IFTTT recipe connected my Google Calendar to the Blink(1), slowly turning from blue to red when an event was approaching. I envision it being a minimal LED bracelet that subtly notifies the wearer when events approach, allowing them to either quickly remember themselves and rush to the event or consult their calendar for more details.

Circle Games [Instructional Drawing]

Screen Shot 2013-09-02 at 4.50.41 PM

I originally intended to use arbitrary numbers picked by the artist at the beginning of the instructions, but felt that referring back to the numbers was too complicated. Were I to rewrite my instructions, I’d have them generate variables at the beginning as I originally intended.

 

ems2-instr-003I was a bit worried when I received my first drawing. I had intended for circle packing to occur within one, larger circle, but this person clearly did not interpret the instructions that way!

ems2-instr-002This was most in line with what I had envisioned a completed drawing to be. I was intrigued by the fact that this artist decided to created shapes as opposed to nets with the straight lined option.

ems2-instr-001

 

I felt bad for this artist, she spent a long time creating very small circles, only to find that she had to fill them in! Preventing the artists from seeing the future steps led to more interesting circle packing shapes, of which I’m pleased with. Overall the instructions created three very different pieces, while still maintaining a common aesthetic.

 

IFTTT

Screen Shot 2013-09-02 at 3.06.27 PM

I think IFTTT is useful to a point–it’s great for cross-posting things/quickly hauling a specific subset of information from one place to another without any desire to apply any transformations to it. In terms of accessibility I think it trumps a straight API, but I think APIs provide a wider variety of options for how to use the data inputted. The Jer Thorp article debunking the perceived difficulty of creating/using an API was inspirational to me, I’ve been interested in using APIs in the past but have been too intimidated to actually go through with using them. I’d love to work with and potentially even create APIs this semester and beyond.

Jim Campbell’s Formula for Computer Art acts as a provocation. Interactive media art tends to follow Campbell’s formula–interesting sensor data is taken and then mysteriously mapped to an aesthetically pleasing output. Campbell wants to see artists break away from the formula and attempt new and innovative things.

One of the things I love about being in Pittsburgh is how accessible the arts are in comparison to my hometown (this feeling is mostly fueled by the awesome free bus fare/museum pass combination Carnegie Mellon provides). This recipe pulls RSS feed entries from OMG!PGH and emails the content to me. My email goes to my phone so I can add the things that interest me to my calendar, so I won’t forget to attend! Eventually, I’d like to get around to setting up an RSS feed that pulls events from the various museums/galleries in the area, but for right now I feel like this is a good selection of events that would interest me.