Maya Irvine – Project1 – TextRain

by mirvine @ 1:16 am 25 January 2011

TextRain. Not quite perfect. Hopefully better in the future. :D

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94

//Project1 - Gauntlet 
//Textrain by Camille Utterback & Romy Achituv (1999)
//Maya Irvine
//Thanks goes to Justin Edmund for the helps
//Interactive Art and Computational Design Spring 2011
//Carnegie Mellon University
 
 
String string = "Singing in the Rain!";
int[] speed = new int[string.length()];
int[][] position = new int[2][string.length()];
 
 
import processing.video.*;
Capture myWebcam;
 
 
void setup() 
{
  size(400, 300);
  myWebcam = new Capture(this, width, height);
 
 
  for (int i = 0; i < string.length(); i++) {
    position[0][i] = i*20+20;
    position[1][i] = 0;
    speed[i] = (int)random(1, 4);
  }
}
 
 
 
void draw() 
{
  image(myWebcam, 0, 0);
  filter(GRAY);
   {
      myWebcam.read();
   }
 
  rain();
}
 
 
void rain()
{
 
   for (int i = 0; i < string.length(); i++) {
 
     loadPixels();
     fill(random(255),random(255),random(255));
     textSize(14);
     position[1][i] += speed[i];
     println(get(position[0][8], position[1][8]));
 
    if (position[1][i] >= 550) {
       position[1][i] = 0;
    }
 
    color location = get(position[0][i], position[1][i] -185);
    color location2 = get(position[0][i], position[1][i] -230);
 
     if(location <= -14803426){
 
     speed[i] = 0;
        if(location2 <= -14803426 )
     {
        position[1][i] += -1*speed[i];
     }
     }
 
     else if(location >= -14803426 )
     {
        speed[i] = (int)random(1, 4);
     }
 
 
 
 
 
     text(string.charAt(i), position[0][i],position[1][i]-200);
 
 
   }
 
 
 
}
 
 
void captureEvent(Capture myWebcam) 
{
  myWebcam.read();
}

Info Viz, updates

by Chong Han Chua @ 12:11 am 24 January 2011

Data scraping is going well.. I have at the time of writing about 65k+ images scrapped of the iTunes App Store.

I forgot to mention, I’m changing my idea to try to visualize something interesting from the abundance of (mostly bad) icons on the App Store. I don’t think I will have sufficient time to scrape the entire app store, I’ll just have to work with what I have.

I’m not too sure what kind of visualization I can get out of all these data. On the fundamental level, I’m going to try to generate a colour chart of all the icons in the app store. I’m also thinking of experimenting with data averaging or various other techniques to see what I can get.

Schotter_Foster

by Asa Foster @ 3:29 pm 16 January 2011

<pre lang=”java”>

void setup(){

size(310, 560);

noFill();

noLoop();

}

// rows/columns

void draw(){

rectMode(CENTER);

int n = 0;

for (int y=0; y<24; y++){

for (int x=0; x<12; x++) {

// square transformations (n gets progressively higher by row)

pushMatrix();

translate(20*x + random(n++)/70+30, 20*y + random(n)/70+30);

rotate(PI*random(-n, n)/1000);

rect(15, 15, 20, 20);

popMatrix();

}

}

}

</pre lang=”java”>

Maya Irvine-Project1-Schotter

by mirvine @ 3:47 pm 12 January 2011

Processing Applet

Processing.js

//Project1 - Gauntlet
//Schotter by Georg Nees (1965)
//Maya Irvine
//Interactive Art and Computational Design Spring 2011
//Carnegie Mellon University
 
//variables
float rowStart, collumStart, offsetStart, lngth;
float [] offsetChange = {0.1, 0.3, 0.5, 0.7, 0.9, 1.1, 1.3, 1.5, 1.7, 1.9, 2.1, 2.3, 2.5, 2.7, 2.9, 3.1, 3.3, 3.5, 3.7, 3.9, 4.1, 4.3, 4.5};
 
void setup ()
{
  size (280, 500);
  background (255);
  noFill();
  smooth();
  rowStart = 20;
  collumStart = 20;
  offsetStart = 0.1;
 
  lngth = 20; 
 
  rectMode(CENTER);
}
 
void draw()
{
  collums();
}
 
void collums()
{
  for (int a = 0; a &lt; offsetChange.length ; a++)
  {
 
    for (int b = 0; b &lt; 12 ; b++)
    {
      pushMatrix();
      translate( 1.5*rowStart + rowStart*b + random( -offsetChange[a], offsetChange[a] ), (collumStart + a * collumStart) + random(-offsetChange[a], offsetChange[a]));
      rotate( random( -1*((offsetChange[a])*12*(PI/180)), (offsetChange[a])*12*(PI/180) ) );
      rect(0, 0, lngth, lngth);
      popMatrix();
    }
 
  noLoop();
  }
}

