Accessibility Tools

- Le blog participatif de bioinformatique francophone depuis 2012 -

La data visualisation sans aucune compétence en programmation (et en graphisme)

Aujourd'hui, la visua­li­sa­tion des don­nées est une chose qui est com­plè­te­ment inté­grée dans notre quo­ti­dien. Que cela soit dans notre vie de tous les jours ou dans notre uni­vers pro­fes­sion­nel. Pas un jour ne passe sans que nous soyons confron­tés à une repré­sen­ta­tion visuelle d'une enquête, d'un son­dage, d'une suc­ces­sion d'événements chro­no­lo­giques ou non. C'est un fait : l'explication par l'image à ten­dance à mieux pas­ser qu'un gros pavé de texte accom­pa­gné de plu­sieurs tableaux de chiffres en colonne.

Cette démo­cra­ti­sa­tion de la data visua­li­sa­tion est une bonne chose, mais elle peut rapi­de­ment ame­ner à une frus­tra­tion. En effet, jusque-là pour pou­voir pro­po­ser des belles repré­sen­ta­tions de nos jolies don­nées scien­ti­fiques il fal­lait alors soit être un bon gra­phiste, soit être un bon déve­lop­peur capable d'utiliser les biblio­thèques de visua­li­sa­tion exis­tantes (par exemple d3.js pour ne citer qu'elle). On pou­vait même ima­gi­ner qu'avec de la moti­va­tion (et du talent) cer­tains d'entre eux pou­vaient se lan­cer dans l'implémentation de zéro d'un nou­veau type de repré­sen­ta­tion gra­phique.

Mais n'est pas Mike Bostock qui veut ! Donc comme dans tout mou­ve­ment de démo­cra­ti­sa­tion, pour que quelque chose passe entiè­re­ment du côté mains­tream il faut qu'il puisse être adop­té, par­ta­gé et rejoué par la plu­part d'entre nous. Il n'est pas vrai­ment envi­sa­geable que les trois quarts de l'humanité deviennent soit gra­phistes, soit déve­lop­peur (ou les deux). Il a donc fal­lu pro­po­ser des outils rela­ti­ve­ment simples d'utilisation, esthé­tiques et rapides en termes de résul­tat pour que l'utilisateur lamb­da s'y retrouve. Nous allons ici faire le tour de tous ces outils qui pour­ront vous faire pas­ser pour l'as des as de la subli­ma­tion des don­nées sans for­cé­ment avoir le back­ground qu'on croi­rait néces­saire pour cela.

Les plateformes de création de visualisation

Com­men­çons notre tour d'horizon des pla­te­formes en ligne pro­po­sant de créer faci­le­ment de jolies repré­sen­ta­tions à par­tir d'un jeu de don­nées.
On rap­pel­le­ra quand même pour les non ini­tiés qu'à par­tir du moment que c'est gra­tuit et héber­gé ailleurs que chez vous, on se pour­ra se poser légi­ti­me­ment la ques­tion de confi­den­tia­li­té des don­nées que vous télé­ver­se­riez. En connais­sance de cause, à vous de voir si cela vous dérange ou non.

RAWGraphs Gallery

RAW­Graphs est une appli­ca­tion déve­lop­pée à l'école poly­tech­nique de Milan. On y retrouve des simi­la­ri­tés de repré­sen­ta­tions avec ce que pro­pose d3.js, mais c'est clai­re­ment plus simple d'utilisation pour un non-codeur. On se débrouille­ra uni­que­ment en enchaî­nant les choix à faire, au clic de la sou­ris.

Pour vous faire votre idée, il fau­dra cli­quer sur le bou­ton "use it now" en haut à droite de la page d'accueil et uploa­der vos don­nées. Vous pour­rez aus­si choi­sir d'abord d'appréhender l'outil en uti­li­sant les don­nées tests pro­po­sées (menu "try our samples").

En choi­sis­sant ce cas de figure et en sélec­tion­nant le data­set "most frequent let­ters", qui pour­rait se rap­pro­cher d'une recherche de consen­sus en bioin­fo, les don­nées sont auto­ma­ti­que­ment char­gées et il fau­dra ensuite pas­ser à l'étape sui­vante : le choix du modèle de repré­sen­ta­tion.

On découvre que RAW­Graph n'est pas avare en pro­po­si­tions.

Ensemble des choix de repré­sen­ta­tions pro­po­sés par RAW­Graph

