PerfectVector
Par Irene Kim10 min de lecture

Import SVG Apple Motion : vérifie avant d’animer

Importe un SVG statique dans Apple Motion, vérifie transparence et fonctions non prises en charge et décide si des objets séparés sont nécessaires.

Sur cette page

Apple Motion prend en charge l’importation SVG. Le guide des fonctions Motion 6.3 d’Apple liste cette prise en charge : les anciens conseils demandant de convertir tous les SVG dans un autre format ne sont donc pas un point de départ fiable pour cette version. Commence par un fichier statique, importe-le comme média et vérifie le résultat avant de construire l’animation.

Trois questions distinctes se posent : l’illustration apparaît-elle, sa transparence est-elle correcte et peux-tu contrôler les parties qui doivent bouger indépendamment ? Une illustration visible dans la zone de dessin répond uniquement à la première. Cela ne prouve pas que chaque tracé SVG est devenu une forme Motion native.

Ce processus utilise un emblème simple composé d’un anneau et d’un disque pour rendre ces vérifications visibles. C’est une procédure documentée à essayer dans ta version installée, pas un compte rendu de test d’importation Motion natif.

Adapte le processus à ta version Motion et à ta tâche

Vérifie la version installée avant de suivre un ancien message de forum ou d’importer une grande collection. Le guide SVG actuel d’Apple décrit l’utilisation prise en charge et les limites précises. Si ton installation diffère de la version documentée, vérifie le guide correspondant avant de diagnostiquer l’illustration elle-même.

Décide ce qui doit se produire après importation :

Résultat souhaitéCe que la livraison doit fournirVérification d’acceptation
Déplacer ou redimensionner tout l’emblèmeIllustration statique correctement affichéeTout le dessin réagit ensemble
Déplacer le petit disque indépendammentObjets contrôlables séparémentDéplacer le disque laisse l’anneau inchangé
Remodeler l’anneau dans le tempsForme native adaptée ou autre construction modifiableContrôles géométriques nécessaires disponibles
Préserver une animation SVG existanteMéthode distincte de livraison d’animation planifiéeImages et chronologie prévues survivent à cette méthode

La dernière ligne compte particulièrement. La documentation SVG de Motion indique que les SVG animés affichent uniquement leur première image. Importer un fichier animé ne revient pas à importer son animation.

Si tu choisis entre plusieurs applications d’animation, le guide de vectorisation de logos After Effects et le processus de vectorisation Adobe Animate expliquent leurs objets de destination propres. Leurs commandes et types d’objets ne sont pas interchangeables avec l’importation de médias Motion.

Pars d’une source que tu peux examiner

Enregistre cet exemple original sous orbit-mark.svg :

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 160 120">
  <circle cx="68" cy="66" r="34" fill="none" stroke="#157D78" stroke-width="14"/>
  <circle cx="126" cy="24" r="12" fill="#EF8067"/>
</svg>

L’anneau bleu-vert a un centre vide. Un petit disque corail se trouve au-dessus à droite, séparé par un espace. Le fichier n’a ni rectangle de fond, ni texte, ni référence d’image externe, ni script, ni animation. Ces choix fournissent une base utile pour vérifier ensuite un emblème plus élaboré.

Ouvre-le d’abord dans l’éditeur source. Vérifie l’ouverture de l’anneau, l’espace et la limite de la zone de dessin. Conserve l’original modifiable, car corriger l’illustration et corriger un réglage d’importation sont deux tâches différentes.

Pour ton fichier, simplifie la copie de livraison uniquement là où une fonction précise pose problème. Un dessin comportant du lettrage nécessite une stratégie explicite de polices ; utilise la liste de vérification des changements de police SVG avant exportation. Préserve le texte modifiable dans l’original même si la copie de livraison nécessite du texte converti en tracés. Ne vectorise pas un vecteur déjà utilisable simplement parce que l’application de destination est différente.

