Partie 1 : Utilisation de Figma

Chapitre 1 : Premiers pas avec Figma
Leçon 1 : Pourquoi utiliser Figma ?
___Présentation de Figma
Une journée dans la vie d'un designer utilisant Figma
Une journée dans la vie d'un planificateur utilisant Figma
Une journée dans la vie d'un développeur utilisant Figma
___Savoir-faire en matière de conception
___[Savoir-faire en conception] Je veux convaincre les membres de mon équipe d'adopter Figma !
Leçon 02 : Installation de Figma et présentation de l’interface de base
Installation de Figma
Tableau de bord principal
Fichier Figma
___[Aide] Figma IA
___[Savoir-faire en conception] Connaissances techniques en interface utilisateur à connaître avant de concevoir
___Transfert de projets Sketch vers Figma
Leçon 03 : Préparation de l'environnement avant le travail
___Fonte
Modèles d'interface utilisateur Android et iOS
Paramètres de style de calque de base
Paramètres de préférence

Chapitre 2 Styles graphiques et bibliothèques
Leçon 01 : Styles graphiques et vecteurs
Style graphique
__Leçon 02 Styles et bibliothèques
Créer et modifier des styles
Styles et alignement de groupe
Publié par ___Bibliothèque
Bibliothèque de l'équipe
___[Exercice] Enregistrement des styles et publication dans une bibliothèque
___[Aide] Dessin Figma

Chapitre 3 Alignement et mise en page
Leçon 1 : Tri et édition pratiques : sélection intelligente et édition multiple
___Créer une sélection intelligente
___[Exercice] Redimensionner une sélection spécifique
___[Exercice] Redimensionnement de plusieurs sélections
___[Exercice] Duplication d'objets
Édition multiple
Leçon 02 : Contraintes et grilles de mise en page pour la conception réactive
___Contrainte
___[Exercice] Grille de mise en page
Utilisation conjointe des contraintes et des grilles de mise en page

Chapitre 4 Composants, plugins et mise en page automatique
__Leçon 01 Composants, plugins et widgets
___composant
Modification et remplacement d'instance
___[Exercice] Création d'une interface utilisateur avec des composants et création d'une bibliothèque
___Plugins et widgets
Leçon 02 : Mise en page automatique : Créer une interface utilisateur comme un bloc
___Mise en page automatique
___Redimensionnement
Valeur de position absolue
___[Exercice] Mise en page automatique

Chapitre 5 : Collaborer avec les systèmes de conception
__Leçon 01
Variantes pour les systèmes de conception ___
___Variantes
___[Exercice] Variantes à bascule et à bouton
Création et utilisation de ___variantes
Utiliser les variantes comme un pro
___[Savoir-faire en conception] Conseils pour démarrer un système de conception
Leçon 02 Propriétés des composants qui organisent le système
propriétés des composants
___[Exercice] Application des propriétés d'un composant à un composant de liste
__Leçon 03 : Concevoir des jetons et des variables
Jeton de conception
Règles de dénomination des jetons de conception
___variable
___[Exercice] Application de jetons de conception avec des variables
___élément prototype
__Leçon 04 Prototype illustrant l'écran réel
___Création d'interactions et d'animations
___Configuration des paramètres du prototype
___Voir l'écran prototype
___[Exercice] Création d'un prototype qui se déplace entre deux cadres
__Leçon 05 Composants interactifs qui fonctionnent comme de vraies choses
Composants interactifs
___[Exercice] Composant interactif de bouton
___[Exercice] Activer/désactiver le composant interactif
___[Exercice] Composant interactif de fenêtre modale
___[Exercice] Composant interactif de carrousel d'images
___[Exercice] Prototype de variable
__Leçon 06
Historique des versions sans gestion de fichiers
Consultez l'historique des versions ___
Vérifiez la version ___ et rétablissez-la
___[Exercice] Restaurer l'historique précédent et enregistrer un nouvel historique

Partie 2 : Concevoir avec Figma

Chapitre 6 Application d'actualités iOS
__Exemple d'explication de la leçon 01
__Leçon 02 Navigation en bas
__Leçon 03 Cartes et listes
__Leçon 04 Menu principal et page de l'article
__Leçon 05 Prototype de transition de page
___[Savoir-faire en design] Conseils pour l'utilisation des icônes

