Vidéo & Motion Graphic Design

par | 9 Nov, 2018 | Design

Vidéo & Motion Graphic Design

Qu’est-ce qu’une vidéo ?

Commençons par la base. Selon tous les dictionnaires, vidéo \\vi.de.o\\ vient du verbe latin video, « je vois » et représente l’ensemble des techniques permettant la visualisation ou l’enregistrement d’images animées accompagnées de son sur un support électronique. Pour le Motion Design, ou plutôt Motion Graphic Design, au vu de la jeunesse de ce métier, c’est un peu plus compliqué. Voici donc une tentative de définition : « Motion » de l’ancien français motion, du latin motio, fait référence à la notion de mouvement et Graphic Design, (Design Graphique en français) est, selon l’Ecole de Design Nantes Atlantique, une activité de conception visant à mettre en œuvre et coordonner la réalisation d’une communication visuelle combinant image et texte, sur imprimé ou sur écran. Une des définitions du motion design consiste donc littéralement à faire bouger les choses. Mettre en mouvement plusieurs types d’éléments : typographiques, formes, textures, abstraits ou non en utilisant des techniques multiples, animation 2D et/ou 3D, la prise de vue, le stop motion, etc… Sachant qu’il y a une multitude de définitions pour les termes « Motion » & « Design », je précise qu’il s’agit de mon interprétation. Mais tout ceci n’est finalement qu’illusion. En effet, comme l’explique Michael Betancourt, théoricien et animateur :

« À la différence du mouvement du monde réel qui est physiquement éminent, le mouvement que nous voyons dans les films et dans les autres techniques d’animation résulte entièrement de la perception humaine. Ce mouvement n’existe pas en dehors de notre perception. »

Un peu d’histoire

Début 19e : Démonstration de l’existence de la persistance rétinienne

le THAUMATROPE (petit oiseau dans la cage) en 1825 Littéralement « roue à miracles ». Premier « jouet optique » inventé par le docteur John Ayrton PARIS première démonstration officielle de la persistance rétinienne.
le PHENAKISTICOPE (Disque animé) en 1832 Du grec, « illusion d’optique », Cet appareil créé par le chercheur belge Joseph Plateau donne l’illusion du mouvement fondé sur la persistance rétinienne.
Il y a eu beaucoup de déclinaisons de ces concepts basés sur la persistance rétinienne, comme le zootrope de William George Horner  en 1834 ou bien le praxinoscope d‘Émile Reynaud, de 1877

Début 20e: Les débuts du cinéma et de l’informatique

John Whitney animateur américain a créé en 1960 une entreprise appelée Motion Graphics Inc et est alors l’un des premiers à utiliser le terme « Motion Graphics »
Le graphiste américain Saul Bass est souvent considéré comme le pionnier du motion design, lorsqu’il a révolutionné l’identité visuelle au cinéma et les génériques de film avec une approche graphique basée sur le mouvement, il a ainsi donné une dimension narrative et artistique à un support autrefois purement informatif et légal. Son œuvre inclut des génériques de films comme L’Homme au bras d’or (1955), Sueurs Froides (1958) ou Psychose (1960).

Début 21e: L’âge d’or du digital

Avec l’explosion d’internet et du numérique, de nouveaux métiers et de nouveaux outils ont vu le jour. C’est le cas du Motion Design qui était jusqu’alors un métier assez confidentiel.
L’expansion de sociétés d’animations tels que Pixar ou Dreamworks ou bien encore les éditeurs de jeux vidéo comme Blizzard ou Ubisoft ont également suscité des vocations.
Enfin, les principales agences de publicités intègrent désormais le Motion Design au sein même de leurs équipes créatives.

Les deux principaux types de vidéos

utilisés en entreprise

Prise de vue réelle

Animation 2D 3D