Petit plus appré­ciable, chaque modèle pos­sède une des­crip­tion détaillée. On pour­ra ain­si se lais­ser gui­der sur tel ou tel gra­phique selon ce que l'on veut faire res­sor­tir de sa visua­li­sa­tion. Pour conti­nuer notre exemple, sélec­tion­nons le modèle "Tree­map" qui pour­ra cor­res­pondre à une repré­sen­ta­tion sym­pa­thique de ce qu'on cherche à faire res­sor­tir.

Puis vient l'étape de la répar­ti­tion des don­nées sur le graphe choi­si. Là il s'agira de glis­ser-dépo­ser les labels selon les pos­si­bi­li­tés pro­po­sées et selon ce qu'on veut mon­trer.

Pro­po­si­tion de réglages

Et c'est en temps réel que vous pour­rez affi­ner votre repré­sen­ta­tion qui s'affichera alors juste en des­sous du bloc des réglages (tailles, cou­leurs, échelle…).

Pré­vi­sua­li­sa­tion en temps réel du Tree­Map créé

Une fois que celle-ci vous convien­dra, vous n'aurez plus qu'à choi­sir par­mi les for­mats pro­po­sés au télé­char­ge­ment (SVG, PNG ou JSON) pour la par­ta­ger ensuite à votre public.
Rapide, simple, effi­cace.

Infogram

Info­gram est une autre pla­te­forme facile d'accès et rapide d'utilisation. A la dif­fé­rence de Raw­Graphs, il fau­dra créer un compte (gra­tuit) pour accé­der à la pla­te­forme.

Avant d'aller plus loin : à chaque fois qu'il fau­dra créer un compte, n'hésitez pas à uti­li­ser un compte mail "pou­belle à spam". Les spams suite à l'inscription sont assez nom­breux…

