7
2012
Autopsie d'une dataviz [1] : une mosaïque interactive de Jean-Claude Juncker
Démarrage d'une peut-être nouvelle série avec l'autopsie d'une dataviz. Première en date : une mosaïque interactive de Jean-Claude Juncker, Premier ministre luxembourgeois.
Photo: Serge Waldbillig
Quand j'ai commencé mon dernier stage au Luxembourg, j'ai tout de suite été impressionné par une chose : l'engouement des Luxembourgeois pour leur Premier ministre Jean-Claude Juncker.
Pour vous donner un ordre d'idée, le monsieur est tellement populaire qu'il surpasse Jésus Christ !
Vous imaginez si chez nous Jean-Marc Ayrault, François Fillon, Lionel Jospin ou Edouard Balladur avaient été plus populaires en France que Bob Marley ? Ce qui paraît de la science-fiction est réalité au Luxembourg.
Je me suis donc dit qu'avant mon départ du Wort, il fallait que je trouve une idée originale pour résumer les 30 ans de vie politique de Jean-Claude Juncker. Une dataviz me paraissait une très belle option, mais je n'arrivais pas à aller au-delà de la classique Timeline.
Or, il est très difficile d'en créer une mouture captivante avec plus d'une quinzaine de dates.
Vous vous imaginez aller jusqu'au bout d'une timeline composée de 500 dates ? Perso, je décamperais en me rendant compte de l'envergure de la chose...
Et là, une idée
Bref, j'ai eu le syndrome de la page blanche jusqu'à voir une publicité pour la tournée d'un artiste basée sur le principe de la mosaïque d'images.
Voici un exemple avec le fameux Bob Marley :
Le portrait du chanteur domine, mais il est en réalité dessiné à partir de plusieurs centaines d'autres photos. On est comme submergé, happé par l'ensemble. Les 500 photos enveloppent un tout cohérent, agréable à l'oeil.
Et si chaque carreau de cette mosaïque devenait indépendant de l'ensemble, pouvait s'afficher en plus grand à l'action d'un clic ? Quoi de mieux pour rendre hommage à 30 ans de vie publique d'un homme politique, immortalisés en photographies ?
L'idée était très jolie sur le papier, mais il fallait avant tout vérifier sa faisabilité.
Andrea Mosaic à la rescousse
Créer facilement une photographie à partir de plusieurs centaines d'images requiert soit un talent fantastique, soit une bonne dose d'autisme, soit évidemment les deux. N'ayant rien de tout ça, j'ai interrogé notre ami universel Google pour trouver d'éventuels scripts.
Je n'ai rien trouvé de très transcendant, à part plusieurs mentions à Andrea Mosaic, un logiciel gratuit.
L'ensemble était relativement intuitif, avec la possibilité de paramétrer sa mosaïque selon des critères comme :
- la taille totale : largeur, hauteur, etc...
- le nombre de carreaux composant la mosaïque : 500 pour les résultats "grossiers", 2 000 pour les plus précis
- la duplication des carreaux disponibles : comment arriver à 1 500 carreaux avec simplement 500 images de stock ? En dupliquant simplement chaque élément par trois !
J'en ai parlé à ma responsable et nous avons convenu de sélectionner 500 photos de Juncker pour créer une mosaïque horizontale, mieux adaptée à un écran, de 1 500 images.
L'enfer des BDD approximatives
J'ai clairement mis les mains dans le cambouis pour classer plus de 530 photos de Juncker, prises durant la période 1979-2012. Quelques difficultés, inhérentes à l'architecture de la base de données interne du Wort, ont demandé pas mal de temps d'adaptation.
La syntaxe un peu costaud pour les noms des personnalités photographiées, des descriptions extrêmement évasives ou des orthographes différentes selon les langues (je souligne que le Wort est un média couramment bilingue et de plus en plus trilingue) ont pas mal ralenti la collecte.
Mais ouf, je suis finalement parvenu à ce fond de sauce :
L’algorithme associé
Après la récolte de données, la principale difficulté était surtout d'ordre technique, car je ne connaissais aucune librairie capable de découper ce poster en centaines de vignettes interactives.
J'ai donc rédigé un algorithme qui pourrait se traduire en code. Cela revenait à :
- "découper" l'image créée à partir d'Andrea Mosaic en zones cliquables différenciées par numéro
- à chaque clic sur une zone cliquable, afficher la photo et la légende avec le bon numéro
- améliorer l'ensemble avec une lightbox encadrant chaque carreau
Le seul hic, c'est que j'ai dû reclasser a la mano les 1 500 photos dans le bon ordre. Si vous avez des voies plus simples à me proposer, je suis preneur en commentaire !
Avant de terminer, je tiens à remercier chaleureusement Dominique Nauroy, informaticien devenu journaliste au Wort, et qui a codé entièrement la mosaïque.
Contact
Les auteurs
Commentaires récents
- L'incrackable document Word ... dans
- L'incrackable document Word ... dans
- L'incrackable document Word ... dans
- L'incrackable document Word ... dans
- L'incrackable document Word ... dans
- L'incrackable document Word ... dans
- L'incrackable document Word ... dans
- Nono's vrac 10 dans
- Nono's vrac 18 dans
- L'incrackable document Word ... dans
- L'incrackable document Word ... dans
- Créez vos propres Geojson avec OpenStreetMap dans
- Backup avec Borg via ssh(fs) sur Synology dans
- Va te faire foutre Disqus ! dans
- Saloperie de TrendMicro OfficeScan ! dans
Étiquettes
Archives
- octobre 2020 (1)
- juin 2018 (1)
- avril 2018 (1)
- mars 2018 (1)
- décembre 2015 (1)
- avril 2015 (3)
- mars 2015 (2)
- février 2015 (3)
- janvier 2015 (1)
- décembre 2014 (5)
- novembre 2014 (4)
- octobre 2014 (4)
- septembre 2014 (5)
- août 2014 (4)
- juin 2014 (7)
- mai 2014 (14)
- avril 2014 (8)
- mars 2014 (10)
- février 2014 (9)
- janvier 2014 (3)
- décembre 2013 (2)
- novembre 2013 (5)
- octobre 2013 (6)
- septembre 2013 (8)
- août 2013 (6)
- juillet 2013 (6)
- juin 2013 (11)
- mai 2013 (7)
- avril 2013 (8)
- mars 2013 (10)
- février 2013 (9)
- janvier 2013 (9)
- décembre 2012 (7)
- novembre 2012 (16)
- octobre 2012 (11)
- septembre 2012 (9)
- août 2012 (19)
- juillet 2012 (19)
- juin 2012 (20)
- mai 2012 (24)
- avril 2012 (20)
- mars 2012 (23)
- février 2012 (27)
- janvier 2012 (28)
- décembre 2011 (28)
- novembre 2011 (28)
- octobre 2011 (1)
Beau travail 😉
Bravo, c'est du très beau travail. Comme à ton habitude tu t'es surpassé!!
[...] [...]
Excellent ! 🙂
[...] - Vous avez surement vu cette incroyable mosaïque interactive sur Jean-Claude Juncker, le 1er ministre luxembourgeois proposée par le Wort. Son auteur, Raphaël Da Silva (un de mes premiers étudiants en webjournalisme et pas le moins talentueux ) vous en décrypte la fabrication. [...]
Très beau travail !
Félicitations !
magnifique
il faudrait que tu me donnes des cours
bises
rati
[...] Autopsie d’une dataviz : une mosaïque interactive de Jean-Claude Juncker « m0le'o'blog [...]
[…] Autopsie d’une dataviz : une mosaïque interactive de Jean-Claude Juncker […]