Guide d'utilisation Annuler

Utilisation de vidéos

  1. Guide de l’utilisateur d’Adobe XD
  2. Introduction
    1. Nouveautés d’Adobe XD
    2. Questions fréquentes
    3. Design, création de prototypes et partage avec Adobe XD
    4. Configuration requise
      1. Configuration matérielle et logicielle requise
      2. Adobe XD, Big Sur et Apple Silicon | macOS 11
    5. Notions de base concernant l’espace de travail
    6. Changement de langue dans l’application Adobe XD
    7. Accès aux kits de conception d’interface utilisateur
    8. Accessibilité dans Adobe XD
    9. Raccourcis clavier
    10. Conseils et astuces
    11. Options d’abonnement à Adobe XD
    12. Modifications apportées à la formule de lancement d’Adobe XD
  3. Conception
    1. Plans de travail, repères et calques
      1. Prise en main des plans de travail
      2. Utilisation des guides et des grilles
      3. Création de plans de travail défilants
      4. Utilisation de calques
      5. Création de groupes de défilement
    2. Formes, objets et chemins
      1. Sélection, redimensionnement et rotation d’objets
      2. Déplacement, alignement, répartition et disposition d’objets
      3. Regroupement, verrouillage, duplication, copie et retournement d’objets
      4. Application d’un contour, d’un fond ou d’une ombre portée à un objet
      5. Création d’éléments répétés
      6. Création de designs en perspective avec des transformations 3D
      7. Modification d’objets à l’aide d’opérations booléennes
    3. Texte et polices
      1. Utilisation d’outils de dessin et de texte
      2. Polices dans Adobe XD
    4. Composants et états
      1. Utilisation de composants
      2. Utilisation de composants imbriqués
      3. Ajout de plusieurs états aux composants
    5. Masquage et effets
      1. Création d’un masque avec des formes
      2. Utilisation des effets de flou
      3. Création et modification de dégradés
      4. Application des effets de fusion
    6. Mise en page
      1. Redimensionnement réactif et contraintes
      2. Définition d’un remplissage fixe pour des composants et des groupes
      3. Création de conceptions dynamiques avec des piles
    7. Vidéos et animations Lottie
      1. Utilisation de vidéos
      2. Création de prototypes avec des vidéos
      3. Utilisation d’animations Lottie
  4. Prototypage
    1. Création de prototypes interactifs
    2. Animation des prototypes
    3. Propriétés d’objet prises en charge pour l’animation automatique
    4. Création de prototypes avec clavier et manette de jeu
    5. Création de prototypes à l’aide de la lecture et des commandes vocales
    6. Création de transitions temporisées
    7. Ajouter des incrustations
    8. Conception de prototypes de voix
    9. Création de liens d’ancrage
    10. Création d’hyperliens
    11. Aperçu de designs et de prototypes
  5. Partage, exportation et révision
    1. Partage des plans de travail sélectionnés
    2. Partage de conceptions et de prototypes
    3. Définition des autorisations d’accès pour les liens
    4. Utilisation de prototypes
    5. Révision de prototypes
    6. Utilisation des spécifications techniques
    7. Partage de spécifications techniques
    8. Inspection de spécifications techniques
    9. Navigation dans les spécifications techniques
    10. Révision des spécifications techniques et commentaires
    11. Exportation d’actifs de conception
    12. Exportation et téléchargement de fichiers à partir de spécifications techniques
    13. Partage de groupe pour les entreprises
  6. Chartes graphiques
    1. Chartes graphiques et bibliothèques Creative Cloud
    2. Utilisation d’actifs de document dans Adobe XD
    3. Utilisation des bibliothèques Creative Cloud dans Adobe XD
    4. Migration d’actifs liés vers les bibliothèques Creative Cloud
    5. Utilisation des jetons de conception 
    6. Utilisation d’actifs provenant de bibliothèques Creative Cloud
  7. Documents en ligne
    1. Documents en ligne dans Adobe XD
    2. Collaboration et cocréation de conceptions
    3. Cocréation de documents partagés
  8. Intégrations et plug-ins
    1. Utilisation d’actifs externes
    2. Utilisation d’actifs de création provenant de Photoshop
    3. Copier-coller d’actifs depuis Photoshop
    4. Importation ou ouverture de conceptions Photoshop
    5. Utilisation des fichiers Illustrator dans Adobe XD
    6. Ouverture et importation de conceptions Illustrator
    7. Copie de vecteurs d’Illustrator vers XD
    8. Plug-ins pour Adobe XD
    9. Création et gestion des plug-ins
    10. Intégration Jira pour XD
    11. Plug-in Slack pour XD
    12. Plug-in Zoom pour XD
    13. Publication de designs depuis XD vers Behance
  9. XD pour iOS et Android
    1. Aperçu sur appareils mobiles
    2. FAQ concernant Adobe XD pour mobile
  10. Résolution des problèmes
    1. Problèmes connus et résolus
      1. Problèmes connus
      2. Problèmes résolus
    2. Installation et mises à jour
      1. XD semble incompatible avec Windows
      2. Code d’erreur 191
      3. Code d’erreur 183
      4. Problèmes d’installation des modules externes XD
      5.  Invitation à désinstaller et réinstaller Adobe XD sur Windows 10
      6. Problèmes liés à la migration des préférences
    3. Lancement et blocage
      1.  XD se bloque au lancement sur Windows 10
      2.  XD se ferme lorsque vous vous déconnectez de Creative Cloud
      3. Problème lié à l’état d’un abonnement sur Windows
      4. Avertissement d’application bloquée lors du lancement de XD sur Windows
      5. Génération du fichier de vidage sur Windows
      6. Collecte et partage de journaux d’incidents
    4. Documents en ligne et bibliothèques Creative Cloud
      1. Problèmes liés aux documents en ligne XD
      2. Problèmes relatifs aux composants liés
      3. Problèmes relatifs aux bibliothèques et aux liens
    5. Prototype, publication et révision
      1. Impossible d’enregistrer les interactions de prototypes sur macOS Catalina
      2. Problèmes liés aux workflows de publication
      3. Les liens publiés n’apparaissent pas dans les navigateurs
      4. Les prototypes ne s’affichent pas correctement dans les navigateurs
      5. Le panneau de commentaires s’affiche soudainement sur les liens partagés
      6. Impossible de publier des bibliothèques
    6. Importation, exportation et utilisation d’autres applications
      1. Importation et exportation dans XD
      2. Fichiers Photoshop dans XD
      3. Fichiers Illustrator dans XD
      4. Exportation dans After Effects à partir de XD
      5. Fichiers Sketch dans XD
      6. ++Applications tierces non visibles lors de l’exportation

