Archive for the ‘ICM’ Category

Quorum sensing in bacteria

December 5, 2012

For Understanding Genomes class what I found most intriguing was the biological concept of quorum sensing, which is the ability of bacteria to communicate and coordinate behavior via signaling molecules.

For example, opportunistic bacteria can grow within a host without harming it, until they reach a certain concentration. When their numbers are sufficient to overcome the host’s immune system, they change their behavior and cause disease.

8147364035_94759e0aee_n

Bacteria which use quorum sensing produce and secrete signaling compounds called autoinducers. With high concentrations of bacteria, the concentration of the inducer passes a threshold, so more inducer is synthesized.

Quorum sensing

To illustrate this process, I used processing to create a sketch that displays a number of bacteria floating in a stable environment; and then to capture the mechanics of producing and secreting signaling autoinducers, I used the function of an ellipse ring to emanate from the bacteria to cause each one to gravitate to one another; and then with any key press the bacteria change to another color, illustarting the function of the bacteria changing their behavior so it can survive in the host and cause disease.

Screen shot 2012-12-05 at 9.16.37 AM

In one sketch I used the aerial view the 2010 Deepwater Horizon explosion and oil spill where naturally-occurring bacteria that exist in the Gulf of Mexico consumed and removed at least 200,000 tons of oil and natural gas that spewed into the deep Gulf. [SKETCH]

bacteria

While in another sketch I used the background from the bacteria I had to research called Staphylococcus aureus, which is a bacterium that is often found in the human respiratory tract and on the skin and is a common cause of skin infection and food poisoning. [SKETCH]

Final ICM, Data Visualization: Spam

December 14, 2011

My original ICM project sought to visualize personal data rather than public data. I was going to focus on my every day life and create a visual map of the ups and downs (highs and lows) by registering my feelings via twitter, but instead I decided to visualize an every day piece of my life that occurs frequently and to much consternation: spam content in e-mail. It is never ending and from what I can tell from most people it is a daily part of their lives as well.

For the most part my spam content could be broken down into about 5 to 6 categories: Viagra/Penis Enlargement offers, Online University offers, Credit Card offers, Types of Insurance, and Credit Scores (once and a while I will get offers to try products like the electronic cigarette.) It’s a nuisance and irritating so I thought of something which is equally as dirty: bacteria and germs and so I decided to see my email as a petri dish and the spam as specimen or pond scum swirling around under a microscope.

To do this I decided to load up a fairly simple string set of data: varying sizes and colors of each different spam type based on the number of that particular spam, e.g, “viagra” would be a certain size and color based on how many times that particular spam occurred in my email. In my case the most. Code below and here.

I then created a mask from photoshop over an image of culture in a petri to look as though the user was looking through the lens of a microscope  to see the spam bacteria. To widen the lens I simply put in a Keypressed line in the code. To see the full processing sketch click on the image.

[Processing Portfolio]

ICM Final Proposal: Data Visualization of Memory

November 23, 2011

