¡Hola! Traigo nuevamente mi querido processing. La herramienta con la que descubrí el mundo del código generativo. Hoy te traigo un proyecto que inicié hace 10 años y son mis primeros pasos relacionados a efectos de cámara y realidad aumentada. Esta es una proyección donde el video de tu webcam se transforma en líneas y vértices de colores mientras toda la composición se mueve haciendo paisajes futuristas. Hoy hablaremos de la magia del código, el código generativo con processing.
Processing fue, es y será una herramienta espectacular para crear experiencias inmersivas, proyecciones y composiciones de multimedia artísticas. Si tu estas interesado en comenzar o experimentar con código creativo, processing tiene una curva de aprendizaje no tan elevada y lo mejor de todo es que Open Source. Descarga su última versión y elige una carpeta.
Luego, lo que necesitamos, es obtener una librería peculiar que nos permitirá mover la proyección de la cámara con el mouse. De esta manera aumentamos la interacción del trabajo. Peasy Cam puede lograr eso. Antiguamente se descargaba la librería y se arrastraba a la ventana de trabajo de processing. Muchas cosas han cambiado.
- Ahora la forma como importamos librería ha cambiado. Al entrar a nuestro programa processing iremos a “herramientas” y luego accederemos a librerías. Allí buscaremos peasycam. Lo seleccionamos y lo instalamos.
- El código de processing 1.5 es cambiante al processing 3, ya no se permite el uso de OpenGL. Quizá es una evolución que contribuye a abrir nuevas opciones de trabajo acorde a los nuevos tiempos. Por ejemplo ahora se permite WebGL pero través de otras plataformas como P5JS. Pasaré rápidamente a explicar las partes importantes del códigos:
Código generativo
import peasy.; import processing.video.;
Capture video;
PeasyCam cam;Al principio importaremos y mencionaremos las librerías que trabajaremos que son peasycam y video.
void setup() {
size(640,480,P3D);
cam = new PeasyCam(this, 100);
cam.setMinimumDistance(5);
cam.setMaximumDistance(1000);
frameRate(30);
video = new Capture(this, width, height, 30);
String[] devices = Capture.list(); println(devices); video.start();
}Luego en void setup está toda la información para la configuración del proyecto. Allí declararemos el tamaño de la ventana, cómo va trabajar peasycam y las funcionalidades del video (framerate, captura del dispositivo, entre otros).
void draw() {
noFill();
lights();
strokeWeight(2);
background(250,250,250);
pushMatrix();
if (video.available()) {
video.read();En void drawn ya veremos la experiencia creativa: nofills, lights, strokeweight están relacionados con el pintar el lienzo a través de líneas. En background hablamos directamente del fondo y el color que usaremos en el.
video.loadPixels();}
translate(-width/2, -height/2, 0);
for (int y = 0; y < video.height; y+=4) {
beginShape();
for (int x = 0; x < video.width; x++) {
int pixelValue = video.pixels[x+(y*video.width)];
stroke(0,brightness(pixelValue),64,390);
vertex (x, y, (brightness(pixelValue)/0.9)-100);
}
endShape();
}
popMatrix();
}video.loadpixel iniciará el proceso para leer los proximos elementos que transformarán la imagen utilizando shape, pixelvalue, stroke, vertex
El código generativo es una experiencia enriquecedora que te permite expresarte libremente. Creo yo, dede mi humilde opinión, que sin un mensaje o algo que transmitir, quizá esta proyección pasará desapercibida.
Patreon
Si desear apoyarme para mantener mi sitio web y mis tutoriales, por favor accede a mi patreon. Seguiré brindando más información sobre Código Generativo con Processing.
