Introducción
Orgull de Baix es un documental web que propone un viaje virtual por la comarca del Baix Llobregat para descubrir el valor agrícola y medioambiental de este territorio, y su rol fundamental para el futuro y la sostenibilidad del área metropolitana de Barcelona. El Baix Llobregat es la puerta sur de la ciudad de Barcelona y el espacio que acoge todas las infraestructuras que le dan servicio (autovías, transportes públicos, puerto, aeropuerto). Un espacio de servicio paradójicamente construido sobre uno de los suelos agrícolas más fértiles de Europa, sobre un río y un delta que permanecen casi ocultos bajo el cemento. Orgull de Baix reivindica el valor de ese suelo y abre el debate sobre su futuro.
Orgull de Baix se compone de un mapa de la comarca realizado en animación 3D web totalmente explorable por el usuario, con 46 secuencias de vídeo o minidocumentales georeferenciados y ubicados sobre el territorio. También incluye un documental lineal de 53 minutos de duración conectado con el mapa a través de esas secuencias. El conjunto es una innovadora propuesta documental que aporta una mirada nueva a un territorio muy transitado y a la vez muy desconocido, habitualmente menospreciado, y que sin embargo es fundamental para garantizar el equilibrio y la sostenibilidad de la vida de los casi 5 millones de personas que transitan diariamente por la región metropolitana de Barcelona.
Orgull de Baix es un espacio interactivo que proporciona una experiencia de viaje virtual sobre la comarca a través de un mapa web navegable, y que además está preparado para alojar mucho más contenido de audio y vídeo georeferenciado. El proyecto ha sido diseñado como una plataforma web pensada para continuar creciendo y añadiendo contenido al mapa 3D, de manera que mantenga vivo el debate sobre el pasado, el presente y el futuro de este territorio, sobre la constante tensión entre suelo urbano y suelo agrario que le acecha, y sobre crecimiento y sostenibilidad en torno a una gran metrópoli.
Orgull de Baix es el primer documental web desarrollado en España utilizando animación 3D web con tecnología three.js, una innovadora y ligera librería de JavaScript de código libre que permite desarrollar gráficos y animación 3D sobre plataformas web, en tiempo real, con la calidad de un videojuego. El proyecto usa esta tecnología para crear una experiencia inmersiva que gracias al 3D permite al usuario explorar libremente, de manera virtual, los espacios agrícolas y naturales de la comarca del Baix Llobregat; descubrir sus rincones, conectar sus paisajes, conocer las historias de quienes lo habitan y las contradicciones que les acechan, invitando al usuario a crear su propio trayecto, su propia reflexión y construir su propia opinión.
El webdoc (documental web interactivo) es un formato audiovisual web emergente que en los últimos años ha incrementado de manera considerable el número de nuevas creaciones a nivel internacional, y que ha despertado un gran interés tanto por parte de autores, como académicos y medios de comunicación. El reciente estudio Radiografía del webdoc a Catalunya, obres i autors dedicado a este nuevo formato de documental interactivo, recoge 30 proyectos de webdoc realizados por productoras catalanas, entre los que destaca Orgull de Baix.
Experiencia de usuario
Orgull de Baix recoge tres tipos de experiencias diferentes:
- El vuelo libre sobre el mapa y la visualización de los clips de vídeo georreferenciados.
- Una visualización del documental lineal vinculado a los clips del mapa.
- Una experiencia de segunda pantalla.
Vuelo libre sobre el mapa
En el diseño y desarrollo de Orgull de Baix, siempre ha estado presente la idea de construir un documental web que proporcione una experiencia de usuario cercana a la del videojuego. Con la librería three.js hemos generado y animado el mapa gráfico 3D que se ve cuando se accede a la web del documental, y que se ha construido utilizando la valiosa información geográfica y de altimetría del Instituto Cartográfico y Geológico de Cataluña. Los visitantes pueden volar libremente por este mapa de la comarca, acercarse, alejarse, girar, explorar y contemplarla desde todos los ángulos.
Situados sobre el mapa (georeferenciados) hay 46 marcadores que contienen piezas de vídeo de entre 1 y 8 minutos de duración. Son pequeños documentales de diferente formato divididos por áreas temáticas (agricultura, espacios naturales, territorio y postales de paisaje) que se identifican por colores e iconos. Cada vídeo es una pieza más de este mosaico que constituye la realidad de este espacio y sus conflictos; mientras unas nos muestran rincones escondidos del territorio, otras nos acercan al trabajo del campo en un espacio fuertemente presionado por el urbanismo, y otras nos invitan a experimentar la belleza de la contemplación de la fauna en los espacios donde las aves continúan tranquilamente con su vida, ignorando el tráfico, los edificios o los aviones que las rodean. El marcador ubicado en el mapa 3D que da acceso a cada pieza documental, indica también el punto exacto dónde se ha grabado el contenido que se muestra. Los visitantes pueden elegir qué contenidos desean ver, en qué orden y cuando. Y pueden también compartirlos en sus redes sociales.
Algunos ejemplos de las 46 piezas que se pueden explorar sobre el mapa 3D navegable son: las postales del Baix Llobregat — sus parajes y entorno, como las vistas desde el puente de Martorell o la ermita de San Ramón —, piezas observacionales que nos sumergen en los espacios naturales — p.ej: espacios de observación y anillamiento de aves en Abrera—, piezas que relatan los condicionantes de la vida agrícola en este peculiar territorio — la vida de los agricultores como Josep Pascual de Sant Joan Despí y sus explotaciones — y piezas que relatan momentos importantes para el desarrollo de este territorio y cómo han sucedido — p.ej: la simbólica tractorada de agricultores de 1978, o la creación del parque agrario—. Los visitantes pueden explorar los contenidos de estos tres ejes temáticos, y descubrir las postales videográficas diseminadas por el mapa 3D de la comarca en el orden que lo deseen.
El documental lineal vinculado al mapa
La experiencia web incluye el documental lineal El pati del darrere (El patio trasero) de 53 minutos, estrenado en el programa Sense Ficció de TV3 en diciembre de 2015, origen del proyecto interactivo. El pati del darrere narra la difícil relación entre el territorio del Baix Llobregat y las necesidades de crecimiento de la metrópolis que es su vecina, la ciudad de Barcelona. El documental muestra la lucha de los habitantes de la comarca para preservar el carácter agrícola del territorio, y sus espacios naturales. Dentro de la web el documental puede verse entero de manera lineal. El pati del darrere actúa de disparador de la experiencia web, ya que al entrar en el espacio de Orgull de Baix, el documental se abre de manera automática delante del mapa en 3D. El usuario tiene libertad para detener, cerrar y retomar la historia en todo momento. Durante el visionado de la película, en varios momentos aparece un icono en el lateral del vídeo, que de ser clicado, traslada al usuario al mapa, y en concreto a la ubicación exacta en la que ese espacio fue filmado, y le ofrece una visión más amplia sobre ese lugar. De esta manera se vincula un documental tradicional con un mapa interactivo en 3D, aportando una nueva capa de lectura al usuario/espectador. El usuario puede ignorar las señales, o seguirlas. En este caso el documental se pausa, minimiza, y un vuelo sobre el mapa 3D nos acerca a la ubicación donde nos situaba el documental de manera que podemos ver un contenido nuevo que amplía o complementa lo que estábamos viendo. El usuario puede decidir continuar viendo el documental tras explorar este contenido extra, o continuar navegando más tiempo por el mapa. Puede también regresar al punto exacto en el que dejó el documental en el momento en que lo decida.
Segunda pantalla
La web está disponible desde el 30 de noviembre en www.orgulldebaix.cat. El lanzamiento del webdoc se realizó ese día conjuntamente con la programación a las 22:15 en el Canal 33 del documental El Pati del darrere. Durante esta emisión la audiencia participó a través de la web de Orgull de Baix en una experiencia de segunda pantalla (second screen). Mientras el Canal 33 emitía El pati del darrere, los espectadores que miraban la televisión con la tableta o el ordenador conectados a la web del proyecto, enriquecieron la experiencia con una exploración guiada del mapa 3D. El sistema respondía a la emisión como si estuviera sucediendo en la misma web, es decir, trasladando a los espectadores de una posición a otra en el mapa, siempre de acuerdo con el minuto del documental en emisión en ese momento, y mostrándoles las secuencias complementarias que completan y aportan una visión de contexto al contenido que se emitía en televisión. Por ejemplo, cuando el documental de televisión mostraba las reuniones y discusiones de los agricultores de la Cooperativa Santboiana los visitantes de la web eran transportados automáticamente en un vuelo virtual al punto del mapa donde se encuentra esta cooperativa y se abría la pieza de vídeo que muestra su interior y los campos que la rodean.
Este lanzamiento marcó un hito para Televisió de Catalunya, ya que fue la primera vez que TV3 hizo una emisión sincronizada entre la televisión y un espacio web. Cerca de 300 usuarios participaron del experimento, viendo El pati del darrere en su televisor mientras tenían abierto el ordenador o tableta para seguir la experiencia en la web (buena parte de estos continuaron en la web después de la emisión en el Canal 33). Por su parte, el documental El pati del darrere, a pesar de ser una reemisión, alcanzó la máxima audiencia de su franja horaria en esta temporada, pasando de 40.000 a 65.000 espectadores. En twitter, la actividad relacionada con la emisión fue muy fuerte (308 mensajes sobre el programa con 20.400 impresiones), y en las cuatro semanas posteriores al estreno, más de 5.700 personas visitaron el webdoc. Dos meses después de su estreno, 7.545 usuarios han visitado ya Orgull de Baix.
Proceso de trabajo
Los primeros pasos de desarrollo del proyecto se enfocaron a idear un espacio web que pudiera acoger todo el contenido y pudiera guiar la experiencia de usuario explorativa e inmersiva que deseábamos. Conjuntamente, guionistas y diseñadores de interacción, revisaron contenidos, materiales y dibujaron la experiencia sobre el mapa 3D. Utilizando wireframes low-fi se concretó el espacio web y se empezó el desarrollo de la plataforma. Sobre este espacio realizamos y aplicamos el diseño gráfico definitivo en alta calidad que utilizamos para maquetar en HTML5/CSS3 y hacer pruebas en los diferentes tamaños de pantalla.
En el desarrollo web, uno de los primeros pasos fue realizar pruebas con la tecnología three.js para ver cuáles eran sus limitaciones, y a qué nivel de resolución podíamos llegar de manera que el entorno fuera viable en dispositivos de todo tipo (móviles, tabletas y ordenadores de escritorio). Llegamos a la conclusión de utilizar como base para la topografía imágenes de 512×512 pixeles, suficientes para mostrar un buen detalle del terreno sin penalizar enormemente el rendimiento del ordenador. Adicionalmente utilizamos la API de Vimeo para sincronizar los puntos de corte del vídeo del documental con los contenidos georeferenciados.
Tecnología
Three.js es la tecnología que hay detrás de Orgull de Baix, con la que hemos generado y animado el mapa gráfico 3D que se ve al acceder a la web y que contiene todos los videoclips georreferenciados. Three.js se utiliza conjuntamente con HTML5 que, entre otras cosas, permite trabajar proyectos web en entorno multiplataforma, como es el caso de este proyecto que funciona en ordenador, tableta y móvil. Esta librería consigue, por una parte, hacer transparentes las diferencias entre la implementación de WebGL (una implementación de OpenGL para web) en los diferentes navegadores, de manera que el programador no debe preocuparse de ellas, y por otra parte simplifica enormemente el desarrollo, ya que la librería three.js, basada en objetos, es mucho más simple que el webGL nativo.
Three.js es una librería de JavaScript muy ligera y eficiente que permite animar gráficos en 3D en la web, gráficos que los navegadores pueden dibujar, mover y animar (renderizar) sin tener que utilizar ninguna otra aplicación. La librería crea modelos 3D a partir de formas básicas – planos, esferas, cubos, etc. – y permite acceder y modificar todos sus vértices. Los relieves topográficos de este proyecto se crean a partir de planos. Accediendo a todos los vértices del plano se modifica su altura haciéndola corresponder a los valores de altimetría creando así el paisaje.
Three.js genera las imágenes y gráficos en 3D mediante WebGL a través del cálculo de polígonos, estructuras y luces. WebGL trabaja directamente con la tarjeta gráfica del ordenador, con lo cual el rendimiento es muy bueno, aunque siempre dependiendo de las capacidades del dispositivo. De esta manera puede determinar formas y asignar la iluminación en el proceso de renderización. WebGL hace una simulación realista de estructuras, ambientes y del comportamiento de objetos y de luces, de texturas y de materiales, donde también hemos añadido animación e interacción. La gran ventaja técnica de three.js es que permite que los cálculos para construir la animación se hagan directamente en el ordenador, en lugar de en el servidor, y por eso es mucho más ligero. WebGL está soportado por la mayoría de navegadores modernos (ver enlace http://caniuse.com/#feat=webgl) y es una de las múltiples mejoras de HTML5 orientadas a convertir HTML/JavaScript en una potente plataforma para crear aplicaciones completas.
La interacción y navegación 3D en espacios creados con three.js se puede realizar de varias formas con algunos de sus controles. Orgull de Baix usa los controles OrbitControls de three.js ya que permiten el vuelo y la exploración de todo el espacio del mapa a partir del clic de ratón y el drag de ratón. Estos controladores sitúan la cámara que renderiza el modelo 3D en una posición X, Y, Z del espacio y el target, punto al que mira la cámara, en otro punto X, Y, Z del espacio. La posición de cámara y el target determinan el cuadro de escena que se renderiza en cada momento. Este fácil posicionamiento y encuadre del espacio permite hacer los travelings de cámara que se ven en el proyecto simplemente interpolando entre dos posiciones. Los usuarios también tienen control sobre la posición de la cámara (zoom, rotación a derecha e izquierda, rotación arriba y abajo) usando el ratón o bien los botones de navegación del interfaz que se encuentran en la esquina inferior derecha.
Para poner en contexto la zona de interés y focalizar la atención de los usuarios en la comarca del Baix Llobregat y en su columna vertebral, el río, el proyecto renderiza tres orografías: en baja calidad y colores blancos se crea el paisaje de Cataluña, que se usa como contexto de referencia; en azul oscuro liso se crea el mar; y en alta calidad con matices verdes se crea la comarca del Baix Llobregat y en azul con transparencia el río. Esta tercera capa de relieve 3D, más detallada y más contrastada, se superpone al contexto general del relieve de Cataluña. Se ha usado para crearla la librería csg.js que permite recortar y sumar modelos 3D integrados en three.js para crear geometrías más complejas.
En este proyecto no existe backend: no utilizamos base de datos (como MySQL) ni apenas lenguajes interpretados en el servidor (como PHP). Todo está basado en JavaScript y el papel de la base de datos lo juega un simple archivo en formato .json, lo que simplifica enormemente el desarrollo y hace que toda la potencia de cálculo esté en el dispositivo del usuario. El servidor se limita a suministrar los archivos (imágenes, JavaScript, HTML).
Para ver otros ejemplos de webs construidas con three.js os recomendamos visitar la web threejs.org.
Redes sociales
Las redes sociales han sido fundamentales para el crecimiento del proyecto, tanto a nivel de creación de comunidad, y notoriedad, como de documentación y de establecer puentes de colaboración con entidades y personas individuales sensibilizadas por el contenido que trata el proyecto y que han colaborado desde diferentes aspectos. El impacto del proyecto en redes es muy notorio, y el hashtag #OrgulldeBaix se ha popularizado de manera espectacular entre la población del territorio.
Conclusiones
Desde su estreno en noviembre de 2016 más de 5.700 personas han visitado ya el webdoc. La función de dar a conocer el valor agrícola y ambiental del territorio del Baix Llobregat y los conflictos que le acosan se ha cumplido con creces, ya que gente de toda Cataluña ha visitado la web, e inesperadamente hemos conseguido un porcentaje destacado de visitas desde fuera de Cataluña, (Madrid, Sevilla y Málaga han sido la segunda, tercera y cuarta ciudades con más visitas durante el primer mes de lanzamiento, detrás de Barcelona). Fuera de España, Nueva York, Tesalónica, o Maracaibo son ciudades desde las que hemos registrado visitas importantes.
Durante 2017 tenemos planteada la realización de proyectos complementarios orientados a difundir el potencial de la plataforma, a activar la participación y a crear nuevo contenido que amplíe el relato. la exploración del potencial del proyecto como herramienta educativa es una prioridad, como lo es también la activación de la reivindicación ecologista sobre este espacio, y el fomento del debate sobre las cuestiones de futuro que afectan a la comarca. Los conflictos que afectan a las necesidades de crecimiento urbano de la metrópolis de Barcelona frente al espacio agrícola y natural del Baix Llobregat, son cuestiones globales que están afectando a muchos otros lugares del planeta. Queremos compartir el debate, alimentarlo y ayudar a encontrar soluciones que favorezcan el crecimiento sostenible de las ciudades del siglo XXI.
Referencias
Web del proyecto
Blog del proyecto
http://www.orgulldebaix.cat/blog
Página del proyecto en TV3
http://www.ccma.cat/tv3/documentals/orgull-de-baix/
Three.js. Proyecto open source dirigido por Ricardo Cabello
“Radiografía del WebDoc a Catalunya. Obres i autors”, Carles Sora
http://repositori.upf.edu/handle/10230/27483
Cita recomendada: CARRERAS, Anna, JULIÀ, Daniel y FERNÁNDEZ, Isabel. «Orgull de Baix», un documental web interactivo. Mosaic [en línea], marzo 2017, no. 147. ISSN: 1696-3296. DOI: https://doi.org/10.7238/m.n147.1709.
¡Muchas felicidades! Un proyecto innovador y que ayudará a dar a conocer esos rincones encantadores del Baix Llobregat 🙂
Congratulations on a wonderful project, and they are always in development thanks to you. Wish you every success in your projects