La carte, le territoire et l'explorateur où est la visualisation? Jean-Daniel Fekete Equipe-projet AVIZ INRIA Jean-Daniel.Fekete@inria.fr www.aviz.fr Quelques exemples 1
La campagne de Russie de Napoléon Épidémie de Cholera de Londres 1854 2
TrashTrack Gagnant du International Science & Engineering Visualization Challenge de NSF! http://senseable.mit.edu/trashtrack/ Open Data / Données ouvertes Rendre les données ouvertes Tout le monde peut les analyser Housing Jobs Work-Life Balance Safety Income Community Education Life Satisfaction Health Governance Environment OECD Better Life Index: http://www.oecdbetterlifeindex.org/ 3
Many Eyes Charger ses données sur le site, les visualiser Collaborer avec les autres utilisateurs pour interpréter http://www-958.ibm.com/software/data/cognos/manyeyes/ Equipements spécifiques Tabletops for Visualization University of Calgary Molecular visualisation in the Reality Cube University of Groningen, NL WILD, INRIA 4
Graphes http://www.facebook.com/note.php?note_id=469716398919 Visualizing Friendships by Paul Butler on Tuesday, December 14, 2010 Visualisation géographique http://data-arts.appspot.com/globe 5
Météorologie http://weatherspark.com/ Mapping the Republic of Letters Researcher login User network [link] 6
Multiple Coordinated Views [video] Multiple Coordinated Views 7
Space&Time: GeoTime [link] TimeTree: Exploring Time Changing Hierarchies [link] 8
Hotel Visitation Patterns [video] Visualisation de Texte Parallel Tag Clouds to Explore Faceted Text Corpora (Collins et al., VAST 2009) 9
Document Analysis Using Jigsaw [video] Presque La visualisation : media de communication? Un media permet la communication d humain à humain La visualisation permet la communication de données à humain En passant par un ordinateur 10
Visualisation : définition (1) Utilisation de l informatique graphique interactive pour représenter visuellement de données abstraites afin d amplifier la cognition [Card et al. 1999] Visualisation : définition (2) Représentation graphique compacte et interface utilisateur pour : manipuler un grand nombre d items (10 2-10 6 ) éventuellement extraite d une base de donnée plus grande Permettant aux utilisateurs de faire des découvertes prendre des décisions, ou trouver des explications sur des motifs (tendances, groupes, trous, points isolés) des groupes d items des items individuels Fouille de données visuelle Données abstraites, généralement pas de représentation canonique 11
Le problème Données Web, livres, articles données scientifiques prix, liste de personnes, Cours de la bourse Informations Transfert Comment? Vision: 100 MB/s Audition: <100 b/s Haptique/tactile Odorat Goût Humain Propriétés de la vision Sens ayant la plus grande bande passante Rapide, parallèle Reconnaissance de formes Pré-attentif Etend les capacités cognitives et mémorielles On pense visuellement 12
Utilisons la vision! Utilisons la vision! 13
Particularités On veut optimiser la perception visuelle On utilise des connaissances issues de la psychologie cognitive : Psychologie de la forme (Gestalt) Perception préattentive Psychophysique Démonstration Quiz D abord une question vous sera posée sur ce que vous allez voir. Ensuite, vous allez voir une image montrée rapidement : soyez donc attentif a l écran Répondez par: Oui ou Non L équipe gagnante sera celle avec le plus de points! 14
Prêts? Q1. Y a-t-il un point rouge? 15
Q2. Y a-t-il un point rouge? Q3. Y a-t-il un cercle rouge? 32 16
Q4. Y a-t-il un point rouge? Q5. Y a-t-il un point rouge? 17
Q6. Y a-t-il un point rouge? Q7. Y a-t-il un objet différent? 18
Q8. Y a-t-il un objet différent? Q9. Y a-t-il un objet différent? 19
Q10. Y a-t-il un objet différent? Q11. Y a-t-il un objet différent? 20
Q12. Y a-t-il un objet différent? Q13. Y a-t-il un objet différent? 21
Q14. Y a-t-il un objet différent? Résultats 22
Perception Préattentive Qu est que c est? Mise en évidence par Anne Treisman (1985), psychologue de la perception propriétés visuelles détectées très rapidement par le système visuel (200 250 msec) exemples: teinte, orientation de ligne, longueur, épaisseur, taille, courbure, cardinalité, clignotement, direction de mouvement etc. Les caractéristiques préattentives interfèrent entre elles, ex. forme et teinte sauf exception: vibration Voir http://www.csc.ncsu.edu/faculty/healey/pp/index.html 45 Non Q1. Y avait il un point rouge? 23
Q2. Y avait il un point rouge? Oui Oui Q3. Y avait il un point rouge? 48 24
Q4. Y avait il un point rouge? Non Oui Q5. Y avait il un point rouge? 25
Q6. Y avait il un point rouge? Non Q7. Y avait-t-il un objet différent? Non 26
Q8. Y avait-t-il un objet différent? Oui Q9. Y avait-t-il un objet différent? Non 27
Q10. Y avait-t-il un objet différent? Oui Q11. Y avait-t-il un objet différent? Oui 28
Q12. Y avait-t-il un objet différent? Non Q13. Y avait-t-il un objet différent? Non 29
Q14. Y avait-t-il un objet différent? Oui Propriétés de la vision Sens ayant la plus grande bande passante Rapide, reconnaissance de formes Préattentif (dans certaines limites) Etend les capacités cognitives et mémorielles On pense visuellement Beaucoup d avantages, mais quelques inconvénients 60 30
Les cases A et B ont des couleurs différentes? Qu est-ce qui change entre ces deux images? Qu est-ce qui change entre ces deux images? 62 31
Montrer ce qui change Essayez encore Cécité au changement 63 32
Illettrisme visuel Dès le CP, nous apprenons à lire, à écrire et à compter Représentations symboliques des concepts Nous n apprenons pas à lire les graphiques Sauf les cartes Les jeunes apprennent les graphiques avec les jeux vidéo Les moins jeunes n ont presque jamais appris. Montrer 1 dimension à la fois: ok 33
Le New York Times s en mêle Montrer > 2 dimensions N x 1 dimension Matrice de Bertin N-1 x 2 dimensions Matrice de scatterplot Coordonnées parallèles Beaucoup d apprentissage 34
Lire les visualisations Tout le monde sait lire les visualisations congruentes Lorsque les questions sur les données utilisent les mêmes termes que les questions sur la représentation visuelle Quelle est la valeur la plus petite/grande? Quelle est la barre la plus petite/grande? Lire les visualisations (2) Plusieurs visualisations sont congruentes pour des tâches simples : 35
Lire les visualisations (3) Mais encore plus de visualisations sont très efficaces sans être congruentes Elles demandent un apprentissage : Comment traduire les tâches dans l espace des données en tâches de perception visuelle? Comment interpréter les motifs visuels en propriétés sur les données? Quelles sont les tâches de perception visuelle efficaces et fiables? Cet apprentissage est relativement court (quelques minutes / heures), mais pas instantané Montrer 2 dimensions à la fois 36
Matrices de Scatter Plots http://labs.data-publica.com/emploi/ Réseau Professionnel LinkedIn http://inmaps.linkedinlabs.com/network 37
Graphes Diagrammes en nœuds et liens Matrices d adjacence 38
GeneaQuilts Visualisation Genealogique Relations marriage parental propriétés - temps - autres Individus propriétés - temps - authors relations complexes 77 GeneaQuilts GeneaQuilts [Link] 78 39
GeneaQuilts Algorithme de placement 79 Conclusion La visualisation est un outil de compréhension de données extrêmement efficace Pas de présentation Les représentations congruentes sont compréhensible spontanément Mais pas toujours très efficace Les représentations efficaces nécessitent un apprentissage Mais pas très long 40
Conclusion (2) Le développement de visualisation ou leur déploiement devient beaucoup plus facile avec les technologies Web Voir http://d3js.org/ Des outils puissants et simples existent : Tableau Bibliographie Readings in Information Visualization, Card, Mackinlay, Shneiderman, Morgan Kaufmann, 1999 Information Visualization: Perception for Design, Colin Ware, Morgan Kaufmann, 2000 (2e édition prévue pour 2004) Sémiologie Graphique, Bertin, 1967, Réimpression EHESS 2000 The Visual Display of Quantitative Data, Tufte, 1983, Cheshire, CT: Graphics Press. otal.umd.edu/olive http://www.csc.ncsu.edu/faculty/healey/pp/index.html Information Visualization: Design for Interaction, Robert Spence, Prentice Hall, 2007 Information Visualization: Perception for Design, Colin Ware, Morgan Kaufmann, 2012 Ben Fry, Visualizing Data: Exploring and Explaining Data with the Processing Environment, O'Reilly Media, 2008 Scott Murray, Interactive Data Visualization for the Web: An Introduction to Designing with D3, O'Reilly Media, 2013, http://chimera.labs.oreilly.com/books/1230000000345/index.html 41