La navigation dans une application peut devenir confuse sans un bon système indicatif.
Sans un système clair, les utilisateurs peuvent se perdre, réduisant l’efficacité et l’engagement.
Cet article vous guide pour créer un système de navigation avec des cercles dans Adobe XD, rendant la navigation intuitive.
Maîtrisez les fonctionnalités de base d'Adobe XD-UX Designer et créez des prototypes d'interface utilisateur interactifs
On va maintenant créer un système de navigation qui va permettre à l’utilisateur de savoir à quelle page de l’application il se trouve. Pour ce faire, on va imaginer un système de cercle qui est coloré en fonction de la page où on se trouve.
On va commencer par créer un cercle et on va le dupliquer. On va les aligner et bien les espacer en utilisant les repères, si on rencontre des difficultés, on utilise les outils d’alignement.
Maintenant que les cercles sont bien alignés, on va colorer le premier cercle et on va enlever sa bordure. Puis on va sélectionner les 3 autres cercles et va réduire la taille de leurs bordures et leurs opacités.
Pour faciliter nos futures modifications, on va grouper ces 4 figures, on va les sélectionner et on va exécuter la commande CTRL+G . Puis on va renommer leur calque.
On a fini notre travail sur le système de navigation, on va maintenant dupliquer cette page.
Formez-vous gratuitement avec Alphorm !
Maîtrisez les compétences clés en IT grâce à nos formations gratuites et accélérez votre carrière dès aujourd'hui.
FAQ
Comment créer un système de navigation dans Adobe XD ?
Comment aligner et espacer les cercles dans Adobe XD ?
Comment grouper des éléments dans Adobe XD ?
Pourquoi utiliser des cercles pour la navigation dans Adobe XD ?
Comment personnaliser les cercles de navigation dans Adobe XD ?
Conclusion
En créant un système de navigation efficace dans Adobe XD, vous améliorez l’expérience utilisateur de votre application. Quels autres éléments graphiques aimeriez-vous explorer pour enrichir vos designs ?
