Cette formation Figma vous permettra de comprendre la logique de conception des interfaces utilisateur.

En maîtrisant Figma, vous serez capable :
- d'exploiter efficacement les maquettes,
- d’identifier les contraintes UX/UI dès la phase de design et
- d'optimiser votre travail d’intégration front-end.

Vous apprendrez à naviguer dans une maquette, récupérer les informations essentielles (typographies, couleurs, espacements, composants réutilisables), utiliser les fonctionnalités collaboratives afin d’interagir efficacement avec votre équipe design.

Enfin, en explorant les bonnes pratiques du design responsive et les systèmes de composants, vous pourrez améliorer la cohérence et la maintenabilité de vos interfaces.

Cette formation s'adresse aux développeur·euse·s front-end et full-stack ainsi qu'aux designers UX/UI qui souhaitent utiliser Figma dans leurs projets de développement.

Vous connaissez déjà Figma ?

Notre formation Figma avancé vous permettra de maîtriser toutes les fonctionnalités de Figma.

Les objectifs

• Découvrir et maîtriser l’interface de Figma
• Concevoir des interfaces structurées et réutilisables
• Utiliser les composants et les styles pour un design efficace
• Prototyper et animer des interactions
• Adapter une maquette desktop en mobile

Pré-requis

• aucun pré-requis technique
• Ordinateur portable à apporter

Le programme de la formation Figma

Jour 1 : Découverte et prise en main de Figma

• Introduction à Figma
  • présentation
  • avantages par rapport aux autres outils (XD, Sketch)
• Interface et navigation
  • espaces de travail
  • menus
  • panneaux
  • gestion des pages
• Création et gestion des fichiers
  • différences entre projets
  • fichiers et pages
• Outils de base
  • formes, texte, couleurs, images, icônes
• Alignement, espacement, gestion des calques et groupes
• Utilisation des grilles et colonnes pour structurer un design

Mises en pratique :
- exploration guidée de l’interface, prise en main avec exercices simples
- reproduction d’une interface simple avec des éléments de base

Jour 2 : Structuration et création d'interfaces

• Styles et composants
  • typographies
  • couleurs
  • effets
• Introduction aux composants
  • création
  • duplication
  • mise à jour
• Comprendre et appliquer l’auto-layout
  • boutons, cartes, blocs
• Prototypage simple
  • ajouter des interactions (clics, transitions)

Mises en pratique :
- créer une bibliothèque simple (boutons, inputs)
- construire un mini-prototype fonctionnel

Jour 3 : Projet guidé et autonomie

• Bonnes pratiques d’organisation et de collaboration
• Présentation et feedback sur les designs réalisés
• Corrections et retours sur le projet final
• Q&R et ressources pour progresser

Mises en pratique :
- Cas pratique : adapter une maquette desktop en mobile
- Projet final : chaque participant réalise une mini-interface avec interactions

Le(s) formateur(s)

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.

Voir son profil détaillé

A propos de Human Coders

Human Coders c'est un centre de formation pour développeurs avec :

• une certification Qualiopi, indispensable pour que vous puissiez obtenir des aides au financement via votre OPCO
• de nombreux clients qui nous font confiance depuis des années
• un manifeste pour garantir des formations à taille humaine, des formateurs passionnés, de véritables workshops...
• 140 formations au catalogue, 1620 sessions depuis nos débuts en 2012 avec une moyenne de satisfaction de 4,6/5
• la possibilité de vous proposer un accompagnement personnalisé ou du conseil après la formation