Categories
Generative Gestaltung

Reise nach Kiuwq [Part 1]

Erkundungsflug

Die einmotorige Propellermaschine flog tief unter dem Radar. Kundig steuerte Sir Peter Fiver, von Freunden auch „p5“ genannt, das kleinen Flugzeugs auf die stillgelegten Anlagen um Kiuwq zu. Es war ein Erkundungsflug wie viele andere zuvor. Auf seinem rechten Bein lag die lederne Tasche mit der Kamera. Als er die verfallenen Gebäude der Anlage überflog stellte er fest, dass die Natur hatte schon lange begonnen hatte, alle Bereiche der geheimen Anlagen wieder zu überwuchern. Er beschloß beim nächsten Mal die Anlagen genauer zu studieren. So etwas Großes hatte er noch niemals zuvor gesehen.


Exploration flight The single-engine propeller plane flew deep under the radar. Sir Peter Fiver, also known as „p5“ by friends, skilfully steered the small plane towards the decommissioned facilities around Kiuwq. It was an exploration flight like many others before. The leather bag with the camera was on his right leg. As he scanned the dilapidated buildings of the facility, he found that nature had long since started to overgrow all areas of the secret facility again. The next time he decided to study the systems more closely. He had never seen something so big before.

Aufgenommene Luftbilder der Anlagen um Kiuwq

Code – Reise nach Kiuwq

Peter Fivers Reise nach Kiuwq ist ein Zusammenspiel von Phantasie, Sprache und Code. Alle gezeigten Bilder sind das Resultat einer Kette an Anweisungen in JavaScript. Für Matthias Jäger stehen sie aber im Kontext einer poetischen Geschichte über eine geometrische Welt. Er veröffentlicht deshalb Processing Code, Bilder und Stimmungstexte zusammen.

Probieren Sie das Programm hier selbst aus:
https://editor.p5js.org/matthias-jaeger-net/present/EhTPNAz7P

/**
 * Reise nach Kiuwq – Part 1
 * Author: Matthias Jäger
 * Date: 2020-04-11
 */

/** TEXTURES */
// ---------------------------------------------------------------------- //

/** Returns a p5.graphicbuffer filled with an amount of black points */
function dottedTexture(w, h, a) {
  const tex = createGraphics(w, h);
  for (let i = 0; i < a; i++)
    tex.point(random(w), random(h));
  return tex;
}

/** Returns a p5.graphicbuffer with a grid of squares based on factor a */
function gridTexture(w, h, a) {
  const tex = createGraphics(w, h);
  const s = w / a;
  tex.noFill();
  for (let i = 0; i < w; i += s)
    for (let j = 0; j < h; j += s)
      if (random(0, 1) > 0.4) tex.rect(i, j, s, s);
  return tex;
}

/** Returns a p5.graphicbuffer with an ammount of horizontal lines */
function linesTexture(w, h, a) {
  const tex = createGraphics(w, h);
  for (let i = 0; i < a; i++) {
    const x1 = 0;
    const y1 = random(h);
    const x2 = w;
    const y2 = y1;
    tex.stroke(0, 120);
    tex.line(x1, y1, x2, y2);
  }
  return tex;
}

/** Translates randomly based factor used as minimum and maximimum */
function randomTranslation(factor) {
  const f = width * factor;
  translate(random(-f, f), random(-f, f), 0);
}


// MAIN PROGRAM FUNCTION
// ---------------------------------------------------------------------- //

/** setup is automatically called by p5 */
function setup() {
  
  // Set a square drawing area with the 3D renderer
  createCanvas(800, 800, WEBGL);
  // Camera position (x, y, z), Focal point (x, y, z) UP dircetion (x, y, z)
  camera(0, 0, 780, 0, 0, 0, 0, 1, 0);
  // White ground
  background(255);
  // No lines, textures only
  noStroke();
  
  // Ground plane – Multipe images
  const sclWidth = width * 1.2;
  const sclHeight = height * 1.2;
  image(dottedTexture(sclWidth, sclHeight, random(900, 9000)), -450, -450);
  image(linesTexture(sclWidth, sclHeight, 4), -450, -450);
  
  // Rotate randomly
  rotate(random(TAU));

  // Trees
  for (let i = 0; i < 210; i++) {
    push();
    randomTranslation(0.5);
    texture(dottedTexture(100, 100, random(1000, 3000)));
    sphere(random(50));
    pop();
  }

  // Buildings
  for (let i = 0; i < 10; i++) {
    push();
    randomTranslation(0.3);
    texture(gridTexture(200, 200, random(10, 30)));
    box(random(300), random(300), random(300));
    pop();
  }

  // Randomly rotated dotted "walls"
  for (let i = 0; i < 10; i++) {
    push();
    translate(0, 0, 20);
    randomTranslation(0.4);
    rotate(random(TAU));
    fill(255);
    texture(dottedTexture(100, 100, random(1000, 3000)));
    box(random(500), random(5, 12), 20);
    pop();
  }
  
  // End of composition
  save("Reise-nach-Kiuwq-part-1.jpg");
}