Vintage Computational Art

Para comenzar este blog voy a mostrar un simple código usando la herramienta Processing, gracias al cual con tan solo unas líneas de código se pueden llegar a crear gráficos muy interesantes. En un principio, tratando de recrear lo que se podría denominar como ‘Vintage Computational Art’, solo con unir dos puntos de dos ecuaciones paramétricas dibujando una linea entre ellas y dejando el rastro de esta línea dibujando unas cuantas más detrás se pueden obtener imágenes muy curiosas, si esto lo multiplicas por dos y cambias el color ocurre lo que se observa en el siguiente vídeo:

Los valores de las ecuaciones varían en torno a la posición X e Y del ratón en la pantalla, de ahí viene ese movimiento extraño que se observa.

Un código muy similar para obtener en Processing lo visto en el vídeo sería el siguiente:

static final int NUM_LINES = 24;
float t;

void setup(){
  background(20);
  size(1280,720);
  //fullScreen();
}

void draw(){
  background(20);
  stroke(255);
  strokeWeight(5);

  translate(width/2,height/2);

  for (int i = 0; i < NUM_LINES; i++){
    stroke(100 + i, 20 +  i, 40);
    line(x1(t + i), y1(t + i), x2(t + i), y2(t + i));
    switch(i){
      case 0:  point(x3(t + i), y2(t + i)); break;
      case 4:  point(x3(t + i), y2(t + i)); break;
      case 12: point(x3(t + i), y2(t + i)); break;
    }
  }
  stroke(255,0,0);
  for (int i = 0; i < NUM_LINES; i++){
    stroke(10 + i, 130 +  i, 50 + i);
    line(x3(t + i), y3(t + i), x4(t + i), y4(t + i));
    switch(i){
      case 0:  point(x4(t + i), y2(t + i)); break;
      case 10: point(x4(t + i), y2(t + i)); break;
      case 20: point(x4(t + i), y2(t + i)); break;
    }
  }

  t += 0.4;
}

float x1(float t){
  return sin(t / mouseX * 20) * 100;
}

float y1(float t){
  return cos(t / mouseY * 20) * 100;
}

float x2(float t){
  return sin(t / mouseX * 20) * 230;
}

float y2(float t){
  return cos(t / mouseY * 20) * 200;
}

float x3(float t){
  return sin(t / mouseX * 20) * 80;
}

float y3(float t){
  return -cos(t / mouseY * 20) * 40;
}

float x4(float t){
  return sin(t / mouseX * 20) * 30;
}

float y4(float t){
  return -cos(t / mouseY * 20) * 100;
}

Un comentario sobre “Vintage Computational Art

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión /  Cambiar )

Google photo

Estás comentando usando tu cuenta de Google. Cerrar sesión /  Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión /  Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión /  Cambiar )

Conectando a %s