Descarga y preparación de gráficas SVG para diseño en Figma y Illustrator
Clase 11 de 14 • Curso de Visualización de Datos y Storytelling con Latinometrics
Contenido del curso
Clase 11 de 14 • Curso de Visualización de Datos y Storytelling con Latinometrics
Contenido del curso
Gabriel Obregón
Witiman Andrés Canacue Ortiz
María Mercedes Eizaga Oberto
Eduardo Guzmán
Carlo Emiliano Mojica Morales
Kevin Alejandro Tovar Lamilla
Feliz Triana Benavides
Idequel Bernabel Alvarez
Jordi Felipe Guerrero Diaz
Kevin Alejandro Tovar Lamilla
Nestor Antonio Pineda Otero
Christian Rangel
DIEGO FERNANDO SANCHEZ ROMAN
Deisy Valetk Barros
Andrea Gonzalez S.
Ernesto Canales
Ariel Valle
Ernesto Canales
Lina Marcela Oviedo Mozo
Rafael Antonio Mendoza Fragozo
Nestor Luis Álvarez Rojas
JAKSON VELASQUEZ MUÑOZ
Paula Quintero
Luis Gustavo Ibarra Carrizalez
MARIA TERESA PANIAGUA RIVERA
Las imágenes SVG y RawGraphs son dos herramientas diferentes que se utilizan para propósitos distintos, pero ambas están relacionadas con la visualización de datos:
SVG (Scalable Vector Graphics):
SVG es un formato de imagen basado en vectores que se ha vuelto cada vez más popular en el diseño web.
La ventaja principal de SVG es su capacidad para escalar sin perder calidad, lo que lo hace ideal para iconos y logotipos que necesitan adaptarse a diferentes tamaños de pantalla.
Además, al ser un archivo de código XML, permite la manipulación individual de sus elementos a través de CSS y JavaScript.
SVG es perfecto para gráficos que requieren flexibilidad y escalabilidad.
RawGraphs:
RawGraphs es una aplicación de visualización de datos de código abierto.
Permite realizar gráficos interactivos de forma sencilla y rápida.
RawGraphs se lanzó en 2013 por el Laboratorio de Investigación de Diseño de Densidad del Politécnico de Milán.
Basado en el formato SVG, RawGraphs procesa datos tabulares, es decir, hojas de cálculo y CSV.
RawGraphs es la herramienta perfecta para diseñadores gráficos y entusiastas de la visualización de datos que trabajan con software de gráficos vectoriales.
RawGraphs es bien poderosa. Dejo este comentario para pedir en algún momento se añadan unos 2 vídeos a este curso ampliando sus funciones.
#Pedido
La clase se centra en cómo transformar datos en visualizaciones efectivas utilizando herramientas como Google Sheets y RawGraphs. Se explica el proceso de descargar gráficas en formato SVG para editarlas en programas de diseño como Adobe Illustrator o Figma. Se destaca la importancia de estructurar tus datos correctamente antes de crear visualizaciones y se muestra un ejemplo práctico de cómo crear un gráfico de líneas en RawGraphs, ajustando dimensiones y tipos de gráficas para obtener resultados óptimos.
No conocía RawGraphs, Buena herramientas
Yo tengo un problema con RawGraphs, pase mis values a num desde el googlesheet y no me lo detecta como numero, me los detecta como string, y desde ragraphs trato de convertirlos en num pero me da un error.
column ya lo había pasado a YYY y me estaba dando el mismo error, si alguien pudiera ayudarme se los agradecería mucho.
saludos
Hola Carlo! Creo que el problema esta en las comas "," intenta cambiarlas por un punto "." y ya con eso que deberia identificarlo como numero, por ejemplo "712,67" cambialo por "712.67"
Simplemente elimina los datos que te están causando problema al final de la tabla.
Visualizando datos con RawGraphs
En esta clase se explora cómo preparar visualizaciones de datos utilizando RawGraphs y Google Sheets, enfocándose en el formato SVG para edición en herramientas de diseño.
Conceptos clave:
Ideas principales:
Ejemplos:
Metodología:
Puntos de aprendizaje:
Recursos adicionales:
Preguntas de comprensión:
Nota: Resumido por la IA ADA
¿Cómo podríamos llevar este flujo de trabajo a otro nivel automatizando el proceso?, por ejemplo, ¿qué tal si quiero hacer 30 gráficos que son muy similares y que salen de la misma base de datos pero sin tener que hacer uno por uno?, me imagino que programando en python o R es una opción, pero sus herramientas no dan gráficos retocados por el diseño gráfico
Se me ocurre que usando herramientas mas especificas para la visualizacion de datos como tableau o Power BI, las graficas se hacen de forma similar a como se hacen en Google sheets pero con muchas mas opciones de customización
Creas el proceso de ETL con Python, generando tus 30 datasets. Luego los llevas a renderizar a una web donde previamente tienes los diseños de cada grafica. Aquí puedes utilizar diferentes librerías JavaScript para diseñar y configurar los gráficos, por ejemplo, Chart.js.
No obstante, existen herramientas que hacen todo, desde los ETL hasta las visualizaciones y reportes con envió a correos o recursos compartidos. Todo depende de los requerimientos, alcance y el presupuesto. Se llama Inteligencia de Negocios.
Últimamente Platzi no corre bien por web y tampoco por la app... Cualquier video fluye pero aquí en Platzi no... Soy yo el único que presenta este problema? ?
igual me pasa
He leído algunos mensajes corregido puntos etc y tengo problemas con el Raw Graphs. Cuando voy a pasar la informacion a los ejes se queda en "modo pensamiento" o en blanco. ¿Alguno ha tenido una experiencia similar?
Que buena herramienta, ahora consulta? si despues el diseño se puede ajustar en figma porque pasarla a RawGraphs?
Por cuestiones de preferencia personal. Nos acostumbramos a usar Rawgraphs para después editarlo en Figma. Hemos notado que Rawgraphs tiene más opciones de gráficas y es mas friendly para editar los archivos después
Recomiendan otra herramienta opensource similar a esta?
Google Sheets y Rawgraphs son las dos que recomiendo. Datawrapper es otra opción que conozco, pero no todo en su plataforma es gratis. Aunque tienen buenos features
Hola, muy interesante la clase, pero al momento de hacer el grafico, lo arroja de la siguiente manera:
a alguno le paso lo mismo? me podrian ayudar por favor
¡Que gran clase!
Debería haber un curso para rawgraphics en platzi. Este curso es como: mira aqui hay estas herramientas, vayan a ver como aprenden
Hay demasiado por aprender con Raw Graphics, ojalá hubieras podido extender a algunos puntos claves de esta plataforma, ya que esta es solo un tipo de gráfico, pero debe haber ciertos tips a tener en cuenta.
gracias