Chapitre 7 Application Android pour cours de sport
__Exemple d'explication de la leçon 01
__Leçon 02 Agencement courant
__Écran principal de la leçon 03
Page de détails du cours __Leçon 04
__Leçon 05 Prototype de défilement
___[Savoir-faire en conception] Éléments de conception du mode sombre

Chapitre 8 : Mode réactive et commerce en direct
__Exemple d'explication de la leçon 01
Leçon 02 : Grille de mise en page pour le Web adaptatif
Icône de la leçon 03
Leçon 04 Navigation
__Leçon 05 Interface utilisateur de la carte
Leçon 06 : Vue sur tablette et vue sur bureau
__Leçon 07 Prototype de défilement horizontal
Prototype de diapositive de la leçon 08
___[Savoir-faire en conception] Comprendre la conception adaptative

Chapitre 9 Système de conception
__Exemple d'explication de la leçon 01
__Leçon 02 Principes du système
Leçon 03 : Système de couleurs
Leçon 04 Typographie
__Leçon 05 Bouton
Leçon 06 : Saisie de texte
Leçon 07 : Bascules et étiquettes
__Leçon 08 Boutons radio et cases à cocher
__Leçon 09 Cartes et modaux
Composition de la page de la leçon 10

Chapitre 10 Marché mondial des NFT
__Exemple d'explication de la leçon 01
__Leçon 02 Composants communs
__Leçon 03 Domaine de contenu
__Leçon 04 Composantes informationnelles

Annexe A Transfert de développement et gestion des fichiers

Leçon 01 Développement Livraison
___Exporter les ressources de conception
___[Savoir-faire en conception] Lorsque les écrans de conception et de développement sont différents
Leçon 02 Mode développeur
___Vérifiez les facteurs avant la conversion du code
Fenêtre du mode développeur
Leçon 03 : Gestion des fichiers avec branches
Utilisation de ___branches
___Exemple
__Leçon 04 : Raccourcis clavier
Bouton d'aide
Raccourcis obligatoires et facultatifs

Guide pratique Figma pour une utilisation concrète
Des systèmes de conception aux fonctionnalités d'IA, ce livre couvre de manière optimale les dernières nouveautés de Figma.

Les normes relatives aux outils de conception d'interfaces utilisateur à l'échelle mondiale sont en train de changer.
Nous vivons désormais à une époque où plusieurs personnes peuvent construire simultanément des systèmes de conception, le tout dans le navigateur.
Ce livre s'adresse aux designers, aux développeurs, aux spécialistes du marketing et à tous ceux qui souhaitent apprendre Figma correctement, au cœur même du flux de travail.

La 3e édition inclut toutes les dernières fonctionnalités, notamment l'environnement Figma UI3 récemment mis à jour, l'IA générative, l'édition multiple, le mode développeur, les variables et Figma Draw.
Dans la première partie, vous découvrirez les fonctionnalités essentielles de Figma, notamment l'interface de base, les styles graphiques, les composants, la mise en page automatique et la création d'un système de conception.
Dans la deuxième partie, vous développerez de solides compétences pratiques grâce à une formation pratique basée sur des projets concrets, notamment des applications d'actualités, des applications de cours de sport et des marchés NFT.
Nous avons généreusement inclus des conseils pour l'utilisation des systèmes de conception, l'amélioration de l'efficacité de la collaboration et un savoir-faire pratique.
Des petits exercices aux projets complets, plongez dans le monde infini de Figma grâce à ce livre.

● Vecteur / Sélection intelligente / Édition multiple
● Contraintes / Grille de mise en page
● Composants / Bibliothèques / Mise en page automatique
● Variantes / Variables / Prototypes
● Livraison du développement / Mode développement / Historique des versions
● Application d'actualités iOS
● Application Android Sports Class
● Mode réactive et commerce en direct
● Système de conception et solution B2B

Points clés de la 3e édition

● Figma AI : Prend en charge les brouillons de conception et la recherche d’images, etc.
Vous pouvez supprimer les arrière-plans et créer du contenu factice sans quitter Figma, que ce soit à l'aide de plugins ou de programmes externes.
● Édition multiple : Sélectionnez plusieurs calques simultanément pour les modifier sans répéter les tâches.
● Mode développeur : Mise à jour avec des fonctionnalités plus puissantes et plus pratiques que la version bêta existante, qui a été convertie en version payante.
● Variable : Vous pouvez créer et gérer des jetons de conception en spécifiant des valeurs de variable pour la couleur et le style.
● UI3 : Entièrement mise à jour avec une interface utilisateur plus moderne et plus conviviale.