Dataviz sans data: le prototypage rapide de visualisation de données.. sans données!


Les dataviz sont de plus en plus populaires mais restent difficile à créer. Ce workshop propose a pour but d'initier les participants aux méthodes de prototypes de visualisation de données sous forme de grids et de maquettes interactives, en noir et blanc. La particularité du prototypage sera d'être réalisé en live coding en JavaScript.


Cela peut paraître surprenant en effet de ne pas prendre ni papier ni crayon pour faire du sketching et semble limiter l'expressivité des prototypes et en plus demander des connaissances en programmation... Mais ce compromis reste cependant acceptable car la programmation permet de rapidement générer des variations de design (notamment à partir d'exemples de maquettes telles que https://romsson.github.io/d3-gridding-infovis/example/capture/display.html) et ne vous demande pas non-plus de savoir bien dessiner ! En plus, cela facilitera grandement la transition vers des prototypes plus haute fidélité en transformant les prototypes réalisés en JavaScript vers un chart interactif et en couleur.

Les particpants de ce workshops apprendront : -Les bases du design graphique (grids, proportions, explorations de design) -L'implementation de grids en JavaScript et leur mapping avec des données temporaires (mais réalistes) -La mise en page et le raffinement de design -Exporter ces prototypes (SVG/HTML/autre) et y inclure les données finales -Rendre le graphique interactif et comportant des transitions animées


Design

Design

#WORKSHOP en Français

Romain Vuillemot

LIRIS Ecole Centrale de Lyon

Ma bio



Autres talks de Romain

  • 2017 - La DataViz avancée sur le Web en JavaScript avec D3.js

    Romain Vuillemot

    D3.js est depuis quelques années la bibliothèque standard pour la création de visualisation de données (dataviz) sur le web. Il est donc indispensable de maîtriser cette bibliothèque si un programmeur souhaite :

    • Créer sa propre dataviz from scratch à partir de mockups
    • Adapter un des nombreux exemples D3.js disponibles sur https://d3js.org/
    • Contribuer à une bibliothèque de visualisation basée sur D3.js (c3js, nvd3, ..)
    • Intégrer une visualization ou une bibliothèque basée sur D3.js dans un framework (react, angular) sous forme de component

  • 2016 - Outils simples de visualisation pour le data scientist

    Romain Vuillemot

    Je présenterai les outils de visualisations pour la caractérisation et de modélisation d'un jeu de données (Python, Tableau), d'aide au nettoyage (Trifacta, Data wrangler) et la communication de résultats sur le web avec storytelling (D3JS, HighChart, NVD3).