2. TRE FASI x LEXPERTISE
PRIMA FASE
Panoramica sulle infografiche e raccolta link (questa presentazione).
SECONDA FASE
Realizzazione di una METID INFOGRAPHIC.
TERZA FASE
Progettazione e Realizzazione di "un'infografica dinamica".
Un'applicazione che si "auto-aggiorna" importando i dati da un database
specifico sulla base di un format visuale standard predefinito.
Fattibile?
3. DEFINIZIONI
L'infografica si occupa principalmente dellorganizzazione e
della rappresentazione di dati e informazioni in forma grafica.
Mattia Lissi (Social Media Analyst):
linfographic 竪 lo strumento grazie al quale 竪 possibile comprendere in
modo immediato concetti articolati e renderli accessibili ad un pubblico
meno esperto.
www.lissimattia.com
Pasquale Gangemi (SEO Specialist):
linfografica consiste nella rappresentazione visuale di informazioni, dati
o conoscenze attraverso luso di diversi elementi grafici.
www.pasqualegangemi.com
4. LA STORIA
Nella preistoria, i nostri antenati hanno creato i primi esempi di infografica: le mappe. La cartografia infatti 竪 di parecchi millenni
precedente alla scrittura: le mappe di atal H端y端k sono datate all'incirca 7500 a.C.
Nel 1626, il gesuita Christoph Scheiner pubblica Rosa Ursina, in cui usa una grande variet di elementi grafici per rivelare la sua
ricerca astronomica sul sole. In quella pubblicazione, Scheiner usa una serie di immagini per spiegare la rotazione del sole nel
tempo.
Nel 1786, William Playfair pubblica i primi grafici di dati nel suo libro L'Atlante commerciale e politico. Il libro 竪 pieno di grafici
statistici che rappresentano l'economia del diciottesimo secolo, usando istogrammi e diagrammi a colonna.
Nel 1801, continua ad innovare creando i primi diagrammi ad area nel suo breviary di statistica.
Nel 1878, James Joseph Sylvester introduce il termine "grafico" e pubblica una serie di diagrammi rappresentanti la relazione fra
legami chimici e propriet matematiche.
Nel 1861, mediante un grafico seminale, venne rappresentata la disastrosa marcia su Mosca di Napoleone. L'autore di questo
grafico, Charles Joseph Minard, 竪 riuscito a rappresentare in una singola immagine bidimensionale, quattro diverse variabili che
hanno contribuito al fallimento della marcia [ La distanza e la direzione in cui l'esercito viaggi嘆 - le quote d'altitudine a cui
viaggiarono le truppe - la quantit di soldati morti di fame e per le ferite - le temperature gelide incontrate durante la marcia.
Nel 1936, Otto Neurath introdusse un sistema di pittogrammi progettati come linguaggio visivo internazionale. Isotype (questo il
nome del gruppo di pittogrammi) include una serie di figure umane stilizzate che saranno la base per le moderne icone di figure
umane al tratto.
Nel 1972, Otl Aicher cre嘆, in occasione delle Olimpiadi di Monaco di Baviera, una serie di pittogrammi divenuti molto popolari e
che influenzarono (e continuano ad influenzare) lo stile nella stilizzazione della figura umana usata in tutta la segnaletica pubblica.
OGGI, milioni di infografiche nel mondo (e sul web) per ogni tipo di
rappresentazione e dato.
5. OGGI
Le infografiche sono ovunque e
utilizzate per tantissimi scopi
Dal raccontare lo sviluppo del
web nel tempo alla creazione
di CV personalizzati fino a
strumenti automatici che
consentono di creare
infografiche dinamiche.
Sono utilizzate anche per
Creare e Condividere storie
6. TIPOLOGIE INFOGRAFICHE
tabelle
diagrammi di flusso
mappe concettuali
schemi a blocchi
istogrammi
grafici
mappe
mappe topografiche
schemi
sistemi di segnaletica
idee e concetti
processi ed evoluzioni
cronologie e timeline
CV
istruzioni
altro...
8. PERCHE USARLE E UN VANTAGGIO
L'utente medio:
- consuma i dati sul web in maniera differente dal contesto tradizionale
- percepisce e impara i contenuti in modo diverso
Le infografiche:
- supportano questa consultazione di informazioni
- aiutano a conservare nel ricordo i messaggi visualizzati.
La comunicazione attraverso le immagini
竪 un innegabile vantaggio!
10. DA CONSIDARARE
Easy to digest, Easy to share, They are cool!
10 ragioni per cui le Infografiche sono importanti:
1. It makes info more appealing - Rende le informazioni pi湛 attraenti.
2. It shows valuable ideas - Mostra le idee di valore.
3. It is attention-grabbing - Attira l'attenzione.
4. It is easier to understand - E 'pi湛 facile da capire.
5. It lessens boredom - Si riduce la noia.
6. It awakens ones interest - Risveglia il proprio interesse.
7. It is accessible - E 'accessibile.
8. It is more persuasive - E 'pi湛 convincente.
9. It is memorable - E' memorizzabile.
10. It can easily relay info - Si pu嘆 facilmente ritrasmettere.
11. DA CONSIDARARE
Consigli utili
un concetto = unimmagine
- NON esprimere idee diverse all'interno di un'unica immagine.
- Pi湛 concetti insieme potrebbe complicare la comprensione del dato.
- Creare grafica per accogliere le altre idee.
Rendere facile la rappresentazione
- Utilizzare molto spazio bianco o cmq alleggerire spazi e ingombri.
- Ogni testo deve essere di facile lettura (font puliti e abbastanza grandi ).
- Riunire in una sola citazione o frase un insieme di informazioni.
- Riassumere graficamente piccoli gruppi di informazione.
- Pensare in termini di numeri e aggregatori (5 motivi per sette cosa da).
12. COSA NON FARE
Esempi da N N seguire!
Molte infografiche sono costruite
con minuziosa cura dei particolari,
ma purtroppo si basano
principalmente sullestetica e
danno meno importanza
alla chiarezza con cui vengono
trasmesse le informazioni.
13. COSA NON FARE
1) Il testo dell'infografica non 竪 reso in
alcun modo disponibile
2) Non vi 竪 alcun aiuto alla lettura come
grassetti e corsivi.
3) Il pezzo 竪 taggato con termini quali
"Bettino Craxi"che neppure ricorrono nel
testo dell'articolo, ma solo nell'immagine.
4) L'analogia con il Gioco dell'Oca o con un
percorso tortuoso rende l'infografica di
difficilissima lettura
5) Le informazioni sarebbero risultate pi湛
chiare in un normale post diviso per
paragrafi di testo
6) L'unica idea pertinente 竪 la
modificazione nel tempo della casa, ci sono
solo punto di partenza e arrivo, mentre il
percorso manca. (e luccellino?)
Da Linkiesta Italia 1973-2011, Una repubblica fondata sul condono
17. PUNTI DI VISTA
L'immediatezza dei dati visivi e la
sua comprensione rispetto al
confronto tra dati a volte ci f
scoprire anche informazioni che
non avevamo considerato.
Vulcano islandese e le sue
emissioni di CO2
206,465 Tons CO2 saved
by 60% cancelled flights across Europe
19. STRUMENTI ONLINE
Visual.ly Crea infografiche personalizzate, attraverso Facebook e Twitter.
Easel.ly Crea infografiche personalizzate sulla base di template predefiniti.
Google public Data Explorer Visualizzare grandi serie di dati, analizzarli e comunicarli.
Ionz Applicazione web che consente di realizzare uninfografica personale.
Vizualize.me Crea uninfografica del proprio curriculum vitae da LinkedIn.
Cvgram.me Crea infografiche del proprio CV.
Social Memories Realizza il Libro infografico del profilo di Facebook.
Indiemapper Servizio web gratuito per creare delle mappe geografiche tematiche.
Tiki-Toki Crea linee temporali con foto, video e notizie.
Memolane Timeline personali su avvenimenti di Facebook, Twitter e altri social.
Chartle Web-app per creare grafici con diagrammi, istogrammi, grafici a torta, etc.
Hohli Diagrammi di Venn, a torta, a barre, e altri tipi di informazioni grafiche.
Tagxedo Strumento per creare tag cloud, con possibilit di personalizzazione.
Presenti sul web anche risorse grafiche free per realizzare infografiche (es. Vector Infographic Kit).
20. ESEMPI TEMATICI
Education
Environment
Gaming
Geography
Social Media
Transportation Travel
Tecnology
Entertainment
Computers Design
Curriculum Vitae
Real Info
Other Funny
Vertical infographics
Video - Animation
43. ESEMPI (video and animation)
This video introduce you to the concepts of data visualization and show online tools
44. Laboratorio POLIMI
Density Design is a Research Lab in the design department (INDACO) of the
Politecnico di Milano. It focuses on the visual representation of complex social,
organizational and urban phenomena.
info@densitydesign.org
45. INFO E STACKS
Delicious Staks
http://delicious.com/stacks/andrea_parisi
BeeP | METID Match
http://beep.metid.polimi.it/web/metid-match
METID web site
www.metid.polimi.it