Illustration comparant un emblème anneau-disque contrôlé comme une illustration unique au même anneau et disque préparés comme objets séparés
Illustration : une image entière et des parties contrôlables indépendamment sont des livraisons différentes. Déplacer le disque corail seul est la vérification pratique ; un emblème net ne prouve pas une conversion en formes natives.

Importe dans la composition, puis vérifie le média

Sélectionne le groupe où doit apparaître l’emblème. Dans le processus actuel d’importation Motion, choisis File > Import > Media, ou appuie sur Command-I, sélectionne le SVG et importe-le. Tu peux aussi faire glisser le fichier depuis Finder vers la zone de dessin ou un groupe dans la liste Layers.

Après importation, cherche l’illustration dans la zone de dessin et son calque dans le groupe prévu. Ne juge pas le fichier uniquement sur la présence de son nom dans la liste Media. Apple décrit aussi l’importation dans cette liste sans ajout du média à la composition ; dans ce cas, il n’apparaît pas encore dans la zone de dessin ni dans la liste Layers.

Place l’emblème sur un fond contrasté pour l’examiner. Regarde le centre ouvert et l’espace entre les deux parties. Un fond sombre dans le logiciel peut rendre trompeusement similaires contenu manquant et contenu transparent.

Pour examiner la substitution de fond dans Motion, clique sur Media dans le panneau Project et sélectionne l’objet SVG. Ouvre Media Inspector. La page SVG d’Apple décrit Use Background Color et les contrôles de couleur associés. Laisse cette substitution désactivée pour conserver les zones transparentes de la source ; active-la uniquement si une couleur de remplacement est voulue.

Un rectangle opaque déjà dessiné dans le SVG est un problème distinct. Désactiver une option de fond de média ne retire pas un tracé appartenant à l’illustration. Le guide des fonds SVG transparents traite de ce diagnostic dans la source.

Teste le contrôle des parties avant d’ajouter des images clés

Sélectionne l’emblème importé et change légèrement sa position de façon réversible. Si l’anneau et le disque bougent ensemble, ce comportement est utile pour une illustration unique. Rétablis sa position, puis détermine si l’animation prévue nécessite davantage de contrôle.

Pour un disque qui bouge indépendamment, essaie de sélectionner et déplacer uniquement cette partie. Accepte la livraison seulement lorsque l’anneau reste en place et que l’objet souhaité est ciblable séparément. Un nom de groupe SVG, un espace visible ou une vignette de calque ne suffisent pas comme preuves.

Si l’objet disponible n’expose pas les contrôles nécessaires, choisis une construction qui le fait. Pour cet exemple simple, dessiner un anneau et un disque comme formes natives séparées est une possibilité raisonnable. Le guide des formes simples d’Apple explique l’outil Circle et ses contrôles de couleur et de contour. Construis l’anneau avec un contour et un remplissage vide, et le disque avec un remplissage uni, puis vérifie la sélection de chaque objet séparément.

Pour une illustration plus élaborée, une autre possibilité consiste à préparer des fichiers sources séparés pour les parties devant bouger indépendamment. Conserve une zone de dessin commune et note leur alignement prévu dans l’éditeur source. Vérifie leur placement après importation ; une collection de fichiers n’est pas automatiquement une disposition prête à animer.

C’est un choix concernant les objets nécessaires, pas une promesse que l’importation SVG divise l’illustration en formes natives. Si tu as besoin d’une déformation point par point, établis que la construction choisie fournit les contrôles géométriques nécessaires avant de t’engager dans l’animation.

Diagnostique le contenu non pris en charge avec une copie plus simple

Les limites SVG d’Apple identifient plusieurs raisons expliquant un écart avec l’éditeur source. Utilise le symptôme pour choisir la vérification suivante.