For my ICM final proposal I want to try to explore data visualization techniques but not of a concrete set of data, e.g.,  Hans Rosling’s visualization piece on GDP per capita but that of data from our every day lives: memories. Information visualization is traditionally used as a tool for data exploration and hypothesis formation.  I want to try to imagine visualizing and recording important memories in my life using a visual representations either with 3D or 2D map or “memory topography” where the height represents perhaps the intensity or the recorded moment: how special/happy/sad was it  (or with appealing graphics that capture a range of emotions associate with those memories and records them.

Currently there is a website called We Feel Fine, which is a database of several million human feelings, increasing by 15,000 – 20,000 new feelings per day. Using a series of playful interfaces, the feelings can be searched and sorted across a number of demographic slices, offering responses to specific questions like: Which are the happiest cities in the world? The saddest? And so on.The interface to this data is a self-organizing particle system, where each particle represents a single feeling posted by a single individual. The particles’ properties – color, size, shape, opacity – indicate the nature of the feeling inside, and any particle can be clicked to reveal the full sentence or photograph it contains.

I want to try to do something like this but to personalize it and to concentrate solely on memories in my life either past ones or future ones. For future memories I was thinking I could set up a new twitter account and record times that are meaningful to me during the week and use #hash tags to generate a graphic either with a gradient map or with shapes/particles.

November 16, 2011

The text overlapping the photo of Michele Bachmann is her direct comment about cultures and American exceptionalism. I wanted to play around with the idea of meaning of text and the visual images we conjure when we read an seemingly absurd comment from a politician –especially ones we disagree with. I always see this image in my head regardless of what she is quoted saying.

I ideally want the text to bleed not shake into the photo but could not get processing to do that. [CLICK IMAGE]

CODE:

// A class to describe a single Letter
class Letter {
char letter;

// The object knows its original ” home ” location
float homex,homey;

// As well as its current location
float x,y;

Letter(float x_, float y_, char letter_) {
homex = x = x_;
homey = y = y_;
letter = letter_;
}

// Display the letter
void display() {
fill(255,10,10);
textAlign(LEFT);
text(letter,x,y);
}

// Move the letter randomly
void shake() {
x += random(-5,5);
y += random(-5,5);
}

// At any point, the current location can be set back to the home location by calling the home() function.
void home() {
x = homex;
y = homey;
}
}

PImage img;
PFont f;
String message = “‘not all cultures are equal’”;

// An array of Letter objects
Letter[] letters;

void setup() {
size(640,469);
img= loadImage(“republicants.jpg”);
imageMode(CORNERS);
background(255);
smooth();

// Load the font
f = createFont(“AmericanTypewriter-CondensedBold”, 40, true);
textFont(f);

// Create the array the same size as the String
letters = new Letter[message.length()];

// Initialize Letters at the correct x location
int x = 40;
for (int i = 0; i < message.length(); i ++ ) {
// Letter objects are initialized with their location within the String as well as what character they should display.
letters[i] = new Letter(x,100,message.charAt(i));
x += textWidth(message.charAt(i));
}
}

void draw() {
image (img,0,0);
for (int i = 0; i < letters.length; i ++ ) {

// Display all letters
letters[i].display();

// If the mouse is pressed the letters shake
// If not, they return to their original location
if (mousePressed) {
letters[i].shake();
} else {
letters[i].home();
}
}
}

tv_dog pointillism

October 26, 2011

My inspiration for the midterm processing project was Keith Haring’s Dog TV and a video of his artwork embedded within the TV Dog. I formatted the video from youtube to quicktime (.mov) and embedded it in the background image of the main TV Dog piece.; and then TV Dog is introduced by pointillism.

Original Image

Video embedded into center of TV Dog

CODE:

Without pointillism

Screen shot video without pointillism

With pointillism

snork ballz

October 21, 2011

CLICK IMAGE 2 SEE PROCESSING

CODE

 

PImage myImage;                                

Ball[] balls;
 
boolean click;
 
void setup(){
  size(640,418);
  myImage = loadImage("Snorks12.jpeg");
  balls = new Ball[1000];  
  for(int i = 0; i < 1000; i++){
    balls[i] = new Ball(random(1,650),random(20,600),random(2,20));
  }
  }
 
void draw(){
  image(myImage, 0, 0);
  for(int i = 0; i < 1000; i++){
    balls[i].display();
    balls[i].move();
  }
}
 
class Ball {
  float x,y, vy, vx, gravity, friction;
   
  Ball(float xpos, float ypos, float dia){
    x = xpos;
    y = ypos;
    friction = random(-2,-0.9);
    gravity = random(0.025,1);
 
  }
   
  void display(){
    fill(198,210,240);
    smooth();
    ellipse (x,y,15,15);
  }
   
  void move(){
    vy += gravity;
    x += vx;
    y += vy;
    if (y > height){
      y = height;
      vy*=friction;
    }
    if (x>width){
      x = width;
      vx*=friction;
    }
  }
}
 
void mousePosition() {
   
}


velvet ballz

October 12, 2011

Click image. Mousepress ad Keypress the visual.

CODE:

ball myBallObject, myBallObject2, myBallObject3, myBallObject4, myBallObject5, myBallObject6, myBallObject7, myBallObject8, myBallObject9, myBallObject10,
myBallObject11, myBallObject12, myBallObject13, myBallObject14, myBallObject15, myBallObject16, myBallObject17,
myBallObject18, myBallObject19, myBallObject20, myBallObject21, myBallObject22, myBallObject23, myBallObject24, myBallObject25, myBallObject26;

void setup() {
size(500,500);
myBallObject = new ball();
myBallObject2 = new ball();
myBallObject3 = new ball();
myBallObject4 = new ball();
myBallObject5 = new ball();
myBallObject6 = new ball();
myBallObject7 = new ball();
myBallObject8 = new ball();
myBallObject9 = new ball();
myBallObject10 = new ball();
myBallObject11 = new ball();
myBallObject12 = new ball();
myBallObject13 = new ball();
myBallObject14 = new ball();
myBallObject15 = new ball();
myBallObject16 = new ball();
myBallObject17 = new ball();
myBallObject18 = new ball();
myBallObject19 = new ball();
myBallObject20 = new ball();
myBallObject21 = new ball();
myBallObject22 = new ball();
myBallObject23 = new ball();
myBallObject24 = new ball();
myBallObject25 = new ball();
myBallObject26 = new ball();
background(255,228,225);
smooth();
}
void mousePressed() {
noStroke();
}

void keyPressed() {
background(0,255,255);
stroke(0);
}

void draw() {
fadeBackground();
myBallObject.moveBall();
myBallObject.checkWall();
myBallObject2.moveBall();
myBallObject2.checkWall();
myBallObject3.moveBall();
myBallObject3.checkWall();
myBallObject4.moveBall();
myBallObject4.checkWall();
myBallObject5.moveBall();
myBallObject5.checkWall();
myBallObject6.moveBall();
myBallObject6.checkWall();
myBallObject7.moveBall();
myBallObject7.checkWall();
myBallObject8.moveBall();
myBallObject8.checkWall();
myBallObject9.moveBall();
myBallObject9.checkWall();
myBallObject10.moveBall();
myBallObject10.checkWall();
myBallObject11.moveBall();
myBallObject11.checkWall();
myBallObject12.moveBall();
myBallObject12.checkWall();
myBallObject13.moveBall();
myBallObject13.checkWall();
myBallObject14.moveBall();
myBallObject14.checkWall();
myBallObject15.moveBall();
myBallObject15.checkWall();
myBallObject16.moveBall();
myBallObject16.checkWall();
myBallObject17.moveBall();
myBallObject17.checkWall();
myBallObject18.moveBall();
myBallObject18.checkWall();
myBallObject19.moveBall();
myBallObject19.checkWall();
myBallObject20.moveBall();
myBallObject20.checkWall();
myBallObject21.moveBall();
myBallObject21.checkWall();
myBallObject22.moveBall();
myBallObject22.checkWall();
myBallObject23.moveBall();
myBallObject23.checkWall();
myBallObject24.moveBall();
myBallObject24.checkWall();
myBallObject25.moveBall();
myBallObject25.checkWall();
myBallObject26.moveBall();
myBallObject26.checkWall();
}

class ball {
float ballX, ballY, speedX, speedY;

ball() {
ballX = random(0, width);
ballY = random(0, height);
speedX = random(5, 5);
speedY = random(5, 5);
}

void moveBall() {
ballX+=speedX;
ballY+=speedY;
fill(106,90,205);
ellipse(ballX, ballY, 50, 50);
}

void checkWall() {
if (ballX>width || ballX < 0) speedX*=-1; if (ballY>height || ballY < 0) speedY*=-1;
}
}

void fadeBackground() {
fill(0,2);
rect(0, 0, width, height);
}

interactive 2

September 28, 2011

http://www.openprocessing.org/visuals/iframe.php?visualID=39733&width=500&height=500&border=true

float X;

void setup(){
size(500,500);
background(255);
X=0;
}

void draw(){
if(mouseButton==RIGHT){
background(255);
}
}

void mouseDragged(){
X+=4;
if(X>height) X=0;
noFill();
stroke(0,0,random(132,211),30);
strokeWeight(4);
bezier(0,X,mouseX,mouseY,mouseX,mouseY,width,X);
}

mouse and keyboard: interactive drawing

September 28, 2011

http://www.openprocessing.org/visuals/iframe.php?visualID=39730&width=500&height=500&border=true

void setup() {
  size(500,500);
  smooth();
  strokeWeight(99);
}

void draw() {
  background(224,255,255);
  stroke(102);
  fill(14,12,255);
  ellipse(200, 200, 80,80);
  if (mousePressed){
    if (mouseButton == LEFT) {
      stroke(235,75,92);
    } else {
      stroke(0,12,14);
    }
    fill(255,0,0);
    rect(100,100,90,90);
  }

}

animated slingshot

September 21, 2011

http://itp.nyu.edu/~mg1016/ICM/WEEK1/applet_js/

CODE:

//initialize variables
int leftRodTopX = 140;
int leftRodTopY = 360;
int rightRodTopX = 165;
int rightRodTopY = 360;
int rectLeftX = 150;
int rectMidX = 155;
int rectTopY = 400;
int rectWidth = 10;
int rectHeight = 100;
float slingMid = 152.5;
float ellipseCenterX = pmouseX;
float ellipseCenterY = pmouseY;
float x;
float y;
float r;
float g;
float b;

boolean hasBeenReleased = false;
boolean winner = false;

PVector press;
PVector release; 

float gravity = 0;

void setup(){
size(1200,500);
background(255);
smooth();
//create initial slingshot
rect(rectLeftX,rectTopY,rectWidth,rectHeight);           //base
line(rectMidX,rectTopY,rightRodTopX,rightRodTopY);       //right rod
line(rectMidX,rectTopY,leftRodTopX,leftRodTopY);         //left rod
line(leftRodTopX,leftRodTopY,rightRodTopX,rightRodTopY); //string
rect(800,400,200,100);
}

void draw(){
if(mousePressed){
  background(255);
  bezier(900,400,880,375,880,325,912,320);
  fill(255,0,0);
  ellipse(mouseX, mouseY, 40, 40);
  noFill();
  bezier(rightRodTopX,rightRodTopY,mouseX,mouseY,mouseX,mouseY,leftRodTopX,leftRodTopY);
  fill(0,0,255);
  rect(rectLeftX,rectTopY,rectWidth,rectHeight);
  noFill();
  line(rectMidX,rectTopY,rightRodTopX,rightRodTopY);
  line(rectMidX,rectTopY,leftRodTopX,leftRodTopY);
  line(mouseX,mouseY,slingMid,leftRodTopY);
  stroke(0);
  fill(127,255,212);
  rect(900,400,25,100);
  stroke(0);
  fill(255);
  //ellipse(912,375,50,150);
  bezier(925,400,945,375,945,325,912,320);
}

if(mousePressed==false){
  background(255);
  fill(0,0,255);
  rect(rectLeftX,rectTopY,rectWidth,rectHeight);
  noFill();
  line(rectMidX,rectTopY,rightRodTopX,rightRodTopY);       //right rod
  line(rectMidX,rectTopY,leftRodTopX,leftRodTopY);         //left rod
  line(leftRodTopX,leftRodTopY,rightRodTopX,rightRodTopY); //string
  stroke(0);
  fill(127,255,212);
  rect(900,400,25,100);
  stroke(0);
  fill(255);
  //ellipse(912,375,50,150);
  bezier(900,400,880,375,880,325,912,320);
  bezier(925,400,945,375,945,325,912,320);
 }

 if(hasBeenReleased)
 {
   noFill();
   bezier(900,400,880,375,880,325,912,320);
   fill(255,0,0);
   ellipse(release.x, release.y, 40, 40);
   release.add(press);
   release.y+=gravity;
   gravity+=0.6;
   //println(release.y);
   noFill();
   bezier(925,400,945,375,945,325,912,320);

   if(release.y>=330&&release.y<=380&&release.x>=900&&release.x<=1000){
     winner = true;
   }
 }

 if(winner){
   x = random(0,1200);
   y = random(0,500);
   r = random(0,255);
   g = random(0,255);;
   b = random(0,255);
   fill(r,g,b);
   ellipse(x,y,50,50);
   println(winner);
 }
}

void mousePressed()
{
  press = new PVector(mouseX, mouseY);
  winner = false;
}

void mouseReleased(){
  float cSquared = sqrt(((mouseY-leftRodTopY)*(mouseY-leftRodTopY))+((slingMid-mouseX)*(slingMid-mouseX)))/5;
  release = new PVector(mouseX, mouseY);
  press.sub(release);
  press.normalize();
  press.mult(cSquared);
  hasBeenReleased = true;
  gravity = 0;
}

Follow

Get every new post delivered to your Inbox.

%d bloggers like this: