05 periodismo digital - infografía

17
Periodismo Digital Periodismo Digital Prof. Marcelo Santos - @celoo Prof. Marcelo Santos - @celoo Periodismo Digital Periodismo Digital Prof. Marcelo Santos - @celoo Prof. Marcelo Santos - @celoo Infografía Dinámica UDD - 2013

Upload: marcelo-santos

Post on 10-Jul-2015

350 views

Category:

Education


3 download

TRANSCRIPT

Page 1: 05   periodismo digital - infografía

Periodismo DigitalPeriodismo DigitalProf. Marcelo Santos - @celoo Prof. Marcelo Santos - @celoo

Periodismo DigitalPeriodismo DigitalProf. Marcelo Santos - @celoo Prof. Marcelo Santos - @celoo

Infografía Dinámica

UDD - 2013

Page 2: 05   periodismo digital - infografía

¿Qué es una infografía?

• Información sistematizada con apoyo visual

• ¿Y lo digital?

UDD 2 Prof. Marcelo Santos - @celoo

Page 3: 05   periodismo digital - infografía

Infografía digital

1. Virtual

2. En línea

3. Multimodal (multimedios + movimiento)

4. No-lineal

5. Dinámica (base de datos)

6. Interactiva

UDD 3 Prof. Marcelo Santos - @celoo

Page 4: 05   periodismo digital - infografía

Diagrama de Ciencias – Proyecto Cognitus

UDD Prof. Marcelo Santos - @celoo

- Niveles de proximidad

- Interacción- Sonido +

Movimiento- Complejidad

- Niveles de proximidad

- Interacción- Sonido +

Movimiento- Complejidad

Page 5: 05   periodismo digital - infografía

Mapa Dinámico de la Amazonia Legal

UDD Prof. Marcelo Santos - @celoo

- Exceso de información

- Comparación- Zoom + / -

- Exceso de información

- Comparación- Zoom + / -

Page 6: 05   periodismo digital - infografía

Juego e-Dance

UDD Prof. Marcelo Santos - @celoo

- Traducción a ambiente digital

- Combinación de animacion e interactividad

- Traducción a ambiente digital

- Combinación de animacion e interactividad

Page 7: 05   periodismo digital - infografía

Sitio Expedición Brasil Adentro

UDD Prof. Marcelo Santos - @celoo

- Lenguaje joven, interactiva

- Botones con sonido y animación

- Animación de introducción

- Lenguaje joven, interactiva

- Botones con sonido y animación

- Animación de introducción

Page 8: 05   periodismo digital - infografía

Ineos Silicas: Presentación de producto

UDD Prof. Marcelo Santos - @celoo

- Presentación dinámica- Soporte a movimiento- Animación como

soporte didáctico a Información más compleja

- Marketing: seducir e impresionar clientes

- Presentación dinámica- Soporte a movimiento- Animación como

soporte didáctico a Información más compleja

- Marketing: seducir e impresionar clientes

Page 9: 05   periodismo digital - infografía

Primo Comunicação: Portafolio Animado

UDD Prof. Marcelo Santos - @celoo

- Demostración de creatividad

- ¿Es Infografía?- Uso de metáforas

visuales: Taxonomía = calles y avenidas

- Demostración de creatividad

- ¿Es Infografía?- Uso de metáforas

visuales: Taxonomía = calles y avenidas

Page 10: 05   periodismo digital - infografía

Story of Stuff

UDD Prof. Marcelo Santos - @celoo

- Uso de animaciones y dibujos

- Énfasis en lo didáctico- Entretenido, dinámico- Articulación con otros

contenidos dentro y fuera del sitio

- Invitación a la acción

- Uso de animaciones y dibujos

- Énfasis en lo didáctico- Entretenido, dinámico- Articulación con otros

contenidos dentro y fuera del sitio

- Invitación a la acción

Page 11: 05   periodismo digital - infografía

Otros ejemplos

• Scoop.it del curso, etiqueta: infografías dinámicas

• Martin Wattenberg

• Buscar en la web ejemplos y compartir en el blog

UDD 11 Prof. Marcelo Santos - @celoo

Page 12: 05   periodismo digital - infografía

¿Cómo proyectar una infografía dinámica?

• Diagrama básico estático: organiza ideas

• Storyboard: ¿cómo la infografía se comporta en el tiempo?• Movimientos: animación, entrada y salida

• Interacción: mouse over, click, arrastre

• Articulación: links, incrustaciones referencias, bibliografía

• Multimedia: sonidos, imágenes, podcast

• ¿Herramientas en la web o desarrollo?

UDD 12 Prof. Marcelo Santos - @celoo

Page 13: 05   periodismo digital - infografía

¿Cómo proyectar una infografía dinámica?

• Recursos:• Universidad de Berkeley: Multimedia Storytelling

• Calvin College: Resources on Digital Storytelling

• How to turn a static visualization into a successful animation

UDD 13 Prof. Marcelo Santos - @celoo

Page 14: 05   periodismo digital - infografía

Storyboard

UDD 14 Prof. Marcelo Santos - @celoo

http://blog.visual.ly/how-to-turn-a-static-visualization-into-a-successful-animation/

Page 15: 05   periodismo digital - infografía

Storyboard

• Similar a un cómic: • Cuadro a cuadro• Expresión del movimiento y la interacción en

el tiempo• Indicar los elementos multimedia, links etc.

UDD 15 Prof. Marcelo Santos - @celoo

Page 16: 05   periodismo digital - infografía

Ejercicio

• Realizar un storyboard para ilustrar la información de una nota compleja:El Rol de Augustín Edwards antes y después del 11 de septiembre de 1973

• Responda:• ¿Cuál es el hilo conductor?• ¿Cuáles son las posibilidades de articulación

de contenido?• ¿Cuáles son las posibilidades de

interacción y cómo?

UDD 16 Prof. Marcelo Santos - @celoo

Page 17: 05   periodismo digital - infografía

Ejercicio

En una hoja de papel, realice el storyboard mostrando, cuadro a cuadro, cuál es la información entregada y cómo será la interacción y el movimiento (aparecer y borrar, interactuar, play/stop etc.)

UDD 17 Prof. Marcelo Santos - @celoo