Bienvenido P5JS – Más alla de Processing

Avatar de Emiliusvgs - Emilio Vegas

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.

p5js_VIDEO

 

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

video_p5js_example

 

Si deseas recibir más información puedes entrar a la página del proyecto!

Enjoying this article?

Subscribe to get new posts delivered straight to your inbox. No spam, unsubscribe anytime.

No spam. Unsubscribe anytime.

You may also like

See All Posts →

Deja un comentario

This site uses Akismet to reduce spam. Learn how your comment data is processed.