Formation Complète Figma : du WebDesign vers Figma

Course Curriculum

Chapter 1: Prêt à démarrer ?

Lecture 1: Introduction

Chapter 2: Maîtriser et Comprendre le Web Design

Lecture 1: Définition du web design

Lecture 2: L'équilibre

Lecture 3: Design symétrique

Lecture 4: Design asymétrique

Lecture 5: Déséquilibre

Lecture 6: Composition

Lecture 7: Point focal

Lecture 8: La couleur

Lecture 9: La typographie

Lecture 10: La hiérarchie des éléments

Lecture 11: Normes communes

Lecture 12: Images

Lecture 13: Navigation du site web

Lecture 14: Navigation du menu

Lecture 15: Référencement SEO SEA

Lecture 16: Réactivité mobile

Lecture 17: Sécurité du site web

Lecture 18: Vitesse de la page

Lecture 19: Raisons de rendre votre site accessible

Lecture 20: Comment rendre votre site web plus accessible

Chapter 3: Découverte de Figma

Lecture 1: Découverte de Figma

Lecture 2: Utilisation des applications web et mobiles

Lecture 3: Créer un compte et se connecter à Figma

Lecture 4: Importer ses polices en local

Lecture 5: Créer un fichier de travail

Lecture 6: Partager vos projets et collaborer

Lecture 7: Créer une planche de travail

Lecture 8: Créer un calque

Lecture 9: Découvrons la bibliothèque

Lecture 10: Découvrons les pages

Lecture 11: Renommer les éléments de travail

Lecture 12: Exporter les plans de travail

Lecture 13: Utiliser les raccourcis

Lecture 14: L’outil Sélection

Lecture 15: L’outil Frame

Lecture 16: L’outil Formes

Lecture 17: Les Couleurs

Lecture 18: La Plume et le Crayon

Lecture 19: L’outil Texte

Lecture 20: L’outil Main et le Zoom

Lecture 21: L’outil commentaires

Lecture 22: Importer des images

Lecture 23: Créer un style

Lecture 24: La grille et le responsive

Lecture 25: Utiliser le layout grid

Lecture 26: L’auto layout

Lecture 27: Découverte des plug-ins

Lecture 28: Utiliser les plug-ins

Lecture 29: Découverte des composants

Lecture 30: Créer un nouveau composant

Lecture 31: Utiliser un composant

Lecture 32: Les composants masters/instances

Lecture 33: Les variants

Lecture 34: Bonus – Les prototypes

Lecture 35: Modifier la taille d’un frame

Lecture 36: Le scroll et l’overflow

Lecture 37: Le clip content et la position fixe

Lecture 38: Conclusion du cours sur Figma

Chapter 4: Exercice 1 figma créer votre propre charte graphique

Lecture 1: Exercice #1 figma – créer votre propre charte graphique

Chapter 5: Projet 1 – Site Carbique Figma

Lecture 1: Préparation de l’environnement

Lecture 2: Réalisation des navigations

Lecture 3: Réalisation des sections de Caractéristiques du produit

Lecture 4: Réalisation de la section en vedette

Lecture 5: Réalisation de la section Formulaire d'inscription

Lecture 6: Réalisation du pied de page

Lecture 7: Réalisation du Wireframe 2

Lecture 8: Réalisation du Wireframe 3

Lecture 9: Réalisation du prototype 1

Lecture 10: Réalisation du prototype 2 section Hero

Lecture 11: Réalisation des sections de Caractéristiques du produit

Lecture 12: Réalisation section Vedette et Formulaire

Lecture 13: Réalisation de la maquette finale

Chapter 6: Projet 2 – Site Photo Figma

Lecture 1: Préparation de l’environnement

Lecture 2: Réalisation des navigations

Lecture 3: Réalisation des sections Hero

Lecture 4: Réalisation des sections Sous-page Hero

Lecture 5: Réalisation des Parties du corps

Lecture 6: Réalisation des sections Témoignages

Lecture 7: Réalisation des sections d’Inscription

Lecture 8: Réalisation des Pieds de page

Lecture 9: Réalisation du modèle de Wireframe

Lecture 10: Explications de l’énoncé de l’exercice #2

Lecture 11: Exercice #2 – Réalisation de la maquette finale

Chapter 7: Projet 3 – Site Portfolio

Lecture 1: Préparation de l’environnement

Lecture 2: Réalisation de la navigation

Lecture 3: Réalisation de la section hero

Lecture 4: Réalisation de la section compétences

Lecture 5: Réalisation de la section projets

Lecture 6: Réalisation de la section avis clients

Lecture 7: Réalisation de la section FAQ

Lecture 8: Réalisation de la section contact

Lecture 9: Réalisation du pied de page