Une fois cette mise en garde faite, nous pou­vons conti­nuer. La ver­sion gra­tuite donne le droit d'avoir accès à une tren­taine de types de visua­li­sa­tions. Libre à vous si la pla­te­forme vous plaît d'aller plus loin avec eux, mais ça sera payant (et je n'ai pas tes­té plus loin que la par­tie gra­tuite).

Cap­ture d'écran des types de visua­li­sa­tions pro­po­sés en ver­sion gra­tuite

Tout comme pré­cé­dem­ment cela s'avère rela­ti­ve­ment intui­tif et on obtient très vite un joli ren­du.

Exemple de ren­du : cela pour­rait être la visua­li­sa­tion des patients d'une étude cli­nique

Bonus avec eux, on peut plus par­tir sur de la data­viz en mode belles affiches, tout en mélan­geant plu­sieurs types de graphes ou plu­sieurs types de visua­li­sa­tions.
Malus : tout reste sto­cké chez eux. Avec la ver­sion gra­tuite, le mieux que vous puis­siez avoir c'est un lien pour par­ta­ger votre chef‑d’œuvre à vos col­lègues. Ma repré­sen­ta­tion de petits bons­hommes est par exemple visua­li­sable ici.

Si vous vou­lez pou­voir expor­ter en pdf, png ou autres for­mats sym­pa­thique, il fau­dra pas­ser par le por­te­feuille.

Et tout plein d'autres

Dans la même lignée, et pour ne pas en citer que deux, je vous lais­se­rai décou­vrir VismePik­to­chartCan­va et Venn­gage qui per­mettent éga­le­ment de pro­duire de belles info­gra­phies très rapi­de­ment. Il fau­dra là aus­si pas­ser par la créa­tion d'un compte à chaque fois.

Moi je veux juste de belles diapos

Une visua­li­sa­tion c'est avant tout fait pour dif­fu­ser rapi­de­ment l'information car nos résul­tats sont, la plu­part du temps, dif­fu­sés par nos pré­sen­ta­tions scien­ti­fiques. Et on est tous pareil : lors d'une réunion d'équipe, d'une confé­rence ou encore d'une visio on appré­cie tous de pou­voir en mettre plein la vue pour pas un sou à ses col­lègues 🙂

24s​lides​.com est un can­di­dat par­fait pour ce scé­na­rio. Il est facile d'utilisation, sans prise de tête et pro­pose de jolis ren­dus. Là aus­si, mal­heu­reu­se­ment encore, il fau­dra vous créer un compte afin de pou­voir béné­fi­cier de leurs petits bijoux.
Après l'inscription, les portes vous seront ouvertes pour emprun­ter de mul­tiples modèles Power­Point de toute beau­té et poten­tiel­le­ment en adé­qua­tion avec votre besoin. Je ne vais pas m'amuser à détailler le site, c'est assez intui­tif, à vous d'explorer !

Mais comment choisir mon modèle ?

Très bonne ques­tion, car ne s'improvise pas gra­phiste qui veut ! Il est en effet impor­tant de choi­sir le bon modèle de repré­sen­ta­tion à par­tir des don­nées que l'on pos­sède et sur­tout ce que l'on sou­haite faire res­sor­tir.

C'est ici que le Data­Viz cata­logue inter­vient. Ce site réfé­rence une grosse majo­ri­té des dif­fé­rentes familles de visua­li­sa­tions exis­tantes.
Il nous pro­pose une recherche par fonc­tions (com­pa­rai­sons, pro­por­tions, dis­tri­bu­tions…) qui peut s'avérer très utile comme pre­mier filtre.
On décou­vri­ra des fiches expli­ca­tives pour chaque caté­go­rie et on appren­dra quel modèle est le plus adap­té pour chaque condi­tion.
Chaque fiche est orga­ni­sée de la même façon : une des­crip­tion, un exemple de ren­du, les fonc­tions sta­tis­tiques appli­cables au modèle, les familles de modèles proches, des outils en ligne (ou non) per­met­tant de géné­rer ce genre de visua­li­sa­tion et enfin quelques exemples.

Impression écran d’une fiche détaillée sur https://datavizcatalogue.com
Impres­sion écran d’une fiche détaillée sur https://​data​viz​ca​ta​logue​.com

En cas de besoin, on pour­ra aus­si uti­li­ser le très bon Data Viz Pro­ject. Tout comme Data­Viz cata­logue, il pro­pose d'expliquer un éven­tail de type de repré­sen­ta­tions. Il est en revanche un peu moins four­ni que ce der­nier, mais est encore en ver­sion beta. Une jeune pousse à sur­veiller sur les pro­chains mois.

Exemple de page de des­crip­tion d'une visua­li­sa­tion via https://​data​viz​pro​ject​.com

Quelques lectures d'intérêt

Et pour conclure en légè­re­té ce billet voi­ci quelques conseils de lec­tures autour de la data visua­li­sa­tion pour celles et ceux qui auraient envie d'aller plus loin.    Pré­ci­sions : aucune moné­ti­sa­tion de conte­nu pour la liste ci-des­sous, c'est juste les livres que j'ai décou­vert ou qui m'ont été vive­ment conseillés sur le sujet.   A vous de voir et bonnes lec­tures !   En fran­çais :

En anglais :

Mots de la fin

  Bien enten­du, vous aurez com­pris que cet article n'a pas pour voca­tion de rem­pla­cer nos amis gra­phistes. Il y a des situa­tions où for­cé­ment on devra faire appel à eux, c'est un métier à part entière, ça ne s'invente pas. En revanche quand cela n'est pas pos­sible pour des rai­sons de temps ou/​et de bud­get, c'est aus­si agréable d'essayer de se dépa­touiller tout seul 🙂  

Un der­nier petit conseil pour les novices : l'oeil n'est pas à l'aise au-delà d'un cer­tain nombre d'axes ou de para­mètres repré­sen­tés. Allez‑y mol­lo sur vos repré­sen­ta­tions. On a sou­vent ten­dance à trop vou­loir en mon­trer d'un coup. N'ayez pas peur d'étaler vos résul­tats, étape par étape. Et ça fera plus de data­viz pour votre public !

Mer­ci à mes relec­teurs (Gwe­naëlle L., Auré­lien B. et William J.) sans qui cet article aurait été un peu moins joli.

Et si vous connais­sez d'autres sources de data­viz simples et sym­pas à prendre en main, n'hésitez pas à en par­ler dans les com­men­taires de l'article !

Vous avez aimé ? Dites-le nous !

Moyenne : 0 /​ 5. Nb de votes : 0

Pas encore de vote pour cet article.

Partagez cet article



Pour continuer la lecture :


Commentaires

Une réponse à “La data visualisation sans aucune compétence en programmation (et en graphisme)”

  1. Avatar de Pierre

    Une autre réfé­rence inté­res­sante (en anglais) est :
    The Visual Dis­play of Quan­ti­ta­tive Infor­ma­tion
    de E. R. Tufte.

Laisser un commentaire

Pour insérer du code dans vos commentaires, utilisez les balises <code> et <\code>.