Formation Figma avancé

Description

Cette formation Figma avancé vous permettra de maîtriser les maquettes UX/UI et d'optimiser leur intégration dans vos projets.

En comprenant les principes clés du design UI/UX, vous saurez exploiter Figma pour gagner du temps sur l’intégration, éviter les erreurs d’interprétation et fluidifier la collaboration avec les designers.

Pendant 3 jours, vous apprendrez à :

• naviguer efficacement dans les fichiers Figma,
• à extraire les informations essentielles (marges, tailles, styles) et
• à optimiser l’export des assets pour le développement.

Vous découvrirez aussi comment utiliser les composants et variantes pour mieux comprendre les logiques de conception et anticiper leur mise en œuvre en code.

Public

Cette formation s'adresse aux développeur·euse·s front-end et full-stack souhaitant mieux comprendre les maquettes UX/UI, optimiser l’intégration des designs et fluidifier la collaboration avec les designers. Elle s'adresse également aux designers UX / UI qui souhaitent monter en compétence sur Figma.

Les objectifs

• Organiser efficacement vos fichiers et structurer un design system avancé
• Maîtriser l’auto-layout imbriqué et optimiser la gestion des composants
• Créer des prototypes animés avec Smart Animate et micro-interactions
• Collaborer avec les développeurs via l’Inspect Mode et optimiser les exports
• Adapter vos designs en responsive, de l’interface desktop au mobile

Pré-requis

• Avoir déjà utilisé Figma pour des maquettes simples ou avoir suivi la formation Figma pour débutants
• Ordinateur portable à apporter

Le programme de la formation Figma avancé

Jour 1 : Perfectionnement des bases et auto-layout avancé

• Rappel des bases essentielles
• Organisation avancée des fichiers et gestion des pages
• Auto-layout avancé
  • nesting
  • alignements
  • distribution automatique
• Création de design systems avancés
• Approche sur l’atomic design
• Structuration des styles et composants en bibliothèque partagée

Mises en pratique :

• Création d’une carte responsive avec auto-layout
• Exercices sur les composants complexes et variantes avancées

Jour 2 : Prototypage avancé et interactions complexes

• Prototypage avancé
  • animations
  • micro-interactions
  • déclencheurs
  • smart animate
• Utilisation des variables Figma pour des interactions dynamiques
• Collaboration avec les développeurs
  • inspect mode
  • export d’éléments
• Partage des prototypes et utilisation des flows

Mises en pratique :

• Création d’un menu animé et des transitions fluides
• Optimisation des exports et specs techniques

Jour 3 : Projet avancé et bonnes pratiques UX/UI

• Design responsive
  • comprendre les contraintes et les adapter
• Tests utilisateurs et feedback sur Figma
• Présentation et feedback des projets
• Questions réponses et astuces avancées

Mises en pratique :

• Adaptation d’un design desktop en mobile
• Projet final : créer un prototype interactif complet

Télécharger le programme

Formations associées

• 

  Figma

  3 jours
• 

  UX Design et Ergonomie Web

  3 jours
• 

  CSS avancé

  2 jours
• 

  Claude Code

  2 jours
• 

  Storybook

  2 jours
• 

  Accessibilité Numérique

  2 jours

Formateur

Fanny KOCH

Fanny Koch partage son expertise sur Figma depuis plus de six ans auprès d’étudiants en UX/UI, développeurs et professionnels du développement.

Fanny propose des formations Figma adaptées à tous les niveaux, du débutant au niveau avancé, en accompagnant des web designers et développeur·euse·s dans l’optimisation de leurs processus de création.

Sa particularité ? Un regard artistique qui mêle design d’interface, photographie, peinture et dessin, offrant une approche du design à la croisée de l’expérience utilisateur et de l’expression visuelle.

FAQ

8 raisons de participer à une formation Human Coders

• Satisfaction client élevée : Un taux de satisfaction de 4,6/5 depuis 2012 (sur 1981 sessions réalisées). 99% des participants se disent satisfaits de nos formations
• Approche pédagogique unique : Des formations en petit groupe, des formateurs passionnés et expérimentés, de véritables workshops... (Plus d'infos sur notre manifeste)
• Catalogue de formations complet : 285 formations au catalogue, de quoi vous accompagner sur tout vos projets
• Écosystème dynamique : Nous accompagnons les dev depuis 14 ans avec des initiatives comme Human Coders News, les Human Talks, le podcast ou encore notre serveur Discord
• Financement facilité : Organisme certifié Qualiopi, indispensable pour que vous puissiez obtenir des aides au financement via votre OPCO
• Références clients prestigieuses : De nombreux clients qui nous font confiance depuis des années
• Accompagnement sur mesure : Nous vous proposons un accompagnement personnalisé par nos consultants pour vous aider dans vos projets au-delà de la formation
• Valorisation professionnelle : Remise d'un diplôme, d'une attestation et d'une certification, suivant les formations effectuées, que vous pourrez afficher sur vos CV et réseaux sociaux