Kits de wireframing UXUI - Du débutant à la maîtrise avec Figma | Yousef Shehabi | Skillshare
Recherche

Vitesse de lecture


1.0x


  • 0.5x
  • 0.75x
  • 1 x (normale)
  • 1.25x
  • 1.5x
  • 1.75x
  • 2x

Kits de wireframing UXUI - Du débutant à la maîtrise avec Figma

teacher avatar Yousef Shehabi, UXUI Designer | Educator

Regardez ce cours et des milliers d'autres

Bénéficiez d'un accès illimité à tous les cours
Suivez des cours enseignés par des leaders de l'industrie et des professionnels
Explorez divers sujets comme l'illustration, le graphisme, la photographie et bien d'autres

Regardez ce cours et des milliers d'autres

Bénéficiez d'un accès illimité à tous les cours
Suivez des cours enseignés par des leaders de l'industrie et des professionnels
Explorez divers sujets comme l'illustration, le graphisme, la photographie et bien d'autres

Leçons de ce cours

    • 1.

      Introduction

      2:32

    • 2.

      Qu’est-ce que le wireframing

      2:31

    • 3.

      Que sont les kits de wireframing

      3:05

    • 4.

      Utiliser Figma dans ce cours

      2:34

    • 5.

      Trouver le bon kit de wireframing

      2:23

    • 6.

      Créer avec des kits de wireframing

      2:39

    • 7.

      Personnaliser les kits de wireframing

      3:14

    • 8.

      Importer des kits comme bibliothèque dans Figma

      3:19

    • 9.

      Conclusion

      1:21

  • --
  • Niveau débutant
  • Niveau intermédiaire
  • Niveau avancé
  • Tous niveaux

Généré par la communauté

Le niveau est déterminé par l'opinion majoritaire des apprenants qui ont évalué ce cours. La recommandation de l'enseignant est affichée jusqu'à ce qu'au moins 5 réponses d'apprenants soient collectées.

30

apprenants

--

À propos de ce cours

Ce cours porte sur l’utilisation des kits de wireframing existants pour simplifier le processus de design UX dans Figma.

Dans ce cours, vous apprendrez à choisir, à personnaliser et à utiliser efficacement des kits de wireframing prédéfinis pour créer des wireframes de qualité professionnelle. Ce cours se compose de cours vidéo brefs et pratiques, parfaits pour les designers qui cherchent à améliorer rapidement leur flux de travail et ceux qui commencent tout juste.

À la fin du cours, vous serez compétent pour sélectionner, personnaliser et intégrer des kits de wireframing dans votre flux de travail de design, ce qui vous ouvrira la voie à des résultats de projet plus rationalisés et efficaces.

Rencontrez votre enseignant·e

Teacher Profile Image

Yousef Shehabi

UXUI Designer | Educator

Enseignant·e

UX/UI DESIGNER AI NINJA DESIGN INSTRUCTOR TECH WIZ FIGMA JEDI FRAMER NATIVE

Since 2020, I have been teaching absolute beginners to start their careers in tech. I deliver live classes with innovative learning styles and create courses that teach you how to creatively solve problems, make money, and make the world a little bit better.

I'm Yousef, a strategic UX/UI designer who has been in education for the past four years. With a background in graphic design and coding, I have taught hundreds of students. Currently, I teach classes of 70 students from underrepresented communities to help them break into tech.

I live my life to the fullest: I work, design, teach, travel, play, cook, and dance! I love to take gaming breaks whenever I work on challenging tasks, and after... Voir le profil complet

Compétences associées

Figma Design Design UI/UX Wireframing
Level: Beginner

Notes attribuées au cours

Les attentes sont-elles satisfaites ?
    Dépassées !
  • 0%
  • Oui
  • 0%
  • En partie
  • 0%
  • Pas vraiment
  • 0%

Pourquoi s'inscrire à Skillshare ?

Suivez des cours Skillshare Original primés

Chaque cours comprend de courtes leçons et des travaux pratiques

Votre abonnement soutient les enseignants Skillshare

Apprenez, où que vous soyez

Suivez des cours où que vous soyez avec l'application Skillshare. Suivez-les en streaming ou téléchargez-les pour les regarder dans l'avion, dans le métro ou tout autre endroit où vous aimez apprendre.

Transcription

