Ce document vous apprend à utiliser des animations orientées données.

Les animations orientées données sont créées à l’aide de données actives collectées auprès de diverses sources qui génèrent des animations dans votre composition. Vous pouvez utiliser des données provenant de plusieurs sources. Les données peuvent être statiques ou varier dans le temps. Vous pouvez importer les données dans votre projet After Effects et les utiliser comme une entrée pour animer des graphiques et des personnages, ou encore contrôler des effets visuels, des titres de films et d’autres animations graphiques.

Exemple d’animation orientée données
Exemple d’animation orientée données

Sources de données

Vous pouvez utiliser les données de quasiment toutes les sources possibles, par exemple :

  • Fichiers de données générés par le périphérique : données en provenance de dispositifs tels que des moniteurs d’activité physique qui enregistrent les activités au moyen de capteurs et les stockent dans différents formats de fichier. Il s’agit de données variables dans le temps, qui comprennent la vitesse, l’altitude, la distance, la fréquence cardiaque, ainsi que divers autres paramètres relatifs à l’activité de l’utilisateur.
  • Données statiques générées par l’utilisateur : données statiques globales, telles que des résultats d’enquête, pouvant être modifiées pour générer des graphiques. Un fichier de données créé par l’utilisateur peut fournir un workflow pour des données globales.
  • URL : les données actives provenant de sites Web, telles que le chemin d’entrée et de sortie d’un utilisateur qui parcourt une page Web, peuvent également être utilisées.
  • Métadonnées : données incorporées dans les métadonnées du fichier vidéo.

Formats d’entrée

Vous pouvez importer des fichiers de données dans les formats suivants :

  • JSON
  • MGJSON
  • CSV
  • TSV

Si vous disposez de fichiers de données dans d’autres formats, convertissez-les dans l’un des formats de fichier d’importation pris en charge et importez-les dans le projet After Effects. De nombreux outils de conversion sont disponibles pour convertir des fichiers de données aux formats pris en charge par After Effects.

Animation orientée données

Animation orientée données

Prise en charge de JSON standard (.json)

Vous pouvez importer un fichier JSON standard dans After Effects en tant que métrage. Les fichiers de données fonctionnent à l’arrière-plan. After Effects fait directement référence aux données de ces fichiers de données pour générer des animations dans les projets. Le métrage JSON n’est pas représenté sous forme de flux de données dans le panneau Montage. Vous pouvez faire référence aux données en utilisant des expressions sous forme d’objet JSON évalué.

Vous pouvez modifier les expressions afin de changer le mode de référencement des données. Vous pouvez écrire les données dans un éditeur de texte, qui est référencé par After Effects pour générer des animations. La prise en charge JSON est basée sur le schéma JSON, lequel spécifie et définit la manière dont une application utilise et modifie les données JSON.

Les types de données de base de JSON sont les suivants :

  • Nombre : nombre décimal signé.
  • Chaîne : suite de caractères Unicode (ou aucun caractère).
  • Booléen : valeur vraie (True) ou fausse (False).
  • Tableau : liste triée de plusieurs valeurs (ou aucune valeur).
  • Objet : collection non triée de paires de noms ou de valeurs où les noms (clés) sont des chaînes.
  • Nul : valeur vide, utilisant le mot « nul ».

Utilisation d’un fichier JSON dans After Effects

Pour travailler avec un fichier JSON standard, procédez comme suit :

  1. Sélectionnez Fichier > Importer.

  2. Pour importer, sélectionnezun fichier .JSON et cliquez sur Ouvrir.

  3. Le fichier est ajouté à votre fenêtre de projet. Créez une composition avec le métrage.

  4. Ajoutez un solide à la composition. Pour ajouter un solide, sélectionnez Calque > Solide.

  5. Dans le panneau Montage, ouvrez les propriétés du calque solide et cliquez ensuite sur le paramètre Opacité en maintenant la touche Alt enfoncée.

  6. Changez les données dans l’expression afin de modifier votre animation. Vous pouvez contrôler les données JSON et les données qui sont référencées à partir du fichier de données dans lequel toutes les informations sont stockées.

  7. Vous pouvez également remplacer le fichier JSON par un autre afin de modifier les données référencées. Pour le remplacer, sélectionnez Remplacer le métrage > Fichier, puis ouvrez le nouveau fichier à partir de votre ordinateur.

Pour utiliser les données, vous pouvez appliquer une expression sur la propriété qui doit être générée par les données. Ensuite :

  1. Utilisez l’attribut sourceData pour lire les données d’un fichier .JSON. Par exemple :

    var sampleData = footage("sample.json").sourceData;
  2. Pour renvoyer sa valeur, référencez la propriété spécifique dans les données JSON. Par exemple,

    myData.engineData.RPM or myData.latitude.value.

Prise en charge des fichiers Motions Graphics JSON (.mgjson)