Les différents rôles d’une vidéo

  • Exprimer des idées et/ou des concepts
  • Informer ou Sensibiliser
  • Donner une vision Schématique ou Simplifiée d’une idée ou d’un concept
  • Expliquer concrètement le déroulement d’un projet ou le fonctionnement de celui-ci.

Les différents canaux de diffusion

  • En interne
  • Sur les réseaux sociaux
  • Sur des salons / Forums / Écoles, etc
  • En présentation client
  • En Comex

Le process de production pour un film Live

La préproduction :
La première opération consiste à rédiger un script à partir du brief reçu. Celui-ci nous permettra de donner les lignes directrices de la future production. A partir de là, nous pouvons entamer la création d’un story-board qui nous permettra de mettre en image le script, d’imaginer les différents plans en fonction de l’intention recherchée dans la vidéo finale. Après ces quelques étapes essentielles, vient la préparation du tournage, en commençant par le repérage des lieux afin de ne pas avoir de surprise le jour J. Un problème d’éclairage, de disponibilité des salles, etc Ensuite, si besoin, il faudra procéder à un casting. Celui-ci peut nécessiter pas mal de temps de préparation afin de bien sélectionner les profils correspondants aux besoins. Enfin, vient la préparation matérielle du tournage. Cette étape nécessite une extrême vigilance sur la lecture du story-board. Il faut en effet bien choisir son type de caméra et d’objectifs, de matériel de prise de son et de lumière afin de coller au plus près du script et du story-board. Il sera difficile de compenser un oubli le jour du tournage.
La production :
  • La prise de vue
  • La prise de son

La prise de vue : C’est l’étape nécessaire à la réalisation d’un film. Réalisée avec différents types de matériels et de procédés (caméras, objectifs, lumières, etc…) en fonction du script/Scénario afin d’être au plus proche du résultat attendu. La prise de son : Elle est souvent réalisée directement sur la caméra avec un micro directionnel ou avec des micros externes (perche, micro-cravate, etc…). Sur les tournages de grosse envergure, elle est effectuée par un ingénieur du son.

La postproduction
La postproduction englobe l’ensemble des techniques de finalisation d’un produit audiovisuel.

  • Montage
  • Bruitage/Sound Design
  • Montage son
  • Mixage
  • Effets spéciaux
  • Etalonnage de l’image
  • Export
Le montage :

Au sein de CACD2, nous travaillons principalement avec la suite Adobe CC. Nous réalisons donc nos montages à l’aide de Premiere Pro. C’est l’un des logiciels les plus polyvalents et complets du marché. Il est très puissant et bénéficie d’une passerelle avec After Effects pour les effets spéciaux. Il est cependant un peu complexe à prendre en main pour les néophytes et demande beaucoup de ressources matérielles tout comme After Effects. Des unités de production très puissantes sont donc indispensables afin de travailler dans de bonnes conditions.

Le bruitage/sound design/montage son/mixage :

Ces étapes sont primordiales pour la création d’une bonne vidéo. Nous travaillons principalement avec le logiciel Audition qui possède également une passerelle avec Première Pro. Il existe bien d’autres outils plus puissants mais également bien plus compliqués et généralement utilisés par des ingénieurs du son.

Les effets spéciaux :

Nous utilisons After Effects qui est presque le seul dans sa catégorie. Il y a ensuite plusieurs logiciels spécialisés dans les effets spéciaux, en 3D, en animation live, etc.. Tout comme Première Pro, il est très puissant et polyvalent. Il Demande beaucoup de ressources matérielles tout comme Première Pro.

L’étalonnage :

Nous utilisons également les outils fournis par Première Pro pour réaliser l’étalonnage de nos vidéos. Il en existe d’autres, comme Da Vinci Resolve par exemple qui est une référence dans le domaine, mais qui demande énormément de ressources et une prise en main particulière.

L’export :

Pour réaliser cette tâche finale, nous utilisons Media Encoder, toujours de la suite Adobe, qui nous permet de réaliser des exports adaptés aux différents canaux de diffusion.

Le process de production pour un film