Découvrez comment utiliser des vidéos dans Adobe XD pour créer de expériences de design immersives.

XD vous permet d’importer des vidéos, d’ajuster les paramètres vidéo de base et de contrôler la lecture. Après avoir réglé la lecture vidéo et relié votre prototype, vous pouvez le prévisualiser avant de le partager.

Importer une vidéo, ajuster les paramètres et définir une option de lecture
Importer une vidéo, ajuster les paramètres et définir une option de lecture

Lectures suggérées

4 étapes pour créer et partager des interactions vidéo

Pour commencer, importez une vidéo et ajustez ses paramètres. Définissez ensuite une option de lecture, prévisualisez le prototype et partagez-le avec les intervenants pour qu’ils l’examinent.

Importation d’une vidéo

Ajustement des paramètres vidéo

Définition d’une option de lecture

Aperçu et partage

Importation d’une vidéo

Pour importer une vidéo dans XD, faites-la glisser vers un plan de travail. Vous pouvez également choisir Fichier > Importer.

Format de fichier vidéo

MP4

Compression vidéo (codec)

 H.264

Module de compression/décompression des données audio

AAC

Taille maximale

25 Mo

Résolution maximale

4 K

Si votre vidéo ne respecte pas les exigences indiquées dans le tableau, vous obtenez une erreur lors de son importation dans XD.

Convertissez ou découpez la vidéo pour qu’elle respecte les critères définis. Adobe Media Encoder est fortement recommandé.

Convertir ou couper une vidéo à l’aide de Media Encoder

Vous pouvez utiliser Adobe Media Encoder pour préparer rapidement et facilement votre vidéo avant de l’importer dans XD.

Télécharger Adobe Media Encoder

Suivez les étapes ci-dessous :

  1. Ouvrez Media Encoder. Accédez à Fichier > Ajouter une source, localisez votre vidéo, puis cliquez sur Ouvrir.

  2. Localisez votre vidéo dans la File d’attente, puis cliquez sur le lien Préréglage.

    Cliquez sur le lien Préréglage de la vidéo
    Cliquez sur le lien Préréglage de la vidéo

  3. Dans la fenêtre Paramètres d’exportation, procédez comme suit :

    1. Assurez-vous que le champ Format est défini sur H.264.
    2. Pour réduire la taille de votre vidéo à moins de 15 Mo, rognez la vidéo ou choisissez un préréglage avec une résolution inférieure. Lorsque vous rogne la vidéo ou essayez différents préréglages, vous pouvez voir la taille estimée du fichier dans le coin inférieur droit de la fenêtre. Le préréglage recommandé est Haute qualité 720p HD.
    3. Cliquez sur OK.

    Le préréglage recommandé est Haute qualité 720p HD.

    Sélectionnez le format H.264 et découpez la vidéo ou choisissez un préréglage de résolution inférieure
    Sélectionnez le format H.264 et découpez la vidéo ou choisissez un préréglage de résolution inférieure

  4. Dans la file d’attente, cliquez sur le bouton de lecture vert dans le coin supérieur droit pour exporter.

  5. Ouvrez XD et importez la vidéo.

