Passez en mode Prototype. Sur le plan de travail, sélectionnez l’objet auquel vous souhaitez ajouter un lien d’ancrage.
Dernière mise à jour le
|
S'applique également à Adobe XD
Découvrez comment créer des liens d’ancrage pour améliorer l’expérience de navigation dans un plan de travail.
Adobe XD permet de créer des liens d’ancrage lors du prototypage et de faire défiler l’affichage pour accéder à des sections spécifiques d’un plan de travail. Les liens d’ancrage accélèrent la navigation et augmentent la convivialité lors de la conception de longs formulaires ou articles.
Vous voulez simuler votre expérience de défilement en accédant rapidement à des sections spécifiques d’un plan de travail ? Pour commencer, procédez comme suit :
-
-
Faites glisser le fil de prototypage vers le bas sur votre plan de travail jusqu’à ce que vous atteigniez le point vers lequel vous souhaitez créer un lien.
-
Cliquez sur le fil de prototypage pour afficher le panneau Interaction qui figure dans l’Inspecteur Propriétés et définissez les options suivantes :
- Déclencheur : définissez la valeur sur Appui.
- Type d’action : définissez la valeur sur Défilement. Vous souhaitez affecter plusieurs actions à un seul déclencheur ? Pour plus d’informations, lisez cet article.
- Destination : sélectionnez le calque de destination.
- Décalage Y : entrez la valeur de décalage Y par rapport au haut de l’objet lié. Faites glisser la poignée de décalage Y vers la gauche du plan de travail et observez le changement de la valeur de décalage Y. Toute valeur au-dessus de l’objet lié est un décalage négatif et toute valeur en dessous de l’objet est un décalage positif.
- Rythme : sélectionnez une option pour simuler des effets de type accélération/décélération. Par exemple, sélectionnez Décélération pour que vos animations disparaissent de votre prototype au ralenti.
- Durée : saisissez une durée. La durée maximale que vous pouvez définir pour la transition entre deux plans de travail est de cinq secondes.
A. Sélectionnez le type de déclencheur. B. Sélectionnez le type d’action Défilement C. Sélectionnez le plan de travail de destination. D. Saisissez la valeur de décalage Y E. Sélectionnez des effets de rythme F. Saisissez la durée
-
Pour prévisualiser l’effet de défilement sur votre plan de travail, cliquez sur
.
En savoir plus
« Utilisez des liens d’ancrage pour créer une adorable page d’entrée pour un livre animalier avec une interaction de type Retour au début ». Howard Pinksy, expert spécialiste XD chez Adobe.
Regardez cette vidéo pour en savoir plus.
Temps de visionnage : 3 minutes
Maintenant que vous savez comment créer des liens d’ancrage, téléchargez l’exemple de kit d’interface utilisateur contenant plusieurs exemples de conceptions Web d’une seule page et essayez-les par vous-même.
Télécharger votre fichier
Et après ?
Vous avez commencé à ajouter des liens de navigation dans votre conception. Continuez et découvrez comment ajouter plusieurs interactions à votre conception à l’aide de lectures et de commandes vocales.
Vous avez une question ou une idée ?
Si vous avez une question à poser ou une idée à partager, rejoignez la communauté Adobe XD. Nous aimerions connaître vos commentaires et découvrir vos créations.
Accéder à votre compte