La formation Adobe XD s’adresse aux webdesigners, graphistes et chefs de projet souhaitant concevoir des interfaces interactives pour sites web et applications mobiles. Elle permet de maquetter des parcours utilisateurs, créer des prototypes interactifs et tester ces interfaces avec l’équipe et les clients. Les participants apprendront à utiliser toutes les fonctionnalités d’Adobe XD, des plans de travail aux composants, en passant par les interactions et l’export des projets. La formation couvre également l’intégration dans le workflow et le partage efficace des prototypes
Adobe XD
Adobe XD
Objectifs de la formation
Comprendre les enjeux de la conception d'interfaces
Maquetter des interfaces interactives de sites Web et d'applications mobiles
Réaliser des parcours de navigation répondant aux besoins des utilisateurs
Partager et tester des prototypes avec votre équipe et vos clients
Public cible
Prérequis
Programme
Rappel sur le processus de conception
Veille et benchmarking
Ciblage et personas
Architecture de l’information
Expression des besoins
Description fonctionnelle
Les livrables, arborescence
Zoning et Wireframes
Mockups storyboard vs prototype
Le prototypage
Les étapes de conception
IA: l’architecture de l’information
UI / UX: le design d’interface
Les tendances du design (Flat, material, Atomic, …)
L’application
Adobe XD dans le workflow
Objectifs du logiciel
L’interface d’Adobe XD
Accueil, les barres de menus et d’outils
Les panneaux de propriétés
Les plans de travail et repères
Ajouter et gérer les plans de travail
Manipuler les grilles et les repères
Les formes, créer une icône
Utiliser les formes simples
Créer des éléments vectoriels avec l’outil Plume
Les textes
Saisir du texte, importer des fichiers textes
Gérer les styles de texte
Formatage et enrichissement
Enregistrer les styles typographiques
Les images
Importer des images, créer des masques
Les couleurs
Utiliser et gérer les couleurs
Créer des dégradés de couleurs
Générer des couleurs
Enregistrer les couleurs
Créer des éléments répétés
Gérer les récurrences, utiliser les grilles de répétition
Combinaison d’objets et masques
Grouper, verrouiller et dupliquer
Déplacer, aligner et empiler
Sélection, redimensionnement et rotation
Contour, remplissage et ombre portée
Masque de floutage
Travailler avec des sources externes
Sélectionner et utiliser des kits UI
Importer depuis Illustrator
Importer depuis Photoshop
Importer depuis Sketch
Importer depuis les navigateurs Web
Composants
Créer et manipuler les composants
Variantes des composant
Propriétés partagées et communes
Redimensionnement réactif des composants
Créer deux écrans d’application mobile (connexion / inscription)
Etendre Adobe XD
Plugins, configuration requise
Affichage et installation des plug-ins
Sélections de plugins utiles
Prototyper
Créer des interfaces responsives
Définir un parcours utilisateur
Créer les liens d’interactions, prévisualiser l’interface
Déclencheurs claviers et manettes, iPilotage vocal
Partager
Créer des liens de partage
Déposer des commentaires
Tester
Enregistrer une vidéo des interactions
Installer l’application Adobe XD
Tester le prototype en direct
Exporter
Exporter les plans de travail
Choisir les formats d’export (PNG, JPEG…)
ressources liées composants (anciennement symboles) documents en ligne
Partager le projet
Partager les écrans et les prototypes
Créer des liens de partage
Supprimer les liens précédemment partagés
Indicateurs d’utilisation
Visualiser les prototypes en plein écran
Mettre en pratique
Définir une approche autour d’un projet
Conception d’une version filaire
Mock-up et mock-up Hi-Fi
Réalisation de l’interface sous Adobe XD
Insertion des animations et de l’interactivité
Partage du projet
Formateur – Formatrice
Présentiel
Distanciel
En présentiel : Un ordinateur par personne - Vidéo projecteur - Connexion Internet