El mundo processing, un mágico espectro de opciones. Conforme ha ido evolucionando hemos visto diferentes «port» que se han desarrollado en paralelo. El padre processing y lo hijos que trabajaban a la par para leer y armar paquetes. Hace unos días se presentó en redes sociales algo distinto y original. Se llama P5JS que a simple vista la mayoría pensaba que era la abreviatura de Processing.js
Como su propia página lo indica, P5JS proviene de la idea original de processing pero no tiene límites respecto a la creación de dibujos en canvas o procesos creativos. Ahora podrás crear desde el sketch y pensar para web sin obstáculos pues permite agregar addons, librerías y fusionar con elementos y códigos web de HTML5 (video, imagen, webcam y sonido). Suena genial y es genial! Los límites del port processing era un proceso que obstruía el trabajo muchas veces. Ahora tenemos la libertad de armar y formar desarrollo más complejo e importante. Desde mi punto de vista era necesario para que Processing siga un rumbo más multiplataforma. Imagínate trabajar como editor de texto cualquier (Sublime Text) y armar tu web sin preocuparse de otros tipos de lenguaje. Totalmente interactivo, intuitivo y poderoso.
Para muestra podemos visitar su ejemplos interactivo. En él aparece Lauren McCarthy la encargada principal y la propulsora del proyecto. Además aparece el maestro Jedi Dan Shiffman.
El proyecto aún está en proceso, por lo que necesitan de nuestra ayuda para poder contribuir y generar la documentación necesaria para armar una solida comunidad. Ah! Y si desean crear librería sientate en la libertad de hacerlo. Yo estoy tratando de crear una librería básica para aportar mi granito de arena.
Los archivos P5JS comprende el core p5.js, p5.dom.js, el archivo librería que realiza demasiadas funciones como video, audio y dibujo; también está p5.sound.js que como su nomenclatura lo dice permite la reproducción e interacción y ejemplos.
var capture;
function setup() {
createCanvas(390, 240);
capture = createCapture(VIDEO);
capture.size(320, 240);
//capture.hide();
}function draw() {
background(255);
image(capture, 0, 0, 320, 240);}
Este ejemplo junto a la base del dom y código de inicio hace posible activar la cámara web. Puedes ver el código de ejemplo aquí o darle clic en la imagen
Si deseas recibir más información puedes entrar a la página del proyecto!