Vous pouvez importer un fichier de données .mgJSON en tant que métrage dans votre projet. Lorsque vous ajoutez des données à une composition, les flux de propriétés de données sont regroupés dans un nouveau groupe de niveau supérieur « Données ». Le groupe de données affiche les données de séquences sous forme de propriétés. Chaque propriété du groupe de données est une expression liée au fichier de métrage qui accède à la valeur du fichier de données à l’aide de l’expression footage("foo.mgjson").dataValue(N). Ici N correspond au chemin d’accès au flux de données dans le fichier. MGJSON fonctionne sur la base d’un schéma, conçu pour simplifier le référencement et l’importation de flux de données dans After Effects.

Chaque propriété individuelle de données possède une expression appliquée qui lie cette propriété aux données dans le fichier .mgJSON. Si le fichier source .mgJSON est modifié, les valeurs des propriétés de données sont automatiquement mises à jour.

Dans le panneau Montage, vous pouvez ouvrir les calques Données et utiliser l’icône de sélection pour lier des paramètres entre eux. Les modifications sont automatiquement renseignées.

Utilisation de métrage MGJSON dans After Effects

Pour travailler avec un fichier MGJSON, procédez comme suit :

  1. Sélectionnez Fichier > Importer.

  2. Pour importer, sélectionnezun fichier MGJSONet cliquez sur Ouvrir.

  3. Le fichier est ajouté à votre fenêtre de projet. Créez une composition avec le métrage.

  4. Importez un élément dans le projet et ajoutez-le à la composition.

  5. Dans le panneau Montage, ouvrez les propriétés du métrage.

  6. À l’aide de l’icône de sélection, appliquez l’une des propriétés de l’élément (par exemple, Rotation) à l’un des flux de données du calque de données. La propriété de l’élément actif fait désormais référence à des données du calque de données. L’expression de chaque flux de données répercuté tire sa valeur du fichier de métrage.

  7. Lorsque vous prévisualisez le métrage, l’élément s’anime en fonction du flux de données du calque de données.

Vous pouvez également convertir les échantillons de données du fichier de données en images clés. Pour effectuer une conversion en images clés, procédez comme suit :

  1. Importez le fichier MGJSON dans votre projet et faites-le glisser dans le panneau Montage.

  2. Cliquez avec le bouton droit de la souris sur le calque de données et sélectionnez ensuite Assistant d’image clé > Créer des images clés à partir des données dans le menu Calque et Assistant d’image clé.

  3. Pour afficher les images clés, ouvrez le calque de données.

Remarque :

Après la conversion des images clés, les données ne sont plus actives, ni référencées à partir du fichier de données.

Vous pouvez également afficher les données actives sous la forme d’un graphique dans l’éditeur de graphiques. Pour ce faire, cliquez sur l’icône Éditeur de graphiques dans le panneau Montage.

Les animations orientées données utilisent des références d’expression. Pour plus d’informations, reportez-vous à Animation orientée données (référence d’expression).

Alignement de vidéo sur des données mgJSON

La commande Calque > Heure > Aligner la vidéo sur les données décale les calques vidéo de diverses images, tel que le spécifie un fichier mgJSON. Cette commande permet d’aligner temporellement la vidéo sur des échantillons de données stockés dans le fichier mgJSON correspondant. Par exemple, si vous avez capturé des données pendant une course, mais que l’heure de début de la vidéo ne correspond pas à celle des données capturées, vous pouvez spécifier un décalage pour que les données soient automatiquement alignées.

Pour aligner la vidéo sur des données mgJSON, procédez comme suit :

  1. Ajoutez le fichier .mgJSON à une composition qui contient également les calques cibles.
  2. Sélectionnez à la fois le calque .mgJSON et les calques cibles.
  3. Sélectionnez Calque > Heure > Aligner la vidéo sur les données.

Pour que cet alignement fonctionne, le fichier mgJSON doit contenir un groupe videoSyncTimeList qui définit :

  • le nom d’un ou de plusieurs calques cibles (fileName) ;
  • le nombre d’images (frameNumber) selon lesquels décaler ces calques depuis le début du calque de données.

Par exemple :

