La navigation peu intuitive dans une application peut frustrer les utilisateurs.
Cela peut entraîner une mauvaise expérience utilisateur et un désintérêt pour l’application.
Découvrez comment créer un système de navigation visuel efficace avec des cercles colorés dans Adobe XD.
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 efficace?
Quelle est l'importance d'un cercle coloré dans la navigation?
Comment aligner et espacer des éléments dans Adobe XD?
Comment grouper des éléments dans Adobe XD?
Pourquoi renommer les calques dans Adobe XD?
Conclusion
En conclusion, un système de navigation bien conçu améliore significativement l’expérience utilisateur dans une application. Quels autres outils pourriez-vous explorer pour optimiser vos designs?