Objectifs de la formation
- Comprendre l’intérêt d’Adobe XD
- Maîtriser l’interface du logiciel
- Conserver la ligne graphique
- Partager le prototype
- Mettre en place l’interactivité
Programme de la formation
Découverte de l'interface d'Adobe XD
- Qu'est-ce que Adobe XD ?
- Les atouts et les enjeux du logiciel.
- L'écran d'accueil d'Adobe XD, toutes ses particularités.
- La barre de menus et la barre d'outils.
- Les panneaux de propriétés.
Travaux pratiques
Découverte de l'interface.
Les étapes de conception
- Le design d'interface.
- Utiliser les grilles de répétition.
- L’intégration de la charte graphique dans les wireframes.
- Harmoniser la conception (styles de texte, couleurs…).
- La gestion des différentes transitions et animations.
- Les méthodologies du prototypage rapide.
Travaux pratiques
Incorporation de la charte graphique dans la conception d’une première maquette.
Les outils de dessins et la gestion des textes
- La création de formes simples.
- La création des éléments vectoriels.
- Les icônes et les écrans de matériel.
- La saisie de texte.
- L’importation des fichiers textes.
Travaux pratiques
Création de menus de navigation et de blocs de contenus avec les outils vectoriels.
Le paramétrage des images et l’application des couleurs
- L’importation de fichier sources.
- La création de symboles.
- La gestion des calques.
- La création de nuanciers.
Travaux pratiques
Importation de fichiers sources (Photoshop, Illustrator) et incorporation dans des calques.
L’interface d’application mobile et le prototypage
- La création des interfaces responsives.
- La conception d'une maquette détaillée.
- L’organisation des artboards.
- L’utilisation de l’inspecteur.
- Designer avec des UI-Kits.
- Les kits de design d'interfaces, Material Design.
Travaux pratiques
Conception d’interface responsive pour les terminaux mobiles.
Propriétés partagées et communes
- Redimensionnement dynamique des composants.
- Créer deux écrans d'application mobile (connexion/inscription).
Partage des conceptions et des prototypes
- Le partage et la mise en place du test.
- Les commentaires et les ressources liées.
- Les tests de support mobile.
Travaux pratiques
Mise à disposition de partages et de tests utilisateur coté client.