"videoSyncTimeList": [
  {
    "fileName": "sample1.mp4",
    "frameNumber": 1000
  },

  {
    "fileName": "sample2.mp4",
    "frameNumber": -1000
  }

La valeur fileName doit correspondre au nom de calque d’un calque sélectionné et non pas au nom source du calque. Si vous remplacez le nom d’un calque par celui d’une source dans votre composition, par exemple, vous renommez le calque « sample1.mp4 » en « vidéo course 1 », vous devez aussi modifier conséquemment la valeur fileName dans le fichier mgJSON. Les calques référencés par fileName ne doivent pas être obligatoirement des éléments de métrage contenant un fichier source. Il peut également s’agir de solides, de compositions imbriquées ou d’autres types de calques.

Des valeurs frameNumber positives décalent le calque cible vers la gauche (avant le calque de données). Des valeurs frameNumber négatives décalent le calque cible vers la droite (après le calque de données). Une valeur frameNumber de 0 aligne le début du calque cible sur celui du calque de données.

Prise en charge des formats CSV (.csv) et TSV (.tsv ou .txt)

Dans After Effects, vous pouvez importer des fichiers de valeurs séparées par des virgules (.csv) et par des tabulations (.tsv ou .txt) en tant que métrage et les utiliser comme sources de données. Les fichiers CSV et TSV stockent les données tabulaires au format de texte brut avec des valeurs séparées par des virgules ou des tabulations. Les fichiers de données CSV et TSV fonctionnent de la même manière que les fichiers JSON.

Pour utiliser des fichiers de données CSV ou TSV dans After Effects, procédez comme suit :

  1. Importez un fichier CSV ou TSV dans votre projet sous forme de métrage, de la même manière que vous importez un fichier de type vidéo, audio ou autre.
    Choisissez l’une des méthodes suivantes pour importer vos fichiers en tant que métrage :
    • Sélectionnez Fichier > Importer.
    • Cliquez avec le bouton droit sur le panneau Projets et sélectionnez Importer > Type de fichier.
    • Double-cliquez sur le panneau Projets.
  2. Le fichier est ajouté à votre fenêtre de projet. Créez une composition avec le fichier.

  3. Dans le panneau Montage, ouvrez les propriétés du métrage. Liez les propriétés de données du calque de la composition à un autre calque à l’aide de l’icône de sélection d’expressions ou de liens de propriété. Pour ouvrir le champ textuel des expressions, maintenez la touche Maj enfoncée et cliquez sur l’icône du minuteur en regard du nom du calque. Vous pouvez également lier les propriétés des données au moyen de la commande Édition > Copier avec des liens de propriété.

    Pour en savoir plus sur les propriétés des données de calque dans le montage, reportez-vous à Notions de base relatives aux propriétés de données.

  4.  Pour référencer le fichier de métrage des données, appliquez une expression sur la propriété qui doit être générée par les données. Utilisez l’attribut de métrage dataValue() pour lire les données issues d’une ligne et d’une colonne spécifiées. Les lignes et les colonnes sont indexées par zéro. Par exemple, footage("sample.tsv").dataValue([15,1]) renvoie la valeur de la ligne 16 de la deuxième colonne.

Notions de base relatives aux propriétés de données

Lorsque vous ajoutez un fichier JSON, CSV ou TSV à une composition et ouvrez ensuite les propriétés, seul un groupe de propriétés Données est présent, au lieu du groupe de propriétés Transformation. Le groupe Propriétés de données contient la hiérarchie des données définie dans le fichier.

Groupe Propriétés de données JSON dans le panneau Montage
Groupe Propriétés de données JSON dans le panneau Montage
Groupe Propriétés de données CSV et TSV dans le panneau Montage
Groupe Propriétés de données CSV et TSV dans le panneau Montage

Ce groupe de données est similaire à la façon dont After Effects traite les fichiers Motion Graphics JSON (.mgJSON). La différence réside dans le fait que JSON, CSV et TSV peuvent contenir uniquement des valeurs de données statiques, alors que mgJSON peut contenir des données dynamiques (qui évoluent dans le temps).

Chaque propriété individuelle de données possède une expression appliquée qui lie cette propriété aux données dans le fichier JSON, CSV ou TSV. Si vous modifiez le fichier de données source, les valeurs de propriété de données reflètent la modification.

Liaison de propriétés avec l’icône de sélection de liens de propriété

Si vous ne souhaitez pas écrire d’expressions complexes, vous pouvez utiliser l’icône de sélection Lien de propriété ou la commande Édition > Copier avec des liens de propriété pour lier les propriétés de données aux propriétés d’autres calques. Lorsque vous liez les calques, l’icône de sélection Lien de propriété écrit automatiquement des expressions à votre place.

Bibliothèques de fonctions d’expression personnalisées - JSX

Dans After Effects 15.0, il était possible d’importer un fichier JSON définissant des fonctions JavaScript personnalisées que vous pouviez utiliser comme bibliothèque de fonctions d’expression personnalisées. Dans After Effects 15.1, les objets JavaScript ne constituent pas une syntaxe légale pour JSON. After Effects 15.1 utilise un analyseur JSON différent strict et qui n’autorise pas l’importation d’un fichier JSON avec une syntaxe illégale.

Si vous essayez d’importer un fichier JSON avec une fonction JavaScript définie dans After Effects 15.1 ou que vous ouvrez un projet contenant ce type de fichier, After Effects affiche une erreur.

Pour éviter ce problème, vous pouvez importer un fichier d’extension de syntaxe JavaScript (.jsx) dans After Effects 15.1. Le contenu du fichier JSX peut être identique à celui d’un fichier JSON importé dans After Effects 15.0. Il vous suffit de remplacer l’extension du fichier par .jsx. Si vous ouvrez un projet existant contenant un fichier JSON qui ne fonctionne pas, utilisez Fichier > Remplacer le métrage pour remplacer le fichier JSON par le fichier JSX. Les références d’expression au fichier JSON sont remplacées par des références au fichier JSX.

Problèmes connus avec les animations orientées données

Lorsque vous utilisez des animations orientées données dans After Effects, certains problèmes peuvent se poser. Pour en prendre connaissance, consultez les problèmes connus avec les animations orientées données.

Ce produit est distribué sous licence Creative Commons Attribution - Pas d’utilisation commerciale - Partage à l’identique 3.0 non transposé  Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.

Mentions légales   |   Politique de confidentialité en ligne