agentskills.codes
FI

Figma Specialist IA

Expert en Figma (auto-layout, components, variables, prototyping, dev handoff)

Install

mkdir -p .claude/skills/figma-specialist-ia && curl -L -o skill.zip "https://agentskills.codes/api/skills/download/16921" && unzip -o skill.zip -d .claude/skills/figma-specialist-ia && rm skill.zip

Installs to .claude/skills/figma-specialist-ia

Activation

This is the description your AI agent reads to decide when to run this skill — the better it matches your request, the more reliably it fires.

Expert en Figma (auto-layout, components, variables, prototyping, dev handoff)
78 charsno explicit “when” trigger

About this skill

Figma Specialist IA

Rôle

Expert en conception Figma. Crée des systèmes de design robustes avec auto-layout, composants réutilisables, variables, prototypage interactif et handoff développeur pour des projets UI/UX professionnels.

Quand l'utiliser

  • Conception de systèmes de design (components, variants, variables)
  • Mise en place d'auto-layout responsive
  • Prototypage interactif avec animations et conditional logic
  • Préparation de handoff développeur (inspect, specs, tokens)
  • Création de templates et bibliothèques partagées
  • Audit de design existant et optimisation

Compétences clés

  • Auto Layout : Fill, Hug, Fixed; direction, gap, padding, wrap
  • Components : Master components, variants, properties, nested instances
  • Variables : Color, number, string, boolean; modes, collections
  • Prototyping : Interactions, animations, conditional navigation, variables
  • Styles : Color, typography, effect, grid styles; tokens
  • Plugins : Auto-layout helpers, icon libraries, accessibility checkers
  • Dev Handoff : Inspect, code snippets, CSS/Flutter/Swift export, Dev Mode

Workflow typique

  1. Setup : Créer le fichier, configurer les styles et variables
  2. Structure : Organiser pages et frames par flow
  3. Components : Créer les master components et variants
  4. Layout : Construire avec auto-layout (mobile-first)
  5. Prototype : Ajouter interactions et transitions
  6. Review : Annotations, commentaires, versioning
  7. Handoff : Activer Dev Mode, exporter specs et assets

Pièges connus

  • Auto-layout imbriqué peut créer des conflits de sizing
  • Variables non supportées dans tous les plugins
  • Performance dégradée au-delà de 500 composants par page
  • Prototypage avancé (conditional logic) nécessite Figma Pro
  • Export SVG peut perdre des effets (inner shadow, blend modes)
  • Les fonts manquantes bloquent le rendu sur toutes les plateformes

Connexions Knowledge Graph

  • [[agent-ui-designer]] — UI design patterns et principes
  • [[agent-frontend-react]] — Figma → React, design tokens
  • [[agent-design-system-builder]] — Design systems dans Figma
  • [[agent-accessibility-engineer]] — Accessibilité dans Figma
  • [[agent-canva-specialist]] — Canva vs Figma, cas d'usage

Search skills

Search the agent skills registry