en Motion design

La préproduction :
Tout comme pour un film en live, la première opération consiste à rédiger un script à partir du brief reçu. En parallèle, nous réaliserons une veille graphique, un état de l’art, afin de proposer au client différentes pistes créatives. Lorsque  script et pistes créatives sont validés , nous pouvons entamer la réalisation du storyboard. La plupart du temps, nous réalisons le script et le storyboard en même temps. Cela nous permet de faire valider la DA (Direction Artistique) en même temps que le script. Il faudra également prévoir une voix off si besoin ainsi que l’intégration de sound design.
L'animation :
En fonction du temps alloué et du budget, nous allons réaliser l’animation la plus pertinente et la plus proche du script et du storyboard.
Le sound design

« Sound is half the experience ». George Lucas

Le sound design est en effet très important pour dynamiser l’animation et appuyer les effets. Celui-ci est cependant très laborieux à mettre en place (curation des sons et des musiques, enregistrements, transformation, placement, rédaction et enregistrement des voix off…)

L'export
Tout comme pour un film Live, la dernière étape du process est l’export de la vidéo. On peut ici le réaliser soit directement à partir d’After Effects, soit à l’aide de Media Encoder.

Exemple pour le projet Vidéo Live 

voicebot Sofinco

Le script/scenario :

Le tournage :

Le montage :

Les effets spéciaux :

La vidéo finale :

Lien vers la vidéo

Exemple pour la Vidéo d’animation du

projet chatbot LCL 

Le script/storyboard :

L’animation :

Le sound design :

L’export :

La vidéo finale :

Lien vers la vidéo

Pour approfondir un peu

Les 12 Principes d’animation :

Il s’agit ici d’un ensemble de principes d’animation listés par les grands animateurs de Disney Ollie Johnston et Frank Thomas dans leur livre : The Illusion of Life. L’idée étant de produire une illusion très réaliste des mouvements en utilisant les lois de la physique et en recréant les réactions et expressions émotionnelles réelles. Créés à l’origine pour l’animation traditionnelle, ces principes font toujours référence dans l’animation moderne. Les frontières entre les métiers de l’animation et de l’UX-UI Design s’amenuisent de plus en plus. En Interaction Design, on utilise aujourd’hui ces principes d’animation comme outil de conception pour optimiser et enrichir l’expérience utilisateur.
En effet, ces micro-interactions permettent entre autre d’orienter l’utilisateur dans sa navigation, de donner un feedback visuel, de suggérer sa propre utilisation, on parle alors d’affordance. Elles rendent l’UI logique pour l’utilisateur, elles confirment ou infirment les actions, elles permettent des interactions « user friendly », on a envie d’y revenir. Bref, on considère encore trop souvent ces micro-interactions comme un détail, mais elles sont extrêmement importantes pour l’utilisateur, elles lui font oublier qu’ils n’ont qu’un bout de plastique et de verre entre les mains. Il faudra tout de même veiller à ne pas perdre de vue le but principal de l’interaction et ne pas distraire l’utilisateur de la tâche principale qu’il a à accomplir.

Pour conclure, le motion design est une discipline à la définition assez simple mais qui s’avère être plus complexe que ce que l’on peut imaginer. L’objectif est donc pour nous de rendre cette complexité invisible auprès de nos clients afin de leur fournir la meilleure expérience possible. Par ailleurs, bien que très jeune, ce métier commence à atteindre un certain degré de maturité au sein des entreprises. Il est donc important de continuer à l’évangéliser au sein de notre entreprise afin qu’il devienne une étape incontournable sur chaque projet.

Sources : L’Ecole de Design Nantes Atlantique : Le motion Design

Wikipedia : [Motion Design]

Kornikan Motion Blog : Mais c’est quoi le motion design ?

Wikipedia : [Le Thaumatrope] [Le Phenakisticope]

Wikipedia : [12 basic principles of animation]

Medium : UX in Motion  

retour aux articles