Toolbox Interactiondesign


Parametrisierbares Raster

DIY grid

Lena Hellmann, 30.07.2013 | Generative Gestaltung Goes Analog bei Prof. Dr. Christine Goutrié

Experiment Rasterzelle

Aufgabe: Die Gestaltung parametrisierbarer Rasterzellen, die durch Verwendung von Variablen schnellstmöglich wandelbar sind.

Die Rasterzellen werden mit simplen Formen gestaltet, die sich auf unterschiedliche Art und Weise, meist durch den Einsatz des Zufallswertes random(), auf dem Bildschirm bewegen.

Im Folgenden wurde mit Füllwerten, Positionen und Formen experimentiert. Aus der Ellipse ergaben sich Kreise. Aus bewegten Linien entstanden stillstehende Linien, die sich in jedem neu aufgerufenen Screen unterscheiden.

noLoop()

…verhindert, dass Processing den Code, geschrieben im void draw(), bis zum Schließen des Fensters in der angegebenen frameRate() wiederholt. Verwendet man noLoop() im void setup(), sollte es in die letzte Linie des Blocks geschrieben werden.

Bezogen auf die Rasterzellengestaltung bedeutet der Einsatz von noLoop() dass der geschrieben Sketch einmal durchlauft und dann stoppt. Hat man einen Sketch verfasst in dem man mit random(), d.h. zufälligen Werten arbeitet, unterbindet man durch noLoop() das stetige „Wiederausführen“ des zufälligen Wertes. Fehlt das noLoop(), wird der Sketch immer wieder ausgeführt. Je nach frameRate(), die Zeit die das ausgeführte Bild pro Frame hat, wirkt das Überschreiben wie ein „Flackern“.

Wenn man noLoop() verwendet, ist es nicht mehr möglich über das Fenster zu interagieren.

 

Programmcodes

/*Aufgabe No.3.1: Parametrisierbare Rasterzellen
  _Dreiecke bewegen sich vertikal
*/


float rand;
int kante = 50;
int abstand = 40;
int rapport = abstand+kante;
int anzH = 6;              //Anzahl Dreiecke horizontal
int anzV = 4;              //Anzahl Dreiecke vertikal
float a;                   //Linienhöhe_Variable
float b;                   //Linienhöhe_Variable2
float LineStartx;   
float LineStarty;
float LineEndx;
float LineEndy;

void setup() {
  size(650,500);
  noFill();
  background(0);
  stroke(255);
  smooth();
  //noLoop();      // Wiederholung sorgt für Dopplung
  
}

void draw() {
  frameRate(2);
  float rand = kante;
  float a = random(kante/2,kante);
  float b = a- kante/2;
  background(0);                      
  for (int i=0; i<anzH; i++) {
    for (int j=0; j<anzV; j++) {
      for (int k=0; k<20; k++) {      
        float LineStartx = rand+rapport*i;                      
        float LineStarty = rand+rapport*j+a;
        float LineEndx = rand+rapport*i+kante/2;
        float LineEndy = rand+rapport*j+b;
        line(LineStartx, LineStarty, LineEndx, LineEndy);      
        line(LineEndx, LineEndy, LineStartx+abstand, LineStarty);
        line(LineStartx, LineStarty, LineStartx+abstand, LineStarty);
        
      }
    }
  }
}

/*Aufgabe No.3.2: Parametrisierbare Rasterzellen
  _Kreise füllen eine Rasterzelle aus
  _Kreise wechseln jede halbe Sekunde ihren Durchmesser
*/

int rand;
int kante = 50;
int abstand = 40;
int rapport = abstand+kante;
int anzH = 6;
int anzV = 4;
int durchM;


void setup() {
  size(800,600);
  noFill();
  background(0);
  noStroke();
  smooth();
  //noLoop();      // Wiederholung sorgt für Dopplung
  
}

void draw() {
  frameRate(2);             
//frameRate beträgt eine halbe sekunde
  float rand = kante*1.5;
  float durchM = random(kante/3);
  background(0);                      
  for (int i=0; i<anzH; i++) {
    for (int j=0; j<anzV; j++) {
      for (int k=0; k<10; k++) {      
        ellipse(rand+rapport*i-random(kante/2), rand+rapport*j-random(kante/2), durchM, durchM);        
// durch /2 laufen alle Linien durch den Mittelpunkt bzw. mittleren Bereich                                                                                                        
//Definition von durchM bewirkt, dass keine Ellipsen sondern Kreise entstehen    
        fill (255,random(30,70));               
 //Füllung weiß mit "random" gewählte Dichte
        
      }
    }
  }
}

/*Aufgabe No.3.3: Parametrisierbare Rasterzellen
  _feststehende Linien aufgrund von noLoop
*/

int rand = 30;
int kante = 20;
int abstand = 40;
int rapport = abstand+kante;
int anzH = 12;
int anzV = 8;

void setup() {
  size(800,600);
  noFill();
  background(0);
  stroke(255);
  smooth();
  noLoop();      
/* nimmt man nun noLoop() aus dem Sketch wird dieser 
ohne Ende wiederholt - Linien bilden sich immer 
wieder neu - Flackern*/
  
}

void draw() {
  for (int i=0; i<anzH; i++) {
    for (int j=0; j<anzV; j++) {
      for (int k=0; k<20; k++) {      // 20 Linien ingesamt
        line(rand+rapport*i, rand+rapport*j, rand+rapport*i+random(kante), rand+rapport*j+random(kante));
        
      }
    }
  }
}

Die erste und zweite for-Schleifen bestimmen die Anzahl der Rasterzellen für Höhe und Breite.

Die letzte for-Schleife geht auf die Größe der Rasterzelle und in der folgenden geschweiften Klammer auf dessen Inhalt ein. Hier sind es in No. 3.1 Dreiecke, No. 3.2 Kreise und No. 3.3 Linien.

Die for-Schleifen werden prinzipiell mit den vor dem void setup() benannten Variablen gebildet. So lassen sich durchdacht Anzahl und Erscheinung der Rasterzellen möglichst schnell ändern.

02.09.2013 | Lena Hellmann |