1. Introduction: Imaginez que vous puissiez créer un prototype d'application en quelques heures au lieu de plusieurs semaines. Plutôt cool, non ? OK. Puisque vous suivez ce cours, partir du principe que vous êtes déjà un concepteur d'expérience utilisateur ou que vous êtes en train de le devenir. Dans ce cas, ce cours est fait pour vous. Cela signifie également que vous comprenez que la création wireframes pour les tests d'utilisabilité peut parfois devenir une tâche intimidante Je suis là pour vous dire que j'ai la solution parfaite pour vous. Kits de wireframing Ces kits sont des outils que vous pouvez intégrer à votre flux de travail, rendre votre processus de câblage aussi simple et passionnant que possible Je m'appelle Y, je suis instructeur de design AUX UI. J'ai étudié et pratiqué le design pendant des années. Je donne actuellement des cours à plus de 70 étudiants en design pour les aider à démarrer leur carrière dans le domaine de la technologie. Je suis très heureuse de donner ce cours car je pense kits de wireframing sont des outils tellement sous-estimés dans la boîte à outils de tout concepteur La capacité de créer un prototype complet et fonctionnel en quelques heures est très remarquable et stimulante. J'ai hâte de vous faire passer du stade de débutant à celui de maître dans l'utilisation et la mise en œuvre ces kits de câblage dans votre processus Discours, nous allons aborder bases préliminaires de ce qu'est le câblage métallique, et je vais vous présenter l'idée des kits de câblage. Ce sont des composants d' interface utilisateur prédéfinis qui incluent des boutons standard , des curseurs, des icônes, des formulaires, etc. Imaginez un ensemble de composants que vous pouvez combiner pour créer la mise en page de votre produit numérique. Je vais couvrir tout ce que vous devez savoir sur la recherche, le téléchargement, la personnalisation et l'utilisation de ces kits dans vos projets Nous allons tout apprendre à l'aide de Figma, un puissant logiciel de prototypage qui vous permet de tirer le meilleur parti des kits de câblage Si vous ne connaissez pas Figma, ne vous inquiétez pas. Je vais vous guider dans l'utilisation efficace de Figma avec des instructions étape par étape L'avantage d'utiliser des kits de charpente métallique réside dans l'efficacité. Vous ne perdez pas votre temps à créer chaque élément à partir de zéro. Au lieu de cela, vous glissez, déposez et vola. Vous avez une mise en page fonctionnelle, prête à être testée et à recevoir des commentaires. Rejoignez-nous et donnons vie à vos visions du design. 2. Qu’est-ce que le wireframing: Vous savez peut-être déjà tout sur le câblage dans le cadre de votre processus de conception Mais juste au cas où, parlons-en dans cette courte vidéo. Imaginez que vous construisez une maison. Vous ne commenceriez pas à poser des briques au hasard, n'est-ce pas ? Vous aurez d' abord besoin d'un plan approximatif dans votre design X. Les wireframes sont comme ces plans. Ce sont des guides visuels symboliques qui représentent l'ossature de votre produit numérique, qu'il s'agisse d'un site Web ou d'une application. wireframing vous aide à organiser la structure et mise en page de votre design avant de commencer à ajouter toutes les fonctionnalités Il s'agit de se concentrer sur les fonctionnalités et expérience utilisateur sans se laisser distraire par les couleurs, les polices et les autres éléments de design Les cadres Wi sont différents des maquettes finales que vous concevez pour votre produit Les cadres Wi constituent la phase de transition entre vos idées et le produit final. Ils ont un caractère expérimental, puisque vous les créez, les testez, puis vous les répétez. Maintenant que vous savez ce que sont les wireframes, vous devez également savoir que tous les wireframes ne Il existe différents niveaux de fatalité dans les wireframes, allant de faible à haute fidélité La fidélité n'est qu'un mot fantaisiste, qui fait référence au niveau de détail et au réalisme du design. Allons y jeter un œil. Tout d'abord, nous avons des wireframes de faible fidélité Ce sont des croquis de base dessinés à la main souvent réalisés avec un stylo et du papier. Ils peuvent également être numériques, mais ils ne contiennent que très peu de détails. Ils sont rapides à créer et très utiles pour communiquer les idées initiales. Considérez-les comme si vous griffonniez vos premières pensées sur une serviette Ensuite, nous arrivons aux wireframes de moyenne fidélité. Ils sont généralement numériques et créés à l'aide d'outils tels que Sketch ou Figma Ils restent basiques et approximatifs, mais ils incluent plus de détails que les cadres en fil de faible fidélité. Ce niveau est idéal pour définir des idées et préparer votre prototype à des fins test et de réception de commentaires. Enfin, il existe des wireframes haute fidélité. Ils fonctionnent presque comme le produit final avec des mises en page plus complètes et un design bien conçu Les cadres métalliques haute fidélité sont souvent utilisés pour les tests d'utilisabilité car ils donnent une image beaucoup plus claire de ce à quoi ressemblera le produit final et de son fonctionnement. En résumé, le cadrage en y est une étape fondamentale du processus de conception Les cadres en Y vous fournissent un plan, accent sur la structure et la mise en page de votre produit Ce cours vise à rendre ce processus de cadrage en Y aussi simple et agréable que possible 3. Que sont les kits de wireframing: Dans la vidéo précédente, nous avons parlé du câblage. Il est maintenant temps de présenter notre sujet principal, les kits de cadrage Wi-Fi Un kit de câblage est un ensemble de composants d'interface utilisateur refaits Pensez-y comme un ensemble de pièces Lego. Ces éléments incluent des éléments tels que des boutons, des champs de saisie, des icônes ou même des mises en page salariales complètes que vous pouvez utiliser pour rédiger rapidement le squelette de votre site Web ou de votre application L'idée est simple. Lorsque vous construisez vos cadres métalliques, vous pouvez utiliser ces kits comme bibliothèque de composants. Glissez et déposez facilement les éléments dans vos wireframes Mais pourquoi utiliser ces kits ? Eh bien, il y a plusieurs raisons. Les principaux sont la rapidité, l'efficacité, la cohérence et un peu de plaisir. Une autre raison d'utiliser les kits de wireframing est qu'ils vous permettent de rester concentré sur les fonctionnalités de votre produit sans perdre de temps ni vous laisser distraire par les aspects visuels Supposons que vous travailliez sur le design d'une application culinaire. Vous souhaitez créer un flux de paiement. Vous passez 5 minutes à dessiner le sketch pour la mise en page de ces écrans Mais ensuite, vous avez passé 2 heures à perfectionner ces écrans et à leur donner un aspect cohérent Seulement pour découvrir qu'après les tests, vous devez presque modifier à nouveau l'ensemble du design. Ce n'est pas génial, n' est-ce pas ? Au lieu de repartir de zéro à chaque fois, vous pouvez commencer par un ensemble de composants prêts à l'emploi. Le gain de temps signifie que vous pouvez itérer plus rapidement, tester vos idées plus rapidement et améliorer la convivialité de votre conception pendant cette période C'est aussi amusant. La créativité s'épanouit souvent sous certaines contraintes. Et la capacité d'utiliser un ensemble d' éléments peut en fait susciter de nouvelles idées. Tout simplement parce que vous n'avez pas peur de créer ces éléments à partir de zéro. Vous pouvez jouer avec eux, les réarranger et voir comment ils s'adaptent. C'est comme un bac à sable numérique pour vous. L'efficacité entre en jeu lorsque vous travaillez en équipe. Si tout le monde utilise le même kit, vous parlez tous le même langage de conception. Cela permet de minimiser les malentendus et de réduire le temps consacré De plus, cela garantit que apparence et le toucher du produit final sont unifiés. Maintenant, vous vous demandez peut-être c' est éthique pour moi d'utiliser ces kits de wireframing ? Certains designers peuvent se sentir mal à pensant que l'utilisation de composants préfabriqués peut être considérée comme du vol ou une perte d'originalité Mais ce n'est pas le cas. Il est absolument éthique d'utiliser des kits de wireframing Les équipes de conception du monde entier les utilisent en permanence. C'est une pratique courante qui apporte des avantages. Il n'est pas pratique de les utiliser dans vos projets. Une chose à garder à l'esprit est que vous avez besoin d'un outil de prototypage pour utiliser ces enfants Les plus populaires incluent Sketch, Figma et un WXT Chacun de ces outils offre toutes les fonctionnalités dont vous avez besoin pour importer et utiliser ces kits de wireframing Ces outils permettent à vos enfants de s' intégrer parfaitement à vos projets, ce qui facilite encore plus le glisser-déposer et le personnaliser selon vos besoins. 4. Utiliser Figma dans ce cours: Pour réellement commencer à concevoir vos wireframes et pour pouvoir utiliser le kit de wireframing, vous avez besoin Pour ce cours, nous avons choisi un outil de conception très puissant, Figma FGMA est un outil de conception qui vous permet de concevoir vos wireframes et de créer En plus de cela, il vous aide à faciliter vos tests d'utilisabilité. Ce qui distingue FGMA dans le monde de l'UX, c'est sa nature collaborative Vous et votre équipe pouvez travailler sur un design simultanément, en effectuant des mises à jour en temps réel, évitant d'envoyer des fichiers par e-mail ou de faire face à des cauchemars en matière de contrôle de version Il s'agit également d'un outil basé sur le cloud. Tout ce que vous avez à faire est de vous connecter à votre compte depuis n'importe quel appareil, et vous aurez accès à tous vos fichiers où que vous soyez, chez vous, au bureau , dans votre café préféré, etc. En tant que concepteur , vous devez éventuellement maîtriser Figma Il existe de nombreux tutoriels et ressources en ligne. Tu peux l'apprendre au fur et à mesure. Cependant, l'avantage d'utiliser des kits de charpente métallique réside dans le fait que vous n'avez pas besoin d'être un expert de Figma Tout utilisateur débutant peut très facilement utiliser un kit de charpente métallique pour commencer à assembler un dessin Nous passerons en revue les actions spécifiques que vous pouvez entreprendre dans figma lorsque vous utilisez et personnalisez des kits de câblage. Mais il y a deux caractéristiques principales que vous devez connaître avant de vous lancer. Ces fonctionnalités sont des composants et des styles. Un composant est quelque chose que vous pouvez créer puis réutiliser dans votre conception à plusieurs reprises. Quel que soit l'usage, maintenez le lien vers le composant principal. En théorie, un style est similaire à un composant. Vous créez un style pour la typographie ou la couleur. Appliquez-le aux différents éléments de votre design, et tous ces éléments resteront liés. Si vous modifiez le style d'origine, tous les éléments connectés suivront. Par exemple, un design de bouton. Vous pouvez concevoir votre bouton une seule fois , puis l'utiliser partout dans votre design. Par exemple, si vous souhaitez modifier cette couleur du spot et plus tard, vous suffit de changer le composant principal et toutes les instances suivront. La principale différence entre les composants et les styles est que les styles sont généralement plus simples ciblent les propriétés spécifiques des éléments. Alors qu'un composant est une unité plus complexe. Un composant possède une forme, couleur, une typographie et de nombreux autres attributs Il est important que vous compreniez les composants et les styles avant de commencer. Parce qu'un kit de charpente métallique est essentiellement un ensemble de composants et de styles préparés et assemblés pour que vous puissiez les inverser et commencer à les utiliser dans votre conception 5. Trouver le bon kit de wireframing: C'est bon. Pour commencer à utiliser votre câblage, vous devez trouver le bon kit de câblage. Avant de le faire, posez-vous quelle est la portée de mon projet ? Êtes-vous en train de créer une page de destination contenant des symboles une application mobile complexe, ou peut-être un site Web à part entière En sachant cela, vous serez guidé vers le kit qui correspond aux exigences spécifiques de votre projet Par exemple, si vous concevez une application mobile, vous aurez peut-être besoin d'un kit comprenant des composants tels que des barres de navigation, des barres d' onglets et divers modèles d'écran. autre côté, si vous concevez un projet Web, recherchez des kits riches en éléments axés sur le digtop Tels que les variantes d'en-tête, les conceptions de pieds de page et les sections de contenu Cela étant dit, la plupart des kits de wireframing incluent des éléments pour les applications de bureau et mobiles La deuxième chose que vous voulez déterminer est le niveau de fidélité de vos wireframes Au début du projet, les kits basse fidélité sont excellents pour le brainstorming et l'obtention rapide Plus tard, au fur et à mesure que le design devient plus raffiné, vous souhaiterez passer aux kits haute fidélité. Une fois que vous avez choisi le type de kit de câblage dont vous avez besoin, vous êtes prêt à commencer à chercher le kit de câblage qui vous convient. Puisque nous utilisons Figma et Discourse, la communauté Figma est endroit idéal pour rechercher le kit approprié Pour commencer, cliquez sur l' onglet Communauté Exploré sur la page principale. La communauté Figma regorge de nombreux atouts et d' une place pour votre design Commencez par taper quelques mots clés, utilisez des termes tels que kits de wiframing, composants d' interface utilisateur ou kit de wiframing basse fidélité, selon ce que vous recherchez Une étape rapide : faites attention à la note et au nombre de téléchargements Les kits qui obtiennent des notes plus élevées et un plus grand nombre de téléchargements sont souvent plus fiables et bénéficient d'une communauté plus forte. Une fois que vous avez trouvé des kits qui attirent votre attention, ouvrez le breviw pour voir ce qu'il contient Ce kit inclut-il tous les composants dont vous avez besoin ? Est-ce le bon niveau de fidélité ? Cela vous semble-t-il adapté à votre projet ? Si c'est le cas, il vous suffit de cliquer sur le bouton Ouvrir Figma Cela créera une copie du fichier des kits de wireframing dans vos brouillons, et le fichier sera automatiquement ouvert C'est la première étape adopter ce kit de wireframing pour votre projet 6. Créer avec des kits de wireframing: Maintenant que vous avez trouvé le kit de wireframing le mieux adapté à votre projet Commençons par l'utiliser pour ouvrir le fichier que vous avez dupliqué, puis pour sélectionner le cadre adapté à votre projet, qu'il s'agisse d'un cadre de terrasse, d'un cadre mobile ou autre, en fonction du type de produit que vous concevez Ensuite, vous pouvez accéder aux éléments du kit de wireframing depuis le côté gauche Sélectionnez l'onglet Ressources, et à partir de là, vous verrez tous les composants du fichier, classés et organisés, chacun avec son propre nom. Vous pouvez consulter la liste et vérifier ce dont vous avez besoin, ou vous pouvez utiliser la barre de recherche en haut et taper le nom de ce que vous recherchez. Il apparaîtra s'il existe. L'idée est un symbole. Tout ce que vous avez à faire est de faire glisser ce dont vous avez besoin et de le déposer dans votre design. Vous avez besoin d'un bouton, faites-le glisser dessus, vous avez besoin d'un champ de saisie de texte, faites-le glisser dessus. C'est aussi simple que cela. Vous pouvez rapidement rédiger la structure de base de votre application et de votre site Web en organisant ces éléments. Vous n'avez pas à vous soucier des détails exacts sur scène, et c'est tout. En quelques secondes, vous disposez d'une disposition fonctionnelle des symboles que vous pouvez facilement ajuster et modifier. Supposons que vous conceviez un écran de connexion à symboles. Tout d'abord, faites glisser un espace réservé qui servira de titre. Ajoutez ensuite deux champs de saisie, l'un pour le nom d'utilisateur et l' autre pour le mot de passe. Enfin, faites glisser un bouton pour l'action de connexion. La plupart des composants disposent également certains paramètres que vous pouvez modifier à partir du panneau de droite Pour ce champ de saisie, par exemple, puisqu'il s'agit du mot de passe, nous pouvons ajouter une icône sur le côté droit. Tout ce que nous avons à faire est d'utiliser cette option dans le panneau de droite l'icône que nous voulons apparaisse. Il est important de garder à l'esprit que câblage est une question d'approximation Ces kits vous aident à créer des cadres métalliques avec une représentation approximative de votre produit final. Ils ne sont pas nécessairement parfaits pour Exel ou leur style ne correspond pas nécessairement à votre vision finale du design Considérez-les comme un squelette de votre interface utilisateur. Ainsi, lorsque vous glissez et déposez des éléments, il se peut qu'ils ne ressemblent pas exactement à ce que vous souhaiteriez qu' ils apparaissent à la fin, mais ce n'est pas grave L'objectif ici est de se concentrer sur la structure et la mise en page, et non sur l'aspect final. La beauté des kits d'encadrement en feu. C'est une question d'efficacité. En utilisant des composants préfabriqués, nous pouvons économiser d'innombrables heures que vous auriez autrement passées à créer des éléments à partir de zéro. Cette vitesse vous permet de modifier rapidement vos designs, d'obtenir des commentaires et d'apporter des améliorations sans ralentir par les détails de style 7. Personnaliser les kits de wireframing: Jusqu'à présent, nous avons abordé les bases du wireframing, exploré différents kits de wireframing et Cependant, étant donné que l'idée est de nous appuyer sur un kit de wireframing préfabriqué, il est prévu que le kit que nous avons choisi ne corresponde pas à 100 % de nos besoins C'est pourquoi il est très important que vous sachiez comment personnaliser et concevoir des composants supplémentaires pour votre kit. Disons que nous avons un bouton dans notre kit. C'est un joli bouton rectangulaire standard avec une légère rondeur d'angle Cependant, pour le type de produit que nous concevons, il est essentiel d'utiliser des coins entièrement arrondis. Nous pouvons apporter cette modification à l'ensemble du kit de wireframing très facilement Pour ce faire, je dois d'abord trouver le composant que je dois changer. Puisque nous devons modifier le composant des boutons, je vais rechercher une page appelée boutons sur le panneau de gauche. Je sélectionnerai ensuite tous les boutons en même temps, et dans le panneau de droite, je verrai une option pour le rayon d'angle. Changeons cela de 10 à 36. Allons-y. Maintenant, nos boutons ont ces coins lisses et entièrement arrondis qui correspondent à l'objectif de notre produit. Une fois que vous avez modifié le composant principal de cette manière, toutes les instances de ce composant seront automatiquement mises à jour. Vous pouvez le faire avec n'importe quel composant, en modifiant n'importe quelle propriété, couleur, police, taille. Vous devez également vous rappeler de faire attention à ces modifications afin de maintenir la cohérence du style général de ce kit de charpente métallique Outre la modification de certaines propriétés des composants existants. Parfois, le kit préfabriqué ne contient tout simplement pas ce dont nous avons besoin. Peut-être avons-nous besoin d'un composant unique comme un curseur de page, par exemple, mais nous ne le trouvons nulle part dans ce kit Heureusement, vous pouvez le créer à partir de zéro. Pour commencer, je vais chercher la page appropriée pour ce composant supplémentaire. Cette cassette est uniquement destinée à des fins d'organisation. Ensuite, vous créez votre nouveau composant. Voici un slider de base qui me manquait . Je l'ai déjà conçu. Maintenant, nous avons conçu un slider personnalisé qui répond parfaitement à nos besoins, mais nous n'avons pas encore terminé. Nous devons convertir ce nouveau design en un composant réutilisable, afin de ne pas avoir à le recréer à chaque fois Il vous suffit de cliquer dessus avec le bouton droit de la souris et de sélectionner l'option créer un composant. Nous pouvons également ajouter différentes variantes pour ce composant. Par exemple, je peux créer différentes variantes pour les différentes pages actives. Je vais créer ces différentes variantes ici, et je vais changer la couleur des différentes applications de page qui indiquent quelle page est active. Désormais, ce nouveau composant de curseur sera disponible dans votre panneau de ressources, prêt à être glissé et déposé chaque fois que vous en aurez besoin De plus, toute modification future que vous apporterez au composant d'origine mettra automatiquement à jour toutes les instances de votre projet. Super efficace, voilà. personnalisation et la création de nouveaux composants sont des tâches que vous ferez presque toujours dans votre flux Plus vous expérimentez la personnalisation. Plus vous réussirez à créer vos kits de câblage, qui refléteront réellement la vision de votre projet 8. Importer des kits comme bibliothèque dans Figma: À ce jour, vous devriez avoir une assez bonne maîtrise wireframing et de la personnalisation des kits pour Mais jusqu'à présent, la seule façon de les utiliser est de travailler directement dans le fichier des kits. Cependant, pour des raisons d'efficacité et utiliser au maximum le potentiel des kits de wireframing, nous pouvons les utiliser comme bibliothèques de composants pour nos projets En centralisant vos composants et vos styles, vous vous assurez que tout le monde est sur la même longueur d'onde, ce qui accélère et organise votre processus de conception De plus, il est plus facile de mettre à jour et de maintenir la cohérence dans l'ensemble de votre projet. Croyez-moi, votre futur moi et les membres de votre équipe, nous vous remercions. Passons étape par étape au processus de publication d' un kit de câblage sous forme de bibliothèque dans Figma Tout d'abord, vous devez disposer d'un dossier d' équipe pour votre projet. J'en ai déjà créé un ici. Vous avez créé à partir du bouton en bas et en suivant le processus. Dans le dossier d'équipe, vous devez avoir un dossier de projet. C'est là que seront conservés tous les fichiers liés au projet, tels que votre kit de charpente. Vous pouvez créer autant de projets que vous le souhaitez. L'étape suivante consiste à déplacer le fichier des kits de câblage que vous avez dupliqué de la communauté Figma vers le dossier de votre projet Vous pouvez le faire facilement en cliquant avec le bouton droit sur le fichier, en sélectionnant l'option déplacer le fichier, puis en choisissant la destination appropriée. Ou vous pouvez choisir ma méthode préférée qui consiste à glisser-déposer le fichier dans le dossier du projet de destination L'étape suivante consiste à publier votre fichier sous forme de bibliothèque. Ouvrez votre fichier et, en haut de la barre latérale gauche, accédez à Ressources. Cliquez ensuite sur la bibliothèque ici. Vous verrez une option permettant de publier vos composants et styles. Cliquez sur Publier et Figma affichera une liste de tous les composants et styles que vous pouvez publier Vérifiez tout pour vous assurer que tout est prêt, puis cliquez à nouveau sur Publier. Vous pouvez accéder à la même option à partir de la petite flèche située à côté du nom du fichier. Vous pouvez également publier votre bibliothèque à partir de là. , votre bibliothèque est désormais publiée pour que toute l'équipe puisse l'utiliser . Pour garantir que tous les membres de votre équipe puissent également l'utiliser, vous devez l'activer dans un fichier de conception spécifique. Je vais créer un nouveau fichier de conception dans le même dossier de projet. Supposons qu'il s'agisse du fichier principal dans lequel nous concevons. Tout ce que j'ai à faire est d'accéder à l'option bibliothèque depuis le menu des ressources et d'ajouter la bibliothèque que je viens de publier dans ce fichier. Vous avez donc publié votre première bibliothèque. Mais que se passe-t-il lorsque vous modifiez le kit d'encadrement de votre épouse Ne vous inquiétez pas, c'est assez simple aussi. Chaque fois que vous apportez des modifications au kit de cadrage de votre épouse, FDMA vous invite à publier des mises à jour Il suffit de suivre les mêmes étapes. Accédez aux ressources, cliquez sur l'icône de la bibliothèque, puis cliquez pour publier la mise à jour de votre bibliothèque. Votre équipe recevra également une notification l'invitant à mettre à jour sa version de la bibliothèque mettre à jour sa version de la bibliothèque. C'est aussi simple que cela. Enfin, tout comme nous avons ajouté ce kit à notre projet, sachez que vous pouvez ajouter plusieurs kits au sein d'un même projet. Ce faisant, soyez prudent et organisé et ajoutez un nom distinct pour chaque kit. Cela permet d' identifier très facilement un commutateur entre différents ensembles de composants. Cependant, il est vivement conseillé d'utiliser un kit à la fois car les choses peuvent se mélanger très facilement et vous risquez de perdre la cohérence de vos conceptions. 9. Conclusion: C'était mon cours sur les kits de charpente métallique. Ces connaissances m'ont aidé à accélérer mon processus de conception et étaient essentielles pour moi à mes débuts. J'espère que cela vous sera également utile . Dans ce cours, vous avez appris à choisir, utiliser et personnaliser les kits de charpente métallique dans Figma Vous avez également appris à les implémenter sous forme de bibliothèques dans vos projets. Mais bien entendu, ce n'est que le début. J'adorerais que vous continuiez à vous entraîner et à partager le cadre métallique que vous créez. Tout ce qui est inspiré par ce cours se trouve dans la section des projets de classe. Commencez par travailler sur de petits projets. Peut-être redessiner le blog d'un ami ou votre propre site Web de portfolio. Les petits projets vous donnent l'espace nécessaire pour expérimenter et faire des erreurs sans trop de pression. L'une des choses que j'aime dans le fait d'être designer U XUI, c'est la courbe d'apprentissage interminable Il y a toujours de nouvelles techniques, outils et de nouvelles méthodes qui émergent, ce qui rend les choses très excitantes. Je vous encourage à adopter un esprit d' apprentissage continu, à suivre des cours supplémentaires, lire des blogs sur l'expérience utilisateur, à assister à des webinaires et à me suivre ici, ainsi que sur les réseaux sociaux pour rester au courant de mes nouveaux cours Si vous appréciez ce cours et que vous le trouvez utile, un commentaire sur le partage des compétences signifierait beaucoup pour moi. Cela aide les étudiants à découvrir ce cours et me permet de continuer à créer du contenu précieux pour vous. Merci beaucoup d'avoir fait ce voyage avec moi.