This idea was to try and work with arrays and functions, returning values and using the data within the arrays to continue the development of the script. The optimistic strategy goes as follows;

1. build the ‘setup’ (write the layout of the script, involving randomly placed ellipses, and passing all these values in to the array, for later usage),
2. connect specific network elements to each other by evaluating distance between each component,
3. apply noise() to all components, to make them move around, still updating connections between them,
(4. apply rules of movement – thus transforming them in to boids / agents?).

Step 1.

code for step1:

// Network diagram v1
// written 09-11-13, Claus Rytter Bruun de Neergaard
// clausneergaard.wordpress.com

// (comments removed due to limited column width)

// GLOBAL VARIABLES
int canvas = 900;
int amount = 400;
int minPtSize = 10;
int maxPtSize = 100;

int[] ptsX = new int[amount];
int[] ptsY = new int[amount];

// SETUP + DRAW RANDOM ELLIPSES
void setup() {
  size(canvas, canvas);
  smooth();
  background(255);
  noStroke();
  strokeWeight(0.5);
  fill(0, 170, 250, 40);
  noLoop();

  for (int i = 0; i < amount; i++) {
    int x = rdmValue(0, canvas);
    int y = rdmValue(0, canvas);
    ptsX[i] = x;
    ptsY[i] = y;
  }

  for (int i = 0; i < amount; i++) {
    float r = random(minPtSize, maxPtSize);
    ellipse(ptsX[i], ptsY[i], r, r);
    stroke(0, 100);
    fill(255, 100);
    ellipse(ptsX[i], ptsY[i], 3, 3);
    noStroke();
    fill(0, 170, 250, 40);
  }
}

// FUNCTION RANDOM VALUE
int rdmValue(float bottom, float top) {
  int f = int(random(bottom, top));
  return f;
}

Step 2.

code for step 2:

// Network diagram v2
// written 09-11-13, Claus Rytter Bruun de Neergaard
// clausneergaard.wordpress.com

// (comments removed due to limited column width)

// GLOBAL VARIABLES
int canvasX = 1680;    // canvas size X
int canvasY = 1050;    // canvas size Y
int amount = 4000;     // amount of points on the screen
int minPtSize = 10;    // min size of points/ellipse's
int maxPtSize = 80;    // max size of points/ellipse's

int[] ptsX = new int[amount];
int[] ptsY = new int[amount];

// SETUP + DRAW RANDOM ELLIPSES
void setup() {
  size(canvasX, canvasY);
  smooth();
  background(0);
  noStroke();
  strokeWeight(0.8);
  fill(0, 170, 250, 40);
  noLoop();

  for (int i = 0; i < amount; i++) {
    int x = rdmValue(10, canvasX-20);
    int y = rdmValue(10, canvasY-20);
    ptsX[i] = x;
    ptsY[i] = y;
  }

  for (int i = 0; i < amount; i++) {
    float r = random(minPtSize, maxPtSize);
    ellipse(ptsX[i], ptsY[i], r, r);
    stroke(255, 100);
    fill(0);
    ellipse(ptsX[i], ptsY[i], 2, 2);
    noStroke();
    fill(0, 170, 250, 40);
  }
}

// DRAW
void draw() {
  stroke(255, 40);
  strokeWeight(0.5);

  for (int i = 0; i &lt; amount - 1; i++) {
    for (int j = i; j &lt; amount; j++) {
      if (dist(ptsX[j], ptsY[j], ptsX[i], ptsY[i]) &lt; 100) {
        line(ptsX[j], ptsY[j], ptsX[i], ptsY[i]);
      }
    }
  }
}

// FUNCTION RANDOM VALUE
int rdmValue(float bottom, float top) {
  int f = int(random(bottom, top));
  return f;
}

Step 3.

Okay, so the code for the basic noise()-movement has been created, and acts as shown in the video. Now, the idea is to combine previous network system with the actual movement, while the rules of connection still apply, even though the system is dynamic. The code might need to be restructured to work properly. Still, so far so good.

// fly-boids (noise with array test)
// written 09-11-14, Claus Rytter Bruun de Neergaard
// clausneergaard.wordpress.com

int boids = 200;     // number of boids
int canvasX = 800;   // canvas size x-direction
int canvasY = 600;   // canvas size y-direction
float inc = 0.003;   // move increasement every loop
float nX, nY;

float[] ptsX = new float[boids];
float[] ptsY = new float[boids];

void setup() {
  size(canvasX, canvasY);
  smooth();
  stroke(0, 170, 250);
  strokeWeight(3);
  background(255);
  for (int i = 0; i < boids; i++) {
    ptsX[i] = random(0, canvasX);
    ptsY[i] = random(0, canvasY);
  }
}

void draw() {
  background(0);
  for (int i = 0; i < boids; i++) {
    nX = noise(ptsX[i]) * canvasX;
    nY = noise(ptsY[i]) * canvasY;
    point(nX, nY);
    ptsX[i] = ptsX[i] + inc;
    ptsY[i] = ptsY[i] + inc;
  }
}

Connection written (if dist < 50 then draw connecting line, meaning that each loop this if-statement is evaluated, so that once the boid reaches a distance less than 50, the line will occur, as well as the other way around, of course).

Updated code:

// network studies (perlin noise + array) v3
// written 09-11-15, Claus Rytter Bruun de Neergaard
// clausneergaard.wordpress.com

// comments removed due to limited column width

int boids = 100;     // amount of boids
int canvasX = 700;   // canvas size x-direction
int canvasY = 700;   // canvas size y-direction
float inc = 0.002;   // move increasement every loop

