Generative Architecture. - OpenProcessing

mySketch
xxxxxxxxxx
 
function setup() {
  createCanvas(800, 800);
  loop();
}
​
function draw() {
  background(30); // Preto de fundo
​
  // Linhas / streets? before buildings
  drawLinhas();
  
  // Camadas principais
  drawMainStructures();
  
  // Elementos adicionais: linhas e blocos pequenos
  drawDetailing();
  
  noLoop();
}
​
function drawMainStructures() {
  const CLRS = [
    color(50, 50, 50), // Cinza escuro
    color(200, 100, 50), // Laranja industrial
    color(100) // Cinza médio
  ];
​
  noStroke();
  for (let i = 0; i < 5; i++) {
    let x = random(width * 0.1, width * 0.7);
    let y = random(height * 0.2, height * 0.8);
    let w = random(100, 300);
    let h = random(100, 300);
​
    fill(random(CLRS));
    rect(x, y, w, h);
​
    // Sobreposição com transparência
    const clr = random(CLRS);
    clr.setAlpha(180);
    fill(clr);
    rect(x + random(-30, 30), y + random(-30, 30), w * 0.8, h * 0.8);
  }
}
​
function drawDetailing() {
  // Pequenos blocos decorativos
  noStroke();
  fill(200, 100, 50); // Laranja
  for (let i = 0; i < 15; i++) {
    let x = random(width);
    let y = random(height);
    let w = random(20, 50);
    let h = random(20, 50);
    rect(x, y, w, h);
  }
}
​
function drawLinhas() {
  stroke(255, 100); // Cinza claro para linhas de detalhe
  strokeWeight(2);
  
  // Linhas horizontais
  for (let y = 50; y < height; y += random(50, 150)) {
    line(0, y, width, y);
  }
​
  // Linhas verticais
  for (let x = 50; x < width; x += random(50, 150)) {
    line(x, 0, x, height);
  }
​
}
​
function mousePressed() {
  if (mouseButton != RIGHT) setup();
}