Schotter original code

by Mauricio @ 10:40 am

An excerpt of the original ALGOL code of Schotter. Full text can be viewed here: http://www.chart.ac.uk/chart2004/papers/weiss.html

Meg Richards – Schotter

by Meg Richards @ 8:02 am

Processing.js:

Processing Applet:

Source Code:

void setup() {
 // define the window size &amp; enable anti-aliasing
 size(550, 800);
 background(255);
 smooth();
 noFill(); // not solid squares
 noLoop(); // only draw() once
}
 
void draw() {
 // allow for some padding around the edge
 translate(30,10);
 
 int x = 0, y = 0, side = 30;
 int i = 0;    // increment just like the original
 float j1, j2; // random numbers for translation and rotation
 
 for (int k = 0; k &lt; 24; k++ ) { // iterate through y-axis
   for (int j = 0; j &lt; 16; j++ ) { // iterate through x-axis
     i++;
     translate(x, y); // re-define coordinate axis to square
 
     // pick increasingly variable random numbers for
     j1 = random(-15*i/244,15*i/244); // translation
     j2 = random(-15*i/244,15*i/244); // &amp; rotation
 
     // rotation should only affect one square at a time,
     //   so push and then pop that alteration to the coordinate axis
     pushMatrix();
     rotate(radians(j2));  // rotate the axis
     rect(j1, j1, 30, 30); // plot the square
     popMatrix(); // return the axis to its original state
 
     x=30; // x-position advances for each square drawn in row
     y=0;  // y-position shouldn't change in the middle of a row
   }
   x=-450; // return x to beginning of row position
   y=30;   // adjust y to next row
 }
}

OpenFrameworks:

SamiaAhmed-Schotter

by Samia @ 7:48 am

Schotter, processing.js

Schotter, processing

Schotter, openFrameworks

Schotter, code

//Samia Ahmed, samiaa@andrew.cmu.edu
//A reproduction of Schotter by Georg Nees
//Carnegie Mellon University: 51-482
//January 2011
 
  int rows = 23;
  int cols = 12;
  int side;
 
void setup(){
  size(392, 700);
  side = width/(cols+2);
  background(248, 244, 236);
  noLoop();
}
 
void draw(){
  for (int row = 0; row &lt; rows; row++){
    for (int col = 0; col &lt; cols; col++){
      pushMatrix();
      translate((side*col)+side/2+side, (side*row)+side/2+side); //resets the origin
      rotate(setRotation(row, col));
      noFill();
      rect(-(side/2)+setShift(row, col), -(side/2)+setShift(row, col), side, side);
      popMatrix();
    }
  }
 
}
 
float setRotation(int row, int col){
  float count = (row*cols+col);
  float rand = random(count);
  if (count &gt; (rows*cols)/4 || random(rows*cols) &lt; count)
    if (int(random(3)) == 1)
      return radians(90*(rand/(rows*cols)));
    else
     return -radians(90*(rand/(rows*cols)));
  return 0;
}
 
float setShift(int row, int col){
  float count = (row*cols+col);
  float rand = random(count);
  if(count &gt; (rows*cols)/4 || random(row*col) &lt; count)
     if (int(random(3)) == 1)
       return (side/2*(rand/(rows*cols)));
     else
       return -(side/2*(count/(rows*cols)));
  return 0;
}

Susan Lin – Text Rain

by susanlin @ 7:38 am

An attempt in Flash / ActionScript 3.0
On second thought, I should have take a stab at it in Processing… It was hard to find directly applicable code. Alternatively, I also may just to be better at getting into the coding mindset.

The textrain is *supposed to* get caught on the whitest thresholds (worked better for the mediocre video quality and harsh desk lamp lighting).

In brighter news: The text is inspired by one of my favorite quotes:
“You know you’re in love when you can’t fall asleep because reality is finally better than your dreams.” -Dr. Seuss

Project 1 – Text Rain – Nisha Kurani

by nkurani @ 7:31 am

I implemented this in Processing.  I decided to make it black and white with colorful text, which reads, “I can see clearly now, the rain is gone.”  Letters change colors everytime they reach the bottom of the screen.

Alex Wolfe | Text Rain

by Alex Wolfe @ 7:25 am

Text Rain coded in processing. References background subtraction at Processing.org.

Project 1: Text Rain – Mauricio Giraldo

by Mauricio @ 6:32 am

Mauricio Giraldo: Text Rain-inspired composition from mauricio giraldo on Vimeo.

For some reason the Flash SWF I uploaded below the did not work on the browser so I uploaded the video above.

You need Flash Player 10 or above and a webcam to use. For a better interaction experience make sure you are in front of a white wall.

Get Adobe Flash player

Project 1: Schotter – Mauricio Giraldo

by Mauricio @ 6:31 am

Schotter

