Tecnologías web modernas en instalaciones de arte y herramientas de visualización

Introducción

Durante los últimos tres o cuatro años he desarrollado una serie de aplicaciones para instalaciones de arte y herramientas de diseño utilizando básicamente los entornos donde me desempeño con mayor facilidad: JavaScript, Canvas, WebGL/Three.js, CSS y Node.

Todo empezó cuando realizaba un prototipo para lo que más adelante podría ser una aplicación en C++ y OpenGL. Empecé creando un boceto en código JavaScript + WebGL/Three.js, usando únicamente el navegador Chrome como target ya que al ser una aplicación off-line, tampoco importaba mucho la compatibilidad con otros navegadores. Los motivos eran obvios: una mayor rapidez para ejecutar algunos experimentos gracias a las prestaciones de Three.js y la flexibilidad de JavaScript; la posibilidad de exponer variables y parámetros fácilmente mediante la librería dat.gui, o tocar valores en tiempo real directamente desde la consola de Google Chrome. Además existe la posibilidad de poner los tests online para compartir directamente con mi cliente, que podría ver los resultados desde cualquier ordenador con el navegador Chrome instalado.

A partir de este momento los experimentos fueron evolucionando en un constante diálogo con mi cliente, que estaba encantado de poder probar los resultados directamente online, sin la necesidad de descargar e instalar software y actualizaciones constantemente. Cuando la dirección del proyecto ya era clara, me planteé si era realmente necesario volver a empezar a desarrollar en C++ con OpenFrameworks, Cinder, etc. La aplicación requería poder generar ficheros de video full HD e imágenes de alta resolución para imprimir en formatos A4 y A3. Además, el cliente prefería tener una aplicación nativa instalada en su ordenador.

Empecé a valorar alternativas y encontré Node-WebKit, que es básicamente un navegador Chromium con un servidor Node incluido que puedes exportar junto a tu aplicación web, y generar una aplicación ejecutable OS X, Windows o Linux, personalizando todos los detalles de la aplicación: nombre, versión, icono, etc. En otras palabras, Node-WebKit (NW.js) permite acceder a cualquier módulo Node directamente desde el DOM, incluyendo acceso al sistema de ficheros y acceso a librerías y herramientas externas como ffmpeg, imagemagick, etc.

Estos son algunos de los ejemplos desarrollados:

1. SAO – Identity Tool

Esta herramienta permite generar y pre-visualizar gráficos 3D en tiempo real generados a partir de datos de geolocalización y audio. Dichos gráficos y animaciones pueden exportarse en imágenes de hasta 16384 × 16384 píxeles para impresión, y vídeo Full HD con canal alpha y efectos de post-processing en alta calidad sin pérdida de frames independientemente de la potencia de la máquina utilizada.

El estudio de diseño sueco Ola Ingvarsson Design utilizó la herramienta como soporte del branding gráfico de una campaña para SAO, una institución que otorga 5 becas anuales a artistas sonoros y músicos.

2. Loop 60 Hz: City Of Drones

En este proyecto trabajé con el estudio londinense de diseño FIELD para crear una aplicación desktop de Chrome que también contiene un servidor Node incorporado. Originalmente fue producida para la exposición “Digital Revolution” en el Barbican de Londres, y se encuentra actualmente online, En su versión física, la aplicación se visualiza en una pantalla de 60 pulgadas y se controla mediante una tableta Nexus 7 que a su vez contiene una Chrome App que se comunica mediante el servidor Node con la aplicación principal.

Créditos: Liam Young (Concepto), Marcus Wendt (Concepto, Dirección creativa y diseño), Eduard Prats Molner (Dirección técnica, Desarrollo, WebGL), Owen Hindley (Desarrollo, WebAudio), John Cale (Música y sonido), Pete Wallace (modelado adicional), Keri Elmsly, Vera-Maria Glahn, Maran Coates (Producción).

3. Been Trill / Art & Fashion Show, NYC

En este caso realicé una pequeña aplicación con Node-WebKit que ejecutaba unos visuales generativos y audio-reactivos sobre un DJ mix. La aplicación se proyectó durante un evento de moda y arte en Nueva York. Con la misma aplicación se podían generar infinitos GIF animados (controlando el frame gap y número total de frames) que fueron utilizados como invitaciones digitales vía email. La aplicación se entregó como ejecutable Mac OS X, sin necesidad de tener conexión o tener que configurar un servidor web local ni nada por el estilo.

Apuntes finales / Comentarios

A parte de los ejemplos arriba mencionados, he participado en proyectos similares, donde se han llevado a cabo procesos parecidos, incluso conectando la aplicación web a motores u otros periféricos de hardware mediante Node.Js. Personalmente, me encuentro muy cómodo realizando proyectos para instalaciones físicas o pequeñas herramientas de software utilizando básicamente tecnologías web modernas. Esto me permite trabajar de forma eficiente gracias a la flexibilidad del entorno y a la infinidad de librerías disponibles, así como a una comunidad gigante de usuarios y contribuidores.

Sin embargo, hay que ser conscientes de que las tecnologías web modernas no son una herramienta viable para cualquier proyecto. Hay, evidentemente, restricciones como las propias limitaciones gráficas y de rendimiento (comparadas con aplicaciones desarrolladas en C++ y OpenGL moderno), así como limitaciones para integrar hardware específico, o proyecciones complejas con múltiples proyectores o pantallas, etc.

De todos modos, las tecnologías web avanzan a un ritmo vertiginoso, los intérpretes de JavaScript son cada vez más rápidos, ES6 más cerca, WebGL 2.0 a punto de ser adoptado por los navegadores modernos, etc.

Cita recomendada: PRATS MOLNER, Eduard. Tecnologías web modernas en instalaciones de arte y herramientas de visualización. Mosaic [en línea], julio 2015, no. 129. ISSN: 1696-3296. DOI: https://doi.org/10.7238/m.n129.1520.