Saltar al contenido
Arte12

El arte de la infografía (y cómo hacer la tuya)

Las infografías toman datos e información complejos y los traducen en elementos visuales fáciles de entender. En el mundo acelerado de hoy, los diseñadores gráficos necesitan expresar el punto de manera simple y eficiente.

En este artículo, veremos varias infografías y sus cualidades inherentes, luego ofrecemos un breve tutorial para ayudarlo a crear uno propio.

 resume infographic
Currículum personal de Tibor van den Brink (a través de Behance )

Datos de texto a datos gráficos

A la derecha vemos el currículum de un diseñador gráfico diseñado Como una infografía. Él ingeniosamente convirtió sus estadísticas en gráficos con estilo que hacen que las estadísticas secas sean mucho más dinámicas.

Imágenes como esta le dan a Tibor van den Brink la oportunidad de agregar color e intriga estética, dos factores que naturalmente se destacan de un currículum tradicional y atraen a un espectador

Aquí, podemos evaluar rápidamente que Tibor es 100% fluido en holandés y aproximadamente 88% en inglés, gracias a un simple gráfico circular. Utiliza otros métodos inteligentes, como iconos para sus pasatiempos y “medidores” para mostrar rápidamente su nivel de habilidad en varios programas y conceptos de diseño.

Instantáneamente, vemos que tiene un nivel de habilidad del 75% en Photoshop, Illustrator e InDesign . Toda su información se comunica de manera simple y concisa (y refrescante), que supera a las largas frases sobre su historia con Adobe Creative Suite.

Las imágenes (y los diagramas) valen más que mil palabras

 Infografía del cubo de Rubik [19659012] Cómo hacer un cubo de Rubik por Álvaro Herrero (vía <a href= Behance )

Todo el mundo sabe el famoso dicho “una imagen vale más que mil palabras”. Este dicho habla fuertemente sobre el poder de la infografía: los seres humanos son criaturas visuales. Donde el texto requiere tiempo y procesamiento mental, las imágenes a menudo son instantáneas y viscerales.

El ejemplo de infografía anterior utiliza una serie de diagramas para explicar el funcionamiento de un cubo de Rubik. Dada la complejidad de los cubos de Rubik, tomaría al menos mil palabras para explicar lo que estos diagramas muestran de manera rápida y visual. Además, esta infografía es colorida y divertida de ver. Es, sin lugar a dudas, preferible a una explicación textual de un Cubo de Rubik.

Flujo

 infografía de creación de calzado
Infografía de zapatos por Anton Yermolov (a través de Behance )

Infografía tiene Flujos visuales inherentes. Es importante recordar esto al diseñar una infografía. Al igual que con cualquier pieza de diseño, el diseñador es responsable de llevar a los espectadores a través del diseño.

La infografía a la izquierda muestra el proceso de fabricación de un zapato en tres pasos. Si criticáramos esta pieza, podemos decir que el ojo comienza con el título en la parte superior y naturalmente gravita hacia el zapato grande en el techo.

Luego, este zapato grande nos lleva al Paso 3 del proceso. en la burbuja de aumento. ¡Ouch! Esperábamos comenzar en el Paso 1 …

Si bien esta infografía es colorida y hermosa, claramente tiene problemas de flujo. Una solución para esto podría ser colocar el paso tres en la planta baja de este edificio y el paso uno en la parte superior cerca del zapato grande.

En otra crítica, podemos decir que los gráficos no necesariamente comunican muchos datos de texto o de otra manera . Por ejemplo, en el paso “Producir”, vemos dos figuras sentadas en sillas con zapatos, pero esto no necesariamente nos da más información o sentimiento acerca de este paso más allá de la palabra “Producir”. Lo mismo se podría decir para “Diseñar” y “Dibujar”.

Dando datos sensación

 ejemplo de infografía
Infografía de bosque por Anton Egorov (vía Behance )

La buena infografía representa una Emoción así como una selección de datos. En otras palabras, le dan al espectador una reacción visceral como resultado de la comprensión instantánea y / o rápida que brindan las infografías.

El ejemplo anterior muestra un porcentaje simple de propiedad de la tierra, pero le da a este dato un sentimiento complejo al ofrecer una Gráficos complejos y realistas. La mayoría de la gente podría no saber que la propiedad de la tierra en los Estados Unidos está separada de esta manera, y ver esta imagen de la tierra cortada y cercada puede naturalmente provocar sentimientos de preocupación, o un impulso para aprender más sobre este tema.

 cómo detectar una mentira infografía
