Guide d'utilisation Annuler

Création de prototypes avec clavier et manette de jeu

  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

Apprenez à créer un prototype en utilisant le clavier et la manette de jeu comme déclencheurs.

déclencheurs de clavier et de manette de jeu

Adobe XD vous permet d’utiliser des raccourcis clavier et des déclencheurs de manette de jeu pour simuler des applications de bureau natives et des prototypes pour une expérience de jeu ou une conception plus riche. Lors de la connexion d’un prototype, vous pouvez sélectionner l’option Touches/Manette de la liste déroulante Déclencheur et attribuer une touche. Vous pouvez ensuite lire ou enregistrer ces animations dans la fenêtre d’aperçu, un navigateur web ou des applications mobiles et les partager avec les parties prenantes pour des revues collaboratives. Le récit du prototype est ainsi plus vivant, tout en ajoutant une couche riche à l’expérience client globale.

Vous pouvez choisir Touches/Manette pour :

  • Relier un objet individuel ou un plan de travail à un autre plan de travail.
  • Relier deux états de composants.
  • Relier l’état d’un composant à un autre plan de travail.
  • Lire la parole, l’audio, la vidéo ou Lottie.

Utilisation de déclencheurs de clavier

Lors du prototypage de certaines applications de bureau, de fonctions d’accessibilité, de raccourcis ou de jeux, vous avez besoin d’un clavier pour interagir avec le prototype. Dans le prototype, utilisez les raccourcis clavier comme déclencheurs pour passer d’un écran ou d’un état à l’autre, ou lisez la parole, l’audio, la vidéo ou Lottie.

Lorsque vous connectez un prototype, sélectionnez Touches/Manette. Appuyez ensuite sur n’importe quelle touche du clavier pour l’affecter en tant que déclencheur pour un objet en particulier, un état de composant ou un plan de travail complet. Cela signifie que vous pouvez avoir plusieurs déclencheurs à partir du même plan de travail.

Déclencheur de clavier
Déclencheurs de clavier

A. Déclencheur défini sur le raccourci clavier B. Raccourci clavier C. Action définie sur Animation automatique. D. Plan de travail de destination ou un état de composant 

Vous pouvez également associer une touche à un modificateur pour définir des déclencheurs à l’aide de raccourcis tels que CMD S, CTRL R. Vous ne pouvez pas utiliser la barre d’espace ni d’autres touches de niveau système telles que fonction, veille, volume et alimentation. Lorsque vous affectez plusieurs déclencheurs avec le même raccourci sur le même plan de travail, le dernier déclencheur est affecté et se déclenche lors d’un aperçu.

Utilisation de déclencheurs de manette de jeu

La meilleure façon de tester un prototype de jeu consiste à utiliser le matériel réel du contrôleur de jeu. Dans le prototype, utilisez les manettes de jeu comme déclencheurs pour passer d’un écran ou d’un état à l’autre, ou lisez la parole, l’audio, la vidéo ou Lottie. Interagissez ensuite avec le prototype dans un lecteur de bureau ou un navigateur Web à l’aide d’une manette de jeu connectée.

Reliez une manette Xbox (série X/S ou One) via Bluetooth ou une manette PlayStation (DualSense ou DualShock 4) via Bluetooth ou USB, puis sélectionnez Touches/Manette. Vous pouvez ensuite appuyer sur n’importe quelle touche de la manette de jeu pour l’affecter en tant que déclencheur pour un objet en particulier, un état de composant ou un plan de travail complet.

Déclencheur de la manette de jeu
Déclencheur de manette de jeu

A. Sélection du déclencheur sur manette de jeu B. Raccourci de manette de jeu C. Action définie sur Animation automatique. D. Plan de travail de destination ou un état de composant 

 Veillez à utiliser le même contrôleur pour concevoir et prévisualiser le prototype. Par exemple, vous pouvez tester un prototype avec une manette Xbox sur un ordinateur de bureau ou le Web si ce prototype a été conçu à l’aide d’une manette Xbox.

Expérience d’application mobile et web mobile

XD accepte la prise en charge de manettes de jeu ou claviers sur l’application de prévisualisation de bureau et les prototypes web. Si vous prévisualisez le prototype sur une application mobile ou un navigateur mobile, vous pouvez appuyer pour faire la transition entre des plans de travail (car ils ne sont pas dotés d’un clavier ou d’une manette de jeu).

Contrôleurs de jeu et navigateurs pris en charge

Prise en charge USB et Bluetooth :

Contrôleur

Mac (USB)

Mac (Bluetooth)

Win (USB)

Win (Bluetooth)

Xbox (série X/S, One)

Non

Oui

Oui

Oui

PlayStation (DualSense, DualShock 4)  

Oui

Oui

Oui

Oui

Prise en charge du navigateur :

Contrôleur

Chrome (Mac)

Chrome (Win)

Edge Chromium (Mac)

Edge Chromium (Win)

Edge (existant)

IE

Firefox (Mac et Windows)

Safari

Xbox (USB)

Non

Oui

Non

Oui

Non

Non

Non

Non

Xbox (Bluetooth)

Oui

Oui

Oui

Oui

Non

Non

Non

Non

PlayStation (USB)

Oui

Oui

Oui

Oui

Non

Non

Non

Non recommandé

PlayStation (Bluetooth)

Oui

Oui

Oui

Oui

Non

Non

Non

Non recommandé

Prototype utilisant des touches de clavier ou de manette de jeu

  1. Passez à l’onglet Prototype.

  2. Pour définir une interaction, cliquez sur le connecteur bleu sur l’objet source, l’état du composant ou le plan de travail. Définissez les options suivantes dans l’Inspecteur Propriétés :

    • Déclencheur : définissez le type de déclencheur sur Touches/Manette, puis sélectionnez une manette de jeu ou une touche du clavier pour lui attribuer un déclencheur, à l’exception de la barre d’espace et d’autres touches du système telles que fonction, veille, volume et alimentation.
    • Type : sélectionnez l’un des types d’action disponibles : TransitionAnimation automatiqueSuperpositionDéfilementPlan de travail précédentLecture audio, Lecture vocale, Lecture vidéo ou Lecture Lottie.
    • Destination : définissez le plan de travail de destination ou l’état de composant dans la liste déroulante (non applicable pour certains types d’action).

    Une fois le type d’action choisi, définissez les options spécifiques à ce type d’action.

  3. Procédez comme suit pour définir plusieurs interactions pour un objet, un état de composant ou un plan de travail :

    1. Sélectionnez-le et cliquez sur le bouton + sur le plan de travail. Vous pouvez également cliquer sur le bouton + dans l’Inspecteur Propriétés.
    2. Définissez des propriétés de texte dans l’Inspecteur Propriétés.

     Rappelez-vous que vous pouvez appliquer les déclencheurs de type Appuyer, Faire glisser, Survoler et Temporisé une seule fois et les déclencheurs de type Voix et Touches/Manette à plusieurs reprises. 

    1

  4. Pour prévisualiser les changements sur un ordinateur, sélectionnez l’icône Aperçu sur ordinateur 

  5. Pour partager votre prototype avec vos parties prenantes à partir de l’application XD pour ordinateur, sélectionnez Partager > Configuration de l’affichage > Révision de la conception ou Développement.

Logo Adobe

Accéder à votre compte