Aperçu du cours
Objectif de formation : Au terme de cette formation, l’apprenant pourra réaliser des prototypes et des kits UI à partir de d’Adobe XD
Prérequis
- Aisance générale en informatique
- Bonne connaissance de l’environnement Web/Mobile
- Pratique d’outils de dessin vectoriel et bitmap
Objectifs pédagogiques
- Maîtriser les fonctionnalités Adobe Xd
- Concevoir des interfaces Web & Mobile
- Réaliser des prototypes interactifs
- Partager et tester les prototypes
Public ciblé
- Webdesigner
- Graphiste
- Directeur Artistique
- Chef de projet
- Consultants
- Développeur
Programme de formation
-
Introduction à Adobe Xd
-
Les avantages d’Adobe Xd
-
Les enjeux du prototypage
-
-
Tour d’horizon de l’interface Adobe Xd
-
L’écran d’accueil
-
Barre de menus et barre d’outils
-
Les panneaux de propriétés
-
Raccourcis clavier
-
-
Plan de travail & repères
-
Les formes simples
-
L’outil plume
-
Gestion de la couleur
-
Les dégradés de couleurs
-
-
La gestion du texte
-
Éditer du texte
-
Gestion des styles
-
-
Grille de répétition
-
Utilisation des grilles de répétition
-
-
Exercice pratique
-
Réaliser une maquette d’après un parcours utilisateur
-
-
Créer des composants et kits UI
-
Les composants « Master »
-
Propriétés partagées et communes
-
Instances de composants
-
Redimensionnement réactif
-
-
Prototyper & animer
-
Connections entre les Frames
-
Les transitions
-
Gestion du scroll
-
Paramétrage et partage
-
Déclencheur et pilotage vocal
-
-
Partager, commenter et tester
-
Préparer et transmettre au développeur
-
Les liens de partage
-
Gestion des commentaires
-
Exporter/partager les ressources
-
Créer une team
-
Inspecter avec Adobe Xd
-
-
Exporter avec Adobe Xd
-
Exporter les plans de travail
-
Les formats d’exportation
-
-
Xd pour appareils mobiles
-
Exercice pratique : réaliser une maquette d’application mobile interactive
-
-
Atomic design
-
Découverte de l’Atomic design
-
Mise en place et intérêt de l’Atomic design
-
-
Guideline & design systems
-
Normaliser la conception des composants de l’interface utilisateur – Frameworks d’interface utilisateur
-
-
Conclusion et échange sur la formation
-
Discussion et bilan d’apprentissage
-
Remise des supports de formation
-