Formation UX design avec Adobe XD

 Introduction

• Qu’est-ce que l’UX design ?
• Quels sont les moyens d’interactions ?
• Comment scénariser ?
• Comment Adobe XD s’intègre dans un flux de production ?
• Logique du logiciel et flux de production
• Intégration avec les autres logiciels de la suite CC
• Résolutions d’écran
• Collecter les sources vectorielles et pixellisées
• Comprendre l’interface et ses 3 espaces de travail

Structurer une approche UX design

• Définir la marque et le contenu
• Définir la cible et une Persona
• La corde émotionnelle
• Définir les objectifs de communication
• Prise en compte des canaux et supports de diffusion
• Structuration du contenu
• Scénarisation de navigation
• Contraintes à respecter

Création d’un document XD

• Fichiers locaux et en ligne
• Création de plans de travail
• Ajustement de la résolution
• Redimensionnement réactif
• Dupliquer un plan de travail
• Nommer ses plans de travail
• Création depuis un fichier externe Illustrator
• Gestion des calques

Insertion d’images et d’icônes

• Insertion depuis Illustrator
• Importation d’images vectorielles
• Importation d’images vectorielles
• Importation depuis la bibliothèque

Création du design

• Création de formes vectorielles
• Options de contour et de remplissage
• Gestion des arrondis
• Ajout d’ombres portées
• Gestion des superpositions
• Gestion de l’opacité et des modes de fusion
• Les formes personnalisées
• Création de formes par découpage
• Ajout de texte
• Mise en pratique : création de boutons et de modales

Fonctions de productivité

• Utilisation des grilles de répétitions
• Création et gestion des composants
• Utilisation du jeu de couleurs
• Création de style de caractères
• Création de plans de travail “maquette”

Création de prototype (ajout d’interactivité)

• Les états d’objets
• Ajout d’interactions
• Visualisation et gestion des liens
• Sélection du déclencheur
• Ajout de transitions
• Ajout d’animations

Prévisualisation et partage

• Aperçu sur l’ordinateur
• Aperçu sur appareil
• Travail collaboratif
• Partage pour révision
• Partage pour test
• Partage pour les développeurs
• Restrictions d’accès

Exportations

• Export PDF
• Export vectoriel SVG
• Export bitmap (PNG, JPG)
• Options d’export

Exportation et formats

• Choix de formats adéquats
• Exportation rapide et Export
• Exportation de calques
• Les paramètres de compression
• Exportation au format HTML

Aller plus loin avec XD

• Ajout de plugins
• Gestion des plugins