Infografía de “Cómo detectar una mentira” por Lisa Woomer (vía Behance )

Guía con iconos

En otro estilo de infografía, los iconos se usan en conjunto con texto para ayudar a guiar al espectador a través de los datos. El ejemplo de la derecha logra exactamente eso al explicar cómo detectar una mentira.

En el Paso 1, en lugar de explicar cómo se verían estos gestos con las manos, se usan tres imágenes efectivas. En última instancia, estos gestos son más fáciles de mostrar en la ilustración que en la escritura.

En otro método, el Paso 2 conecta directamente un gráfico a las explicaciones textuales, utilizando el texto como “títulos” para las direcciones en las que los ojos pueden verse si están mintiendo . Este enfoque también es efectivo y tiene un flujo circular agradable alrededor del gráfico del ojo.

El paso 4 usa un gráfico de una manera diferente. Para articular visualmente la “escucha de indicadores vocales”, se utiliza una imagen de una onda de sonido. Esto es menos efectivo que los gráficos del Paso 1, ya que en realidad no muestra ningún dato o información. Dicho esto, proporciona intriga visual y coherencia con el resto del diseño, que puede valer algo y, en última instancia, justifica el gráfico.

Haciendo que los datos sean atractivos

 Visualización de datos
por Valentina D ‘ Efilippo (a través de Behance )

Más allá de las cualidades funcionales y prácticas de la infografía hay otro uso, que hace que los datos sean atractivos y hermosos. En el ejemplo anterior, el efecto del cambio climático en la línea de tiempo de la primavera se representa visualmente en un “dial de sol” utilizando conjuntos de datos sobre aves, árboles y temperaturas.

Si bien el tema es alarmante, el gráfico es suave, Inocente y atractivo. La paleta de colores es divertida y sofisticada, y la flor geométrica atrae al espectador al diseño. La naturaleza visualmente fascinante de esta pieza probablemente inspirará a más lectores a investigar los datos que un simple diseño de texto.

Cómo hacer tu propia infografía

En este tutorial usaremos Photoshop para crear una infografía que represente un dato comparación entre andar en bicicleta y tomar el tren desde Washington Square Park en Manhattan hasta el centro de Williamsburg en Brooklyn. Según Google Maps se tarda 18 minutos en bicicleta entre estos dos puntos y 30 minutos para tomar el tren.

¡Exploremos cómo podemos representar estos datos gráficamente!

 t1

Para comenzar, una captura de pantalla de Google Maps Se puede pegar en nuestro archivo de Photoshop y desaturar. Al aprender del ejemplo inicial de Tibor van den Brink que aborda el color y la atracción estética, la ruta en comparación se puede resaltar en amarillo.

El marco del mapa también es de color amarillo y está diseñado para dejar espacio para el texto en la parte superior. Este contenido descansa sobre un fondo gris oscuro para el contraste y está cubierto con una textura de papel sutil para darle una sensación de “mapa”.

 t2

A continuación, con el ejemplo “Cómo detectar una mentira” en mente , podemos traer algunos íconos para ayudar a articular los datos. Aquí usaremos un icono de bicicleta mínimo y un icono de tren mínimo. A lo largo de este flujo creativo, podemos agregar “rastros” de longitud variable a los iconos que coinciden aproximadamente con la duración relativa de cada viaje.

Se elige cuidadosamente un azul-verde complementario. ¡Recuerde que queremos que estos datos sean lo más atractivos posible!

 t3

Por último, podemos agregar nuestro texto. Se elige un título simple y conciso y los minutos se configuran en una fuente grande y fácil de leer. Esta infografía es exitosa porque traduce gráficamente muchos datos basados ​​en texto, incluyendo la ruta del mapa, los métodos de transporte que se comparan y el cronometraje.

También es exitoso porque hace que estos datos sean atractivos. El diseño es colorido, profesional, limpio y simple.

Conclusión

Las infografías vienen en muchas formas. Pueden contener ilustraciones, cuadros, colores, integrar texto con iconos o incluso ser fotográficos. Es útil para los diseñadores entender los diferentes tipos de infografías y poder distinguir cuándo funcionan y cuáles no.

Utilice este artículo como introducción y vea si puede desglosar la próxima infografía que encuentre como una forma de fortalecer tus propias habilidades de diseño infográfico