float[] ptsX = new float[boids];
float[] ptsY = new float[boids];
float[] posX = new float[boids];
float[] posY = new float[boids];

void setup() {
  size(canvasX, canvasY);
  smooth();
  stroke(0, 170, 250);
  strokeWeight(1);
  background(255);
  ellipseMode(CENTER);

  for (int i = 0; i < boids; i++) {
    ptsX[i] = random(0, canvasX);
    ptsY[i] = random(0, canvasY);
    posX[i] = ptsX[i];
    posY[i] = ptsY[i];
  }
}

void draw() {
  background(0);
  fill(255);
  stroke(255, 100);
  strokeWeight(1);

  // Update the boids' positions
  for (int i = 0; i < boids; i++) {
    posX[i] = noise(ptsX[i]) * canvasX;
    posY[i] = noise(ptsY[i]) * canvasY;
    ptsX[i] = ptsX[i] + inc;
    ptsY[i] = ptsY[i] + inc;
  }

  // draw the connecting lines
  for (int i = 0; i < boids-1; i++) {
    for (int j = i; j < boids; j++) {
      if (dist(posX[j], posY[j], posX[i], posY[i]) &lt; 50) {
        line(posX[j], posY[j], posX[i], posY[i]);
      }
    }
  }

  // draw the boids (draw them last, so they are not masked by lines)
  for (int i = 0; i < boids; i++) {
    ellipse(posX[i], posY[i], 4, 4);
  }
}

More pictures here, here, here and here.

Here’s the code:

float minLength = 2.0;
int firstBranch = 250;
float reduction = 0.64;

PFont font;

void setup() {
  size(900, 800);
  smooth();
  stroke(1, 255, 40);
  strokeWeight(1);
  noLoop();
  background(0);
  font = loadFont("garamond.vlw");
  textFont(font);
}

void draw() {
  theta = radians(theta);
  translate(width/2, height);
  line(0, 0, 0, -firstBranch);
  translate(0, -firstBranch);
  branch(firstBranch);

  resetMatrix();
  text("angle each step: " + round(degrees(theta)) +
      " degrees", width-200, height-100);
  text("branch reduct. / step: " +
      reduction, width-200, height-80);
  text("minimum branch length: " +
      minLength, width-200, height-60);
}

void branch(float h) {
  h *= reduction;

  if (h < minLength) {

    // make branches to the right
    pushMatrix();
    rotate(theta);
    line(0, 0, 0, -h);
    translate(0, -h);
    branch(h);
    popMatrix();

    // make branches to the left
    pushMatrix();
    rotate(-theta);
    line(0, 0, 0, -h);
    translate(0, -h);
    branch(h);
    popMatrix();
  }
}

Click here to see pdf version. Images of each page below (click to enlarge).

So, I am trying to learn the processing.org language. Rather exciting, and very nerd-ish. All code, of course, is credited to the authors of the book. I’m merely trying to understand it. See code for ‘GenParticle’ here, and ‘LimitedParticle’ here.

I purchased Casey Reas and Ben Fry’s excellent tutorial / handbook (Processing – A Programming Handbook for Visual Designers and Artists’), and at the chapter called ‘Simulate 2: Physics’, some really interesting things starts to happen. My field of interest being architecture, i can’t help thinking about how we could implement some of these experimental approaches when we work with building designs. Intentions and ideas, as well as a huge amount of inspiration can be gathered from these fairly basic code studies.

Also, I’m not interested in ‘digital architecture’ as such, but more in the new possibilities that comes from it – which, in my opinion, demands a various approach and method of work, involving both digital as well as analogue / mechanical means.

From the blog:

’60 Seconds of Architecture is an open international film project where anyone can contribute with a one minute film clip. We urge everyone to produce a 60 second film that deals with architecture in some form. All submissions will be accessible through this website and all the participants are free to use and display these clips (or complete film) as they see fit.

The project seeks to uncover the relationship between, on the one hand, architects theories and practices, on the other hand, public perception of space and architecture. We would like to realize a crossover field where professionals along with everyday people enter a dialogue about the architecture of the future.’

So, we held the exhibition / screening where we looped the edited result of this open source based film project, called ’60 Seconds of Architecture’.

60secondsofarchitecture.blogspot.com
vimeo.com/groups/60secondsofarchitecture

The intentions with this film-experiment is very much about trying to build a bridge between architects and non-architects. This we hoped could be achieve by establishing contact to different educations around Denmark, urging people to upload suggestions and ideas in the shape of a 1 minute long film.

Anders Obbekjær did the editing, based on about 50 clips, that different people from all over the world put together. The result is 15 minutes of compositions, making for new juxtapositions, overlaps and tempo as well as mood.

But this is also where the most interesting part surfaces. Seeing how non-architects reacts to everyday surroundings, how different people experience architecture in relation to general understanding and issues of sustainability – what do they see? Surprising results reveals themselves in these compositions, and hopefully it will inspire and create new discussions and dialogues between people.

‘Tectonics in Building Culture: Textile Blocks’, within the framework of Erasmus, an Education Programme of the European Commission.

Some sketches will follow.

Anyways, this little unintended ‘incident’ looked pretty cool. There’s a lot of structures and patterns to be found within these very vivid geometries. It somehow reminds me a little of the works by Lebbeus Woods.

The idea of the unintended, specified here as generative ‘outcome’ via digital modeling, is quite interesting. It often times happens when drawing on paper with a pencil as well. The small unplanned lines and reactions, which are results of tiny unaware moments, where instinct takes over, sometimes provides for extremely interesting results. I’ve experienced it in some of my earlier projects, while trying to manifest some sort of system within all the intentions and wishes. Random thoughts.