Visualizando sobornos multimillonarios con PhaserJS

Ir a la visualización

Harald Waxenecker, junto a Nómada y Paraíso Desigual han desarrollado una investigación sobre la captura de las inversiones públicas en Guatemala. La investigación es extensa y detallada. Va desde analizar los contratos judicializados hasta a  explorar las redes de contratistas, intermediarios y entidades públicas. Se puede encontrar aquí. Nómada publicó una entrevista for dummies hecha al investigador aquí.

He podido colaborar con este proyecto haciendo una visualización de los datos de los contratos adjudicados. La idea era visualizar el precio de mercado de las obras y también visualizar el monto del capital capturado en sobornos y otras formas (no estoy seguro cuáles son esas otras formas, pero HW le ha llamado “excedente de captura” y parece que es dinero que queda como ganancia a las empresas intermediarias o a los meros contratistas).

La visualización está inspirada en el trabajo hecho por Periscopic para demostrar la cantidad de años perdidos por personas que mueren por balas perdidas. En este caso, la idea es mostrar el dinero perdido debido a la captura de la economía de contratos públicos en Guatemala.

Se ha necesitado visualizar ~13 mil casos de contratos, de los cuales hay muchos que han sido judicializados y se ha podido saber cuánto dinero fue dedicado a sobornos y cuál era el valor competitivo de la obra.

Pensaba utilizar d3.js para esta visualización, pero dibujar 13 mil elipses no sería muy amigable con el explorador. Así que utilicé Phaser.js, que es una librería para la creación de videojuegos en el explorador. Phaser.js permite manejar canvas, imágenes, sprites, animaciones, sonidos y muchas otras cosas. Lo he usado principalmente para usar sus capas de canvas y para los tweens (objetos que permiten hacer animaciones suaves y óptimas).  Esta librería me ha permitido hacer una animación que va agregando líneas y actualizando los números totales en el resto de la infografía. Tras unos segundos, las 13 mil líneas quedan pintadas en el canvas, plasmando un enjambre  de medias elipses neón.

Extrañe la elegancia de d3.js, pero valió la pena usar PhaserJS para este proyecto.