dessiné - Infographies et illustrations

bloc notes
publishing
infographie
infographies animées
Philippe Mouche
83 2.2000
34
de l’image qui bouge
au mouvement
dessiné
L’infographie animée est-elle l’avenir de l’infographie ?
Sans aller jusque-là, beaucoup de responsables et de
créateurs du petit monde de l’information graphique soulignaient dans BN 78 l’importance que l’animation pourrait
prendre dans le futur. Pour aller un peu plus loin, nous
allons prendre deux exemples d’infographies animées
issus de la télévision et d’Internet. L’un est une séquence
consacrée au vieillissement cellulaire et diffusée sur Arte
le 16 janvier dernier. L’autre présentait l’éclipse de l’été
1999 sur le site Web du Monde.
Image extraite de “Lignes
de vie”, documentaire de
Peter Friedman et JeanFrançois Brunet.
Logiciels : Editbox,
Photoshop, Maya.
Réalisation : Duran TV.
Diffusion : Arte.
Disponible en cassette
vidéo.
Image extraite de
“L’éclipse du 11 août
1999”, publiée sur le site
du Monde Interactif.
Logiciel : Flash 4 avec imports Illustrator,
Photoshop et Ray Dream.
Réalisation : Art Movies.
Infographie consultable
sur www.artmovies.com
Pourquoi les cellules vieillissent ?
Réponse infographique… et pas triste
Consacrée au vieillissement, la soirée Théma d’Arte était
alléchante. Certes, elle commençait par un bon vieux
Howard Hawks (Chérie, je me sens rajeunir). Mais elle
enchaînait surtout avec “Lignes de vie”, un documentaire
nourri par des interviews de chercheurs concernés par
différents aspects du phénomène. Parmi ceux-ci, le vieillissement cellulaire était probablement l’aspect le plus aride
et en même temps le plus complexe. Pour le traiter, les
réalisateurs ont eu recours à une infographie animée sommairement résumée ci-contre. Le soin porté à cette
séquence n’étant pas inférieur à celui manifesté dans le
reste du documentaire, le résultat est intéressant à plus
d’un titre. Il montre que la rigueur d’une bonne vulgarisation scientifique n’est pas incompatible avec une certaine liberté de création graphique, ni avec une bonne
dose d’humour.
Même si nous sommes ici dans le cadre d’un projet broadcast, et donc disposant de plus de moyens qu’une simple
infographie de presse, recherche et conception d’ensemble
priment sur telle ou telle technique de réalisation. La 3D
est utilisée ici en début de séquence, non pour l’image,
mais pour le mouvement d’entrée dans le noyau cellulaire. Le reste des animations utilise des images 2D créées
sous Photoshop, parce que l’essentiel est de faire com-
83 2.2000
35
infographie
Philippe Mouche
prendre un processus plutôt que d’illustrer un paysage ou
de décrire une forme particulière.
bloc notes
publishing
infographies animées
1 Au commencement est
la cellule. Le style est af-
Du bon usage de l’analogie
firmé d’emblée : loin d’un
Coréalisateur de ce film avec Jean-François Brunet (chercheur au CNRS), Peter Friedman détaille sa démarche:
Jean-François et moi avons d’abord développé l’usage d’analogies pour parler de la science dans Une mort programmée,
notre premier documentaire commun. Dans ce film, les analogies étaient “trouvées”, et non fabriquées: elles utilisaient
des films d’archives n’ayant rien à voir avec la biologie. Par
exemple, on entendait un biologiste expliquer le fonctionnement des cellules et leur nécessaire coopération pour former
un organisme, et on voyait des vues de dessus de danseurs
formant des motifs géométriques, extraites de comédies musicales américaines des années trente.
Pour “Lignes de vie”, Brunet et Friedman ont préféré
“construire” leurs analogies explicatives. S’ils voulaient
qu’elles soient drôles, ce n’était pas pour mettre un peu
d’humour dans un sujet triste, car le vieillissement est en
fait un sujet trop complexe pour être simplement qualifié
de “triste”. Le but est d’être à la fois divertissant et pédagogique. Mais en biologie, les explications sont toujours
incomplètes et, d’une certaine façon, fausses… Ils ont
décidé de mettre en évidence cette limitation: personne ne
va croire que ses gènes ressemblent à des partitions, mais
beaucoup comprendront quelque chose au processus de
réduction des télomères et à leur rôle dans le vieillissement.
Lauréat de plusieurs récompenses pour ses documentaires
(dont “Lignes de vie”), Peter Friedman est impressionné par
la montée en puissance des techniques 3D. Son prochain
travail, un film Imax sur les gènes toujours conçu avec JeanFrançois Brunet, y fera largement appel.
réalisme qui, à cette
échelle, n’aurait pas grand
sens, le trait est très dessiné. Le zoom vers le noyau
de la cellule commence,
soutenu par la voix off qui
nomme les éléments.
2 A l’intérieur du noyau,
on voit apparaître les
chromosomes sous forme
de fils multicolores qui
s’entrecroisent.
L’animation combine ici
la puissance de
la 3D (logiciel Maya) et la
fraîcheur du dessin.
3 Le filament d’ADN porteur du code génétique
n’est pas représenté sous
sa forme classique de
double hélice, mais en
utilisant la métaphore
d’une partition musicale.
Une technique souple au service
de la conception
Pendant qu’on suit un fi-
Pour “Lignes de vie”, la réalisation a été confiée à Duran
TV, société travaillant régulièrement pour Arte. Directeur
des effets spéciaux, Jacquemin Piel est sensible à la
démarche du documentariste. Il souligne l’importance du
montage dans le travail de Friedman. C’est à l’issue d’un pre-
mité, la bande-son fait
lament jusqu’à son extré-
entendre un pot-pourri de
musiques de styles différents, correspondant aux
différents gènes.
bloc notes
publishing
infographie
infographies animées
Philippe Mouche
4 La fin du brin d’ADN s’appelle le télomère. Il répète des
milliers de fois la même séquence de notes. On entend ce
carillon hypnotique. Lors de la
division des cellules, le mécanisme de duplication de l’ADN
du noyau est représenté par
cette machine, qui lit et recopie la portée musicale de
l’ADN originel.
5 Grâce à ce mécanisme, les
cellules peuvent se diviser et
le tissu vivant croître et se
renouveler. L’altération de ce
processus est probablement
une des causes du vieillissement. On retourne donc à
l’image de départ pour montrer la mitose (division cellulaire).
6 Au fil des divisions successives, notre
machine baroque perd en
efficacité. Elle s’arrête avant
la fin du télomère, qui se raccourcit ainsi petit à petit, ce
qui diminue capacité de divi-
83 2.2000
36
mier montage qu’un certain manque de clarté a amené l’idée
de l’infographie. La “machine à dupliquer” qui évoque Marcel Duchamp et le dadaïsme (pour ne pas parler des collages de Terry Gilliam) est issue d’une réflexion commune,
et l’idée de la partition musicale est une actualisation graphique d’une métaphore souvent utilisée par les généticiens. Ce type de création rend nécessaire un aller-retour:
Duran TV a proposé une première série d’images fixes, réalisées sur Mac avec Photoshop, pour validation. Dans les
étapes suivantes, l’animation véritable est créée avec Maya
et surtout Editbox qui reconnaît les calques de Photoshop,
sur une plateforme Quantel.
Une éclipse en avant-première
sur le Web
Sans transition, passons du microcosme au macrocosme.
Personne n’a oublié l’émouvant et spectaculaire rendez-vous
du 11 août de l’année dernière: rendez-vous entre le Soleil
et la Lune d’abord, mais aussi rendez-vous de centaines de
millions d’humains observant ensemble le phénomène. C’était
de plus un rendez-vous marquant dans le domaine de l’information, avec un événement mêlant les angles scientifiques, historiques et géographiques, pratiques, sociaux et
même philosophiques.
Beaucoup de “papiers” ont paru dans la presse écrite sur
tous ces aspects, avant comme après. Mais comment rendre
compte de l’aspect foncièrement dynamique du phénomène
en restant lié au texte linéaire et à l’image ponctuelle? Le
Monde Interactif a proposé sur son site une infographie animée nourrie de texte, d’images et de sons qui montre le
déterminisme de l’éclipse (l’enchaînement des causes aux
conséquences) et ses aspects pratiques pour un public français, en reliant le tout dans un mouvement de zoom avant.
sion de la cellule. Pour montrer la suite de divisions,
l’animation reprend le zoom
de départ en accéléré.
7 Cette autre machine dadaïste représente la télomérase, un enzyme qui aide à la
reproduction du télomère.
Elle souffle à sa comparse
les notes manquantes. Les
notes apparaissent graphiquement et sont effectivement jouées sur la bandeson.
Zoomer à travers l’info
Pour cela, la séquence a été découpée en six chapitres dont
les titres apparaissent en bas de l’écran 9. Contrairement
au téléspectateur, l’internaute peut à loisir suivre leur déroulement de façon linéaire ou sauter un chapitre, revenir en
arrière… Ces chapitres servent de structure et de portes
d’entrée dans la séquence, mais ne la tronçonnent pas car
ils sont tous reliés les uns aux autres de façon logique. Ainsi
le système solaire est-il progressivement dévoilé par le mouvement de Pluton dans la première animation, puis les noms
des planètes apparaissent, puis l’image zoome sur l’ensemble
Soleil-Terre-Lune 0, et l’on se trouve naturellement dans
le deuxième chapitre. A la fin de celui-ci, un cadre apparaît sur l’hémiphère Nord terrestre e, qui grandit pour présenter la carte de la trajectoire de l’éclipse. Le principe de
83 2.2000
37
infographie
Philippe Mouche
mouvement continu de la cause globale à la conséquence
locale s’applique sur l’ensemble de l’infographie, la seule
coupure se situant avant le sixième chapitre qui présente
les précautions à prendre.
Il n’est pas possible de représenter globalement le système
solaire en respectant les véritables distances et proportions
des planètes qui le composent. L’infographie qui fait tourner le couple Terre-Lune autour du Soleil est ici une mise
en scène simplifiée, comme il est fréquent en infographie
où l’on met en évidence un principe sans chercher la photographie exacte d’une réalité dont l’échelle et la complexité
sont trop grandes. Mais le texte z se charge d’apporter
quelques éléments chiffrés.
bloc notes
publishing
infographies animées
8 Nos deux machines à
l’œuvre. En quelques minutes à peine, l’animation a
montré le rôle de la télomérase dans la duplication des
cellules et donc dans le
vieillissement, montrant au
passage une représentation
originale de la molécule
d’ADN.
Des atouts de l’animation sur le Web…
Pour réaliser ce sujet, Le Monde Interactif s’est adressé à
Art Movies. Son responsable, Julien Demoly, est un cofondateur de la Vague Interactive, ancien journaliste de la
presse informatique. Il détaille les trois principes qui ont
donné les axes de travail: faire de la bonne pédagogie pour
adultes, donner des informations pratiques, mais aussi créer
un petit événement sur le site avec cette séquence d’infographies animées.
Le canevas proposé par Le Monde comportait déjà six entrées,
mais certaines ont été refondues et redéfinies dans le travail de scénarisation. Selon Julien Demoly, le chantier d’une
infographie animée de ce type est de même nature que toute
œuvre de journaliste: il s’agit de hiérarchiser l’information.
La différence est que parmi les éléments dont on dispose,
il faut ajouter au texte et aux images le rythme, le son et
même l’interactivité. Rester plusieurs secondes sur les images
principales (le principe de l’éclipse vue de l’espace, la carte
du Nord de la France), favoriser la fluidité à d’autres
moments, savoir quand on joue la carte de l’interactivité
sont des choix fondamentaux pour ce type de rubrique. Ainsi
la partie proprement interactive (c’est-à-dire celle qui offre
un choix à l’internaute) se situe-t-elle dans le cinquième
chapitre, celui qui concerne le plus directement les chasseurs d’éclipse amateurs désireux de planifier une balade
dans la bande de centralité. Elle fait suite aux chapitres
linéaires qui exposent les données scientifiques et géographiques. Pour d’autres sujets, on élabore d’autres logiques
de consultation, par exemple une partie interactive en ouverture avec plusieurs suites linéaires possibles, ou bien plusieurs niveaux d’explication d’un même processus.
9 La silhouette circulaire de
Pluton dévoile lentement le
système solaire. Plus modeste et moins réaliste que
la scène mythique de 2001,
l’Odyssée de l’espace, ce lever de soleil n’en est pas
moins une entrée très visuelle à l’ensemble de la séquence.
0 On zoome ensuite sur les
principaux concernés, la
Terre, la Lune et le Soleil.
La représentation des proportions réelles s’avérant impossible dans ce contexte,
c’est l’enchaînement qui
prime sur le plan graphique.
a Suit une animation qui
montre le mouvement de la
Terre autour du Soleil (révolu-
…et des contraintes
Il faut aussi dire que la logique du Web est riche de
contraintes. Une infographie animée excellente mais trop
tion) en même temps que celui
de la Lune autour de la Terre.
bloc notes
publishing
infographie
infographies animées
Philippe Mouche
z Le principe de l’éclipse
est ensuite exposé par
une animation où l’on
voit la Lune s’interposer
entre Terre et Soleil.
Légendes et filets apparaissent à la fin.
e Un cadre apparaît sur
la partie de l’image
(l’hémisphère Nord)
qui est agrandie dans
la séquence suivante.
83 2.2000
38
longue à charger trouvera un internaute excédé ou endormi.
Le bon compromis entre poids et qualité ou densité de l’information constitue un souci constant et souvent un critère
de choix entre différentes options. Flash 4, le logiciel utilisé ici, permet d’animer des fichiers vectoriels légers (issus
d’Illustrator par exemple) ou bitmap (en général plus lourds),
en les combinant assez souplement. La Terre qui tourne sur
elle-même vient d’une animation de Ray Dream. Il autorise
aussi le chargement d’un deuxième niveau de données pendant la lecture du premier. C’est le “streaming” : le fichier
commence à se jouer avant d’être intégralement chargé, et
l’on a tout intérêt à commencer par des éléments légers.
Julien Demoly dresse un bilan positif de l’“ éclipse animée”.
Le site a connu le deuxième score d’affluence (après les
élections législatives de 1997), et des versions “exécutables”
se sont échangées par e-mail. Pour ce concept nouveau, le
travail d’évangélisation semble en bonne voie.
Conclusion animée
r La carte de la partie de
la Terre concernée par
l’éclipse fait progressivement apparaître la tache
ombrée et la zone de
centralité, puis les légendes, enfin le cartouche explicatif.
t En déplaçant la main
sur les villes principales
de la bande de centralité,
l’internaute fait apparaître (en haut et à droite
de l’écran) un agrandissement de la carte avec
l’heure de l’éclipse à cet
endroit. Un clic sur le
cadre en haut et à droite
déclenche l’animation de
l’éclipse vue de la Terre.
A coups de flèches, de dégradés, d’effets de transparence,
les infographistes de presse s’échinent à figurer le mouvement. Ce mouvement dont ils sont en réalité privés (et leurs
lecteurs avec) dans les médias “papier” devient possible sur
l’Internet et à la télévision. Du point de vue de la réalisation, chacun de ces deux univers a ses contraintes: l’animation pour la télévision restera chère tant que la “qualité
broadcast” exclura la micro-informatique ; l’Internet est
encore limité par le temps de téléchargement, donc la taille
des fichiers. Mais ces limites évoluent, et de nouveaux
espaces d’expression pourraient bien s’ouvrir à notre insatiable et sympathique soif de comprendre. Pour beaucoup
des enjeux du prochain siècle (santé, environnement, économie, espace…) les mécanismes dynamiques et l’interaction local/global sont en effet essentiels. Translations, rotations, zooms avant et arrière, interactivité constituent des
outils précieux pour appréhender un monde complexe en
perpétuel mouvement. Autant de moyens que l’information
graphique animée 2D ou 3D peut proposer. Pour expliquer
l’éclipse (le très grand) ou le fonctionnement cellulaire (le
très petit) dans les exemples décrits ici, les réalisateurs ont
choisi le zoom avant. Ce mouvement continu apparaît d’abord
comme un moyen, mais devient finalement un des principaux éléments de l’information elle-même. Le développement de l’infographie animée pourrait donner raison à Norman McLaren, un des pionniers du dessin animé, qui voulait
passer de l’image qui bouge au mouvement dessiné.
■
83 2.2000
39
infographie
bloc notes
publishing
infographies animées
y L’éclipse animée
détaille les différentes
phases.
GRAPHILAND
u Les fameuses lunettes
CEE sont recommandées
au dernier chapitre,
avant la reprise plein
écran de l’animation de
l’éclipse, en forme
d’au revoir.