Ajustement des paramètres vidéo

Une fois importée, la première image de la vidéo est affichée sur la zone de travail. Lorsque vous sélectionnez la vidéo en mode Design, vous voyez une icône de lecture  dans son coin supérieur gauche.

Pour prévisualiser la vidéo ou ajuster ses paramètres, cliquez sur le bouton   dans la section Vidéo de l’Inspecteur Propriétés. L’affichage tête haute (HUD) s’ouvre. Dans l’affichage tête haute :

  • Vous pouvez prévisualiser la vidéo en cliquant sur Lecture  .
  • Vous pouvez couper la vidéo, modifier sa miniature, définir la lecture en boucle ou désactiver l’audio.

Rognage de la vidéo

Rognage de la vidéo
Rognage de la vidéo

  1. Cliquez sur Rogner  .
  2. Sélectionnez une séquence en faisant glisser les points de départ et d’arrêt sur le curseur.
  3. Cliquez sur la coche   pour enregistrer la séquence.

Les images ne sont pas supprimées lorsque vous les rognez. Cliquez à nouveau sur Rogner   pour récupérer les images.

Modification de la miniature de vidéo

Modification de la miniature de vidéo
Modification de la miniature de vidéo

  1. Cliquez sur l’icône Miniature   pour ouvrir l’explorateur. 
  2. Parcourez et choisissez une image.
  3. Cliquez sur Importer.

Pour supprimer une miniature, cliquez sur Supprimer  .

Définir la lecture en boucle

Définir la lecture en boucle
Définir la lecture en boucle

Utilisez le bouton Lire en boucle pour activer ou désactiver la lecture en boucle de la vidéo.

Activer ou désactiver l’audio

Activer ou désactiver l’audio
Activer ou désactiver l’audio

Cliquez sur l’icône de haut-parleur (  |  ) pour activer ou désactiver le son de la bande-son de la vidéo.

Définition d’une option de lecture

Définition d’une option de lecture pour votre vidéo
Définition d’une option de lecture pour votre vidéo

Après avoir ajusté les paramètres vidéo, contrôlez à quel moment votre vidéo sera lue en choisissant une option de lecture.

En mode Design, dans la section Vidéo de l’Inspecteur Propriétés, choisissez un préréglage :

  • Appuyer pour lire (par défaut)  
  • Lire automatiquement
  • Pas de lecture

Le choix d’une option de lecture en mode Design crée automatiquement des interactions pour votre vidéo en mode Prototype.

Pour en savoir plus sur les options de lecture vidéo et les personnalisations, consultez la section Création de prototypes avec des vidéos.

Prévisualisation du prototype et partage

Prévisualisation du prototype dans l’application, sur un appareil mobile ou dans un navigateur
Prévisualisation du prototype dans l’application, sur un appareil mobile ou dans un navigateur

Lorsque votre design est prêt à être partagé avec les intervenants, définissez les autorisations d’accès appropriées, puis publiez le lien vers le prototype ou les spécifications techniques et partagez-le.

Limitations actuelles

  • Seules des vidéos MP4 peuvent être importées dans XD, chaque vidéo ne devant pas excéder 25 Mo.
  • Vous pouvez importer jusqu’à 20 vidéos uniques dans un document XD.
  • Les actifs vidéo ne peuvent pas être exportés depuis le menu Fichier > Exporter. Cependant, la vidéo sera disponible dans les spécifications techniques.
  • Une seule vidéo peut se lancer à la fois.
  • Lorsque le type d’action n’est pas Animation automatique, le lancement d’un autre déclencheur arrête la lecture vidéo.
  • La lecture automatique des vidéos peut entraîner un conflit avec les déclencheurs Temps d’un plan de travail ou d’une animation Lottie.
  • Il n’est pas possible de remplacer une vidéo dans une grille de répétition.
  • À l’exception de la première vidéo, l’option Pas de lecture est définie par défaut pour les autres vidéos de la grille de répétition.
  • Les options de retournement sont désactivées pour les vidéos dans la section Transformation de l’Inspecteur Propriétés.
  • Les propriétés Fond et Bordure ne sont pas disponibles pour les vidéos.
  • Les angles arrondis ne sont pas disponibles pour les vidéos dans la section Apparence de l’Inspecteur Propriétés.

Ressources associées

Vous avez une question ou une suggestion ?

questions à la communauté

Vous avez une question à poser ou une idée à partager ? Venez participer à la communauté Adobe XD. Nous serions ravis de vous compter parmi nous et de découvrir vos créations !

Logo Adobe

Accéder à votre compte