Nuestro socio Stefan Drews nos ha escrito contándonos que quería aprender sobre visualización de datos y sobre las herramientas o software que utilizamos para crear visualizaciones como las que muestran la evolución de los trasvases del Tajo al Segura o los pasajeros de los vuelos oficiales. Hemos pensado que mi respuesta podría ser interesante, así que aquí va:
Te cuento un poquito. En Civio realizamos todas nuestras visualizaciones con una librería open-source de JavaScript muy popular y potente llamada d3.js. Los pros que tiene es que podemos hacer literalmente cualquier cosa que queramos. Es completamente flexible. Los contras , que esto tiene un coste… no monetario, sino de tiempo. Tiene una curva de aprendizaje bastante ardua, y cada pieza requiere bastante tiempo, porque digamos que se programa todo desde cero. No hay plantillas de gráficos etc.
Como en Civio no hacemos cosas rápidas para salir del paso, sino que nos gusta realizar investigaciones periodísticas con tiempo y cariño, para los gráficos que las acompañan d3.js es el software perfecto. Es decir, si te interesa hacer piezas interactivas custom donde tengas control total de todas la interacciones y del diseño, te animo muchísimo a ir a por ella.
Como recomendaciones para aprender, me parece muy importante tener primero una base en programación web, concretamente en HTML, CSS y JavaScript vanilla. Cuanto más base tengas, más fácil te será dar el salto a d3.js. Empezar por d3.js sin ningún fundamento web puede ser bastante frustrante, no te lo recomiendo.
En cuanto a cosas más concretas, te recomendaría:
- Este libro de Scott Murray es un clásico estupendo. La versión de d3 que usa no está actualizada, pero aún así sigue siendo el mejor de todos los materiales que he visto por ahí para aproximarse a d3.js, es un gran referente a nivel didáctico.
- Animarte a empezar tu andadura con d3.js usando Observable , una plataforma online maravillosa donde programar y aprender. Te animaría a que te crearas una cuenta gratuita y empezases a bichear con calma estos recursos didácticos. Nosotros en Civio lo usamos intensivamente desde hace un año y medio. Aquí puedes ver nuestros gráficos con su código, y la verdad es que nos encanta como entorno.
- Animarte a participar en el canal de Slack de la comunidad d3.js, un espacio donde preguntar y responder dudas, compartir recursos, etc. Hay canales específicos por temáticas, idiomas, etc. La comunidad es muy muy maja. Ya verás.
- También te animaría a acudir a todos los Meetups de la comunidad que puedas, se aprende muchísimo. En el grupo de d3.js suele estar activa la comunidad en español que lleva un profesor de Colombia, John Alexis Guerra (que por cierto tiene un montón de recursos docentes en Youtube de d3.js estupendos tanto en español como en inglés), haciendo un evento mensual online para compartir cosas de visualización. Yo suelo participar. En el grupo de Observable hay bastante movimiento también. Verás que hay encuentros casi semanalmente. El equipo que hay detrás es muy muy majo.
Lo dicho, si lo que te interesa es aprender el tipo de gráficos que nos has referenciado, d3.js es la manera. Si por el contrario prefieres aproximarte al campo de la visualización de una forma más rápida y directa, en ese caso te recomendaría tantear otros softwares tipo Datawrapper, Flourish, Tableau, etc. No te puedo concretar mucho sobre ellos porque no los he usado nunca, pero seguramente encontrarás información fácilmente. Los pros de estos softwares es que son más sencillos de usar, creo que no tienes ni que programar para usarlos. Los contras , que solo podrás hacer lo que cada programa te permita hacer, es decir, elegir entre el catálogo de gráficos disponibles, etc.
Os recordamos que las socias y socios de Civio, como Stefan, disfrutan de acceso prioritario al equipo para resolver cualquier duda. Así que si nos apoyas puedes escribirnos con con dudas y sugerencias, que estaremos encantadas de responderte.