Módulo Infografía Digital (MID) del Diplomado en Infografía de la Escuela de Diseño UC - 2024

Enfoque del módulo

Digitalizar una infografía es distinto que pasarla del papel a la pantalla. Más relevante que un paso de átomos a bits es el paso de un contenido que debe ser estático, y cuya exploración tiende a ser lineal, a un contenido que puede ser dinámico, y cuya exploración tiende a ser interactiva.

Por lo recién dicho, en este módulo se invitará a cada etudiante a "replantear" su trabajo en infografía a un formato variable que, siendo digital, interactivo y/o dinámico, se enfrentará a distintos usos y costumbres de lectura, exploración y propagación en una red a todo lo ancho del mundo (World Wide Web; WWW).

Aceptar la invitación implicará hacer como Brian Wang, quien replantea un trabajo infográfico de la siguiente manera:

The rabbit hops in → https://multimedia.scmp.com/culture/article/SCMP-printed-graphics-memory/lonelyGraphics/202301A318.html
All you need to know about the Year of the Rabbit → https://multimedia.scmp.com/infographics/culture/article/3206232/year-of-the-rabbit/index.html

¿Cómo hace Brian Wang? ¿Mantiene los mismos elementos? ¿Mantiene orden y jerarquías? ¿Notaron cuáles son las fechas de publición de cada versión?

En otro ejemplo es posible notar que hasta el equipo se puede replantear:

Victor Sanjinez y Marcelo Duhalde → Bamboo curtains → https://multimedia.scmp.com/culture/article/SCMP-printed-graphics-memory/lonelyGraphics/202206A309.html
Marcelo Duhalde, Victor Sanjinez y Dennis Wong → Bamboo scaffolding in Hong Kong → https://multimedia.scmp.com/infographics/culture/article/3183200/bamboo-scaffolding/index.html

¿Puede notar que en una esquina inferior de la infografía impresa de Bamboo curtains, debajo de un código QR, dice scan for a deep dive of this graphic online?

Lo digital, interactivo y dinámico en la WWW nos ofrecer la posibilidad de un deep dive. Y por tal posibilidad corresponde replantear elementos, orden, jerarquías, e incluso equipos de trabajo, tal como pudieron ver en los ejemplos recién referidos o podrán encontrar en:

Lo impreso: https://multimedia.scmp.com/culture/article/SCMP-printed-graphics-memory/
Lo digital: https://www.scmp.com/infographic/
Más ejemplos de lo digital, sin impreso: https://www.reuters.com/graphics/

En cada ejemplo de lo digital, por el hecho de su despliegue en una página web, nos podemos asomar a un código fuente.

En este módulo haremos una introducción teórico-práctica a tal código, para que ya no sea como una "matrix", sino una base más o menos legible con la que podrán implementar una infografía replanteada.

Herramientas para el módulo

Para este módulo sería ideal contar con una doble pantalla; una para Zoom y otra para el uso de las siguientes herramientas:

navegador web (Chrome o Firefox; NO utilizaremos Safari). Es muy necesario que desactiven los traductores en el navegador que utilicen, porque la traducción automática (y forzada) al español puede complicar un trabajo que se hace en inglés. También es necesario que sepan como "Ver el código fuente de la página", inspeccionar elementos y abrir consola
editor de código fuente (Sublime Text o Phoenix Code Editor)
cuenta personal en GitHub, para:
- crear repositorios
- activar GitHub Pages en cada repositorio creado

Las cinco clases del módulo

Cada estudiante usará primero una cuenta personal en GitHub, y al final usará una cuenta de organización (a la que accederán sólo si ya tienen cuenta personal con acceso a la organización).