Visualización de datos
INICIATIVA BARCELONA OPEN DATA
PERIODISME DE DADES
Visualización de datos
Inicativa Open Data
@eli_vivas
Programa

Lecciones de una periodista que sin tener ni idea de diseño pasó encerrada
21 años en una sección de infografía
con 10 grafistas




Infografía
-
Infografía
De Infographie®, marca reg.
1. f. Técnica de elaboración de imágenes mediante computadora.
2. f. Imagen obtenida por infografía.
3. f. Representación gráfica que apoya una información de prensa.
Real Academia Española

Infografía


Visualización de datos
A graphical representation of data or concepts, which is either an internal construct of the mind or an external artifact supporting decision making
C. Ware 2000

Visualización de datos

Visualización de datos

Visualización de la información
- detectar patrones
- interacción
- explorar
- personalizar
- analizar en profundidad
1. Color (existe otro código, y no es un lenguaje de programación)


Color

2. Resalta lo importante
(quieres explicarlo todo, pero no satures al personal)


Título (descripcion del gráfico)
Subtítulo (años, medidas)
Fuente. Autor. ** Notas

3. Desambigua (un título no es lo que pensabas)
3. Juega con la tipografía (pero hasta cierto punto)
- Define UNA tipografía (o habla con el jefe de diseño)
- Juega con los estilos para fijar LA ATENCIÓN
- Jerarquiza la información por el tamaño
5. Alineación
(ordena, ordena, ordena)




via Víctor Pascual


via Víctor Pascual

via Víctor Pascual


via Víctor Pascual


via Víctor Pascual


via Víctor Pascual

PARA QUÉ SIRVE QUÉ

1 ejercicio

¿Qué distrito de Barcelona tiene más locales vacíos?
Represéntalo en un gráfico

La solución está aquí debajo
(no la mires hasta que acabes)
¿Preguntas?
Próxima sesión D3 con Javascript
Sandra Becker

1 lectura para el finde

BUSCADORES
Text
Gráficos con Flourish
Mapas
Tipos de mapas
- De puntos
- De coropletas
- Clusters
- Calor
Puntos
The migrants files

Geolocalizar
- Latitud
- Longitud
Complementos
- Geocode
- Google Fusion Tables (en extinción hasta el 9 de diciembre)
Geolocalizar
Latitud
Puntos
Coropletas
Geoportal
Geoportal

Google Fusion Tables
Elecciones
Elecciones
Estáticos
Ilustrator
Formatos
- .ai
- .svg
- .png
- .jpg
Estáticos
Transformar para móvil (svg)


Visualización de datos
By Eli Vivas
Visualización de datos
- 520