Data Visualisation et web design

1. Quels outils pour designer votre site ?

1.1. Wix https://fr.wix.com

1.2. Wordpress

1.3. Iweb sur mac

1.4. Comparatifs d'outils à découvrir ici : http://socialcompare.com/fr/comparison/logiciel-creation-site-internet-gratuit-facile

2. Définir la problématique ou la controverse

2.1. Où trouver les données

2.1.1. Bases de données

2.1.2. Agrégateurs

2.1.3. Sites institutionnels

2.2. Filtrer les donnés

2.3. Visualiser

3. Raconter

3.1. Hiérarchiser et organiser vos pages

4. Définition du data journalisme

4.1. C'est raconter une histoire, exposer une problématique à partir de données numériques. Pour cela, la méthode est la suivante : poser une hypothèse, chercher données, analyser, représenter données

5. Quel type de visualisation choisir ?

5.1. Cartes mentales pour votre plan de problématique. Ex cette carte du cours.

5.1.1. Avantage : pas de navigation linéaire, vous influencez ainsi moins votre lecteur

5.1.2. Permet à l'internaute de s'y retrouver tout de suite

5.1.3. Plus marquant et percutant

5.1.4. Quels outils ?

5.1.4.1. Mindmeister pratique, facile d'utilisation, mais pas dynamique

5.1.4.1.1. Facile d'utilisation

5.1.4.1.2. En anglais

5.1.4.1.3. Online

5.1.4.1.4. Pas dynamique

5.1.4.1.5. intégrable à un site

5.1.4.2. Spicynodes http://www.spicynodes.org/

5.1.4.2.1. En anglais

5.1.4.2.2. Intégrable à un site web

5.1.4.2.3. Dynamique

5.1.4.2.4. pas forcément très joli

5.1.4.2.5. pas en html5 -->> donc pas accessible sur tablette ou smartphone

5.1.4.3. Arbor http://arborjs.org/

5.1.4.3.1. Nécessite des connaissances de code

5.2. Carte géographique

5.2.1. Des fichiers bien spécifiques au format csv ou KML

5.2.2. Où trouver les données géographiques

5.2.3. Exemples éventuels sur vos problématiques

5.2.3.1. La carte des fermes usines https://www.google.com/maps/d/viewer?mid=zE2jsqdnXoOY.kTMJdhOcyf3E

5.2.3.1.1. Possibilité de télécharger les données

5.2.3.2. Localisation des parcs d'énergie marine

5.2.3.3. Carte de France des terres les plus touchées par des pesticides

5.2.4. Quel logiciel ?

5.2.4.1. Carto DB

5.2.4.1.1. Présentation rapide du fonctionnement

5.2.4.1.2. Exemple de réalisation : la carte de la nuit des musées dans le Sud https://ladepeche.cartodb.com/viz/0e8639b8-fba6-11e4-adb0-0e4fddd5de28/public_map

5.2.4.2. Google Fusion Table

5.2.4.2.1. Principe de focntionnement

5.2.4.2.2. Exemple d'utilisation :

5.3. Nuages de mots : utile pour analyser un discours et voir quels sont les mots qui reviennent le plus souvent.

5.3.1. Exemples

5.3.1.1. http://www.lefigaro.fr/politique/le-scan/citations/2014/04/08/25002-20140408ARTFIG00302-declaration-de-politique-generale-les-mots-de-manuel-valls.php

5.3.1.2. http://www.leparisien.fr/presidence-Hollande/nuage-de-mots-tous-les-discours-de-hollande-passes-au-crible-29-04-2013-2768067.php

5.3.2. Arbre des mots clés

5.3.2.1. http://treecloud.univ-mlv.fr/index.php

5.3.3. http://www.dipity.com/

5.3.3.1. Facile mais pas très beau

5.3.4. TimelineJs http://timeline.knightlab.com/

5.3.4.1. Fonctionne avec Google Drive

5.3.4.2. A mon avis la plus belle

5.3.5. Quels outils ?

5.3.5.1. Cinq sites pour réaliser des nuages de mots. http://roget.biz/cinq-sites-pour-faire-des-nuages-de-mots

5.4. Graphiques : très utiles en barre, en camembert ou autre pour présenter telle ou telle information et faire des comparatif par exemple.

5.4.1. Quels outils ?

5.4.1.1. Datawrapper : https://datawrapper.de/

5.4.1.1.1. Sobre et efficace

5.4.1.2. InfoGr.am https://infogr.am/

5.4.1.3. http://www.easel.ly/

5.4.1.3.1. Utile parce qu'on peut y ajouter autant de pictos que l'on souhaite pour enrober nos graphiques

5.4.1.4. http://piktochart.com/

5.5. Frises chronologiques

5.5.1. Outils

5.6. Autres outils potentiellement intéressants

5.6.1. https://widgetic.com/widgets/

5.6.1.1. Gallerie de widgets facilement intégrables à son site. ex une photo avant après

6. En pratique

6.1. En pratique : par groupes de deux, créer une frise chronologique avec TimelineJS

6.1.1. Sivens : une année de tensions

6.2. Par groupe de projet : faire une carte mentale de votre projet

6.3. En duo : le chômage en Midi-Pyrénées : évolution par département

6.3.1. Observatoire de l'emploi Midi-Pyrénées http://www.observatoire-emploi-mp.fr/theme/chiffres-cles-et-analyses/tous/1