Magie du design avec Figma : un cours intensif pour les débutants | Dr. Rasheed | Skillshare
Recherche

Vitesse de lecture


1.0x


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

Magie du design avec Figma : un cours intensif pour les débutants

teacher avatar Dr. Rasheed, Digital Content Creator

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 du cours

      2:00

    • 2.

      Qu'est-ce que Figma ?

      2:26

    • 3.

      Créer un compte et s'inscrire

      5:22

    • 4.

      Aperçu de l'interface de base

      7:12

    • 5.

      Installer l'application Figma

      3:17

    • 6.

      Créer un aperçu de dossier et d'interface

      10:37

    • 7.

      Le panneau Propriétés

      8:41

    • 8.

      Couche d'éléments dans Figma

      3:49

    • 9.

      Ajouter et personnaliser des cadres

      10:29

    • 10.

      Ajouter des grilles et des guides

      7:27

    • 11.

      Ajouter et personnaliser des formes

      8:21

    • 12.

      Les outils du stylo et du crayon

      4:54

    • 13.

      Opérations booléennes + signature

      6:13

    • 14.

      Solution à l'inscription

      2:36

    • 15.

      Utiliser les outils d'alignement

      3:32

    • 16.

      Ajouter et personnaliser des buttons

      7:12

    • 17.

      Ajouter et personnaliser des composants

      6:00

    • 18.

      Comment créer et gérer des variantes

      7:32

    • 19.

      Ajouter des plugins

      5:53

    • 20.

      Créer des designs à partir de modèles

      6:04

    • 21.

      Créer une interface utilisateur à partir de zéro

      8:06

    • 22.

      Créer un prototype interractif de l'application

      6:50

    • 23.

      Partager et exporter des designs

      3:45

    • 24.

      Conclusion du cours

      0:51

  • --
  • 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.

71

apprenants

1

projets

À propos de ce cours

Êtes-vous intéressé à apprendre un outil de design puissant qui peut faire passer vos compétences en design d'interface utilisateur à un niveau supérieur ? Si oui, alors ce cours Figma pour débutants est l'endroit idéal pour commencer !

Le cours Figma Essentials pour débutants est adapté aux personnes qui souhaitent se plonger dans le monde du design avec Figma. Que vous soyez en herbe designer, développeur ou chef de projet, ce cours vous donne les compétences fondamentales pour créer des designs, des prototypes et des interfaces utilisateur captivants.

Tout au long du cours, vous explorerez des sujets tels que la navigation dans l'interface Figma, la gestion des calques, le travail avec les cadres et les grilles, la personnalisation des formes et l'utilisation des outils d'alignement. Vous explorerez également les composants, les variantes et les plugins, en obtenant des informations pratiques sur la création de designs d'interface utilisateur à partir de zéro. À la fin du cours, vous serez compétent en prototypage, en partage avec vous et en exportation dans les domaines du développement ou de la présentation.

À qui s'adresse ce cours ? Ce cours s'adresse aux débutants ayant peu ou pas d'expérience dans Figma. Les amateurs de design, les futurs créateurs d'UI/UX et les graphistes trouveront cela précieux. Même les développeurs qui souhaitent collaborer de manière transparente avec les designers peuvent bénéficier de ce cours.

Exigences : aucune expérience préalable en design n'est nécessaire ; les compétences de base en informatique sont suffisantes.

Quelle est la prochaine étape ? Après avoir terminé le cours, vous serez prêt à :

  • Créer des designs professionnels avec Figma.
  • Collaborer efficacement avec les membres de l'équipe.
  • Prototyper et visualiser les idées d'applications.
  • Exporter les actifs pour le développement ou la présentation.

N'oubliez pas de vous entraîner et d'explorer les fonctionnalités avancées pour gagner en assurance. Bonne création !

Rencontrez votre enseignant·e

Teacher Profile Image

Dr. Rasheed

Digital Content Creator

Enseignant·e

Hi guys,

I am Dr. Rasheed, a lecturer, speaker, and YouTuber with a PhD in Civil Engineering from Universiti Teknologi PETRONAS, Malaysia. A result-oriented, self-motivated professional with exceptional problem solving and communication skills.  I have a strong passion for sharing knowledge and engaging with audiences.

If you are looking to learn techniques, tips, and tricks that can elevate your productivity in life and in tech-related things, look no further. I am here to inspire you.

Voir le profil complet

Compétences associées