SymptômeLimite documentée ou vérification probableÉtape suivante
Un SVG animé reste immobileMotion affiche sa première imageTraiter l’import comme statique ; planifier le mouvement séparément
Un SVG avec fondu d’entrée semble videSa première image peut être transparenteExporter un état statique visible pour livrer l’illustration
Un fichier avec des polices personnalisées ne s’importe pasLes SVG à polices personnalisées ne sont pas pris en chargePréparer une copie adaptée et garder l’original modifiable
Une image attendue devient un emplacement réservéLes références d’images externes ne sont pas prises en chargeRemplacer la dépendance par une ressource de livraison autonome adaptée et la tester
Du contenu lié ou scripté manqueLes objets JavaScript et liens intégrés n’apparaissent pasSupprimer la dépendance au comportement interactif
Des formes partiellement transparentes diffèrentLes opacités variables peuvent être rendues différemmentComparer une copie simplifiée et la composition prévue

N’interprète pas la limite des références externes comme preuve que toutes les fonctionnalités possibles d’un SVG autonome fonctionnent. Un fichier de base plus petit aide à isoler la dépendance, mais ton illustration finale nécessite encore sa propre vérification.

Une fois l’apparence statique correcte, examine l’emblème aux plus petites et plus grandes tailles de la composition. Surveille l’ouverture intérieure de l’anneau et l’espace près du disque. Examine ensuite une courte section exportée à la résolution de livraison prévue. La géométrie source vectorielle ne dispense pas de vérifier la composition, les effets et l’image vidéo finale.

Prépare un emblème uniquement matriciel pour Motion

Si l’emblème modifiable manque et qu’il ne reste qu’un PNG ou JPG simple, le processus d’image en vecteur PerfectVector peut aider à préparer un candidat SVG statique. Recadre sur l’emblème, examine l’aperçu pour repérer une ouverture remplie, un disque fusionné ou des formes de fond indésirables et compare le candidat à la source. Télécharge l’illustration acceptée, puis répète les vérifications d’importation et d’objets indépendants.

La vectorisation ne récupère pas les images clés, la chronologie, les calques Motion natifs ou un système d’animation. Utilise l’original vectoriel existant si disponible. Garde les photos et images riches en effets sous forme matricielle si cela préserve mieux leur apparence ; dessine directement un anneau et un disque simples dans Motion si le véritable besoin est le contrôle d’objets natifs.

Avant de transmettre le projet, note le nom de la source, la version Motion, le choix du fond et les éléments devant rester séparés. Inclus l’original modifiable et une référence montrant la disposition souhaitée. Les processus d’illustration du blog traitent des choix de préparation précédant cette transmission.

FAQ

Apple Motion peut-il importer directement des fichiers SVG ? Oui. La documentation Motion 6.3 d’Apple liste la prise en charge SVG. Utilise le processus d’importation de ta version installée, puis examine l’illustration et les contrôles nécessaires.

Importer un SVG préserve-t-il son animation ? Non. Motion affiche uniquement la première image d’un SVG animé. Si elle est transparente, l’illustration importée peut sembler vide.

Pourquoi mon SVG possède-t-il un fond coloré dans Motion ? Vérifie Use Background Color dans Media Inspector et recherche une forme de fond opaque dans la source. Un réglage de fond du média et un rectangle dessiné dans le SVG sont des causes séparées.

Chaque tracé SVG devient-il une forme Motion modifiable ? Ne le suppose pas après une importation réussie. Teste la disponibilité des parties et contrôles géométriques nécessaires. Prépare des objets séparés ou utilise une construction native adaptée si l’animation exige un contrôle indépendant.

Sources

  1. Apple — nouveautés de Motion — Prise en charge SVG documentée dans Motion 6.3.
  2. Apple — travailler avec les fichiers SVG dans Motion — Contrôles de transparence et limites des fonctions SVG.
  3. Apple — importer des médias dans Motion — Importation de médias, placement dans les groupes et importation uniquement dans la liste Media.
  4. Apple — dessiner des formes simples dans Motion — Solution native pour une géométrie simple contrôlée séparément.

Vérifie l’apparence et la structure d’objets d’un emblème avant de préparer toute la séquence. S’il ne reste qu’une illustration matricielle, prépare un candidat SVG statique, examine les parties séparées et valide le fichier accepté dans Motion avant de l’animer.

Plus depuis le blog

Repartez d’un SVG plus net
et plus facile à modifier