Guide des bibliothèques dans Figma – Figma Learn - Centre d'aide

Avant de commencer

Qui peut utiliser cette fonctionnalité

Disponible avec tous les forfaits payants

Dans Figma, une bibliothèque correspond à une collection de ressources de design telles que les composants, les styles et les variables. Ces ressources sont actives dans un seul fichier, mais peuvent être réutilisées dans différents fichiers ou projets.

Les bibliothèques servent généralement à partager des éléments de design commun comme des boutons, des icônes, des éléments d'UI, des couleurs ou des valeurs pour certaines propriétés. Chacun peut ainsi rester cohérent et réaliser facilement ses propres créations à partir de designs existants.

Lorsqu'une personne modifie les ressources dans une bibliothèque, on peut rapidement examiner les modifications effectuées et automatiquement mettre à jour ses designs.

Exemple

Voici un exemple d'utilisation des bibliothèques dans Figma par une équipe de design qui travaille sur l'application fictive Habitz :

Dans un fichier, Kai créé des composants pour différentes parties de l'application, comme la barre de navigation, le menu, l'en-tête et d'autres éléments d'UI.
Iel publie les composants finalisés en tant que bibliothèque à partir du fichier.
Timothy, qui travaille dans un autre fichier du même projet, examine la bibliothèque et ajoute quelques composants au canevas.
Un peu plus tard, Kai effectue une mise à jour pour l'un des composants dans le fichier où a été publiée la bibliothèque.
Dans tous les autres fichiers utilisant le composant, les personnes qui travaillent dans le fichier sont informées de la disponibilité d'une mise à jour pour ce composant. Elles peuvent examiner le composant et, lorsqu'elles sont prêtes, accepter la mise à jour. Celle-ci s'applique à toutes les instances du composant qu'elles utilisent.

Envie d'en savoir plus sur Kai et l'équipe Habitz ? Vous pouvez suivre leur parcours de lancement d'un design system dans le Cours d'introduction aux design systems → de Figma

Créer des composants, styles ou variables à utiliser dans une bibliothèque

Une bibliothèque a pour objectif de partager des ressources de design réutilisables avec des collègues. Ces ressources peuvent être des composants, styles ou variables. Sélectionnez un onglet pour en savoir plus sur chacun d'eux.

Les composants représentent les éléments constitutifs d'un design.

Il peut s'agir d'éléments individuels comme des icônes ou des boutons, ou d'une collection d'éléments comme des menus et des mises en page.

Lorsque vous utilisez des bibliothèques, le fichier de bibliothèque contient les composants principaux, ce qui définit les propriétés du composant utilisable pour tout le monde.

Lorsque vous accédez à une bibliothèque dans votre fichier, vous pouvez ajouter une instance du composant au canevas. Cette instance recevra toutes les mises à jour apportées au composant principal.

Apprenez à créer des composants dans vos designs →

Les styles définissent une collection de propriétés ou de paramètres que nous souhaitons réutiliser. Par exemple, vous pouvez utiliser des styles pour :

Capturer des valeurs de couleurs spécifiques pour les remplissages et les contours
Définir des propriétés de texte comme la police, la hauteur de ligne et l'interlettre
Effectuer des préréglages pour les effets d'ombre et de flou
Créer un échafaudage partageable sous forme de lignes, de colonnes et de grilles de mise en page

En savoir plus sur la création de styles pour les couleurs, le texte, les effets et les grilles de mise en page →

Les variables stockent des valeurs réutilisables que vous pouvez appliquer à tous les types de propriétés de design.

Vous pouvez, par exemple :

Créer des jetons de design pour gérer les design systems plus efficacement
Faire passer un cadre entre différentes tailles d'appareils et voir l'espacement se mettre à jour instantanément en fonction d'un système spatial défini
Avoir un aperçu de l'influence exercée par différentes langues sur un design
Créer un design de panier d'achat entièrement fonctionnel qui calcule le total d'une commande sur la base des articles ajoutés au panier
Élaborer le prototype d'un quiz interactif qui utilise une logique conditionnelle pour montrer qu'un utilisateur répond correctement ou incorrectement à une question

En savoir plus sur les variables →

Publier une bibliothèque

Avant de pouvoir accéder aux composants, styles ou variables dans d'autres fichiers, vous devez les publier en tant que bibliothèque. Vous pouvez choisir ceux qu'il faut publier et, pour les forfaits Organisation et Entreprise, les personnes qui peuvent y avoir accès.

Si vous modifiez un style, une variable ou un composant publié, Figma n'appliquera les modifications qu'aux instances dans le fichier actuel. Si vous souhaitez que ces changements se reflètent dans votre bibliothèque, vous devrez également les publier dans la bibliothèque.

Publier des styles, composants et variables dans une bibliothèque

Choisir les bibliothèques à utiliser dans vos fichiers

Vous pouvez accéder aux bibliothèques publiées dans tous les fichiers brouillons ou de l'équipe pour lesquels vous disposez d'un accès can edit. Les administrateurs peuvent définir des bibliothèques par défaut pour une équipe ou une organisation, ce qui les active automatiquement dans chaque fichier.

Utiliser des ressources de bibliothèque dans un fichier

Lorsque vous avez trouvé une bibliothèque que vous souhaitez utiliser, vous pouvez ajouter des composants, styles ou variables à votre fichier en suivant les instructions pour chaque ressource :

Accepter les mises à jour d'une bibliothèque dans vos fichiers

Lorsqu'une personne publie la mise à jour d'un composant principal, d' un style ou d'une variable dans une bibliothèque, Figma rend la mise à jour disponible dans chaque fichier qui utilise le composant, le style ou la variable.

Toute personne disposant d'un accès can edit à un fichier peut examiner et accepter ou ignorer les modifications apportées.

Accepter des mises à jour d'une bibliothèque

Gérer une bibliothèque

Les personnes disposant d'un accès can edit à un fichier de bibliothèque peuvent définir des autorisations d'accès au fichier, annuler la publication de la bibliothèque et déplacer des ressources entre différents fichiers.

···