Processing.js:
click the composition to re-draw

Processing:
click the applet to re-draw

Code for both Processing.js and Processing versions is identical:

// base positions
int side = 30;
int xini = 22 + 15; // add 1/2 side (draw from center)
int yini = 14 + 15; // add 1/2 side (draw from center)
 
int cols = 12;
int rows = 22;
 
// redraw status variable
boolean has_drawn = false;
 
void setup() {
  size(408,724);
  background(0xffffff);
  stroke(0x000000);
  noFill();
  rectMode(CENTER);
}
 
void draw() {
  if (!has_drawn) {
    has_drawn = true;
    drawQuads();
  }
}
 
void mouseClicked() {
  background(0xffffff);
  has_drawn = false;
}
 
void drawQuads() {
  // draw the squares
  int i,j;
  for (i=0;i<cols;i++) {
    for (j=0;j<rows;j++) {
      // rotation/position is only affected based on the row
      float px = xini+(i*side);
      float py = yini+(j*side);
      float r = 0;
      // random xpos
      r = random(j*3);
      // random rotation
      px += random(-j/2,j/2);
      py += random(-j/2,j/2);
      // apply transformations
      pushMatrix();
      translate(px,py);
      rotate(radians(r));
      rect(0,0,side,side);
      popMatrix();
    }
  }
}

openFrameworks:

Mauricio Giraldo: Schotter-inspired composition from mauricio giraldo on Vimeo.

Caitlin Boyle :: Text Rain

by Caitlin Boyle @ 6:22 am


apologies for the lagginess.

Ward Penney – Text Rain

by Ward Penney @ 6:15 am

Completed in Processing with openCV.

Meg Richards – Text Rain

by Meg Richards @ 6:11 am

Reproducing Text Rain using OpenFrameworks:


I love when they get caught on the whiteboard ledge.

Project 1 – Schotter – Nisha Kurani

by nkurani @ 6:08 am

Processing.js


Processing Code:

float rectX = 0;
float rectY = 0;
int sizeX = 20*12;
int sizeY = 20*23;
float rotation;
float degree = 180/46;
void setup() {
size(sizeX,sizeY);
smooth();
background(255);
}
void draw() {
for (int i = 0; i < sizeY; i++)
{
while (rectX < sizeX )
{
rotation = random(-1 * (degree * i), (degree * (i+.1)) );
pushMatrix();
translate(rectX, rectY);
rotate(radians(rotation));
rect(0, 0, 20, 20);
rectX = rectX + 20;
noFill();
popMatrix();
}
rectX = 0;
rectY = rectY + 20;
}
}


openFrameworks:

JamesMulholland-TextRain

by James Mulholland @ 5:09 am

Here’s an exercise in re-creating Camille Utterback’s Text-Rain project:

Alex Wolfe | Schotter

by Alex Wolfe @ 5:07 am

Reproducing Schotter | 1965 |  George Nees

using processing.js ::

as a processing applet ::


alexwolfe_shotter

/*
* Alex Wolfe - Spring 2011
* Interactive Art and Computational Design
* Reproducing Schotter(1965) by Georg Nees
*/
 
int rectSize = 20;
int rows = 23;
int col = 12;
int xOffset = 30;
int yOffset = 10;
int r = 8;
 
void setup(){
  size(300,500);
  background(255);
  rectMode(CORNER);
  smooth();
  noFill();
  stroke(0);
 
  for( int x=xOffset; x

openFrameworks:

Eric Brockmeyer – Text Rain

by eric.brockmeyer @ 4:54 am

This is an example of my Open Frameworks “Text Rain” interpretation. I used the openCVExample including the various ofxCv classes (particularly ofxCvContourFinder.cpp).

OF “Text Rain” Interpretation from eric brockmeyer on Vimeo.

Project 1 – Schotter – Emily Schwartzman

by ecschwar @ 4:49 am

Processing applet:

Processing.js :

Code:

float x = 0;
float y = 0;
int rows = 23;
int cols = 12;
int squareW = 30;
int squareH = 30;
float angle;
float variation = .08;
 
void setup() {
  size(squareW*cols, squareH*rows);
  background(255);
  smooth();
}
 
void draw() {
  for (int i = 0; i < height; i = i+30) {
    while (x < width) {
      float r = i*variation;
      angle = random(-r, r);
      pushMatrix();
      stroke(0);
      noFill();
      translate(x, y);
      rotate(radians(angle));
      rect(0, 0, squareW, squareH);
      x = x + squareW;
      popMatrix();
    }
 
    x = 0;
    y = y + squareH;
  } 
}

Tentatively I cannot get XCode downloaded and installed on my computer to run openframeworks, so that component is unfortunately incomplete.

Next Page »
This work is licensed under a Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License.
(c) 2013 Interactive Art & Computational Design / Spring 2011 | powered by WordPress with Barecity