Figma Design Design UI/UX Prototypage
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 du cours: Êtes-vous intéressé par l'apprentissage d' un puissant outil de conception capable de faire passer vos compétences en conception d'interface utilisateur à un niveau supérieur ? Alors ce cours Figma pour débutants est parfait pour débuter Ce cours est conçu pour toute personne ayant peu ou pas d'expérience avec Figma Que vous soyez un débutant souhaitant apprendre les bases ou que vous souhaitiez parfaire ses connaissances sur Figma, ce cours vous fournira une base solide pour utiliser Figma pour la conception d'interfaces utilisateur ? Il n'y a aucune configuration logicielle requise pour ce cours. Cependant, des connaissances informatiques de base et une connaissance des principes de conception seront très utiles ? Au cours de cette formation complète sur Figma, nous aborderons un large éventail de sujets, notamment ce qu'est Figma et ses principaux avantages pour la conception d'interfaces utilisateur Comment configurer votre compte Figma et naviguer dans l'interface Nous allons apprendre comment installer l' application de bureau Figma pour des fonctionnalités supplémentaires Dans le même cours, nous apprendrons également à créer des fichiers, à utiliser le panneau des propriétés et à superposer des éléments Nous apprendrons également à concevoir et à travailler avec des cadres, des grilles et des guides, à ajouter et à personnaliser diverses formes, à utiliser des outils de stylo et de colis, nous maîtriserons l'utilisation des opérations booléennes pour manipuler et combiner Nous apprenons à créer des boutons interactifs et des composants de design réutilisables. Dans le même cours, nous explorerons la vaste bibliothèque de plugins Figma pour étendre vos capacités de conception Et à la fin de tout cela, nous apprendrons à exporter et à partager vos conceptions pour diverses utilisations. À la fin de ce cours, vous aurez acquis les compétences et les connaissances nécessaires pour utiliser Figma en toute confiance pour créer des interfaces utilisateur de qualité professionnelle Je suis le docteur Rashi, professeur, conférencier et YouTuber passionné, et je vais être l' instructeur de ce Alors, prêts à plonger dans le monde de Figma ? Commençons. 2. Qu'est-ce que Figma ?: Alors, qu'est-ce que Figma ? FGMA est un outil de conception basé sur le cloud pour créer des interfaces utilisateur et des expériences utilisateur, ce que nous appelons l'UI UX, n'est-ce pas ? Dans la conception de sites Web et le développement d' applications. Il est donc similaire à des programmes tels que Sketch, mais avec une focalisation et une collaboration, il favorise la collaboration entre les équipes , entre vos partenaires ou vos collègues. Vous pouvez facilement travailler sur un projet spécifique en temps réel. Ensuite, il permet de créer des graphiques vectoriels, concevoir des mises en page et d' ajouter des animations L'un des avantages de Figma est sa facilité d'apprentissage Il possède une interface conviviale pour les débutants, ce qui le rend idéal pour ceux qui débutent dans la conception de logiciels. Ensuite, nous parlons de collaboration en temps réel. C'est très, très important et c'est l'un des principaux objectifs de Figma, de pouvoir travailler avec d'autres sur le design simultanément, quel que soit votre emplacement Ainsi, où que vous soyez dans le monde, vous pouvez travailler en collaboration sur un projet ou sur un fichier en particulier En temps réel, vous pouvez apporter des modifications directement. Nous examinons donc comment collaborer dans le cadre de ce cours en particulier. Ensuite, nous parlons de prototypage. Vous pouvez créer des prototypes interactifs pour tester et affiner vos idées de conception. C'est très simple avec Figma. Ensuite, nous parlons de la nature basée sur le cloud. Dans Figma, vous avez accès aux fichiers depuis n'importe quel appareil connecté à Internet Il est donc facile de synchroniser les éléments et vous pouvez y accéder n'importe où. Comme il est basé sur le cloud, vous n'avez rien à enregistrer. Il enregistre automatiquement votre travail lorsque vous travaillez directement sur le cloud. Même si vous avez la version de bureau , elle permet également de synchroniser facilement la version en ligne. Cela fonctionne donc facilement. Une fois connecté à Internet, vous pouvez continuer à travailler directement sur Figma Enfin, nous parlons des fonctionnalités de la poignée. vous pouvez facilement faire passer vos designs Avec Figma, vous pouvez facilement faire passer vos designs du concept au développement C'est très, très simple. Il s'agit d'un outil tout-en-un que vous pouvez utiliser pour développer des applications, concevoir des sites Web, concevoir différents types d'éléments interactifs, et vous pouvez passer au prototypage et profiter de votre expérience J'espère que cette vidéo vous plaira. Merci de votre attention, et j'ai hâte de vous voir au prochain cours. 3. Créer un compte et s'inscrire: Pour commencer, vous pouvez accéder à n'importe quel endroit de votre navigateur. Vous pouvez ouvrir n'importe quel navigateur. Vous arrivez dans la barre de recherche ici et recherchez simplement Google, et vous pouvez rechercher Figma très facilement Vous pouvez simplement rechercher Figma et vous le verrez ici. L'outil de conception d' interface collaborative et vous pouvez le voir avec la première option. Ou bien, vous pouvez simplement vous rendre sur figma.com et cela vous redirigera vers la même plateforme Très bien, cela vous amènera sur cette même plateforme. Voici donc le site Web de la FGMA. Vous pouvez soit vous rendre directement sur figma.com, comme je l'ai dit, soit suivre la procédure de Google Et une fois que vous êtes ici, la façon dont vous concevez, alignez et construisez compte vraiment. Faites-le donc avec le FDMA. Vous pouvez donc voir qu'il ne s'agit que d'un échantillon collaboratif de ce qu'est la plateforme et de ce pour quoi vous pouvez l'utiliser Voici donc certaines des fonctionnalités que vous pouvez étudier et simplement comprendre comment la plate-forme peut être utilisée pour développer différents types d'applications, différents types de choses liées au Web et des prototypes. Donc, ici, vous pouvez continuer à avoir une meilleure compréhension de certains des avantages et des fonctionnalités qu'il offre que vous pouvez réellement parcourir juste pour comprendre brièvement la plate-forme. Maintenant, une fois que vous avez terminé, vous pouvez démarrer en créant un compte ici, et vous pouvez le faire en utilisant simplement Commencer ici ou vous pouvez utiliser la fonction de démarrage en tant qu' invité gratuitement ici. Vous pouvez également consulter le lien dans la description de cette vidéo et vous pourrez trouver un lien pour vous inscrire. Cliquons donc sur Commencer gratuitement, puis vous aurez ces options de correspondance. Vous pouvez vous connecter directement avec votre compte Google. Vous pouvez vous inscrire directement avec votre compte Google, ou vous pouvez utiliser n'importe quel e-mail ou mot de passe, et vous pouvez l'utiliser pour créer un compte directement. Pour ce tutoriel, nous allons utiliser l'un de mes comptes G mail juste pour nous connecter, afin de pouvoir cliquer sur le compte Gmail. OK. Ainsi, une fois connecté, vous serez redirigé vers cette plateforme. Maintenant, ici, vous devrez répondre à quelques questions pour avoir accès à la plateforme principale. Nous avons la possibilité de sauter à tout moment si vous ne le souhaitez pas. Mais je pense qu'il est conseillé de simplement répondre aux questions En gros, ce ne sont que des questions de base, vous pouvez donc simplement dire, quel est votre nom ? Vous pouvez simplement écrire, puis vous pouvez continuer. Quel type de travail faites-vous ? C'est juste pour qu'ils puissent préparer la plateforme pour vous, juste pour avoir quelques données vous concernant. Ainsi, par exemple, nous pouvons dire étudiant et éducateur, puis nous pouvons passer au suivant, puis nous pouvons dire : est-ce que l'un de ces termes décrit votre travail Travailleur indépendant dans un camp d'entraînement, dans une entreprise, dans une agence ou une école Disons à l'école, par exemple. Ensuite, nous pouvons voir quel type d' institution fréquentez-vous ou pour lequel vous travaillez ? Disons l'enseignement supérieur, par exemple. Ensuite, vous pouvez voir avec qui collaborez-vous habituellement ? Disons coéquipiers. Vous pouvez donc dire que vous souhaitez inviter des collaborateurs. Pour le moment, je ne veux inviter personne, donc je peux simplement sauter cette étape. Et puis, ce qui vous amène chez Figma aujourd'hui, commencer un nouveau travail et un nouveau projet Alors lancez un nouveau projet d'emploi. C'est donc mon objectif pour aujourd'hui. Et avez-vous déjà utilisé des produits FGMA ? Je peux dire que non, c'est la première fois parce que c'est la première fois que je t'emmène avec moi en voiture . Nous avons donc juste une idée de ce que c'est et de quoi nous pouvons l' utiliser directement, afin de tout apprendre sur le tas. Donc, quel plan fera l'affaire, c'est le plan de démarrage, qui a cette fonctionnalité de correspondance, ou le plan professionnel, qui a également cette fonctionnalité de correspondance. Eh bien, pour ce didacticiel, nous allons simplement passer au plan de démarrage. Nous pouvons donc simplement sélectionner le plan de démarrage et passer au suivant. Maintenant, que voudriez-vous faire d'abord, c' est utiliser le Figma ou continuer à utiliser le tableau blanc dans Feed Jam Mais pour le moment, pour me concentrer sur le design avec Figma, je peux sélectionner la première option, puis je peux simplement continuer et dire « terminer Très bien, vous êtes maintenant sur la plateforme principale. OK ? Vous avez donc la possibilité de simplement suivre cette procédure et cela va simplement vous montrer comment vous pouvez envoyer du texte à des couches de texte avec vos barres d'outils, déplacer des outils vous permettant de déplacer vos documents vers vos fonctionnalités vers différents endroits, etc. Et ici, vous avez le formatage dans le panneau de conception Vous avez les fonctionnalités de formatage, les fonctionnalités de conception ici Et vous pouvez simplement vous montrer les propriétés en un coup d'œil. Vous pouvez donc simplement commencer un nouveau fichier à partir de cela, puis vous pouvez simplement continuer et être le bienvenu sur la plate-forme principale. OK, c'est donc la plateforme principale sur laquelle vous serez invité chaque fois que vous vous inscrivez à Figma Ceci conclut ce cours sur la façon de créer un compte et de se connecter à Figma Dans le prochain cours, nous allons examiner certaines des choses de base que vous devez comprendre avant d'utiliser Figma Tout cet aperçu général de l'interface. Nous allons passer en revue certaines des choses de base que vous devez comprendre avant de commencer à créer fichiers et de commencer à travailler sérieusement. D'accord, mais nous allons aborder certaines des choses de base que vous devez comprendre à ce stade. Alors à la prochaine fois, merci d'avoir regardé et j'ai hâte de vous voir au prochain cours. 4. Aperçu de l'interface de base: Dans le dernier cours, nous avons expliqué comment s' inscrire et créer un compte dans Figma Dans ce cours, nous allons parler des bases, l'aperçu général de l'interface, ce que vous devez comprendre et des points auxquels vous devez prêter attention. Donc, la première chose à faire est que lorsque vous vous connectez à votre compte Figma, c'est la principale plateforme laquelle vous allez être connecté En haut à gauche, vous avez votre compte. Vous avez la possibilité de modifier les choses directement. Vous pouvez modifier n'importe quoi ici. Vous pouvez également ajouter votre photo COV, vous pouvez ajouter n'importe quoi. Et puis vous pouvez changer le thème de l'ensemble des looks de la figma C'est un thème léger. Tu peux le faire noircir. Certaines personnes l'aiment comme ça. Mais je pense que je le préfère dans le thème des lumières, donc vous pouvez toujours utiliser le thème et vous pouvez le modifier directement. Ou vous pouvez également suivre la conception du système si cela vous intéresse. Maintenant, encore une fois, vous avez le bureau, les paramètres. Ici, vous avez un tas de paramètres avec lesquels vous pouvez jouer, par exemple, vous pouvez changer le nom, puis vous pouvez changer la langue ou le titre du poste, le thème. Vous pouvez également modifier à partir d'ici. Et d'autres fonctionnalités. Vous pouvez donc simplement les étudier, puis vous pourrez comprendre les puis vous pourrez comprendre informations du compte à partir d'ici. Vous pouvez mettre à jour, supprimer ou ajouter quoi que ce soit. Ensuite, vous pouvez supprimer votre compte, même définitivement, si vous en avez terminé avec ce que vous êtes faire et que vous souhaitez le supprimer. Et puis il s'agit d'une communauté pour les utilisateurs de Figma. Vous pouvez avoir le vôtre, rejoindre la communauté Figma pour publier fichiers et des plugins, commenter et voir ce que font les gens Vous pouvez suivre les membres et aimer ce qu'ils utilisent, et vous pouvez également apprendre d'eux. Ensuite, vous pouvez également gérer les notifications à partir d'ici en utilisant cette fonctionnalité. Il s'agit donc des trois points. Il s'agit de paramètres. Si vous le souhaitez, vous pouvez télécharger la version desktop, qui est en fait celle que nous allons utiliser pour ce didacticiel Nous allons utiliser la version desktop de Figma. Je vais vous montrer comment le télécharger et l'installer. C'est très simple, puis vous pouvez l'ouvrir et commencer à travailler. Il se synchronise automatiquement entre la version de bureau et la version en ligne, vous n'avez donc pas à vous soucier de quoi que ce soit Et voici le profil de la communauté. Vous pouvez créer votre propre profil et simplement rejoindre la communauté, puis partager des idées. Si vous avez un défi, vous pouvez toujours le partager avec eux, puis vous pouvez communiquer et ajouter vos propres commentaires au défi de certaines personnes. Ensuite, vous pouvez choisir le compte sur lequel vous souhaitez travailler, ce qui signifie que vous pouvez travailler avec plusieurs comptes, puis vous déconnecter si cela vous intéresse. C'est donc la première option. Vous pouvez effectuer des recherches directement à partir d'ici. Vous pouvez rechercher des fichiers, des projets, vous pouvez rechercher n'importe quoi à l'aide de la barre de recherche. Hein ? Le suivant, vous avez le récent. Ceci décrit certaines des principales choses que vous avez récemment abordées au sein de Figma Ainsi, si vous avez touché un projet ou un fichier en particulier sur lequel vous travaillez, vous pouvez toujours le trouver dans la version récente d'ici. Et puis en haut, vous avez les modèles de confiture de figues. Si vous souhaitez travailler sur des modèles, vous pouvez facilement les consulter et travailler sur des modèles. Ils sont classifiés. C'est tout. Vous pouvez consulter des brainstormings, diagrammes, plannings et des réunions en fonction de ce que vous essayez de créer Mais alors notre objectif, ce sont les vues récentes, d'accord. Et puis ce sont des fichiers partagés. Si vous avez partagé des fichiers, si des personnes ou des équipes ont partagé des fichiers, vous pouvez les trouver ici. Projet partagé également. Vous pouvez trouver les projets qui sont partagés avec vous afin de pouvoir y travailler directement. Maintenant, ce sont vos équipes. Vous pouvez avoir plusieurs équipes sur lesquelles vous pouvez travailler ensemble, puis vous avez le brouillon. Draft est en fait l'un des endroits les plus importants de Figma C'est ici que vous pouvez créer différents types de projets, différents types de fichiers. Vous pouvez créer et travailler dessus directement à partir d'ici. Vous pouvez donc ajouter différents types de fichiers à partir de ce brouillon en utilisant ce signe plus. Vous pouvez donc cliquer sur le signe plus, et vous pouvez voir que vous pouvez créer un nouveau fichier de conception, nouveau fichier figma fi jam Vous pouvez créer à partir d' ici, et vous pouvez importer des médias directement à partir d'ici. Je vais vous montrer en détail comment l'utiliser. Ensuite, ici, vous avez la possibilité de consulter votre plan et de le mettre à niveau si nécessaire. Ensuite, ici, vous avez des équipes. La première est donc la première chose que vous avez. Vous pouvez avoir plusieurs projets. Vous pouvez ajouter de nouveaux projets directement à partir d'ici, ou pour n'importe quel projet, vous pouvez venir ici, vous pouvez appuyer sur ce signe plus pour démarrer un projet. C'est également une autre solution, mais j'aime toujours commencer par le brouillon. À partir du brouillon, c'est beaucoup mieux et plus facile. Ce sont donc les principes de base. Ici, c' est l' endroit principal où vous pouvez voir votre brouillon, puis vous pouvez le voir supprimé. Si vous travaillez sur un brouillon ou des projets supprimés, vous pourrez les voir ici. Maintenant, en haut à droite, c' est ici que vous pouvez payer. Vous pouvez ajouter des fichiers de conception. Vous pouvez créer et ajouter des fichiers de conception en cliquant simplement sur ce fichier de conception, et il créera simplement un nouveau fichier de conception pour vous. De la même manière, vous pouvez également créer un fit jam board directement depuis ce coin supérieur droit. Ensuite, vous avez la possibilité d'importer multimédia, qu'il s'agisse d'une image B ou d'une vidéo, vous pouvez importer directement depuis Pre. Vous pouvez consulter tous les fichiers, fichiers de conception, les fichiers Fi-Jump, l'arrangement, vous pouvez vérifier le tri. Est-ce alphabétique ? Qu'il s'agisse de la date de création ou de dernière modification ou du premier jour ou du plus récent, vous pouvez organiser les fichiers en conséquence, puis modifier l'apparence. Il s'agit de la vue en grille. Vous pouvez le changer en mode liste , ce qui ressemble à ceci. Et je pense en particulier que j'aime que ce soit dans la vue en grille, qui est ma préférée. Donc, ici bas, au cas où vous auriez des difficultés dans le cadre de votre travail, vous pouvez toujours vous y attarder. Et cliquez dessus, et vous aurez la possibilité de interdire de regarder leurs vidéos YouTube Vous pouvez consulter leurs forums d' assistance, les notes de publication et envoyer des commentaires si vous rencontrez des problèmes que vous pouvez partager avec la marque avec l'entreprise, puis vous pouvez également contacter directement le support. Vous pouvez demander à la communauté. Cet onglet vous redirigera également vers la même communauté où vous pourrez interagir avec les gens et partager vos défis et vos idées. Et puis ici, nous avons le raccourci, le raccourci-clavier. Et puis, en bas, vous pouvez réinitialiser votre système d'embarquement. Tout revient à la réinitialisation et vous pouvez modifier la disposition du clavier et la langue à partir d'ici. C'est donc une chose très importante laquelle vous pouvez toujours cliquer pour comprendre ou pour vous connecter aux autres fonctionnalités. Et puis ici aussi, vous pouvez explorer la communauté si cela vous intéresse. Ainsi s'achève ce cours sur la compréhension des bases de Figma Les éléments de base que vous devez comprendre avant de commencer à utiliser Figma Dans le prochain cours, nous allons apprendre à créer un projet ou un fichier sur lequel nous pouvons travailler directement. OK ? Nous créerons donc un projet et un fichier, et nous allons également comprendre la vue d'ensemble de l' interface, afin que vous puissiez comprendre clairement ce qu' est la plate-forme et à quoi nous pouvons l'utiliser directement. Alors jusqu'à la prochaine fois, merci d'avoir regardé et j'ai hâte de vous voir au prochain cours, non ? 5. Installer l'application Figma: Dans ce cours, nous allons apprendre comment télécharger et installer l'application de bureau Figma, ce qui est très, très important si vous l'avez installée sur votre système C'est donc votre travail et c'est le processus Et attention, comme je l'ai déjà dit, il est très facile de travailler sur la version de bureau, et elle est automatiquement synchronisée avec la version Cloud Ainsi, chaque fois que vous vous connectez à un ordinateur, vous retrouverez toujours votre travail intact. C'est juste pour faciliter l'accès que la version de bureau est créée. Donc, pour accéder à la version de bureau, il vous suffit de vous connecter car nous sommes connectés ici, et vous pouvez accéder en haut à gauche, sur cette fiche médicale. Vous pouvez cliquer, comme nous l'avons montré précédemment. Vous pouvez voir télécharger l'application de bureau. C'est ici que vous pouvez obtenir l'application de bureau la télécharger et l'installer. Vous pouvez donc cliquer pour détecter automatiquement le type de système d'exploitation que vous utilisez, il s'agisse d'un système d'exploitation Windows ou d'un système d'exploitation Mark. Il détectera automatiquement et vous donnera la version de ce système d'exploitation en particulier. Donc, dans mon cas, j'utilise le système d'exploitation Mark, donc il va me donner automatiquement la version Mark. Donc, une fois que je viendrai ici, il enregistrera ce fichier. C'est très très petit. Tu peux le voir. Vous pouvez simplement cliquer et vous pouvez le voir. Notre modèle FIG DMG, une fois que vous aurez cliqué, vous pourrez voir l'emplacement, et vous pourrez commencer à travailler dessus directement Vous pouvez donc double-cliquer et commencer à ouvrir et à installer directement. Il est très facile à installer. Il s'agit simplement d'un processus étape par étape. Comme nous installons des éléments sur des logiciels sur le système d'exploitation Mac. Il vous suffit donc de le faire glisser et de le déposer ici. Et il va juste vous donner la version textop installée. Il a donc détecté que j' ai déjà installé un. Est-ce qu'il va remplacer cet arrêt parce que je sais que je l'ai déjà installé. Mais c'est le processus, il suffit de glisser-déposer, et nous allons l'installer. Donc, une fois que vous l'avez installé , vous pouvez simplement ouvrir et pour l'ouvrir, vous pouvez simplement passer à la partie de lancement ici. Vous pouvez simplement cliquer et vous pouvez voir Figma. Vous ne le voyez pas, vous pouvez rechercher Figma et vous le verrez ici Figma Donc, une fois que vous avez cliqué, il s'ouvre Vous pouvez donc fermer cette version textop et continuer à travailler sur la version en ligne Et vous pouvez continuer à travailler sur la version desstop. À condition de vous connecter, vous pouvez continuer votre travail. Il s'agit donc de la version de bureau, je viens de me connecter, et vous pouvez voir qu'il n'y a aucune différence entre la version de bureau et la version en ligne. C'est donc juste pour faciliter l'accès, afin que vous puissiez tout travailler sur le bureau. Donc, en gros, voici comment télécharger et installer l' application de bureau pour Figma Vous pouvez simplement le suivre, le télécharger et l'installer sur votre système pour que nous puissions poursuivre le projet. Dans le cours suivant, nous verrons comment créer un fichier et un projet , puis nous allons donner un aperçu de la plate-forme de fichiers principale, sur la plate-forme principale, vous puissiez comprendre quels sont les éléments importants auxquels vous devez faire attention lorsque vous utilisez FICMA lors de utilisez FICMA lors création d'un fichier et de sa gestion sur FIGMA Alors à la prochaine fois, merci de votre attention et à bientôt au prochain cours. 6. Créer un aperçu de dossier et d'interface: Dans ce cours, nous allons apprendre comment créer un fichier et présenter un aperçu général de l'interface dans un fichier en particulier. Donc, pour commencer, comme je l'ai dit, vous pouvez participer au draft, ce qui est le plus simple, et vous pouvez faire partie de l'équipe. Vous pouvez donc accéder au signe plus, puis vous pouvez démarrer, comme vous voulez. Vous pouvez également accéder au fichier de conception ici et il va démarrer un nouveau fichier de conception. Pour ce tutoriel, nous allons commencer par le brouillon, vous pouvez accéder au brouillon et cliquer sur ce signe plus. Et encore une fois, vous avez la possibilité de commencer la conception à partir d' un nouveau fichier de conception. Ou à partir d'un nouveau fichier fik jam. Pour ce cours, nous allons démarrer nouveau fichier de conception en l'important simplement en cliquant sur le nouveau fichier de conception. Et une fois que vous aurez cliqué dessus, vous serez redirigé vers cette plateforme. Donc, la première chose que vous devez regarder en haut, c'est que vous avez ce brouillon, puis vous avez le projet intitulé. Vous devez donc nommer le projet dès le début. C'est la première étape. Nous pouvons donc le faire en double-cliquant ici, et disons que c' est notre premier cours. Sur Figma. Vous pouvez donc cliquer sur. Et maintenant, vous avez ce fichier, le premier cours sur Figma en cours d' ébauche sous le brouillon du projet Vous pouvez maintenant cliquer sur ce petit menu déroulant et vous avez la possibilité d'afficher l' historique des versions pour exporter ce projet, puis de modifier le profil de couleur du fichier, et vous pouvez dupliquer le fichier. Vous pouvez le renommer quand vous le souhaitez, et vous pouvez déplacer le projet quelque part, puis vous pouvez séparer ce fichier ou le supprimer à votre guise C'est donc la principale chose que vous pouvez faire ici. Il s'agit du canevas principal sur lequel vous pouvez effectuer tous vos ajouts, créer des prototypes, etc. Tu fais tout ici. Maintenant, sur la gauche, vous avez les couches où vous pouvez effectuer une recherche ici. Vous pouvez également rechercher n'importe quoi dans vos couches ou dans les autres plateformes. Ensuite, vous avez les couches répertoriées , les actifs et les pages. Vous pouvez également répertorier les pages et continuer à travailler sur le projet. Nous examinons cela en détail au fur et à mesure que nous poursuivons notre projet. Donc, pour le moment, vous pouvez être sur des couches. Et vous pouvez voir à droite que vous avez cet onglet de conception. C'est là que vous trouverez la plupart des éléments clés avec lesquels vous pouvez jouer, tels que les propriétés, puis vous avez cette section de prototype. Vous pouvez créer un prototype, créer une nouvelle connexion. Vous pouvez également exécuter votre prototype à partir d'ici pour voir à quoi il ressemblera au point final. Ce sont donc deux positions très importantes sur le canevas dont vous devez comprendre comment les utiliser. Maintenant, en haut à gauche, vous avez ce menu déroulant. Une fois que vous avez cliqué sur ce menu déroulant. Vous pouvez consulter l' accès rapide à l'action rapide. Si vous souhaitez consulter une action rapide, vous pouvez le faire. Et puis vous avez le dossier. Vous avez la possibilité de créer un nouveau design, nouveau fichier f jam à partir ici ou vous pouvez placer une image ou enregistrer une copie locale du projet sur lequel vous travaillez sur votre machine locale ou directement sur votre ordinateur. Et vous pouvez enregistrer dans l'historique des visions, si vous le souhaitez, ou vous pouvez afficher l'historique des visions. Et ainsi de suite, vous pouvez exporter des cadres au format PDF et exporter votre projet vers un fichier local. Vous disposez de ces options de base, comme l'édition, vous pouvez copier, tester et trouver des éléments pour remplacer les informations. Vous pouvez constater que vous pouvez faire beaucoup de choses à partir d'ici. Vous pouvez modifier les vues. Vous pouvez également insérer des quadrillages, des règles, etc. simplement pour vous aider dans votre travail et vous pouvez zoomer et dézoomer Vous avez de nombreuses fonctionnalités de Zoom directement ici. D'accord. Ensuite, vous pouvez afficher et masquer directement l' interface utilisateur. Vous pouvez afficher les contours, les contours des cadres, etc. Nous apprenons à utiliser la plupart de ces outils de base, choses de base au fur et à mesure que nous naviguons. Vous avez les fonctionnalités de l'objet, vous avez les fonctionnalités du texte, dont nous avons un grand nombre dans le panneau des propriétés ici, et puis vous avez l'entité organisée. Qui parle de la disposition en couches, laquelle vient en premier et laquelle vient en dernier La fonctionnalité vectorielle, les plugins, les widgets et les préférences, vous pouvez activer ou désactiver n'importe quoi ici pour modifier les préférences en ce qui concerne ce qui se passe ou ce qui s'affiche sur la plateforme. Vous pouvez donc vérifier ou nouer des objets anciens d'ici. Vous pouvez également changer le thème du mode sombre au mode clair, ou du clair au foncé, ou vous pouvez suivre le thème du système. En utilisant également cette méthode. Profil de couleur, disposition du clavier, et vous pouvez avoir un grand nombre de commandes à partir d' ici et de bibliothèques. Vous êtes libre de consulter les bibliothèques et de créer un compte, ce que nous avons également montré ici. Vous pouvez vous déconnecter, consulter le résumé juridique, les didacticiels vidéo, ainsi que les raccourcis clavier. Page d'aide, vous pouvez consulter toutes ces informations ici. C'est donc la première option. L'élément suivant est cette fonctionnalité de déplacement. Vous pouvez cliquer sur ce petit menu déroulant et déplacer votre contenu ou votre projet. Vous pouvez redimensionner les objets, ce que nous allons examiner en détail sur la façon de les utiliser. Ensuite, nous avons le cadre que vous pouvez activer en utilisant la lettre F, ou vous avez la section, vous pouvez créer une section, vous pouvez créer des tranches. Nous allons apprendre à utiliser tous ces éléments en détail, ainsi que leurs raccourcis. Ensuite, vous avez formes de différents types, des rectangles, lignes rectangulaires, des flèches, des ellipses, des polygones, etc. Vous pouvez placer des images et des vidéos si leurs raccourcis respectifs vous intéressent. Vous pouvez aller de l'avant et explorer tout cela. Et puis ici, la prochaine, c'est que nous avons les outils Pen. Vous avez le stylo et le crayon en fonction de ce que vous souhaitez utiliser. Nous les avons tous les deux. Et puis la suivante est la fonction de texte. Vous pouvez cliquer pour commencer à écrire quoi que ce soit. Vous pouvez donc simplement cliquer et commencer à écrire votre texte, et vous pouvez le voir ici, Ca. Vous pouvez double-cliquer dessus pour avoir la possibilité de changer les choses. Au fur et à mesure que vous avancez. D'accord, nous allons donc examiner tout cela en détail, afin que vous puissiez voir que vous pouvez disposer des fonctionnalités d'édition du texte de conception. Nous parlons de toutes ces fonctionnalités, de la façon d'utiliser certaines d'entre elles, de modifier le style du téléphone, la superposition, du style normal et du style de champ, la couleur, du trait, des effets Nous allons examiner tout cela en détail dans ce tutoriel. Et puis vous avez cette page de ressources. Tu peux tout vérifier. Vous pouvez ajouter des plug-ins, des composants, des widgets au fur et à mesure que vous avancez. Nous examinons donc en détail comment utiliser certains d'entre eux, puis vous avez l'outil à main au cas où vous voudriez faire des bêtises, dans le camas en Tu veux faire bouger les choses. Vous souhaitez zoomer sur une fonctionnalité ou un point direct. Tu peux le faire aussi. Et puis, ici, vous pouvez ajouter des commentaires. Vous pouvez ajouter des commentaires à tout moment, et quelqu'un peut travailler sur ce commentaire en particulier. Vous pouvez ajouter quelqu'un. Vous pouvez utiliser le signe d'ajout pour appeler un collaborateur en particulier, et vous pouvez travailler en collaboration avec cette personne Vous pouvez lui donner des instructions et il travaillera directement. Nous allons donc voir comment collaborer avec des personnes au sein de Figma en ajoutant commentaires, des mots collaboratifs ou actions collaboratives afin que vous puissiez travailler simultanément sur le même projet Disons colorier ceci. C'est bon. C'est juste une chose normale, juste une fonctionnalité normale, non ? Vous pouvez voir que nous pouvons le voir ici. Je ne fais donc que donner une instruction. Maintenant, ce sont les choses les plus élémentaires. Ici, vous avez également la possibilité de vérifier cela. Une fois que vous avez cliqué, vous pouvez maintenant consulter la section des commentaires. Maintenant, ici, vous avez votre nom Spotlight me, ce qui montre que je ne suis personne en train de m'adapter travaillant sur ce cadre en particulier. Ensuite, vous pouvez partager vos fichiers directement à partir d'ici, vous pouvez partager avec d'autres personnes, vous pouvez créer des liens et partager, et vous pouvez donner les différents contrôles respectifs aux personnes avec lesquelles vous partagez le document , telles que les propriétaires de ce lien peuvent consulter ou modifier le projet. Selon le type de contrôle que vous leur donnez, ils peuvent accéder au projet et le modifier directement. D'accord ? Vous avez la possibilité de publier la communauté afin que les gens puissent voir, vous puissiez voir votre travail et qu'ils puissent également vous faire part de leurs commentaires. C'est donc le contrôle. Vous pouvez dire que toute personne disposant de ce lien peut voir ou modifier ce projet en particulier. D'accord ? Il s'agit donc de partager. Vous pouvez copier le lien , puis le partager avec eux, ou vous pouvez ajouter directement l' adresse e-mail de la personne. Par exemple, je peux dire que je veux ajouter, puis vous pouvez simplement inviter, et cela va maintenant envoyer ce message pour inviter cette personne à travailler sur ce brouillon. Sélectionnez un projet en particulier et dites que nous voulons inviter cette personne, et qu'elle va recevoir l'invitation, a été invitée à modifier le premier cours de Figma, le projet sur lequel nous travaillons actuellement OK, c'est donc le message que vous allez recevoir une fois que vous aurez envoyé l'invitation. Voici donc le message, la classe dans laquelle je vous ai invitée à modifier la première classe de Figma, qui est le projet que nous sommes Vous pouvez donc ouvrir Figma et continuer à travailler sur le projet, car vous donnez maintenant l'autorisation Pour commencer à travailler sur le projet. Vous pouvez voir que vous avez le mode de développement. Vous pouvez l'activer, et vous pouvez toujours préjouer votre prototype pour voir directement les résultats. Vous pouvez cliquer dessus pour présenter et prévisualiser votre prototype directement pour voir le résultat de ce que vous créez. Nous allons également examiner cela en détail pour comprendre ce que cela signifie ou à quoi vous pouvez l'utiliser. Nous avons maintenant la fonction Zoom. Vous pouvez zoomer ce champ de 100 %. Vous pouvez zoomer et dézoomer et pixeliser, et cela se trouve dans l' aperçu en pixels sur les règles, les grilles de mise en page, etc., et bien d'autres choses encore, que nous allons aborder et montrer comment les utiliser de manière très détaillée au cours de ce didacticiel Enfin, nous avons ces trois points. Très, très important. Vos onglets récemment fermés apparaîtront ici. Vous pouvez le vérifier à partir des trois points. Donc, enfin, vous avez également ce p s à un moment donné. Si vous souhaitez vous référer au centre d'aide , contacter le support ou consulter les vidéos ou à ce sujet Ainsi se termine ce cours sur la création d' un fichier dans Figma, puis l'aperçu général de la plate-forme du fichier J'espère que cette vidéo vous plaira. Merci de votre attention, et j'ai hâte de vous voir dans mon prochain cours. 7. Le panneau Propriétés: Bonjour, et bon retour. Dans le dernier cours, nous avons parlé de la création d'un fichier et d'une partie de la présentation de la plateforme lors de la création de fichiers. Nous avons parlé de certains des onglets de base ici, façon dont nous pouvons les utiliser pour améliorer notre expérience. Dans ce cours, nous allons donc examiner le panneau des propriétés, qui est ce que nous avons ici. Pour le moment, comme nous n' avons rien sur notre canevas, donc le panneau des propriétés, nous ne pouvons pratiquement rien faire à partir de là. Sauf que vous pouvez changer l'arrière-plan et changer la couleur d'arrière-plan, en venant simplement ici et en cliquant dessus, et nous pouvons le changer en n'importe quelle couleur de notre choix. Vous pouvez donc le changer pour n'importe quelle couleur de votre choix. Et si vous avez un lit bébé, vous pouvez également le compléter. Et puis ici, nous avons la fonctionnalité d'exportation , que nous allons également aborder pour passer à ce didacticiel. Mais pour l'instant, permettez-moi de le faire pour que nous ayons un historique clair. Une chose que vous devez comprendre, c'est que ce panneau de propriétés est l'un des éléments les plus importants que nous allons utiliser tout au long de notre expérience avec Figma Tout dépend de la propriété, l'élément auquel vous avez affaire Ce panneau de propriétés va changer. Par exemple, prenons l'exemple suivant : si vous arrivez ici pour voir les changements de vitesse, nous pouvons simplement cliquer, et disons que nous sélectionnons cette ellipse ou ce cercle Si vous voulez dessiner un cercle, vous devez maintenir la touche Shift enfoncée, puis vous pouvez dessiner un cercle très facilement. Et en dessinant simplement le cercle, vous pouvez voir que le panneau des propriétés a maintenant été modifié. Maintenant, beaucoup de choses ont été introduites dans la mesure où vous pouvez changer les positions de ce cercle de l' axe x à l'axe y, puis la largeur et la hauteur. Vous pouvez tous les modifier. Même en cliquant, vous pouvez augmenter le nombre. OK. En cliquant et en faisant glisser le pointeur, vous pouvez augmenter ou diminuer le nombre en conséquence Même s'ils sont connectés à la largeur et à la hauteur, vous pouvez les lier et vous pouvez les faire varier individuellement au fur et à mesure afin voir si vous les modifiez différemment, la forme change en conséquence. Je préfèrerai qu'ils soient liés, et laissez-moi le faire pour le moment. C'est donc l'une des choses. Vous pouvez modifier la position, vous pouvez également modifier la position de la couche et vous pouvez modifier le champ, ce qui est l'une des choses les plus importantes. Vous pouvez cliquer ici et ajouter différents types de coloration à cette forme que vous venez d'ajouter. Disons que nous pouvons passer à un endroit agréable et que nous pouvons le sélectionner et simplement lui donner une très belle couleur. OK, disons quelque chose comme ça , et nous pouvons cliquer dessus. OK. Ainsi, tout en sélectionnant la forme, nous avons encore d'autres fonctionnalités, comme en bas, vous pouvez ajouter un trait en cliquant simplement sur cette position. Et vous voyez maintenant qu' un trait a été ajouté à l'intérieur. OK, tu peux changer la position du trait. Nous pouvons le placer au centre, vous pouvez le faire à l'extérieur. Dans ce cas, faisons-le à l'extérieur. Mais parce que c'est un très petit accident vasculaire cérébral. C'est pourquoi vous ne le voyez pas visuellement. Vous pouvez également augmenter la taille en venant ici, vous pouvez l'augmenter et vous pouvez voir ce moment que vous augmentez la taille. Je pense que quelque chose comme ça va très bien. Et si vous le souhaitez, vous pouvez également modifier la couleur de l'effet du trait. Mais il suffit de cliquer dessus. Vous pouvez en faire quelque chose comme si cela dépendait. Vous pouvez en faire quelque chose comme ça. Je pense que c'est sympa. Vous pouvez donc simplement échapper pour y échapper et vous retrouverez le même panel de propriétés Vous avez d'autres fonctionnalités que vous pouvez gérer et gérer. Vous pouvez en avoir les effets. Vous pouvez cliquer pour ajouter des effets. Vous pouvez ajouter de l'ombre à cette forme. Vous pouvez ajouter de l'ombre, et vous pouvez voir que vous pouvez voir dans l'ombre, déposer une couche d' ombre, ou vous pouvez le voir dans le coup d'arrière-plan. Dans chaque cas, vous pouvez constater que la forme change en termes de propriétés. Supposons que nous ayons une ombre portée, et vous pouvez voir visuellement que nous avons une petite ombre portée ici. Vous pouvez donc supprimer n'importe laquelle de ces fonctionnalités en cliquant simplement sur ce signe négatif et en introduisant la suppression. Vous pouvez l'activer ou la désactiver pour cette fonctionnalité. Vous pouvez donc activer et désactiver. Vous pouvez voir l'ombre projetée, elle est assez petite, mais elle est visible. Pareil ici, vous pouvez activer ou désactiver ce trait avec ce seul signe. Et ici, vous avez plus de fonctionnalités. Disons que je l'active. Ici, vous avez plus de fonctionnalités. Vous pouvez exporter si cela vous intéresse et exporter, vous avez un format différent. Vous pouvez utiliser ce fichier PNG par défaut, mais vous pouvez l'exporter au format P SVG et PDF C'est très basique et vous pouvez prévisualiser, consulter l'aperçu de ce que vous venez de créer. Vous pouvez exporter. Ceci est sans contexte, et vous pouvez l'utiliser sur d'autres documents rédaction de rapports ou tout ce avec quoi vous travaillez. C'est donc très basique. Et il ne s'agit là que d'un des nombreux éléments dont nous disposons. Essayons un autre élément. Par exemple, passons au texte ici et cliquez simplement. Vous pouvez activer le texte en cliquant simplement sur l'onglet T ici, le texte, ou vous pouvez utiliser la lettre T sur votre clavier pour lancer la commande de texte. Vous pouvez donc cliquer n'importe où, et disons que nous écrivons quelque chose comme « Bienvenue sur ma chaîne », par exemple Et vous pouvez voir dès maintenant qu'une fois que vous avez sélectionné, vous pouvez tout sélectionner. En fonction des contre-éléments que vous avez, l'effet change ici, les propriétés ici changent. Donc, comme dans ce texte, vous pouvez voir que vous pouvez également gérer le poste. Vous pouvez jouer avec la position gauche ou à droite sur l'axe X. Vous pouvez jouer avec lui sur l'axe de direction, et vous pouvez également jouer avec la rotation, vous pouvez le faire pivoter dans n'importe quel angle. Ici, vous avez la fonction de rotation, mais vous pouvez voir qu'à tout moment, vous pouvez faire pivoter. Laisse-moi faire ça. Et vous pouvez vérifier la couche, quelle couche, vous pouvez jouer avec la couche, et vous pouvez l'organiser en conséquence. C'est l'opacité. Et puis ici, vous avez d'autres fonctionnalités d'édition de texte de base, fonctionnalités d'édition de texte de base, comme la possibilité de changer le style du téléphone. Vous pouvez voir différents styles de téléphone. Lorsque vous passez la souris dessus, vous verrez que le texte change dans le style du téléphone, et vous pouvez avoir la taille du téléphone Vous pouvez avoir une taille différente. Si vous le souhaitez, vous pouvez vous-même augmenter directement la taille. C'est donc très simple. Donc , ici en bas, vous avez les autres fonctionnalités, comme vous pouvez ajouter la hauteur de ligne Il s'agit de l'interligne, hauteur de ligne et de l' espacement des lignes en ce qui concerne le texte Si vous avez plusieurs textes, vous pouvez ajouter la hauteur de ligne entre eux, et voici la verticale, c'est l' espacement des lettres Vous pouvez également en ajouter. Et puis voici l'espacement des paragraphes Vous pouvez peut-être en faire deux, la largeur du paragraphe, que vous pouvez augmenter ou diminuer en conséquence. Et c'est la hauteur automatique. Il s' agit d'une taille fixe partout. Tu peux, tu peux ajuster tout ça. Vous disposez de commandes virtuelles. Vous pouvez aligner à gauche, à droite et au centre. Vous pouvez faire toutes sortes d' alignements ici. Et vous avez cet alignement en haut, en bas au milieu. Vous pouvez faire tout cela d'ici. Et l'un des éléments clés auxquels vous devez faire attention est la sensation du texte. Vous pouvez changer cela à partir d'ici, vous pouvez cliquer et vous pouvez ajouter la sensation ici et vous pouvez changer la couleur pour n'importe quelle couleur de notre choix. Tracez quelque chose comme ce bleu, et vous pouvez également y ajouter un trait. Selon, vous pouvez ajouter un trait , en augmenter la largeur et changer la couleur, comme nous l'avons expliqué dans l'autre, n'est-ce pas ? Supposons donc que nous ayons quelque chose comme cette couleur rouge, et que nous puissions l'avoir comme ça. Et puis il y a aussi les effets. Déposez de l'ombre, vous pouvez y ajouter de l'ombre. Et je vois bien que vous pouvez voir la différence avec et sans. Laisse-moi juste le faire. C'est sans, c' est avec de l'ombre, et vous pouvez voir que le texte est plutôt joli. Vous avez donc un tas de commandes ici. Une autre chose à laquelle vous devriez faire attention , c'est que vous avez d'autres commandes ici. Comme vous pouvez y ajouter un lien, vous pouvez créer un lien à partir de celui-ci et vous pouvez créer vous-même un composant à partir de celui-ci. Nous parlerons de tout cela en détail au fur et à mesure que nous parcourrons ce didacticiel. Et une chose que vous devez également prendre en compte est que quel que soit l'élément auquel vous avez affaire, vous pouvez toujours trouver les propriétés activées ici. Vous pouvez voir «   Bienvenue sur ma chaîne ». C'est le texte que nous avons, et vous pouvez voir les lèvres. Cela discutera de tous les arrangements leur emplacement et de la manière de régler les problèmes de position. Ceci conclut ce didacticiel sur le panneau des propriétés, ce que c'est et comment comprendre les fonctionnalités de base. En ce qui concerne l'ajout de certains éléments et le jeu avec certaines de leurs fonctionnalités. J'espère que cette vidéo vous a plu. Merci de votre attention, et j'ai hâte de vous voir au prochain cours. 8. Couche d'éléments dans Figma: Dans le dernier cours, nous avons parlé des bases du panneau de propriétés de Figma Et dans ce cours, nous allons parler des bases des couches. Ainsi, chaque fois que vous aurez créé un projet, tout au long de votre expérience dans Figma, vous utiliserez beaucoup les fonctionnalités de ces couches , car la plupart des éléments que vous allez être , la plupart des éléments que vous allez organiser, seront organisés ici donc très important de comprendre l'arrangement ici est donc très important de comprendre l'arrangement ici. Donc, la première chose que vous devez comprendre est que nous pouvons créer des doublons en maintenant la touche option ou l'ancienne touche de vos fenêtres enfoncée Vous pouvez simplement sélectionner la touche d' option, puis cliquer et nous pouvons faire glisser Vous pouvez voir maintenant que nous en avons une copie. Vous pouvez donc voir en ce moment que nous avons le LPS un et le LPS deux. C'est parce que ce sont deux choses différentes. Et une autre chose que vous devez savoir, c'est que la position varie vraiment en termes de superposition Ainsi, tout objet ou élément que vous avez en haut se concentrera ou se comportera en haut de ce LPS parce qu' il se trouve au-dessus de celui-ci, même dans le classement ici à la superposition Et vous pouvez voir que ce texte est au-dessus de tout. Donc, si j'apporte ce lesta par exemple, je le sélectionne et je change la couleur pour quelque chose comme le rouge Et si j'essaie d'en arriver là, vous pouvez voir maintenant que c'est au-dessus de tout cela. C'est parce que cette couche deux est au-dessus de celle-ci. Nous pouvons donc cliquer avec le bouton droit de la souris et le renommer si vous le souhaitez. Nous pouvons le renommer. OK, alors appelons-le le cercle orange. Et puis renommons celui-ci en cercle vert, par exemple Disons donc ce cercle vert pour faciliter la compréhension. OK. Nous pouvons donc voir que c'est le cercle orange, c' est le cercle vert. Et lorsque vous essayez également d' apporter le texte, vous pouvez voir que le texte est au-dessus de tous. C'est parce que sa position se situe vraiment avant tout à ce stade. Tu peux essayer de t'ajuster. Vous pouvez les modifier en les faisant simplement glisser. Par exemple, lorsque vous glissez et déposez votre orange, vous pouvez voir qu'elle passe en dessous du texte, et vous pouvez également faire glisser la verte vers le haut, et vous pouvez voir qu'elle devient le haut. L'arrangement est donc très, très simple. Vous pouvez toujours vous adapter si cela vous intéresse. Le texte peut donc toujours revenir parce que nous le voulons en haut. Vous pouvez voir en ce moment que nous l'avons en haut. Vous pouvez jouer avec les choses les plus élémentaires à partir d'ici, mais c'est l'arrangement qui compte. Si vous comprenez comment les couches sont disposées , votre travail sera très, très facile. Vous avez donc un certain nombre de choses à surveiller. Donc, tout ce qui est au-dessus est au-dessus. Tout ce qui se trouve ci-dessous est vraiment inférieur cela. Lorsque vous examinez le processus de superposition, vous avez d'autres éléments que nous allons examiner dans ce même panneau Vous avez le panneau des actifs, et nous avons le panneau des pages, lequel vous pouvez créer plusieurs pages, comme nous l'avons dit . Nous allons examiner tout cela en détail dans l' autre didacticiel. Et vous pouvez verrouiller les positions des éléments. Par exemple, vous pouvez verrouiller la position de ce texte d'un simple clic. Cela va donc rester à cette position, et vous pouvez le verrouiller directement en cliquant simplement et vous pouvez utiliser cette fonctionnalité de la même manière pour l'activer ou désactiver depuis le panneau depuis le canevas. Il devient donc visible ou invisible. Donc, en fonction de ce sur quoi vous travaillez, vous pouvez toujours avoir certaines de ces fonctionnalités et jouer avec elles. OK, ceci conclut ce cours sur les bases des couches, sur la compréhension de la superposition des couches en termes de disposition des éléments dans Figma J'espère que cette vidéo vous a plu. Merci de votre attention et à bientôt au prochain cours. 9. Ajouter et personnaliser des cadres: Dans le dernier cours, nous avons parlé la superposition d' éléments dans Figma, et dans ce cours, nous allons parler des bases des cadres, de la façon d'ajouter des cadres . Maintenant, que sont les cadres ? Les cadres sont en fait les éléments auxquels nous ajoutons des propriétés que nous pouvons avoir pour nous aider à séparer les éléments et les propriétés au sein de différents types de pages, d'accord ? Si vous créez une application téléphonique, les différentes pages que vous avez dans cette application particulière sont représentées par des cadres Le nombre de cadres que nous avons dépend donc. Donc, si vous avez dix pages dans une application en particulier, cela signifie que vous avez dix cadres disposés dans cet espoir. Nous allons apprendre à les créer et à les lier à leurs propriétés au fur et à mesure. Pour l'instant, pour ajouter un cadre de base, vous pouvez aller jusqu'ici et cliquer sur cette fonction de cadre, ou vous pouvez utiliser la lettre F. Vous pouvez appuyer sur la lettre F votre clavier pour activer l'outil cadre. Vous pouvez donc simplement sélectionner n'importe où et vous pouvez faire glisser et vous pouvez sélectionner ou créer votre cadre comme suit. Il s'agit donc d'une taille 469 x 3408. Nous pouvons simplement le publier, et vous pouvez voir en ce moment que nous l'avons sous forme de cadre. Maintenant que cela devient un cadre, vous pouvez vous assurer automatiquement que tous ces éléments sont désormais logés en dessous. Vous pouvez le réduire et le réduire à nouveau, et tous ces éléments se trouvent désormais spécifiquement sous celui-ci. Ainsi, les cadres peuvent également être utilisés pour catégoriser nos éléments afin que nous puissions savoir exactement quelle partie de ces éléments appartient à ce cadre et quelle partie de ces éléments appartient également à ces cadres Encore une fois, si vous êtes certain de la taille que vous souhaitez, sinon, vous pouvez ajuster la taille directement du cadre en le glissant , en cliquant, en le faisant glisser et en le déplaçant, vous pouvez l'ajuster à n'importe quelle taille Ou si vous connaissez la taille en particulier, vous pouvez venir ici et modifier la taille en conséquence Vous pouvez voir que nous pouvons augmenter la taille ou diminuer la hauteur en termes de hauteur, que dans la position en x et y, vous pouvez jouer avec la position. Et à tout moment, vous pouvez cliquer dessus et le déplacer. Mais si vous définissez le type de taille que vous souhaitez créer, vous pouvez facilement l'avoir . Ainsi, par exemple, si vous essayez de créer avec la touche F et que vous activez la création de cadres, vous pouvez voir les modèles que le Figma vous propose Nous avons donc un tas de tailles prédéfinies pour le téléphone, peut-être si vous avez affaire à un téléphone, peut-être si vous essayez de développer une application téléphonique, vous pouvez voir les différentes tailles pour iPhone 14 et 15 Pmax Tu peux les voir. C'est la taille. Il s'agit de la taille standard pour 15 personnes. Il s'agit de la taille standard pour l'iPhone SE, et pour le téléphone h, vous pouvez voir que c'est la taille standard. Pour Android, petit, c'est la taille, Android grand, c'est la taille. Vous pouvez donc simplement sélectionner n'importe qui. Si vous utilisez également une tablette, il s' agit de tailles prédéfinies que vous pouvez facilement sélectionner en fonction de ce que vous essayez de créer si vous ne connaissez pas la taille spécifique. Si vous avez affaire à un ordinateur de bureau, vous pouvez voir que différentes tailles sont utilisées avec MT Book, TV ou ordinateur de bureau ou à peu près ou Map Book Pro 14 ou similaire. Vous pouvez donc simplement sélectionner la recréation de la présentation, vous pouvez voir les différentes tailles. Vous utilisez 16 sur neuf quatre sur trois. Oh, vous pouvez voir si vous utilisez aussi des montres, c'est une Apple Watch. Et si vous souhaitez créer des formats pour le papier, vous pouvez voir la plupart d'entre eux A, A cinq, A six, au format lettre et sur différents réseaux sociaux. Vous pouvez sélectionner ou faire sélectionner le papier et vous pouvez joindre les formats précis. Donc, dans ce cas, allons-y avec quelque chose de simple. Sélectionnons le pon 14 plus, cliquez dessus, et vous pouvez voir par défaut que la Figma vient nous donner cette taille comme taille PON 14 OK. Vous pouvez donc maintenir la touche commande enfoncée et utiliser la tout seul, maintenir la touche commande enfoncée et utiliser la molette de défilement de votre souris pour effectuer un zoom arrière. Ainsi, vous pouvez avoir plus de détails ici. Avec la commande, maintenez la touche commande enfoncée et faites défiler la page vers le bas, vous serez en mesure de réduire la taille, tout comme ou de l' augmenter si vous faites défiler la page vers le haut ou vers le bas, vous pouvez utiliser cette touche de commande la lettre H et placez ces deux tailles sur le côté. Une autre chose que vous pouvez remarquer, c'est que dans les cadres, vous pouvez toujours vous échapper pour revenir à l'outil de sélection. Vous sélectionnez donc n'importe quel cadre. Vous pouvez le dupliquer en utilisant simplement la commande D pour dupliquer un cadre particulier. Vous pouvez également maintenir la touche option enfoncée dans Mark ou la touche T dans les fenêtres, puis sélectionner et faire glisser le pointeur pour créer la même copie de ce cadre en particulier. C'est donc très facile de le faire. De plus, vous pouvez copier et coller ce même cadre quelque part. Maintenant, maintenons la touche de commande enfoncée et zonons-la un peu pour que nous puissions tout voir à l'intérieur. Donc, une autre chose que je veux vous montrer est que vous pouvez copier des propriétés. Vous pouvez l'aligner en conséquence. Si vous les avez alignés, vous pouvez les aligner directement les sélectionnant tous directement ici, et vous pouvez voir en bas que vous avez cette icône, qui vous permet de les aligner verticalement. Lorsque vous cliquez, vous les verrez, ils sont également alignés en conséquence. Vous avez un alignement vertical égal. Et si vous le souhaitez, si vous les avez séparés, par exemple, s'ils sont alignés, et si vous voulez qu'ils soient alignés verticalement. Vous pouvez tous les sélectionner. C'est suffisant, maintenons la touche Shift enfoncée. Et nous pouvons utiliser la touche commande et faire défiler l'écran vers le bas, nous pouvons tout sélectionner , par exemple, puis nous pouvons l'aligner. Cela permettra de s'assurer qu'ils sont alignés verticalement. Et si vous voulez les aligner horizontalement, c'est aligner horizontalement. Si vous souhaitez les aligner verticalement pour qu'ils soient la même taille au même niveau, vous pouvez simplement venir ici et vous pouvez voir aligner les centres verticaux. Ainsi, en un seul clic, vous pouvez voir qu'ils sont alignés de la même manière et qu'ils sont alignés au centre vertical. Il s'agit donc essentiellement de la façon de traiter les éléments avec des cadres et de jouer avec eux. Maintenant, une autre chose est que vous devez comprendre que les éléments que nous avons dans un cadre particulier sont faciles à copier, vous pouvez les copier facilement et les placer sur différents cadres. OK. Ainsi, par exemple, si nous avons ce cadre, si vous sélectionnez ce cadre, que nous sélectionnons ce texte, que nous cliquons simplement et que nous pouvons simplement le mettre dedans. Écrivons quelque chose. Bienvenue. Et nous avons cet accueil. Cela signifie que si vous sélectionnez ce texte et que vous maintenez la touche commande enfoncée et que vous maintenez la touche option enfoncée, il vous montrera exactement la distribution. La taille se fait par la gauche, par le haut, par les côtés, la disposition par les côtés, par le côté droit et par le bas. Voici l'arrangement. Donc si vous voulez copier cet accueil, vous le copiez avec la commande ou le contrôle C de votre clavier, vous arrivez à la deuxième image. Vous pouvez exécuter la commande V pour le coller et vous pouvez voir que lorsque vous maintenez la touche option enfoncée, vous verrez qu' il a été collé exactement à l'endroit où vous l'avez copié depuis l' autre propriété, directement depuis l'autre cadre Et pareil ici, vous pouvez le dépasser et il gardera la même position au fur et à mesure que vous passerez à autre chose. Une autre chose que nous pouvons apprendre en ce qui concerne le cadre est que lorsque vous regardez ceci, vous remarquerez que chacun des cadres pour iPhone que nous avons, c'est l'iPhone 14 plus, téléphone 14 plus un, deux, trois, ils sont disposés en conséquence. Vous pouvez les renommer comme nous l' avons expliqué plus haut. Vous pouvez simplement double-cliquer et vous pourrez les renommer afin de voir l'écran 1, par exemple, puis vous pourrez le créer Non, c'est l'écran 3. Par exemple, disons l'écran trois, et ceci est l'écran un écran deux, et ceci est l'écran un. Il suffit de double-cliquer et d' appeler cet écran « un ». Vous pouvez donc voir que l'accueil est désormais un sous-ensemble de l'écran trois, car il s' agit d'un élément situé sous ce troisième cadre Il s'agit d'un article du cadre 2. Il s'agit d'un article sous cadre. D'un en un. Et puis vous avez ceci, laissez-moi utiliser la lettre H, et vous pouvez voir sur ce petit cadre, vous pouvez voir que tout cela est logé sous ce cadre. Et dans chaque cas, vous pouvez réduire les propriétés, les éléments, afin de voir plus clair et de faciliter l'accès aux autres propriétés. Maintenant, dans chaque cadre que vous avez créé, vous pouvez voir que vous avez cette option Une fois que vous avez sélectionné ce cadre, vous pouvez voir ces propriétés. Voici les propriétés du cadre que vous venez de créer. Et vous pouvez également jouer avec la taille en termes de position, de largeur et de hauteur. Vous pouvez jouer avec certaines de ces propriétés, et vous pouvez l'inverser par rapport à l'horizontale, la faire passer de la verticale à l' horizontale ou à la planche. Et vous pouvez jouer avec le rayon d'angle. Vous pouvez l'utiliser , je l'utilise beaucoup. Ainsi, lorsque vous jouez, vous pouvez voir que vous pouvez augmenter le rayon des coins. Et maintenant, tout devient un rayon n'est plus aussi raide qu'avant. Vous pouvez donc avoir autant de propriétés. L'angle de rotation, comme nous l'avons expliqué précédemment, les propriétés nécessaires pour jouer avec l'irrotation et la sensation Vous pouvez changer la couleur de sensation en cliquant simplement dessus et vous pouvez sélectionner la couleur et la faire varier en conséquence. OK. Nous abordons donc tous ces éléments de base, comment ajouter des éléments et les traiter en détail dans les cadres. Mais pour le moment, vous avez l'option de champ. Vous avez l'option de trait comme nous l'avons expliqué précédemment. Tu as l'option secte. De plus, si vous voulez y ajouter de l'ombre, vous pouvez en voir pas mal. Nous avons donc également ces autres fonctionnalités. Nous avons la réputation d' être prêts pour le développement et les utilisateurs masquent d'excellents composants. Ceci conclut ce cours sur la façon d'ajouter des cadres et de les personnaliser en conséquence dans notre canevas. J'espère que cette vidéo vous plaira. Merci de votre attention, et j'ai hâte de vous voir au prochain cours. Par 10. Ajouter des grilles et des guides: Bien, dans le dernier cours, nous avons expliqué comment ajouter et personnaliser des cadres dans Figma Et dans ce cours, nous allons parler de la façon d' ajouter des grilles et des guides dans nos cadres grilles et les guides sont donc très importants pour nous permettre de rester organisés et de nous assurer que nous travaillons avec précision tout au long du processus d' ajout et de retrait d'éléments dans nos cadres Nous pouvons donc connaître exactement les tailles sur l' ensemble des sites, et ainsi de suite au fur et à mesure que nous poursuivons la création de cadres. Donc, la première chose est que nous pouvons ajouter des grilles en sélectionnant simplement un cadre en particulier, et vous pouvez accéder au panneau des propriétés ici, et vous pouvez voir la grille de mise en page ici Vous pouvez donc simplement cliquer sur ce signe de tracé pour ajouter une grille, et par défaut, c'est la grille qui est ajoutée. Maintenant, j'ai une grille là-dessus, et vous pouvez la voir clairement visible. Tu peux le masquer si tu veux. Vous pouvez le masquer ou l'afficher directement, comme nous l'avons expliqué, pour n'importe quel élément. Si vous voulez avoir plus de propriétés cette grille en particulier ou jouer davantage avec elle, vous pouvez cliquer sur ces points, ce Seton Il vous suffit de cliquer. Vous pouvez simplement cliquer, et vous pouvez voir qu' avec cette liste déroulante, vous avez plusieurs types de grilles. Il s'agit d'un réseau normal. Si vous voulez avoir une grille de colonnes, vous pouvez cliquer et vous avez cette grille de colonnes. Tu peux porter le chiffre à 20, si tu veux le chiffre. En fonction, si vous passez à 20, vous pouvez voir que nous avons 20 chiffres, et vous pouvez jouer avec la coloration pour changer la couleur de votre choix. heure actuelle, vous pouvez voir que nous avons cette couleur, et vous pouvez frapper et vous échapper. Et vous avez d'autres propriétés comme l'opacité. Pour le moment, c'est dix, vous pouvez peut-être en faire deux. Préparez donc pour que vos éléments soient visibles. Vous pouvez voir en ce moment qu'il y en a deux, mais vos éléments sont très visibles. Si vous ne le souhaitez pas, vous pouvez l' augmenter jusqu'à quatre, augmenter la visibilité, afin que vous puissiez le voir dès maintenant. Les éléments sont visibles, mais les grilles sont également visibles Vous avez donc ici le type de grille. Il s'agit d'une grille de colonnes. Vous pouvez cliquer sur la moitié de la grille gauche, et vous pouvez avoir la grille de droite ou la grille centrée selon que vous souhaitez obtenir plus d' espacement par la droite ou par la gauche, selon tout dépend de vous. Vous pouvez venir ici et dire étiré, déplacé de travers Tout dépend donc. Tu peux jouer avec eux. Donc pour le moment, supposons que nous voulions la grille de gauche, et que vous puissiez jouer avec le avec à travers la séparation. Vous pouvez faire en sorte qu'il y en ait peut-être cinq, mais maintenant cela devient plus petit. Et moins épais. Et si vous le souhaitez, vous pouvez en faire peut-être sept pour augmenter l'épaisseur. Et le décalage aussi, maintenant qu'il est réglé à zéro, vous pouvez venir ici et augmenter le décalage. Si vous passez à six, verrez que le décalage a été augmenté. D'accord ? Donc, en fonction de ce que vous voulez sur le bord. Si vous voulez un décalage plus important sur le bord, vous pouvez probablement le faire probablement 15. OK, vous pouvez donc voir maintenant que nous sommes encore plus bouleversés. Maintenant, ici en bas, tu as le numéro qu'il te faut. Tu peux l'augmenter. Peut-être que si nous en faisons cinq, vous pouvez voir maintenant que vous pouvez augmenter ou diminuer le nombre. Supposons que nous adaptions ce 30, afin que vous puissiez voir il faut faire, car vous pouvez maintenant l' augmenter là-bas. Vous pouvez maintenant ajouter une autre mise en page de grille. Si cela vous intéresse, vous pouvez toujours y échapper, et vous pouvez ajouter une autre grille en y accédant sur ce signe plus, et vous pouvez modifier. Maintenant, tu peux ajouter la gutta. Si vous le souhaitez, vous pouvez en faire un, et vous pourrez constater qu'il est maintenant beaucoup plus grand. Lorsque vous zoomez, vous pouvez maintenant voir quelle est la séparation, ce que vous devez faire, mais ensuite vous pouvez avoir ces 20 points. Je pense, et maintenant je pense que c'est une bonne chose. Vous pouvez maintenant ajouter une autre grille en venant simplement ici. Vous pouvez y échapper, et vous pouvez ajouter une autre grille en cliquant dessus et en appuyant sur le côté positif. Vous pouvez donc en ajouter d'autres, afin que vous puissiez également venir ici et jouer avec les propriétés. En fonction, il s'agit d'une grille de colonnes. Vous pouvez en faire une grille de lignes et vous pouvez également jouer avec les fonctionnalités. Vous pouvez modifier les différentes portions. C'est pratique dans les cas où vous essayez de le faire , alors faisons en sorte que cela soit probablement 15. Ah, 12 ans. C'est donc parfois pratique lorsque vous avez affaire au téléphone et que vous souhaitez organiser vos éléments en conséquence. Donc, si vous avez cette taille uniforme, il vous sera très facile de bien disposer vos éléments . Ensuite, vous pouvez continuer et peler avec eux. Les autres fonctionnalités, comme nous l'avons expliqué, vous pouvez également activer ou désactiver n'importe quelle grille directement avec celle-ci. Et vous pouvez supprimer n'importe quelle grille en appuyant sur le signe négatif. Eh bien, si cela vous intéresse, vous pouvez simplement supprimer la grille. Maintenant, les guides sont une autre caractéristique clé que je souhaite partager avec vous et qui peut vous aider à rester précis et à maintenir souhaite partager avec vous et qui peut vous aider à rester précis et à maintenir l'espacement dans votre cadre Les guides peuvent être attachés à l'aide des règles, d'accord avec les règles. Vous pouvez donc doubler l'intervalle pour afficher les règles et les afficher sur n'importe quel type de canevas Sigma en utilisant simplement le raccourci Shift F Shift r pour activer les règles sur les côtés et en haut ici et déplacer r à nouveau vers celui-ci Vous pouvez donc doubler la règle avec Shift R et la doubler en activant ou en désactivant. Donc, le guide que vous pouvez avoir ici pour vous aider dans la précision est que vous pouvez atteindre les bords et jusqu'à ce que vos montagnes russes se transforment en ce signe horizontal Lorsque vous cliquez et faites glisser, vous pouvez voir que vous avez une ligne que vous pouvez déplacer à l'intérieur du canevas pour définir peut-être le point de départ d'un élément. Si vous voulez connaître la taille de l'endroit où vous vous trouvez, vous pouvez maintenir la touche option de votre clavier enfoncée , et vous pouvez maintenir la touche T de vos fenêtres pour voir le numéro de la pièce depuis la gauche Et pareil aussi, tu peux redescendre. Cliquez à nouveau et vous pouvez en mettre un autre sur la droite. Si cela vous intéresse, pour plus de clarté, vous pouvez toujours maintenir la touche option enfoncée pour définir la longueur à l'autre bord. Vous pouvez également faire la même chose en haut pour avoir un guide horizontal en cliquant simplement ici, et vous pouvez simplement faire glisser le pointeur et vous l'aurez. Supposons que nous maintenions cette valeur également pour définir la position exacte. Vous pouvez en apporter autant que vous le souhaitez, en fonction de ce que vous souhaitez créer. Vous pouvez en introduire différents et définir une taille particulière laquelle vous souhaitez ajouter des éléments au cours du processus d'ajout. Ainsi, pour retirer une boîte de guide dans un cadre, il vous suffit de la parcourir, sélectionner, de cliquer dessus et de la maintenir enfoncée, puis de la tirer vers l'arrière et vous aurez retiré le guide. Vous pouvez donc le voir, il suffit de le supprimer en cliquant et en le faisant glisser très facilement vers l'arrière Vous pouvez voir qu'il suffit de les supprimer tous. Voici donc les bases de l'ajout de grilles et de guides pour nous aider dans l' acquisition au sein de notre FMS Ceci conclut ce cours sur l'ajout de grilles et de guides dans notre cadre dans Sigma J'espère que cette vidéo vous plaira. Merci de votre attention, et j'ai hâte de vous voir au prochain cours. Au revoir 11. Ajouter et personnaliser des formes: Dans le dernier cours, nous avons expliqué comment ajouter des grilles et des guides à notre canevas Et dans ce cours, nous allons apprendre à ajouter des moutons, différents types de moutons et à les personnaliser Maintenant, commençons par effacer cela. Utilisons donc notre outil de dessin avec la lettre H pour nettoyer notre toile, puis nous pourrons commencer à apporter différents moutons. Maintenant, pour insérer des formes, vous pouvez les mettre sur le capuchon pour revenir à l'outil de sélection. Pour insérer des formes, vous pouvez aller jusqu'en haut ici. Vous pouvez voir que vous pouvez cliquer sur ce menu déroulant et que vous avez une série de formes différentes Vous pouvez commencer par un rectangle, que vous pouvez déclencher avec la lettre r, et vous avez une ligne avec la lettre L. Vous avez une flèche avec la lettre L, et ainsi de suite. D'accord, vous avez des lèvres , un polygone et une étoile, et vous pouvez également placer des images et des vidéos dans le même canevas si cela vous intéresse Commençons donc par importer quelque chose de simple, comme un rectangle. Et une fois que nous avons cliqué sur le dcgle, vous pouvez le dessiner directement en le faisant simplement glisser comme ceci Vous pouvez donc remarquer que je dessine un rectangle, mais lorsque je maintiens la touche Shift enfoncée, cela en fait un carré. Cela en fera un carré dont la longueur, la largeur et la hauteur seront égales. Donc, si vous voulez créer un carré, il est préférable de maintenir la touche Shift enfoncée pendant l'équation. Vous pouvez donc voir maintenant que j'ai un carré. Mais si je veux dessiner un rectangle, je peux lever la main en appuyant sur la touche Shift, et vous pouvez voir dès maintenant que je peux aller à la longueur de mon choix. Mais disons que je vais choisir un carré de cette longueur, comme vous pouvez le voir, je viens de dessiner mon carré. Et ajoutons-en une autre. Disons que je peux dessiner un polygone comme celui-ci. Je peux facilement dessiner. Vous pouvez également dessiner une autre forme. Disons que nous choisissons l'ellipse. Et si vous dessinez aussi, vous allez utiliser une ellipse comme celle-ci Et si vous voulez un cercle parfait, vous pouvez maintenir la touche du manche enfoncée. Cela devient donc très facilement un cercle parfait. Maintenant, voici comment insérer différentes formes ou dessiner n'importe quelle forme dans le canevas. Désormais, chaque fois que vous sélectionnez l'une des formes des éléments que vous venez d' importer ou d'insérer, vous pouvez voir ses propriétés apparaître ici. Par exemple, la position X, tu peux venir ici et tu peux jouer avec la position dans le X. Et dans le sens Y, tu peux les faire varier directement comme ça. Et vous pouvez modifier la largeur et hauteur si vous le souhaitez, même si elles sont interconnectées, afin qu'elles augmentent ou diminuent de la même manière. Si vous souhaitez qu'ils augmentent ou diminuent de différentes manières, vous devez supprimer ce lien Donc, dans ce cas, vous pouvez augmenter la largeur. D'accord, vous pouvez voir qu'il peut maintenant augmenter ou diminuer la largeur tout seul sans affecter la hauteur. Vous pouvez le voir dès maintenant ou vous pouvez augmenter la hauteur sans affecter la largeur. Mais je préfère toujours qu'il soit lié afin que nous puissions avoir une augmentation ou une diminution uniforme Laissez-moi donc le faire pour avoir un carré parfait. Autre chose, tout en sélectionnant la forme, vous avez la possibilité de la faire pivoter, vous pouvez la faire pivoter selon l'angle de votre choix si cela vous intéresse. Hein ? Laissez-moi le faire aussi, et ensuite vous pourrez jouer avec le rayon d'angle. À l'heure actuelle, c'est pointu. Si vous souhaitez réduire, augmenter ou apporter une certaine forme de courbe au rayon du coin. Vous pouvez voir maintenant que vous avez ajouté une certaine forme de courbe au coin. Sinon, si vous souhaitez ajouter la même courbe de trajectoire au rayon d'angle, si vous sélectionnez le navire, vous pouvez voir ces points. Si vous sélectionnez l'un d'entre eux, sélectionnez-le, cliquez et faites glisser, et vous pouvez également ajouter manuellement le rayon d'angle. En conséquence, vous pouvez augmenter ou diminuer. Il s'agit d'une autre façon d' ajouter le rayon d'angle. OK, donc c'est ça. Ici, vous avez l'option de champ. Vous pouvez y ajouter différents types de coloration de champ. Vous pouvez cliquer et sélectionner la couleur de votre choix. Vous êtes libre de naviguer et de choisir une très belle couleur pour vous-même. Il s'agit d'une couleur unie. Si vous voulez un dégradé de couleur, vous pouvez toujours cliquer dessus, et maintenant vous pouvez voir que vous avez un dégradé de couleur. Lorsque vous cliquez dessus, vous pouvez ajouter le dégradé depuis ce côté. Vous pouvez utiliser cette fonction pour contrôler l'emplacement du dégradé. OK, vous pouvez donc augmenter ou diminuer l'emplacement du dégradé pour que vous puissiez voir. Et ici, vous pouvez également en changer la couleur. Si vous avez une autre couleur, si vous voulez une autre couleur, vous pouvez également choisir et vous pouvez la voir changer en conséquence. Donc, ici en bas, vous pouvez ajouter un trait, vous pouvez appuyer sur ce côté de l'intrigue. Pour ajouter un trait à cela, vous pouvez voir si l'ajout d'un trait peut le placer à l'intérieur, à l'extérieur ou au centre. heure actuelle, faisons-le dans l' épaisseur du trait. heure actuelle, il y en a un, moins bosselé jusqu'à 30, et vous pouvez voir la moitié à 30, et vous pouvez cliquer dessus pour changer la coloration du trait Par exemple, choisissons quelque chose comme le blanc, un type de couleur blanche. Comme vous pouvez le voir, à l'heure actuelle, notre trait est blanc. Et dans chaque cas, dans chacune de ces propriétés, vous pouvez les activer ou les désactiver à partir d'ici, la coloration et le trait. Vous pouvez les activer ou les désactiver en utilisant cette option, et vous pouvez également les supprimer en utilisant les signes négatifs, comme nous l'avons expliqué précédemment. Ensuite, vous avez d'autres effets. Vous pouvez cliquer pour ajouter l'effet d'ombre projetée. Vous pouvez ajouter une ombre tombante, vous pouvez ajouter une ombre intérieure, vous pouvez ajouter un coup de couche ou un coup de sac. Vous pouvez ajouter n'importe lequel d'entre eux. Mais pour l'instant, passons à Drop Shadow. D'accord ? Ensuite, vous pouvez exporter ou, si cela vous intéresse, ce que nous aborderons dans un cours ultérieur. Maintenant, nous avons beaucoup ajouté à cette propriété à cette forme. Si vous souhaitez ajouter la même chose ou une propriété similaire à celui-ci, il existe un moyen plus simple de le faire dans Figma La première chose, c'est que vous pouvez atteindre le sommet. Lorsque vous sélectionnez cette forme, vous pouvez revenir en haut et sélectionner ici. Vous pouvez venir pour modifier et vous pouvez descendre jusqu' en bas et copier des propriétés ici, et vous pouvez sélectionner cela, vous pouvez revenir en arrière, puis revenir en arrière puis revenir pour modifier et vous rendre aux propriétés antiparasitaires. Par ici. Vous pouvez le faire avec la commande d'option C, pouvez coller les propriétés directement, vous pouvez voir la commande d'option V ou commande d' option C pour copier une commande d' option V pour coller. Et à l'heure actuelle, vous pouvez voir que vous avez ajouté ces propriétés. Vous avez copié ces propriétés dans cette propriété sans avoir à les recolorer, puis ajouter certaines des fonctionnalités que vous avez ajoutées Dans chaque cas, dans chaque forme, lorsque vous double-cliquez sur la sève, vous y avez accès. Cela signifie que vous avez accès à la forme. Tu peux faire beaucoup de choses. Par exemple, vous pouvez en modifier la forme en accédant simplement aux sites. Vous pouvez cliquer dessus et vous pouvez étendre directement comme ceci. Vous pouvez également venir ici, cliquer dessus, l'étendre et faire une autre forme si cela vous intéresse. Vous pouvez le voir, vous pouvez simplement le modifier en cliquant, vous étendez ou modifiez la forme. Et si vous le souhaitez, vous pouvez choisir d'en ajouter un autre, pouvez simplement le sélectionner et vous pouvez jouer avec. Alors laissez-moi le faire, mais juste pour vous montrer que cela vous donne un grand contrôle sur ce qui se passe ici. Si vous souhaitez modifier la couleur du champ, vous pouvez voir si vous le souhaitez afin de pouvoir changer la couleur du champ, de le sélectionner, puis le changer en rouge Donc je pense que c'est bon. Et tu peux cliquer dessus. Et si vous voulez changer la couleur du trait, vous pouvez également cliquer, puis changer la couleur du trait, peut-être en bleu ou bleu. Et vous pouvez voir dès maintenant qu'une fois que vous entendez une fuite, vous pouvez avoir cette couleur. Donc, en fonction de ce que vous voulez changer. Mais si vous double-cliquez sur l'une des feuilles, vous pouvez accéder à cette feuille et vous pouvez jouer avec elle très facilement Je pense donc que cela conclut ce cours sur la façon d'ajouter des feuilles, de jouer avec leurs propriétés et de les personnaliser en conséquence. J'espère donc que vous avez apprécié cette vidéo. Merci de votre attention, et j'ai hâte de vous voir au prochain cours, non ? 12. Les outils du stylo et du crayon: Dans ce cours, nous allons apprendre à utiliser l' outil stylo et crayon de Figma Maintenant, pour commencer, vous pouvez aller en haut ici, les icônes du haut ici, et vous pouvez voir un stylo et un crayon. Lorsque vous cliquez sur cette liste déroulante, vous pouvez voir un stylo et un crayon, que vous pouvez déclencher à l'aide la commande avec la lettre P sur votre clavier ou en appuyant sur Shift P pour activer l'outil crayon. Ainsi, quel que soit celui sur lequel vous allez travailler, vous pouvez facilement le déclencher à l' aide des touches de raccourci. Maintenant, commençons par le stylo en cliquant simplement sur la lettre P, ou nous pouvons simplement cliquer sur P, et vous êtes dans l'outil stylo ici. Vous pouvez donc continuer à écrire et à créer ce que vous voulez. Tu peux juste y aller. Et comme vous le remarquez, si vous vous déplacez librement, vous êtes libre de vous déplacer dans n'importe quel angle de votre choix. Mais lorsque vous maintenez la touche Shift enfoncée, elle passe peut-être à 45, 90 degrés, 45 ou 90 degrés comme ça. Cela permet de prendre des photos très facilement dans le cadre de ces fonctionnalités. Disons que nous allons avoir environ 45 degrés, je clique ici, puis nous maintenons toujours le même décalage, vous pouvez voir que cela me dit automatiquement que je suis à un point où les deux sont égaux, donc vous pouvez également cliquer, puis probablement nous pouvons passer ici, et jusqu'à ce que vous arriviez à ce point, cela vous montre maintenant que vous êtes au même point et emplacement. Vous pouvez simplement cliquer dessus et enfin fermer si vous le souhaitez. Nous pouvons déménager ici. Et faites un autre clic et enfin jusqu'à ce point. Mais je veux qu'il soit couvert ici et qu'il ne fasse que 45 degrés. Je voulais couvrir alors. Il se peut que je doive relâcher le shift, puis je pourrai simplement cliquer et couvrir cette question. Alors maintenant, cela devient parfait, selon ce que je veux. Je peux toujours appuyer sur la touche commande pour m'en sortir. Et maintenant, j'ai dessiné cette forme avec ma propre épingle. Lorsque vous sélectionnez une forme particulière que vous avez dessinée, vous verrez également ses propriétés ici. Par défaut, il ajoute un trait à cela. Et vous pouvez voir le trait. Lorsque vous arrivez ici, vous cliquez et étendez et vous pouvez voir que le trait existe. Vous pouvez voir qu'il existe. Et si vous voulez changer de couleur, vous pouvez également changer la couleur comme nous l'avons fait dans l'autre classe, vous pouvez la changer comme ça. Maintenant, une autre chose que vous pouvez faire avec la forme que vous venez créer est de toujours double-cliquer à l'intérieur. Vous pouvez toujours double-cliquer à l'intérieur pour être à l'intérieur de la forme, et vous pouvez apporter quelques modifications Par exemple, vous souhaiterez peut-être ajouter des points pour la modification. Ou vous souhaiterez peut-être en modifier la forme. Il vous suffit de cliquer pour modifier la forme. Il se peut que nous cliquions. Juste comme ça, vous pouvez voir que vous pouvez apporter des modifications à la forme. Vous pouvez l'étendre et le modifier comme vous le souhaitez. Vous pouvez simplement jouer avec cela très facilement. Et si vous voulez en colorier certaines parties, par exemple, vous devez y ajouter une touche d'originalité. Donc, pendant que vous êtes encore en mode édition, vous pouvez venir ici et cliquer sur cette poche à stylo. Et une fois que vous avez cliqué dessus, vous pouvez colorier les sections en conséquence. Vous pouvez maintenant colorier cette section en appuyant simplement dessus et par défaut, la couleur par défaut à l'intérieur est supprimée. Et tu peux venir ici, il suffit de cliquer et tu peux changer la coloration maintenant. Vous pouvez peut-être le remplacer par ce rouge et par une échappatoire. Et une fois que vous avez terminé, vous pouvez continuer et dire OK, et maintenant vous avez une forme que vous avez créée avec votre stylo et elle contient autant de détails. Maintenant, si vous voulez utiliser l'outil crayon, vous pouvez toujours utiliser le Shift P. Déplacez une lettre P pour le déclencher, et vous pouvez venir ici et écrire ce que vous voulez. D'accord ? Vous pouvez donc venir et vous pouvez voir par défaut que la figma vous aidera à vous déplacer dans tout ce que vous avez Vous pouvez le voir maintenant et il suffit de taper quelque chose. OK, donc tu peux continuer et taper ce que tu veux ici. Vous pouvez donc voir en détail ce que vous avez écrit dans cette couche sur la façon d' organiser toutes ces couches, afin que vous puissiez comprendre ce que tout cela signifie. Mais pour l'instant, vous pouvez l'utiliser et vous pouvez le créer. Vous pouvez écrire comme bon vous semble dans ce vaisseau ou n'importe où. Et une fois que vous avez terminé, vous pouvez toujours vous échapper pour vous en sortir, et vous pouvez voir que vous pouvez sélectionner n'importe laquelle des fonctionnalités que vous avez écrites. Et vous pouvez également apporter des modifications si cela vous intéresse. Mais pour le moment, je n'en veux aucune, donc je peux toutes les sélectionner et les supprimer si je veux les supprimer. Mais voici les bases de l' utilisation de l'outil stylo et de l'outil crayon de votre toile pour écrire ou dessiner ce que vous voulez. J'espère que cette vidéo vous plaira. Merci de votre attention, et j'ai hâte de vous voir au prochain cours. 13. Opérations booléennes + signature: Alors, bon retour. Dans ce cours, nous allons apprendre quelques notions de base sur les opérations booléennes OK ? Ainsi, dans les opérations booléennes, nous allons apprendre à combiner une forme avec une autre, et nous allons probablement apprendre parfois à séparer une forme d'une Nous allons donc recommencer à zéro J'ai tout supprimé Je vais donc simplement ajouter deux formes avec lesquelles nous pouvons le démontrer. Supposons que nous arrivions à l'option formes, fonction de sept formes ici et sélectionnions quelque chose comme un rectangle et dessinions quelque chose comme un rectangle. Et si nous voulons avoir le même bord circulaire autour de ce bord, nous pouvons toujours venir ici, faire glisser le pointeur et nous avons une forme circulaire comme celle-ci Nous déciderons de changer la couleur du champ pour quelque chose comme ça, c'est bien. Essayons d'ajouter une autre forme. Ajoutons ceci. Nous dessinons le cercle comme nous l'avons montré précédemment, vous pouvez maintenir la touche du manche enfoncée. Et vous pouvez dessiner un cercle parfait comme ça, non ? Donc, changeons également le champ de ce champ en quelque chose comme ça, il suffit de cliquer dessus. Maintenant, dans les opérations booléennes, vous devez généralement combiner deux éléments Ainsi, lorsque nous sélectionnons le médicament et que nous sélectionnons ces deux formes, vous remarquerez que cette icône apparaît. C'est ce qu'on appelle des groupes booléens. Dans celui-ci, vous allez apprendre à regrouper ces éléments sous différentes formes. Ainsi, lorsque vous cliquez sur ce menu déroulant, vous verrez que vous pouvez avoir une sélection d'union, une sélection soustractions, une sélection intersections et une sélection d'exclusion. Ensuite, nous avons aplani la sélection OK ? Nous allons donc découvrir tout cela à la fin de ce cours. Commençons maintenant par le début. Sélectionnons notre cercle et faisons-le simplement glisser vers celui-ci. OK. Nous allons donc simplement insérer ceci là-dedans. Maintenant, lorsque vous les sélectionnez toutes en les sélectionnant toutes comme ça, et que vous pouvez accéder aux groupes de lingots, vous pouvez effectuer une sélection syndicale, qui combine cette fonctionnalité et cette fonctionnalité ensemble, n'est-ce pas Ceci et cela sont maintenant combinés. Dans tous les cas, si vous voulez avoir accès à chacune d'elles, vous pouvez double-cliquer sur la forme, et vous pouvez voir maintenant que vous avez deux formes, mais elles sont combinées à l'aide des groupes booléens Et vous êtes libre de les déplacer, de changer et échanger leur position si c'est ce que vous voulez. C'est donc combiné, un lingot. Il vous suffit donc de combiner les deux formes ensemble. Maintenant, tu peux le faire. Supposons que nous fassions cela jusqu'à présent , puis que nous les faisions glisser et que nous les déplaçons en acier, puis que nous puissions sélectionner. Et maintenant, nous voulons soustraire la sélection. Nous soustrayons donc la sélection. Cela permet simplement de soustraire cette partie que la section combinée a, je soustrais de cette partie de celle-ci Hein ? Alors, comment le confirmer ? Nous pouvons double-cliquer ici, et vous pouvez voir que ce cercle est toujours là, n'est-ce pas ? Il est toujours là, mais il a été soustrait, et vous pouvez modifier la soustraction, l'arrangement ou le comportement entre les deux en vous déplaçant simplement, Mais pour le moment, la valeur par défaut est qu'elle a été soustraite et que vous pouvez étendre ou modifier cette fonctionnalité comme vous le souhaitez Mais c'est maintenant une seule chose qui a été soustraite. Cette forme en avait été soustraite. Maintenant, une autre chose que nous pouvons confirmer est faisons-le également. Puisque nous avons vu la soustraction. Revenons encore en arrière en sélectionnant les deux, on peut revenir à l'opération de Boulan, on peut dire sélection d'intersections. Maintenant que nous sélectionnons, cela nous donne le point d'intersection entre les sélections. C'est donc le point d' intersection entre les deux. Faisons donc en sorte que vous puissiez comprendre ce que j'essaie de dire. OK, donc c'est juste l'intersection que cela nous a donnée entre les deux. est justement cette intersection que cela nous a donné. Vous avez donc compris le message. C'est la sélection de l'intersection. Nous pouvons sélectionner à nouveau, et nous pouvons faire la dernière, qui est d'exclure la sélection. Et ce que cela va faire, c'est le point d'intersection entre ces deux formes qui sera exclu. Essayons donc ça. Et vous pouvez voir que le point d' intersection est désormais exclu. Vous pouvez également vous déplacer. Et lorsque vous double-cliquez, vous pouvez également vous déplacer pour modifier l'intersection. Mais ce qui vous indique, c'est qu'à tout moment, ces deux formes se croisent, c'est cette section qui va être supprimée pour vous Vous êtes libre de jouer avec cela, comme vous le souhaitez en fonction de ce que vous essayez de créer. Maintenant, la dernière fonctionnalité, qui est la sélection aplatie, quelle que soit l' opération booléenne que vous avez sélectionnée ici et que vous avez la résolution, si vous faites une sélection plate, elle va maintenant la convertir en une forme unique Vous n'avez donc plus qu'une seule forme qui se comporte avec l' opération booléenne que vous venez En gros, voici les bases sur la façon d'utiliser joueur d'opérations booléennes avec navires et d'ajouter différentes choses, Vous pouvez donc les essayer comme vous le souhaitez, en fonction de ce que vous essayez de créer et de votre cible, vous pouvez simplement effectuer une soustraction, une addition ou une intersection Et puis à la fin de tout cela, vous pouvez tout convertir en un seul vaisseau. Maintenant, avant de terminer ce cours, je voudrais vous donner une tâche simple que vous pouvez essayer vous-même, juste pour démontrer l'utilisation de la Figma pour créer les opérations sur les bulons je voudrais vous donner une tâche simple que vous pouvez essayer vous-même, juste pour démontrer l'utilisation de la Figma pour créer les opérations sur les bulons Je veux que tu le crées. Permettez-moi de me déplacer sur la lettre H. Donc ce vaisseau. Je veux que tu crées ce vaisseau avec l'opération booléenne Il s'agit simplement d'un triangle surmonté de cercles, et nous utilisons les opérations booléennes pour le créer Essayez donc de créer quelque chose comme ça afin que nous puissions voir si vous n' en avez pas l' occasion, nous allons le résoudre lors du prochain cours. Mais juste pour mettre la main sur le système, essayer faire ce que nous faisons et essayer d'apprendre les bases, je veux que vous essayiez ceci, mais nous le résoudrons dans le prochain cours de toute façon. OK ? J'espère donc que cette vidéo vous plaira. Merci de votre attention, et j'ai hâte de vous voir au prochain cours. Au revoir. 14. Solution à l'inscription: Donc, dans le dernier cours, nous vous donnons une tâche simple sur ce que vous diriez d'essayer de créer quelque chose comme cette forme simple avec les opérations booléennes Donc, dans cette classe, nous allons simplement le reproduire pour voir comment nous pouvons le faire rapidement en utilisant les opérations booléennes Donc, pour commencer, il vous suffit de passer aux formes ici et de cliquer sur n'importe quelle forme. À l'heure actuelle, nous pouvons voir que celui-ci est un rectangle. C'est un polygone, nous pouvons donc simplement continuer, cliquer sur un polygone, et vous pouvez simplement cliquer et faire glisser et nous pouvons maintenant voir que nous avons créé un Nous pouvons donc le sélectionner tout en sélectionnant le polygone, nous pouvons toujours revenir et changer le champ en n'importe quelle couleur, pouvons le changer en n'importe quelle couleur juste pour différencier ce que nous avons Nous allons donc sélectionner quelque chose comme ceci. Et puis ce sont de petits cercles que nous avons. Donc, pour créer ces cercles, nous pouvons simplement passer ici à ps, cliquer et maintenir la touche Shift enfoncée pour créer le cercle, n'est-ce pas ? Vous pouvez voir que nous venons de créer un cercle, et vous pouvez également remplacer le champ par n'importe quelle couleur qui correspond à celui-ci. Alors allons-y avec quelque chose comme le rouge. Ouais. Donc rouge pour différencier et cliquer dessus. Nous pouvons maintenant le sélectionner et copier et coller en utilisant Control C, ControV control C et Control V, puis nous pouvons voir que nous les avons créés trois fois Nous faisons trois copies, une, deux, trois, non ? Donc, dans chaque cas, nous pouvons faire glisser chacun d'eux et le mettre en position. Très facilement, quelque chose comme ça, très facilement, quelque chose comme ça, et très facilement, quelque chose comme ça, non ? Je pense donc qu'il ne nous en faut que trois pour cela, non ? Nous pouvons donc vendre comme ça et supprimer. Nous n'en avons donc pas besoin. Donc, une fois ces trois formes alignées ou combinées ensemble, nous allons maintenant appliquer les opérations booléennes comme vous l'avez montré dans le cours précédent . Alors, comment faire ? Pour ce faire, nous pouvons sélectionner les trois fonctionnalités, les trois formes, puis nous pouvons passer au groupe Bullion ici, puis nous pouvons passer à la sélection des sous-pistes Nous pouvons donc simplement cliquer sur soustraire la sélection et voilà, votre solution est prête Tout est créé même manière que nous l'avons fait. Ce n'est donc que la solution de base à notre devoir, petit devoir que nous venons de donner lors du cours précédent. Allez-y, essayez de voir comment vous pouvez utiliser la plupart de ces fonctionnalités, comment vous pouvez déplacer les choses et comment vous pouvez continuer à planifier les choses ensemble. J'espère que cette vidéo vous plaira. Merci de votre attention, et j'ai hâte de vous voir au prochain cours. 15. Utiliser les outils d'alignement: Bien, dans ce cours, nous allons apprendre les bases de l' alignement dans Figma OK ? J'ai donc ces formes sur lesquelles nous avons travaillé. Je viens d'en ajouter quelques-unes juste pour démontrer certaines applications. OK ? Supposons donc que ces formes soient dispersées et que nous allons apprendre à aligner l' alignement des formes dans un cadre particulier. Vous pouvez donc voir que je les ai tous encadrés, et celui-ci est en train de sortir du cadre. Celui-ci est également en train de sortir du cadre. Alors, comment pouvons-nous nous assurer qu'ils sont alignés à l'aide de cette fonction d'alignement ? Ainsi, la première chose que vous devez faire chaque fois que vous souhaitez commencer l' alignement est de vous assurer de sélectionner tous les détails ou tous les éléments que vous souhaitez aligner. Dans ce cas, j'ai sélectionné tous ces vaisseaux, et je peux venir ici Vous avez différents types d'options d'alignement. Par exemple, vous pouvez aligner à gauche, et tout sera aligné à gauche, ou vous pouvez aligner le centre ou vous pouvez aligner à droite. Alors laissez-moi le faire, et tout sera aligné conformément à cette case. Attention, c'est conforme à cette boîte. Donc au centre gauche, il va juste être aligné à gauche. Et pour aligner le centre, vous pouvez simplement cliquer sur aligner le centre, et tout sera aligné au centre comme ceci. Permettez-moi donc de le faire également avec ControZ et vous pouvez aligner correctement et il sera aligné correctement comme ça D'accord, vous pouvez donc voir que tout est maintenant bien aligné. Maintenant, une autre chose que vous pouvez faire est cet alignement vertical. Vous pouvez également effectuer un alignement horizontal. Vous pouvez donc aligner le haut vers le haut et tout sera maintenant aligné vers le haut conformément à cette case, et vous pouvez également aligner le centre. Utilisation de la fonction verticale. Vous pouvez voir que tout est maintenant aligné, et vous pouvez également aligner le bas , comme nous l'avons fait sur le panneau vertical. Maintenant, un autre élément clé à noter est qu'en plus de cet alignement horizontal et vertical très basique, vous avez les points. Vous avez plus d'options lorsque vous cliquez dessus, vous avez la marée vous avez l'espacement vertical distribué, puis vous avez l'espacement horizontal distribué Vous pouvez le faire avec toutes les touches de raccourci. Touches de raccourci, vous pouvez les utiliser. Le rangement permet de s'assurer que les fonctionnalités sont activées à égale distance dans le sens vertical Vous pouvez donc voir avec cette ligne rose du panneau rose qu'elle a été espacée dans le sens vertical Vous pouvez donc également modifier cela si vous intéresse lorsque vous survolez la couleur rose et que votre curseur cela vous intéresse lorsque vous survolez la couleur rose et que votre curseur se transforme en signe vertical, vous pouvez cliquer et faire glisser voir la couleur rose apparaître directement, et vous pouvez augmenter ou diminuer le signe comme vous le souhaitez Le rythme entre les formes dans le sens vertical, non ? Et vous pouvez également le faire à partir d'ici. Vous pouvez le faire de n' importe où, n'est-ce pas ? Alors laisse-moi le faire aussi. Et puis vous pouvez faire l'inverse dans l'espacement vertical distribué Vous pouvez voir qu'ils ont été répartis manière égale dans l'espacement vertical, et vous pouvez également faire de même dans l' espacement horizontal Ils ont été répartis de manière égale dans l'espacement horizontal Ceci conclut ce cours sur les bases de l'alignement, façon d'aligner la gauche, la droite et le centre et au sein des navires que nous venons d'ajouter. Alors à la prochaine fois, merci d'avoir regardé, et j'ai hâte de vous voir au prochain cours. Au revoir. 16. Ajouter et personnaliser des buttons: Dans ce cours, nous allons apprendre à créer des boutons et même à les rendre réactifs. Maintenant, pour créer des boutons, commençons par ajouter quelque chose comme un cadre. Vous pouvez donc accéder à la section du cadre ici, que vous pouvez également déclencher avec la lettre F. Vous pouvez simplement cliquer et sélectionner n'importe qui. Disons que nous optons pour le F 14, F 13 mini, celui-ci. Donc, pour ajouter un bouton, vous pouvez accéder directement aux formes ici. Vous pouvez cliquer et sélectionner un rectangle. Vous pouvez simplement venir ici et cliquer et faire glisser. C'est donc maintenant notre bouton. Mais comme vous le savez, la plupart des boutons ont des rouges circulaires sur les côtés, nous pouvons donc ajouter des rouges circulaires. En arrivant à cette fin, nous pouvons simplement venir ici jusqu'à ce que votre curseur se transforme en ce signe horizontal. Vous pouvez cliquer et créer la nature circulaire. Vous pouvez donc voir que nous avons les bords circulaires. Vous pouvez donc en modifier la coloration. Tu peux juste venir ici. Remplaçons-le en quelque chose comme le bleu. Et nous pouvons sélectionner cette couleur et cliquer dessus, et maintenant nous avons créé notre bouton. Ensuite, nous pouvons ajouter un texte sur le bouton. Nous pouvons le faire en accédant à la lettre T ici ou à la fonction de texte, ou vous pouvez appuyer sur la lettre T votre clavier pour activer ou déclencher la fonction de texte. Maintenant, nous pouvons cliquer ici et nous pouvons simplement écrire n'importe quoi. OK, commencez et nous pouvons sélectionner. Nous pouvons jouer avec le dimensionnement ici. Faisons en sorte que ce soit environ 40, non ? Nous pouvons donc trouver une issue, et si vous le souhaitez, vous pouvez les aligner. Vous pouvez donc le sélectionner et le sélectionner en maintenant la touche Shift enfoncée ou vous pouvez simplement sélectionner les deux ensemble. Et vous pouvez simplement aller de l'avant et venir ici et voir aligner le centre et le centre d' alignement également. Il est donc maintenant parfaitement aligné sur votre bouton. Le texte est désormais parfaitement aligné sur votre bouton. Maintenant, si vous remarquez que ce n'est pas réactif, ce que nous voulons dire par « non réactif », c'est si nous sélectionnons cette et que nous essayons de changer le menu de démarrage en quelque chose comme, essayons d'en créer une copie, par exemple. Sélectionnez et faites « venir » et « D », vous êtes marqué Pour créer un doublon, il vous suffit double-cliquer et de dire « Commencez ». Vous pouvez voir pour le moment qu'il ne répond pas dans la mesure où, à mesure que la longueur du texte augmente, le bouton reste là où il se trouve. Donc, pour créer un bouton étendu ou réactif, il vous suffit de sélectionner les deux, le bouton et le texte, de cliquer avec le bouton droit de la souris et de dire sélection de groupe, puis vous pouvez toujours cliquer avec le bouton droit de la souris. Vous pouvez utiliser le shift A de votre clavier pour le rendre réactif. Cela signifie que si je double-clique dessus, et qu'au lieu de démarrer, j'essaie de le faire démarrer, regardez ce qui se passe. Vous pouvez également voir le bouton s'étendre lorsque j' essaie d'étendre mon haut droit. OK ? Le bouton devient donc maintenant réactif en fonction de ce que j' ai écrit dans le bouton. OK. Donc, si je décide de changer cela également, et de simplement appeler ce menu, il se transforme rapidement en menu. Une autre chose que je veux vous montrer, c'est que tout en sélectionnant le bouton que nous venons de sélectionner. Une chose à laquelle vous devez faire attention est cette mise en page automatique. Maintenant, pour le moment, vous voyez qu'il s'agit d'une disposition horizontale sélectionnée. Il a sélectionné la disposition horizontale. C'est parce que tout ce que nous avons ici est aligné horizontalement. Tout est horizontal. Si nous ajoutons quelque chose, ce sera à l'horizontale. L'incrémentation et la décrémentation de la taille, la nature réactive, sont liées à l'horizontale car elle est détectée automatiquement en fonction du contenu dont elle dispose détectée automatiquement en fonction du contenu dont elle Essayons de voir comment il va détecter automatiquement que c'est vertical. Créons donc un autre bouton simple, en gros. Supposons que nous ayons ce bouton comme celui-ci, et que nous arrivions rapidement ici pour ajuster les coins latéraux et les coins latéraux et changer le champ en rouge. Et maintenant, nous voulons ajouter quelques éléments , disons un petit cercle. Nous le dessinons simplement et nous changeons la couleur pour quelque chose comme le bleu. Hein ? Donc quelque chose comme ça, et on augmente un peu la taille, non ? Disons que nous augmentons la taille. Maintenant, ce que nous pouvons faire, c'est dupliquer cela peut-être encore quelques fois. Peut-être que nous en avons trois. Nous pouvons donc simplement glisser-déposer, glisser-déposer, puis glisser-déposer. Nous pouvons donc tout sélectionner comme nous faisions auparavant et nous arrivons à l'alignement. Nous pouvons tout aligner au centre. Tout est donc correctement aligné à présent. Ainsi, tout en continuant à tout sélectionner, nous pouvons effectuer le Shift A pour assurer que tout est désormais réactif. Vous pouvez donc voir que Mor fait le shift A, la disposition automatique a été remplacée par la disposition verticale, B il en a détecté l' incrément Supposons donc que nous ne puissions pas dupliquer cela. Supposons donc que nous en ayons ajouté que nous voulions ajouter quelque chose à cela. Vous pouvez accéder au cercle, et disons que nous allons créer un autre cercle , mais cette fois-ci de cette couleur. Donc, si vous voulez l'ajouter à cette fonctionnalité, en l'alignant, il va s'ajuster et répondre à l'ajout et ce sera dans le sens vertical. Venons donc ici et vous pouvez voir qu'avec cette ligne bleue, elle indique simplement la position dans laquelle se trouvera notre cercle Donc, une fois que nous sommes partis, nous sortons, vous pouvez voir qu'il a été ajouté à notre cercle, n'est-ce pas ? Vous pouvez donc le sélectionner et le déplacer vers le haut pour que nous puissions tout voir. Maintenant, c'est le devoir de la publicité de la rendre réactive à la verticale. Vous pouvez donc le faire comme je le souhaite. Et vous pouvez double-cliquer dessus et supprimer. Et le même bouton va répondre à ce que vous avez ajouté. Donc, dans ce cas, c'est très utile si vous souhaitez y ajouter des icônes. Par exemple, vous pouvez simplement le sélectionner et le déplacer, peut-être probablement ici. Et une fois que vous relâchez, vous pouvez voir le bouton vient de s' ajuster en conséquence. Changeons cette couleur pour qu'elle soit visible. Très bien, alors faisons-le blanc. Très bien, vous pouvez donc voir, commencez ici et cela devient maintenant réactif au fur et à mesure que nous l'avons ajouté, et celui-ci devient également réactif lorsque nous l'avons supprimé. Ceci conclut ce cours sur l' ajout de boutons et leur adaptation, à fois à l'horizontale et à la verticale à l'aide de la mise en page automatique pour. J'espère que cette vidéo vous plaira. Merci de votre attention, et j'ai hâte de vous voir au prochain cours, 17. Ajouter et personnaliser des composants: Dans ce cours, nous allons découvrir les composants, comment ajouter des composants, comment créer des composants et les gérer dans Sigma Les composants sont donc un comportement spécifique que vous pouvez attribuer à groupe d' éléments pour lesquels vous pouvez avoir un comportement spécifique. Donc, en supposant que j'ai ce bouton de démarrage et que je prévois de créer dix ou 15 images supplémentaires, et que je souhaite que ce bouton de démarrage soit inclus dans toutes les images. Maintenant, normalement, si je dois inclure dans différents cadres, par exemple, disons que nous sélectionnons ce cadre et que nous le dupliquons Supposons que nous ayons ce nouveau cadre et que nous voulions que ce menu à onglets soit inclus dans tout cela dans tous les cadres respectifs que je souhaite avoir. Ce qui se passait auparavant, c'est que nous pouvions le faire de différentes manières. Nous pouvons le copier et nous pouvons accéder à ce cadre et le coller. Et ce qui se passe maintenant c'est que si nous en modifiions l'une des fonctionnalités, cela n'affectera pas cela. C'est bon. Donc, si vous décidez de changer la coloration de celui-ci, cela n'affectera pas celui-ci en particulier. Donc, dans les cas où j'ai affaire plus de dix à 15 images à cinq avec ce menu de démarrage inclus, il peut devenir très difficile pour moi d'apporter des modifications. Si j'en change une en particulier et que je veux que cela ait un effet sur toutes les autres, cela devient très, très difficile pour moi de le faire. Alors, comment puis-je le rendre plus facile ? Vous pouvez faciliter les choses en créant composants à partir de la série d'éléments que vous avez, ou de ce bouton en particulier, par exemple, alors laissez-moi faire ceci, ou laissez-moi le sélectionner et le supprimer. Et ce que je peux faire pour créer un composant c'est sélectionner ce cadre en particulier, que vous pouvez voir ici, le cadre 1. Et en le sélectionnant, vous pouvez vous hisser au sommet de ce top masculin. Vous pouvez voir créer des composants à partir de cela. Et vous pouvez le faire avec la touche option et la touche commande, puis la touche. Cela va vous aider à créer des composants. Maintenant, nous pouvons cliquer dessus et cela devient automatiquement un composant. Vous pouvez voir que les bords viennent de prendre cette couleur rose, et vous pouvez également voir à partir de là que cela devient maintenant la couleur de ces changements, et qu'il porte ce signe en losange, qu'il s'agit désormais d'un composant. C'est donc un signe qu'il s'agit maintenant d'un composant qui est une combinaison de tout cela et qu'il possède la même propriété unique. Permettez-moi de vous montrer ce que vous pouvez également faire pour gérer ce composant. Appelons ça, renommons-le pour en faire le bouton principal. Vous pouvez donc appeler ce bouton principal, non ? Et ici, n' entrez pas. Essayons donc de le dupliquer pour que je puisse vous montrer quelque chose. Même le dupliquer seul ne suffit pas. Vous pouvez voir si nous l'avons dupliqué. Je vais probablement vouloir avoir cette copie dupliquée. Vous pouvez voir qu'il s'agit d'un composant dupliqué. C'est ici, là-bas. Vous pouvez voir que celui-ci a les deux signes différents. Il s'agit d'un composant d'encens et celui-ci est dupliqué, c'est le composant principal, celui-ci, c'est l'encens, tout comme une copie du Maintenant, ce qui se passe, c'est si j'essaie de copier ce composant d'encens et que j'arrive sur ce cadre et que je le colle Donc, si je change quoi que ce soit ici, cela n' affectera pas toujours mon composant principal, juste pour vous montrer qu'une copie du composant ne peut pas remplir la fonction qu'un composant principal peut remplir. Essayons donc de le faire. Changeons cela, et vous ne verrez rien, aucun effet n'est affiché sur le composant principal. Même s'il s'agit d'un composant d' encens, qui est une copie tout comme une copie du composant principal OK, donc si j'en fais une copie. Donc, si je le fais, supprimons ceci, et si j'en fais une copie , peut-être, par exemple, je le sélectionne, je le duplique et je le déplace vers celui-ci. OK. Et j' ai probablement un autre cadre. Je le duplique également, je duplique ce formulaire donc j' ai trois cadres avec celui-ci. Donc, chaque fois que je change ce soit, rien ne se passera. Mais quand je reviens au composant principal, celui-ci, et que je change quoi que ce soit, cela affectera le reste du composant. Regardez ce qui se passe. Donc, si je reviens au composant principal, puis que je change cette couleur pour probablement quelque chose comme ce rouge et vous pouvez voir, tout change maintenant et cela prend l'effet que je viens d'insérer dans je viens d'insérer le composant principal, qui est le composant principal. Et si je décide de modifier le rayon du cercle extérieur, si je le change, cela affectera de la même manière l'ensemble du composant, le corps entier que j'ai dans tous les différents fms Supposons que je réduise et que j' augmente ce rayon d'angle, cela aura toujours une incidence sur le contraire. Vous pouvez voir que si je sélectionne et ajoute quelque chose ici, cela affectera les autres. Vous pouvez voir très facilement. Cela devient donc très facile pour vous de naviguer et de vous connecter entre les différents éléments au fur et à mesure que vous les avez dans les différents cadres, quel que soit le nombre de frats que vous possédez Ainsi, après avoir créé des composants, il devient très, très facile pour vous de naviguer entre eux. Maintenant, laissez-moi vous montrer comment vous pouvez ajouter composants très facilement à travers les différents éléments, compris les différents cadres. Vous pouvez également toujours accéder aux actifs ici, iPhones, et vous pourrez voir le composant principal que vous venez de créer Vous pouvez donc facilement le glisser-déposer ici. Vous pouvez facilement le glisser-déposer où vous le souhaitez . Et chaque fois que vous apportez des modifications à cela également, cela affecte le tout. Tu vois, très facilement. J'ai tout modifié. Les modifications apportées au composant principal affecteront certainement les autres. OK. En gros, voici comment créer des composants et les gérer dans Figma J'espère que cette vidéo vous plaira. Dans le prochain cours, nous allons examiner les variantes, ce que sont les variantes et comment les gérer dans Figma Alors à la prochaine fois, merci d'avoir regardé et j'ai hâte de vous voir au prochain cours. 18. Comment créer et gérer des variantes: Dans le dernier cours, nous avons expliqué comment ajouter des composants personnalisés. Et dans ce cours, nous allons apprendre à créer des variantes. Donc, dans le cas des composants, vous devez conserver la même propriété sur toutes les autres plateformes , sur tous les autres boutons que vous allez créer. Mais en revanche, vous êtes désormais libre d' en avoir une version différente, et lorsque vous souhaitez modifier l'une de ces versions, automatiquement, vous pouvez sélectionner la variante que vous souhaitez créer, et vous pouvez simplement la créer très facilement. Maintenant, permettez-moi de vous donner un exemple de ce dont je parle à ce sujet. Pour commencer, essayons d'ajuster quelque chose, ajustez-le. Permettez-moi donc de le supprimer parce que nous n'en avons pas besoin, et nous n'en avons pas non plus besoin pour le moment. Commençons par ajuster cela. le sélectionnant, nous pouvons accéder au panneau des propriétés ici. La première chose est, disons, que je souhaite en créer une variante. Vous pouvez voir en sélectionnant que vous avez les propriétés. Vous pouvez voir les propriétés, vous pouvez donc appuyer sur ce signe plus et vous avez les différentes propriétés. Vous pouvez voir créer de nouvelles propriétés. Vous avez une variante, vous avez des lingots, vous avez un échange d'instance et du texte Dans ce cas, nous allons créer une variante. Nous pouvons donc simplement cliquer sur la variante et nous pouvons voir ce que nous avons ici. Le nom est properties et la propriété est default. Je l'ai défini par défaut. La propriété est définie par défaut sous ce paramètre. Donc, ce que nous pouvons faire, c'est que c'est la variante principale, d'accord ? Il s'agit de sa propriété de nom et la propriété qu' elle possède est celle par défaut. Nous pouvons donc décider de le renommer, appeler la variante principale, et la propriété sera définie par défaut Nous pouvons le conserver par défaut. Mais ensuite, nous pouvons créer une variante à partir de cela en descendant simplement sur ce signe de tracé, et nous pouvons cliquer sur Ajouter une variante et nous avons cette deuxième variante. Maintenant, tout va être enfermé sous ce cadre en pointillés, un peu comme un tableau de bord. Également. Il est extensible Vous pouvez venir ici et vous pouvez cliquer et l' étendre si vous voulez l'étendre. C'est pourquoi nous disons que c'est un peu comme un tableau de bord. Alors maintenant, celui-ci, ce second, essayons de voir si nous pouvons modifier les propriétés du second. Très bien, disons que nous essayons de modifier cette composition, cette propriété, les propriétés de ce bouton en particulier Par exemple, nous pouvons décider de supprimer cette coloration, pouvons décider de supprimer la couleur, et probablement nous pouvons la rendre aussi lumineuse. Ensuite, nous pourrons décider de jouer avec cette bordure. Nous pouvons donc décider de jouer la bordure du trait en ajoutant simplement le trait et en l' étendant probablement jusqu'à ce que nos cinq, c'est parler, mais je pense que c'est bon. Nous pouvons donc double-cliquer sur ce texte, et nous pouvons également modifier les propriétés du texte, en particulier la couleur, en particulier la couleur du texte, le sélectionner et le rendre rouge. Et cette icône également que nous avons, sélectionnons-la et changeons la couleur pour probablement cette couleur rosée. Très bien, pour qu'on puisse voir. Maintenant, nous commençons par cette couleur du, donc nous pouvons l'appeler ainsi. Nous pouvons double-cliquer dessus et nous pouvons accéder aux propriétés. Maintenant, nous changeons la variante principale. Nous pouvons appeler cette variante deux, mais nous pouvons l'appeler. Appelons ce plan, par exemple, parce qu'il est différent du plan principal car celui-ci n'est que le plan. Hein ? Pour le moment, je veux vous montrer comment vous pouvez appliquer ces deux variantes ces boutons que vous avez répartis sur les deux cadres. Ainsi, lorsque vous sélectionnez le composant principal de ce bouton, vous pouvez voir les mêmes propriétés apparaître. Ainsi, lorsque vous sélectionnez ce bouton en particulier, vous pouvez le voir à partir du bouton principal. Oh, c'est le nom que nous avons donné au bouton principal. C'est ce qui apparaît parce que c'est une composante de tout cela. Il s'agit simplement d'une copie du composant principal. Vous pouvez voir que nous l' avons nommé pour figurer dans le bouton, et vous pouvez voir que les propriétés sont définies par défaut. Ainsi, lorsque vous cliquez sur ce menu déroulant, vous pouvez voir le bouton de contour, qui correspond à la variante. Donc, une fois que vous avez cliqué dessus, vous pouvez maintenant voir que votre bouton passe maintenant à cette variante. Cela devient donc vraiment très pratique dans les cas où vous n'avez pas à le recréer et où vous avez plusieurs images pour simplement utiliser différentes variantes Ainsi, lorsque vous tombez également sur ce point, si vous souhaitez le remplacer par l'autre, vous pouvez simplement sélectionner et voir la copie du plan. Ou si vous souhaitez revenir à cette variante principale, vous pouvez simplement sélectionner. Il y a quelques changements. Vous pouvez sélectionner, vous pouvez descendre et vous pouvez simplement dire « par défaut », et cela revient à la valeur principale. OK. C'est donc essentiellement ainsi qu'il faut ajouter une variante, créer une variante et la gérer de manière transversale. Maintenant, laissez-moi vous montrer un autre exemple qui est très, très important et que vous pouvez utiliser avec plaisir. Disons donc avec celui-ci. Disons avec cette variante, cette première. Je veux changer quelque chose. Par exemple, je donne celui-ci. Je lui donne un autre nom. Je l'appelle icône, et je dis que c'est vrai ici. Et je dis que c'est vrai. Je sélectionne celui-ci et je viens ici. Je lui donne également un nom d'icône. Mais cette fois-ci, je dis que c'est faux. OK. Donc c'est ce que j'essaie de faire. En sélectionnant celle-ci, je vais supprimer cette icône, celle-ci , ce qui signifie que celle-ci est sans icône, et celle-ci est avec une icône. Je viens de les définir. Donc, chaque fois que je clique dessus, c' est maintenant que le nom est devenu une icône, mais quatre. Et puis celui-ci a également changé de nom pour devenir une icône, mais c'est vrai. Alors maintenant, quand j' essaie de changer la faration, je sélectionne peut-être cela et j'arrive au bouton principal Vous pouvez voir maintenant que le nom est devenu une icône ou qu'il est associé à ce signe d' activation et de désactivation. Donc, si je gagne, cela ramènera cette variation. Et si je le désactive, l'icône disparaîtra , comme nous l'avons montré. OK, donc c'est très, très intéressant. Si je le sélectionne également et que je veux revenir à cette variante de bouton, je peux simplement désactiver l'icône, pour qu'elle devienne maintenant celle-ci. Cela n'est donc possible que parce que j' ai ajouté les commandes vrai et faux, d'accord ? Donc, si vous revenez dessus et que vous essayez de cliquer dessus. Dans ce cas, je définis la propriété comme vraie, et dans celui-ci, j'ai défini la propriété comme fausse. C'est la seule raison pour laquelle je peux activer et désactiver ces deux boutons de variation Alors, il suffit de voir la différence. C'est que si vous utilisez du texte, vous n' obtiendrez pas le même effet et en désactivant le problème des icônes, vous pouvez le voir, cette variante Comme vous pouvez le voir, également à partir des couches ci-dessus, cette première icône égale à faux, et dans celle-ci , une icône est égale à deux. C'est ce qui fait la différence. Ainsi s'achève ce cours sur la compréhension des variantes, leur création et leur manipulation dans Figma J'espère que cette vidéo vous plaira. Merci de votre attention, et j'ai hâte de vous voir au prochain cours. 19. Ajouter des plugins: Dans ce cours, nous allons donc apprendre à ajouter et à exécuter des plug-ins. Les plug-ins sont des éléments tiers que nous pouvons utiliser des applications que nous pouvons ajouter à notre Figma pour améliorer nos expériences Parfois, vous devrez peut-être utiliser des applications tierces gratuites pour ajouter à création de notre contenu dans Figma Parfois dans la création de sites Web, ou parfois dans la création d' éléments. Il se peut que nous devions ajouter un ou deux composants ou plug-ins pour avoir une meilleure expérience. Il existe donc différentes manières d'ajouter des plug-ins. Mais le moyen le plus simple et le plus rapide d'ajouter des plugins est de passer par ce menu principal. Vous pouvez cliquer sur le menu principal et vous pouvez descendre ici, vous pouvez voir les plugins. Tu peux venir jusqu' ici. Vous avez autant d'options. Vous pouvez créer un nouveau plugin de port de connexion à partir du manifeste, ou vous pouvez consulter la documentation de l'API concernant les plug-ins Vous pouvez afficher ou masquer le consul, etc. Mais pour cela, nous allons gérer les plugins ici, et vous avez la possibilité de faire recherche sur tout type de plugin que vous souhaitez utiliser Vous pouvez voir que nous avons des composants ici. Nous avons des plugins ici, nous avons des widgets ici. Nous allons donc utiliser des plugins et nous pouvons effectuer notre recherche directement ici. Donc, le premier, disons que je veux ajouter ces moges animés, je veux ajouter des moges animés. Vous pouvez simplement rechercher n'importe quel plugin Vous pouvez voir celui-ci animé en train de brancher des images animées, et vous pouvez simplement continuer branchement animé est en train de charger et vous pouvez le voir ici , n'est-ce pas ? vous suffit donc de sélectionner l'endroit où vous souhaitez ajouter le plugin et vous pouvez simplement l'ajouter directement. Supposons donc que je veuille ajouter ceci. Je peux simplement cliquer dessus, le faire glisser et l'ajouter dans mon cadre. Et vous pouvez voir qu'il a été ajouté dans mon cadre, et je peux le redimensionner et mettre où je veux dans mon espace Alors peut-être que je veux probablement le mettre quelque part. Ouais. Je peux simplement le sélectionner, et vous pouvez voir que j'ai inséré ce MOG Et chaque fois que vous sélectionnez le G. Vous avez toujours ses propriétés ici bas. Si vous souhaitez modifier l'une de ses propriétés. Vous pouvez également cliquer pour modifier différentes propriétés, et vous pouvez le jouer pour avoir un aperçu de ce qu'il fait. Et vous avez autant de fonctionnalités en ce qui concerne son opacité, pouvez la modifier directement à partir d'ici Il s'agit donc du premier plugin. Vous pouvez avoir autant de plugins que vous le souhaitez. Tout ce dont vous avez besoin, c'est de vous assurer de revenir pour vous connecter ici, et de passer aux branchements. Ce sont les deux que j'ai utilisés. Vous pouvez en ajouter plusieurs. Passons à beaucoup d'autres. Vous pouvez dire : Il y en a un qui s'appelle content el. C'est également très agréable et intéressant. Vous pouvez donc simplement le sélectionner et vous pouvez continuer et courir. Et pour le moment, vous pouvez voir que nous venons d'ajouter la version d'essai du contenu. Alors, comment utilisons-nous le contenu ? Il comporte différentes fonctionnalités, du nom annoncé au nom complet, en passant par la date, l' adresse complète, les numéros de téléphone, devise américaine, etc. tant de choses pour lesquelles vous pouvez l'utiliser Et il a l'effet d' ajouter un effet sur le texte, ajouter un effet sur les images et d'ajouter des effets sur les icônes. Essayons ensuite d'avoir un exemple de ce dont nous parlons et de la façon d' utiliser cette version d'essai de contenu. Ainsi, par exemple, si nous abordons les navires et essayons d' ajouter cette ellipse, de cliquer dessus et de la faire glisser quelque part ici, je peux maintenir la touche Shift enfoncée que nous puissions avoir un cercle parfait Et disons à l'intérieur. Je veux ajouter une photo mais je ne l'ai pas, donc je peux ajouter quelque chose comme cet avatar. Je peux simplement cliquer d'un seul clic pendant que je sélectionne ce navire, je vais ajouter l' image de quelqu'un. Et si vous continuez à cliquer, il va continuer à changer les images qu'il a à l'intérieur du même vaisseau. Donc, en fonction de ce que vous souhaitez créer. Vous pouvez également le sélectionner et le faire créer. Voici donc comment ajouter ceci. Si vous souhaitez également ajouter des images, si vous souhaitez ajouter des images différentes, vous pouvez également venir et utiliser différents types d'images. Vous pouvez utiliser différents types d'images et vous pouvez voir plusieurs images en fonction de ce que vous créez. Vous pouvez utiliser la case à cocher, en sélectionner une et simplement l'appliquer. Vous pouvez donc sélectionner une image et vous pouvez simplement la modifier à partir d'ici, n'est-ce pas ? Même chose avec les icônes. Vous pouvez avoir plusieurs icônes, des icônes fluides régulières. Ils sont créés par Microsoft. Vous avez également des icônes fluides remplies par Microsoft. Vous pouvez donc cliquer sur n'importe lequel d'entre eux et vous verrez plusieurs icônes. Évidemment, vous pouvez voir plusieurs icônes que vous pouvez au moins utiliser long de votre création dans Figma Vous pouvez donc simplement sélectionner n'importe lequel d'entre eux, le faire glisser et le déposer, et vous pouvez facilement l'ajouter à vos créations. Vous pouvez donc le sélectionner et vous pouvez aussi le faire glisser et le déposer ici. J'ai cette fonctionnalité pour vous, vous pouvez modifier n'importe laquelle des fonctionnalités tout en sélectionnant l'icône. Vous pouvez modifier n'importe laquelle de ses fonctionnalités. Tout en sélectionnant les icônes, vous pouvez modifier Iqu de nombreuses choses à partir d'ici Il s'agit de plug-ins. Vous pouvez manipuler n'importe lequel d'entre eux qui vous intéresse, et vous pouvez simplement explorer, essayer de trouver d'autres plug-ins et les ajuster, ou commencer à les utiliser pour commencer à apprendre à les utiliser , car les plugins sont exceptionnels lorsqu'il s'agit d'apporter professionnalisme, facilité d' accès et de travail dans Figma J'espère donc que cette vidéo vous plaira. Merci de votre attention et j'ai hâte de vous voir au prochain cours, mais 20. Créer des designs à partir de modèles: Dans ce cours, nous allons apprendre à créer des designs à partir d'un modèle dans Figma Commençons donc par revenir à l'onglet d'accueil ici. C'est bon. Donc, une fois que vous êtes ici, vous pouvez venir ici pour découvrir la communauté. Et vous pouvez voir qu' il existe de nombreux types de modèles auxquels vous pouvez accéder à partir d'ici. Vous pouvez rechercher tout ce qui se trouve au sein la communauté directement à partir d' ici, ou vous pouvez vous inspirer, trouver ce que d'autres personnes ont créé, team sink, le système de conception, les ressources visuelles. Vous pouvez consulter les développements, les icônes et l'accessibilité, le Web, le mobile et le cadre. Les utilisateurs de Figma en ont créé un grand nombre, et vous pouvez y trouver beaucoup d'inspiration Vous pouvez même venir ici et découvrir quels sont les outils commerciaux qui fonctionnent sur le FDMA Voici donc quelques-unes des créations tendance des utilisateurs de la FDMA. Vous pouvez voir le nombre d'entre eux. Donc, par vous-même, vous pouvez simplement procéder à une recherche directe. Par exemple, vous pouvez rechercher n'importe quoi. Essayons de rechercher quelque chose de simple comme un problème, n'est-ce pas ? Essayons donc de rechercher quelque chose comme trouble up. OK, donc pour ce cours, nous allons choisir quelque chose de simple. OK, sélectionnons ce problème version 2.0. Il vous suffit de cliquer. Et cela vous amènera à vous le montrer et vous pouvez simplement continuer et dire, ouvrez dans Figma, vous pouvez simplement cliquer pour l' ouvrir en tant que nouveau projet dans Figma OK, donc une fois que tu auras ouvert, tu seras accueilli avec ça. La première étape est que vous avez le menu principal où vous pouvez cliquer, sélectionner et vous pouvez arriver à ce point. Il s'agit de l'image de la liste, puis de la page détaillée. Voici donc la page détaillée contenant certaines des choses que vous pouvez modifier. Maintenant, pour modifier l'une de ces fonctionnalités, vous suffit de cliquer et de la modifier. Par exemple, vous pouvez cliquer dessus et vous verrez que nous avons parlé de l'utilisation de cadres et d'éléments, façon d'ajouter différents types de choses, la superposition de tout cela Une fois que vous avez sélectionné n'importe quel type d' élément, par exemple, si vous souhaitez modifier cette image, vous pouvez cliquer dessus et sélectionner l'image. Vous pouvez voir l'image ici, vous pouvez cliquer et vous pouvez venir ici et voir choisir une image. Ainsi, vous pouvez naviguer partout où vous avez des images dans votre système. Par exemple, dans mon cas, j'ai ce tutoriel Figma, je l'ai dans cette ressource Et je peux sélectionner n'importe laquelle des images, soit celle-ci, soit celle-ci. Allons faire quelque chose comme ça. Et en un seul clic, vous pouvez voir que nous venons de changer l'image à ce sujet. OK ? Vous êtes donc libre d' utiliser n'importe laquelle de vos images. Vous pouvez y échapper et vous êtes maintenant de retour au nouveau. Vous pouvez donc voir maintenant que nous avons changé cela. Vous pouvez également modifier le texte, mais il suffit de double-cliquer sur le texte. Comme nous l'avons expliqué, cela pourrait être la meilleure aventure pour vous. Profitez de vos vacances ici, par exemple. Vous avez autant d'options. Vous pouvez double-cliquer et vous pouvez modifier n'importe quoi à partir d'ici. Par exemple, vous pouvez modifier la taille du texte, n'est-ce pas ? Vous pouvez voir que vous pouvez modifier la taille du texte et échanger le style du téléphone OK. Tu peux le rendre audacieux. Vous pouvez le faire utiliser. Vous avez autant de fonctionnalités , tout comme les fonctionnalités d'édition de texte. Vous pouvez remplacer le remplissage par une couleur probablement rouge. Il est donc très facile de modifier et de changer certains de ces éléments au fur et à mesure. Donc, une autre chose avec laquelle vous pouvez jouer est ce bouton. Vous pouvez simplement cliquer sur le bouton et vous pourrez changer pas mal de choses. À partir de là, vous pouvez également modifier la coloration. Tu peux en faire quelque chose comme ça. Je peux voir, et vous voyez que nous pouvons voir que nous allons le changer. Maintenant, vous pouvez également contrôler le rayon d' angle à partir d'ici. Nous avons parlé du rayon d'angle. Tu peux le contrôler. Et ici, il suffit de double-cliquer sur l'objet. Vous pouvez voir un double-clic dessus et vous ne pouvez pas modifier le rayon d'angle, augmenter ou le diminuer, comme vous le souhaitez, n'est-ce pas ? Vous pouvez voir, disons que nous avons quelque chose comme ça. Et vous pouvez également modifier le texte à l'intérieur pour commencer dès maintenant. Inscrivez-vous dès maintenant. Vous pouvez donc faire pas mal de choses. Vous pouvez changer beaucoup de choses ici en ce qui concerne le contenu de ce document. Vous pouvez également modifier cela et simplement cliquer sur «  Cela a été ajouté à l'aide du plugin que nous avons montré plus tôt ». Vous pouvez ajouter différents types d'icônes avec les plug-ins. Donc, si, par exemple, vous souhaitez changer cela, vous pouvez passer aux plug-ins, comme nous l'avons expliqué plus tôt, vous pouvez passer aux plug-ins et vous pouvez accéder au contenu public en vrai. Nous pouvons constater que le contenu est réel. Et vous pouvez voir que vous pouvez accéder aux icônes Si vous avez un type d'icône qui vous intéresse, choisissons-le. OK, vous pouvez donc sélectionner en fonction de ces icônes, celles qui vous intéressent, vous pouvez simplement sélectionner, par exemple, sélectionnons quelque chose comme ça, et vous pouvez voir que nous venons de l'ajouter à celui-ci, n'est-ce pas ? Vous pouvez maintenir la touche de commande enfoncée. Vous pouvez facilement le faire glisser. Supposons donc que nous le glissions et que vous l'insériez simplement ici. Nous pouvons voir si je viens de l'ajouter. Vous pouvez l'ajouter partout où cela vous intéresse. Voici donc comment intégrer différents éléments et les modifier en conséquence. Je peux terminer sur ce point et donc me permettre d'utiliser la lettre H pour me déplacer. Voici donc en fait comment personnaliser différentes choses. Vous pouvez modifier tout cela. Si cela vous intéresse, vous pouvez modifier tout cela en conséquence si cela vous intéresse. Ceci conclut ce cours sur la façon d' ouvrir un modèle et ajuster les fonctionnalités de ce modèle. Dans le prochain cours, nous allons apprendre à créer un design d'interface utilisateur particulier à partir de zéro. Peut-être que nous allons le reproduire à partir de zéro. Nous allons le créer à partir de zéro et voir comment nous pouvons jouer avec certaines fonctionnalités. Alors jusqu'à la prochaine fois, merci d'avoir regardé et j'ai hâte de vous voir au prochain cours, non ? 21. Créer une interface utilisateur à partir de zéro: Dans ce cours, nous allons apprendre à créer un design d'interface utilisateur à partir de zéro. Nous allons simplement choisir n'importe laquelle de ces pages, et nous allons la créer en utilisant méthodes différentes, des méthodes différentes. Vous pouvez commencer par créer un cadre, afin que nous puissions passer aux cadres ici. Nous ne pouvons pas le guider avec une lettre F, nous pouvons simplement le cadrer. Et comme nous l'avons dit plus tôt au début du didacticiel, nous pouvons sélectionner n'importe lequel d'entre eux. Alors allons-y le 14. Allons le fan, et je pense que nous avons de la chance de l' avoir de la même taille. Donc, ce que nous devons faire, c'est simplement double-cliquer et changer le nom de ce cadre en particulier, peut-être en aviging H. pouvons donc continuer et ajouter différentes fonctionnalités, comme nous l'avons vu La première est donc que nous pouvons ajouter cette image. Nous pouvons ajouter des images directement dans ce dossier et vous pouvez utiliser vous-même et glisser-déposer n'importe quelle image directement dans le cadre. Je peux voir maintenant que nous avons inséré cette image. Vous pouvez le redimensionner pour étayer l'ensemble des versets qui disent que nous nous caractérisons comme ça Et transportez également une taille comme celle-ci. C'est bon. Donc, une chose que nous pouvons remarquer, c'est que celui-ci a cette nature de courbe en bas. Nous pouvons donc le faire. Nous pouvons également reproduire cela en nous référant à la nature de la courbe. Nous pouvons sélectionner l'image, et nous pouvons modifier la caractéristique de la courbe à partir d'ici, le rayon d'angle. Vous pouvez modifier cette sélection en double-cliquant ici et peut-être en faire 25 et vous pourrez voir si vous avez ajouté un rayon d'angle, mais ce n'est pas en tant que pixel, nous pouvons donc glisser pour le rendre beaucoup plus visible OK. C'est une façon de le faire. Alternativement, nous pouvons nous rendre dans les coins indépendants. C, il suffit de cliquer. Et si vous remarquez qu'en haut , il n'y a pas de coin. C'est donc le meilleur signe. Le coin inférieur du bouton supérieur. Allons donc ici et faisons en sorte que ce zéro et que celui-ci soit également nul. OK. Une fois que nous avons cliqué dessus, vous pouvez voir qu'en ce moment nous avons ceci avec les coins en haut, les coins lents. Nous pouvons donc également sélectionner une autre option, nous pouvons toujours créer les coins à l'aide de ce rail et vous pouvez le faire avec les coins, comme nous l'avons démontré au début de ce didacticiel. Nous venons donc de le créer. La prochaine est que nous pouvons ajouter ce texte. Oh, nous pouvons ajouter ces éléments, celui-ci, c'est juste un rectangle avec autant de fonctionnalités. Nous pouvons donc y ajouter le rectangle. Vous pouvez accéder aux formes ici, cliquer sur sélectionner un rectangle, et nous pouvons simplement sélectionner et dessiner un rectangle. Celui-ci a également des extrémités circulaires, nous pouvons donc passer au rayon et simplement en augmenter les bords. Nous pouvons avoir quelque chose comme ça. Et nous pouvons également changer la couleur en blanc pur cette fois-ci. OK, nous avons donc quelque chose comme ça. Mais ce n'est pas tout. Il nous faut une ombre. Nous aurions pu entrer en vigueur jusqu'à ce que nous ayons cette ombre. Et maintenant, nous pouvons voir que nous avons nos éléments tels que nous les avons ici. Maintenant, ici en bas, nous pouvons ajouter ceci différemment afin d'ajouter ce texte. Le texte est simple. Vous pouvez simplement copier-coller. Faisons donc simplement une copie et nous pouvons simplement revenir. Disons que nous l'ajoutons avec ceci, pouvons arriver à la lettre T, et que nous pouvons simplement cliquer et écrire quelque chose. Voyage. Les détails, par exemple, puis nous pouvons cliquer dessus et cliquer et le déplacer quelque part ici, puis nous pouvons avoir ce noble texte, que nous pouvons toujours déclencher avec celui-ci. Ensuite, nous pouvons sélectionner. OK, et nous pouvons avoir un texto ici. J'aime bien que nous l'ayons là-bas. Vous pouvez donc simplement cliquer sur une zone de texte et vous pouvez différentes choses que je redimensionne en utilisant les propriétés, les différentes propriétés La prochaine étape est donc la dernière consiste à ajouter ce bouton, et nous avons appris à ajouter des boutons en accédant simplement aux formes ici. Vous pouvez sélectionner un enchevêtrement rouge, et nous pouvons le dessiner et le rendre aussi grand. Donc, si vous le souhaitez, vous pouvez zoomer pour voir les détails et vous pouvez également utiliser le papier à en-tête pour vous déplacer Vous pouvez donc sélectionner cette option et nous pouvons apporter des modifications. Vous pouvez le redimensionner et vous pouvez également vous échapper. Vous pouvez le redimensionner et le modifier. Vous pouvez ajouter le rayon d'angle à partir d' ici, comme ça Et tu peux changer la couleur à partir d'ici. Vous pouvez voir plus de couleurs. Vous pouvez utiliser le sélecteur de couleur et choisir la coloration exacte que nous avons ici Vous pouvez donc y échapper à moins déclencher le texte et nous pouvons voir joindre maintenant, vous pouvez simplement rejoindre maintenant. Et nous pouvons le sélectionner et le mettre en gras, nous arrivons et, et nous pouvons tout sélectionner, sélectionner le texte, ainsi que le bouton, puis nous pouvons centraliser centre des deux à l' horizontale et à la verticale Et maintenant, nous avons tout. Donc, la prochaine chose que nous pouvons avoir, c'est cet endroit, l'étoile et les deux. Cela peut donc être ajouté à partir de l'icône. Cela nous oblige donc à ajouter un plugin. Alors, comment ajouter un plugin ? Venez ici et nous pouvons rechercher un plugin appelé icon scout icon scout Vous pouvez donc simplement rechercher une icône. Par défaut, vous voyez un certain nombre de plugins différents qui peuvent vous donner des icônes. Mais pour cet oral, nous allons utiliser l'Icone Scout, celui-ci. Vous pouvez donc voir en cliquant, cliquant sur et en explorant. J'ai compris. Il vous faut donc vous connecter. Vous pouvez donc simplement rechercher n'importe quelle icône. Ainsi, par exemple, nous pouvons dire flèche de retour. Supposons que nous recherchions la flèche arrière et que nous puissions voir différents types de flèches arrière que nous pouvons facilement utiliser. Ainsi, par exemple, pour celui-ci, vous pouvez voir cette flèche arrière, celle-ci, celle-ci. Essayons de le créer, afin que nous puissions avoir différents types de flèches arrière. Nous l'avons donc, nous pouvons donc continuer et l'utiliser également. Utilisons-le donc. Utilisons-le donc. Nous pouvons le glisser-déposer. Nous pouvons donc redimensionner. Redimensionnons-le Échappons à cela. Redimensionnons-le. Nous allons donc le redimensionner et le mettre quelque part ici. Mettons-le donc quelque part ici. Et nous pouvons également changer la coloration à partir d'ici. Faisons-en quelque chose comme du blanc. Je pense que c'est ça. Vous pouvez avoir quelque chose comme ça, pour que nous puissions revenir en arrière. Donc, ici aussi, vous pouvez ajouter tout cela. Vous pouvez ajouter ce texte sur le lieu et cette étiquette de prix. Vous pouvez donc toujours revenir au même plugin. Vous pouvez donc simplement rechercher un emplacement. OK, il vous suffit donc de rechercher un panneau de localisation. Et vous pouvez les voir de différents types. Vous pouvez glisser-déposer. Et vous pouvez redimensionner directement. Vous pouvez faire glisser la touche Shift vers le bas pour obtenir un redimensionnement parfait D'accord, moins, nous allons le redimensionner. Ensuite, nous pouvons rechercher les autres, leur étiquette de prix. Vous pouvez toujours revenir au travail et continuer. Ainsi s'achève ce cours sur la façon de créer un nouveau design à partir de zéro. OK, donc j'espère que cette vidéo vous plaira. Merci de votre attention, et j'ai hâte de vous voir au prochain cours. 22. Créer un prototype interractif de l'application: Dans ce cours, nous allons apprendre à créer un design interactif de cette application d' interface utilisateur que nous essayons de créer dans Figma Pour commencer, essayons donc de faire en sorte que nous puissions interagir et passer d'une image à l'autre en effectuant certaines actions de la première image qui pourraient nous mener à la deuxième image, et nous pourrons définir le comportement de chaque action en fonction du prototype. Le prototype est donc comme la démonstration de ce à quoi l'application que vous essayez de créer ressemblera l'application que vous essayez de créer dans la vie réelle. Et nous allons faire l'aperçu directement ici avec cette icône. Directement. Donc, pour commencer, commençons par le premier cadre ici. Ajoutons une simple icône ou un simple bouton. Revenons au mode de sélection et choisissons d'ajouter un simple bouton sans le copier-coller. Oui, déplaçons-le ici. Et renommons-le en Get Started. Commençons par le faire, et nous pouvons ajouter quelque chose ici pour démontrer l'impact de ce que vous essayez de créer. Supposons que nous y ajoutions une image, que nous la glissions et que nous la collons dedans. C'est bon. Et vous pouvez voir qu'à l'heure actuelle, cela couvre tout. Essayons donc de l' arranger et de le réduire. Nous l'avons donc et pouvons également l' intégrer ici, afin de conserver les autres fonctionnalités. Mais ensuite, nous pouvons toujours sélectionner l'image et l' amener ici, et nous pouvons réduire l'opacité pour qu'elle devienne bien visible Les autres caractéristiques ne peuvent pas devenir visibles, c'est un peu comme une opacité de dix C'est trop petit. Faisons en sorte qu'il soit peut-être 40. OK. Je pense que c'est bon. Nous pouvons donc voir à partir d'ici, que nous pouvons commencer et établir un lien avec cet endroit. Mais alors ajoutons probablement mon logo à cela. Nous pouvons également simplement glisser-déposer le logo, et nous pouvons également le dimensionner en venant ici aimant et en faisant glisser pour le réduire un peu. En maintenant la touche Shift enfoncée, nous pouvons avoir un arrangement parfait, puis nous pouvons simplement le sélectionner et le mettre de côté. Nous pouvons donc ajouter du texte, peut-être pour indiquer qu'il se passe quelque chose ici, mais je pense que ça va Lorsque vous cliquez, vous pouvez vous rendre ici. Et puis, à partir de là, lorsque vous cliquez, vous pouvez voir ce détail. Alors, comment s'y prendre ? Comment associer l'action, peut-être sur votre téléphone, qui vous redirigera vers ce cadre lorsque vous cliquerez sur Commencer ce cadre lorsque vous cliquerez sur Et puis, lorsque vous cliquerez sur cette image, vous serez redirigé vers les détails du magazine. Donc, la première chose à faire est de commencer par cliquer sur Commencer, et vous pourrez accéder au prototype ici. Ensuite, tu pourras y aller et venir ici. Vous pouvez voir ce signe positif. OK. Donc, une fois que vous avez cliqué sur le signe plus, vous pouvez cliquer sur le signe plus, et vous pouvez simplement vous inscrire comme ça, d'accord ? Vous pouvez donc voir qu'il passe simplement à l'action suivante. Il est relié au pont suivant. Et comment cela se produit-il ? Est-ce au clic ? Vous pouvez voir que le clic est activé par défaut. Ainsi, une fois que vous aurez cliqué sur Commencer, vous serez lié au cadre suivant. C'est une valeur par défaut, mais vous avez d'autres fonctionnalités, comme la possibilité d'en faire une saisie avec la souris ou de laisser la souris enfoncée ou la souris. Ou après un retard sur Drac. Vous pouvez sélectionner n'importe laquelle de ces options si cela vous intéresse. Donc, pour ce cours, nous allons simplement nous en tenir là ou cliquer, ce qui est le cas par défaut, et nous allons simplement le faire naviguer vers cette page. Si vous avez une autre option, comme choisir entre Pre, avoir des superpositions, des superpositions, superpositions d'échange ou autres fonctionnalités, vous pouvez procéder à la sélection en conséquence si vous Et c'est la première option. Vous l'avez lié. Après cela, il sera lié ici. Ensuite, nous pouvons essayer de tester, et voyons comment se déroulera l'action de cette image à la suivante. Vous connaissez la transition entre ce cadre et le suivant. Nous allons le tester en direct pour voir comment cela va se passer. Nous pouvons donc commencer par passer au test ici, en cliquant sur le bouton de prévisualisation, où nous pouvons prévisualiser le prototype et voir ce qui va se passer sur notre téléphone portable. Vous pouvez donc venir ici et cliquer. Ensuite, nous l'avons intégré à cette plateforme tel que nous l'avons. Vous pouvez donc continuer, cliquer et commencer, et en cliquant, vous pouvez voir que cela nous amène directement à ce point. OK ? Nous pouvons donc voir en cliquant simplement et en commençant, nous sommes là, et c'est exactement ce que nous essayons de prouver avec cela. Revenons donc à la Figma et continuons des liens ou à rendre l'application interactive dans son ensemble Maintenant, je veux que nous reliions cette image à la diapositive suivante. Ainsi, lorsque quelqu'un clique sur cette image, elle passe à l'image suivante. Nous pouvons donc sélectionner cette image, puis passer à ce signe plus, et nous pouvons simplement cliquer, l' ajouter et la connecter comme ça, et elle sera liée à celle-ci. Alors, comment est-ce que ça va se passer ? Nous pouvons donc sélectionner ou emménager. Parce que vous avez différents types d'options. Vous avez l'instant, vous vous dissolvez, vous avez un compagnon intelligent. Je vais donc sélectionner Move in, qui vous montrera l'aperçu ici et vous pourrez modifier la facilité Et les autres fonctionnalités également. Si vous souhaitez qu'il se déplace de gauche à droite, ou de droite à gauche, vous pouvez voir l'aperçu ou de haut en bas, ou de bas en haut, vous pouvez sélectionner comme vous le souhaitez. Donc, pour celui-ci, nous allons aller de droite à gauche, et je pense que nous pouvons voir une mise à jour . Et puis c'est terminé. OK, nous pouvons donc terminer sur ce point, puis nous pouvons essayer de le tester également, afin de voir la transition entre la première image et la dernière image. Nous pouvons donc simplement sélectionner le premier cadre et venir ici. Et cliquez sur Démarrer. Une fois que vous avez cliqué sur Commencer, cela nous amène à ce point. Et une fois que vous avez cliqué dessus, jetez un œil à la transition très rapide et très intéressante. Nous allons y arriver. En résumé, voici comment créer une interface utilisateur interactive dans Sigma et jouer avec elle sur votre téléphone mobile Vous pouvez donc le voir, nous avons même montré un aperçu de la façon dont vous pouvez le voir en direct sur votre téléphone portable, différentes actions que vous allez effectuer des différentes étapes, des clics et du déroulement de l'interaction . J'espère que cette vidéo vous plaira. Merci de votre attention, et j'ai hâte de vous voir au prochain cours. Au revoir, OK. 23. Partager et exporter des designs: Dans le dernier cours, nous avons expliqué comment créer une interface utilisateur interactive dans Sigma Dans ce cours, nous allons parler de la façon d'exporter ou de partager notre design avec des collègues amis ou toute autre personne avec laquelle nous souhaitons partager le document. Donc, pour partager un design en particulier, vous pouvez vous rendre jusqu' ici sur le bouton de partage en haut à droite. Vous pouvez simplement cliquer dessus, et vous pouvez inviter la personne directement en donnant son adresse e-mail, et vous pouvez simplement l' inviter. Je peux inviter quelqu'un. Prenons l'exemple du mentorat, mais moi. Donc, une fois que vous avez saisi l' adresse e-mail de la personne, vous pouvez également modifier l'autorisation que vous allez lui donner Par exemple, l'autorisation pour le moment est qu' il ne peut que consulter, mais il peut cliquer dessus et vous pouvez également en faire un éditeur. À ce projet même. Vous pouvez donc inviter la personne et elle recevra un e-mail l' invitant à commenter ou à modifier ce projet en particulier. OK, donc une fois que vous êtes connecté à votre compte Gmail, vous pouvez voir que nous avons reçu un e-mail de Figma une fois que vous l'avez ouvert Vous pouvez simplement continuer et cliquer pour ouvrir. D'accord, en même temps, tu peux enregistrer. Vous pouvez télécharger le projet, télécharger n'importe quel type ou télécharger n'importe quelle section du projet, n'importe quel cadre en sélectionnant simplement le cadre, et vous pouvez revenir à la conception, et vous pouvez descendre ici et vous pouvez voir l'exportation Si vous cliquez sur Exporter, vous ne pouvez pas définir type de format de fichier souhaité. Vous pouvez voir que le format par défaut est PNG, mais vous pouvez passer au format JPEG ou SVG du PDF en fonction. Laissez-moi passer au JPEG, et je pourrai simplement exporter. Vous pouvez voir que la valeur par défaut est également un X, ce qui permettra de tout maintenir en termes de qualité. Mais si vous exportez un projet de très grande envergure, il est préférable d'opter pour deux X, ce qui serait moins bon au niveau de la qualité lors de l'exportation, mais lors de l'aperçu vu de l'autre côté, peut-être du point de vue de votre client. Donc, une fois que vous avez terminé , vous pouvez dire « exporter le menu » et vous pouvez définir l'emplacement où vous souhaitez l'exporter. Par exemple, dans mon cas, je souhaite l'exporter dans le projet Still Figma, et je peux simplement m'en assurer Et cela est maintenant exporté à cet endroit précis. Si vous souhaitez exporter l'ensemble des cadres, vous pouvez cliquer sur un cadre en particulier et le sélectionner. Maintenez la touche Shift enfoncée et sélectionnez la deuxième image. Maintenez la touche Shift enfoncée et sélectionnez la troisième image, puis vous pouvez continuer venir ici et dire « exporter ». Maintenant, vous pouvez également définir la valeur par défaut que vous souhaitez. O JPG, et je peux dire d'exporter les trois couches. Et définissez le même emplacement. Par exemple, je peux créer un autre dossier ici l'appeler output et cliquer sur créer. Ensuite, je veux tout exporter à cet endroit pour être sûr. Et pour le moment, il a été exporté, alors vérifions-le dans le dossier et voyons ce que nous avons exporté. Vous pouvez voir que nous avons exporté les trois fichiers que nous avons. Nous pouvons donc simplement cliquer sur n'importe lequel pour avoir un aperçu de ce que vous venez d'exporter. Ainsi s'achève ce cours sur la façon de partager votre projet dans FGMA et même de l' exporter sur votre ordinateur sous différents formats J'espère que vous avez apprécié cette vidéo. Merci de votre attention, et j'ai hâte de vous voir au prochain cours. Pourquoi ? 24. Conclusion du cours: Félicitations pour avoir terminé ce cours. Vous avez atteint la fin de ce cours intensif Figma pour débutants Tout au long de ce parcours, vous avez acquis une compréhension globale de Figma et de ses fonctionnalités pour les conceptions d'interface utilisateur Vous avez appris à naviguer dans l'interface, créer et à manipuler des éléments, créer des prototypes d'interface et, finalement, à partager vos conceptions avec le monde entier. Au moment de dire adieu à ce cours, n'oubliez pas que la pratique est essentielle Plus vous utiliserez Figma, plus vous serez à l'aise et confiante. Essayez d'explorer la communauté Figma. J'aimerais vous mettre au défi de consulter la section projet de ce cours pour trouver un projet simple dans lequel vous pourrez essayer démontrer vos nouvelles compétences. Cordialement, je vous remercie infiniment de votre présence parmi moi et je vous souhaite bonne chance dans vos prochains engagements. Continuez à concevoir.