Masterclass sur Figma : concevez et prototypez votre première idée d'application mobile

1. Introduction au cours de maître Figma: Bienvenue dans mon cours. Terre plus dure figue marvit. En seulement 14 jours dans les écoles, vous allez apprendre tous les différents outils et techniques et conseils sur la façon dont orteil fil cadre que la conception, puis prototype votre idée APP à partir de zéro. Je vais partager avec vous tous les cas Sharper couramment utilisés afin que vous puissiez accélérer votre flux de travail au sein de figment. De même, nous allons partager avec vous tous les différents outils de prototypage et conseils et techniques sur la façon d'utiliser différentes transitions affecte différentes émissions afin que vous puissiez convertir vos conceptions statiques et vos conceptions ennuyeuses en quelque chose génial. Nous allons concevoir ensemble recette alimentaire ont appelé les germes. Nous allons concevoir son écran d'ouverture de session X filtres de recherche. C' est différentes animations de menu là où le menu va passer d'un schéma à l'autre et comment vous êtes intelligent. Et il a fait comment utiliser trop les effets. Comment utiliser tout ce genre de choses dans Sigma. Il y a beaucoup d'affectations le long de l'école, donc je vais faire les pieds. Gardez un œil sur vos progrès, et je vais vous donner des commentaires opportuns sur la façon dont vous pouvez améliorer vos compétences en matière de conception . Je crois que tout le monde peut apprendre n'importe quel outil de conception en seulement deux semaines, c'est suffisant. Alors commençons et plongons dans le jeu maintenant. 2. Téléchargez et installez Figma sur Wen et Mac: dans cette vidéo, nous allons aller à figment dot com, et nous allons télécharger la figure MMA, et nous allons voir quelles sont les différentes fonctionnalités et comment nous pouvons les utiliser. Quel est le modèle de tarification de la Fig ? Maman, quelle est la version gratuite donne et quelle est la version payante ? Différences. Alors commençons. Non. D' abord, vous allez aller à la figure dot com et ceci est leur site Web, et vous pouvez voir ici, ils disent conflit Igman gratuitement. Vous devez donc créer votre compte ici, donc vous allez aller vous inscrire et créer votre compte. C' est la première étape. Maintenant, la deuxième étape est, une fois que vous avez créé votre compte, vous allez aller à téléchargements sigma dot com slash téléchargements. Comme vous pouvez aller de la ressource de rôle de récréation est et aller aux téléchargements et voici vous allez télécharger l' application de bureau. Car si vous utilisez un système d'exploitation Mac OS ou Mac, vous allez télécharger cette application de bureau, et si vous êtes sous Windows, vous allez télécharger l'application de bureau pour Windows. Maintenant, si vous essayez d'utiliser votre fig MMA sur votre navigateur que vous allez utiliser cette carte. Programme d'installation Quest, programme d'installation Windows. La plupart des gens que je pense que 99,9 % vont télécharger ça le font. Donc on n'a pas besoin de s'inquiéter à ce sujet. Les installateurs de Fort téléchargent simplement l'application de bureau et l'installent sur votre PC ou Mac. Maintenant, je vais vous montrer quel est le modèle de tarification. Et quelles sont les caractéristiques qui sont dans différents modèles de prix pour ce modèle de figue ? abord est gratuit de sorte que vous pouvez créer après deux éditeurs. Voulez-vous juste dire que deux personnes peuvent éditer un seul projet ? Vous pouvez avoir une équipe pour les concepteurs et trois projets, et vous pouvez créer trois projets. Maximum de trois projets, historique des versions de 30 jours. Donc, ce remorquage ça enregistre vos de versionsde conception. Donc, quels que soient les changements que vous faites à un fichier de conception, ils seront économisés pour seulement 30 jours et des dollars illimités sont passés en revue. Vous pouvez utiliser notre téléchargement, n'importe quel fichier ou n'importe quelle taille hors fichier. Ce n'est pas un problème. Visionneuses gratuites illimitées afin que vous puissiez partager vos projets avec un nombre illimité de personnes qu'ils peuvent voir votre projet. Maintenant, vous pouvez voir ici, nous avons professionnel et d'organisation. Maintenant, la principale chose que nous chercherons que nous sommes ici est l'historique des versions illimitées. C' est la première chose, et deuxièmement, il n'invite que des projets privés. Ainsi, par exemple, si elles sont des entreprises ou de l'entreprise est qu'elles veulent travailler sur des projets privés seulement, ils peuvent créer des invitations qu'ils peuvent envoyer, inviter uniquement des invitations privées, orteil différents membres, bibliothèques d'équipe partageables Ainsi, vous pouvez concevoir vos bibliothèques de conception et les partager avec votre équipe. C' est une autre caractéristique de la profession. Donc, euh, ce sont les différences. Donc, si vous êtes une très grande organisation, vous pouvez opter pour celle-ci. Maintenant, quelles sont les différentes caractéristiques ? Pourquoi pensons-nous que la stigmatisation est la prochaine chose ? Non. La raison en est que la première chose est qu'il s'agit d'une plate-forme transversale. Vous pouvez utiliser cette conception même dans votre navigateur. C' est donc la première chose Chaque fois que vous regardez un outil de conception, vous devez voir s'il peut être utilisé n'importe où sur n'importe quelle plate-forme. C' est un plus. Le deuxième point est qu'il y a beaucoup d'outils que je peux penser qu'ils sont des outils de nouvelle génération pour les concepteurs. Il y a beaucoup de choses que vous pouvez faire beaucoup de fonctionnalités, mais dans ce volé heures complètement, conceptions réactives. Ensuite, nous avons des branchements. Vous pouvez voir que vous pouvez télécharger différents plug-ins et étendre la fonctionnalité de Sigma que vous pouvez voir ici. Ici, nous n'avons pas splash, donc vous pouvez télécharger n'importe quelle image et son image stock qui est gratuit. De même, nous avons ceci, je quantifie, et vous pouvez utiliser toutes les icônes différentes comme l'icône de conception de matériel icônes Scougall. Quatre icônes impressionnantes qui sont très populaires. Donc ce sont les fonctionnalités de Sigma, et c'est comme ça que vous allez aller par ici. Inscrivez-vous et descendez charge fig, MMA application de bureau et nous allons commencer dans la prochaine leçon. Passons donc à la leçon suivante. 3. Nouvelle interface Figma 2022: Dans cette vidéo, nous allons regarder Figma, nouvelle interface car l' ancienne était il y a deux ans. Maintenant, c'est le nouveau. Plongeons donc dans l'interface sigmas. Ok, donc une fois que vous vous connecterez à Figma, vous verrez que ce sera l'interface, même si vous ne verrez pas qu'ils sont en top, sont les fichiers que j'ai ouverts. Ils ne seront donc pas là. Si vous l'utilisez pour la première fois. Sur la droite, il y aura un profil. Donc, si vous cliquez ici, vous pouvez voir que c'est mon e-mail. En outre, vous pouvez accéder aux paramètres internes du plugin de profil de la communauté I. Voici donc les paramètres. Vous pouvez donc voir ici, vous pouvez changer votre nom, votre adresse e-mail, votre mot de passe, etc. Et vous pouvez également accéder au profil de la communauté à partir d'ici. Il s'agit donc de ma communauté en tant que destinataire et vous pouvez le modifier si vous le souhaitez. Ce sont les plugins que vous avez installés. Vous pouvez cliquer ici et désinstaller ou afficher les détails à partir d'ici. Vous pouvez également accéder aux plug-ins à partir d'ici. Donc, quoi que vous ayez installé, ce qui améliorera les capacités de Figma, ce sera ici. Vous pouvez donc voir que j'ai tous ces plugins. Ce sont donc trop de plugins de toute façon. Il va donc s' agir de votre compte. Le profil de la communauté est nécessaire car vous allez vous rendre dans la communauté pour télécharger beaucoup de choses différentes. Vous pouvez donc voir maintenant que je suis passé à mes profils de communauté. Vous pouvez donc le voir ici dit « communauté ». Donc, si vous souhaitez revenir à votre profil principal, vous devez cliquer ici, passer à l'essence ou quel que soit votre nom dans votre profil Figma, vous reviendrez à l'interface. Bon, commençons par une vue récente. Consulté récemment. Donc, chaque fois que vous commencerez, ce sera ici. Nous avons donc trois boutons. Auparavant, les boutons, mais pas très bien conçus. Je dirais. C'est vraiment facile. Nouveau fichier de conception. Cliquez ici. Nouveau fichier figuier, destiné aux diagrammes de tableaux blancs et à la collaboration de différentes esquisses ou idées. Il s'agit d'un autre outil de Figma. C'est donc leur dossier. Si vous souhaitez importer un fichier à partir de figma sketch ou de n'importe quelle image, vous pouvez cliquer ici et cliquer sur le fichier figma. Voyons si j'ai quelque chose en téléchargement. Ok, donc vous pouvez voir que j'ai ce fichier de points fig sont également des fichiers de croquis sombres, donc vous pouvez les importer ou les deux. Il suffit de cliquer sur le fichier fig et de l'ouvrir comme ceci. Et l' importation prendra un certain temps , car il s'agit d'un outil en ligne. Cela va donc montrer que vous pouvez voir ce qui est fait. Et ici, j'ai ce dossier ici. Je vais double-cliquer dessus. Pour ouvrir ce fichier. Vous pouvez voir que c'est essentiellement à Clay Maquette de High pour l'académie. De toute façon. Revenons donc à notre interface principale, qui sera cette maison. Et nous l'avons déjà fait, vous savez déjà qu'il s'agit d'un nouveau dossier. Il s'agit du fichier de gem de configuration. Nous allons donc créer principalement ces nouveaux fichiers de conception ou peut-être importer certains fichiers. Ok, donc ici, nous avons tous les fichiers récents sur lesquels j'ai travaillé ou que j'ai ouverts. Vous pouvez donc voir qu'il existe des systèmes de conception, des formes dessinées à la main par des vecteurs, des formes, beaucoup de choses. Et si vous votez pour supprimer n'importe quel fichier d'ici, vous pouvez simplement aimer, cliquons ici et cliquez avec le bouton droit de la souris et supprimez des derniers. Vous pouvez sélectionner plusieurs fichiers. Par exemple, nous allons sélectionner plusieurs fichiers comme celui-ci, donc j' appuie sur la touche Maj, celui-ci et celui-ci est enfoncé. J'ai donc sélectionné les trois, supprimé trois éléments des récents. Je vais donc le supprimer comme ça parce que ce sont beaucoup de mes devoirs d'étudiants. Ils continuent donc de se soumettre. D'accord, nous avons donc couvert cette zone. Filtrer par tous les fichiers, fichiers de conception, les fichiers fig Gem sont des prototypes. Nous avons normalement tous les dossiers. Ensuite, nous avons cette liste de fichiers avec de petites icônes si vous l'avez aimé. Parce qu'il va vous montrer depuis combien de temps vous avez créé ou ouvert ce fichier. Vous pouvez voir certains des dossiers que j' ai ouverts il y a deux mois. Et ce sera votre vue en grille. Il s'agit donc de deux vues pour vos fichiers récents. Nous avons également des modèles de confiture de figues ici ou un diagramme d' architecture d'information , tous ces diagrammes si vous voulez les utiliser, vous pouvez cliquer sur celui-ci et commencer à construire ce que vous voulez. vouloir. D'accord, alors nous avons ces profils de communauté. Donc, si vous êtes allé à la communauté, vous pouvez télécharger des icônes, filaires, des systèmes de conception, tout ce qui est gratuit, des plugins tout. C'est donc une très belle caractéristique de la nouvelle fonctionnalité des sorcières Figma. Vous pouvez peut-être aller chercher n'importe quel plugin. Disons la taille, la taille, et voyons si nous avons des événements C, icônes, des tailles de courses. Ce sont donc tous des plugins différents. Nous avons donc ici différents créateurs qui créent réellement ces plugins. Ce sont des plugins et aussi si vous allez dans Fichiers, vous pouvez voir que nous avons différents fichiers qui ont cet écran dit par exemple, vous pouvez voir les tailles d'écran iOS 14. Donc, le tableau périodique de l'iPhone. Il s'agit donc de tailles d'écran différentes. Vous pouvez donc télécharger différents fichiers si vous souhaitez télécharger. Par exemple, si je veux télécharger ce fichier, il s'agit de taille A3, A4, A5 pour la conception. Vous pouvez cliquer sur ce duplicata et il va dupliquer dans votre interface Figma. Ici, nous l'avons. Bon, retournons à la maison et vous serez dans la communauté de la même façon. Vous pouvez cliquer sur aimer ou aimer ça, peu importe. Vous pouvez également effectuer un zoom avant, un zoom arrière. Vous pouvez passer en plein écran et voir ce que d'autres, d'autres choses ont créé cet auteur. Revenons en arrière. Revenons ici. Vous pouvez cliquer sur les filaires et vous verrez beaucoup de filaires ici, plugins, des fichiers, tout. Vous pouvez donc voir ici comme celui-ci. J'ai vraiment adoré celui-ci. Je vais donc reproduire celle-ci ici. J'adore ça. Bon, il s' agit donc de communautés. Revenons donc à mon profil principal. Bon, donc nous l' avons ici. Nous avons donc discuté récemment et communautaire. Vous pouvez également définir vos fichiers ici. Voyez-vous, nous avons ma première classe de design figma ou Figma. Il s'agit d'un projet. Vous pouvez voir quoi ici. Il s'agit de fichiers qui proviennent de fichiers communautaires. Communauté. Ok, c'est ainsi que ça va vous montrer une recherche, très avancée, très agréable. Vous pouvez rechercher des thèmes de fichiers ou des personnes, même des personnes. Alors, choisissons Chris, nous l'avons. Décalez une personne. Bon, donc je dois entrer pour voir. C'est donc l'un de mes collègues de travail. Je vais cacher l' e-mail ici. C'est donc la personne qui travaille avec moi en ce moment est développeur. Ok, donc nous avons une barre de recherche couverte. Nous avons ce profil principal qui passe de la communauté à l'autre. Nous avons couvert cette section à droite. Il s'agira de vos mises à jour. Si vous avez des notifications. Il s'agira donc de vos notifications. Ensuite, nous avons des brouillons. brouillons sont en fait des projets. Donc, vous êtes en fait un projet et tout. Vous créez une modification, vous créez un nouveau fichier. Chaque fois que vous allez créer un nouveau fichier, il sera dans un brouillon. Une fois que j'ai cliqué dessus, vous pouvez voir ici. Nous allons donc appuyer sur E pour le tableau d'art et cliquons sur celui-ci. Ok, donc vous pouvez voir une fois que j'ai créé quelque chose, ce sera donc dans les brouillons. Au sommet, nous avons donc la hiérarchie. Les brouillons sont le projet. Il s'agit du nom de fichier. Donc, si vous cliquez ici, vous pouvez modifier le nom de fichier, mon fichier Figma. OK ? Si vous souhaitez le déplacer vers un autre endroit, vous pouvez cliquer sur cette flèche et vous pouvez voir Déplacer vers des projets. J'ai donc des projets différents comme ceux-ci. Nous sommes ici dans l'application gourmande de la classe Figma. Je peux cliquer dessus et je peux déplacer ça là-bas. En outre, il y a peu d'autres options renommées leads, préférez ce fichier. Ce fichier si favori signifie que si je clique sur ce favori, ce fichier, il va s' afficher ici. Vous pouvez voir les feux préférés. Voici donc mon dossier préféré. Donc, si je veux ouvrir n'importe quel fichier préféré, je peux le faire facilement. Même si je ferme, c'est ça. OK ? Donc, si vous souhaitez modifier l'arrière-plan, cliquez sur l'extérieur et nous avons cet arrière-plan, vous pouvez le modifier par tout ce que vous voulez. Ensuite, nous avons à gauche , vous pouvez voir des pages. Si vous devez cliquer dessus pour voir les pages, vous pouvez ajouter d'autres pages ici. Avant d'y aller, étudions la hiérarchie Figma. Au sommet, nous avons des équipes. Donc, ça va être comme ici. Alors débarquez vos produits partagés XID. Voici mon équipe. Donc, si je le réduit, vous pouvez voir qu'il s'agit de projets partagés. C'est une autre équipe. Vous êtes excité, c' est une autre chose. Donc, si je clique sur Équipe, vous pouvez voir que deux membres sont ici. Il s'agit ensuite des projets qui ont été créés au sein de cette équipe. Ce sont les membres. Ok, donc ce sont les gens qui regardent réellement l'accès à cela parce que ce sont tous mes élèves. Et ensuite, nous avons des paramètres ici. Vous pouvez donc modifier le nom de l'équipe. Les bibliothèques d'équipes activent le plan et la facturation, mettez à niveau votre plan si vous le souhaitez. Parce que certaines fonctionnalités, telles que le partage de bibliothèques ou le partage de ressources, sont en fait une fonctionnalité premium. Vous devez payer pour ça. Bon, revenons donc à la hiérarchie Figma. C'est donc mon équipe. Ensuite, nous avons des projets au sein de cette équipe. Vous avez déjà vu que ce sont les projets, c'est l'équipe. Figma class est un projet foodie app naturel. Ce sont tous mes projets que nous avons des fichiers à l'intérieur de ces projets. Donc, si j'ouvre un projet, ouvrons, par exemple, comme nous l'avons fait. Nous avons donc ces brouillons, qui est un projet, puis nous avons un fichier à l'intérieur. C'est donc en fait mon dossier. Vous pouvez l'avoir. agit en fait d'un fichier, s'agit en fait d'un fichier, c'est le nom du fichier, mon fichier HTML phosphate, puis ce sont les pages qui s'y trouvent. Voyons donc, nous avons des pages. Donc, les fichiers et les fichiers à l'intérieur de ces fichiers nous avons des pages. Nous pouvons avoir dix pages, 20 pages, combien de pages, comme vous le souhaitez. Ensuite, nous avons plusieurs plans de travail sur une seule page. Revenons donc ici. Nous avons donc cette page. Effectuons un zoom arrière. Il s'agit donc d'un tableau d'art. Il s'agit d'un tableau d'art. Et si je veux créer un autre tableau d'art, cliquez sur un tableau d'art pour iPhone. Encore une fois, appuyez sur un de votre clavier, iPhone SE. Et encore une fois, nous allons utiliser une tablette ou ici 11 Pro. Comme vous pouvez le voir ici, ce sont tous mes tableaux d'art en bas. Donc, ou vous pouvez dire cadres. Voici donc mes différents tableaux ou cadres artistiques. Je peux en avoir 50 ou 60 dans chaque page. Donc, comme en ce moment, j' ai sélectionné cette page. Si je vais à la deuxième page, il n'y a rien ici. C'est donc l'équipe de hiérarchie Figma is. Ensuite, nous avons des projets et nous avons des dossiers. Ensuite, nous avons des pages, plusieurs pages. Et puis nous avons beaucoup de cadres et de tableaux d'art. Nous avons donc une seule équipe, nous pouvons également avoir deux ou trois équipes. Normalement, nous avons normalement une ou deux équipes, équipe MAX plutôt que plusieurs projets au sein de cette équipe. Comme vous pouvez le voir, je vous ai montré ici. Cette équipe a donc 12345 projets. Celui-ci a un seul projet. Donc, à l'intérieur de ce projet, si j'ouvre ce projet, mon verre, vous pouvez voir que nous avons plusieurs fichiers. J'ai laissé des fichiers 1234567891011 dans ce projet de classe Figma. Si nous ouvrons ces projets de classe Figma, vous pouvez voir que nous avons plusieurs fichiers ici. Nous avons donc comme, passons à ListView. Nous avons dix projets différents, donc dix fichiers différents ici. C'est un projet que j'ai sélectionné. Voici le dossier. Donc, si j'ouvre un fichier, sélectionnons ce fichier. Le chargement prendra un certain temps. Bon, donc nous avons le dossier ici. Il s'agit de la page, d'une seule page à l'intérieur. Ensuite, nous avons le tableau artistique ou le tableau d' art unique à l'intérieur de ce dossier. Donc, si je clique sur cette section vide ici, je peux voir le nom de ce projet , puis le nom du fichier ici. Revenons donc en arrière. Et si vous souhaitez créer une équipe, vous pouvez créer une équipe. Vous pouvez faire de la vapeur. Créons une équipe et vous pourrez ensuite ajouter vos collaborateurs . Et si vous essayez de continuer, il vous demandera le paiement car il s'agit d'une fonctionnalité premium. Vous ne pouvez donc avoir qu' une seule équipe que je pense pour la version normale sauter pour le moment. Vous pouvez donc voir que cela me montre choisir Professional. 12$ par litre par mois. La confiture de figues coûte 1,3$ par litre et par mois. Je pense que c'est annuellement. Si c'est mensuel, il est d'environ 15$. Essayons donc de fermer ça et de revenir à notre thème. Oh, oups. Il a donc créé une équipe. Essayons donc de le supprimer dès maintenant pouvoir modifier l' icône, tout ce que vous voulez. Voyons les équipes UX. Je dois donc taper le nom pour supprimer cette équipe. OK ? Bon, voyons si j'ai manqué quelque chose. Ok, donc à l'intérieur de cette zone ici, donc si nous avons un panneau de gauche qui est constitué de calques, ressources et de pages, et que nous avons les plans de travail ici en bas à l'intérieur de cette page. Et vous pouvez le voir sur les pages et c'est un tableau d'art. À droite. Vous pouvez voir que j'ai ça ici. Commencez la conversation si vous souhaitez collaborer avec quelqu'un, partager, si vous souhaitez partager ce lien avec quelqu'un, copiez le lien et collez-le. Ou vous pouvez envoyer un e-mail, taper l'e-mail ici, plusieurs courriels peuvent être séparés par des virgules. Si vous souhaitez partager avec plusieurs personnes, je copie normalement le lien et je le partage avec tous ceux que je veux. Bon, alors c'est le présent ou le prototype. Il y a en fait des polices manquantes. Donc, si vous avez une police ou une police de caractères manquante , cela va vous montrer ici root et cela manque dans ce fichier. Ensuite, nous avons ce niveau de zoom, zoom avant, zoom arrière un contrôle de 100  % 0. Ensuite, nous avons un aperçu des pixels, une grille de pixels, une grille de disposition différentes options. Et ils sont au sommet. Nous avons différents outils. Vous pouvez voir ici, c'est le menu. Par ici. Sur Mac, le menu est en haut, ici, en haut ici. Et sous Windows, il est placé ici comme ça. Encore une fois, vous objectez du texte vectoriel, organisez des plugins Et si je vais aux plugins, vous pouvez voir en bas que j'ai géré des plugins. Donc les plugins gérés, je peux désinstaller ou installer différents nouveaux plug-ins ou ce que vous voulez, pourquoi vous pouvez le gérer à l'intérieur. Ce sont mes bibliothèques. Ce sont en fait les styles que j'ai partagés avec différents membres de l'équipe sont des fichiers de conception conçus. Ce sont en fait, vous pouvez dire des styles de couleurs, des textiles, et nous allons beaucoup étudier là-dessus. Ok, donc en haut, vous pouvez voir que ce sont tous mes fichiers ouverts. Donc, si je veux fermer certains fichiers de la hiérarchie Fitbit, alors fermons celui-ci. Icône X. Ce sont ceux que je travaille en ce moment. Je ne vais donc pas vous les montrer parce qu'ils ont signé une NDA de toute façon. Nous en avons donc un, un dossier. Vous pouvez voir qu'il s' agit de pages différentes. Donc, si je clique sur n'importe quelle page, j'ai des calques différents. atouts ici. Les couches sont ici. Vous pouvez donc voir s'agit en fait de cadres. Il s'agit de l'icône du cadre. Ce sont donc des images différentes. Les icônes sont différentes. Ainsi, chaque fois que vous cliquez sur n'importe quelle page, il vous montrera tous les tableaux artistiques, les images ou les calques qui s'y trouvent. Retournons à la maison. Et je pense que c'est tout. C'est plus que suffisant pour que vous puissiez comprendre la nouvelle interface de Figma. J'espère que cette leçon vous a plu. Assurez-vous de continuer à apprendre et nous rencontrerons une autre vidéo d'ici là, prenez soin de vous. Au revoir. 4. Différents panneaux et ce qu'ils font dans Figma: dans cette leçon. Nous allons plonger profondément dans mawr sur l'interface de Sigma et ce que nous pouvons faire Nous sommes ici Différents panneaux, différentes couches affirme des cadres comme ça. Alors commençons maintenant. Vous pouvez voir que j'ai créé cette équipe. C' est mon équipe que toi. Excitant Vous pouvez voir ici. Si vous voulez créer un nouveau projet, vous pouvez cliquer ici Nouveau projet et je vais le nommer Food De Et ce sont différents paramètres de partage. Tout le monde qui vous excite peut s'adresser à vous. Par exemple, si j'invite un autre membre de l'équipe, ils peuvent addict ce fichier. Donc, je vais cliquer sur un projet mort créer afin que vous puissiez voir vos cheveux que j'ai déjà créé Vous pouvez ajouter la description ici Yams, application pour nous, choses comme ça. Maintenant, vous pouvez voir mon dossier. Donc, si nous revenons à fig hma fichiers récents, vous pouvez voir ceci est mon application Donc je vais orteil double clic et l'ouvrir et cela prendra un certain temps parce qu'il est stocké sur le cloud. Voici mon yum zap que vous pouvez voir ici et à droite. Vous pouvez voir, nous n'avons jamais à ouvrir un fichier. Nous avons conçu prototype et pourrait donc ce sont les trois choses que trois panneaux que vous allez voir sur nos cheveux de ce côté, nous avons des couches et des actifs. Donc les couches sont fondamentalement nos toutes ces images. Et à l'intérieur de ces cadres, nous avons différents objets, donc vous pouvez le voir. Nous sommes là aussi. Vous pouvez voir qu'on est là. On a des pages. Donc, à l'intérieur des pages, nous avons des cadres de fil, ignames, application et un gars de style dans les composants. Donc ce sont les trois salopes que j'ai créées dans ce projet. Et vous pouvez voir dans ce fichier et vous pouvez ajouter de nouvelles pages si vous le souhaitez. Tu peux ajouter une nouvelle salope. Et, um, supprimons ce clic droit supprimer. Donc, ce sont les ignames sont ce sont le cadre métallique. Il s'agit d'un composant de guide de style. Donc ce sont trois pages, alors nous avons ces atouts. Donc, les actifs sont fondamentalement d'une composante. Donc, si vous créez un composant, vous pouvez les utiliser encore et encore. Nous récupérerons des composants dans les prochaines leçons afin que vous puissiez voir maintenant que nous avons beaucoup de composants différents. Donc, si un composant drag, je peux facilement le glisser et le déposer n'importe où dans mon projet. De même, cela vous montre que vous cliquez sur cette flèche, elle va vous montrer à nouveau les pages et parfois elle est cachée. Donc si vous avez quelque chose comme ça et que vous ne trouvez pas où sont mes bébés ? Vous allez cliquer ici. Ensuite, nous avons sur la droite. Nous avons quelques styles locaux l'air. Les textiles que j'ai créés. Ce sont quelques styles de couleurs que j'ai créés. Vous pouvez les utiliser encore et encore. Et voici le tribunal. C' est un prototype et c'est du design. Donc, dans le prototype, vous alliez prototyper votre application comme celle-ci. Tu peux voir quoi ? Ici, ils sont beaucoup de flux différents qu'il va couler de l'un à l'autre. Nous pouvons également, si vous cliquez à l'extérieur ici, vous pouvez voir que nous avons des options d'appareil. Vous pouvez cliquer sur iPhone Pro, euh, Max iPhone 11. Tous ces différents appareils dans lesquels vous voulez montrer votre prototype. Et quelle est la morale ? Vous allez utiliser la couleur de fond pour ça ? Um, cadre de départ. Nous allons commencer par la journalisation. Ce sont donc les options que nous avons sur le design. Nous avons des styles locaux, la couleur de fond. Nous avons déjà discuté de l'eso. Ce sont des choses différentes que vous allez aller au tribunal. Gord est en train de montrer quel est le cordon sur cet article ? Donc, si nous cliquons ici, vous pouvez voir qu'il s'agit d'une escorte CS pour les webs, site Web R us et le droit pour les appareils Apple. Ceci est Android Court pour cet objet que j'ai sélectionné sur la gauche. Vous pouvez voir que c'est l'icône. Cette icône va représenter les cadres. Donc, chaque fois que vous avez des cadres, vous allez voir cette icône ici et tout ce qu'elle contient ici. Donc, ce sont en fait des composants ah. Il a donc cette forme de diamant. Donc toutes les formes de diamant sont des composants que nous avons ce Ce sont des groupes différents. Vous pouvez voir qu'on est là. Tu peux les ouvrir. Vous pouvez également ouvrir ces composants. Nous reviendrons aux composants plus tard. Mais c'est ainsi qu'il s'agit d'une forme d'exemples. Toutes ces icônes qui montrent qu'il s'agit de ce type hors couche comme vous pouvez voir les paramètres de profilage est un texte. Leah. Donc, il faut que vous étiez là. Ce sont donc des paramètres différents. Par exemple, comme ce logo. C' est un facteur. Donc, il a un logo vectoriel par ici. Eso toutes ces choses différentes. Donc, si nous cliquons sur l'image, voyons, voici l'icône de l'image afin que vous puissiez voir que c'est votre image que vous pouvez instantanément trouver où se trouve votre fichier. Vos images, votre texte est de sorte que vous pouvez les reconnaître par ces petites icônes sur la gauche. Maintenant, si vous voulez déplacer ce projet dans un autre projet, par exemple, en ce moment, il est en cours d'emploi. Je veux le déplacer. Vous allez cliquer ici, passer au projet, et je vais le déplacer vers l'application foodie. Donc maintenant, vous pouvez voir qu'il a été déplacé vers l'application gastronomique et maintenant il est donc de dire de foodie ab slash pouces vers le haut. D' accord. De même, vous pouvez afficher l'historique des versions Quel était l'historique des versions ? Comment j'ai édité tout ce feu que vous pouvez voir ici. Et voici ceci est un historique de version de mes 30 jours précédents, je peux revenir à n'importe qui . Donc, si je clique ici, il va à la pointe du dos suisse sur le dernier. Alors n'essayons pas. Vous pouvez également masquer l'historique des versions, les styles publiés et l'exportation des composants. Ces conceptions font double emploi avec ce projet. Renommer ou supprimer, la plupart du temps nous devons renommer. Alors vous cliquez ici. Je peux l'amener aux ignames. Recettes, recette Soyez à quelque chose comme ça. Donc, vous pouvez voir que c'est comme ça que vous allez renommer. Ok, donc c'est un peu éteint. La familiarité avec cela interfère. Passons à la prochaine leçon où nous allons plonger dans ces outils et voir quels sont ces outils et comment nous pouvons les utiliser. Passons donc à la leçon suivante. 5. Utiliser des encres et des planches: Maintenant, dans cette première leçon, nous allons commencer, créer un nouveau cadre ou tableau d'art, et nous allons le manipuler et voir ce que nous pouvons en faire. Alors allons chercher Stockett maintenant. Je vais passer à mon projet de pratique et je vais créer un nouveau fichier et il va être sans titre par souillé, donc cela prendra du temps pour Seigneur ou ici comme ça. Maintenant, nous avons cette toile vierge. Si vous voulez changer la couleur d'arrière-plan, utilisons-nous comme celui-ci, et vous pouvez voir ici nous avons des calques, des actifs et des pages. Si vous pouvez voir par le fichier leur Hizb âge un. Et si nous cliquons ici va me montrer plus de pages pour que vous puissiez ajouter plus de salopes ici comme ça. ce moment, je suis à la première page, et la première chose que je vais faire, c'est que je vais me moquer des orteils. Ce cadre ne cliquez pas ici parce que nous avons tranché ici, un autre outil caché. Cliquez donc sur le cadre et vous pouvez dessiner votre propre cadre, par exemple, comme celui-ci. Donc c'est en fait les vainqueurs 3 42 par 5 80 Et si nous cliquons à nouveau sur le cadre ou appuyez sur la touche F sur le clavier, il va nous montrer différentes options de téléphone ou concevoir différentes tailles et cadres et tableaux d'art pour iPhone. Alors nous l'avons fait. Et juste ici, par exemple, si nous cliquons dessus, c' est la taille standard android. Et si nous voulons créer plus sont plus d'écrans. Ici, nous allons à la pointe de votre cadre et créons un cadre de tablette ici. Donc tablette beaucoup de sorte que vous pouvez voir cette différence entre les tailles et qui est effacé un autre et encore, F et je vais aller bout de gaz arrêt, et je vais concevoir un site Web. Donc je vais cliquer ici sur un bureau. Voici donc comment vous pouvez créer plusieurs cadres ou tableaux d'art différents. Vous pouvez double-cliquer ici sur le dessus, et il va montrer que nous sommes ici, par exemple, que stop art board. Vous pouvez les renommer ou vous pouvez, hum, domestique ou ici, euh, c'est Android. Notre seigneur. Assurez-vous de toujours les renommer, car parfois il y a plusieurs ou plusieurs tableaux d'art, et vous oubliez ce qui est le tableau d'art sur lequel vous travailliez. Donc je nus sont livre. Donc vous pouvez voir ici nous avons trois tableaux d'art différents et si nous cliquons ici, vous pouvez voir que nous avons différentes options sur la droite. C' est notre design. Nous avons raison de savoir onglet conçu. Et à gauche, nous avons des pages et dans la première page, nous avons trois livres d'art. Donc, si nous cliquons sur l'endroit où ceci est vide, nous n'avons rien ici sur. Si on clique dehors de quelqu'un, quoi que ce soit, c'est notre dossier. Alors nous allons le renommer toe Appelons ça des cadres et des livres d'art. C' est ainsi que vous pouvez créer différentes œuvres d'art. Maintenant, si vous voulez créer quelque chose pour lequel n'est pas répertorié dans les cadres ici, il n'est donc pas répertorié. Par exemple, nous avons cette montre Apple. Nous voulons créer quelque chose pour Motorola G montre ou quelque chose comme ça. Donc, nous allons aller de la tête à ce matériau de conception de matériaux ou êtes-vous re sources Slash dispositifs Maintenant, par ici, vous pouvez voir que nous avons des plates-formes. Nous avons des rapports d'aspect de dimension d'écran peuvent se cacher dans les DP. Donc c'est ce que vous allez utiliser. Donc, euh, la plate-forme, si on clique ici, vous pouvez voir que ce sont des fenêtres. C' était X sur. C' est Mac. Voici l'Apple Watch. Vous pouvez voir ou entendre 38. 42 femmes. Alors si nous allons orteils ici pour que vous puissiez voir ceci est la montre LG G. Donc, il est 1 87 par 1 97 et puis nous avons 2 13 par 2 30 Donc si nous sommes en train de concevoir pour quelque chose comme ça pour une montre qui n'est pas susciter ici, par exemple, comme vous pouvez voir Moto 3 60 Je peux utiliser ces tailles à 41 par 2 44 Donc je vais Retournez et je vais vous donner un coup de pied ici. Onda l'a mis à 42 par 2 44 Quelque chose comme ça. Donc il waas 2 40 une morsure de 44 à 41 par 2 44 2 41 par 2 40 pieds. Donc, vous pouvez voir maintenant ceci est votre tableau d'art pour cette montre LD bleue ou Motorola de sorte que vous pouvez utiliser ce design à un seul orteil quelque chose Donc c'est ainsi que vous créez différentes tailles et cadres et tableaux d'art pour votre travail de design. Donc, si vous cliquez sur ou ici vous pouvez voir, nous avons différentes options. C' est la valeur X, qui est ? Cela montre que c'est ce qu'il est loin d'ici. Si vous vous déplacez ici comme ceci, vous pouvez voir les valeurs X et Y sont en train de changer. On sait quoi. Nous ne sommes pas préoccupés par les valeurs d'accent de ce cadre de bordure artistique. Nous sommes surtout préoccupés par ce poids et cette taille. Vous pouvez également verrouiller les contraintes. Donc maintenant, il va orteil croître en proportion. Ok, donc 4 50 par exemple, si je te 600 va aller comme ça, ça va grandir en proportion. Retournons l'école. Allez et ou contrôlez Z Donc ce sont des options pour la tradition. Je pense qu'on n'a pas besoin de lire ça de toute façon. Pourtant, nous pouvons utiliser ce rayon de coin si vous voulez orteil utiliser la radio de coin. Il s'agit du contenu du clip. Donc, quoi que vous allez orteil ont ici, par exemple, cela vous pouvez voir maintenant il est couper mon contenu. Donc, j'ai dessiné un rectangle sur ce et il montre Haftar a assisté. Et si je clique ici et supprime cela, vous pouvez voir que je peux voir au-delà de ce tableau d'art en ce moment, il n'est pas couper mon contenu. Il s'agit donc de contenu de clip. C' est très important et je pense que c'est tout. On n'a pas besoin d'orteils. Si vous voulez aligner ces tableaux ? Vous allez appuyer sur Maj ou maintenez votre touche d'expédition enfoncée et cliquez et sélectionnez tous ces tableaux en sélectionnant leurs noms. Et toi, tu peux arrêter une ligne comme ça ? Vous pouvez également utiliser l'étude vers le haut qu'ils vont utiliser avoir un peu d'espace autour d'elle. Donc, si vous avez sélectionné plus d'objets, vous pouvez voir plus de deux objets, vous pouvez voir que nous avons cette option d'espacement multiple Um, dans la figure Ma, c'est une fonctionnalité vraiment cool. Vous pouvez ajuster l'espace, par exemple. Je veux avoir quelque chose comme un écart de 80 pixels entre eux. Donc c'est comme ça que tu peux avoir ça. Il s'agit donc de cadres et de notre planche, comment vous pouvez les organiser, comment vous pouvez les gérer. Quel est le contenu de ce clip et ce qu'il fait ? Je pense que vous ne l'avez pas assuré. Passons à la leçon suivante et creusons plus dans la composition 6. Outils de conception UI en ligne de Figma: cette vidéo va être sur les mottos de figues. Alors commençons et apprenons quels sont les outils ici et comment nous pouvons les utiliser. Donc, d'abord, on va faire un cadre. C' est notre tableau d'art. Alors appelons-le, hum, hum, cadre d' entraînement. Ok, donc nous avons ce cadre, et si vous voulez raciner, déplacez-le. Ceci est votre outil de sélection ou déplacé tout. Vous pouvez le déplacer ici. Donc quoi que vous dessiniez, par exemple, j'ai dessiné quelques enchevêtrements ici. Si je veux le déplacer, je vais utiliser ce mouvement. Dit que c'est en fait la valeur par défaut ajoutera un peu plus bas ici. Donc, si vous voulez mettre à l'échelle quelque chose par proportion, vous allez sélectionner ce gay ou échelle Dole. Et maintenant, vous pouvez voir que vous pouvez le réduire ou le monter à l'échelle chaque fois que vous importez des icônes dans Sigma AB. Je pense que j'ai préféré utiliser scale dole parce qu'il va garder la proportion et ne va pas gâcher vos icônes ici. Assurez-vous donc de l'utiliser lorsque vous allez mettre à l'échelle quelque chose en proportion comme celui-ci. Par exemple, des images ou quelque chose comme ça, que vous voulez échelle des orteils en proportion. Maintenant, nous avons à nouveau cadre double et tranche à tranche est que je vais revenir à la tranche une fois que j'ai quelque chose ici. Donc nous allons d'abord discuter de la forme. Avons-nous le rectangle, la ligne, la flèche, ellipse, étoile mal disparu et l'image place. Donc, commencez par rectangle afin que nous puissions placer un rectangle ici. Il suffit de cliquer sur ce glisser et de partir ici. Vous pouvez aussi voir que nous avons un rayon par ici. Donc, si vous voulez oh, sélectionnez rayon de coin que vous pouvez sélectionner glissé par ici. Ou vous pouvez également mettre un rayon ici, par exemple. J' ai mis huit existe en ce moment et vous pouvez changer l'échange de couleur la couleur ici physique. C' est le remplir avec la couleur. Donc ici, nous avons un joli gros bouton et là encore, ces mêmes toutes ces options sont en fait des options. Options standard au X Y positionnant Britain High Tradition Gordon Radius. Tu peux voir si j'essaie de le changer ici, ça va te changer de tête. Vous pouvez également faire glisser comme ceci pour changer le rayon d'angle. Et encore une fois si nous cliquons ici, nous avons des coins indépendants. Vous pouvez avoir différents coins de SIDA 20 par exemple, comme ceci ou PDG comme ça. Et vous pouvez également avoir une option de plus, qui est notre lissage de coin US afin que vous puissiez avoir un lissage de coin comme celui-ci que vous avez vu dans beaucoup hors d'un mac O R nous. Notre iPhone APS vous pouvez voir ici. C' est une bonne option. Vous pouvez également ajouter des effets différents Effical ici. Si vous voulez ajouter de l'ombre portée, vous pouvez voir que nous avons différents effets. Nous allons contourner ces effets d'AVC, AVC et effets, littéraux. instant, vous devez vous inquiéter à ce sujet. Sentez des couleurs que vous pouvez voir ou entendre. Nous allons à nouveau orteil aller profondément dans Phil et solide indulgent tous ces ints gourmands. Mais en ce moment, nous discutons de cet outil de rectangle. Donc ici nous avons l'outil d'angle de secte et, euh, vous pouvez je vous ai déjà montré toutes les options que nous pouvons avoir avec ça. Donc, une fois que nous avons le sec enchevêtrement Dole, peur et un autre rectangulaire ici comme celui-ci, et il se chevauche comme ça. C' est ainsi que ces dirigeants sont arrangés. Donc tu peux les déplacer. Ok, alors changeons votre orteil Sculler quelque chose comme ça, quelque chose comme ça. Donc je vais faire un truc comme ça de toute façon, alors maintenant je vais retourner à l'outil de coupe. Donc, si je veux avoir une image ou quelque chose sur elle va être, nous sommes ici comme ça pour que je puisse utiliser l'outil de tranche, et je peux cliquer sur l'exportation, et il va exporter Onley cette tranche. Donc quoi que ce soit à l'intérieur de cette tranche, je vais l'exporter, et je vais aller aux pieds. Hum, sauvegardons ça sur le bureau. Laisse-moi te montrer ce que ça veut dire. L' école. C' est des hauts. Donc ici, nous avons tranché de sorte que vous pouvez voir que c'est tranche. Donc c'est, euh, l'avortement que je voulais ici. Donc, c'est la fonction off slice outil. Ce n'est pas très pratique, Mais parfois dans la conception web, vous pouvez utiliser quelque chose comme ça. Supprimons cette tranche ici. D' accord ? Maintenant, supprimons ces deux-là. Ensuite, nous avons menti à vous pouvez faire glisser votre ligne comme ceci, et vous pouvez changer votre épaisseur orteil. Cinq. Il va au centre, à l' intérieur ou à l'extérieur. Donc ce sont des paramètres différents avec un nouveau centre et allons, euh, faire 50. Mais cet échange sa direction et le changement de respiration tenant le décalage du sein, del' avoir dans différents angles de rue comme celui-ci. Donc, si vous voulez qu'il soit droit dans un certain angle, vous allez tenir les orteils et appuyer sur Shift comme ça. Donc nous avons ceci et passons à cette annonce. Vaste te frappe. Nous pouvons avoir différents coins ronds. Vous pouvez voir ce que les cheveux autour, coiffer un espace carré, et puis nous avons menti. Adel, puis on a des flèches triangulaires. Donc toutes ces options différentes et nous avons Dash et Gap. Alors, euh, allez. Quoi ? Donc, c'est en fait, 1er 1 est tiret et second est écart. Donc, nous devons faire le coma. Voyons si nous l'avons fait, nous voulons augmenter l'écart. J' ai donc utilisé 25 pour l'écart. Vous pouvez voir qu'il y a beaucoup d'écart entre ces plats. Le métal est en fait l'angle par ici. Ceci est joint Angle Middle est en fait angle très pointu. Et si vous voulez avoir autour de l'angle ici, donc c'est en fait la ligne, et il a beaucoup d'options différentes. Laissez-nous les civilités et revenons aux pieds Ligne simple. D' accord. Ainsi, vous pouvez également enregistrer ce style et vous, les styles Congar et le style adéquat pour le coup. Et vous pouvez le réutiliser dès maintenant, nous allons à la pointe. Discuter sur les adoptions Cette ligne connexe. Orteil. Donc, Lyinto, c'est notre outil de ligne. Vous pouvez changer la couleur, tout ce que vous voulez. Par exemple, comme celui-ci, je l'utilise normalement dans les liens. Par exemple, si j'ai une taxe ou ici sur ce lien quelque chose comme ça. Ainsi, vous pouvez utiliser des lignes pour les séparateurs ou n'importe quoi. De même, nous avons total Il est à nouveau un outil très agréable. Et vous pouvez voir en ce moment si vous dessinez une ligne sur l'écran éloigné, il va être très petit. Donc, plutôt que d'en utiliser un, vous pouvez en utiliser quatre. Donc c'est une épaisseur. Donc, si vous essayez de réduire l'épaisseur, ça va être quelque chose comme ça. Donc, si vous voulez un animal plus gros, vous pouvez utiliser plus d'épaisseur comme celle-ci. Je pense que quatre ou trois, c'est bien. Beau regard. Tu as été changé du tout. Partout où vous voulez aimer ça à nouveau. Si vous voulez aller avec des options avancées, vous pouvez toujours aller ici. Triangle Arrow Oh, sont couchés du tout. Oh, ne sont pas quelque chose comme ça. Il est un jeu qui va orteil disparaître tout autour ah, carré couché du tout sur Pas si vous pouvez voir qu'il est converti à dire ligne simple et il n'y a pas de flèche sur une extrémité. Donc c'est très étrange pour moi parce que je voulais retourner à l'autoroute et maintenant c'est une ligne. Donc nous allons créer un autre Arrojo ici comme ça et pas Sam l'épaisseur comme ça . Donc c'est notre arable. Donc, les options sont presque les mêmes, comme cet outil de ligne, et c'est tout. Vous pouvez changer la direction quand vous le souhaitez. Oh, c'est l'arable. Ensuite, nous allons aller orteil ellipse élections essentiellement cercle. Donc, si vous voulez l'obtenir dans une proportion, maintenez votre quart de travail et il sera parfaitement autour comme ça. Donc je tiens maintenant et appuie sur la touche Maj. Donc c'est mes lèvres, et vous pouvez voir si je clique ici. Il montre arc de sorte que vous pouvez cliquer ici et continuer à faire glisser comme ceci et vous pouvez créer un graphique. Vous pouvez voir qu'on est là. Graphique ou graphique. De même, vous pouvez également modifier ceci pour créer un graphique un cercle, un graphe. C' est donc très facile dans la figue. Miley a adoré cette fonctionnalité. C' est vraiment, vraiment intéressant. Alors allez ici à l'arc et continuez à bouger comme ça afin que vous puissiez changer le début aussi. Donc si vous voulez avoir quelque chose comme ça ici, vous pouvez avoir quelque chose comme ça. Ils sont plus sculler comme ça. C' est vraiment cool fonctionnalité. Et aussi ce rapport il va orteil Changez-le comme ça. Ces options sont aussi nous sommes ici. Donc c'est l'angle. Angle de départ moins 90. Euh, c'est, euh c'est aussi la probation, je pense, et c'est le problème technique nécessaire. Donc je vais retourner à quelque chose comme ça. Ouais, et nous allons utiliser 100 coins par ici. Et c'est ainsi que vous créez un très beau graphique circa en utilisant juste un tabouret fui. Donc c'est un tabouret pour les lèvres. C' est vraiment génial. Vraiment puissant. J' adore vraiment ça. Vous pouvez voir ici vous pouvez créer beaucoup de choses. Par exemple, comme celui-ci, hein ? Tout chaud C'est mon omelette. Ok, donc on a un polygone. Un polygone va à nouveau avoir des coins différents. Vous pouvez augmenter les coins. 10 56 Tout ce que tu veux, les œufs sont partis tout ce que tu veux. Et vous pouvez également changer le rayon de coin ici. Vous pouvez changer le nombre à partir d'ici. Ce sont de très bons contrôles. Je n'ai pas vu ces contrôles dans n'importe quel orteil design. C' est vraiment cool. Sigma a beaucoup de fonctionnalités qui, je pense, font défaut sur d'autres outils de conception. Peut-être qu'ils l'auront dans un ou deux ans et que Sigma a séché Maintenant, euh alors nous avons surpris que ça va aller aux pieds. Créez une étoile en maintenant la touche Maj. Tu peux avoir une étoile. Quatre jardiniers, trois coins. C' est un outil ninja et, euh, cinq coins, six coins. Donc je vais rester avec cinq coins et ça va être, je pense, l'angle des coins. Alors augmentons ça. Donc ça va être une très belle star pour mes filles. Je pense qu'ils vont adorer cette étoile parce qu'elle a des choses que vous pouvez voir sur. Vous pouvez également changer le rayon ou ici comme ça. Donc, c'est un très beau être démarré. Mes médecins vont vraiment l'adorer de toute façon, donc c'est en fait l'angle, comme vous pouvez voir où ici. C' est ce qu'on appelle une voiture. C' est un ratio. Donc, c'est en fait comment vous pouvez faire un grand vous pouvez voir le style de fait gras ou une étoile mince tout ce que vous voulez. Non, ça ressemble à une étoile de mer. C' est donc un excellent outil. Donc c'est une star. Vous pouvez les créer. Donc, à propos d'une image de lieu, nous allons regarder l'image de lieu dans la leçon suivante parce qu'elle a beaucoup d'options. Passons donc à la leçon suivante pour discuter, placer, placer, images et crapauds fumés ou figment. 7. Outil de caractères dans Figma: dans cette vidéo. On va parler d'outil de texte par ici. Donc juste besty ou texte, cliquez sur ce texte et vous pouvez faire glisser quelque chose comme ça pour créer une zone de texte ici. Tokyo, Le paragraphe. C' est un paragraphe, LA, bla, bla, bla, bla, bla. Donc vous pouvez voir maintenant qu'il va à l'intérieur de ce conteneur. De même, vous pouvez également utiliser quelque chose comme ça ici, sorte que vous pouvez voir ce sont les options sur la droite. Nous avons donc des options de texte. Il s'agit d'une police formée, qui est Roberto. Vous pouvez créer des modifications à tout ce que vous avez sur votre installation sur votre système. C' est ah, taille de type. Hum, donc pour l'instant on n'a pas d'options. Laissons clair. Drew est celle-là. Ok, donc nous voilà, elle était de cette taille. Ok, donc nous avons un conseil moyen régulier. Ce sont des styles différents à partir de ce texte. Ensuite, on a l'auto. C' est essentiellement la hauteur de la ligne. Je peux le changer à 1 30 Ou je peux mettre par exemple, 200% ici. Quelque chose comme ça. Donc c'est fondamentalement la différence entre les deux lignes, le sexe entre les deux lignes, et vous pouvez voir ce qui avait ces lignes bleues ? Il s'agit en fait de la distance entre ces lignes bleues en dessous de votre prochain, qui est marqué la ligne de base. Ensuite, nous avons l'espacement des lettres. Vous pouvez avoir 5% meilleur espacement ou tout ce que vous voulez. On est là. Ensuite, nous avons l'espacement des paragraphes. Donc, si nous avons plus de deux paragraphes, par exemple, changeons-le. 100 % d'espoirs. Changeons ça. 100% et excusez 2%. Et nous aurons un autre paragraphe. Ou ici. Comme ça ? Oui. Ici. C' est une autre fille. Ce sera cette casquette et non, Si j'essaie d'utiliser cela, il va orteil. Donner un certain écart entre ces deux paragraphes. Il est déjà détecté que j'ai sein et tiroir ici. Et ça va être le paragraphe suivant pour que je puisse avoir plus d'espace dans deux paragraphes et, euh, m' échapper. Et c'est comme ça que ça va. C' est en fait mon conteneur. Donc je peux me déplacer comme ça pour avoir plus d'informations à l'intérieur. Ok, donc cela montre que c'est une taille fixe. Cela montre que c'est la hauteur automatique. Donc c'est encore du sang à ce fond de ce texte ici. Et puis nous avons hors de lui. Donc, quand nous cliquons dessus, il va se déplacer autour de ça, il va avoir son propre verdict. Donc, c'est bon lorsque vous créez des boutons mais dans un paragraphe, vous allez utiliser corrigé comme ceci. Retournons l'école, Kamanzi. Et maintenant, nous avons différentes options hors alignement milieu aligner haut ligne de bas qu'il va avoir. Par exemple, si j'ai quelque chose comme ça, un conteneur plus grand, je peux déposer une ligne que je peux l'aligner au milieu de ce conteneur. Vous pouvez voir cette ligne bleue. C' est un conteneur et je peux également l'aligner au bas de ce conteneur Donc cela dépend de la façon dont je n'obtiendrai pas votre ligne. Ensuite, nous avons centre à gauche et à droite une ligne du texte. Il y a donc un alignement des enjeux, à droite, à gauche. Donc, c'est fondamentalement l'alignement dans ce conteneur et c'est l'alignement du texte à partir de paramètres de hauteur d'ordre bizarres et différents. Comment cela comment ce conteneur sera ici et puis nous avons quelques options plus comme vous pouvez voir où ici quelques options plus sont comme nous pouvons le justifier ici que nous avons sous-jacent sur. Alors nous n'avons rien de ce que nous avons. Frappe quelque chose comme ça. Paragraphe dans Dent. Si vous voulez conclure un paragraphe comme celui-ci et le début du paragraphe, euh, alors nous avons des cas différents. En majuscule. En minuscule. C' est le cas de titre, et c'est aussi serré que je sais sur ces portes formes sensibles et les espèces capitales sont espacées. Donc ce sont différentes options qui sont le fort. Les options avancées sont des options de type ouvert. Donc, en ce moment, vous pouvez voir que j'ai sélectionné ce téléphone rasa et vous pouvez voir ce Typhus a espacement des majuscules et des formes sensibles à la casse afin que vous puissiez avoir ces options cliquez si vous voulez les utiliser. Par exemple, si j'essaie d'utiliser l'espacement des capitaux ici, la guerre est proche, par exemple, comme ceci. Alors regardez de près si j'essaie d' utiliser cet espacement majuscule pour voir l'espacement des capitaux activer l'espacement des capitales. De même, nous avons ces styles de numéros de style. Donc, si j'essaie de vous utiliser 123456789, quelque chose comme ça. Donc vous pouvez voir que nous pouvons avoir ce style de numéro d'ami. Ce sont encore des options différentes, donc ce sont en fait des options sur les faces de type ouvert. Vous pouvez voir qu'il existe des options stylistiques. Espacement horizontal, dénominateurs de fraction rusés. Je pense que nous ne voulons pas utiliser tous ces éléments, mais je pense que vous devriez savoir que ce sont les options disponibles étaient ici. Donc, si vous êtes un geek typographique, vous pouvez utiliser ces ensembles stylistiques ou options ici. C' est donc tout au sujet de cet outil fiscal. Et, euh, je pense que vous comprendrez ce que ça fait et comment vous pouvez changer vos quatre tailles de style. Espacement différent entre les lignes. Différents espacements entre les paragraphes, comment il va se comporter. C' est la hauteur automatique. Des choses bizarres comme leur alignement fiscal à l'intérieur du conteneur ou l'alignement des ponts sur le texte lui-même. C' est donc tout au sujet des couches Dex. Si vous avez des suggestions ou des améliorations dans le cours, vous pouvez toujours féliciter, et vous pouvez toujours discuter avec moi. Si vous ne comprenez rien, vous pouvez me poser des questions. J' espère que vous avez apprécié cette leçon. Passons à la leçon suivante 8. Utiliser l'outil Plume pour créer des formes: dans cette vidéo, nous allons en apprendre davantage sur l'outil Ben de Sigma et comment nous pouvons créer différentes icônes de formes ou différents types de choses à l'aide de l'outil de stylo. Donc, c'est essentiellement pour essayer de sorte que vous pouvez appuyer sur B et ici nous avons la portée et juste cliquer et traîné retirer des lignes droites comme ceci, et nous retournons orteils le premier à avoir cette forme, il était navire, et vous pouvez voir en ce moment montre que nous avons un AVC. Et c'est l'esprit de la course. Donc, c'est cliquer sur fait. Et c'est votre forme en ce moment, vous pouvez l'agrandir. Vous pouvez modifier l'épaisseur de sa ligne d'épaisseur. Vous pouvez également ajouter remplissage, couleur, remplissage. Fais-le comme ça. Ok, donc si vous n'avez pas de remplissage de couleur, vous pouvez double-cliquer à l'intérieur de cette forme sur ce vaisseau, comme ici, et nous sommes de retour dans l'outil de stylo plus pour voir où nous avons été ici. En fait, c'est Ben Tool et c'est des seaux d'Espagne. Donc, si vous cliquez sur seau de douleur et vous pouvez cliquer ici, il est à nouveau faire la même chose que nous avons fait pour remplir ce vaisseau et Si vous allez à ce Bendel, il va réellement plier les orteils ces coins. Donc, si vous cliquez dessus, vous pouvez voir maintenant nous avons bougé le coin ici comme ça. Donc nous sommes ici comme ça ici, comme cette commande ou contrôle z pour revenir en arrière afin que vous puissiez voir maintenant que nous avons des coins pliés. Donc, si vous voulez changer un coin ici, vous pouvez à nouveau cliquer ici. Une fois que vous avez sélectionné ceci et il va revenir à la forme qu'il waas. Revenons donc à l'outil de travée. Revenons à l'outil de déplacement. Donc, nous allons cliquer sur ce mouvement et nous sommes Nous pouvons également déplacer ceci notre, par exemple, nous avons ce Joffe ou quelque chose comme ça. Nous pouvons également déplacer ces poignées orteils ont la forme de flexion à nos besoins, par exemple, comme ceci. Et, hum si nous voulons bouger, fait juste cette poignée, par exemple, je veux cette poignée. Je ne veux pas que cet orteil manié bouge comme ça, vous pouvez voir maintenant si on le déplace dans cette direction, il bouge. Mais si j'essaie de le déplacer dans la destruction, il va se déplacer avec cette seconde poignée. Donc, vous allez appuyer et maintenir la touche d'option Archy Archer pour déplacer cela sans déplacer le 2ème 1 que vous pouvez voir ou entendre comme ceci, par exemple. Je veux avoir quelque chose de droit comme ça, vous pouvez le voir maintenant, si nous voulons faire de même, je peux revenir ici comme ça à nouveau. Si j'essaie de déplacer cette poignée, elle va bouger. Ils les ont achetés. C' est ainsi que vous pouvez déplacer ces poignées. Vous pouvez opter pour l'option de maintien ou sont de déplacer le seul. Vous pouvez également les déplacer autour de cette poignée entière. Donc c'est un point d'ancrage pour que je puisse le déplacer partout où je veux. Je peux créer n'importe quel type de facteurs comme celui-ci. Je peux enlever le coup. Je peux ajouter différents effets comme l'ombre et tout. Tout ce que je veux. Oh, je peux changer son folliculaire. Et c'est la méchante chose que tu peux faire avec Bendel. Supprimons donc tout ce vecteur et ce que je vais faire est par exemple, j'ai ce vaisseau, par exemple. J' ai des lèvres. J' ai donc entendu cette Ellipse. Ok, Donc si je veux entrer dans l'humeur de la bataille et que je veux changer quelque chose dans cette ellipse, je vais double-cliquer dessus. Et vous pouvez voir maintenant nous sommes à nouveau dans ce vecteur ah amarré. Donc nous avons ce stylo pour descendre ici. Et si je veux ajouter plus de points d'ancrage ici, donc si je veux où un ici, nous allons appuyer sur l'évasion. Et un, nous sommes ici Press escape parce que nous ajoutons juste et adieu solo Hit one ici, Skip. Et un par ici et le saut. Maintenant, je vais aller bouger, Tool, et je vais les déplacer, par exemple, comme celui-ci, je vais le déplacer à l'intérieur. De même, celui-ci Oups. Je vais retourner bouger, Tool. C' est comme ça, comme ça. Vous pouvez voir ce que j'essaie de faire ici. Donc, de cette façon, vous pouvez créer différentes icônes si vous le souhaitez. Par exemple, si je retourne à gérer, je peux créer et d'autres lignes ici. Bougez-le comme ça. Ça, ça, comme ça. Comme ça ici, comme ça. Donc, nous y allons et passons à l'objectif de terrain à nouveau. Allez dans l'outil de seau et je vais sélectionner une autre couleur. Et je vais remplir celui-là aussi. Donc encore une chose, que je pense que j'ai oublié ici, si vous voulez avoir quelque chose de courbé, par exemple, si vous avez un outil de stylo, vous pouvez cliquer ici et ne laissez pas votre plus juste glisser et vous aurez eu angle. Donc, si vous voulez avoir eu lieu angle, vous pouvez faire quelque chose comme ça. Donc, chaque fois que vous voulez un angle de fille de carte, vous pouvez faire quelque chose comme ça. Donc, ce sont les bases de ce plan pour vous pouvez créer des icônes. Je ne recommande pas que vous continuiez à créer différentes icônes en utilisant le tout passé. C' est une perte de temps que je pense que vous pouvez utiliser. Vous devez utiliser déjà l'icône de construction qui sont standard pour n'importe quel appareil américain ou Android. Il en est ainsi sur vos sites Web. Vous pouvez également acheter des icônes premium. C' est vraiment une perte de temps si vous continuez à créer des icônes à l'aide de cet outil de stylo. Eso a gagné. Je suis parti. J' ai surtout réussi avec mes étudiants. C' est cette forme comme ici ? Celle-là. Alors bougeons ceci d'abord, nous allons construire un rectangle comme celui-ci, et nous aurons des coins arrondis de 50 comme ça. Ensuite, nous allons utiliser notre outil de panoramique et créer quelque chose qui fait double clic dessus. Donc nous n'avons pas de poignées ici. Maintenant, créez Pento. Vous dépensez outil, et nous allons devoir ajouter une petite annonce ici. Espoirs Qu'est-ce qui se passe ? Mm, comme ça. Comme ça. C' est ça. Ok, donc on a créé une annonce ici. Remplissons-le avec la même couleur. Donc maintenant, vous pouvez voir ici que nous avons un rayon de coin réglé à 50. Donc je vais l'utiliser pour avoir quelque chose comme ça. Utilisons-le. OK, alors nous allons cliquer. Cliquez sur Échap , touche Échap. Et c'est comme ça que nous avons une très belle icône hors bulle de la parole. Vous pouvez voir la parole, mais bien, utilisons la décoloration. C' est ainsi que vous pouvez créer et manipuler différentes formes et différentes, différentes. Vous pouvez créer différentes icônes simples en utilisant fig MMA. Je pense que c'est tout. Je ne veux pas que vous créez une icône très unique ici, mais je voudrais vraiment ajouter un exercice où vous pouvez créer quelque chose comme ça et vous familiariser avec ce mental. J' espère que vous avez aimé utiliser cet outil d'interdiction, et si vous avez des questions, vous pouvez toujours me demander, Passons à la leçon suivante. 9. Mise à jour d'image: dans cette vidéo, nous allons regarder comment utiliser le lieu, l' image, l' outil et Sigma et peut-être quelques mortels. Maintenant, allez ici et lâchez place, image ou le vaisseau de commandement ke ou de soins de navire contrôlé. Et vous pouvez voir que je vais sélectionner toutes ces images différentes ou ici. Alors, nous allons comme celui-là. Celui-ci, j'appuie ou maintiens la touche de contrôle Commander pour avoir plusieurs sélections. On dirait celui-là, celui-là. Et sélectionnons, hum, celui-ci et je vais appuyer sur ouvert pour que vous puissiez voir maintenant j'ai cinq images et continuer glisser comme ça partout où vous voulez placer quelque chose comme ça et Sigma est en train remplir tout par son propre. J' adore vraiment cette fonctionnalité. Continuez à glisser et c'est tout. Donc, vous pouvez voir que c'est comment je peux créer sur l'image colledge comme ceci. C' est vraiment cool fonctionnalité Et encore une chose. C' est ainsi que vous pouvez placer des images. Et si vous avez quelque chose, par exemple, dans un cadre, par exemple, j'ai une lèvres, um, différent chaque dollar de différentes personnes et par exemple, j'ai comme ceci Et maintenant si je veux placer l'image. Et, euh, sélectionnons l'un de ces derniers à nouveau. Quatre un, Duke 34 Vraiment bien. Vraiment, fonctionnalité vraiment cool. Donc, vous pouvez simplement glisser et déposer tout ce que vous voulez sur. C' est une fonctionnalité vraiment cool. Donc on va y aller en plaçant tout ici comme ça. 1234 Ok, alors laissons celui-là. Faisons-le. Celui-ci enregistre celui-ci et se concentre sur celui-ci. Maintenant, si vous cliquez sur ceci ou ici, vous pouvez voir sur la droite. Nous avons Phil comme image, et il montre 100% de sorte que vous pouvez réduire l'opacité ici. C' est de l'opacité. Et si vous cliquez ici, vous pouvez voir que nous avons différentes options. Par exemple, nous pouvons modifier l'exposition ou réduire l'exposition. Nous pouvons augmenter le contraste, et nous pouvons augmenter la saturation, ce qui va améliorer la température de nos couleurs. C' est, euh, la température chaude. Il y a une température à l'école. Ceci est un peu de contrôle de la photo E. Donc si vous voulez orteil revenir en arrière, vous pouvez revenir en arrière, et il va cliquer dessus. 0% sont les paramètres normaux comme celui-ci. Rendons-le un peu plus grand comme ça. J' utilise donc la touche Maj et j'utilise cet adulte pour l'étendre. Ok, donc si vous voulez changer l'image, vous pouvez à nouveau cliquer ici et pour des exemples comme cette image comme celle-ci. Et maintenant vous pouvez voir ici nous avons des options Phil. Donc ce sont les options qui montrent que comment il va remplir cet objet. Donc c'est rempli. Il va remplir l'objet entier. C' est en forme. Et si vous cliquez sur le pied, vous pouvez voir qu'il est coupé à l'intérieur, et vous pouvez également voir que ce n'est pas parce que ce n'est pas une image arrondie ou une image. Donc, il ne convient pas à l'intérieur. Donc d'accord, donc nous allons utiliser Phil maintenant, et vous pouvez aussi utiliser la culture. Donc, la récolte va vous aider à changer sur la taille de cette. Et vous pouvez également modifier le placement de cette image. Par exemple, cette image nous sommes ici, et vous pouvez également changer la taille de l'image appuyez sur et maintenez la touche Maj. Et par exemple, je veux que les orteils aient quelque chose comme ça. Ok, donc vous pouvez aussi déplacer l'image autour comme ce X fermer ceci et vous pouvez voir ici nous avons l'image où nous le voulions. Encore une fois, on va passer à l'image. C' est de la culture. Donc, dans le rognage, vous pouvez déposer l'image. Par exemple, je veux avoir quelque chose ici comme ça et sortons et vous pouvez voir que c'est en fait recadrer des dégâts. Donc, il est fondamentalement changer le cadre de l'image. Et si vous voulez encore aller à la culture, c'est en fait la zone de culture. Cette section bleue nous sommes ici. Si vous cliquez sur cette image derrière vous pouvez voir que nous avons différents adultes. Ils sont noirs. Donc, si vous voulez changer la taille de l'image derrière ce recadrage, vous pouvez le faire comme cette musique comme celle-ci. C' est donc un très bon outil, sorte que vous pouvez également le faire pivoter. Mais je pense que ça ne va pas aider ici. Il va déformer cette image, donc c'est tout. Donc, c'est une très belle fonctionnalité de ce recadrage de l'image. Ensuite, vous pouvez utiliser le style de sorte que la tuile va réellement orteils. Aidez-nous à styliser cette image. Donc, en fait, je réduit la taille de cette image parce que nous devons voir l'effet de tuile. Alors déplacons-le comme ça et X cliquez ici. Donc, c'est comme ça que c'est le style sur l'image. Donc, ce sont quelques options avec l'image sent que vous pouvez également cacher l'image sentiment que vous pouvez également le déplacer. Vous pouvez également ajouter le champ de l'image à partir d'ici. Si vous allez à l'image, il va vous dire que Sélectionnez une image. Donc, vous construisez n'importe quelle image à partir d'ici. Et ce sont des options différentes. Comment il va s'adapter, remplir, remplir, adapter réellement faire Essayez d'utiliser 100% de l'image et essayez de le placer à l'intérieur de ce conteneur. Par exemple, si nous avons un conteneur hors comme celui-ci et que nous voulons le remplir avec une image afin que vous puissiez cliquer si vous voulez remplir quelque chose avec l'image, vous pouvez cliquer ici il est rempli et vous pouvez cliquer ici et aller à solide, solide et passer à l'image. Donc, ici, nous avons il montre que essayer de choisir une image ici afin que vous puissiez choisir n'importe quelle image , par exemple, comme ressemble à celle-ci. Ok, donc maintenant vous pouvez voir qu'il est rempli. Et si j'essaie de m'inquiéter, vous pouvez voir qu'il essaie d'adapter l'image entière dans ce rectangle. Maintenant, il laisse quelque chose à droite et à gauche. Donc, si j'ai essayé de réduire la taille Ok, donc c'est un ajustement parfait. Si je veux le recadrer, vous pouvez voir que je peux recadrer ce conteneur. Et je peux aussi déplacer cette image comme ça. J' espère que vous n'avez pas détruit cette image. Phil placent votre image et comment vous pouvez utiliser cet endroit. Outil d'image dans Sigma. J' espère que vous avez apprécié cette leçon. Passons à la leçon suivante. 10. Outil à la main, à Comment à l'à l'à à à l'à à: C' est la dernière partie de vos outils de fabrication, et je vais partager avec vous certains des outils que nous avons laissés ici. Par exemple, cet outil de crayon. Ensuite, nous avons cet outil à main et le disque un mental, bien que ceux-ci ne sont pas très utiles. Mais si vous cliquez sur cet outil de crayon, vous pouvez voir que vous pouvez dessiner ce que vous voulez. Donc, si vous avez une tablette ou un appareil de tabler Ben, vous pouvez facilement signer, ou ici vous pouvez facilement identifier des zones de conception comme celui-ci. Ici, tu peux utiliser ce que tu veux. Vous pouvez dessiner librement sur cet écran. Ce sont presque mes signatures étaient là, et tout cela est à propos de crayon outil, donc vous n'avez pas besoin de vous inquiéter à ce sujet. Donc, si vous voulez changer, vous pouvez double-cliquer, et vous aurez différentes options comme ici comme ceci, et vous pouvez également augmenter son saut afin que vous puissiez voir ce sont presque mes signatures. Pas très parfait. Mais si j'avais une tablette à stylo, que je vais acheter dans un proche avenir Aiken, utilisez quelque chose comme ça pour que je puisse dessiner des facteurs. Peu importe ce que je veux, je peux en dessiner. Vous pouvez voir des dessins animés ou quelque chose comme ça. Donc tout est au sujet de ce crayon pour ensuite nous avons cette poignée qui va bouger quoi, n'importe quoi,où vous voulez. Donc, revenons à déplacer l'outil, qui est V Et si vous voulez aller rapidement à cette main, vous pouvez appuyer ou maintenir votre barre d'espace comme ceci et maintenant vous pouvez vous déplacer. Il s'agit donc de la touche raccourcie pour cette barre d'espace d'outil à main, et vous pouvez vous déplacer sur votre toile. De même, nous avons cet outil de commentaire et vous pouvez ajouter votre commande show ici. C' est pour fondamentalement par exemple, j'aime que vous êtes des natures malades. Je vais ajouter un smiley ou ici Smoochy et plus de sorte que vous pouvez voir dans cette section de commentaire je vois qu'une commande de moi et l'adresse de la maison. Et vous pouvez voir que c'est mon nom en quelques secondes. Je vous aime les signatures. Donc, si vous avez toute une équipe, ils peuvent répondre et ils peuvent le dire vraiment, ou quelque chose comme ça. Ce que vous voulez, ils veulent le commandement des orteils ici. Donc, c'est vous pouvez dire, un peu hors de l'outil de collaboration pour collaborer sur votre conception et l'améliorer Donc ce sont les autres outils ici. Encore quelques choses que je pense que j'ai oublié, c'est que si vous allez ici sur rectangle, par exemple, j'ai dessiné un rectangle Et si je peux dessiner une ellipse ici et si je les chevauche, je peux relâcher les deux hors eux. Je les sélectionne en cliquant sur Maj, Maj, maintenant la touche Maj enfoncée et en cliquant sur les deux. Alors diluons celui-ci. Aussi, celui-ci aussi celui-ci. Donc, ici, nous avons deux formes différentes. Et si je veux les combiner, vous pouvez voir que nous avons différentes options ici. Sélection du syndicat. Alors maintenant, ils sont combinés et ils sont une forme ici comme ça. Pourtant, vous pouvez les aborder. Vous pouvez cliquer ici, double-cliquez, et vous aurez des formes dans l'union. Vous pouvez les déplacer, par exemple. Je veux l'avoir ici. Et je, par exemple, je voulais le dupliquer. Je veux avoir une autre forme comme celle-ci. En fait, j'ai appuyé et maintenez ma touche d'option Archer pour les dupliquer. Alors cliquez sur ceci. C' est comme cette pression et maintenez l'option Arden. Vous aurez le Bellerose et vous pouvez avoir quelque chose comme ça. Donc vous pouvez voir que c'est un syndicat hors de ce vaisseau. De même, nous pouvons avoir la sélection du sujet. Maintenant, vous pouvez voir toutes les ellipses supérieures qu'elles ont soustraites de ce rectangle ici. Ensuite, nous avons ceci exclut les sélections ou tout ce qui est, euh, chevauché. Il va être exclu. Ainsi, par exemple, les zones qui se chevauchent, ils vont être supprimés. Vous pouvez voir où ici. Vous pouvez donc voir maintenant ces zones qui se chevauchent ont été supprimées. Pour comprendre cette sélection d'intersection, nous allons avoir de nouvelles formes. Donc supprimons celui-ci. On a un rectangle par ici. 2ème 1 de plus ici, ce qui va être un peu plus sombre. C' est comme un bateau sur eux. Inspecter l'intersection. Donc Intersect est en fait ce qui est commun à l'intérieur d'eux et tout est supprimé. L' espace commun sera donc à la fin et tout sera supprimé. Donc c'est comme ça ça fonctionne cette combinaison ou cet outil syndical. Si vous avez des questions ou si vous n'avez rien compris, vous pouvez toujours me le demander. Passons à la leçon suivante. 11. Colors et utiliser des gradiants dans Figma: dans cette vidéo. Nous allons regarder ce type ici, et nous allons explorer différentes façons d'utiliser ce champ. Comment vous pouvez utiliser différentes couleurs comme solaire, rainier linéaire, diamant angulaire, une image. Et nous ne allons pas regarder cette image dont nous avons déjà parlé Stared. Donc, um, commençons par créer un rectangle ici et créons une ellipse ici. Donc, je tiens le quart de travail. Utilisons quelques 300 coins comme 16. Ou ici et maintenant vous pouvez voir que le fichier Phyllis C. Quatre c quatre c quatre. C' est sa capacité. Combien les couleurs devraient être transparentes ou nord, quelque chose comme ça. Donc, si j'essaie d'utiliser, par exemple, comme cette couleur ici et j'essaie d'ajouter un autre champ et je veux que ce soit, um, quelques ingrédients comme celui-ci et changeons la couleur pour celui-ci, donc le fond l'un d'eux va être un tueur. Ensuite, utilisez cette couleur, ou maintenant vous pouvez voir le haut est en fait un int gourmand. Donc, si j'ai essayé, quand je clique ici, ça dit linéaire. Donc ici, nous avons une couleur unie que nous avons linéaire Kenya a deux points à partir de ces points ici, ce qui va réellement montrer où le Sculler va s'arrêter et commencer. Donc cette couleur va commencer à partir d'ici. Si vous voulez en ajouter un de plus, vous pouvez cliquer ici comme ça et vous pouvez utiliser une couleur comme celle-ci. Par exemple, si vous voulez orteil, changez-le et vous voulez également changer le haut ici, par exemple, comme ceci et vous voulez que le fond soit très sombre. Vous pouvez utiliser quelque chose comme ça. Maintenant, vous pouvez voir que nous utilisons un ingrédient linéaire en plus de ces couleurs bleues. Si vous voulez mettre en évidence cela même voir, nous essayons d'augmenter sa capacité. Il va montrer plus en dessous de cette Grady dans. Donc c'est un peu comme une sorte de C vert rayonnante. Et vous pouvez toujours vous cacher et montrer. Par exemple, vous vous sentez comme ça. Je peux ajouter autant de remplissages que je veux, par exemple, je veux ajouter une radio. La radio va être en destruction. Donc, pour radieux, nous allons utiliser celui-là. Donc, c'est que j'ai utilisé radial et vous pouvez voir maintenant il a juste régulier et puis il a er vital ou la transparence d'un côté. Donc, si vous cliquez ici, vous pouvez voir que nous avons deux paramètres. L' un est cette couleur. La première est cette capacité. Donc, pour chaque point hors couleurs, vous pouvez avoir deux choses. Par exemple, si j'essaie d'augmenter l'opacité, vous pouvez voir maintenant nous avons Ah, couleur radiale avec la limite est en fait un peu transparente et à l'intérieur est un pick-up. Ainsi, vous pouvez créer de nombreux effets comme celui-ci. Par exemple, si j'essaie d'utiliser quelque chose comme ça et j'essaie d'utiliser la couleur blanche ici, vous pouvez voir que nous avons ce genre d'effet off. Vous pouvez le voir à l'extérieur est blanc, qui se fond avec ce fond. Et à l'intérieur il y a ce tueur pour que vous puissiez avoir plus d'arrêts. Par exemple, si vous voulez changer la couleur de cette section ici, par exemple, comme ça, vous pouvez voir maintenant ce qui se passe ici. De même, vous pouvez changer l'opacité de cet orteil. Donc maintenant, j'essaie de bouger les orteils circulaires et il y a un espacement. Diluons celui-ci. Alors je le suis. J' ai sélectionné cette unité a limite presse supprimer, et nous avons une couleur disparu. Maintenant, vous pouvez voir que ça a l'air bien. De même, pour celui-ci, nous allons supprimer le vrai. On va utiliser le linéaire maintenant. Beaucoup de choses que vous pouvez faire ici. Par exemple, si vous cliquez sur ce linéaire, vous pouvez changer la direction de cet int créedy comme ceci. Donc si j'essaie de changer la direction, je peux changer la direction comme cette croix de presse et vous pouvez voir ici nous en avons une autre. Donc ce que je ne vais pas faire, c'est que je vais supprimer cette excuse. Hum, sombre ici, Onda, augmentons l'opacité de cette section ou ici. Essayons les orteils. Bougez-le comme ça. Suivant. Déplacez les couleurs, comme ça. Échangez cet orteil quelque chose comme ça qui le traînent un peu plus. Donc nous avons moins de couleur pour cette goutte ou ce, euh, point par ici. On a donc trois points pour les points de tueur. Donc, c'est que vous pouvez créer un bouton de téléchargement comme ça et la couleur blanche ici. De même, vous pouvez faire la même chose pour ici. Si vous voulez créer quelque chose pour ces, euh ces textes ici, vous pouvez faire la même chose. Alors, échangez comme ça. Donc maintenant, vous pouvez voir que nous avons beaucoup d'options. Vous pouvez ajouter autant de sensations chaudes même dans le texte ici, même pour ces formes. Ici, vous pouvez agir 234 Quel que soit l'effet que vous voulez créer, vous pouvez créer un similaire pour la radio. Vous pouvez avoir ce genre de choses pour angulaire. La plupart du temps, on n'en a pas besoin. Mais peut-être que si tu veux l'utiliser, tu peux voir que tu es là. Ça l'est et le fera ? En fait, ça crée quelque chose comme ça, dont nous n'avons pas besoin pour la plupart. Peut-être que dans certaines interférences de voiture ou quelque chose comme ça, nous pourrions avoir besoin de votre diamant va avoir quelque chose comme ça. Et le dernier est l'image. Nous en avons déjà discuté. Donc, ce sont différentes options de couleur, les choses sont différentes. Phil options par ici. Vous pouvez également créer des styles pour cette sensation. Par exemple, j'ai ceci un int gourmand ici. Je vais cliquer ici et utiliser l'écran, Ian, Ian, et l'enregistrer dans l'ingrédient deuxième ou quelque chose comme ça. Donc, si j'essaie d'utiliser l'un des rectangle, je peux juste cliquer ici et appuyer dessus et cela va être appliqué à ce rectangle ici. Donc, tout est sur les couleurs et les différents ingrédients et comment vous pouvez utiliser différents INT créedy , différents effets, par exemple, ce fonds transparent. Vous pouvez le faire fondre avec l'arrière-plan ici pour utiliser la même couleur que l'arrière-plan . Vous pouvez voir si nous le déplacons à l'intérieur du rectangle coloré ici, il va montrer sa limite, mais sur un fond blanc, il ne va pas montrer. C' est donc tout au sujet des couleurs. Si vous avez des questions à me poser, vous pouvez toujours me poser. Passons à la leçon suivante. 12. Les boutons de dégradé: Maintenant, vous avez tout appris sur l'éclat, Phil couleurs Tout. Il est maintenant temps pour votre affectation sur votre affectation est que vous devez créer un fardeau linéaire . Lini Ingrédient Burden Comme ça, j'ai créé et toujours mentionner votre nom que Grady en Grande-Bretagne par Sarah de Julius ou quel que soit votre nom, parce que c'est plus facile pour moi de, vous savez, commentaires. Donnez des commentaires afin qu'il soit plus facile pour moi de donner des commentaires. Donc Gedeon Britain crée deux boutons avec toutes les couleurs que vous aimez. Ils doivent avoir quelques couleurs que le texte est visible sur eux. Alors n'essayez pas de créer un fardeau. Les étaient le texte est difficile à lire. Donc c'est votre prochaine mission. Des fardeaux brillants de votre part. J' ai donc hâte de voir cette mission. Vous pouvez voir ça à l'écran, non ? Du bruit ? Je n'y a pas d'explication nécessaire, alors assurez-vous de les créer et je suis en train de lire pour votre mission. Alors commencez à lire maintenant. 13. Utiliser des masques dans Figma: dans cette vidéo, nous allons en apprendre davantage sur Sigma et comment nous utilisons différentes mosquées et techniques de masquage et sigma. Donc, le masquage est fondamentalement vous avez un conteneur comme vous pouvez voir ce rectangle. Ça pourrait être mon conteneur et tous les éléments. Par exemple, des images ou des boutons. Ils vont être à l'intérieur de ce conteneur. Donc, si quelque chose est plus grand que ce conteneur, il va couper. Donc, il ne va pas montrer dehors de ce conteneur. Donc, pour mieux comprendre cet exemple, nous allons faire glisser et déposer une image ou ici. Alors prenons cette image et dépose-la ici. Donc c'est très grand. Donc je vais tenir ma clé de vaisseau et juste avoir un peu de taille ici. Vous pouvez également rapidement dimensionner en utilisant quelque chose comme ceci ou ici. Donc maintenant nous avons cette image, et ici nous avons le conteneur. Donc le confinement est à l'arrière et l'image est à l'avant pour créer une mosquée. Nous allons les sélectionner tous les deux, alors sélectionnons et faites-les glisser autour d'eux. Donc les deux sont sélectionnés et nous allons appuyer sur le contrôle de l'art, contrôler tout M ou option de commande et créer une mosquée. Vous pouvez donc voir maintenant que nous avons créé la mosquée avec succès. Maintenant, si vous regardez ici pour que vous puissiez voir que c'est notre image. C' est notre rectangle. C' est notre mosquée. Donc, si vous essayez de sélectionner ce conteneur et de le déplacer, vous pouvez voir qu'il va révéler la partie de l'image que nous utilisons réellement. Nous sommes en train d'aligner ce rectangle, donc c'est comme un portail. Vous pouvez voir qu'il est une bordure où vous pouvez voir les autres dimensions aliments de toute façon, Donc, voici comment ces images. Donc, si vous voulez agrandir cette image, vous devez sélectionner cette image et vous devez l'habiliter comme ça et nous allons jouer ensemble ici comme ça. Donc, si vous travaillez ce rectangle ou ce conteneur ou ce qui fait cet orteil de la mosquée, ayez un peu de rondeur. Créons 80 Wrongness. Donc nous avons très gentil ce prochain, comme celui-ci. Oups. Donc nous avons cette mosquée, celle-ci, donc nous allons les sélectionner tous les deux pour les déplacer comme ça. Et si nous voulons un groupe, nous pouvons les regrouper à l'intérieur d'un groupe orteil avoir ce groupe simple, donc nous ne voulons pas voir une très grande sélection tout le temps. C' est ainsi que vous créez des mosquées. Alors maintenant, vous allez ajouter une mosquée. Donc nous avons cette mosquée. Vous avez déjà vu que quand c'est comme celui-ci, je peux changer la taille comme ça. Je peux changer la position de la mosquée et aussi si je veux changer la taille de l'image ici. Donc, si je veux que Toby le fasse plus petit, je vais sélectionner cette image et je vais aller aux pieds. Rends-le plus petit, comme ça, comme ça. De même, si je veux changer ces coins, je vais l'utiliser cette fois. Donc, c'est comment réellement vous créez des mosquées sont conteneur pour créer différents types de dessins, où vous allez cacher le reste de la partie maintenant, De même, vous pouvez avoir d'autres éléments à dans la mosquée. Donc, si j'ai un fardeau par exemple, comme celui-ci, créons un bouton rapidement. Donc on a ce bouton, il y a le groupe. Allez, G, Bt dedans. Et je voulais être à l'intérieur de ce rectangle ou à l'intérieur de ce conteneur. Donc je veux avoir mon bouton à l'intérieur de cette mosquée. Donc je vais le faire glisser ici et le déposer ici juste au-dessus de ce rectangle. Donc maintenant, vous pouvez voir cette adresse s'étendant à partir de cette image, y compris ce bouton et ce rectangle. Donc, cela montre que ce sont les choses qui sont à l'intérieur de ce conteneur. Donc maintenant vous pouvez voir que je ne peux pas voir mon bouton parce qu'il est à l'extérieur du conteneur. C' est comme un portail intermédiaire. Vous pouvez voir de l'autre côté. Mais si quelque chose est en dehors de ces miroirs, vous pouvez le voir, donc vous devez le déplacer. Alors j'essaie de le déplacer ici. Donc vous devez le déplacer à l'intérieur de ce conteneur comme ça. Et maintenant, vous pouvez voir qu'il est derrière cette image. Donc je vais le déplacer maintenant. Vous pouvez voir qu'il est à l'intérieur de cette mosquée et il est à l'intérieur de ce conteneur. Cette mosquée doit zone. Alors non. Devrais-je vouloir le déplacer, Par exemple, je veux orteil cacher le côté droit de ce bouton. Je peux faire ça comme ça. C' est l'autre extrémité de ce fardeau est à l'extérieur de mon conteneur, donc je ne peux pas le voir. Donc c'est en fait la technique de masquage et, ah, cela va être très utile dans votre conception. Je l'utilise surtout chaque fois que j'importe et des images. J' utilise un masque d'orteil rectangle afin que je puisse facilement contrôler sa position. C' est Ilya quoi ? Je veux montrer ce que je veux cacher. C' est donc un concept très important. J' espère que vous avez compris ce concept de masquage et comment l'utiliser et comment avoir beaucoup d' éléments à l'intérieur d'une mosquée. Passons à la leçon suivante. 14. Projet en masquer des images votre introduction: vous avez déjà appris comment les choses de la mosquée. C' est donc le moment de votre mission. Alors maintenant je vais vous donner une mission, orteil, mosquée et objet ou n'importe quelle image, et vous allez créer un texte d'introduction sur vous-même que j'ai quatre soucis ou j'aime regarder des dessins animés ennemis ou je suis très occupé ou je suis infirmière de profession ou tout ce qui est dans votre esprit. Donc, quoi que soient vos passe-temps, que vous fassiez ou que vous fassiez votre amour, vous devez le partager avec moi et utiliser votre propre image. Il vaut mieux que nous nous présentions. Laissez-moi vous montrer ma peau ce que j'ai créé. Et je vais aussi vous donner quelques conseils sur la façon de créer le masquage de la. Et quels sont les problèmes que vous pouvez obtenir. Alors faisons orteil sur les écrans maintenant. Maintenant, vous pouvez voir ici j'ai créé deux écrans. C' est une mosquée personnalisée. J' ai créé une forme ici, et j'ai inséré mon image à l'intérieur, et ils sont à l'intérieur d'un groupe. Il est toujours préférable de regrouper votre groupe, vos éléments qui ont été masqués. Sinon, la stigmatisation va continuer à y ajouter des choses. Donc, chaque fois que vous commencez avec ceci, vous pouvez créer quelque chose comme ceci. Vous pouvez utiliser une ellipse ici, dessiner une ellipse en maintenant la touche Maj, faire glisser votre image à l'intérieur. Et comme ceci, par exemple, laissez-moi dessiner sur glisser ce que vous pouvez voir Non, J'ai une image chaque goudron sur mes lèvres. Je vais sélectionner les deux ellipses à la mosquée du bas. Et je vais déplacer ça à l'intérieur comme ça. Donc, c'est facile. Et toujours essayer orteil, créer un groupe, donc c'est plus facile orteil. Gérez-les. Donc c'est un jour maintenant. Si vous essayez de créer une forme avec le pendule, par exemple, j'essaie de créer une forme comme celle-ci, et je veux insérer une image à l'intérieur. Il y a un truc que vous pouvez voir ici. Il n'y a pas Phil sont ici, alors essayez d'ajouter Phil d'abord. Sinon, votre image ne va pas remplir cela. Alors ramenons ça à nouveau. Et nous l'avons ici. Comme l'eau de leur mosquée, et maintenant vous pouvez voir que j'ai créé une mosquée très personnalisée avec la forme personnalisée ici. Alors rappelez-vous toujours que Essayez de remplir votre forme vectorielle avant de faire quelque chose comme ça. C' est donc l'exemple. Alors commencez par votre nom. Bienvenue, John ou Sarah ou quel que soit votre nom, puis pour comprendre la classe et ensuite quelque chose sur vous. Comme si je regardais beaucoup de jardins ennemis. Surtout récemment re superpuissances aiment explorer toutes sortes de conceptions. Même j'aime explorer votre design ou tout type de design. Trois d ou j'adore les orteils les laver. Et j'ai quatre enfants et freelance depuis 10 ans. C' est ma simple introduction, et vous pouvez avoir un bouton très utilise. Commençons ou soyons humbles. Toujours ce que vous pensez est le mot clé de votre vie. C' est donc la mission de masquage. Alors assure-toi que tu as créé, je vais continuer à chercher ta mission. D' accord ? Alors, comment soumettre cette mission ? Vous devez cliquer sur ce tableau d'art. Vous devez aller à l'exportation. Cliquez ici, et c'est par ici. Exporter iPhone Bless. Donc, non, je vais l'exporter sur le bureau. Et c'est l'image que vous allez télécharger. Donc, c'est l'image. Donc, c'est Vous pouvez voir que c'est l'image, et c'est que vous avez à télécharger et comme une affectation, donc je peux facilement relier. Ok, donc j'attends avec impatience votre mission. Ne soumis. Commençons cette mosquée en mission. Non. 15. Créer des styles réutilisables: dans cette vidéo, nous allons en parler. Doit carreaux qui vont être nos couleurs, essais et textiles que vous pouvez utiliser encore et encore et facile re appliquer à d'autres éléments de texte ou d'autres boutons ou tout ce que vous avez. Ainsi, nous pouvons également créer des effets différents. Alors laissez-moi vous montrer en faisant quelque chose pour que vous puissiez voir que j'ai utilisé étaient ici quatre couleurs. Donc, si je sélectionne ce rectangle, c'est une couleur de remplissage Alors comment je peux l'utiliser encore et encore Donc je vais orteil cliquez ici Ceci est appelé style et je vais cliquer ici, créer le style Donc une fois que j'ai ce 'll, Je peux renommez-le comme de l'acier, je suis bleu quelque chose comme ça et je vais avoir un style ici donc si je passe la souris dessus, il montre encore bleu. De même, pour ceux-ci, je vais créer des noms différents Deuxième re couleur orange Ensuite, nous avons ce primaire bleu foncé et créons un autre bleu primaire. Donc maintenant, vous pouvez voir que nous avons quatre efforts de couleur au-dessus. C' est notre style d'équipe. ne sont donc pas locaux à ce document. Ce sont donc nos styles de conception locaux que nous pouvons appliquer dans ce document. Donc c'est notre projet en ce moment. C' est la page d'entraînement, en fait. Donc, nous avons quatre essais de colas, donc vous pouvez voir comment nous pouvons les appliquer Facile. Laisse-moi te montrer. Donc, je salue rectangle aussi lèvres ici et je vais aller à plutôt que d'aller à remplir je peux je vais aller aller à. Il y a deux façons, en fait Alors allez au style et sélectionnez les couleurs que vous voulez. Par exemple, je veux cette couleur de la même manière. Par exemple, je crée un fardeau. Donc, je dois faire un angle strict par ici. C' est une belle mais tout s'applique à elle. Il existe. Et je voulais être comme ça. Donc c'est très facile pour moi. Je ne veux pas me souvenir de ça et vous pouvez voir ici que nous avons le bleu foncé primaire. Donc, l'essentiel est la réutilisabilité, par exemple, j'ai appliqué la même couleur. Donc ce rectangle comme ça Alors que faire si je veux changer la couleur et que je veux que ce soit une autre nuance de ce bleu. Donc, ce que je peux faire ici, c'est que je vais cliquer ici et puis je vais cliquer sur ce style d'édition. Et ici, nous avons Option deux chaîne découvrir, par exemple. Je voulais Toby, , voyons cette couverture. Donc maintenant, vous pouvez voir notre bleu foncé primaire est totalement différent. Ok, alors va par ici. Vous pouvez également aller à partir de vous pouvez également aller changements d'orteils à partir d'ici, donc n'a pas aimé ce cadre et aller dans les styles locaux et vous pouvez cliquer sur les paramètres et nous allons changer à quelque chose de très sombre comme ça. Donc, ici, nous avons la couleur, taille et comment nous pouvons les éditer et comment nous pouvons les réappliquer et quel effet cela aura. Donc, par exemple, si je veux que ce soit d'autres couleurs Donc si je clique ici, vous pouvez voir qu'il me montre toutes ces couleurs. Je ne peux pas accro ou changer de couleur. Je ne suis pas ouvert toutes les couleurs. Donc, si je veux revenir en arrière donc je dois cliquer ici d style mort. Et maintenant vous pouvez voir que j'ai mon remplissage pour que je puisse changer sa couleur à n'importe quoi, et il n'est pas attaché orteil. Ces deux éléments sont ces essais de deux couleurs. Maintenant, nous allons en apprendre davantage sur les textiles. Donc ici, vous pouvez voir que j'ai cette rubrique. J' ai ce paragraphe de texte. C' est régulier. 18 cochons, Ils Roboto, meurent visage. Et voici Roberta Light 64 photos. Je peux augmenter la taille de 72 si je veux. Oh, et c'est mon cap maintenant. Je peux aussi créer le même style Vous pouvez voir le même bouton ici. De retour par ici. Et je vais le faire en gros ou en direction 72. Ce serait facile pour moi de me souvenir. De même, ici, je vais l'avoir. Ah, meilleur graphique 18. Donc ça veut dire que 18 porcs est la taille du paragraphe et vous pouvez voir que je dois textiles ici. Donc, chaque fois que je veux un nouveau texte ici, par exemple, je tape quelque chose étant donc je voulais être un titre. Donc je vais juste aller par ici, cliquer dessus et juste mis ma cachette 72 et je vais aller orteil avoir tous les réglages que j'ai fait ici. Maintenant, si vous voulez éditer ce style, par exemple, j'ai déjà créé un style et je veux le changer de sorte que la chose est que vous avez toe klik partout ici, ou vous pouvez simplement ne pas aimer quoi que ce soit ce qui est plus facile. Et vous pouvez juste cliquer dessus et je vais passer à, disons noir et je vais en avoir 64. Utilisons un autre pour, par exemple, comme celui-ci. C' est un meilleur, et je pense qu'il n'a pas de dos. Donc, nous allons utiliser lourd. Alors, hum, conseil d'administration. Donc, ça a l'air bien. Donc, vous pouvez voir que c'est comme ça que vous changez votre style afin que vous puissiez sortir de cet os. Rio, tu peux choisir celui-là. Cliquez sur celui-ci, allez à cette icône. Donc c'est un peu, euh, vous pouvez voir une route un peu plus grande pour voyager. J' aime ça comme ça. Donc je n'ai pas aimé ça et je vais de ce style local et le changer ici très similaire à ces tueurs et ces rubriques ou ces textiles. Vous pouvez également créer d'autres styles. Par exemple, je veux avoir. Détachons-le, et je vais créer un ingrédient linéaire. Maintenant, c'est comme ça et je vais changer la couleur pour celui qui va orteil. Augmentez l'opacité. Donc non, nous avons créé ici et sélectionner disque rayonnant et encore une fois je vais aller à des styles et nous allons barbe, ingrédient ou ici. Donc, j'ai mon gourmand dans le style similaire comme ça. Donc, si vous voulez postuler à celui-ci, je vais cliquer ici et c'est mon fond avec l'ingrédient. Et ajoutons d'autres choses ici. Par exemple, je veux le détacher et je veux des effets. Par exemple, je veux des ombres ici, donc je vais avoir de l'ombre portée, et ça va être un peu plus sombre. Ombre portée qui est utilisé quelque chose comme ça et je vais les orteils avoir du sang sur 50. Réduisons à 30. Exclusif à 25 35 Looking good. Déplaçons un peu vers le bas. 6 18 Maintenant, nous avons créé l'ombre portée. Voyons le style clair pour cela. Nous avons été trop bon style et cliquez sur cette même icône plus pour créer un style. Donc c'est notre, ah, ombre portée, quatre boutons, quelque chose comme ça. Donc nous avons un autre style. Donc, si nous sortons des scandales et cliquez ici, vous pouvez voir non, nous avons un fait styles couleur, taille et textiles. Donc ce sont différents types de styles que vous pouvez essayer ici, et vous pouvez les réappliquer à tout ce que je pense que vous voulez. Par exemple, je vais à ces effets et juste comme ça et nous avons cette ombre, je ne veux pas me souvenir des valeurs de cette ombre encore et encore. C' est donc un très bon concept dans tout concept puissant de stigmatisation. Et j'aime vraiment comment ils ont utilisé ces effets styles, couleurs, essais et textiles locaux séparément. J' espère donc que vous avez compris le concept hors style et comment les réutiliser. Passons à la leçon suivante. 16. Panneau Effets dans l'application Figma: dans cette vidéo, nous allons apprendre différents effets de votre conception et comment vous pouvez utiliser le panneau des effets de thèse sur le côté droit chaque fois que vous concevez à l'aide de figment. Donc quatre choses que nous allons en créer une, c'est cette ombre très légère autour d'elle, très petite ombre autour d'elle. Ensuite, nous en avons un autre, qui va être une ombre dépensée très douce. Ensuite, nous avons cet effet trois D, et nous avons cet effet d'encartement, la même chose que j'ai fait quand j'ai acheté mon premier vous un cours de design avec photo shop, Donc je le fais dans la devise de la figue. Donc ce sont les quatre effets que nous allons créer. Donc d'abord, je vais enlever tous ces défauts d'ici pour vous montrer où j'ai commencé, en fait. Donc, euh donc ici nous avons des éléments simples. Simple blanc. Maintenant, vous pouvez voir une chose est commune. J' ai un fond de couleur claire. C' est très important. Chaque fois que vous essayez d'avoir une ombre, vous devez avoir un peu de lumière colorée, fond de couleur de facture. Cela va marcher beaucoup mieux maintenant. La première chose que nous allons faire est que nous allons créer cette ombre ici, qui va être une ombre très étendue, très floue. Alors appuyez sur ce passeport et nous avons une ombre portée simple qui ressemble à ça. Cela n'a pas l'air très bon, donc nous allons l'améliorer. Donc, pour les options allaient aux pieds, viens ici. Donc, nous avons ces options X valeur le mouvement hors ombre dans le côté droit. Donc, il va se déplacer pour essayer d'appuyer sur cinq ici. Vous pouvez voir qu'il est en train d'emménager. La valeur de destruction est de haut en bas. Donc, si vous voulez aller vers le bas, c'est ainsi que vous pouvez le faire. Augmentez donc la valeur de vie pour déplacer l'ombre en bas. Si tu veux, tu bouges de l'autre côté. Tu vas utiliser moins cinq comme ça et moins 15 comme ça. Donc, c'est cool. Ok, donc le sang est à quel point il doit être floue. Il va donc avoir des bords souples. Donc, si vous essayez d'augmenter la valeur du sang, il va orteil devenir plus doux. Donc le premier paramètre que nous allons faire est que je vais utiliser X1. Donc je vais bouger un peu ou ici que je vais utiliser le sang 32. Donc je voulais être très doux comme l'ombre et le virus. Tu le seras. Donc, je veux le déplacer un peu vers le bas. Donc je veux moins d'ombre sur le dessus. Un peu plus par ici. Alors je vais utiliser 20%. Je ne veux pas que ce soit des ombres très dures. Donc, je veux le rendre doux. Je réduit l'opacité de 20%. Maintenant, vous pouvez voir qu'il a l'air superbe. Maintenant, la dernière chose que tu peux faire c'est qu'on va changer cette couleur du noir. Donc, la même couleur sur ce fond. Donc je vais cliquer ici, et je vais le déplacer ici. Maintenant, vous pouvez voir à nouveau quand j'ai sélectionné la couleur Il est allé à nouveau 200%. Donc je vais l'utiliser à 30% maintenant. Vous pouvez voir que ça a l'air très bien. Ombre douce. Je vais vous donner des missions pour faire quelque chose comme ça. Très gentil. Très propre, très créatif. Vous pouvez voir ici maintenant, même manière pour celui-ci, nous allons utiliser d'autres paramètres. Donc, encore une fois, on va aller à l'ombre portée. Vous pouvez voir que nous avons plus d'options dans un calque d'ombre, flou d'arrière-plan flou. Mais nous allons en ce moment avec l'ombre portée et dans une ombre va être le prochain. Donc maintenant nous allons orteil Jane les paramètres donc x sera zéro sang sera avant et la valeur de vie sera la survie sera aussi. Nous voulons donc que ce soit très proche de notre précédent, et ce sera de 15 %. Et le tueur que nous allons utiliser Lex utilise cette couleur et je vais réduire sa capacité à 20% comme ça. Donc, c'est une couleur un peu différente pour l'à partir de l'arrière-plan, un peu bleuâtre. C' est un peu bleu verdâtre, mais il l'a regardé. Il est à la recherche créer sur le dessus de ce fond. Donc, c'est très doux. Fermer l'ombre de régler. Si vous voulez orteil changer un peu la couleur. Tu veux une ombre plus foncée ? Vous pouvez aller dans cette zone plus sombre. Si vous voulez une ombre plus claire ou un effet basé sur la lumière, vous pouvez aller dans cette section. On est là. Vous pouvez voir Si vous regardez de près sur la gauche, vous pouvez voir la lumière, l' obscurité, la lumière, l' obscurité, obscurité, lumière, obscurité. Donc je vais aller avec celui-là pour lui. Maintenant, nous allons aller pour l'intérieur de l'effet d'encart. Donc, en cliquant sur ceci et si nous cliquons sur les effets, nous voulons orteil avoir effectivement des effets. On va être dans l'ombre. Donc, une fois que nous utilisons dans une ombre, vous pouvez voir qu'il a déjà un intérieur de l'effet insecte ne pas. Dans cet effet de Ha, je vais zoomer pour vous montrer la différence. Donc c'est en fait ton intérieur, et ça s'appelle les effets. Et je peux utiliser 20% ici, et je vais l'augmenter un peu. Excusez. Trois au nord, un peu en haut. Et maintenant, je vais utiliser un autre effet, qui va être mon ombre portée. Maintenant, cette ombre portée ne va pas être sombre ici. Quand quelque chose est au sein, il y aura une ombre claire là-dessus. Ici, dans cette zone, la lumière va tomber sur ce fond par ici. Laissez-moi vous montrer ce que je veux dire. Donc nous allons avoir un sang d'ombre. Nous allons réduire le flou à zéro parce que nous ne voulons pas qu'il soit flou. Pourquoi ça va être amusant ? Nous voulions être juste avec ces lignes. Ou laissez-moi zoomer un peu plus. Vous pouvez voir cette grande ligne ou ici. Non, on ne veut pas que ce soit génial. Nous allons utiliser une ligne blanche ici maintenant. Si vous effectuez un zoom avant, vous pouvez voir qu'il y a une ligne blanche. Allons zoomer un peu. Il y a une ligne blanche ou ici. Laisse-moi te montrer. Augmentez la capacité de 200 % parce que vous ne pouvez pas la voir. Maintenant, vous pouvez voir que nous avons une large ligne ici qui va orteil améliorer notre effet intérieur . Donc, ici, nous avons un bouton parfait dans le set. Nous en avons utilisé un peu dans une ombre. Vous pouvez également utiliser ces quatre et nous avons une ombre portée, qui va être une lumière blanche ici sur ce sujet. R. Donc, cela va compléter votre effet de perspicacité maintenant, arriver à ce traité d'effet de traité est très simple. Créons un effet. Ombre portée. Ce sera et nous allons réduire le flou 20 Maintenant, vous pouvez voir que cela devient solide. Non, nous allons utiliser la même couleur sur ce bouton et nous allons passer les pieds dans cette section plus foncée ou ici. Utilisons donc, par exemple, celui-ci qui est tout ce dont nous avons besoin pour un fardeau de trois D. Vous pouvez voir si vous voulez augmenter son ah, traité nous ou son ombre, vous pouvez augmenter par exemple, aller à six. Vous pouvez voir maintenant il semble un peu plus traité. Donc, voici comment vous utilisez différents effets lorsque vous essayez d'être un effet d'ombres différentes sur les insectes lorsque vous essayez d'utiliser la figue MMA. Maintenant, nous allons étudier les deux derniers effets qui sont le flou du tueur et l'arrière-plan. Si vous cliquez sur leur sang, vous pouvez voir ce holier est en fait floue et vous pouvez changer le sang citant par exemple , 15 ou quelque chose comme ça. Donc, si vous voulez flou couche, sera quelque chose comme ça, ce qui est très facile, très facile à comprendre le concept de ce sang Lear. La dernière chose, c'est que nous allons étudier le sang de fond. Maintenant, par exemple, je veux cet article et je veux tout sur le dessus. Si c'est, par exemple, j'ai un rectangle ici et il cache tout cet écran, par exemple. C' est tout l'écran, donc je vais ajouter l'effet de Bagram Flou. Maintenant, vous pouvez voir que rien n'est floue. Donc, une fois que vous essayez orteil, réduisez l'opacité de votre remplissage ici, par exemple, je veux être 50%. Vous pouvez voir l'arrière-plan derrière ce régulier est en fait floue. Donc, si vous voulez changer le réglage du sang, vous pouvez augmenter le sang. Vous pouvez voir maintenant qu'il est plus floue et, hum, pas visible, en fait. Donc, si vous essayez d'utiliser la couleur blanche, nos cheveux, quelque chose comme ça, vous pouvez voir que c'est en fait un flou de fond. Donc, si vous essayez de mettre un texte ici, hum, ça me plaît beaucoup. Donc, il est en train de revenir en arrière. Je voulais être au sommet de cette histoire, quelque chose comme ça. Donc, vous pouvez voir chaque fois que j'essaie de bouger ça va orteil, avoir un effet floue. Cela va à si vous essayez de le déplacer ou de le faire défiler. Cela aura un effet comme celui-ci. Donc, cet effet a été vu pour la première fois dans les appareils IOS ? Je suppose que oui. C' est en fait comment vous pouvez utiliser l'arrière-plan. N' oubliez pas de réduire l'opacité de votre couleur de remplissage ici parce que cela ne fonctionnera pas sans cela. Donc, si vous avez un réglage comme celui-ci, cela ne fonctionnera pas. Essayez donc d'utiliser 80% 70% 50% ou tout ce qui vous semble bon. Donc ce sont tous les effets que je vous ai déjà montrés. Si vous avez des problèmes à comprendre ces effets pour me poser des questions et j'espère vous voir bientôt dans la prochaine leçon, jusque-là, prenez votre et par 17. Projet en utilisant des effets de calques: maintenant, Votre prochaine affectation est que vous allez créer ces trois boutons avec le fait de l'ombre avec trois effet D avec insecte ou effet pressé. Et je veux que vous mentionniez votre nom en haut. Commencez donc à créer cette affectation. Je vais te donner des mains. Ce sont mes paramètres. Si vous allez à cette ombre, vous pouvez voir ce sont mes paramètres pour l'ombre 0 15 La valeur du sang est quatre. La propagation est une couleur bleu foncé pour la même chose. Ce bleu 40% est l'opacité de l'ombre. Ensuite, nous avons celui-là. C' est en fait à l'intérieur de ce leader et donc des ombres tombantes. Vous 05 est la valeur de vie. Alors faites-le un peu vers le bas, et puis nous avons la couleur vert foncé 100% pour celui-ci, nous devons réellement déposer des ombres. L' un est une ligne blanche de 10 lignes en bas, ce que je vous ai déjà appris. Celui-ci et dans l'ombre est 06 flou. Quatre est de valeur I et couleur orange foncé pour l'ombre à l'intérieur de l'effet de sein et 100% c'est sa capacité. J' ai donc hâte. Donc, en voyant cette affectation, alors commencez à la lire maintenant 18. Composants dans Figma: dans ce cas, nous allons parler d'un concept très important, qui s'appelle les composants. Maintenant. Les composants sont essentiellement vos éléments de conception que vous pouvez les réutiliser. Vous pouvez changer certains de leurs propriétés, et vous pouvez toujours les utiliser. Alors laissez-moi partager avec vous ce qui est fondamentalement le concept de sorte que le composant peut être groupé de tous éléments de conception, votre contexte fiscal, votre Parton, vos gardes, vos en-têtes vous avez été conçus ou tout ce que vous ont. Il s'agit donc essentiellement de regrouper deux ou trois éléments, par exemple. Nous allons créer un bouton ici, et je vais utiliser les choses Brugler ici. Et une fois que nous avons sélectionné ceci ici, nous avons ceci autour de cette rondeur de coin. Donc je vais l'utiliser ici. Donc, nous avons une belle tête ronde mais ennuyée. Maintenant, ajoutons ensuite ici. Donc, Presti et nous allons avoir un texte comme le bas Seigneur Ne sais pas, mieux évasion et nous allons l'aligner au milieu. Un peu là-haut, Jeanne, la couleur blanche. Donc je suis en train de changer la physique des piles ici en ce moment. Et ajoutons Ed ici. Donc, j'ai déjà parlé à certains hors des clés de choc. Donc, je vais utiliser le contrôle ou la commande backslash toe, obtenir ma recherche, et je vais l'icône de plongée orteil. Et ici, nous avons quatre icônes géniales. Donc c'est en fait Blufgan. Donc je vais orteil die arrow. Donc vous pouvez voir qu'on a beaucoup d'annales ici, donc je vais utiliser Non, elle était celle-là. Donc c'est l'air ici, et maintenant vous pouvez voir que nous avons ce vecteur d'avance et changer son avec 22.5. Ok, donc, non, ça a l'air bien. Cela change de couleur en blanc et nous allons le rendre un peu plus grand. Je vais donc faire pression sur ce pays dans une proportion limitée. Donc je vais aller orteil avec la taille, comme 36. Quelque chose comme ça. Ça a l'air génial. Ok, donc nous avons quelques éléments ici. Notre je vais sur notre dexter et nos antécédents. Maintenant, vous pouvez également appliquer certains effets. Si tu veux un t-shirt par ici, tu peux avoir une ombre portée comme ça. Donc 8% de sang x valeur le mouvement de cette ombre. Et voici l'ombre sur. Pourquoi signifierait qu'il va descendre de l'arrière au fond de la Lear. Donc, ici, nous avons un très joli bouton. Maintenant, maintenant, nous allons les regrouper. Alors contrôlons ou commandons G. Mais si vous ne voulez pas les tâtons, c'est bien aussi. Donc, tout comme tous les éléments et nous allons toe presser commande tout K ou contrôler tout K pour créer un composant. Donc, créons un composant. Maintenant, vous pouvez voir comme si agréable que j'ai créé ce composant. Vous pouvez voir que l'œil passé ici est totalement changé. Donc, c'est comme fondamentalement un composant maître composant est en fait notre principal élément de conception qui est dans sa forme originale. Donc, dupliquons celui-ci pour que vous puissiez appuyer sur. Allez D. Alors maintenant vous pouvez voir que j'ai un élément en double en haut offert, donc je l'ai traîné ici. Maintenant, vous pouvez voir ce que je suis parti. Le 2e 1 composant à est différent, bien qu'il soit le même que le composant un. Mais maintenant, c'est un exemple. Donc, c'est que vous pouvez voir ou entendre sur le côté droit de ce appelé Ceci est appelé instance. Et si je clique ici, il n'y a pas d'instance. Ici, c'est. Il dit composant. Donc, si je clique ici à nouveau, vous pouvez voir que nous avons cette petite zone de panneau ici à la place. Composante un. Il s'agit donc d'une instance instantanée hors composant un. Donc, c'est juste comme si vous êtes un programmeur, c'est le concept d'un parent et d'un enfant En Javascript et Java, vous faites différentes classes et les mêmes propriétés. Donc c'est comme un parent et un enfant. Donc maintenant, vous pouvez voir cet enfant a tous les parents du bureau des propriétés. Mais je pense que ce n'est pas bon. Donc, si je veux changer, par exemple, la couleur comme celle-ci, je peux le faire. Pourtant, vous pouvez voir qu'il est similaire dans tout comme son père ou l'expérience. Donc, c'est le concept hors composants. Nous avons donc ce composant. Donc, une fois que nous avons terminé la création d'un composant, nous ne pouvons pas revenir en arrière. Donc, ce composant sera disponible dans ce panneau d'actifs ici afin que vous puissiez voir ce cadre d'exercices pratiques et nous avons ce composant d'un pour que vous puissiez également le renommer. Par exemple, je vais orteil renommer Bt et télécharger. Donc, je vais le renommer BD en téléchargement. Donc maintenant, si on va aux pieds, tu peux le voir. Donc montre jolie et télécharger et je peux glisser et déposer et le placer partout où je suis né Donc vous pouvez continuer à créer beaucoup de différents actifs et composants comme celui-ci. Mais assurez-vous de les créer une fois que vous êtes finalisé avec leur conception parce que ce sera difficile. Vous avez orteil changer le composant maître pour obtenir le changement est fait. Que faire si vous voulez créer une nouvelle société afin que je ne veux pas de cette instance ? Je veux un nouveau bouton semblable à celui-ci. Mais je voulais être un autre composant, donc je vais faire un clic droit ici et je vais orteil Utilisez cette commande Detach instance. Donc maintenant, vous pouvez voir si je vais au panneau de couches, il est à nouveau hors cadre afin que vous puissiez voir ce cadre que j'ai eu ici composant toe Donc c'est en fait sur le groupe. Si vous cliquez sur le groupe, il va sortir du groupe parce que nous avons créé le groupe en premier lieu. Donc une fois que nous aurons ça, je peux changer ce que je veux. Par exemple, je veux différents coins. Donc j'ai cliqué ici, et je vais utiliser 16 ici et 16 ou cheveux et, euh, zèle. Et, vous savez, par exemple, exemple, disons que je veux un bouton comme celui-ci pour que je puisse créer un autre composant. Et je pense que cela va être et encore un composant maître. Assurez-vous donc qu'une fois que vous avez créé un composant maître, conservez les copies de votre conception et utilisez ce composant maître et déplacez-le vers une autre page . Par exemple, je vais créer une autre chienne nommée Guide de style. Donc, une fois que je retournerai à ma page, je m'en sortirai les deux. Créons une copie. Je suis en fait en appuyant et en maintenant Arche et l'option clé de l'orteil glisser et créer une copie. Donc je vais faire un coup d'orteil arraché les commandes de contrôle X, et je vais retourner dans le guide de style et le quartier par ici. Donc nous avons un composant par ici pour que vous puissiez les renommer Lord Flat ou quelque chose comme ça et, euh après, nous allons revenir en arrière. Donc, une fois que vous avez ici et que vous voulez quelque chose d'avoir changé quelque chose, par exemple, je accidentellement Jane l'orteil de couleur cette régulière et je n'aime vraiment pas et je ne veux pas qu'il soit prêt. Et je veux revenir aux pieds comme avant. Alors je vais me lancer ici. C' est Dieu réinitialisé. Instance. Une fois que je vais cliquer ici, vous pouvez voir qu'il dit réinitialiser les remplacements. Donc, j'ai vraiment entendu dans la couleur seulement. Donc, si je veux l'override, je peux remplacer les taxes aussi. Alors je vais taper. Je ne télécharge pas maintenant. Donc maintenant, si vous cliquez ici et cliquez sur ce qu'il a dit remplacements. Je vais tout réinitialiser. Donc le texte va revenir à la 1ère valeur par défaut. Mais une icône tout est réinitialisé orteil le composant maître. De même, si vous voulez traiter quelque chose ou changer quelque chose dans le composant maître, vous pouvez cliquer ici, aller le composant maître toe et il va aller à une autre page. Eh bien, en fait, le composant maître réside, donc aussi, vous pouvez ajouter une description ici. Tout ce que vous voulez sous caution. C' est tout. C' est ce que sont les composants et les instances et comment vous pouvez passer le composant maître Toe , comment vous pouvez réinitialiser les composants. Ce sont les 43 ou quatre choses comment, en fait ces composants fonctionnent. Et nous parlerons de plus de ces composants à propos de cette contrainte dans la prochaine leçon parce que je pense que je ne veux pas qu'elle soit prête longtemps. Donc c'est tout. Si vous avez des questions à me poser, passons à la prochaine leçon. 19. Utiliser des contraintes avec des composants: maintenant, dans cette leçon, nous allons donner un peu plus de détails sur ces contraintes ici. Les contraintes des pays sont donc fondamentalement des limites. Vous pouvez appliquer sur un groupe ou un composant, Alors laissez-moi partager avec vous comment vous pouvez le faire. Ainsi, par exemple, nous avons créé ces composants dans la leçon précédente. Et déplaçons les orteils là, composant maître par ici. Donc, le composant maître est en fait celui que vous allez modifier et appliquer ces contraintes ou ici. Donc, une fois que vous cliquez sur cette icône pour l'agrandir, vous pouvez voir que nous aurons des contraintes ici pour chaque élément ici. Donc, comme cette annonce ici, par exemple, laissez-moi vous montrer. En fait, si j'essaie de l'étendre, élargissons ceci et vous pouvez voir comment cela se développe. Je ne veux pas étendre cette expérience de bouton comme ça. Donc ce texte n'est pas au milieu. Ceci est en fait étiré, et c'est vraiment faux. Alors revenons en arrière. Contrôleur Kamanzi Et nous voulons que je suis en fait développer le clic. Donc, une fois que vous cliquez, vous allez relâcher. Celui-ci, vous pouvez idole appuyer sur le contrôle ou l'orteil de commande directement relâcher celui-ci, sorte que vous n'avez pas à double-cliquer ou cliquer deux fois ou essaie d'aller à cet élément. Il suffit de cliquer. Je tiens la clé de commande de votre contrôleur et je lui donne un coup de pied. Donc maintenant vous pouvez voir que nous avons assis ici échelle et échelle dans les deux directions. Donc, il va à l'échelle. Nous ne voulons pas qu'il soit mis à l'échelle. Donc on va le fixer à droite ici, coin droit, et donc en haut. Donc ça va être réparé ici. Nous ne voulons pas que cet orteil se développe dans la destruction. Nous voulions simplement nous étendre dans la direction horizontale, ni dans la direction verticale. Donc, c'est dit ainsi. Si j'ai essayé de l'étendre, vous pouvez voir Non, c'est. Il est fixé dans ce coin qui est marqué. Maintenant, vous pouvez voir ça. Ce bruit de dollar n'est pas corrigé. Donc, nous allons résoudre ce problème. Alors contrôlez ou maintenez, commandez votre contrôle et cliquez ici, et nous allons l'épingler sur la gauche. Et utilisons ce centre. Euh, ils sont à gauche et au centre. C' est bien. Ainsi, vous pouvez également faire la même vie à gauche et en bas ou en haut. Ce serait bien de le faire. Donc, vous pouvez aussi l'être comme ça. Donc, une fois que nous aurons dit cela, vous verrez ce qui se passera si nous nous élargissons. Vous pouvez voir le bas ou non est au même point où il devrait être. Et si j'essaie de m'étendre à partir d'ici, vous pouvez voir que c'est le comportement que je veux avoir dans ce Spartan. Maintenant, la partie la plus difficile de la mise à l'échelle ou d'avoir des contraintes est pour l'arrière-plan désespérée . Et donc si vous cliquez sur un mou décourageant, il est bon. Vous pouvez l'étendre dans quatre directions, mais nous ne voulons pas l'étendre en destruction. Donc maintenant je pense que ce n'est pas bon. Donc, ce que nous allons faire, c'est nous allons réduire ces frais généraux. C' est en fait qu'il est mis à l'échelle et à l'échelle. C' est donc le comportement par défaut. Ce que nous voulons, c'est en fait nous voulons une échelle de destruction. Vous pouvez voir que vous entendez l'annuel qu'il se contracte dans la direction horizontale de gauche à droite, et c'est les compétences de haut en bas. Donc, nous allons le sélectionner haut samedi et en destruction nous allons avoir de l'habileté. Laisse-moi te montrer comment ça va se comporter. Donc, vous devez le disséquer parce que vous êtes en ce moment dans cet arrière-plan, donc de sélectionné et sélectionnez ce nouveau composant. Et si j'essaie de, vous pouvez voir si j'essaie d'augmenter la hauteur, vous pouvez voir qu'il restera le même. Il ne va pas l'expansion des orteils ou l'échelle et la destruction. Mais si j'essaie de l'étendre à partir d'ici, il va se développer dans la destruction à la fois hors des sections. C' est donc le comportement que j'ai voulu avec mon composant. C' est ainsi que vous pouvez appliquer différentes contraintes sur vos boutons sur vos différentes flèches, menus, menus déroulants. Vous êtes taxés, leurs alignements et tout ce que vous pouvez voir ici. Voici mes abdos, que nous allons construire à la fin de ce cours, et vous pouvez voir si je vais au style. Les gars, nous avons beaucoup de composants Shal ici, donc vous pouvez voir que j'ai ces composants ici où nous avons cette icône et ces icônes ont été laissées et en haut. Vous pouvez voir de même, celui-ci a été à gauche et à l'orteil supérieur. Bien que je pense que ça devrait être ici comme ça, juste et job de toute façon. Donc c'est comme ça que tout fonctionne ici. De même, si vous allez à cette, euh, celle-ci et si vous cliquez sur cette adresse, vous pouvez voir qu'elle est droite et supérieure. Donc ça va rester ici si j'essaie de Toe Jane la taille qui change de taille de celui-ci . Donc vous pouvez voir qu'il va rester dans la même zone où je voulais être, donc vous pouvez voir qu'il va être au sommet droit dans la même position. Donc, c'est ainsi que vous appliquez réellement des contraintes. De même, si vous regardez la recette de recherche, ce sera la même. Comme vous pouvez le voir par ici. Ça devrait être par ici, en fait, droite et de haut. C' est ainsi que vous utilisez la contrainte dans vos composants et les appliquez pour avoir des composants plus flexibles ou mieux étendus. J' espère que vous avez beaucoup appris dans cette leçon. Passons à la leçon suivante. 20. Raccourcis communs partie 1 - Figma: dans cette vidéo, nous allons apprendre quelques-unes de la figue couramment utilisée, mes gardes courts. Et dans cette leçon, je vais vous montrer comment vous pouvez bannir ou zoomer dans vos pieds mon interface cacher et montrer certains des contrôles. Alors commençons. Donc d'abord, on va aux pieds. Regarde Penn. Donc, si vous pouvez appuyer sur votre barre d'espace et la maintenir et vous verrez cette main et vous pouvez facilement l'interdire ou déplacer votre cadre partout où vous voulez orteil, c'est le premier raccourci. Maintenant, le 2ème 1 concerne les niveaux de zoom. Donc, vous pouvez voir ici, vous pouvez voir qu'il est réglé sur le niveau de zoom ou 50%. Et il a été sélectionné ce cadre. Si vous voulez zoomer orteil 100%, vous allez appuyer sur zéro afin que vous puissiez voir c'est la taille réelle de l'image sur le cadre sont tableau d'art que j'utilise. Maintenant, vous pouvez également zoomer l'ajustement des orteils afin que vous puissiez appuyer sur un afin que vous puissiez voir maintenant qu'il a été zoomé ajustement des orteils et est de 71% maintenant et vous pouvez également appuyer sur un ou neuf. Donc, on est plus facile de se rappeler zéro pour 100% 1 est pour l'ajustement de l'orteil zoom, et deux est pour le zoom à la sélection. Donc, par exemple, si je l'ai fait, nous allons d'abord zoomer sur et vous pouvez zoomer en utilisant la commande ou le contrôle plus la touche moins. Donc, vous avez orteil maintenez votre clé de contrôle, et avec cela, vous devez appuyer moins était Omar Plus nous allons zoomer afin que ce soit très facile. De plus, donc je tiens juste ma touche de contrôle ou de commande sur un Mac si vous êtes sur une commande Mac et si vous êtes sur une fenêtre que la touche de contrôle moins et plus. Donc, supposons que je waas conception dans ce niveau de zoom et je veux zoomer sur ce Bonjour là. Donc, non, je vais d'abord sélectionner cet objet, donc je vais faire glisser et relâcher et appuyer, aussi, aussi, afin que vous puissiez voir maintenant qu'il est dans le focus. Donc, si vous voulez revenir en arrière ou vous devez zoomer orteil 100% ou voulez-vous zoomer pour adapter appuyez sur un. C' est donc un excellent moyen de zoomer avant et arrière lorsque vous concevez. La plupart du temps Lorsque vous concevez, vous devez zoomer et zoomer plusieurs fois. Donc ces raccourcis vont vous aider. Maintenant, chaque fois que vous étiez en train de vous concevoir, vous avez parfois besoin de vos règles pour dessiner certaines des lignes directrices pour soutenir votre conception ou vous devez aligner quelques choses. Donc, dans la fig ma, vous devez d'abord activer vos dirigeants afin que vous puissiez voir en haut par ici ou sur la gauche. Nous avons ce qui est normal. Donc, nous allons changer de souffle et sont maintenant Vous pouvez voir que nous avons des dirigeants en haut et à gauche. Donc si vous voulez Oh, si vous ne vous souvenez pas de ce raccourci, vous pouvez aller ici sur ce menu et ici nous avons Shift plus R. Donc vous pouvez l'activer ici aussi. Donc, une fois que vous l'avez activé, vous pouvez faire glisser les lignes directrices ici comme ceci. Ils vont poignarder deux objets différents. Par exemple, j'ai celui-là. Je vais glisser et déposer mes lignes directrices comme ceci. Donc c'est un autre raccourci. Shift sont et vous allez orteil activer vos règles. Maintenant, j'ai caché mon souverain et vous pouvez voir mes lignes directrices ont également disparu. Maintenant, si vous voulez montrer votre design à quelqu'un et que vous ne voulez pas lui montrer cette section de conception ici, ce panneau ici est également le panneau de calques sur la gauche. Vous pouvez appuyer et maintenez votre touche de contrôle ou de commande avec votre barre oblique arrière Donc contrôler barre oblique inverse et vous pouvez voir que nous avons caché notre fig Mazz vous y qui est autour de nos objets. Donc encore une fois, vous pouvez le montrer en appuyant et en maintenant la commande du contrôleur plus barre oblique inverse De même, nous avons un autre raccourci qui est la barre de recherche. Donc, si vous voulez rechercher quelque chose rapidement dans fig MMA ou si vous voulez ajouter quelque chose tout ce que vous voulez rechercher un plug in, vous avez installé la touche de raccourci est control backslash afin que vous puissiez voir contrôle ou commande touche de commande plus backslash afin vous pouvez rechercher par exemple, chaque goudron Andi, Je viens de cliquer ici air ITAR plug in et vous pouvez voir ici nous avons un nom il sont Nous pouvons également aller à nouveau à la recherche et nous pouvons également rechercher des exemples comme ce contenu réel ou société gagné beaucoup de choses. Il y a des voitures courtes. Il y a des branchements. Tout peut être recherché par cette barre de recherche ici, Donc c'est un très commun très facile à utiliser raccourci clavier contrôleur commande barre oblique avant. Donc, vous devez vous rappeler qu'il barre oblique arrière pour cacher votre vous je fermier barre oblique orteil tel Maintenant, si vous concevez pour des sites Web ou APS mobiles, vous pourriez avoir vos grilles ou colonnes disposition ici. Si vous êtes familier avec bootstrap ou d'autres heures Gridley. Donc, je vais rapidement ajouter un grand ici, Ajoutons d'accord. Et, par exemple, nous avons cet incroyable ici activé. Et si je veux le cacher rapidement,par exemple, par exemple, je suis en train de concevoir ici et je ne veux pas d'orteil, vous savez, dérangé par cette croyance, j'ai orteil utiliser ma touche de raccourci, qui est le contrôle Shift plus quatre sur Windows et Control plus G sur Mac contrôlé Shift quatre sur les fenêtres afin que vous puissiez voir en bas. Il est dit grille de mise en page cachée. C' est très agréable dans la marque de figue qu'il vous montre les commentaires, ce qui est vraiment, vraiment sympa. Offrez n'importe quel logiciel de conception. Si vous êtes une expérience utilisateur ou familier avec l'expérience utilisateur, vous savez que les commentaires sont très importants. Commandez donc G sur un Mac. Si vous êtes un utilisateur Mac pour masquer ce décalage de mise en page et de contrôle plus quatre, ces trois touches vont se cacher. Lee out crée sur Windows, donc c'est tout au sujet de certains raccourcis qui vont cacher et montrer différentes choses pendant que vous êtes en train de concevoir. Passons à la leçon suivante où je vais partager avec vous quelques-unes des touches de raccourci dont vous avez besoin pour vous familiariser. Passons donc à la leçon suivante. 21. Raccourcis clavier clavier commun partie 2: dans cette vidéo, nous allons regarder quelques-uns des raccourcis clavier les plus Sigma qui sont couramment utilisés lorsque vous êtes sur un cadre ou un canevas. Donc, chaque fois que vous avez ouvert un nouveau fichier, il y a beaucoup de choses que vous pouvez faire. Par exemple, vous souhaitez aligner ces objets. Donc, d'abord, nous allons regarder ces touches de raccourci d'alignement. Vous devez donc sélectionner deux objets pour les aligner. Donc, une fois que vous avez un mensonge sélectionné pour les désactiver, vous pouvez appuyer sur art et nous pour les centres verticaux. Non, je vais appuyer sur tout et nous Donc maintenant vous pouvez voir qu'ils se sont alignés dans une direction verticale . Donc la partie inférieure va venir et la gauche descendait, je pense que je vais revenir le contrôleur Kamanzi et Art et V. Vous pouvez voir de la même façon que nous pouvons faire, euh, euh, avec l'art et l'âge pour les centres horizontaux. Donc ce sont des centres horizontaux, vous pouvez voir ici ce sont leurs centres. Donc, je vais appuyer sur tous les orteils plus démangeaisons les aligner comme ça, par exemple. J' ai ceci et ceci et je veux les aligner ou doucement je vais appuyer sur l'art et chacun de sorte que vous pouvez voir ceci est comment vous alignez différents objets. Et le plus souvent, nous utilisons l'alignement horizontal et l'alignement vertical. Maintenant, nous allons regarder quelques raccourcis sur les outils ici en haut, ce que nous allons faire beaucoup plus de fois. 1st 1 est un R F pour tableau d'art. Vous pouvez dessiner votre cadre ou votre art, mais ici, ou vous pouvez cliquer ici et choisir parmi une taille prédéfinie ou ici, par exemple. Je vais aller avec cet androïde. Non, nous allons zoomer et je vais bannir les orteils ici, et je vais appuyer sur mon arc pour un enchevêtrement ou quatre ellipses, et je vais tenir mon orteil clé de changement, l' avoir en proportion comme cet enfer pour ligne. Donc je vais traîner ma ligne. Je tiens le quart de travail, donc il est droit de la même façon pour l'outil fiscal. Je vais appuyer sur mon thé, et je peux faire glisser comme ça ou je peux juste Presti et oups, je suis un bout de presse évasion et je dois aller à Presti à nouveau et appuyer sur ici. Bonjour, Espoirs Bonjour, ma chère. Quelque chose comme ça et je vais appuyer sur évasion à un moment comme ça. Donc c'est comme ça que vous allez utiliser ces outils ici ? Si vous voulez accéder à l'outil dépenser, vous pouvez appuyer sur la touche de raccourci et faire quelque chose comme ça, quelque chose comme ça. Et, euh, je pense que tout est hors des touches de raccourci, je pense qui sont couramment utilisées. Et ce sont les outils que nous allons dépasser encore et encore. Maintenant supprimons celui-ci, et je vais y retourner. On est là et on va étudier. Certains des plus raccourcis allaient généralement utiliser beaucoup de fois l'un d'entre eux est dupliqué, donc je voulais le choisir cette couche, et je veux qu'il soit exactement pareil comme ceci. Il y a plusieurs façons d'abord d'utiliser l'art ou la touche d'option et d'appuyer sur, et vous aurez un double curseur comme celui-ci. Il suffit de faire glisser cet objet où vous voulez le placer, et vous pouvez voir qu'il s'agit d'un doublon. Maintenant, vous pouvez appuyer et maintenir la commande ou le contrôle plus d tohave. Un autre duplicata, ce sera. Il va répéter votre pas. Le même espacement tout et dupliquer l'objet. Non, on a trois de ces rectangles. Je veux les tâtonner. Je vais les sélectionner tous et je vais appuyer sur Commandant Control G Group eux maintenant. Vous pouvez voir l'icône ici. Ce groupe a été modifié. Il a cette réponse de marche autour d'elle. Donc c'est un groupe et tous ces rectangles sont à l'intérieur de ce groupe ? Non. Si vous voulez Owen, regroupez-la la même touche de raccourci. Mais avec un ajout off shift. Donc, le contrôle ou la commande, plus le décalage plus g. Vous pouvez voir maintenant qu'ils sont de retour. Nous sommes hors de ce groupe. Ce groupe n'est plus. Ou là maintenant, sur la gauche, vous pouvez voir que c'est notre pile précédente. Donc, nous avons l'image au rectangle supérieur ce rectangle bleu au bas trois rectangles noirs et du texte. Non, Si vous voulez changer la position de l'empilement sans, vous savez, l'aide de votre souris, vous pouvez soit les faire glisser comme ceci, sont traînés comme ceci. Par exemple, j'ai ici, donc si je déplace mon rectangle en haut, vous pouvez voir que le texte est derrière ce Lear donc si je le déplace vers le haut, il est maintenant par ici. Donc, cela s'appelle ordre d'empilement. Je vais changer les couleurs de ces rectangles pour que vous puissiez facilement voir la différence. Et pour celui-là, je vais utiliser du blanc. Maintenant, vous pouvez voir que j'ai tous ces rectangles ici, et c'est mon rectangle en bas. Non. Si je veux changer l'ordre d'empilement, je peux utiliser la touche de raccourci comme le décalage de contrôle et les parenthèses. Donc, non, je vais appuyer. J' ai sélectionné ce calque, par exemple, ce calque, et je vais le déplacer vers le haut ou vers le bas en utilisant le décalage de contrôle sur le support afin que vous puissiez voir ici vous pouvez soit utiliser cela va orteil être en bas. Donc, si je frappe pour utiliser le changement de contrôle et le support enregistrement gauche, il va descendre la plupart, um, toutes les couches, pile pile. Donc, même, si j'appuie sur le bon enregistrement ou la fin de l'enregistrement, il va augmenter. Vous pouvez voir ou entendre la touche de raccourci pour le clavier Mac est art plus commande plus support. Il est donc notre support de commande et pour le changement de commande de fenêtres et le support de gauche et de droite . Ainsi, vous pouvez également retirer votre décalage de la touche et vous appuyez simplement et maintenez le contrôle avec votre support et vous pouvez voir qu'il va se déplacer d'un pas vers le haut, d'un pas vers le bas, un pas vers le haut. Donc je laisse la garde à l'intérieur de cette, euh, touche de raccourci. Donc, je vais afficher les deux raccourcis dans la version Mac et la version Windows pour le mouvement d'une seule couche si ce n'est pas la pile et se déplacer de haut en bas et en haut de la pile en utilisant vos touches de raccourci. Maintenant, terminons cette leçon en vous montrant les dernières touches de raccourci d'orteil, qui sont masquantes, et ce composant pour que vous puissiez voir si vous passez la souris là-bas. Il vous montre également la touche de raccourci pour Windows. Il est art de contrôle plus K. Et pour Mac, il est le contrôle tout pour plus trier, commande R plus clé ou option plus clé. Donc même, tout est pareil. Juste commande est pour Mech. Donc, pour créer un composant qui va être utilisé encore et encore. Alors je vais me moquer des orteils. Tous ces trois et je vais orteil soit cliquez ici ou je peux passer l'art de contrôle et la clé . Et maintenant, vous pouvez voir que l'icône a été modifiée. Et c'est un composant maintenant, donc vous pouvez voir que c'est une très bonne touche de raccourci. Nous allons l'utiliser encore et encore si vous voulez. Orteil, revenez, orteil vos anciens états et vous voulez casser ce composant. Vous ne voulez pas l'utiliser correctement. Peut-on avoir beaucoup d'options ici ? D' accord. Pour que vous puissiez voir ou entendre. Avancez. Ramenez à l'arrière. C' était le raccourci. Les clés sont utilisées sélection de groupe ou sélection de cadre. Vous pouvez également les encadrer. Aplatir le contour, utiliser comme mosquée. Il s'agit de la touche de raccourci suivante. Je vais vous dire de contrôler plus m. Donc c'est comme ça que vous créez un composant ? Non. Si vous voulez masquer quelque chose, par exemple, je vais utiliser une ellipse ici. Et je veux une mosquée, cette zone derrière moi. C' est donc un composant à l'arrière, et c'est l'ellipse en haut. Donc ce que je vais faire, c'est que je vais aller aux pieds. Déplacez ça à l'arrière. Celui-ci est à l'arrière. Vous pouvez voir que ça va être ma mosquée et la plus haute sera ce que j' essaie de cacher. Donc ces parties à gauche et à droite vont être cachées. Je vais donc choisir les deux. Vous pouvez voir que mon conteneur est à l'arrière et mes informations ou tout ce que je veux montrer. Mon contenu est à l'avant conteneur à l'arrière, contenu à l'avant. Donc nous allons les relâcher et nous allons contrôler les seins des orteils ou commander R plus M contrôle sur eux. Donc, vous pouvez voir maintenant qu'ils sont doivent. Donc, c'est Vous pouvez voir ce signe montre que vous pouvez voir. Quoi ? Ici. C' est petit. Euh, tu peux voir comme la lune. Donc c'est cette icône. Cela montre que cela a été masqué. Donc c'est en fait nos mosquées. que vous puissiez voir, montrer et cacher notre mosquée en cliquant ici. Nous pouvons également verrouiller la couche ici, et ce sont nos composants. C' est donc le contenu que nous essayons de montrer. Donc, non, j'ai un conseil très petit et simple pour vous. Donc, une fois que vous êtes en train de concevoir et commencé à concevoir dans la figue MMA et que vous avez oublié n'importe quel requin . Erkki, ne fais pas de Google. Il suffit de cliquer ici dans cette zone étroite, ce point d'interrogation. Et ici, nous avons des raccourcis clavier. Donc, une fois que vous sélectionnez ces raccourcis clavier, que vous soyez sur un Mac ou un PC Windows, vous pouvez facilement voir quels que soient les différents raccourcis. Zoom, les formes fiscales élection provoquent qu'ils transforment, arrangent et composants. Donc, cela termine notre fig plus de raccourcis. J' espère que vous avez apprécié et appris Seigneur des cartes courtes et que vous allez les utiliser dans vos prochaines leçons. Et dans votre nouveau, vous pouvez voir des projets de conception. Donc, si vous avez des questions à me poser, passons à la prochaine leçon. 22. Collaborer avec des concepteurs dans Figma: l' une des fonctionnalités les plus cool de Sigma est que vous pouvez collaborer avec d'autres designers, vivre dans n'importe quel design. Donc, si vous concevez, par exemple, ce fichier, vous pouvez voir que vous voyez deux cours ici. L' un est ici, ce qui est juste changement montrant le nom de l'autre concepteur, qui est inclus dans mon équipe en ce moment. Vous pouvez voir ici dit 40 mois maintenant si je reviens l'équipe de mon équipe, vous pouvez voir que c'est mon équipe que vous. Excitant. Et du côté droit, tu vois que c'est moi. Et c'est en fait mon autre œil. Mac et moi avons connecté et en utilisant un autre compte en utilisant ce nom, alors j'ai essayé de changer en lui. Il est donc plus facile pour vous de voir que quelqu'un d'autre essaie de changer cette conception. Vous pouvez inviter les membres en cliquant sur ceci dans les membres blancs ici, mais vous devez venir à cet écran hors de votre équipe, en fait, donc c'est mon équipe. Et si on y retourne, laisse-moi revenir. Et par exemple, vous pouvez voir ce sont les changements que j'essaie de faire. Non. Si j'essaie de changer quelque chose sur mon I, Mac, ou d'essayer de changer le mouvement, le curseur que vous pouvez voir. Maintenant, il montre que la Fatma ou l'autre designer essaie de changer quelque chose. Donc si j'essaie de tenir ça et d'essayer de le faire glisser ici, vous pouvez voir que c'est en fait, euh, qui se passe sur mon autre Mac. Donc je ne le fais pas sur mon PC. Donc, si j'essaie de faire quelque chose comme ça et si j'essaie de changer la couleur, laissez-moi changer certaines choses ici pour que vous puissiez voir que deux designers peuvent travailler simultanément sur ce design. Donc, j'essaie de bouger, mettre mes clients et essayer de changer, Vous pouvez voir. Donc c'est moi qui bouge et une autre boîte se déplace par un autre designer. C' est ainsi que vous pouvez réellement travailler simultanément sur une conception unique et deux ou plus deux concepteurs qu'ils peuvent travailler simultanément. Donc, si vous travaillez en équipe, vous pouvez travailler sur une conception unique, et vous pouvez accélérer votre projet en ayant plusieurs concepteurs travaillant sur la même chose. Donc, si vous avez, par exemple, des gardes de style déjà créés et vos composants. Vous pouvez simplement ajouter des concepteurs et ils vont glisser et déposer ces composants et continuer à construire des projets avec beaucoup de vitesse. C' est donc une fonctionnalité très cool Off Sigma collaboration avec leurs designers. C' est ce qu'on appelle la collaboration en direct. Beaucoup d'autres outils sont également en train de l'implémenter. J' espère que vous avez apprécié cette leçon. Si vous avez des questions ou des suggestions, vous pouvez toujours me demander, Passons à la leçon suivante. 23. Travailler avec des bibliothèques d'équipe: dans cette vidéo de, nous allons parler d'une très belle fonctionnalité sur les mariages Rick appelés bibliothèques d'équipe afin que vous puissiez partager votre vous pouvez voir ou entendre des textiles. La couleur s'efforce sur vos styles de faits, ainsi que tous vos composants. Donc, chaque fois que je conçois, je conçois en fait. La plupart du temps, j'ai conçu dans une page de conception, donc j'ai une page séparée pour le guide de style. Donc, dans cette page, j'ai normalement tous les composants, toutes les icônes différentes, qui sont déjà des composants. Je vais donc partager avec vous comment Toe gère réellement votre bibliothèque d'équipe et comment vous pouvez mettre à jour et comment cette mise à jour reflètera les autres membres de votre équipe. Donc c'est Il est fondamentalement genre de collaboration sur le partage de bibliothèque conçu où vous pouvez partager toute votre entreprise et vendre vos styles que vous avez créés dans votre projet. Ainsi, d'autres concepteurs peuvent facilement les ramasser et les utiliser dans d'autres écrans. Donc, ce que vous devez faire est quels que soient vos principaux composants. Par exemple, vous pouvez voir la navigation en bas. C' est en fait un composant, et c'est l'exemple que je garde tous mes composants maîtres dans ce guide de style. Donc, dans le guide de style, vous pouvez voir. Nous avons tous les composants que nous avons logo, petit logo, grand logo que nous avons. Différent signifiait ce plan de régime puces, et puis nous avons des boutons différents que nous avons. Barre de recherche. Ce sont des navigations. Donc, ce que nous allons faire, c'est que nous pouvons créer différents cadres, par exemple, ou celui-ci. Je vais l'appeler Navigation. Ce que je vais faire, c'est qu'on n'a pas besoin de celui-là. Donc celui-ci n'est pas dans la navigation. C' est en fait de la navigation. C' est en fait une navigation. Et, euh, ce n'est pas de la navigation. C' est en dehors de ça. C' est aussi à l'extérieur. Je vais donc les séparer en remorquage, différentes catégories. Donc je les gère dans différents tableaux d'art. Ou vous pouvez les appeler cadres. Donc la navigation va être par ici. Donc quoi que ce soit dans la navigation, ça va rester ici. De même, je vais créer un autre cadre A ou F G. et ici je vais l'appeler, hum, boutons et contrôles. Donc ici, je vais faire glisser Mes deux fait semblant de ma telle barre parce que c'est un élément de contrôle. C' est OK, sélectionne, déplace-les ici aussi. Et à part ça, je pense que ça va aller. Maintenant, nous allons créer un autre cadre. Appelons ça, hum, hum, arrêtées être des gardes et des objets. Donc, ici, nous allons utiliser toutes ces options qui vont être à l'intérieur de la recette. Chardons. Ça va aussi être la recette. Ceci est en fait lié à la recherche. Bougeons-les. Je vais les déplacer dans la section des fardeaux ici parce que ce sont des épingles, donc nous allons les utiliser. Euh, ok, donc nous avons une carte, une grosse carte de recette ici, donc je vais agrandir ce tableau d'art ensuite. Déplacez-les ici, faites de cette planche d'art un grand, plus grand comme ça. Ensuite, nous avons cette grosse recette, cette petite recette, puis nous avons cette carte. Ensuite, nous avons l'étape de la recette de l'étape de préparation d'une recette. Donc, nous avons différents composants ici. De même encore. Si vous voulez garder votre logo, je vais les appeler. Nous allons créer dans qui sont ennuyés ou cadre. Et je vais l'appeler, hum go, go et icônes. Donc je vais attraper tous mes logos et icônes et les faire glisser ici comme ça. Ce sont quelques icônes. En fait. Vous pouvez créer un paquet entier de cinq comptes ici. Donc, je suis en train de créer Faisons de ça un habitué ici. Et maintenant, je vais juste redimensionner mes tableaux d'art. Rien d'autre. Rien de fantaisie. Ce sont mes icônes étaient ici et mon local et je vais aller orteils. Gardez-les comme ça. Ok, Donc une fois que j'ai créé sur géré ce guide de style, vous devez aller atouts et vous pouvez voir ici. Ils sont appelés, mais puis nous avons Si nous, hum, ouvrons ces boutons et contrôles, nous avons différents boutons et contrôles. Ensuite, nous avons des logos. Je pense que celui-ci convient mieux dans la section des recettes ici. Et encore une chose, si vous voulez changer la couleur de fond un peu quelque chose d'autre parce qu'il est plus facile voir les arrière-plans blancs ici. De même, pour celui-ci, je vais utiliser un peu de garantie rouge Gresh ici. De même, pour celui-là, je vais aller avec ça. Et aussi pour ce plaisir, juste pour s'assurer que tout est visible facilement, Uh, Rallons-le plus petit comme ça. Ok, donc on a tout géré. Si nous allons actifs orteils, vous pouvez voir que nous avons différentes catégories. Les habitants et la navigation est plus facile orteil. Vous les réutilisez. Non. Une fois que vous avez organisé tous vos styles, vos composants, vous devez cliquer sur cette icône de bibliothèque d'équipe dans ce panneau d'actifs déplacé à oh, ce panneau d'actifs et cliquez sur celui-ci. Maintenant, vous pouvez voir que j'ai cette fig Mahfoud AB vous pouvez cliquer sur Publier et nous allons orteils. Appelez-les. Appelons-les pleins. Maintenant, vous pouvez voir qu'il est la bibliothèque de publication. Il me montre qu'il va publier ces mises à jour de bibliothèque publiées avec succès. Maintenant, une fois que vous avez publié votre style, vous pouvez retourner à Sigma. Donc ici, nous avons cette stigmatisation, un gaz de stigmatisation, qui est notre appris, vous excitant. Et maintenant, je vais créer un nouveau fichier ici. Alors créons un nouveau fichier. Sans titre et je vais ouvrir celui-ci sans titre et je vais créer un cadre. Et si j'ai déplacé des actifs, vous pouvez voir si nous avons un onglet ici pour créer un secteur de composants Lear. Pour cela, nous allons explorer nos bibliothèques. Donc je vais cliquer ici, et je vais faire ça pour ce dossier. Donc, une fois que j'ai allumé ça, vous pouvez voir que je peux avoir accès à tous les boutons. Tout ce qu'on a ici. Par exemple, ce bouton glisser ensuite les choses jettent ici sur cette telle barre ici. Donc, je peux utiliser tous ces composants. De même, si j'essaie de créer, par exemple, et de m'emmêler ici et que je veux l'accès aux orteils, les couleurs que vous pouvez voir nous avons toutes les couleurs ici. Donc, ce sont mon style, par exemple, la crème rayonnante disque. Donc, je peux accéder à tous mes styles, tous mes boutons, tous mes composants, par exemple, Ici nous, si nous l'appelons un composant de carte de recette, vous pouvez voir que j'ai tous ces composants. Par exemple, celui-ci. Je peux le faire glisser ici et l'utiliser comme ça. Donc, tous mes autres concepteurs, ils peuvent simplement glisser et déposer à l'intérieur d'une équipe, par exemple, nous avons Revenons en arrière et vous pouvez voir que c'est notre équipe vous a appris passionnant. J' ai donc créé le guide de style Theis dans cette équipe. Donc, je suis juste exploité plan de l'équipe d'éducation. Ils m'ont donc permis de créer ce système de conception sur ce guide de style de conception qui peut être partagé avec d'autres membres de l'équipe. Maintenant, vous pouvez voir que c'était mon projet. Et si je crée un autre membre de l'équipe, par exemple, c'est bien plus que nous sommes ici. Si elle ouvre un nouveau document ou qu'elle essaie d'ajouter quelque chose ici, elle peut facilement accéder à tout ce design. Et par exemple, les jambes. C' est local. Ainsi, vous pouvez voir que nous pouvons également accéder à nos textiles. Par exemple, si j'essaie d'écrire quelque chose ici, allons-y. Et maintenant tu peux voir si je vais par ici. J' ai des textiles pour la nourriture, une carte de figues donc je peux passer à celui-ci ou je peux passer à celui-ci. Par exemple, celui-ci vous pouvez voir que nous sommes ici. Je peux également passer à n'importe quel style de pont que vous avez afin que vous puissiez voir ici nous avons différents textiles afin que vous puissiez changer d'orteil n'importe quel textile. Et si vous voulez changer, allez à la définition de l'orteil a. Donc, si je vais ici et si je change quelque chose dans ce guide de style ici, par exemple. Jane quelque chose ici, par exemple, celui-là. Donc, je vais changer la droite de celui-ci afin que vous puissiez voir dès que je change quelque chose il dit Publier les changements d'éditeur dans vos bibliothèques d'équipe si je clique sur Publier. Bizarre changé. Donc, je vais mettre à jour ma bibliothèque de publication que j'ai changé cette chose. Publiez ici. Et maintenant, si j'y vais, accord ? Et j'essaie d'utiliser celui-ci pour qu'il soit déjà opéré. Changeons encore. Par ici. Changeons encore. Alors je vais me mettre sur les pieds juste les déplacer au milieu comme ça. Je l'ai fumé au milieu. Nous allons donc publier à nouveau les modifications. D' accord ? Donc, non, Si je vais ici, vous pouvez voir qu'il dit que les sujets des composants sont disponibles, donc si je peux le rejeter ou je peux réviser Donc si vous cliquez sur le commentaire, il dit que vous devez le mettre à jour. Donc, si j'essaie de mettre à jour, vous pouvez voir qu'il va orteil mettre à jour l'alignement offert. Alors laissez-moi vous montrer une mise à jour de plus, sorte que vous pouvez facilement voir la vue afin de changer sa couleur à autre chose. Utilisons cette, euh, cette couleur orange juste orteil démontrer que j'ai changé un tueur. Comment ? En fait, les bibliothèques de vapeur fonctionnent. Donc je suis là, essayant d'utiliser les orteils. Celui-ci et le nouveau est en fait celui orange, donc je dois l'examiner. Je dois le mettre à jour et vous pouvez voir qu'il a été mis à jour à celui-ci orange. C' est ainsi que vous partagez des bibliothèques avec les membres de votre équipe. Vous pouvez partager vos composants. Vous pouvez partager tout votre style, guider votre style, vos boutons, vos composants avec les membres de votre équipe. Et c'est ainsi que vous les gérez réellement dans différents cadres orteil. Nommez-les correctement. Donc, quand quelqu'un y accède, vous pouvez voir qu'on est là. Quelqu' un y accède. Ils ont différentes catégories, sorte qu'ils peuvent facilement les faire glisser vers le haut. Donc tu dois bouger. Chaque fois que vous créez un nouveau fichier, vous devez passer à des ressources et essayer d'utiliser en essayant d'activer la troisième bibliothèque. Donc, si j'ai activé celui-ci, vous pouvez voir que je peux aussi accéder à la bibliothèque de couleurs personnelles. Donc c'est effacé un rectangle. Et si je vais par ici, vous pouvez voir ici nous avons l'application freak Mahfoud, les nouvelles couleurs passionnantes et les couleurs personnelles. Donc ce sont toutes différentes bibliothèques, ces bibliothèques d'équipe de directeurs. Je peux accéder à tout projet. J' espère que vous avez apprécié cette leçon de bibliothèque d'équipe. Si vous avez des problèmes ou si vous êtes coincé quelque part, vous pouvez toujours me poser une question ou commencer la discussion. Passons à la leçon suivante. 24. Tab de communauté dans Figma - Nouvelle fonctionnalité: Aujourd'hui, nous allons voir une toute dernière fonctionnalité de sigma ab, qui est la communauté. Maintenant, ils viennent de publier leur onglet communauté. Vous pouvez voir ici sur la gauche, Communauté dans le lit bêta. Ceci est la version bêta pour la communauté et c'est une grande, vraiment grande initiative et vraiment grande fonctionnalité pour cette fig mon application. Et vous allez vraiment en profiter. Donc, si vous cliquez ici sur la communauté, vous pouvez voir ceci est mon profil Fichman. Handel dit Fichman.com, S et N3C et le taux de l'actif et DC. Et si vous ne savez pas comment définir votre profil public, cette URL, vous pouvez aller ici, votre nom. Laissez-moi revenir aux paramètres. Donc, vous devez aller aux paramètres. Et vous pouvez voir dans les paramètres, c'est mon nom, e-mail, mot de passe. Et puis nous avons une autre chose qui s'appelle le profil public. Maintenant, vous pouvez voir que j'ai défini mon handle de profil public à S et destinataire. Et si vous voulez définir votre profil public, essayez de choisir le nom qui vous est propre ou vous l'utilisez beaucoup sur différents forums. Ok, donc une fois que vous avez défini votre profil public, alors définissez votre profil public, vous pouvez aller dans la communauté. J' ai donc dû cliquer deux fois sur la communauté pour venir ici. Quelque chose était en train de foirer. En fait, c'est en bêta. C' est donc peut-être le problème. Ok, donc ici nous avons, si vous regardez en haut, nous avons différentes catégories, enfants de l' interface utilisateur, si vous cliquez sur les kits d'interface utilisateur, vous aurez beaucoup de kits d'interface utilisateur gratuits. Les personnes, les différents membres de la communauté qu'ils partagent avec vous ou avec d'autres membres. C' est donc une excellente initiative que différentes personnes ont partagé leurs ressources et que nous pouvons les utiliser et les intégrer dans nos projets. De même, vous pouvez voir que nous avons la conception web. Il y a donc beaucoup de ressources pour les icônes, pour l'illustration. Donc, si vous, par exemple, si vous voulez apporter quelque chose, vous pouvez cliquer ici. Et on peut aimer ça. Par exemple, je les aime, donc je vais cliquer dessus, comme vous pouvez dupliquer cela. Donc, si je clique sur duplicate, il va s'ouvrir dans mon onglet sigma comme un nouveau fichier. Vous pouvez voir maintenant que nous avons toutes les illustrations afin que nous puissions les utiliser dans nos projets. C' est vraiment facile à utiliser ces illustrations. Donc, pour revenir à la communauté, laissez-moi vous montrer qu'il y a peu de choses que je vais vous montrer qui pourraient vous être utiles. L' une est cette fente ID tags. Donc, si vous voulez chercher quelque chose, icônes, ensemble d'icônes ou quelque chose, vous pouvez cliquer ici. De même, nous avons des illustrations. J' aurai des fils filaires et nous avons conçu des systèmes qui sont vraiment utiles. Donc, si vous essayez de démarrer un site Web ou quelque chose comme ça, vous devez utiliser un système de conception. Donc, pour pouvoir l'utiliser, il y a une fonctionnalité, laissez-moi juste utiliser celle-ci. Et dupliquons ceci. Vous pouvez voir 1.1 K 1100 personnes l'ont déjà dupliqué. Donc, je vais cliquer sur duplicate. Et je vais m'ouvrir dans ma FISMA. Voyons voir, ça prend du temps. Ok, donc nous avons les styles de conception de matériaux que vous, je comprends. Maintenant, si vous allez par ici, par ici, vous pouvez voir que c'est en fait ouvert dans mes brouillons. Donc, c'est en fait mon projet qui est ébauche. Si je veux l'ouvrir, je dois l'ouvrir ici ou le déplacer vers autre chose en cliquant ici. D' accord ? Donc maintenant, chaque fois que vous devez partager votre conception matérielle, vous devez aller à des actifs. Et vous pouvez voir déjà il y a une version légère, il y a beaucoup d'atouts. Donc ici, maintenant vous pouvez cliquer ici et vous devez cliquer sur Publier. Pour publier ces styles. Vous devez publier ce guide de style pour pouvoir l'utiliser dans vos conceptions. Donc, je vais cliquer sur Publier. Passer à l'équipe pour publier des composants. Alors déménageons l'équipe. Passons à mon déménagement. Passons à la classe sigma. C' est un projet. Donc je vais dire Material Design Lite. Donc je vais le publier maintenant. D'accord ? Maintenant, une fois que vous les avez publiés, nous devons revenir à cette classe sigma. Ok, donc en ce moment, dans ce projet, il a été partagé. Donc, si j'essaie d'ouvrir un fichier, par exemple, ce sans titre ici, je peux utiliser ces composants. Donc supprimons ceci. Supprimez ceci. Donc si je vais aux biens, vous pouvez voir qu'on m'a laissé aller à celui-ci. Vérifions celui-ci pour qu'il soit partagé, mais je dois l'activer. J' ai donc utilisé cette icône de bibliothèque. J' ai donc une alerte de deux nm. Et vous pouvez voir que j'ai des composants de conception de matériaux ici. Si je veux utiliser un composant comme celui-ci, plus le bouton ou le bouton Nouveau fichier ou quoi que vous l'appelez. Je peux faire glisser et déposer différentes listes. Je peux glisser et déposer différentes cartes. Donc, je ne veux pas les créer par moi-même. C' est un très bon début. Cela va vous faire gagner des tonnes de temps. Vous n'avez pas besoin de créer tous ces composants. C' est donc la caractéristique des communautés. Donc, la communauté est vraiment utile. Je vais mettre un amour ici. Et si je retourne en arrière, tu peux voir si je retourne dans ma communauté ici, si je retourne à l'école, quel est le problème avec ça ? Il ne retourne pas parfois à la communauté sigma de toute façon. Donc si vous revenez à mon profil ici et que votre profil est visible, ouvrons celui-ci. Donc, vous pouvez voir dans ce profil, j'ai des ressources et comme si je clique sur les goûts, vous pouvez voir, donc toutes les différentes ressources que j'ai jus ou j'ai aimé r ici. Donc, vous pouvez voir profil utilisateur, bibliothèque sigma, j'ai vécu. Ici. Nous avons ces deux plugins. C' est ainsi que vous utilisez réellement votre communauté. Donc, revenons à la communauté et nous pouvons cliquer sur les plugins pour que nous ayons à déposer des onglets ou des fichiers de cheveux et des plug-ins. Ainsi, vous pouvez également explorer différents créateurs. Par exemple, cette personne, cette personne, ou si vous voulez les suivre, vous pouvez les suivre pour de nouvelles mises à jour. Donc toutes les nouvelles extensions ou quelque chose comme ça. De même, je peux cliquer sur des systèmes de conception , par exemple, comme celui-ci, et je peux l'utiliser dans mes designs, mes sites Web ou autre. C' est donc une excellente fonctionnalité à utiliser. Obtenez différentes ressources, utilisez-les et accaparez-vous et dites merci et mettez un peu d'amour aux ressources ou aux créateurs de ces ressources. C' est une fonctionnalité vraiment géniale, un excellent ajout à sigma. J' espère donc que vous avez apprécié cette leçon. Si vous avez des questions, vous pouvez toujours me poser. Passons à la leçon suivante. 25. Utiliser des grilles et des guides: dans cette leçon avant de creuser dans le remorquage et commencer à concevoir quelque chose que je vais orteil vous familiariser avec certains des concepts que nous utilisons beaucoup de temps dans les conceptions dans la conception, votre conception, Web design et beaucoup de concepteurs et de cours. J' ai vu qu'ils manquent réellement cela, ce qui est très important, et c'est en fait la grille de mise en page. Donc, vous avez toujours orteil utiliser la grille de mise en page chaque fois que vous concevez pour un écran mobile. Oh, notre site web. Donc, dans cette vidéo, je vais vous expliquer comment vous pouvez utiliser cette note de mise en page et comment vous pouvez créer des sorties différentes lorsque vous concevez pour des sites mobiles et Web. Maintenant, si vous voulez voir comment créer bootstrap grade, si vous êtes un concepteur Web, alors vous pouvez avoir à YouTube ma chaîne et vous pouvez regarder cette vidéo. Bootstrap pour la création de groupes, ceci est une vidéo détaillée de huit minutes vidéo sur la façon de créer et Bush un quatre grade en sigma. Alors commençons et voyons comment nous pouvons créer différents types de lits d'enfant. Donc il y a en fait deux types de carrières, donc je vais vous montrer que l'une est en fait la mauvaise cupidité de ce porc. Et 2ème 1 si j'essaie d'ajouter ici, vous pouvez voir qu'il va ajouter sous un. Donc par défaut est grand, tellement génial. Donc je vais aller aux pieds et 10 porcs malades sont la taille de la boîte, donc vous pouvez voir si on zoome ici. Cette boîte est de 10 porcs malades par 10 pixels. Donc, si nous voulons changer quelque chose, par exemple, j'ai averti que la boîte allait être une grosse vente et je ne supprimerai pas cela. Donc, cela s'appelle 88 sortie Great. Que nous utilisons beaucoup de temps dans le développement mobile Android et même dans nos conceptions U. S. S.. Donc, si vous concevez pour iPhones ou Android abs, je pense que c'est une grande grille enfant. Donc, si vous voulez changer la couleur du Grand, par exemple, je veux qu'il soit un peu dans cette grande région, quelque chose comme ça. Vous pouvez changer la couleur hors de l'écran. Donc c'est comme ça que tu as créé Theis ? Euh, c'est exalté. Maintenant, nous allons aller orteil goto autre chose, qui s'appelle colonnes et lignes. Donc, si je conçois pour des laboratoires mobiles, je dois aligner mes choses sur des colonnes plus grandes. Donc, ils nous ont mise en page simple ou suivre une mise en page. Donc, pour l'alignement, je vais ajouter quelques colonnes afin que vous puissiez voir que je peux ajouter, comme n'importe quel nombre de colonnes. Mais toujours essayer orteil, ajouter les chiffres qui peuvent être divisés par deux. Donc ne jamais ajouter nos chiffres, même utiliser. Toujours utiliser des nombres pairs. C' est ainsi que vous utilisez les nombres pairs. Donc, je suis en fait en utilisant six en ce moment sur cette conception, vous pouvez voir que je peux voir en arrière-plan parce que ce n'est pas le cas. C' est l'opacité, en fait. Donc si j'essaie de le durcir, vous pouvez voir que je suis incapable de voir ce qu'il y a derrière. Il est donc préférable que j'essaie de l'utiliser 10% quelque chose comme ça, afin que je puisse facilement concevoir et aligner mes choses autour. Quel hit second est son type, sorte que vous pouvez soit l'aligner au milieu et vous pouvez spécifier le pont sur les colonnes. Par exemple, je veux des colonnes de 80 pixels de large, quelque chose comme ça. Et Goodall est en fait la distance entre deux colonnes. Donc c'est le caniveau. On peut utiliser 30 quelque chose comme ça, ou peut-être 24. Cela dépend de la taille de l'écran quel que soit l'écran que vous essayez d'utiliser. Donc, si j'essaie d'utiliser 12 ici, vous pouvez voir que ça ressemble à ça. Maintenant, vous pouvez également enregistrer votre mise en page, crée. Vous pouvez voir ici, ici sur le style de mise à niveau afin que je puisse l'enregistrer sur 12 colonnes ou quelque chose comme ça. Une partie du nom ici, parce que quelque chose comme ça. J' ai donc créé un style convenu et je peux facilement appliquer sur n'importe quel vert. De même, par exemple, je vais créer un autre tableau d'art E. Et je vais utiliser iPhone huit plus Non, je vais créer un grand clair et je vais appuyer sur orteil plus et il a créé 10 pixel. Je veux orteil voulait être comme 16 porcs sont grands, par exemple. Donc je peux avoir un 16. cochons sont géniaux comme ça. Maintenant, si j'essaie de placer mon bouton ici, par exemple, je peux placer mon bouton. Il va s'en tenir à ces zones pour que vous puissiez voir que c'est mon cul, et je vais utiliser la rondeur, et je vais utiliser un peu de couleur comme ça. Et si j'essayais de l'aligner au milieu. Donc en ce moment, c'est au milieu. Vous pouvez également l'avoir pour dépenser deux boîtes spécifiques comme ceci. Donc maintenant, vous pouvez voir que c'est la façon dont vous essayez d'utiliser le même pour le texte. Vous pouvez également aligner votre texte. Bonjour. Et vous pouvez aligner votre texte sur votre grille comme ceci. Donc ce sont en fait mes règles. Donc j'essaie d'utiliser ces 80 heures ici pour ma prochaine. Donc c'est en fait la zone que j'essaie d'utiliser. Donc, si j'essaie de réduire la capacité de 50% afin que vous puissiez voir mieux. Donc, c'est en fait la zone de la tête ou la zone qu'elle va couvrir. Donc si j'essaie de le déplacer ici, donc si j'essaie de relâcher celui-ci pour que vous puissiez voir que c'est la limite autour d'elle. Vous pouvez également l'aligner au milieu ou dans une tâche. Mais je pense que ça va aller aux pieds. Utilisez autant d'espace. C' est ainsi que vous pouvez l'utiliser, et vous pouvez aligner vos différentes icônes sur. En outre, vous pouvez ajouter une autre note. Par exemple, si je veux avoir quelques colonnes ici, donc vous pouvez voir que je peux utiliser quatre colonnes et je vais les avoir au centre. Et ça, c'est tes 60. Utilisons plus de 75. C' est l'utiliser. E. Cela semble un peu mieux pour moi, et je vais utiliser 24. Plus grande taille 20 est, je crois. Bien. Maintenant, vous pouvez voir que je peux aligner les réunions avec discret. Alors, nous allons comme ça. Donc, je n'ai pas deux notes. L' un est ma grille de base de base ou mon cred à l'arrière, qui est un cochon malade, Great. Ce qui est le travail, en fait, les boîtes et l'un est la grille de colonne. Donc l'un est, euh, 16 cochons malades que je peux aussi utiliser fait ici quelque chose comme ça pour avoir plus d'options pour aligner chose. Donc, peu importe ce que vous concevez sur une application mobile, essayez toe ont quelque chose comme ça. Il va vous guider. Vous pouvez facilement aligner vos éléments sur ces lignes, par exemple, comme ceci. De même, vous pouvez également activer vos règles décaler et sont et vous pouvez, euh, glisser et déposer différentes directives ici. Toe une ligne choses mieux. Donc, chaque fois que j'essaie de créer un autre petit tableau d'art, vous pouvez voir que cette directive est venue ici parce que je l'ai dessiné sans sélectionner mon tableau d'art. Donc, chaque fois que vous voulez avoir, chaque fois que vous voulez avoir quelque chose qui va orteil agir comme une ligne directrice globale, vous pouvez voir vos cheveux. Donc, si j'ai essayé de sélectionner ce bon avis électrique. Donc si je tombe, dessinez quelque chose dessus. Et si j'essaie de créer un autre tableau d'art, par exemple, comme celui-ci, vous pouvez voir qu'il n'y a pas de directives ici. Même si j'essaie d'utiliser le même tableau d'art que j'ai utilisé auparavant. Donc, vous pouvez voir qu'il n'y a pas de ligne directrice parce que j'ai sélectionné et que j'ai dessiné cette ligne directrice pour cet écran spécifique. Maintenant, si vous voulez avoir une ligne directrice globale, par exemple, je crée un autre tableau d'art ici, qui va être iPhone Pro X. Créons la même taille Ivan huit plus. Maintenant, vous pouvez voir que ce sont le bateau. Les planches d'art sont de la même taille, mais si je veux avoir et ah directive qui va être globale, vous avez la sélection de remorquage sélectionné, et si vous essayez de le glisser et le déposer à l'intérieur de cette zone, il sera présent sur celui-là. Donc, ce que nous devons faire est de le traîner et de le déposer dans la zone médiane, qui n'est pas l'espace commun, qui est un espace vide qui n'est pas le 80 hors tout tableau ou cadre d'art. Donc je vais le laisser tomber sur les cheveux et vous pouvez voir qu'il est présent ou dans les trois tableaux d'art . C' est ainsi que vous utilisez réellement ces lignes directrices globales pour aligner tous vos éléments. Par exemple, si j'ai peut-être une navigation en bas, il sera aligné sur cela. Donc, si j'ai une navigation en haut, ce sera dans cette section afin que vous puissiez diviser votre application mobile entière ou votre conception Web tout ce que vous avez, en utilisant ces lignes directrices colonnes de Grid afin que vous puissiez choisir les lignes directrices locales et lignes directrices. Ces colonnes, cette mise en page, conception de l'orteil de grille, meilleures mises en page pour concevoir une meilleure apparence APS. J' espère que vous n'avez pas détruit ce concept, et j'aimerais vraiment que vous appreniez cela et l'utilisiez dans n'importe quel projet de conception que vous faites. Passons à la leçon suivante 26. Nouveau Figma Auto Layout 101: Aujourd'hui, nous allons jeter un coup d'œil à l'une des fonctionnalités de Figma, qui est la mise en page automatique. Ils ont donc récemment été mis à jour. C'est mon 2022 et je vais vous montrer comment l'utiliser. Et prenons quelques boutons et créons quelque chose d'incroyable pour voir comment cela fonctionne. La même chose, c'est que commençons par T, et je vais taper du texte ici. Créons un bouton. Je vais le faire 20 pixels. Continuons à utiliser inter gras. Et pour créer un bouton, je vais appuyer sur Maj A. Et nous avons créé une mise en page automatique. La mise en page automatique a été ajoutée. Dès que nous ajoutons la mise en page automatique, vous pouvez voir qu'il s'agit d'un nouveau panneau à droite. Nous avons la direction de la mise en page automatique, direction horizontale, la direction verticale. Ce sont les rembourrages entre les espaces entre les éléments que je vais partager avec vous dans quelques instants. Et c'est le rembourrage autour de ce bouton. Ajoutons une couleur de remplissage. Ajoutons une couleur de remplissage à cela. Utilisons cette couleur bleutée. Et faisons des coins arrondis de huit pixels. Et maintenant, nous allons expérimenter le rembourrage autour de ce bouton. Ainsi, pour cette mise en page automatique, le rembourrage est horizontal. Le rembourrage, c'est ça. Je peux donc le faire glisser comme ça. Vous pouvez voir qu'il y a des lignes roses à l'intérieur du bouton qui me montre, gardons ça à 40. Et ce sera l' horizontale, le haut et le bas. Je vais donc le garder à 16 ans. C'est donc mon bouton parfait, un bouton parfait. Essayons d'utiliser une couleur bleu foncé pour le texte du bouton. Ok, donc ça, ça a l'air génial. Ok, donc encore une chose qu'ils ont ajoutée ici. Si je clique sur le bouton, vous pouvez voir si je clique ici, cela me permet d'entrer la valeur ici. Voici donc le rembourrage. Donc, une fois, cliquez une fois. Et que s'est-il passé ? Voici le cadre. Oups. J'ai donc des valeurs différentes maintenant. Vous pouvez donc voir ici j'ai des valeurs différentes pour le haut, droite, le bas et la gauche. Je pense donc que je dois cliquer ici pour voir que c' est le bon. Essayons donc de le réduire. Je pense qu'il y a un bug parce qu'une fois que j'ai changé la valeur, ceux-ci ont réellement disparu. Bon, je les ai maintenant. Donc, si je clique ici, vous pouvez voir que c'est si je clique ici, 20, d'accord, donc nous l'avons encore. Je dois donc cliquer à nouveau ici, dix. Et maintenant, ils ont disparu. Oups, je pense qu'il y a un bug en ce moment, donc vous pouvez tout contrôler à partir d'ici. Donc, si vous voulez des rembourrages indépendants, vous pouvez l'ouvrir pour que vous puissiez voir que j'ai liaisons indépendantes pour la gauche et la droite. Vous pouvez donc les séparer par des virgules à 4020. Donc, si je veux avoir 60 à gauche, vous pouvez voir que j'en ai, je peux en avoir 60. C'est mon haut et mon bas. Essayons d'utiliser 32 en haut. Nous l'avons ici. Gardons la valeur par défaut. Utilisons 36 à gauche et à droite, et en haut et en bas. Ce sera donc mon bouton. Maintenant, si je veux créer une barre de menus simple, je peux simplement répliquer ce contrôle ou cette commande D. Vous pouvez voir que je ne réplique que ce texte et qu'il est en fait dans la direction horizontale. Et c'est l' espacement entre les objets. Il s'agit donc du cadre, c'est le cadre de mise en page automatique, et ce sont les rembourrages entre eux. Vous pouvez donc voir, je peux cliquer et faire glisser comme ça, augmenter le remplissage entre eux. Et il est en fait extensible. Donc, si j'essayais de parler de nous, utilisons-nous sur le pont ici. Et encore une fois, nous avons également le rembourrage en haut et en bas. Nous pouvons le contrôler ici. Il s'agit d'une fonctionnalité vraiment sympa. Ils ont un rembourrage séparé , tout le rembourrage autour. Et ils ont, je pense, plus d'interfaces utilisateur plus conviviales qu'auparavant. Bon, donc nous l'avons ici. Barre de navigation simple. Bon, maintenant ce que je vais faire, c'est que je vais reproduire tout ce cadre. Donc, Commande D, trame 234. Et j'ai ces cadres, tous ces cadres et sélectionnons tous ces cadres. Et je dois créer une autre mise en page automatique. Maintenant, j'ai une autre mise en page automatique. Maintenant, vous pouvez voir que la direction est de haut en bas, c'est vertical. Nous allons donc maintenant jouer avec cet espacement entre les objets. Utilisons 24 ici. Et c'est la séparation entre ces objets. Vous pouvez voir que je peux le contrôler à partir d'ici aussi. Je peux simplement cliquer ici et entrer comme 16. Et essayons de voir que je peux changer le rembourrage. Essayons de voir le rembourrage ici. Oui. Il s'agit des rembourrages ou des rembourrages par défaut. Ajoutons 24 en bas. Et ajoutons la gauche. Vous pouvez voir maintenant qu' il s'agit d'un autre cadre. Il s'agit d'un autre cadre de mise en page automatique, et j'ai ajouté des rembourrages. J'utilise également cet espacement entre les objets. Pour que vous puissiez voir ce que vous avez ici, essayons d'utiliser 32. Et si vous voulez le remplir avec un peu de couleur, vous pouvez le faire simplement pour vous montrer comment cela va fonctionner. C'est donc en fait le cadre extérieur. J'ai donc des cadres automatiques intérieurs. Ensuite, j'ai des cadres automatiques extérieurs et extérieurs. Juste pour vous montrer que nous avons plusieurs éléments que nous pouvons séparer par espacement. Et ajoutons encore une chose à ce cadre automatique. Je vais ajouter, disons un rectangle ici. Essayons d'ajouter un rectangle ici. Il va donc être placé ici comme ça. Maintenant, vous pouvez voir qu'il a eu la disposition qui était, vous pouvez voir ici la direction verticale. Donc, tout ce que j'ajouterai, c'est dans la direction verticale en bas. Ou si je veux modifier la position de cet article, je peux le déplacer vers le haut ou vers le bas où je le veux. Maintenant, si je veux qu'il se trouve dans un endroit spécifique hors du contrôle de cela. Créons un cercle plus petit comme celui-ci. Et je vais avoir des coins arrondis de 60. C'est donc un petit cercle. Oups, 36 ne devrait pas être la hauteur k donc je viens de créer un petit cercle, disons que c'était comme ça. Je veux donc un statut ici ou ici, ou peut-être ici à droite. Peut-être un bouton de fermeture pour ce cadre. heure actuelle, il se trouve dans la mise en page automatique. Gestion de la direction verticale. Il y a un petit bouton magique ici. Il appelle. Il s'agit d'une position absolue. Vous devez donc sélectionner cet élément, cliquer sur la position absolue et il va sortir de cette mise en page automatique. Et utilisons-le ici comme ça. Vous pouvez le voir maintenant, vous pouvez voir qu'il se trouve toujours dans ce cadre de mise en page automatique, mais il a une position absolue comme nous l'avons utilisé en HTML. Il s'agit donc d'une fonctionnalité vraiment, vraiment sympa. Ok, une autre chose est que vous pouvez voir ici le redimensionnement des câlins, redimensionnement vertical et le redimensionnement horizontal du contenu fixe. Et puis nous avons eu le troisième, remplir le contenu je pense que c'était ce conteneur. Vous pouvez voir que c'est très agréable, donc en dehors de cela, ce cadre extérieur, il ne me montre que le contenu du HUD et la largeur fixe. Donc, si j'essaie d'utiliser une largeur fixe, ce sera comme ça. Et nous allons le déplacer ici. Sur le numéro deux, déplacez-le comme ça. Bon, donc pour celui-là, je vais utiliser un conteneur complet. Vous pouvez donc voir dès que j'ai cliqué sur le conteneur complet, il a rempli son conteneur. Le conteneur est donc plus sombre et le plus léger est en fait mon contenu. Le contenu va donc remplir le conteneur. C'est donc corrigé. Le contenu chaud va se développer chaque fois que moi. Donc, vous pouvez voir si j'ai changé de contenu trop chaud, il va revenir en arrière. Ok, donc c'est chaud conteneur de déversement de largeur fixe est explicite. Je n'ai pas besoin de l'expliquer. Il va garder la largeur de ce cadre à l'écart. Cadre extérieur fixe. Le contenu va croître avec le contenu à l'intérieur. Essayons donc de voir le jour du Jugement. Vous pouvez donc voir le contenu extérieur. Le cadre extérieur s'étend en fait avec le contenu interne car il étreint le contenu. Je n'ai jamais, le contenu est en expansion. Par exemple, je suis dans mes bras quelque chose comme ça. Donc, si quelque chose, quelqu' à l'intérieur de celui que j' étreins peut être un ballon, s'il commence à s'étendre, je dois étendre mes bras. C'est ainsi que fonctionne réellement l' accolade. Voyons donc si j'ai manqué quelque chose ici. Nous avons donc cet alignement. Je pense que je dois vous montrer l'alignement ici. Nous allons donc ajouter un rectangle ou peut-être un bouton ici. Créons un rectangle. Et pensez simplement qu' il s'agit d'un bouton. Créons donc ce bouton. Je vais le déplacer à l' intérieur, par ici. Supposons donc que c'est notre bouton. C'est la rondeur des pixels. C'est donc mon bouton. Donc, maintenant, vous pouvez voir que tout est aligné sur la gauche. Donc, si je clique sur ce cadre extérieur, appelons-le cadre extérieur. Ce sont les cadres intérieurs. D'accord ? Donc, une fois que j'ai sélectionné ce cadre extérieur, vous pouvez voir ce sont les options d'alignement. Donc, en ce moment, il est aligné à gauche, en haut à gauche. Si nous passons à celui-ci, comme le bon alignement, vous pouvez voir que tout est aligné sur la droite. Le bouton se déplace également vers la droite. Si j'utilise le milieu, il va tout aligner comme ça. D'accord ? Parfois, ce qui arrive, c'est que je veux que ce bouton soit aligné à gauche et peut-être que tous ces boutons supérieurs soient à droite. Le moyen le plus simple est d'appeler ça btn. Et je vais créer une autre disposition automatique comme celle-ci pour ce bouton. Et pour tous ces cadres, je vais créer une autre automobile. Donc maintenant, je dois faire des mises en page automatiques à l'intérieur. Donc, pour cela, je vais le garder sur la gauche. Vous pouvez voir, vous pouvez voir maintenant et pour le milieu. Appelons donc ce contenu. Appelons ce bouton. Vous pouvez voir que vous êtes ici. Le contenu est en haut, et je peux le déplacer indépendamment du bouton, car je les ai dans deux cadres différents. J'ai donc différents conteneurs contenant des cadres pour eux. De même, vous pouvez voir maintenant qu'il se trouve à nouveau dans ce cadre, le cadre de contenu. C'est donc dans cette direction que vous pouvez voir ici. Essayons donc de cliquer encore une fois dessus. Appelons ça le statut. Et je vais à nouveau cliquer sur celle-ci, position absolue et elle va revenir à l'endroit où elle était auparavant. Essayons donc d'augmenter mon statut. C'est ça. Essayons de l'utiliser ici. Allons le déplacer ici. D'accord ? Nous avons donc étudié le, étudié ces alignements. Nous avons commencé cette direction verticale et horizontale comme celle-ci. Nous avons ensuite étudié la séparation entre différents éléments. Utilisons 80. Donc, en fait, vous pouvez voir maintenant que cette trame doit être intercalée. Donc, quel que soit l'espacement, ce sera entre ces deux-là. Par conséquent, si vous souhaitez contrôler espacement entre différents groupes d'éléments, vous devez les regrouper dans des cadres de mise en page automatique. D'accord ? Nous avons donc peu d'autres options ici. Vous pouvez voir, comme vous pouvez le voir ici, ensaché et espace entre de très belles animations. Je peux peut-être essayer quelque chose ici. Essayons d'utiliser ces moyens. Je pense que nous avons besoin de deux ou trois éléments dans cette direction pour avoir de l'espace entre les deux. instant, je n'en ai qu'un seul. Créons donc un groupe de boutons. Donc, reproduisons cette commande D. Donc, en ce moment, elle se déplace dans la direction inférieure. Cliquons sur ce cadre automatique, cadre de mise en page automatique pour les boutons, et nous allons les déplacer dans cette direction. Bon, maintenant, essayons de voir si je peux le faire. Bon, donc je dois le faire remplir comme ça. D'accord. Vous devez donc d'abord vous assurer que votre interframe ou l'endroit où vous devez utiliser cet espace entre les deux remplit réellement le conteneur. Ce que j'ai fait, c'est que j'ai créé trois boutons à l'intérieur de mon cadre de bouton. Vous pouvez voir que cette mise en page est de gauche à droite. Parce que je veux qu'il remplit tout le cadre. Vous pouvez donc voir ici, c'est les options d'alignement maintenant parce que je suis passé de l'espace de la porte dérobée entre les deux. Donc, si je retourne faire mes valises. Vous pouvez voir qu'ils vont tous s'aligner comme ça, plus près l'un de l'autre. Et ils vont avoir cet espacement entre les objets, soit dix. Nous allons donc utiliser 24. C'est donc l'espacement entre eux en ce moment. Mais si je passe à l'espace entre les deux, vous pouvez voir l' espacement entre eux. Il est écrit auto, auto, auto. C'est donc la principale différence, il va donc les espacer automatiquement. Et pour l'instant, vous pouvez voir que ce cadre de bouton est en fait configuré pour remplir ce conteneur. Le conteneur est le plus sombre. Une autre chose est que je pense que les coups, c'est en fait si nous avons mis un coup autour du bouton, utilisons un coup de 15. Pour que vous puissiez le voir maintenant, utilisons-le à l'extérieur. Et vous pouvez voir maintenant mon accident vasculaire cérébral est en train de sortir de tout ça. Essayons d'utiliser peut-être une couleur blanche. Essayons quelque chose comme ça. Il va donc en dehors de mon cadre. Essayons de voir si cela s'accommode. En ce moment, les accidents vasculaires cérébraux sont exclus. Nous allons les inclure dans la mise en page. Maintenant, vous pouvez voir le rembourrage et l'espacement, tout est pris en compte pour les traits, les traits également. Bon, maintenant je vais revenir aux faits parce que je veux vous montrer quelque chose d'intéressant. Plutôt que d'utiliser un espacement de 20 fois, essayons d'utiliser moins dix. Moins dix. Mettons un coup ici juste pour vous montrer que ce sera comme le blanc, votre thème. Je vais juste être dehors. Essayons d'utiliser le même coup. Si Dean, dehors, Whoops , oxyde, va être blanc. Maintenant, vous pouvez voir que j' ai trois boutons et trois boutons qui se chevauchent. Essayons d'utiliser une couleur différente, un peu différente ici. Donc, juste pour vous montrer ce qui se chevauche avec celui que nous avons actuellement, 33 d'entre eux. Celui-ci est donc en bas en ce moment, et ceux-ci sont en haut. Donc si j'essayais de le faire, nous avons une autre chose qui est l'empilage de Canvas. Vous pouvez donc dire que c'est le dernier en haut. Donc, si je passe au premier en haut, vous pouvez voir que le premier est maintenant en haut et les autres l' un ou en bas. C'est utile lorsque nous avons des images d'avatar différentes, des icônes différentes et que nous voulons qu'elles se chevauchent. Et le dernier est en fait le décalage de la ligne de base, c' est-à-dire lorsque nous avons une icône et un bouton. Essayons donc d' utiliser une icône. Oups, pas ici. Iconons. Et je vais utiliser n'importe quelle icône en ce moment. Utilisons celui-ci. Il va s' agir d'un album d'icônes. Et si j'essayais de l'utiliser à l' intérieur, à l'intérieur du bouton , vous pouvez les combiner la commande G pour les regrouper. Et essayons d'avoir un texte ici. dit, d'accord, je vais l'aligner parfaitement. Si je peux. Allons-le en dehors de ça. Et déplacons celui-ci également en dehors de celui-ci, juste pour voir comment ils vont réellement s'aligner. Je vais donc devoir écrire pour la guerre entre les objets. ce moment, c'est en fait, c'est assez évident et il s'aligne sur celui-ci. Essayons d'avoir un texte plus petit, texte plus petit en bas. Et essayons de changer la couleur. Je vais augmenter la distance à 32. D'accord ? En ce moment, ils sont tous les deux alignés, mais si vous voulez modifier l'alignement, essayons de changer quelque chose. Vous pouvez voir quoi ici. Si nous avons une chaussure d'alignement de la ligne de base , nous pouvons changer comme ça. Par conséquent, si nous avons deux ou trois textes et une icône, nous pouvons utiliser cet alignement de ligne de base pour les aligner. Vous pouvez donc voir maintenant l'alignement de la ligne de base, qui ne fonctionne pas pour ce scénario. Mais je peux vous garantir que dans certains scénarios, lorsque nous avons un texte et une icône qui ne sont pas alignés, vous devez utiliser cet alignement de la ligne de base. C'est donc à quel point ils ont changé. Ils ont fourni de nouvelles options telles que l'alignement des lignes de base, compensant les traits que nous avons. Celui-là. J'aime vraiment cette caractéristique de ce fixe, celui-là , positionnement absolu, vraiment, vraiment sympa caractéristique. Et puis nous avons une très belle présentation des rembourrages, rembourrages tout autour de l'article. Rembourrage gauche, rembourrage à droite. Si nous les planons, à gauche, à droite, à gauche, puis à gauche et à droite. Fermons-les parce qu'il ne correspond pas à mon code HTML. Quoi qu'il en soit. Il s'agit donc de tout ça. Ils ont également déplacé ce contenu étreint, étreint le contenu dans le cadre. Des options comme la largeur, la hauteur car elle était plus adaptée au cadre. Voici donc ma vidéo récente ou nouvelle vidéo et comment maîtriser votre mise en page automatique. Concept très simple. Avant, c'était trop difficile à comprendre pour moi. J'ai vu beaucoup de mes étudiants en design, étudiants qui ont des problèmes tout en comprenant ce concept de mise en page automatique. J'espère que vous avez bien compris la mise en page automatique à partir de cette vidéo, je vous rencontrerai bientôt dans une autre vidéo. Assurez-vous que vous aimez vous abonner et partager cette vidéo d'ici là, prenez soin de vous. Au revoir. 27. Utiliser des cadres: dans cette vidéo, nous allons apprendre les différences entre les groupes et les cadres et les entreprises. Vous devez utiliser des cadres au lieu de groupes. Maintenant, si vous regardez ici, vous pouvez voir que c'est un groupe. Ceci est une illustration. Donc, si j'essaie de le mettre à l'échelle, vous pouvez voir qu'il va mettre à l'échelle tout le groupe Avec cela, vous pouvez voir quand je clique ici, il y a une limite bleue autour d'elle. C' est en fait ses os. Donc, c'est en fait la limite de ceci. Il se développe également lorsque vous essayez de mettre à l'échelle des orteils tout groupe. Il s'agit donc d'une illustration de groupe. Ce sont des facteurs différents. Si j'essaie d'augmenter la taille, vous pouvez voir que les os sont en train de bouger. Et si vous le regardez ici sur la taille de la contrainte, c'est une compétence et ah, il va en fait à l'échelle. Il s'agit d'une valeur par défaut. Vous pouvez dire des contraintes. Option de n'importe quel groupe. Donc maintenant, si j'essaie de sélectionner, par exemple, disons à droite et disons en haut maintenant vous pouvez voir ce qui se passe ici. Chaque groupe a contraint selon orteil, le cadre parent le plus proche de sorte que vous pouvez voir Si vous regardez ici dans toute cette hiérarchie sur le côté gauche, bière et cadre pour ce groupe est en fait notre tableau d'art. Maintenant, nous allons voir ce qui se passe si j'essaie d'augmenter la taille souvent Art Board. Vous pouvez voir que cette contrainte fonctionne réellement pour ce tableau d'art, donc il reste avec la droite et à gauche de notre planche. Voyons maintenant ce qui se passe quand nous n'avons jamais dit ces contraintes. Donc, la plupart du temps, chaque fois que vous essayez d'importer un graphique à l'intérieur de votre flegme un fichier ou vous ennuyez, la même chose se produit. Par exemple, si vous avez un groupe comme celui-ci et que c'est une illustration maintenant, vous pouvez voir si j'essaie d'augmenter l'élection, zoomer et essayer d'augmenter la taille de ceci. Vous pouvez voir ce qui se passe. La taille de l'illustration est en fait de plus en plus grande avec ce cadre, alors passons ensuite. Voyons voir la taille sa taille est 573 par 5 31 Maintenant, si j'essaie de le redimensionner, vous pouvez voir maintenant il est 80 98 806 Maintenant, si vous ne voulez pas ce comportement et vous ne voulez pas qu'il soit mis à l'échelle comme ça. Suivant. Retourne à chaque fil. Ok, donc maintenant si vous voulez un large ce comportement, vous voulez que vos icônes restent là où elles sont. Vous devez utiliser des cadres parce que les cadres vont aux pieds. Laisse-moi te montrer. En fait. Donc, ici, nous avons le cadre droit. Sélection de cliquages et de cadres. Maintenant, vous concevez. On a deux cadres par ici. L' un est cette illustration sont désolés. Ce cadre de pratique, c'est en fait le tableau d'art. Et puis nous avons un autre cadre. Quel est ce cadre ? Un à l'intérieur. Appelons ça les options. Maintenant, vous pouvez voir que nous avons cadre à l'intérieur d'un cadre. Non. Si nous essayons de modifier la taille de ce cadre d'exercices pratiques, vous pouvez voir la taille de cet objet. Il wa 618 par 2 25 Non, Si j'ai essayé orteil à nouveau, redimensionner. Vous pouvez voir. Laissez-moi l'agrandir et vous montrer quelle est la différence ? La taille reste la même. C' est donc le comportement dont j'ai besoin quand j'ai des éléments à l'intérieur d'un conteneur et que je veux y aller et que je veux qu'ils restent sur la même zone où ils sont et je ne veux pas qu'ils se redimensionnent. Ensuite, vous avez orteil Toujours utiliser notre cadre. Sinon, vous aurez ces problèmes que les icônes vont continuer à grandir. Par exemple, supprimonsce cadre. supprimons Je suis pressé Shift contrôlé ou commande shift G orteil sur le groupe de ce cadre et maintenant je vais les regrouper. Maintenant, vous pouvez voir qu'ils sont dans un groupe. Appelons donc ces options de groupe. Et si j'essaie de maintenant, la taille est la même. 618 par 2 25 Maintenant, si j'essaie d'utiliser la taille, vous pouvez voir ce qui se passe. Ces icônes s'éteignent et tout est en train de foire parce que je n'en veux pas. Connaissez-vous l'échelle ? Si j'essaie de cliquer sur cette icône double clic, vous pouvez voir ce sont les contraintes. Voilà donc les contraintes, l' échelle et l'échelle. Donc, il va orteil devenir de plus en plus petit. Comme je redimensionnais ça pour que vous puissiez voir Laisse-moi montrer, tu sais. Donc, ces icônes sont vous pouvez voir maintenant il 44 attendre notre voyage. Ils étaient comme 72 pixels de large. Maintenant, vous pouvez voir que c'est le comportement que nous ne voulons pas. Donc, la différence de base entre le groupe et le cadre est que le groupe va avoir une contrainte. Ledgett orteil le cadre parent. Le cadre parent sera la plupart du temps c'est un tableau d'art et pour le cadre nous n'avons pas de tels problèmes. Le cadre va aux orteils. Agir comme un conteneur indépendant ou une fenêtre et tout doit être aligné selon deuxième chose, c'est que chaque fois que nous avons un cadre, par exemple , oui, c'est G, j'espère que nous avons cadre, sélection d'amis tout contrôle et G. Ok, donc nous avons cette renommée. Il y a une autre option qui est coupé le contenu. Si vous voulez créer quelque chose, il va orteil agir comme une fenêtre. Ce cadre va servir de fenêtre. Donc, si vous essayez toe étendre, par exemple cette icône en dehors de cela, vous pouvez voir maintenant il glisse à l'extérieur parce que nous avons défini la Grande-Bretagne cacher hors du cadre. Mais si vous essayez orteil, faites quelque chose avec cette illustration, par exemple, c'était un groupe et par exemple, j'ai ce vecteur ou ce bras et j'essaie de l'étendre. Vous pouvez voir que rien n'est coupé et une autre chose que vous pouvez voir Si j'essaie de cliquer ici, la limite est en fait automatiquement ajustée. Les os s'ajustent automatiquement. C' est en fait la fonction hors groupe. Donc, si vous voulez quelque chose comme ça, vous ne voulez pas découper le contenu, vous pouvez utiliser ce groupe. Et si j'y vais maintenant, tu peux voir qu'on a une icône. Harris dit redimensionné pour s'adapter à la vie. J' essaie de cliquer ici, vous pouvez voir maintenant la taille hors du cadre a été ajustée au contrat de clip. Donc, il essaie en fait de trouver où est la limite de ce contenu ? Donc, c'est une fonctionnalité hors cadres cadres ont une hauteur spécifique et lire tout en dehors d'eux va être coupé. Mais les groupes, ils ne vont pas se comporter comme ça. Ils n'ont rien à clipser. Ils auront une limite automatique. Ils augmenteront les os de vos éléments à l'intérieur d'eux en fonction de leur retour élevé. Donc, chaque fois que vous essayez de changer la largeur et la hauteur, il va changer la limite de ce groupe. Donc c'est en fait comme ça que j'essaie de vous suggérer que chaque fois que vous concevez vos abdos ou quoi , par exemple, laissez-moi vous montrer ceci ici. D' accord. Donc, vous pouvez voir ici cet arrêt est en fait que vous voulez créer un cadre. Par exemple, je veux avoir une hauteur de retour fixe pour ce front. Et je ne veux pas que ces icônes ici changent leur position et changent leur taille chaque fois que j'essaie d'augmenter le tableau dur ou ici de la même manière pour cette barre ici. 30 minutes, quatre personnes, 1,5 kilocalories. Vous devez utiliser un cadre. Si vous essayez d'utiliser un groupe, vous essayez d'augmenter la hauteur de ce tableau d'art ici. Ça va gâcher. Ces choses vont déménager. Et en fait, il est arrivé une fois quand j'essayais de concevoir dans ces exercices est arrivé. Ah, beaucoup de fois si je ne les ai pas convertis en cadres, donc les cadres vont avoir une limite spécifique et les contraintes vont travailler à l'intérieur de cette zone, par exemple, Je vais utiliser les orteils à gauche et en bas pour celui-là. De même, pour celui-ci trop gauche et l'ennui. Maintenant, si vous voulez mettre à l'échelle un cadre, vous devez cliquer ici, aller à l'échelle, l' outil et vous essayez orteil. Utilisez cela si vous voulez vraiment mettre à l'échelle la hauteur et la largeur d'un cadre. Mais pour un groupe, vous n'avez pas besoin d'utiliser l'échelle. Vous pouvez utiliser le mouvement pour faire et vous pouvez simplement appuyer sur votre Maj et maintenir votre touche Maj pour mettre à l'échelle comme ça. Maintenant, une chose de plus chaque fois que vous créez un composant ah ou ici donc les composants qu'ils vont agir comme des cadres. Tout va avoir des contraintes sur. Tu peux voir ton ici ? Maintenant, vous pouvez voir chaque fois que vous êtes à l'intérieur d'un cadre ou que vous êtes à l'intérieur d'un composant les os ou les contraintes vont fonctionner à l'intérieur de cette limite, cette limite de cadre à la place. Si vous regardez ce groupe, si j'essaie de sélectionner ce haut et disons que à gauche ces os sont ces contraintes, limites sont en fait en fonction de leur cadre parent, vous pouvez voir ici le cadre parent est ce cadre de pratique et ces contraintes sont liées à la porte. Donc ces lignes, ces lignes pointillées, montrent qu'elles sont liées. Ces contraintes sont donc liées au cadre spirituel. Donc, quand je clique ici et je double-clique sur celui-ci. Si j'essaie d'utiliser, par exemple, centre et le bas, il va orteils. Ayez des contraintes avec cela sur ce cadre ici. De même, pour celui-ci, si j'essaie d'utiliser gauche et emploi, il va rester le même pied. Donc c'est en fait la limite à cause de cette banane ici. Donc, réduisons la taille de la banane en appuyant sur Shift. Et maintenant, vous pouvez voir que l'os est le même. Nous devons donc appuyer à nouveau sur cette limite de redimensionnement et c'est notre limite. Maintenant, si j'essaie de cliquer ici, vous pouvez voir que ce sont ces contraintes sont liées à ce cadre plutôt que le cadre parent , qui est pratique pour lui. J' espère donc que vous avez compris les différences entre les groupes et les cadres, et quand vous devez utiliser l'un à la place, l'autre passons à la leçon suivante. 28. Exporter des actifs et des images: dans cette leçon, nous allons parler de l'exportation de vos images et de vos ressources. Maintenant, c'est très important. Si vous concevez pour une application Android ou l'application I s, il existe différents paramètres ou options d'exportation différentes pour les deux systèmes de conception. Ainsi, par exemple, comme vous pouvez le voir, c'est mon application Android et elle a été conçue pour un appareil Android. Ainsi, chaque fois que vous exportez vos images, par exemple, vos ministères, sont vos images par exemple, vos images PNG ou n'importe quel bouton ou tout ce que vous avez à exporter dans différentes tailles. Donc, il y a différents appareils Android il y a Ils utilisent différentes tailles pour soutenir cette application. Laissez-moi vous montrer un article rapide par ici. Vous pouvez voir ceci est un article rapide sur le médium traitant de la diversité et ceux-ci sont différents. Les poches sont des seaux EI profonds. J' ai appelé les seaux de résolution pour les appareils Android. J' ai un cours séparé complet sur l'appareil Android et la conception. Mais le matériel de Google, où j'ai discuté de tous ces juste vous devez vous rappeler que 0.75 agit 75% 1 prochaine 1.523 et quatre. Ce sont les choses pour lesquelles vous devez exporter. Laisse-moi te montrer. Si vous avez déménagé à la Fig MMA, par exemple cette barre inférieure, vous devez exporter. Donc, j'ai sélectionné cette barre inférieure par exemple, celle-ci Et si vous allez ici, vous pouvez voir qu'il y a une option d'exportation. Donc, si vous le souhaitez, supprimez une option d'exportation. Vous avez orteil klik moins. Et si vous voulez ajouter, vous devez ajouter à l'avance. Et c'est en fait la taille qu'il montre. Il montre un X un suivant signifie le même 100% 150% 200% 300% 400%. Donc, je vais sélectionner 400% parce que je voulais vraiment orteil avoir toutes ces tailles. Donc, ce sont les options d'exportation pour un appareil Android. Vous pouvez voir qu'on est en bas. Ça dit des barres d'ennui à l'exportation. C' est un nom de ce groupe. Donc von x, 100% 304 101 150% et 75% qui va être plus petit que la taille que nous avons conçu . Nous avons conçu en 100%. Donc ce sont les options d'exportation que vous pouvez également changer le type de fichier de nos cheveux PNG va être Vous pouvez dire qu'il va être transparent à l'arrière-plan. Si vous allez à cet aperçu, vous pouvez voir l'arrière-plan est transparent pour ces trois boutons Oh déplacent la Grande-Bretagne ou tout ce que vous les appelez. Si je vais au jpg, il va avoir un sac blanc maintenant. En fait, il me montre cet aperçu mais il va avoir un fond blanc. Tous les autres sont Permettez-moi d'enlever tous les autres. Ensuite, retirez tous ces Et maintenant si je décale o jpg encore, il me montre le mauvais aperçu de toute façon, Donc le J P G ou J Big image va avoir un fond blanc. Je suppose que c'est exporté. Je vais appuyer sur l'exportation et je vais aller sur le bureau et voyons si c'est comment il a un fond blanc ou non. Donc, vous pouvez voir ou entendre qu'il a, comme le fond. Il a un fond blanc. Vous pouvez voir si je le traîne dans la figue Mauer ici. Vous pouvez voir si je fais un zoom avant et il a un fond blanc. Ok, donc ça va arriver. Je vous ai déjà dit que l'image de J. Peg va avoir un fond blanc. Donc, tout ce que vous voulez exporter et vous, par exemple, la plupart des images dans un site Web, par exemple, cette image que vous pourriez utiliser Jay grande image, parce qu'une très grande image une très grande image de fond. Tu dois utiliser quelque chose comme ça. Par exemple, dans mon ce yum Zab sur cet écran de connexion. Si je zoome sur cet écran de connexion, euh, cet écran de slogan vous pouvez voir que nous avons, ah, frais généraux, cet arrière-plan de l'image. Si je dois exporter ce fond d'image à l'arrière, vous pouvez voir que c'est, um tout ça je suis allé les regrouper ensemble. Donc c'est tout mon expérience. Vous pouvez voir donc ça va être mon expérience. Donc, je vais appuyer sur les pieds au-dessus, exporter. Et je vais utiliser un jpg parce que Jeb va me donner la plus petite taille pour tout ce fond. Donc, cela va vous aider chaque fois que vous exportez pour des sites Web ou tout ce qui est très grand, très grande image. Vous devez utiliser l'image J peg plutôt que PNG. PNG doit être utilisé pour, par exemple, ces icônes ou peut-être les boutons ou quelque chose comme ça. La plupart du temps, ces icônes vont être un SPD pour faire, donc je vais y aller maintenant. Donc, vous avez appris que lorsque vous devez exporter pour des appareils Android, vous devez ajouter différentes densités de différentes tailles. Par exemple, deux x trois x quatre x, les différentes tailles jusqu'à présent et appareil IOS. Si vous concevez un appareil IOS, laissez-moi vous montrer ici afin que nous n'ayons besoin que d'un x 100 % 200 % et 300 %. Ce sont donc les trois tailles qui sont utilisées par les appareils IOS. Donc, si vous concevez des appareils IOS, vous devez exporter vos ressources dans ces trois côtés. Alors revenons en arrière. Tofig MMA et nous sommes, par exemple, je vais sélectionner cet écran Si je veux o exporter tout cet écran, je vais exporter PNG et je vais exporter dans ces trois tailles une à côté de X entrée X. Vous pouvez voir l'aperçu sur si j'exporte ici il va exporter trois fichiers différents . Donc, je vais voir ce que nous sommes ici sur le bureau et ah, ici nous avons les trois fichiers afin que vous puissiez voir ce suffixe est en fait le nom du fichier qui est ajouté 101 Ajouter deux x force le nom hors du fichier et puis le suffixe va en fait vous montrer qu'il est le pourcentage d'âge ou ceci est la densité ou ceci est ah, vous pouvez mettre à l'échelle cette image. Donc, ce sont deux choses différentes. Vous avez l'utilisation de remorquage dans vos laboratoires mobiles pour les numéros que vous conceviez De même, pour IOS, vous pouvez voir ceci est en fait écran iris. Vous devez utiliser les trois jusqu'à présent sont nous pour nos tailles U. S. S. T un x deux x trois x pour Android. Nous avons en fait quatre ou cinq tailles. Un prochain 1,5 x deux x trois x quatre X point son cinq x ou 75% Donc ce sont toutes les différentes tailles que vous avez à exporter. BND va avoir un fond transparent. Jeopardy n'aura pas de fond transparent. SPD est pour les illustrations, par exemple comme cette illustration graphique vectorielle évolutive SPD. J' ai surtout utilisé mes icônes et mes illustrations. Je sais que je les exporte en excès de fichier SVG formulaire. Pdf est un document fondamentalement. Si vous concevez un document et que vous voulez exporter ou afficher vos dessins dans un fichier pdf, vous devez utiliser la rapidité de pour exporter. De même, une fois que vous avez défini toutes les options d'exportation pour tous vos différents écrans, vous pouvez aller ici orteil désolé ou ici pas ici, mais dans ce menu. Et vous pouvez utiliser l'exportation de fichiers afin que vous puissiez exporter toutes les différentes illustrations et tout. Si vous sélectionnez tout ici qui a été tout sélectionner et puis je peux aller à l'exportation. Et ce sont tous les différents actifs que je vais exporter 11 SX. Donc, si vous avez un très grand, vous pouvez dire projet et que vous voulez exporter tous les actifs à la fois , vous devez sélectionner tous les panneaux durs et utiliser cette option d'exportation dans le menu du fichier et cliquez sur exportateurs. Il va exporter toutes les résolutions différentes. Donc, c'est tout sur l'exportation de vos actifs pour vos appareils Android pour votre ah, J'utilise des appareils, appareils Apple et pour vos sites Web à. J' espère donc que vous avez appris quelque chose créé dans cette leçon. Si vous avez des questions, demandez-moi toujours. Continuez à bouger et continuez à concevoir. 29. 05 variantes dans Figma Simple: Dans cette vidéo, nous allons parler de la toute dernière et nouvelle fonctionnalité de sigma, qui est la variance. Et il existe des variantes de différents composants comme nous créons des boutons, alors ils peuvent être désactivés retourne, ils peuvent être des boutons primaires, des boutons secondaires. Il peut y avoir des boutons qui ont une barre de chargement ou ils chargent et déchargent l'état ou le prestige ou les surestimes. Donc tous ces états, ils ont dû avoir un système pour créer tout cela en un seul composant. Donc, dans cette vidéo, nous allons apprendre exactement ça. Alors, allons commencer. Maintenant, vous pouvez voir ce sont peu de variance. Je vais vous montrer la puissance de la variance si vous cliquez ici et si vous voulez passer au bouton gris ou désactivé, mais, et vous pouvez voir que vous avez juste à utiliser cette option ici, qui est une nouvelle variance. Et puis nous devons passer au bleu. Donc c'est en fait que je l'ai créé moi-même. C' est un fait sur mesure. De même, comme vous pouvez le voir ici. Ici, nous avons un composant. Tu as faim en ce moment ? Et on a vérifié deux escaliers. On peut le vérifier et le vérifier. Nous allons donc créer ces deux dans ce tutoriel. Alors commençons. Maintenant, nous allons commencer à partir de zéro. Donc je vais appuyer sur un tableau pour l'art et je vais créer un art. Mais par ici, alors nous allons avoir rectangle ici ou appuyez sur sont pour rectangle pour créer un joli bouton. Et je vais lui donner un peu de rondeur ici. Nous allons donner une couleur primaire, juste ce bleu. Je vais appuyer sur T pour un texto. Et ça va être notre bouton principal. Sommes-nous ? Ok, donc nous avons le texte. Faisons la colorer en blanc. Donc on a un bouton par ici. Maintenant, l'étape suivante est, il va toujours travailler sur un composant. Nous devons donc les sélectionner tous les deux, créer un composant, et ici nous avons un composant, appelons-le mais une barre oblique Marie. Ok, donc nous avons un bouton et créons un peu plus de variance. Donc, vous pouvez voir une fois que je clique ici, il y a une nouvelle option ici, qui s'appelle variance. Donc, vous devez cliquer sur ce plus, et là, nous avons une autre variante. Donc, personnalisons d'abord cette variante. Donc nous aurons un bouton vert par ici. Appelons ça quelque chose comme ça. Faisons quelque chose comme ça. Changons la couleur du texte en noir ups comme ceci. Alors gardons les choses simples et nous avons 2 millions. Alors avant. Donc maintenant, si vous cliquez sur l'ensemble du cadre de sélection, donc si vous voulez ajouter une nouvelle variante, vous pouvez cliquer ici dans le signe plus et il vous donnera autant de variantes que vous voulez. Je peux avoir un bouton gris ici comme ça. Et ça va être un peu plus sombre comme ça. Donc nous avons maintenant trois boutons dans ce cadre. Donc, si nous cliquons ici sur toute la limite de cette, ces trois boutons, vous pouvez voir que nous avons déclaré ici propriété. Donc, la propriété est en fait qu'il pourrait être votre type, il pourrait être vos couleurs, il pourrait être le type de la chose que vous créez. C' est en fait dans la hiérarchie. Il va être au sommet. Donc, une propriété peut avoir plusieurs variance. Je vais le répéter à nouveau. C' est un concept essentiel très, je suis très initial. Une propriété peut avoir plusieurs variantes. Par exemple, je peux simplement l'appeler primaire. Appelons le bouton. Ok. Donc nous avons le bouton ici et puis si je clique ici, je vais le faire, c'est fondamentalement le primaire. C' est, ou on peut l'appeler primaire, bleu primaire. Et puis je vais cliquer dessus. Je vais renommer la variante en vert primaire. Et puis je vais cliquer ici et principal handicapé. Ok, alors appelons ça gris. Ok, donc on a terminé ça, alors comment on peut l'utiliser. Nous avons donc déjà créé ceci. Déplaçons le hors de ce cadre. Maintenant, nous allons passer à nos actifs. Nous sommes, nous avons ce composant ici et nous allons faire glisser ce composant de bouton. C' est celui qu'on vient de créer. Ok, donc maintenant vous pouvez voir sur la droite nous avons ce nom de propriété ici sur la gauche c'est le bouton. Et à droite, nous avons la variance, bleu primaire, gris primaire, vert primaire, ou autre. Vous pouvez même les appeler comme primaire, Hoover et peut-être désactivé. C' est à vous de choisir, Par exemple, nommons cela plané. Ensuite, nous avons celui-ci à être désactivé. Donc maintenant vous pouvez voir que nous avons trois états ici, vers la maison, primaire et désactivé. Je ne sais pas pourquoi ça fait la queue comme ça. Je pense qu'ils devraient avoir la même chose que vous pouvez dire le même ordre que nous avons créé ici. Quoi qu'il en soit, on peut passer à n'importe qui, comme ça. Ok. Maintenant, arrivons au point où nous devons créer une petite case à cocher, qui est une case à cocher mobile. Donc, je vais le faire rond. Utilisons 320 k. Donc, d'abord, nous devons créer différents composants. Maintenant, nous allons utiliser une ellipse. Juste 21 par 21 a changé la couleur en blanc. Faisons un peu comme ça. Déplacez-le un peu plus ici de ce côté et réduisez la largeur de celui-ci. Ok, donc on a un peu d'arrangement par ici. Donc, nous allons créer un composant en cliquant ici ou touche Alt Control ou Command Alt. Je ne suis pas sûr de quel est le raccourci sur Mac de toute façon, donc vous pouvez cliquer ici. Et ici, nous avons le composant. Une fois que nous avons le composant, nous devons créer sa variance. Je vais cliquer ici. Et ici, nous avons une autre variante. Double-cliquez et allons à l'intérieur de cette variante, changez sa couleur en vert. Et déplaçons ça ici. De ce côté-ci comme ça. Donc ça va être notre autre variante. Donc, pour la propriété, je vais sélectionner les frais généraux vérifiés. Et une chose que vous devez faire est que lorsque vous cliquez ici, vous devez décrire son nom de variante. Pour cela, nous allons utiliser faux. Et pour celle-ci, c'est vrai. Donc, cela va créer bascule ici. Donc maintenant, nous devons l'utiliser. Alors déplacons-le par ici. Allez aux actifs. Nous avons ce composant, et nous allons cliquer dessus. Et nous avons la case à cocher ici. Vraiment gentil. J'espère que vous avez apprécié cette leçon. Je vais te retrouver dans une autre leçon bientôt. Jusque-là, prenez soin et au revoir. 30. 06 Variantes de Figma Variantes avancées: Passons maintenant à une utilisation un peu plus avancée de ces fonctionnalités. Et nous allons créer des intrants ici. Faites-en un composant. Nous allons ajouter de la variance. Donc, avant de créer plus de ceux-ci dans le sommet, nous allons créer une nouvelle propriété. Nous sommes ici à la propriété de NYU et nous allons le nommer type. Donc, nous avons le type et c'est la propriété. Cette propriété va être l'état. Donc, ce sont en fait, ces deux sont en fait vont être de type x. ajouter un nouveau type à squint pour être entrée de texte. Et si nous cliquons sur l'un d'eux, ce sera l'état par défaut ou l'état normal. Et pour celui-ci, il va être actif. Maintenant, nous allons en créer davantage. Créons celui-là, un autre. Et pour le type que nous allons utiliser, créons un nouveau ici. Et nous allons utiliser réellement abandonné, appelons-le liste déroulante. Et puis on en a un autre. Avant d'en passer à un autre, nous allons ajouter un rectangle ici. Polygone en fait, pour la liste déroulante. On le bouge comme ça. Renommons le sélectionner. Maintenant, nous pouvons créer une autre variante. Créons un autre obéissant. Et je vais encore utiliser celui-ci ici, copier ici. Et celui-là, nous allons appeler Select. Changeons la couleur pour autre chose. Comme ça. Juste pour faire la différence. De même pour celui-ci, je vais changer la couleur pour quelque chose comme ça. Ok, maintenant je vais sélectionner celui-ci et celui-ci, et ça va être le menu déroulant Type. D' accord ? Et pour ces deux-là, je tiens en fait décalage. Nous allons utiliser la saisie de texte. Maintenant, pour chacun, nous devons définir le, définir l'état. Celui-ci va être normal, celui-ci va être actif. Donc maintenant, vous pouvez voir que nous utilisons en fait deux ensembles différents d'états et de type. Alors comment on peut l'utiliser, juste glisser, mettre du texte ici. Et si nous allons à droite, vous pouvez voir ici que nous pouvons changer l'état ici. Ensuite, nous pouvons également changer la liste déroulante et le type de celui-ci. Donc, c'est en fait que l'utilisation de Vos où nous pouvons combiner deux propriétés différentes. Maintenant, si vous voulez créer des variantes à partir de vos composants déjà créés, alors non, vous ne voulez pas créer de composants et vous avez déjà peu de composants, alors c'est très facile. Laissez-moi créer un composant ici. Mais ils doivent être dif, différents composants. Par exemple, nous avons ici des composants de différents états. Par exemple, nous avons celui-ci. Celui-ci est un état actif, appelons-le actif. Et je vais créer un composant ici. Et allons aux couches. Et ici, nous en avons un autre. Cela va être, appelons-le nav comme barre oblique inverse normale ou normale. Et nav backslash désactivé. Et si vous voulez créer les deux et que vous voudrez créer des variantes, vous devez simplement faire glisser comme ceci. Et vous pouvez voir sur la droite, vous pouvez voir combiné comme variance. Il suffit de cliquer dessus ici comme ça. Et vous verrez déjà créé des propriétés désactivées et normales, des variantes. Et pour la propriété, nous allons juste donner le nom de navigation, peut-être quelque chose comme ça. Et quand vous devez l'utiliser, il suffit de faire glisser et déposer ceci maintenant par ici. Et vous pouvez changer son état comme ça et vous assurer, euh, une autre chose est que si vous voulez modifier la forme ou par exemple, si je veux changer la forme de l'état, c'est à vous de décider. Ce n'est pas un très gros problème. Vous pouvez modifier ces deux états. Ainsi, vous pouvez voir votre navigation dans les cheveux, la navigation normale désactivée est une plus grande. Donc c'est à vous de décider. Vous pouvez changer n'importe quoi dans n'importe quelle variante. C' est donc tout au sujet de la variance et de sa puissance dans la figue, j'espère que vous avez apprécié cette leçon. Je te verrai bientôt dans la prochaine leçon. Jusque-là, prenez soin et au revoir. 31. Prototyping des bases de la relie et des basics: dans cette vidéo de, nous allons en apprendre quelques uns sur les bases du prototypage de Sigma. Maintenant, vous pouvez voir que j'ai conçu trois écrans simples et l'un est en fait une navigation de gauche , qui est un cadre personnalisé. Donc, si vous cliquez ici, vous pouvez voir la taille à 51. La hauteur est de 7 26 maintenant. Tout d'abord, nous allons commencer avec ces trois écrans. Donc, nous avons là. Faisons la zone pour s'adapter Appuyez sur un, et vous pouvez vous voir ici. Nous avons trois images, donc toutes ont le même nom, donc je vais les renommer. Il y a, euh, renommer un qui l'a vu en remorque pour le renommer en trois. Donc on a marché un orteil, 33 écrans, et il n'y a rien de plus là-dedans. La première chose que vous devez remarquer et vous devez vous rappeler est que si vous voulez faire vos objets, vous devez les nommer le même Lear, par exemple. Ici, il dit, illustration ou entendre et voir si nous allons dans ce panneau Lius. Les noms sont la même administration parce qu'ils sont les copies les unes des autres, et dans le même suivant, il dit illustration la même chose. Ou ici, il doit être Illustration. Ok, alors aussi ces couches étaient là. Ces groupes ont les mêmes noms. La seule chose qui change, c'est que cette illustration est en train de changer. Le nom est le même. Et vous pouvez aussi voir par ici. Et nous avons ces barres inférieures. Ce sont trois barres et je change leurs couleurs. Donc pour celui-ci, le suivant, nous avons cette couleur différente pour le 3ème 1 Celui-ci est actif, autre que le nôtre, inactif. C' est tout ce qui se passe à l'intérieur de l'écran. Ensuite, nous avons cette navigation de gauche. Donc, d'abord, ce que nous allons faire est que nous allons passer à notre prototype ou entendre l'écran du prototype, et maintenant vous ne pouvez en voir aucun. Les tableaux d'art sont sélectionnés. Donc, d'abord, nous avons peu de paramètres prototypes comme l'orientation que nous avons dispositif que nous voulons voir toe dans notre prototype que nous avons le modèle Gould. excuses d'argent de minuit. Aussi, nous avons un aperçu aussi. Quel arrière-plan Vous souhaitez afficher ces sélections. Je vais sélectionner cet arrière-plan et ensuite nous avons le cadre de départ. Lequel devrions-nous ? Donc on va en utiliser un. Et commençons à combiner ces écrans. Commencez à connecter ces écrans maintenant. abord, nous allons faire est que j'ai sélectionné ce tableau d'art et cliqué sur ce nom et nous avons quelques-uns. Vous pouvez voir un petit cercle ici qui est fondamentalement un point collecteur. De même, si nous cliquons ici, vous pouvez voir si j'étais sur différents éléments ou groupes. Je vois les mêmes objets de collection. Donc, si je veux oh, avoir une interaction orteil appliqué Cet article que je vais faire. Utilisez ce connecteur pour celui-ci. Je nous ai déplacés comme ça et j'utilise son correcteur. Donc pour l'instant, nous n'utilisons pas plus les orteils spécifiques de nos cheveux. Donc, nous allons aller avec tout l'écran. Choisissons celui-ci. Donc, ici, nous avons juste cliquer et glisser et nous allons laisser à l'écran suivant maintenant aussi . Dès que nous quitterons ça, nous avons peu d'options ici. L' interaction va être sur le robinet sur glisser tout en appuyant sur est venu mauvais jeu centre de la souris. La plupart des feuilles. Ce sont toutes des interactions différentes. Ce que vous essayez réellement de faire Donc nous allons sélectionner sur le robinet. Ensuite, c'est ce qui va se passer lorsque vous adaptez ce 80 0 à l'avance. Ne jamais ouvrir les orteils Overlay balayé avec dos près de l'ouverture Donc ce sont différentes choses que vous pouvez faire Vous pouvez ouvrir un lien que vous pouvez fermer trop que vous utilisez. Vous pouvez revenir à l'écran précédent. Vous pouvez gifler avec autre chose. Oh, ici nous avons ouvert en direct. On va revenir à ça. Ouvrez votre nom. Ils sont dessinés. Donc, euh, ils s'attendent à nouveau à celle-là. Donc, voici l'interaction avec entrer. Ensuite, c'est ce que nous allons faire n'importe quelle mission. Voilà donc l'animation. Citant le déménagement. Passez à l'aide de la diapositive et faites glisser L' ennemi intelligent dissoudre ou instantané instantané va faire rien va toujours se dissoudre dans la peau suivante. Animé intelligent. On va utiliser surtout celui-là. MoveOn se déplace réellement dans et dans quelle direction. Donc, si ça arrive, ça va être comme ça. Ok, donc vous pouvez voir l'aperçu de l'animation ici. Ensuite, nous avons Theis timing. Donc, nous avons, par exemple, nous allons utiliser 400 millisecondes. Alors utilisons-nous plutôt que d'emménager. Je vais utiliser intelligent d'une minute à l'autre et je vais les utiliser dans une heure. C' est l'option que j'utilise la plupart du temps. J' adore ça. Donc, ce sont les options que j'ai sélectionnées ici. Et encore une fois pour cela, le 2ème 1 nous allons faire la même chose. Donc je clique sur cette zone blanche. Je le suis encore. Slack click et faites glisser et laissez-le à l'écran suivant du nid afin que vous puissiez voir les paramètres que j' ai fait la dernière fois sur le robinet. Navigato intelligent et la facilité d'image sur le timing. Ils ont été sauvés. Donc, une fois que vous avez sélectionné les paramètres, il va appliquer orteil écrans suivants. Si vous voulez les changer, vous pouvez les changer. Alors voyons à quoi ils ressemblent maintenant. Alors jouons à ce cadeau et cliquez sur ce cadeau et nous allons à la pointe. Tu vois ce prototype ? Maintenant, vous pouvez voir que nous sommes sur le premier écran et maintenant nous allons toucher orteil. Ici, vous pouvez voir l'ennemi intelligent de n'importe quelle mission parce que nous l'avons mis en mouvement, facilitant la facilité. Et aussi le nom des illustrations est le même, sorte que vous pouvez voir comment ces illustrations sont en train de changer les unes dans les autres . Maintenant, vous avez vu ça. On n'a rien à retourner. Donc, nous pouvons également définir votre onglet. Les sections étaient là. Nous pouvons également utiliser ces et oui. Donc, je vais le laisser ouvert et retourner à mon dossier. Et, euh, j'ai pu le mettre pour retourner ici aussi pour que celui-ci aille au 1er 1 ici, je vais le mettre pour aller à la prochaine et celui-ci pour retourner à l'école en arrière ou en avant et essayer de faire avancer. Et vous pouvez voir comment tout cela change. Ok, donc on a appris cette auto Un émir. Si vous avez les mêmes noms sur les éléments, ils vont à la pointe. J' ai le temps de Riel. Très gentil. Lisse. Toute mission en transition d'une forme à une autre change ces dernières. D' accord ? Non, la deuxième chose est la zone de marche. Donc, chaque fois que vous prototypez beaucoup de concepteurs qui font cette erreur, vous pouvez voir cette 80 heures ici, il est très proche de la prochaine. Donc la première chose que nous pouvons faire est que nous pouvons augmenter son pas en Inde pour que vous puissiez faire quelque chose comme ça et ça s'appelle ça, oui, l'Inde. Et puis nous allons aller à la conception et réduire son opacité à zéro. Donc, chaque fois que vous voulez orteil corriger quelque chose, vous devez le connecter en utilisant ceci. Par exemple, supprimons celui-ci. Les médias du personnel. Maintenant, vous pouvez voir, par exemple, le saut, donc Skip va être un bouton. Donc, si j'essaie de cliquer ici, vous pouvez voir qu'il a une très petite boîte de délimitation. Maintenant, je vais faire est que je vais orteil créer un rectangle ici et d'avoir une bonne idée . Nous allons l'appeler cette zone et nous allons réduire son opacité à 0% en fait essayaient de le cacher. Pourquoi ? Parce que cela va juste agir comme un tapé notre zone cible supérieure ou le skipper eux. Donc maintenant, si on fait le prototype des orteils maintenant, tu peux voir que je vais passer à ça. Alors ici. Maintenant, l'étape suivante est que nous allons les orteils sélectionner cette étape n'importe quel de nos cheveux et nous allons cliquer et faire glisser et laisser à celui-ci. Maintenant, cela dit sur le robinet Navigator, Mais nous ne voulons jamais arriver à celui-ci et a dit que nous allons l'ouvrir comme un trop donc nous allons utiliser ce ouvert là-bas et nous n'avons pas de paramètres différents avec la position ce trop centre supérieur gauche centre supérieur, tour supérieur, bas gauche, centre inférieur, quelque chose comme ça. Mais on va utiliser des hommes, Will et je vais jouer ici comme ça. Et encore quelques choses, c'est que je vais l'utiliser. Celui-ci en haut à gauche. Je peux aussi utiliser cette position ici. Je peux également utiliser manuel ou en haut à gauche qui peut être utilisé les hommes seront. Je crois que je vais m'en tenir au manuel en ce moment. Ce sont peu d'options de pollution pour centrer ou quoi que ce soit du genre. De même, nous avons quelques autres options comme les vêtements Lorsque vous cliquez sur les architectes, chaque fois que quelqu'un clique en dehors de cette zone, il va se refermer à nouveau. Nous avons ajouté de l'arrière-plan derrière trop, donc nous allons ajouter un peu de couleur foncée vos cheveux. Vous pouvez également ajouter vital et ici sur ne utiliser 50% de capacité et la mission que je vais utiliser est déplacée plutôt que par exemple. Donc, il va se déplacer comme ça de gauche, droite et d'autres paramètres vont à la même chose. 400 millisecondes est en entrée et en sortie. Excusez ça. Essayons ça maintenant. C' est la dernière étape où nous allions orteil klik. Notre onglet sur le saut. Ok, donc nous avons notre navigation à gauche. Très gentil. Quand je dis que si j'essaie de cliquer ici dehors, ça va rentrer, sortir, entrer, sortir. Donc, ça a l'air vraiment bien. Ce sont les deux bases de tout prototypage. Vous allez relier vos écrans ensemble. Vous allez orteil passer d'un schéma à un autre en tapant. Et aussi nous allons superposer les orteils Différents écrans comme vous pouvez voir où ici nous avons sur plomb Ce sont les directions qui se déplacent. Déménagez. Donc c'est tout Ce sont les bases du prototypage pour sigma. Si vous avez des questions, vous pouvez toujours me poser. Prends soin de tous ces tapotements. Essayez d'avoir une bonne zone de chap afin que vous puissiez les presser avec le cuir de mouche que vos bouches de votre PC ou de votre Mac. Donc c'est tout. Si vous avez des questions à me poser, nous allons vous retrouver dans une autre leçon. 32. Les bases du projet de prototypage: Maintenant, vous avez appris toutes les bases. Préféré hyping comment ? Transition des orteils d'un schéma à l'autre. Comment faites-vous intelligent, tout fait et comment trop écrans sur le dessus de cela. Donc, sachez que votre mission est que vous devez créer cette configuration d'écran trois ou quatre et vous avez orteil partager avec moi. Vous allez créer quelque chose comme ça. Que se passe-t-il ? Donc, il va mettre sur glisser de toute façon. Donc voici trois écrans et puis vous avez remorquer la barbe certains trop avec quelqu'un que vous avez, Par exemple, le saut. C' est trop le cas. Ils devraient venir de la gauche, non ? Ou n'importe où vous voulez placer que vous voudrez peut-être le placer sur le dessus. La bordure de bas en haut. Tant de choses viennent du bas de l'écran. C' est à vous de décider. Donc c'est le prototype. Une fois que vous avez créé ce prototype, vous avez remorquage cliquez sur le prototype de partage, et vous pouvez voir qu'il y a des paramètres sur les personnes Lee invitées à ce fichier et toute personne avec le lien alors relâchez cette personne avec le lien et copier le lien et partager que liens vers moi. Je suis capable de voir et de voir visuellement votre prototype. Et je vais vous faire part de vos commentaires. Si vous avez des améliorations, je vais vous le dire. Assurez-vous donc que vous créez cette saillie. On peut me dire votre nom quelque part, donc je peux facilement me rappeler que c'est le prototype de mon élève. Donc, trois écrans ou peut-être quatre écrans ou deux écrans tradition de l'un à l'autre et troisième écran pour le trop. C' est votre mission. Alors commençons maintenant. Je suis en train de lire pour voir votre parfait je non. 33. Échangez avec la superposition et les délais: dans cette vidéo, nous allons apprendre quelques autres choses que nous pouvons faire lors du prototypage dans la figue MMA. Donc, nous allons aller de l'avant et apprendre quelques autres choses, comme, voir ou entendre. Ici, nous l'avons. Um c'est comme celui-ci, cette interaction et vous pouvez voir que nous utilisons balayé avec. Donc nous allons étudier avec des liens et comment vous pouvez le faire. De plus, nous allons apprendre DeLay, par exemple. Si nous avons ici, si nous allons à ces interactions, alors nous avons des interactions, et ensuite nous avons une mission. Si nous avons ici, si nous allons à ces interactions, alors nous avons des interactions, Donc, à l'intérieur de ce panneau d'interaction, on va étudier les orteils. Plus de choses pour que nous puissions améliorer le prototypage. Donc, nous l'avons ici. Définissez-le sur l'onglet. Nous allons également étudier drag et aussi après dilly tous ces,par exemple, par exemple, vile planant en appuyant sur le pad de jeu, les pourrait ne pas être nécessaire la plupart du temps. Donc maintenant, on va les sauter. Peut-être qu'à l'avenir, je vais créer plus de leçons sur ces options. Les sont différentes interactions tout en maintenant un objet en appuyant dessus. Peut-être que vous essayez de créer un jeu avec la clé de maintien. Ah, et entrer la clé et changer quelque chose. Centre de la souris, la plupart des feuilles. Touchdown. Donc ceux-ci pourraient être principalement nécessaires dans les jeux, fondamentalement. Donc nous y voilà. Alors commençons. Tout d'abord, je vais supprimer ces interactions déjà signifiantes. Donc, il y a beaucoup de façons que vous pouvez aller à ce prototype plus nous sommes à l'intérieur. Vous pouvez appuyer sur Supprimer et va supprimer cette interaction. De même, pour celui-ci, je vais appuyer sur supprimer, ou vous pouvez aller ici et sélectionner aucun. C' est une autre façon. Parfois, peut-être que la stigmatisation ne fonctionne pas pour vous. Et vous n'êtes pas familier. Comment ? Toe supprimer cette interaction entre ces deux éléments. Tu peux le faire. D' accord. Donc balayé avec si d'abord nous allons faire est que nous avons déjà ceci. Euh, vous pouvez dire que c'est notre trop Nous avons ouvert une superposition ici. Donc, chaque fois que vous êtes à l'intérieur et trop, et que vous voulez passer à une autre navigation, par exemple , une navigation , par exemple, comme celle-ci. Donc, nous sommes à l'intérieur de ces paramètres et nous voulons aller à l'intérieur des paramètres et et c'est les écrans de réglage. Donc, c'est en fait l'orteil de navigation gauche nommé il. C' est juste un double de cela. Donc, Donc, ce qu'on va faire, c'est que je vais te montrer comment ça va marcher dans quelques secondes. Donc d'abord, nous allons relâcher cette couche ou ici, et nous allons créer une interaction. Donc nous allons déplacer le pied cet écran sur le robinet, et nous allons l'utiliser. Le navigateur que nous allons utiliser balayé naviguer va en fait supprimer ce cadre. Et il va aller à ce cadre pour que tout ce qu'on a laissé sera, tu sais, euh sera parti. C' est donc un autre problème. Donc enchère balayée est principalement aller travail des orteils. Lorsque vous êtes dans un trop amarré, vous avez déjà un trop sur votre ab. Je vais vous montrer un autre exemple. Donc d'abord, nous avons ceci, et ça ira là-bas. Et de même, quand nous préstons traverser au-dessus, il va revenir à cet écran, l'écran, et nous allons utiliser sur le robinet giflé avec, et il va être navigation à gauche. Celle-ci et nous allons utiliser dissoudre. Il est dedans, ou il est sorti. Vous pouvez utiliser n'importe lequel d'entre eux pour 50. J' utilise conserve la position de défilement. Donc, il est parfois quand nous avons un très long écran. instant, on ne l'a pas. Mais si quelqu'un est avoir ah défilement et enroulé défilement vertical et ils ont scolarisé il va orteil Rester sur la même position qu'il va aller. , Il va préserver les positions de défilement. Si tu as l'école, ça le sera. Quand tu cuisines, reviens. Il sera à la même position. Donc en ce moment, je me suis opposé juste pour que vous puissiez voir amusant. Nous n'en avons vraiment pas besoin parce que notre navigation à gauche est petite. Il n'est pas capable de défiler. Alors jouons à ça. C' est notre prototype. Même voir tes cheveux. Ici, nous l'avons. Jouons à ça et on va au saut. Et ici, nous avons notre navigation. Donc juste, par exemple, pensez que c'est la navigation ? Non, si on veut aller aux paramètres et que je ne veux pas cacher tous ces écrans derrière. Donc, je vais sélectionner ici et vous pouvez voir tout ce cadre le cadre d'arrêt. Il est balayé avec un autre ami où je peux changer mes paramètres et ensuite je peux revenir en arrière. Donc, c'est en fait le cas d'utilisation ou le scénario hors en utilisant une sangle avec fonction sur fig MMA dans fig MMA. Donc, tout est au sujet balayé avec. Maintenant, laissez-moi vous montrer un autre exemple. Ici, nous avons notre figue Mahfoud à laquelle nous allons concevoir dans cette leçon. Et vous pouvez voir que j'ai conçu un feedback de superposition très simple. Donc, une fois que vous avez soumis ceci, euh, votre avis sur un plat ou n'importe quelle recette ici. Donc, chaque fois que vous soumettez ceci après l'avoir soumis, il vous montrera un message de commentaires, et ce sera ce message de commentaires. Donc, ce que nous allons faire est juste de passer au prototype et c'est en fait notre trop vous pouvez voir, cet écran est en train de tourner les pieds. Prends ça trop, donc si je te montre, en fait, on va aller vite sur cet écran où on a ça ici. Donc si je retourne ici, on a tout ça prêt à manger maintenant. Donc, quand nous cliquons ici, il montre un trop que nous avons déjà discuté. Donc ce n'est pas trop. Et si vous essayez de cliquer ici Si vous essayez de cliquer ici, rien ne se passe parce que nous ne l'avons pas lié au prochain jeu. Donc, je veux est que je veux gifler cet écran avec un autre qui va être Merci d'avoir soumis votre avis. Alors revenons en arrière et faisons ça maintenant. Donc, une fois que quelqu'un aura cliqué ici, je vais aller à l'écran. Je vais sélectionner sur l'onglet giflé avec cette 'll écran balayé avec l'écran que je voulais dissoudre Vous pouvez également utiliser l'animateur intelligent se déplaçant je vais à slacked Smart, animate Cette fois est en est sorti et c'est tout ce dont j'ai besoin en ce moment. Donc je vais retourner ici maintenant. Si j'ai essayé d'appuyer sur ça, vous pouvez voir que nous avons ceci et qu'il disparaît parfois après. Donc c'est que je vais te le dire dans une seconde. Ok, donc une fois que vous cliquez ici, ce n'est que notre feedback sur le cadre. Ce que j'ai fait, c'est que j'ai sélectionné l'interaction après retard. Donc, après un sac, il va disparaître. C' est comme un message de rétroaction qui apparaît et disparaît automatiquement après un certain temps. Donc, nous allons augmenter les orteils augmente le temps à 2000 milliseconde, ce qui est égal à deux secondes. Donc, par ici, on va lâcher les orteils si près, trop. Donc, plutôt que de revenir en arrière ou de le mettre au rebut, nous allons utiliser près. Extrêmement. C' est tout ce dont nous avons besoin. Donc, ils sont vers les arbres. choses que nous avons apprises dans cette leçon, c'est qu'une fois que vous êtes trop d'humeur, vous voulez le gifler avec un autre écran avec lequel vous devez utiliser gifle. Ici, nous avons cette attraction rapide. Alors où il est, laisse-moi choisir celui-là. Donc, ici, nous avons sur le robinet, c' rapide. Ok, donc maintenant je vais les utiliser dans. Et, euh, oups, je vais utiliser dissous est toujours mieux pour celui-là parce qu'il va orteils. Hum, allons comme ce poste d'école. Ça va être mieux parce que nous ne voulons pas que les choses soient faites et en bas. Nous voulons juste que l'orteil de l'écran apparaisse et disparaisse après deux secondes. Donc, en fait, j'ai chaque fois que vous voulez utiliser ce temps, retarder les vêtements d'orteil et superposition, vous avez remorquer mou ce cadre et aller à l'interaction et l'utilisation après le retard dans cette interaction et utilisé le temps ici et fermer le trop. Maintenant, on va voir ça. Et si nous cliquons ici, soumettre trop Sommet examen sur la pâte vivante. Et si nous cliquons ici, vous pouvez voir merci. Et il va disparaître après deux secondes. C' est donc l'interaction que nous voulions, et nous l'avons créée en utilisant l'ID de slap et le délai. J' espère donc que vous avez apprécié cette leçon. Si vous avez des questions, voulez-vous me poser quelque chose sur le prototypage dans la figue MMA, vous pouvez toujours me demander, Passons à la leçon suivante. 34. Sur l'interaction de draguez et le défilé vertical horizontal: dans cette leçon, nous allons apprendre sur la traînée en traction. Donc, si je sélectionne celui-ci, vous pouvez voir dans cette interaction que nous avons sur pression sur glisser. Donc, cela va être utilisé beaucoup de temps. Et lorsque vous êtes en train de concevoir ou de créer une interaction ou un prototype, donc sur le glissement est en fait en train de devenir le pied dans le suivi lorsque vous essayez de faire glisser un objet. Donc pour ça, nous allons créer, euh, et rectangle ici. Alors pense juste que c'est un e-mail. Donc, vous utilisez, en fait, par exemple, vous utilisez Gmail, et c'est un e-mail ici. Donc il y a une taxe sur vos cheveux. Mettons du texte pas de chaussures sur ce fond pour être comme ça. Donc, ici, nous avons un e-mail. Il suffit de penser que c'est un e-mail que je viens de recevoir. Utilisons ici jusqu'à il y a quelques minutes. Je suppose que je viens de recevoir cet e-mail et c'est mon vrai nous allons comme ça et commande g pour contrôler un groupe. Nous sommes un groupe. Ok, donc on a ce mail malin. Ok, donc juste notre email par ici. Échangez votre Sculler à autre chose, tirez celui-ci. Ok, donc nous avons reçu juste un email et je veux le faire glisser. Et je veux ici mes contrôles, Toby supprimer ou peut-être déplacé dans un dossier ou quelque chose comme ça. Donc je vais utiliser Elemental. Voici un va être celui-là, donc je celui-là va bouger comme ça. Ok, alors copions ça et placez-le ici. Contrôle C, Commandement V. Et ici, nous avons le même email ici. Mais ici, nous voulons qu'il soit traîné à cet endroit. Faites glisser vers cet emplacement, et nous allons en utiliser un autre. Donc nous allons en créer un autre 10 ici, 84 hauteur. Combiner avec ça comme ça, et nous allons utiliser une autre couleur, comme ça. Et bougeons ça un peu plus. On est là. C' est bon, donc c'est notre état de traînée. Si nous voulons en ajouter, vous pouvez voir quelques icônes, lèvres à eux, contrôle de décalage, barre oblique inverse je pion. Je vais utiliser des icônes matérielles, et il va apparaître ou les cheveux, donc je vais utiliser delete. Donc, ici, nous avons supprimer. Excusez-moi, et nous avons encore mangé Faisons à l'intérieur. Ça aide. Faisons-le glisser et utilisons-le ici. Oui. Qu' est-ce que c'est que nous avons cette liste, M. Bean. Image traînée et normale, donc je peux facilement voir ce qui se passe. Je ne vois jamais ce qui se passe ici. Donc, ici, nous avons ce facteur. Déplaçons-le ici avec ce rectangle. Supprimons juste ici. Nous avons ce spectre au-dessus de ce rectangle changer sa couleur blanche. Et ensuite, vous un peu de Dexter avec lui. Ce ne sont donc que quelques ajustements. Je veux que les orteils vous disent peser et comment nous pouvons l'utiliser. Et quel est en fait le cas d'utilisation de cette option afin que nous puissions avoir plus d'options ici. Utilisons juste de garder ça ici maintenant. Il suffit de diluer et de sélectionner tous. Allez, G. Et ça va être nos actions de dragage Actions escortées. Maintenant, si vous voulez utiliser ça, nous voulons aussi ce groupe Toby ici, et nous allons le positionner. Allez. Tu vois ? Ce sera par ici, mais ce sera en dehors de cette section ou ici. Ça va être ici dehors de ce cadre. Maintenant, nous allons passer au prototype. Donc, nous avons acheté ces actions e-mail et glisser. Nous avons ces deux dans les deux hors de ces cadres. Ce sont tous les deux des conseils. Juste un changement de position. Donc, nous avons cet état de glissement et c'est en fait un état normal. Maintenant, on va prototyper ça. abord, nous allons sélectionner cet élément ici e-mail parce que notre action de glissement va se produire sur ce leader. Donc, nous allons le lier à ceci ici drag state et on tap plutôt que sur ce que nous allons utiliser sur drag. Donc, sur la traînée, il va orteil naviguer cet état de glissement, et nous allons utiliser intelligent de toute façon, il et plus facile est sorti. Autrement dit, je vais utiliser. Donc, utilisons 4 50 millisecondes et voyons comment cela se passe. Maintenant, vous pouvez voir que nous avons cet e-mail ici et nous allons effectuer plus action de glissement et vous pouvez voir une fois que je suis, j'ai traîné. Vous pouvez voir cette option de suppression ou ici. Donc nous n'avons pas créé la traînée ici. Donc nous allons lier ça maintenant. Donc maintenant vous allez sélectionner J'ai fait ceci ou ceci, donc nous allons sélectionner celui-ci et, euh, c'est utilisé sur drag. Et il va bouger les orteils, ne jamais arriver à l'état normal et nous allons utiliser les mêmes paramètres généraux. Alors revenons en arrière. Et il a traîné ça comme ça et ça et ça. De même, si vous voulez avoir toute cette Dragnea, vous pouvez également l'utiliser et vous pouvez également utiliser la même action ici sur glisser. Donc si tu as raté ça un an et que tu utilises cette zone, même chose va arriver. Vous pouvez voir Donc maintenant je pense que notre celle-là est très proche. Le prototype. Donc, c'est en fait l'action de glissement. Ainsi, vous pouvez également avoir un écran de plus où cela est effectivement supprimé. Donc, une fois que vous avez glissé et puis tapotez dessus ici, il va à bout. Supprimez cet e-mail et déplacez tous les autres e-mails vers le haut. Donc, pour cet exercice, je voulais vous dire comment utiliser sur l'action de glissement et comment vous pouvez l'utiliser lorsque vous essayez créer un prototype dans la fig MMA maintenant Parlons des actions de défilement simples. Coeurs sous l'école et l'école verticale. Vous avez déjà commencé l'école verticale. C' est très facile. Votre écran est de longueur ici que votre écran normal. Mais qu'en est-il de l'école horizontale, par exemple ? J' ai, genre, trois boîtes étaient là, et c'est dehors. Donc ce que je vais faire, c'est que je veux qu'ils soient permises. Donc maintenant, vous pouvez voir que c'est dehors de tout ce cadre. Alors comment je peux faire ça ? Comment je peux faire défiler ces, Par exemple, j'ai celui-ci ici comme ça. Il va sortir, donc je dois le traîner dans cette renommée. Donc c'est notre normal ici, et nous en avons quatre différents. Vous pouvez voir quatre cadres différents ici pour différents rectangles ou peut-être des images ou peut-être n'importe quoi. Euh, tu peux réfléchir. Ça pourrait être vos recettes ou n'importe quoi. Donc, si nous en avons quatre, et je veux qu'ils soient traînés à base de plantes, donc chaque fois que quelqu'un ouvre cette application, ils peuvent facilement les faire défiler. Donc maintenant, si je vais par ici, vous pouvez voir Rejouons si je vais par ici, vous pouvez voir Rejouonsça et nous l'avons ici, non ? ça et nous l'avons ici, maintenant, vous pouvez voir sur la dissection se passe. Donc, c'est en fait la tribu de dragage est ici, mais je veux qu'ils soient niveau de vis si facile. Je vais les sélectionner tous. Je vais les utiliser dans un cadre, donc je vais utiliser la sélection de cadres. C' est mon ami. Donc ce que je vais faire, c'est que je vais réduire la taille de mes amis une taille de fenêtre, en fait. Qu' est-ce que 500 ? Je vais utiliser 400 à la place. Donc ça va être mon ami. Et je vais utiliser le contenu de clip comme ça. C' est Z utilisé ici comme ça. Et je vais utiliser 400 pour la taille comme celle-ci. Donc, cela semble mieux maintenant pour n'importe quel cadre que vous pouvez sélectionner fournissant des options. Donc, une fois que vous avez sélectionné ce cadre, vous pouvez aller au prototype ici. Ce cadre est donc sélectionné. Vous pouvez aller par ici Pas d'école, et nous voulons avoir un comportement de défilement horizontal pour ce comportement de débordement. Donc, cela va réellement se produire ici, donc vous pouvez également le définir pour toute cette planche d'art afin que vous puissiez avoir le nôtre sous défilement vertical et des heures d'école. C' est à vous de voir. Donc, une fois que cela est défini, vous pouvez facilement les faire glisser comme ceci. Vous pouvez voir vraiment gentil. Très facile. Je pense que je devrais l'expliquer un peu plus. Utilisons la fenêtre. Verdes, Toby. 300 espoirs, ni 30. Je veux que le cadre soit 300. Excusez ça. Nous avons donc ici le cadre. Je vais bouger le cadre. Hum 60. Ceci Donc je vais déplacer le contenu à l'intérieur du cadre comme j'aime ça. Ok, donc les cadres en fait de l'intérieur, ça va travailler comme une fenêtre. Et maintenant, quand j'essaie d'utiliser ça, vous pouvez voir où ici. Très gentil. Très belle traînée et école par ici. C' est en fait qu'on a laissé notre seul élément ici, qui est notre vert. Je faisais bien, donc c'est très loin. C' est pourquoi cela se produit. Alors utilisons-nous tous et vous étudiez pour avoir un égal de celui-ci et des distances entre eux . Allons comme ça. Ok, donc c'est vraiment cool. Très gentil. Très gentil. Donc, c'est en fait comment vous pouvez prototyper et activer le défilement horizontal ou la scolarisation verticale et utiliser des cadres pour les éléments à base de plantes scolaires comme ceux-ci. Donc je pense que cela va vous aider beaucoup dans votre prototypage quand il utilisait sigma ces air sur les bases que j'ai couvertes. Je ne pense pas que vous ayez besoin de plus que ça pour créer de belles interactions. Si vous avez des questions, vous pouvez toujours me poser. se voit dans la leçon suivante. 35. transitions de survol dans le Prototyping en utilisant Figma: Dans cette leçon, nous allons voir une autre caractéristique du prototypage dans sigma, qui est en survol. Donc c'est un autre déclencheur. Fondamentalement, nous devons animer quelque chose ou déplacer vers un autre écran lorsque vous planez quelque chose. Laissez-moi vous montrer comment je l'ai utilisé. Donc maintenant, vous pouvez voir que c'est mon design. J' ai en fait conçu ce site récemment, moment en phase de développement. Maintenant, si vous regardez ici, vous pouvez voir quand je survole ce lien, il s'estompe en couleur bleue, qui est en fait toute ma surestimation pour mon design web. Donc, à chaque fois que je survolerai ça, vous pouvez voir par ici. Ainsi, vous pouvez voir que la couleur a changé. Donc c'est en fait, j'ai fait ce prototype pour montrer à mon développeur, mon développeur web, que comment vous allez appliquer tout cet effet sur cette navigation. De même, vous pouvez voir ici, comme je l'ai fait pour ces boutons ici, appelez un double six de la même manière, le bas. C' est ainsi que je lui ai montré ou expliqué à mon développeur que c'est ainsi que vous allez utiliser ceci, ces couleurs sur ces boutons. Donc aujourd'hui, je vais vous montrer comment vous pouvez facilement créer cela. C' est un exercice simple. Vous pouvez voir par ici. Et c'est très, très, vraiment facile. Donc, il y a juste des choses que vous n'avez pas besoin de faire beaucoup de choses. Maintenant, laissez-moi vous montrer, laissez-moi les réorganiser pour vous. Ok, donc ça va être notre écran par défaut, ou le premier. Donc ça va être notre premier où nous avons tous les états, tous les boutons en état normal. L' état normal signifie qu'ils vont être de manière simple qu'il n'y a pas d'animation de vol stationnaire, rien. Donc, cela va être l'état par défaut ou l'état normal. Ensuite, quand quelqu'un passe la souris sur ce bouton. Maintenant, pour chaque devoir, pour celui-ci et celui-ci, je vais avoir deux écrans différents. Donc vous pouvez voir ici, appelons-le sur le bouton et appelons ceci ou lien. Donc, ce que j'ai fait, supprimons ceux-ci. Donc, vous avez créé, par exemple, vous avez créé cet écran ou ici, laissez-moi zoomer. Donc, sim un symbole mais sur un simple lien avec la couleur grise et assurez-vous que vous avez une cible tactile ou zone de chaleur autour d'elle. Donc ce que j'ai fait, c'est que je viens de dessiner un rectangle. Laisse-moi te montrer. Donc, j'ai juste dessiné un rectangle ici, ai fait 0%, et le déplacer à l'intérieur de cet essai maintenant, au bas de cet essai maintenant. Maintenant, le texte est que le haut et nous avons un calque caché derrière cela. C' est donc ce que nous allons utiliser. Pour prototypes ou relier nos prototypes. Donc, ce n'est qu'un simple bot et 24 pixel est une rondeur et c'est la taille et la largeur. C' est juste une forme. C' est tout ce dont nous avons besoin. Maintenant, nous allons, rendons ça un peu plus petit. C' est génial. Ok, donc maintenant nous avons notre état par défaut prêt. Maintenant, je vais répliquer ça en appuyant sur option D et en le faisant glisser comme ça. Et puis nous allons le traîner comme ça. Donc, ce sera notre défaut. Ça va être notre état de bouton hoover. Et ça va être notre état Over link. Ok, alors ce qu'on va faire juste on va changer la couleur. Utilisons quelque chose par ici. Et je vais y aller comme ça. Utilise ça. Ok, donc vous pouvez voir dans cet état que je n'ai rien changé pour ça parce que si j'essaie de le changer, quand quelqu'un survolera, les deux vont changer. Préparons le second. Donc ici, sur ce lien hypertexte, rien ne va arriver à ce bouton. Mais ce lien va en fait changer sa couleur de ce gris à la raclette noire. Ok, c'est tout ce qu'il nous faut. Maintenant, nous allons passer à ce prototype et nous allons les relier. D' abord. Nous allons lier celui-ci à celui-ci. Et sur notre interaction plutôt que OnClick, Nous allons appuyer sur cette vile planant. Donc, tout cela en survolant, tout en appuyant sur, ce sont presque les mêmes feuilles d'entrée de souris de souris. C' est presque la même chose que le camouflage. Mais ils ont d'autres options comme peut-être vous voulez animer quelque chose. Ce sont pour ces touches et manette est en fait la touche que vous avez pressée, par exemple, quatre ou cinq ou six, ou P, o vous n'importe quelle touche sur votre clavier. instant, on n'a pas besoin d'y aller. Si vile planant, nous allons sélectionner tout en planant. Et pour l'animation que je vais utiliser, utilisons d'abord dissous. Donc, je vais utiliser la facilité dans et hors 300 millisecondes. Et puis pour celui-ci, je vais bouger, lier à celui-ci, les mêmes paramètres ici. Voyons maintenant comment ça finit réellement. Donc maintenant, vous pouvez voir vraiment cool. Donc, chaque fois que je pars de ça, vous pouvez voir comment il s'anime et s'estompe à cette couleur. Vraiment génial, vraiment génial. De même pour celui-là. Oups, que se passe-t-il ici ? Voyons, quel est le problème. Dissoudre est dans, out o, donc il n'est pas onClick, Nous devons sélectionner sur tout hoovering. De même pour celui-là. Oh, très sympa, très sympa, vraiment, effet vraiment cool. Ok, donc maintenant vous avez appris à utiliser cette vile planeur en prototype en utilisant sigma. J' espère encore que vous pourrez utiliser ces effets dans vos prototypes FISMA. Vous pouvez les utiliser dans vos prototypes de conception web comme je l'ai fait ici dans ce prototype pour montrer à mon développeur que c'est ainsi que tout l'effet va fonctionner. J' espère donc que vous avez apprécié cette leçon. À bientôt dans une autre leçon. Jusque-là, prenez soin et au revoir. 36. Projet  sur glisser et Scroll.: C' est le moment de votre prochaine affectation. Et votre mission est que vous avez déjà appris la fonction de drag comme ceci. Vous pouvez voir où ici dans cette fonction de glissement prototype. Et c'est votre première affectation que vous devez créer un fichier. Vous pouvez l'effacer simplement. Je veux juste savoir que vous avez compris le concept. Tout ce que vous pouvez créer un e-mail, tout ce que vous voulez, donc glisser-glisser. Donc, c'est une partie de cette affectation. Deuxièmement, c'est que vous devez créer un peu ce défilement horizontal dans un cadre. Donc c'est votre prochaine mission. Créez ceci et puis vous devez cliquer sur le prototype de partage Toute personne avec le lien et copier lien et partager avec moi le lien dans votre discussion ou dans la section d'affectation ou de projet , tout ce qui est disponible pour vous et je veux voir ce que vous avez créé. Assurez-vous d'utiliser votre nom quelque part pour que je puisse me rappeler que c'est de cet étudiant. Donc je vois un agriculteur à votre mission l'attendre. Maintenant, continuez à concevoir et à améliorer et continuez à prototyper. Comme toujours, ça va nettoyer les orteils. Un monde meilleur avec de bons designs de toute façon, stock No 37. Application Figma Mirror - Aperçu des appareils réel: dans cette vidéo, je vais parler de la façon dont vous pouvez afficher ou prévisualiser votre figue, mon design sur un appareil réel. Il y a donc plusieurs façons. Donc, il y a un miroir Sigma cour app. Vous devez donc le télécharger sur votre mobile, par exemple. Vous pouvez le voir sur vos appareils Mac ou vos iPhones. Donc, vous devez télécharger ce miroir fig maman pour votre iPhone. Et puis vous devez télécharger le miroir de stigmatisation pour vos abs android. Donc en ce moment, j'ai mon téléphone Android avec moi. Je vais passer à cet écran avec mon appareil photo et je vais vous montrer comment vous pouvez voir votre globe oculaire d'oiseau. Laissez-moi vous montrer ce prototype sur un appareil réel. Donc, il y a quelques étapes qui vont vous aider à voir cela parce que certaines choses sont confuses et il y a très vous pouvez voir de mauvaises critiques pour fig mon application. Je pense qu'ils essaient de l'améliorer. Trois étoiles ici et aussi 2,5 SRAS ou ici. Donc ils ont vraiment, vraiment besoin d'améliorer cela. Mais quand même, je pense que je vais te guider à travers tout ce processus. Alors passons à l'autre caméra et voyons comment vous devez le faire. Maintenant, vous pouvez voir mon élan de figue. L' application est ouverte sur mon téléphone Android et vous avez cet e-mail et mot de passe vous avez orteil tapez le mot de passe et l'e-mail de votre fig. Mon compte. Je l'ai déjà sauvé. Donc je vais appuyer sur la journalisation. Non. Une fois que vous vous connectez, il va vous demander cela. Sélectionnez un cadre ou un composant qui dirige Dax directement sur le canevas. Donc maintenant tu dois passer à ta figue, mon ab ici, et tu dois choisir les scandales ici. Donc je vais relâcher l'état de la caméra d'un, qui est en ce moment sur mon écran. Et vous verrez qu'après un certain temps de chargement, il a chargé cet écran ici. Donc, une fois que l'écran est chargé, je peux juste un prototype, par exemple, tapant ici. Il va animer et passer dans différents écrans, bien qu'il soit un peu legging et lent. Mais je pense que vous pouvez voir votre supérieur droit. Nous sommes là que je vais aller à Skip, et vous pouvez voir, le menu coulissant arrive ici. Je vais aller dans les réglages et je veux revenir en arrière et ensuite je vais aller aux pieds, déplacer ça dehors. C' est donc un gros lent. Mais je pense, euh, vous pouvez voir au moins une partie du travail sur elle et vous pouvez voir comment il va réellement orteil être vu sur une application mobile. Je pense qu'ils doivent beaucoup travailler dessus, mais quand même, c'est un aperçu de la vie. Votre design. Certaines des fois où vous concevez, vous devez voir votre conception réelle sur un appareil réel comme vous pouvez voir où ici je peux clairement voir quelle est la taille du type, ce qui est une taille quatre, mais que le support du personnel est assez pour North ce genre de choses. Donc, vous devez voir votre prototype sur un orteil de l'appareil en direct, en fait voir certaines choses hors. Par exemple, vous pouvez voir ce bouton est en fait assez bon orteil, vous savez, Tab ou ici, par exemple, cette icône de cercle ici, celui-ci ce cercle étroit il est en fait un bon taille. Je peux facilement le taper pour le doigt. Donc c'est le genre de choses que tu dois voir. Par exemple, ce téléphone pour Chuy de cette taille de texte et les marges sur les côtés de cet appareil. Voici donc quelques-unes des choses réelles que vous devez voir en direct sur votre appareil. Alors tu pourras y retourner. espoirs remontent à cette figue mab. Vous pouvez vous déconnecter et c'est tout. J' espère donc que vous avez apprécié cette leçon. Vous devez télécharger l'application stigma Miller sur votre appareil mobile que vous soyez sur IOS iPhone et assurez-vous que la taille de cadre de votre taille de cadre que vous sélectionnez votre taille de tableau d'art est en fait la même que votre appareil en ce moment. Vous pouvez voir cette application ici, que j'essaie en fait d'utiliser est Google. Je pense que ça me laisse te montrer. Il est Google pixel pour exceller. Donc, c'est 400 citron par 8 23 C'est la taille pour mon appareil Android, donc j'avais fait comprendre orteil. Une fois que j'ai ouvert cela ici, j'ai dû voir quelle est la taille qui va réellement tenir sur cet appareil. De même, si vous essayez des tests orteils sur et iPhone 11 pro ou huit plus, vous devez utiliser cet appareil physique. Sinon, est-ce qu'il ne va pas s'adapter orteil tout l'écran. Il va être un peu dehors, ou peut-être à l'intérieur de l'écran et partir. Certaines zones noires sont à l'extérieur. Donc, ce sont les choses à propos de l'utilisation de l'application miroir fig maman. J' espère que vous avez appris quelque chose de précieux de cette leçon. Passons à l'écoute suivante. 38. Créer des Wireframes et l'inspirations: avant de commencer à concevoir cette, euh, belle application sur la façon dont les recettes. Je vais vous montrer quel est mon processus de planification et comment j'ai atteint cette conception. Qu' est-ce qui m'a inspiré ? Comment j'ai sélectionné les couleurs pour mon jeu de couleurs. Bien que j'ai des cours différents, vous pouvez les regarder. J' ai des couleurs bien sûr. C' est ainsi que vous pouvez maîtriser le jeu de couleurs ? Sélection typographique ? Je ne vais pas entrer dans beaucoup de détails parce que ce sont de grands sujets plus grands. Mais chaque fois que je commence à concevoir quoi que ce soit de l'expérience utilisateur, du point de vue, vous allez à la pointe. Toujours en avoir sur les cadres métalliques. Donc sans ceux-ci, vous n'allez pas aller nulle part avant ces cadres métalliques. Nous avons, ah, tenir l'expérience utilisateur, processus de conception, utiliser les histoires, utiliser les scénarios, affinité, diagrammes et tout ça. Nous allons donc interviewer les utilisateurs. Nous allons voir quels sont leurs besoins, et nous allons les orteils convertir vos genoux besoins orteils, faire les histoires, guerres et les fonctionnalités, et ces fonctionnalités vont être sur un cadre vile. Donc, cadre métallique va être le point de départ de la conception de l'interface utilisateur ou chaque fois que vous allez concevoir. Donc, nous avons tous les besoins des utilisateurs ici. Et vous pouvez voir que c'est mon écran d'ouverture de session. Ce sont les requins de peau de mon dessin. Mauvais. Pardonnez mon design, ou j'essaie d'être aussi simple que possible. Et vous pouvez voir que nous avons l'idée d'avoir un endroit ou quelque chose comme ça. Des pommes par ici. Quelque chose comme ça. Oui. Livré connectez-vous avec Facebook et connectez-vous avec Google et ignorez le Logan, par exemple. J' ai vu et étudié, comme, quatre ou cinq tours de moi populaires avant de concevoir celui-ci. C' est vraiment important. Donc je vais vous montrer, euh, euh, c'est l'inspiration pour moi pour le jeu de couleurs, donc j'adore le vert et l'orange. Donc, j'utilise principalement ceci. Donc, c'est en fait un jeu de couleurs. Mais je ne vais pas faire face à ce jeu de couleurs. C' est différent. Ce sont des couleurs différentes. Maintenant, vous pouvez voir que je vais m'inspirer pour leur cynisme. Et puis nous avons un partisan d'idée. Donc, dans ces idées pour un vous pouvez voir ce sont les abs recette populaire, mais aucun d'entre eux ressemble à l'esprit. Donc moins totalement différent, j'ai eu les idées. Différentes idées comme cette navigation en bas. Quelles sont les différentes choses ? Vous pouvez voir les choses. Par exemple, l'étoile note ceci. Ensuite, nous avons l'icône de recherche par ici. Donc une partie de l'adoption légale d'un tueur d'un peu plus que vous pouvez dire des idées comme vous pouvez voir qu'elles sont séparées par ces lignes. Et si je regarde dans mon design, vous pouvez voir que j'ai utilisé ces lignes similaires. Vous ne remarquerez peut-être pas ces choses très simples. Vous pouvez voir que j'ai ça dans mes ingrédients ici. C' est donc très important. Vous obtenez beaucoup d'idées en voyant d'autres idées. Vous allez avoir beaucoup d'idées si vous continuez à regarder des idées différentes sur d'autres abdos I Autres. D' autres concepteurs que vous avez remorquage élargir votre vous pouvez dire design, goût et continuer à regarder sur différents modèles. Il va aux pieds, vous donner de l'inspiration et il va vous améliorer en tant que designer. Donc, ce sont vous pouvez voir différentes inspirations. Et ce sont les idées que j'avais et de ce que je suis allé orteil ont quelque chose comme ça. Donc, je continue à essayer ces cadres de feu et vous pouvez voir que nous avons moyenne Sellards desserts, desserts sains, en vedette sur les 30 mètres recettes saines titre de recette étoiles, ingrédients et préparation. Parce que ce sont les deux choses les plus importantes sans ingrédients, vous ne pouvez pas commencer à préparer votre recette, donc les ingrédients vont venir chercher. Donc, chaque fois que quelqu'un Seigneurs cet ab, ce sont ceci est en fait chargé d'abord, puis vous passez à la préparation. De même, vous pouvez voir si nous revenons aux cadres métalliques. Nous avons de telles options ici, alors ce sont mes paramètres de compte de connexion, et ce sont les choses que j'avais en tête. Donc quelques choses comme vous pouvez voir ou entendre, entendre. Nous avons différentes allergies et régimes que vous préférez. Donc, c'est en fait c'est une fonctionnalité que j'ai réellement conçue et implémentée dans ma recherche ici , donc vous pouvez voir si je vais à la recherche afin que vous puissiez voir si vous essayez de chercher quelque chose, vous avez beaucoup de filtres. Fonctionnaires. Je suis mort filtres de plan. Les filtres sont des allergies courantes comme ces autres allergies courantes. Les gens ont de la nourriture à base de soja, grains entiers, gluten, y compris des analogies ou quelque chose du genre. Ainsi, vous pouvez cliquer et sélectionner les deux hors d'eux. Vous pouvez soit sélectionner le régime alimentaire et vous pouvez soit sélectionner une allergie que vous avez. Et ce seront les résultats. Eso il va avoir remplir cette telle barre et il vous montrera les résultats Donc vous pouvez voir j'ai également ajouté cette couleur qui est à l'intérieur de ce schéma de couleurs et aussi cette orange afin que vous puissiez voir que j'ai effectivement changé certains des aspects. Par exemple, j'ai beaucoup de dim, vert terne dans le fond sur les cheveux plutôt que d'accord ou une certaine couleur verte. J' ai dit ça. Vous pouvez voir ce que j'utilise ici et les téléphones que j'utilise. Voici ces formulaires Rubik Google et Yanta argent. Donc, si vous allez commencer cette conception sont ouverts. Mon design dans votre flegme ahap essayer de télécharger et d'installer ces formulaires est un très beau sens. Sens dit si orange et facile à lire et avoir un peu de style à elle. Ceux-ci sont très clairs. Donc ce sont les deux visages de forts que j'ai utilisés pour concevoir ça. C' est le logo. Je me suis conçu pour cet exercice rapidement. Pour que tu comprennes. Tu pourrais juste comprendre le sens de ça. Et, euh, c'est tout. J' ai donc quelques icônes ici, quej'ai en fait, j'ai en fait, euh vous pouvez dire que j'ai un AB qui s'appelle Nuclear AB. Ici, j'utilise les icônes de ce Vous pouvez utiliser des icônes de Google Material Design, icône Google Material. Donc vous pouvez un tel matériel koukal Icahn et ici vous pouvez aller par ici. Je peux concevoir des matériaux et vous pouvez choisir Seigneur d'ici pour que vous puissiez voir que nous avons des flèches . Différents types d'adultes. Ce sont des icônes standard. Vous pouvez utiliser des icônes de lui. Il y a beaucoup de vidéos. J' ai montré que comment télécharger et utiliser une icône entière. Vous pouvez voir un système. Je vais partager ces icônes avec vous si vous voulez. Et vous pouvez avoir ces fichiers SPD. Je préfère utiliser les fichiers SPG comme une icône car ils sont extensibles. Donc c'est tout. C' est ainsi que tout mon design est allé de pair. Et, euh, j'espère que vous apprécierez cet exercice et que vous apprendrez de tout cela. En fait conçu. J' ai toujours la vision. Toujours suggérer que si vous êtes la typographie Regan ou le schéma de couleurs ou la conception de couches, vous devez suivre d'autres cours qui vont orteil améliorer vos compétences en conception apprentissage d'un outil et les compétences en conception sont deux choses distinctes. J' espère que vous avez apprécié cette vidéo. Comment préparer votre avant votre conception. Vous devez télécharger ces quatre polices de caractères que vous avez tow. Sélectionnez votre jeu de couleurs. Tu dois avoir des idées et de l'inspiration dans ton sac, et tu dois avoir tes amis viles, Freddie. Passons donc à la prochaine conférence et commençons à concevoir dès maintenant. 39. Planification de Grid avant de concevoir: Maintenant, dans cette vidéo, on va commencer. Et avant cela, nous allons gérer nos notes et elles sont formidables et nous allons avoir quelques lignes directrices pour que nous puissions facilement les définir avant de commencer et aligner nos principaux éléments , comme notre navigation supérieure ou navigation par le bas conformément à ces lignes directrices. Donc ce que je vais faire, c'est que j'ai une équipe que tu es excitée. Ensuite, j'ai un projet en lui classe de figment, et je vais cliquer sur un nouveau fichier. Vous pouvez également cliquer dans les brouillons sur ce nouveau fichier et créer un nouveau fichier. Donc, une fois que vous créez un nouveau fichier, il sera sans titre. Donc, nous allons le renommer et renommons pour libérer l'application alimentaire GMA. Donc, nous l'avons fait. Changeons la couleur de fond, donc je vais aller avec un fond plus sombre parce qu'il est plus facile de voir les orteils ici. Donc, nous l'avons ici. La première chose que je voudrais que vous créiez ici est vos cadres viles, sorte que vous pouvez créer vos cadres métalliques sur papier, stylo et crayon et juste prendre l'écran court et les amener ici. C' est tout ce que vous n'avez pas besoin de dessiner votre Vous pouvez dire des cadres de fil dans la fig MMA. Si vous voulez dessiner les chambres de votre femme ici, taxes à vous maintenant je vais créer trois pages. L' un va être des cadres métalliques. Deuxièmement, c'est notre conception. Hum, prochains érudits sont nous. Ouais, ou appelons ça les hommes design. Et puis nous pouvons avoir une autre page appelée Styx Guide. Là où nous étions, tous nos composants seront, donc ça va être sur une structure. Maintenant, nous allons passer au design principal, et la première chose que nous allons faire est d'appuyer sur A ou F G pour aller à ces tableaux ou cadres d'art . Donc, à droite, nous avons l'iPhone 11 pro Max 11 pro. Je vais aller avec 11 pro, et ici nous avons notre tableau d'art maintenant, avant de continuer, parce que chaque cadre va avoir les mêmes réglages que la prochaine. Nous allons donc définir notre niveau de mise en page ici. Alors appuyez sur cette icône plus ici, et nous allons aller dans les colonnes d'orteil et nous allons utiliser quatre colonnes ici. Centre-nous, Alignez l'aide et chaque colonne aura presque 70 grosses largeur, et Dieu aura 20 ans. Ce sera donc nos colonnes et paramètres pour notre niveau de mise en page. Donc, une fois que nous aurons défini ouvertement la note, nous passerons à l'étape suivante, qui sera nos lignes directrices. Assurez-vous donc que vous avez la règle ici en haut et sur la gauche afin que vous puissiez voir à droite ce menu que nous avons des règles activées. Assurez-vous donc que vous avez appris les règles activées, vous pouvez appuyer sur Maj dans notre pour les activer. Donc, une fois que vous les avez fait et que vous pouvez voir terminé et sur, Donc une fois qu'ils sont allumés, nous allons faire glisser une règle ici, et nous allons placer le 1er 1 sur 24 pixels ici, puis nous allons glisser et déposer la suivante à 72 pixels par ici. Donc ça va être pour l'alignement de nos icônes. Nos icônes vont toucher ce 80 ici que ça va être notre bar ici. Et si on descend ici sera notre à 1 50 Big Oezil. On est là. Vous pouvez voir sur la gauche. Si je vais par ici à gauche, vous pouvez voir que la valeur est de 1 50 Donc nous allons le laisser comme ça et traînons le dernier qui va être par ici. Donc, si vous n'êtes pas sûr que comment vous pouvez, vous allez les faire glisser. Vous pouvez créer votre propre élément. Donc ici, par exemple, je vais avoir la hauteur de 60 porcs est pour la navigation en bas. Donc, je vais orteil créer une boîte ici sur 60 pixels juste pour temporaire, juste boîte temporaire et je vais aligner cela. Donc, vous avez vu que j'ai cliqué à l'extérieur de l'orteil, rendre la ligne directrice universelle. Nous avons donc trois lignes directrices en haut. De même, vous pouvez faire la même chose ici afin que vous puissiez créer un élément à partir de votre rectangle sur la taille de 24 pixels et nous allons l'aligner en haut. Et si vous ne savez pas comment orteil faire exactement 24 pixels. Il suffit de créer ces éléments comme ces éléments temporaires, et nous allons le glisser et le déposer comme ceci. Il va s'enfoncer ici. C' est vraiment bien, parce que nous devons être quelque chose. On a quelque chose comme ça. Donc, créons maintenant, faites-le côté 72, vous pouvez voir qu'il s'accroche correctement. On l'a sur 72. Ensuite, on sera sur 1 50. C'est le cordon. Nous l'avons sur 1 50 Donc nos principales lignes directrices sont complètes. Faisons en en sorte que ce soient des lignes directrices globales. Donc, je vais orteil klik dehors et glisser et déposer ici comme ça, que je vais le faire 1 50 Cliquez à l'extérieur glisser et déposer ici comme ça. Donc je pense qu'il faut que nous soyons ici. Donc, supprimez-le et créons un nouveau. Faisons-le glisser et dépose-le ici. C' est ainsi que nous allons mettre en place notre interface principale et comment nous allons commencer . Ça va être notre toile. Donc, une fois que nous devions terminer pour l'écran, nous allons juste reproduire celui-ci. Donc, cliquez sur cette touche Artur Option et nous allons le dupliquer comme ceci afin que vous puissiez également maintenir votre touche Maj à tous peut déplacer la touche pour l'avoir aligné dans la même manière dans la même ligne, qui exactement exactement où votre premier cadre est. Donc c'est comme ça que tu le fais. Donc c'est notre premier écran. Et une fois que nous avons ceci, renommons le toe, hum, hum, en tirage au sort ou quelque chose comme ça. Et Delia Rex a utilisé ce rectangle. Nous avions un rectangle ici, alors dessinons un rectangle pour l'arrière-plan. Pour être cette pleine taille ici comme ça, exprimez un pour zoomer sur l'ajustement et nous avons cet arrière-plan. Appelons ça PG ou arrière-plan. Maintenant, nous allons faire glisser notre image à l'intérieur, et nous allons placer les pieds à l'intérieur de ce conteneur et la déplacer là où nous avons averti l' image d'être 40. Conception d'interface utilisateur de l'écran de connexion: Maintenant passons aux ressources pour le dîner. J' ai attaqué avec cet exercice. Vous l'êtes. Vous l'avez déjà téléchargé. Maintenant, nous allons l'ouvrir et l'image du conducteur ici. Voici donc notre appli alimentaire. Ressource est, Et à l'intérieur des dossiers d'images, vous pouvez voir ces autres images. Voici les images pour les arrière-plans qui sont très vides et peuvent être utilisées ici. Donc, j'utilise vraiment celui-ci. Donc je vais le glisser et le déposer et fig mon comme ça, ce zoom arrière. Et vous pouvez voir que c'est en fait la limite de cette image appuyez sur le décalage, oppression personne Maintenez le décalage et modifier l'option de l'orteil. C' est mon grand, plus petit comme ça. Tu vas le bouger comme ça. Et une chose que nous allons faire est que nous allons relâcher ces deux couches et nous allons en fait contrôler la mosquée, art et l'option de commande de marqueurs. Et voici donc notre mosquée. Donc maintenant vous pouvez voir que cet arrière-plan est en fait masqué par ce rectangle ici, donc je suis libre de le déplacer. Cachons notre mise en page. Grid control shift 4 est un raccourci sur, um, B c et je pense que le contrôle G ou contrôlé. Je ne me souviens pas du raccourci sur le Mac, mais il sera affiché à l'écran. Donc, euh, juste pour être sûr que nous pouvons facilement concevoir plutôt que des disques qu'il distrait ici. Donc je veux bouger ça. Vous pouvez voir que j'ai sélectionné cette image ou ici. Donc il se déplace à l'intérieur de ce conteneur. Alors nous allons le déplacer comme ça, et vous pouvez l'agrandir et vous pouvez l'inventer. C' est un peu plus petit comme ça, et je pense que ça a l'air super. Maintenant, si vous voulez changer Ah, cette image ou tous les paramètres, vous pouvez aller à cette image. Vous pouvez changer les surlignements augmenter la surbrillance, Comme cette mise en évidence est en fait le rendre un peu plus lumineux. Les blancs sont des ombres plus proéminentes, Atmore, sombre contre. Si vous voulez rendre les ombres plus sombres, vous pouvez aller ici ou peut-être quelque chose comme ça. Donc, ici, nous avons notre image. Maintenant, nous allons aller dans le dossier d'autres sources et obtenir notre logo Maintenant. En fait, ce que j'ai fait, c'est que j'ai créé ce logo à l'intérieur de la stigmatisation hap et je ne recommande pas vraiment je ne recommande jamais la devise de fig. Créez un logo. Donc, ce qui se passe est quand j'essaie de l'exporter en utilisant SVG formulaire. Il me donne un logo très dévié. Maintenant, vous pouvez voir que je l'ai exporté en utilisant des agriculteurs de PNG ici et exporté ce logo. Et nous allons faire glisser ce logo PNG parce que s qui ne fonctionne pas. Je ne suis pas sûr de ce qui se passe, alors nous avons notre dossier. Alors traînons ça ici comme ça. Donc, nous allons placer notre logo comme ça ici, et ensuite nous allons placer notre texte ici, qui waas livre de recettes saines. Maintenant, nous allons prendre notre outil de texte et notre fiduciaire, et nous allons juste ici. Livre de recettes saines, et vous pouvez utiliser Roberta pour deux. Mais nous avons utilisé Yeah, forme Monta. C' est en fait un téléphone Google est libre, et nous allons utiliser 18 existent ici pour celui-ci. Et, euh, espacement des lettres va être de 5%. Et, euh, je pense que c'est tout ce que nous allons l'aligner au milieu de ça un peu sur la gauche et la couleur sera la prochaine utilisation sauf une période similaire de sept ans. Il a gagné 88. Donc, c'est en fait une grande couleur bleue. Vous pouvez voir vos cheveux et je ne veux pas que l'utilisateur soit très attentif à cela. Alors, ici. Donc c'est notre logo. Et c'est notre prochaine ligne ou peu importe ce que vous appelez ça. Ok, donc nous l'avons. Ensuite, nous allons créer deux boutons qui vont être connectés avec Facebook et se connecter avec Google. Alors obtenez et utilisez ces couleurs Google et Facebook. Vous pouvez aller à ce site Web couleur de départ net, et vous pouvez trouver les couleurs de Google, par exemple. Vous pouvez taper Google ici, et c'est la couleur rouge que Google utilise de sorte que vous pouvez copier il a pris presse-papiers, et vous pouvez utiliser la même couleur ou ici. Nous allons donc créer un rectangle, et nous allons utiliser des couleurs bleues pour Google, un habitué pour Google et Blucher pour Facebook, celui-ci. Donc, il suffit de saisir ces valeurs ici et nous allons créer des boutons, saisir un rectangle et la taille de charge que je vais utiliser est 304 est la troisième fois. 48. Brésil est la hauteur, alors nous allons utiliser 304 et 48 est la hauteur. Ensuite, l'aligner au milieu, ou vous pouvez utiliser celui-ci sont nos options démangeaisons. Donc, c'est en fait la touche de raccourci. Et je vais utiliser la couleur Facebook, qui va être copié à partir d'ici et juste basé il était ici comme ça. Entrez. Donc, nous avons notre bouton Facebook. Ensuite, utilisez un coins arrondis au large de quatre sorties autour de Ness par ici. Donc, ce sera notre bouton, et nous allons faire glisser et déposer notre icône Facebook, que nous avons déjà à l'intérieur d'une ressource est icônes. Et ça va être Facebook avec Facebook Facebook, Celui-ci. Alors voici le Facebook. On va le glisser et le déposer ici comme ça qui bouge à l'intérieur. Ce qui n'est pas soigné, ça va pas cher. Donc, nous avons vraiment besoin de ça. On n'a pas besoin de celui-là. Et aussi mars si g un groupe. Donc c'est notre Facebook. Oh, cool. Donc on va le colorer en blanc, ou on peut utiliser un grand blanc bleuté ici. Quelque chose comme ça. Cela peut fonctionner aussi. Donc, la taxe que nous allons utiliser est de se connecter à Facebook. Ils reflètent cela notre option V travailler rapidement. Alignez-le. Ou vous pouvez utiliser cette option B et encore une fois, la couleur. On va utiliser cette même couleur. Donc on va l'ajouter dans nos Oops. Ce qui se passait a ajouté à d'autres styles. Je vais orteil plus bleu, euh, blanc, euh, bleu. Excusez ça. Et à cette couleur, aussi. On va le nommer Facebook. Oui, de la fumée. Donc, pour obtenir le même blanc, nous allons utiliser des styles ici, comme cette couleur. Alors connectez-vous avec Facebook et le texte sera Rubik. Donc quatre boutons, j'utilise un vrai gros téléphone. Arabe est aussi Google pour bien, bons poings. Et comme vous pouvez le voir, c'est une police un peu plus grande. Donc nous allons utiliser un peu plus petit comme ça, et nous allons utiliser 2% ou cheveux et nous allons utiliser l'affaire, Toby, Toby, toutes les lacunes comme ça. Encore une fois, nous allons l'aligner au milieu parce qu'il est en train de sortir. Non, nous pouvons aligner ces côtés sur le fardeau. Donc, nous allons avoir un écart. 20 quatre par ici, à gauche. Faisons un 24 étaient là, orteil. Donc c'est ton début. Une guerre ici. Donc, nous avons sur la Grande-Bretagne. Vous pouvez vous voir ici. Choisissons ceci. Tout ça. Nous allons d'abord grouper cette commande de contrôle G. Donc nous avons que vous pouvez voir. Non, c'est un peu mieux parce que nous avons nos antécédents séparés. Maintenant, vous pouvez voir les yeux masqués ici. Donc nous avons tout ça à l'extérieur de la mosquée. Donc c'est notre logo. Alors nous allons regrouper ces notre groupe de logo scald eux. C' est notre arrière-plan pour le bouton BG Burton médian. Et tout cela est lié avec le bouton Facebook vidi dans Facebook comme ça, il est toujours mieux. Tu arrêtes tout comme ça. Donc, une fois que nous aurons ça, nous allons appuyer sur le contrôle. Commande d sont nous pouvons créer un composant ou ici afin que vous puissiez faire quelque chose comme ça. Donc, en ce moment, je ne vais pas orteil créer un composant. Je vais orteil juste le dupliquer et répliqué et juste avoir un autre fardeau ici comme ça . Et, hum, faisons glisser l'icône Google ici. Oui, on l'a. Allons traîner ici. Même couleur blanche, couleurs locales. Et c'est la falaise blanche que nous allons utiliser. Oups. Alors ? Alors déplacons-le avec le clavier. J' appuie sur les touches Maj et fléchées pour le déplacer, parce que de ma souris, ce n'était pas difficile, facilement capable de crabe. Supprimons donc ce groupe. En fait, c'est bon, donc c'est bien. Ok, alors chantons la couleur de l'orteil. même blanc ici et la galerie Bagram sera le tueur de Google. Donc, nous allons aller par ici et trouver la couleur rouge de Google. Ça va être le tueur de Google et moins que ce n'est fait, ajouté et jean la couleur de l'écolière tueur. Et maintenant, nous allons ajouter cette couleur Google à notre boutique de style. Donc, nous allons ajouter le style créé correct de Google. Donc nous avons nos deux boutons. Une autre chose est, si vous voulez ajouter des ombres, vous pouvez ajouter un magasin de faits, donc je vais ajouter une ombre portée très subtile ici pour flouter. Utilisons le sang, et je vais l'avoir trop exulte comme ça, et ça va être presque 15% ombre très, très subtile. Donc, une fois que nous avons cette ombre, nous pouvons également effacer un effet appelé un style de fait. Et on va l'appeler Burton Shadow. Tellement certain. Donc maintenant, nous allons sélectionner son arrière-plan ici, et nous allons appliquer le même effet que tout. Donc, euh, donc je pense que vous appréciez ça. Et, euh, vous serez vraiment surpris par les fonctionnalités de Sigma Let's et la dernière ligne ici, qui est Let's browse. Non. Ou vous pouvez également le renommer pour ignorer la connexion quelque chose comme ça ne sont pas démangeaisons. Déplaçons avec les touches Maj et fléchées et vous pouvez également le déplacer. Un cochon par les touches fléchées comme ce seul pixel et je vais orteil faire. Appuyons sur votre cadeau. Maintenez votre touche de tibia AR drop, et vous pouvez voir que vous avez sélectionné celui-ci. Et si vous faites glisser et um, sur votre et autre objet, ça vous montrera la distance entre ces 2 27 que je voulais Toby. Allons, hum, utilisé 20. Je pense que c'est que c'est bon qui est facilement définissable, donc vous pouvez aussi avoir les orteils penser à des choses. Par exemple, ce sera l'idée d'onglet pour celui-ci. Et ça va au DAP ici pour celui-là. Ce sera l'idée d'onglet ou la section pour celui-ci. Ils ont donc de bonnes marges entre eux. Bonne distance entre eux. Ainsi, l'utilisateur peut facilement rapidement. Donc, la couleur pour ce journal de saut et sera H S B. La couleur est 1 78 qui est le vert. Vous, notre principale couleur primaire 73 est la saturation et la luminosité est de 19%. Il s'agit de la couleur pour ignorer le journal. Et c'est en fait notre major. Vous pouvez voir la couleur, qui est nos jambes. Futons l'université vert foncé. C' est notre couleur vert foncé, très noirâtre l'utilisaient pour le texte qui sont très sombre et surtout pour les liens couleur. Donc, cela va être lié. C' est aussi la même couleur pour ce logo. Les slogans ne sont pas noirs. Il est vert très foncé, lequel est celui-ci ? Ignorer sauter long et donc la distance entre ces deux boutons est de 12 12 pixels. Vous pouvez ajouter la distance si vous le souhaitez. Si vous vouliez être plus spacieux. Vous pouvez l'ajouter pour être comme 16 comme ça. Et vous pouvez également ajouter un peu plus de distance ici 24 ou quelque chose comme ça. Mais je pense que je l'aime comme si ce 12 était assez bon pour moi. Et 20, c'est assez bon pour moi. C' est ainsi que vous créez et gardez sur les Juifs. Problèmes de capacité hors Absolved parce que ces trois Mais comme ils sont plus bas dans ce domaine nos cheveux votre Tom pur vous système peut facilement atteindre cette zone. Maintenant, si vous le souhaitez, vous avez terminé l'écran. Alors faisons un zoom arrière. C' est très nécessaire. Chaque fois que vous créez quelque chose, je fais toujours un zoom arrière et je vois ça si je veux. Nous sommes juste un espacement sont des éléments que je veux déplacer. Vous pouvez voir qu'ils n'étaient pas dans les centres où je les ai déplacés au centre un peu par ici. Il a l'air superbe. Voyons ça dans un prototype ici. Donc, j'ai déménagé à ce prototype iPhone 11 prouver modèle. Je vais utiliser l'écran de l'espace et, euh, a expliqué que c'est la seule chose que je n'aime pas à propos de Fig pourrait prendre un certain temps parce que c'est une application cloud. Cela prend un certain temps si vos images sont très grandes et il faut un certain temps pour les Seigneur comme ceci. Donc, ça a l'air bien. Je pense que j'ai le problème avec le Chili ici. Vous pouvez ajuster l'image. Quoi ? Cependant, vous avez averti. Donc, nous allons rapidement juste l'image et nous allons la rendre un peu plus grand comme ça. Ok, donc c'est parfait pour moi. Cela semble parfait pour zoomer sur l'ajustement. Et je pense que ça va finir cette leçon. Si nous avons un problème ou quoi que ce soit qui n'a pas l'air génial. Par exemple, vous pouvez voir dans l'image ici arrière-plan. Il y a quelque chose par ici. Donc, le truc simple est que si vous voulez supprimer quelque chose, je vais utiliser une ellipse ici comme ça. J' ai déménagé à la conception, et je vais utiliser le même sélecteur de couleur de couleur, et je vais utiliser la même couleur que cette zone ici pour que vous puissiez la voir ici. Maintenant, je vais déplacer ce lot ici comme ça, et déplacons-le juste au-dessus de ce fond, et à la place je pense que je peux voir une partie de l'ombre ici. Allons zoomer. Oups, on dirait ça. Et rendons ça plus grand comme ça. Donc maintenant, vous pouvez voir qu'il n'est pas très visible de loin. Vous ne pouvez pas deviner qu'il y a quelque chose d'utilisé ici, donc c'est juste le plus à l'intérieur de vos arrière-plans. Ça a l'air bien. Ce sont donc des trucs simples que vous pouvez apprendre quand quelqu'un est en train de concevoir. J' espère que vous avez apprécié cette leçon. Si vous avez des questions ou si vous n'avez rien tendu, vous pouvez me le demander. Passons à la leçon suivante. 41. Écran à l'à l'à - à la: maintenant, la première chose que nous allons faire est que nous allons convertir ce composant bouton toe parce que nous allons utiliser ce bouton avec sur Icône. Alors faisons ça. Nous allons donc sélectionner ce groupe. C' est notre fardeau Facebook de Burton. Et cliquez sur ceci et cela va être un composant. Il s'agit d'un composant maître. Donc nous ne voulons pas d'Overwatch, composant Master. Toby, À l'intérieur de cette conception, nous voulons avoir sur les instances ou ici, afin de commander ou de contrôler les données en double afin que vous puissiez voir que nous en avons un autre. Sélectionnez donc cette hache principale Command de contrôle des composants, et nous allons la déplacer vers notre guide de style. Donc, si vous n'avez pas créé de cadre ici, appuyez simplement sur f ou a et nous allons obtenir un cadre et le baser ici comme ceci. Donc, ici, nous avons notre semblant. Maintenant, prenons quelques réglages ici. Donc ce texte, j'ai double-clic pour l'obtenir. Ça va être, euh, euh, coller les orteils de ce côté droit et en bas par ici, ou vous pouvez l'avoir à droite et en bas. Ce sera un autre paramètre, donc il aura toujours le même espace ici comme ça. De même, pour cette icône Facebook allaient orteils ont déclenché à gauche et à droite. Donc, il va maintenir le même espacement gauche et inférieur si nous essayons de l'augmenter. Donc, si nous essayons d'augmenter ce fardeau, vous pouvez voir si j'essaie de l'augmenter ici. Le logo Facebook colle à cette gauche. Donc, ce sera le comportement de ce bouton. C' est donc notre composante. Si nous voulons le changer plus tard, nous pouvons le changer en composant maître. Donc ça va être notre bouton avec, hum, icône bouton. Appelons ça le bouton avec Icahn. Donc ça va être notre bouton avec l'icône. Ok, alors revenons au design principal et laissons-le. Parce qu'en fait, je pense que nous devrions aussi utiliser le même composant ici, mais maintenant nous allons le laisser parce que cela a basé beaucoup de temps. Donc, une fois que vous avez créé le composant, il suffit de changer la couleur et de changer le logo ici. J' appelle ici et tu auras quelque chose comme ça. Alors plongons. Répliquez ceci et nous allons orteil appuyez sur notre touche d'option et avec je vais appuyer sur la touche Maj pour créer un autre écran comme celui-ci. Maintenant, je vais orteil supprimer cette image ici à l'arrière-plan espoirs. Donc ça va être Renommer ça d'abord. Donc, il va être notre moyen moyen moyen écran de repas Donc cela va être fait écran des moyens. Alors faisons ça et ouvrons celui-ci et on va enlever les orteils. Cette ellipse cette image ici c'est bon. Enlevez cette mosquée en bas ici et partons en groupe G Ian ceci et ça vaêtre enlevé ici. Enlevez cette mosquée en bas ici et partons en groupe G Ian ceci et ça vaêtre enlevé ici. Enlevez cette mosquée en bas ici et partons en groupe G Ian ceci et ça va Ce sera une grande, plus petite et 30 % d'opacité, et nous allons le rendre un peu plus petit. J' ai verrouillé ces proportions ex. Faisons 20 24 32. Celle-ci a l'air bien. Ça va être quelque part par ici. Donc, ce fond va en fait être cette couleur e d. F. Trois f quatre. Donc ça va être notre couleur de fond majeure qui va contenir partout sur l'écran Donc ça va être notre couleur. Donc, vous pouvez voir que c'est très beau sur ce fond. Si nous voulons augmenter l'opacité, utilisons 40% ici comme ça. Donc ce logo va être minimisé ici sur cet écran. Laissons-le comme ça. Nous allons apporter des icônes avant ça. On va les enlever ou ici comme ça. Donc nous avons cet espace vide ou ici, nous allons ramener nos icônes d'Adul. Et ici, nous avons l'icône du filtre que nous avons une telle bouteille ici. Toutes ces choses vont être ici, alors commençons. Et voici notre flèche à gauche. C' est en fait 24 x 24 pixels, donc vous pouvez voir ce que les cheveux 24 sont la taille, et mettons-les ici et alignons-les comme ça. Ensuite, nous avons notre cône sec ou l'icône de l'entonnoir par ici. On va prendre et déposer tout ça ici comme ça. Cela va aussi être 24 cela va être aligné avec discret. Donc, vous pouvez voir que c'est la valeur hors grille. Nous avons cette mise en page créer quatre colonnes et alignaient les choses selon cela. Ensuite, déplacez-le au milieu. Écrit à droite sur la gauche était il est un peu déséquilibré. Élément de conception plus ici. Donc, une fois que nous l'aurons, nous allons utiliser un poids plein ici pour créer notre tel bar. C' est un va être notre groupe de recherche va être 48 pixels de haut. Et, hum, ça va être 300 39. C' est sexuellement l'avant et la couleur va être blanche, et nous allons utiliser le même rayon quatre pour celui-ci. Alors maintenant, on va faire une ligne. Je pense que celui-là est aligné sur les cheveux. Celui-ci était un peu là-haut. La couleur de ces icônes. Laissez-moi d'abord la couleur de Heidi pour ces icônes Waas, vert moyen, qui est notre, euh nous allons utiliser cette couleur. 43615 e. Ceci est notre couleur vert moyen. Alors ajoutons cette couleur 12 un guide de style. C' est la crème de l'escouade moyenne. Oups. Je crois que je les ai tous sélectionnés. Nous allons donc en sélectionner un. Sélectionnez cette couleur espoirs espoirs. Maintenant, on va avoir un vert moyen pour que tu puisses voir parfois tout le monde moi sauf nous. C' est notre vert moyen. C' est, euh OK, donc c'est notre logo. C' est notre barre de recherche ici. Nous pouvons également ajouter un effet de course autour d'elle. Ça va être, euh, euh, tueurs locaux, Lex utilise de la décoloration. Et nous allons réduire l'opacité à 15% comme ça, donc vous pouvez voir que nous avons une ligne très faible. Ou ici, nous allons zoomer et vous montrer ce que cet effet fait réellement. Donc, vous pouvez voir que c'est en fait ce qui se passe ici. Alors nous allons aligner ça. Remettez ces lignes ici comme ça, et ça va être notre tel bar. Utilisons un peu taxer vos cheveux. D um, telle ressie B espère recette comme ça. Ce ne sera pas toutes les majuscules, donc il sera tel qu'il est tapé. Est-ce que ce cas est en fait une telle recette comme ça ? Ça va te croire gros régulier. 16 porcs, 2%. Donc, ce sera en fait notre texte. Donc, hum, changeons la couleur de l'orteil quelque chose d'autre parce que ce ne sera pas très, euh, brillant ou ici, peut-être quelque chose comme ça. Donc vous pouvez voir que j'utilise la même couleur. Il suffit de changer des Hughes ou des choses comme ça. Nous sommes juste à mon goût ici, mais il doit être visible pour l'utilisateur. Nous allons donc créer un textile. Maintenant, c'est en fait notre vrai Bic 16. Et avec ça, je vais utiliser son but. Donc c'est en fait notre, hum, action de bouton suivante. Donc c'est, euh vous pouvez le voir pour que je puisse facilement le mémoriser. Que cela va être taxé pour les boutons est le même texte que nous avons utilisé ici pour ces boutons. Ils étaient ici et aussi pour ça ici. Ce sera donc nos dettes fiscales. , , Jane ,ce style et l'utiliser comme il est type. Donc ça va être un peu mieux pour moi comme ça. Maintenant, nous allons ajouter une telle icône ici. Donc obtenir j'étais une telle icône est mon icône de recherche, celui-ci. Donc juste craber et glisser et déposer ici comme ça, comme ça. Il suffit de changer la couleur que celui-là. Et, euh, excusez celui-là pour qu'on ne veuille pas que toutes les couleurs aient la même attention. Donc nous allons utiliser, euh, vous pouvez dire que ça va être haut. Cette couleur et cette décoloration sont les mêmes. Alors passons à autre chose. Vous permet de la même couleur que cette barre. Donc je vais sélectionner et c'est comme la même couleur ici comme ça. Je pense que nous avons choisi la couleur Hong de toute façon. Donc c'est le Selectric d'ici. Ça a l'air bien. Ajoutons cette couleur. Grand vert. Appelons ça grand vert pour que Zo Motor et voir ce qui se passe. air bien. Je peux aussi le faire un peu ennuyer. mordre plus ou plus grisâtre. Peut-être comme ça. J' aime mieux cette couleur et appelons ça génial. Je vais également utiliser le même gris ici pour que le commutateur pour dissimuler cela soit mieux car il est bleu, vert et vert. Tout avait l'air vert, donc je l'ai fait comme ça. Maintenant, ces questions sont terminées, nous pouvons facilement les regrouper, donc nous allons les sélectionner tous et commander et contrôler G pour regrouper cette partie et pourquoi nous faisons cela Parce que nous pouvons facilement créer un composant hors de lui. Donc, cela va être espacé à 13 pixels d'ici. Alors faisons-le 14 15 16. Et de même, nous avons celui-là. C' est aussi 16 de ce côté gauche. Donc, j'utilise la touche d'option art pour moi dans la distance, comme vous pouvez voir ou entendre 16 sur la gauche. De même, nous avons celui-ci. Vous pouvez ouvrir ce groupe et nous avons ce vecteur à l'intérieur. Nous allons le supprimer parce que nous ne voulons pas compliquer une icône compliquée. Donc je l'aime mieux comme ça. C' est donc notre icône. Appelons ça l'icône. C' est notre barre de recherche. C' est nos mégots de fond pour un tel bar. Et pour cette barre entière, nous allons créer un composant. Donc commande ou contrôle R K Option K. Et ceci est notre composant. Même chose. Nous allons faire le contrôle de commande pour le répliquer, et nous allons couper ça et le déplacer dans notre guide de style ici. Donc c'est notre bar, donc vous pouvez voir non, nous construisons notre guide de style. Alors Oups. Donc, une fois que nous avons créé ceci, nous allons revenir à la conception principale et nous allons créer cette navigation ou cette tête. C' est la navigation que nous allons créer. Maintenant, on va aller aux pieds, on a un texto De et on va utiliser Mees. Le texte sera Il ne sera pas Rubik. Détachons ceci et nous allons orteils utiliser jeune mien de et pour 16 porcs est 5% et je vais utiliser l'alignement du milieu. Cela va aider quand nous l'alignons et ce sera vita ensuite, et le contexte derrière ce sera le suivant. Nous sommes là, donc je vais utiliser, um 64 pixels de large et 32 pixels de haut. Et nous allons utiliser la frontière Kanakaredes avant que vous puissiez voir les repas est derrière ce rectangle. Donc, on va le déplacer vers le haut et le relâcher sur eux. Vous les déplacez au milieu comme ça, donc ça se sent élevé. Donc je déménage le rectangle de la ville semble un peu plus petit, donc je vais le rendre un peu plus grand. Tout le bord, nous l'sommes. Ok, donc on a ça prêt alors changeons la couleur de l'orteil ce Phil, qui va être notre couleur verte primaire, qui est une couleur plus nette pour celui-là. Donc, en fait, notre couleur verte primaire est zéro e 5956 Donc c'est notre couleur reine primaire, donc vous pouvez voir que c'est très net. C' est très vivant ou vivant Lee, peu importe ce que vous appelez ça, c'est une belle couleur. Donc nous allons regrouper ça ensemble, et nous allons le déplacer ici moins utiliser nos lignes directrices pour aligner le quatrième quart de contrôle des meurtres . Et je pense qu'il y avait un contrôle. Je ne suis pas sûr de quel était le raccourci pour Mac, mais je vais lister vers le bas. Donc ici, nous l'avons comme ça. Maintenant, vous pouvez voir que c'est notre groupe Mies. Ok, donc ce fond va être mobile. Donc nous allons orteils, retirez-le en dehors de ça. Alors déplacons-le vers le haut. Et ce contexte est que vous pouvez voir que c'est en dehors de ce groupe signifie donc nous avons des moyens actifs, regardé dans un come on d et cela va être notre rue inactive. Donc en bas, nous aurons Stoute inactif, donc le tueur inactif sur le texte sera, euh, celui-là. Ok, c'est en fait notre couleur verte moyenne pour 3615 Alors laissez-moi vous montrer ce que je veux dire par inactif. Donc, cachons cet actif et cachons cet arrière-plan. Vous pouvez voir que c'est notre état inactif. Maintenant, nous allons juste reproduire ça. On a cette surcharge, l'état actif et le cou si on veut se cacher et, hum, hum, il y a leur permettre de mieux. Oups. Ok, donc on va le répliquer. Utilisons d'abord quelque chose comme, Oups. Donc nous allons assouplir ces repas et toutes les options. Faisons-le glisser comme ça. Notre distance, comme 33 ans. 32. Oh, ici. Et on va appuyer sur les orteils. Allez, Control de. Pour répliquer cela comme ça, sorte que vous pouvez voir qu'il utilise réellement le même espace pour le répliquer comme ça. Donc d'abord, on va le renommer. Maintenant, ça va être Sellards et aussi pour cet état inactif. Il a commencé celui-là. Donc juste le temps de remplacer le texte, alors nous allons les aligner à nouveau. Way ont créé tous ces et ont été renommés, euh, contrôle pratique ou commande sont salade. Diffusez-le. Il s'agit d'une touche de raccourci. Maintenant, nous allons le déplacer en dehors de cette toile parce que nous voulons avoir une bonne distance entre eux. Donc maintenant, je vais utiliser distribuer l'espacement horizontal comme ceci afin que nous puissions avoir un menu comme celui-ci. Déplaçons un peu. Ici, il a l'air trop large. Donc c'est comme ça 40 ans. Donc je vais avoir une distance de 40 entre eux. 56 quelque chose comme ça. Déplaçons un peu. Ou ici 26 26. Et nous voulons vraiment à mon unité d'ici. 123 123 et sur trois. Donc ils ont tous la distance de 30 six à l'intérieur d'eux. Donc maintenant, si nous voulons changer l'arrière-plan simplement nous devons faire est que nous devons cacher l' actif ragoût que sur l'état inactif et déplacer l'arrière-plan vers celui-ci comme celui-ci. Et comme votre salade, nous allons utiliser l'état actif et cacher l'état inactif. Donc c'est comme ça que nous allons le déplacer et n'importe quel nain autour de l'idée d'Ugarte. Donc, dans la leçon suivante, nous allons préparer le reste de la chose parce que ça devient très long. Je ne veux pas que cela soit vraiment ennuyeux, alors passons à la leçon suivante et créons le reste hors de l'écran. 42. Écran à l'à l'à à l'à à l: dans cette leçon. Nous allons créer la navigation en bas qui va être en bas de cette application ici à ceci ou ici parce que nous voulons avoir la navigation en premier. Ensuite, nous allons créer le contenu à l'intérieur. Donc, pour ce faire, nous allons utiliser un rectangle ici. Ce sera un rectangle pour la navigation et ce sera votre blanc. Maintenant, vous pouvez voir pourquoi j'utilise le blanc car il aura un certain contraste sur ce fond. Ce fond n'est pas blanc pur. Il a une couleur verdâtre et vous finir dedans. Donc une fois que nous aurons ça, nous allons utiliser un fax ici pour avoir une ombre portée piège. Mais cette fois, l'ombre portée sera du côté opposé. Donc nous allons utiliser moins pour, genre, genre, ce sang va être six comme ça et nous allons utiliser 10% quelque chose comme cette ombre très subtile. Et vous pouvez également avoir une ombre de la même couleur. Ce qui va être ça. Utilisons cette couleur de fond et nous allons l'amplifier comme ça ici. Donc, c'est la couleur d'arrière-plan utilisé. Et c'est, hum, 100%. Donc, vous allez utiliser 15%. Utilisons 20% comme ça. Zoom avant suivant. Et, euh, où sont ceux-là ? En fait, ça va être tes cheveux. Ok, donc voici notre navigation en bas. Zoom arrière sur Hyde. Le Kruger est comme ça. Donc ça va être notre navigation en bas. Il est en fait 60 photos de ce qui devrait être 60 pixels. C' est pour cela que cela se produisait. Alors décalez notre Non, en fait, ce waas correct. Maintenant, il regarde lire. Quoi qu'il en soit, je suis très grand Zil Perfect. Alors j'essaie d'être aussi parfait que possible. Maintenant, nous allons attraper, et ce sera notre PG de navigation, donc ce sera statique. Donc, nous allons glisser et déposer toutes nos icônes dans leurs états. Donc, cela va être notre maison sur moi et icône pour le premier élément de navigation Accueil espoirs. Donc on en a un plus grand par ici. C' est 20 sur 21. C' est 28 sur 30. Donc on va utiliser 21 par 20. Alors excusez 21 cheveux afin que vous puissiez voir ou entendre zoom avant parce que nous voulons être déjà parfait ici . C' est notre maison vide. Normal. Et ça va être actif à la maison comme ça. Alors ressentez-vous la différence ? Quelque chose qui bouge ? Non. Donc c'est parfait. Donc, nous allons aller à ce vecteur et changer la couleur du trait. Remotez ce vert parce que ce sera notre couleur normale. Et cela va être notre couleur active, donc active sera effectivement découverte. Cela signifie s'effondrer. Ajoutons orteil discolor sur les styles aussi. Donc c'est notre crème primaire. C' est notre vert primaire. Si vous voulez les arranger, vous allez les joindre. Laisse-moi te montrer. Mais pour l'instant, c'est OK. Alors cliquez dehors ici. Être primaire Nous allons le monter comme ça. Et vert moyen et grand gris vert, blanc Facebook, vert foncé sera au sommet comme ça. Ça a l'air mieux. Et maintenant, je vais sélectionner mon tableau d'art. Ça va être ma maison active, et je vais utiliser cette couleur. Ouais, donc maintenant je suis dans cette étape, je vais cacher l'état normal. Ça va être actif à la maison et on va les déménager tous les deux à l'intérieur. Maintenant, nous allons l'aligner au milieu de ça ici, et nous allons faire la même chose pour toutes les autres icônes. Vous pouvez avoir l'idée qu'à l'intérieur de la maison nous devons escaliers à la maison, la maison active normale. Ils doivent être de la même taille. Donc, si vous masquez ou affichez l'un et l'autre, ils ne doivent pas scintiller ou changer de taille, de forme ou de position. Donc c'est en fait la méchante. Vous pouvez voir le point vers le nord ici. Donc, une fois que nous serons à la maison, je vais aller aux pieds, accélérer et je vais amener deux autres icônes ici rapidement. - Maintenant, on va aligner ça. Nous avons donc ces trois éléments de navigation et nous allons les aligner. Donc d'abord, nous allons tous les sélectionner. Je tiens la clé de commande du contrôleur, et on va utiliser ça bien rangé. Donc, ça a l'air bien. Donc ça arrangera ça au milieu, et maintenant on va changer les escaliers. Donc, ça réglemente les escaliers inactifs si actifs que nous allons nous cacher comme ça. Donc nous avons trois escaliers par ici. Maintenant, si vous voulez avoir une approche mawr, hum, hum,de réinscription, vous pouvez également utiliser cette opacité ici pour que nous puissions avoir quelque chose comme 80% sur 90% comme ça . Et nous pouvons aussi avoir quelque chose comme ça ici. 90% sur ce est un peu plus petit. Donc, cette maison, nous allons augmenter sa taille sélectionne l'utilisation, déplacer comme ça. Ça a l'air beaucoup mieux, parce que je cause qu'on a l'air plus grand. Et celui-ci avait l'air un peu plus petit. Alors maintenant essayons de les aligner comme ça. Alors Oups. Alors nous allons les aligner en bas. C' est ça qui ont l'air bien, euh, 19 en haut. Donc nous allons avoir 18 et 18 ans. Déplaçons-les un peu plus comme ça. Donc, ça a l'air super. Gardions 13. Ok, donc notre menu de navigation en bas est complet. Nous pouvons Vous pouvez voir que nous avons un état inactif et nous avons un état actif. L' état actif est un vert vif, très pointu, bleu verdâtre et inactif est un peu vert terne, qui est dans notre schéma de couleurs. Il est appelé couleur verte moyenne. Ainsi, vous pouvez également ajouter le poids du trait de votre s, qui est des icônes comme celle-ci. Si vous voulez avoir une icône très mince, icônes comme ça, par exemple, je veux avoir un pixel. Mais comme ça, ou peut-être 1.5, c'est mieux. 1.5 semble bien. Hum, donc je pense que notre navigation en bas est terminée. Nous pouvons facilement le changer et le commander. Et une autre chose est que vous pouvez aussi effacer Ah, un composant pour celui-ci. Donc, commande G et c'est notre fond. Je l'ai fait. Et, euh c'est exact. Cliquez sur et créez un composant. Il y a plusieurs façons de créer un composant et nous allons le répliquer et contrôler et commander E et contrôler la commande X pour copier celui-ci, et nous allons le déplacer dans ce cadre. Donc aussi, vous pouvez changer l'arrière-plan de la couleur du cadre pour être comme, Oups. Donc, nous allons changer le cadre, la couleur, l' arrière-plan, arrière-plan, sentir la couleur pour être quelque chose comme génial. Ainsi, nous pouvons facilement voir d'autres composants en plus. Donc c'est notre vous pouvez dire méchant Ah, vous pouvez dire des navigations. Nos objets moyens qui vont être présents sur chaque écran, comme une telle barre, notre logo est retour à l'écran, et ensuite nous avons celui-ci. Alors maintenant, dans la leçon suivante, nous allons créer le contenu intermédiaire, les images et tout ça, alors passons à l'écoute suivante. 43. Écran à l'à l'à à l'à à l: dans cette vidéo, nous allons créer cette recette en vedette à partir de notre application et commençons. Nous allons orteils utiliser un reprendre orteil notre ajustement. Et maintenant, nous allons aux pieds. Créez un rectangle ici et créons un rectangle et ce sera la taille de cette barre ici. Donc, il sera 3 39 et la hauteur sera 216. Donc d'abord, nous avons ceci. Utilisons le rayon de bordure de quatre et ce sera en fait le conteneur de l' image. Donc, ça va vraiment masquer beaucoup de choses. Donc ça va être plus notre conteneur de mosquée. Alors attrapons l'image et faites-la glisser ici. Donc nous allons aller à nos images, et, euh, euh, l'image que nous allons utiliser est celle-là ou celle-là. Alors traînons et dépose-le au-dessus de celui-ci pour qu'il y ait quelque chose comme ça, comme, achète les deux, et utilise la mosquée. Et laissons cette image à l'intérieur de ce zoom arrière massif. C' est donc la limite de l'image. On va tenir Shift un orteil clé d'option. Déplacez-le là où nous aimerions l'avoir comme ça. Ok, donc ça a l'air marqué. Non. Nous avons créé cette boîte principale ici. Maintenant, nous allons avoir un effet excessif sur cette image parce que nous voulons mettre du texte ici. Donc ce que nous allons faire, c'est que nous allons créer un angle indirect en haut de cette image, la même taille de l'image d'une tête, et nous allons déplacer ce rectangle. Vous pouvez voir que c'est le rectangle, et nous allons le déplacer à l'intérieur de ce groupe masqué et l'appeler trop. Donc, une fois que nous aurons surcouche, nous allons utiliser une insuline Grady linéaire, votre ingrédient. Et si nous devons utiliser le vital ici et le noir ici, Ok, donc nous allons avoir quelque chose comme ça, et nous allons changer la direction un peu comme ça, comme ça, et nous allons à utiliser multiplier ici afin que vous puissiez voir cela regarder un grand fait. Donc, euh, le truc des hommes, c'est qu'on peut aussi changer où on veut qu'il soit. Par exemple, je veux que cette couleur blanche soit ici comme ça, et je veux ajouter un peu un peu crée de la couleur ici comme ça, et cela ressemble beaucoup. Donc, ce sera notre superposition, ce qui va nous aider à avoir un texte à ce sujet dans cette section ici. Donc c'est notre groupe de masse parce que tout sera à l'intérieur de ça. Donc, nous allons continuer à ajouter des choses dans ce groupe de mosquées. Maintenant, nous allons créer une forme simple ici, qui sera notre étiquette de recette en vedette ici, sorte que vous pouvez voir qu'il s'agit de notre forme de facteur de forme. On va les orteils, la colorer orange. Et la valeur de cette couleur orange est e un développement 93. Donc c'est en fait mon second régulier primaire. C' est de couleur orange, et nous allons l'ajouter dans le remplissage. Donc, nous allons d'abord ajouter dans d'autres styles malade, orange en colère. C' est notre deuxième orange. Donc, nous allons l'enlever et ajouté dans le remplissage ici cette couleur. Donc nous avons cette barre, et si nous voulons augmenter la hauteur, nous pouvons utiliser 20 ans ou ici comme ça, nous pouvons aussi le raccourcir et le déplacer comme ça. Appelons ça Dag et nous allons zoomer et mettre notre texte au-dessus. D va être présenté comme ça. Et ce sera l'agent Romanoff. Pas vrai. Grand Yantra. Man Assez va avoir 14 ans. Ce sera de 10 p. 100 parce que nous voulons beaucoup d'espace dans cette section ou ici. Et bougeons-le comme ça. Faisons 24. Et la prochaine utilisation du blanc, qui sera ce blanc, ce blanc bleuté ici et la prochaine utilisation, hum, 12 oeufs d'ici. Donc je voulais être aligné dans la même zone comme ça. Alors utilisons nos dirigeants. Cette taxe, ce texte doit être une ligne avec le même mensonge presque ici. Ou peut-être par ici comme ça. Gardions les moyens ici parce que c'est un bouton, donc on n'a pas besoin d'orteil. Sois très inquiet à ce sujet. Ce n'est que du texte. Donc on va l'aligner comme ça. Ok, alors c'est la prochaine fois que Di le fait ? Ce sera un vrai Big 24 2% blanc. Voyons quelle est la distance par rapport au dessous 7 12 Aussi pour ce contrôle en vedette, Camargue E. Et nous allons le rapprocher de celui-ci parce que c'est un élément de texte. On ne veut pas s'inquiéter à ce sujet. Il est très proche du fond. Ensuite, nous avons 317 cheveux textuels, ce qui va être, euh, vous pouvez utiliser votre gros orteil 14 317. Cela va être à nouveau blanc, et nous allons utiliser l'icône sur l'amour par ici. Et, euh, voyons. Où est-il ? C' est celui-là. On va utiliser une version plus petite 16 porcs Ilves parce qu'on ne veut pas qu'elle soit très grosse qu'elle soit blanche ici. Donc je pense que dans mon vrai designer utilisé gentleman d'ici comme ça. Donc, cela regarde je pense que cela semble bon, mais vous pouvez aussi utiliser à travers gros orteil. Rebic taxé me cherche mieux. Euh, celui-là est en allemand de régulier. Vous pouvez également utiliser le moyen si vous le souhaitez. Oh, ceci va regarder en arrière écrire maintenant Voici un plongeon de design Si vous avez un article qui est plus petit et un plus grand et qu'ils sont sur la même ligne, vous devez aligner le fond d'eux afin que vous puissiez voir que nous allons utiliser le alignement en bas comme ça. Mais vous pouvez voir maintenant qu'ils regardent ah, beaucoup en dessous de ça. Donc ce que nous devons faire ici, c'est qu'on va prendre une ligne comme celle-ci et qu'on va aligner les choses comme ça. Comme ça. Comme ça. Comme ça. Ok, si dur va être aligné avec ça parce que ce n'est pas du texte. Tu ne pouvais pas avoir quelque chose comme ça. Alors cachons les lignes. Shift le sont maintenant. Vous pouvez voir que c'est beaucoup mieux maintenant. Il y a une chose que nous n'avons pas ajoutée ici, c'est l'ombre. Voici donc notre balise en vedette. Renommons leur titre. C' est, euh, dur Icahn. Donc, je vais les déplacer à l'intérieur de ce groupe de mâts comme ça. Vous pouvez les garder complètement orteils. Ce n'est pas un problème, mais pour cela. Dag, je pense que je voulais être à l'intérieur de cet idiot de la mosquée parce que je voulais être coupé ici. Si elle s'étend à l'extérieur de cette frontière. Maintenant, nous allons les orteils ajoute de l'ombre portée à ce groupe. Alors je le suis. Ce que je vais faire, c'est ajouter l'ombre portée à ce groupe de mosquées plutôt que d'avoir au rectangle. Donc nous allons ajouter une ombre ici, et cette fois nous allons utiliser 20%. Faisons une ombre. Six pixels. Le sang va avoir 12 ans comme ça. Et, euh, c'est plus Rapprochez-le un peu plus. Le sang sera 10. Um, utilisons-la double valeur pour ça. Pourquoi ? Donc c'est un très bon tour, imbécile. Et il essaie toujours de doubler ce flou. Et ajoutons un peu plus de couleur à vos cheveux. Nous allons utiliser la décoloration et utiliser 30% pour celui-ci. Il est utilisé 50%. 65. Eh bien, regardez mieux. Ok, donc, en fait, j'essaie d'utiliser la même couleur verte de rêve que nous avons dans notre arrière-plan et d'essayer d'utiliser une teinte plus foncée. Sélection de 70% et je vais orteil déplacer plus d'un comme ça et qu'elle était 50%. Donc, je vais utiliser pour six la couleur verte étoile 40%. Donc ça va être mes réglages finaux. Et si je fais un zoom arrière, vous pouvez voir que c'est superbe. Maintenant, la partie suivante est très simple. Nous allons utiliser les mêmes cheveux élémentaires, qui est de regrouper ce premier. Donc, nous allons le recadrer. Allez, G et on va appeler ça grand repos. Tu vois, sois. Et on va commander et contrôler T pour en créer un autre. Et maintenant, nous allons avoir un écran plus petit, une version plus petite de celui-ci. Et nous allons enlever cette vedette ici pour que le cerf soit déplacé et je poserais tout sera semblé. Et si nous, euh c'est essayer orteil rendre un peu plus petit comme ça. Maintenant, vous pouvez voir qu'il y a un problème que nous avons ça écrasé. Icahn est par ici. Donc, pour corriger cela, nous allons double-cliquer sur celui-ci et nous allons avoir Jane, ces contraintes. Donc ça va être juste en bas. Et pour ce groupe, vous pouvez voir que c'est une compétence qui allait orteil ont la taille fixe, donc n'essayons pas de l'échelle. Vous pouvez voir qu'il essaie de rester dans la même zone. Il ne s'écrase pas ou ne change pas de forme. Non, utilisons-nous ça comme ça. Non, nous avons notre section plus petite. On est là. Effectuons un zoom avant et résolvons certains des problèmes ou ici. Donc, c'est en fait le titre va être au fond comme le chardon ici. Cela va être à l'intérieur de l'image et il aura automatisé. Utilisons cette automatisation et savoir. Vous pouvez voir qu'il est fixé pour celui-ci. Vous pouvez voir que nous allons orteil sur la commande de groupe Shift Control Shift G et cela se produit réellement en raison de ce contact de clip. Nous avons donc un cadre et le contenu du script ayant exactement ce problème. Alors déplacons-le par ici. Plus d'eau d'eux comme ça. Ça a l'air mieux. Voyons à quel point l'espacement nous avons ici et entre eux. Cinq. Alors maintenant, c'est le cas. Tu entends ça ? Donc on en a six maintenant, alors on va déplacer un cochon ici. Ce coeur va être six cochons. Il est 10 picks est qu'ils ont un petit conseil d'eux. Merveille 34 sur trois. Ok, donc cet endroit est à la recherche de création. Donc maintenant, nous avons ceci. Ok, alors on va où est ce titre ? Donc le titre va aussi être corrigé cette mauvaise herbe hors de lui. Ce titre sera de boeuf froid et la taille quatre sera 16. Et ce sera John. Trauma en direct et la couleur sera ce vert moyen. Maintenant, nous allons créer un textile, ce que nous avons déjà. Mais cette fois, ça va être euh hein. Non. 16 porcs, paragraphe malade ainsi ou texte normal. Donc, c'est en fait d'un texte normal. Donc ça va être notre titre. Ou si on peut aussi utiliser quelque chose comme, euh, petit titre comme ça. Ah, Bankoff Normal sera bon. Donc, une fois que nous aurons ceci, nous pouvons le reproduire, donc nous avons juste besoin de le reproduire. Et maintenant, nous allons le renommer petit pour un C B juste répliqué. Nous avons une distance de la commande D répliquée, et elle sera appréciée comme ceci. 14 doit être à l'intérieur de ceci. Nous avons donc cette grande section ici. Donc ce qu'on peut faire ici, c'est que nous pouvons aussi faire une chose de plus. Donc, si vous voulez créer un composant, notre contrôle tout cas avant de faire un composant, vous devez vous assurer que tout est parfait. Et vous avez fait ça juste parce que ah, il vous sera difficile de voir et de changer tout ici. Alors contrôlez tout K, c'est notre petite recette. Je vais le répliquer. Allez, la petite recette. Je vais le déplacer ici. À mes hanches. À mon style. Guide, on est là comme ça. Non, je vais revenir à mon dessin principal. Et voici mon design principal. Allons zoomer et voir ce que nous avons ici. Donc cette distance est un peu trop pour moi. Donc je vais aller au guide de style et faire quelques changements ou ici et je vais les relâcher tous les deux et les déplacer un peu ici. Ça a l'air mieux. Maintenant, nous allons revenir en arrière et ça va mieux ici. Encore une chose. Si vous voulez changer l'image ici, nous le ferons plus tard. Alors répliquons cette option d'art. Je tiens la clé Arden Option. 14 cochons malades. Je vais orteil 12 pixels entre eux. La distance, allez, de la pointe. Faites-le copier ici. Maintenant, nous avons trois petites recettes, et nous pouvons également ajouter attaqué ici. Donc, sous le titre moins de 30 minutes. Donc c'est notre titre, et voici un Rubik 14. Et on voulait être un grand 16 ici. En fait, nous voulions être grands parce que c'est un titre. Donc, c'est en fait ce style pas Big 16 mais dans la section de texte sur le texte d'action. Donc c'est en fait le style, et nous aurons plus d'espace à partir d'ici. Donc, nous allons utiliser Tarty 2 ici et nous les avons tous mis en marche. Et nous utiliserons presque, euh 12 d'ici. Ça a l'air mieux. Et maintenant ce que tu dois faire c'est qu'on va choisir tous les commandements et le contrôle, G. Et c'est notre petit, euh, petit. J' ai donc des lacunes. Marcher sur une petite section. C' est notre section, en fait. Donc maintenant, nous le sommes si vous regardez par ici. Donc, si nous sélectionnons tous ces trois, nous pouvons nous aussi avoir cette option ou oui, nous pouvons James la distance entre eux comme ceci. Nous pouvons aussi le changer, orteil ed, ce qui est un peu moins pour mon meilleur. Donc maintenant, nous allons reproduire cette commande ou le contrôle D et le déplacer sous celui-ci. Donc nous aurons encore 30 Bigs trop d'ici. Et Jeanne les titres comme ça. Et nous allons faire un zoom arrière. C' est comme celui-là. Nous allons changer la taille de celui-ci ou ici, et vous pouvez voir la taille de ce bas. Jamais la même chose. Mais nous devons changer la taille de ce fond parce qu'il est resté derrière. Ok, donc nous avons terminé ça. Choisissons ceci. C' est Collab s'est effondré. Ceux-ci et nous allons sélectionner cette navigation en bas. Et nous allons choisir cette position fixe à l'école parce qu'elle sera au sommet et qu'elle sera corrigée. Je n'ai jamais voulu déplacer ça. Essayons donc de voir cela dans un prototype et nous verrons ce qui se passe maintenant. Vous pouvez voir que nous avons cette navigation en bas. Donc si nous essayons d'aller à l'école, nous baisons à l'intérieur, vous pouvez voir qu'on fait défiler ici, donc ça va aller à Stace. Si vous voulez avoir quelque chose en haut, vous pouvez le relâcher aussi. Mais en ce moment, je pense que c'est mieux d'avoir cette navigation universelle en bas. Vous pouvez voir maintenant la seule chose qui reste c'est que vous devez changer ces images, ce qui est un morceau de gâteau pour vous. Maintenant, ce que nous allons faire, c'est que nous allons changer toutes les images de ces recettes, et nous allons aussi changer rapidement les titres du bas ici. Je vais vous montrer comment changer l'image. Nous allons double-cliquer et aller à ce groupe de mosquée et cliquer sur cette image ou ici. Et j'ai trouvé une très belle astuce que si vous faites glisser et déposer votre image sur cette image, sentir qu'elle va être fritté très facilement. Donc, il va orteil remplir à un bon espace. Laissez-moi vous montrer quand démontrez ce que je veux dire orteil maintenant. Alors faisons glisser cette image et dépose-la ici. Donc si j'essaie de le laisser ici, vous pouvez voir que ça va arriver. Imagerie, taille et tout va sur les pieds Va par ici et c'est la meilleure chose. Notre meilleure chose que vous pouvez faire ici est juste glisser le titre et le déposer sur cette façon d'image. Maintenant, vous pouvez voir que c'est mieux. Ce n'est pas ce qui s'est passé la dernière fois. De même, pour celui-ci, nous allons assouplir cette image. Euh, ce groupe de masse. Et si vous voulez diriger cela comme l'image, vous pouvez maintenir la touche de contrôle ou de commande et aller à cette fin, sélectionnez cette image et nous allons revenir en arrière et sélectionner une autre image. Allons sur celui-là. Donc, je vais le déposer sur ce champ d'image et vous pouvez voir que c'est mieux. C' est plus facile pour moi si tu veux toujours l'ajuster. Vous pouvez relâcher cette image. Allez cette image, remplissez sur goto rogner et vous pouvez placer l'image, par exemple. Je veux placer cette section. Je veux l'agrandir sur le quart de travail, , comme ça et appuyer sur la croix comme ça. Donc, c'est une autre façon si vous voulez le personnaliser. Mais en ce moment je suis je veux rapidement placé ces images. Je veux changer ces chiffres. Je veux changer ces taxes ici. De même, pour celui-ci, nous allons faire le même tour, et nous allons aller à cette image ou ici. Il s'agit du fichier image. C' est l'image libre, plus bas ici. Nous allons glisser et déposer tout ce que nous avons sur cette image remplie, et ça la place dans beaucoup de bonne façon pour moi. Je pense que c'est un excellent placement. Donc si je veux le laisser tomber et le changer, je vais le changer comme ça. C' est mieux pour ça. Moins de 30 minutes sera vert foncé, ne pas utiliser de noir ici. C' est en fait sont noirs. Donc, c'est tout pour cet écran. Nous avons terminé avec succès cet écran, et nous allons voir notre prototype à l'écran et voir à quoi il ressemble. Nous avons un test des orteils, peu de choses , par exemple, le top cran par ici. Ok, maintenant vous pouvez voir que c'est nos sauts locaux, et c'est juste derrière cette partie haut de gamme ici. Donc, je voulais être ici dans cette section parce que nous avons orteils prendre soin de cette dans notre conception d'abord je l'habitude de placer. Je l'ai placé ici, donc c'était, vous savez, passer par cette section. Donc je l'ai déplacé ici. C' est ainsi que nous allons utiliser et concevoir l'écran. Les autres trois écrans suivants, ils sont juste que vous pouvez voir juste très similaire à celui-ci. On a tout mieux. On a juste besoin d'orteils. Assurez-vous que cette navigation d'arrêt va se déplacer. Et aussi le bas si nous avons un orteil. Donc, ce sera la prochaine session. Je pense que ces leçons sont très longues. Mais tu dois rester avec moi. Vous devez le construire, et vous devez apprendre et voir comment je le fais réellement. Passons donc à la leçon suivante. 44. SALonnes à l'à l'écran à l'accueil - Recipe à l'à à à: dans cette leçon. Nous allons créer les prochains écrans de carburant et vous pouvez voir que nous sommes là. Ici, nous l'avons. Sellards mérite en bonne santé, donc ce sont presque les mêmes. La seule exception est que ceux-ci la barre de menu ici, il se déplace en fait de l' orteil actif en actif. Et ce contexte est en train de se déplacer ici. Donc, nous allons prendre le pied, utiliser cela et simplement changer de taxe. C' est la même chose. Donc, je vais vraiment sauter très vite. Ou peut-être que je vais sauter cette section. Je vais me concentrer sur le dessus parce que tout est pareil. Juste nous sommes en train de changer les images, les valeurs de celui-ci, C'est tout. Si nous avons, Si vous avez des questions, vous pouvez toujours me poser et qui résoudra votre problème si vous avez. Si vous trouvez un problème, tout est pareil. Seuls le texte et les images étaient en train de changer. Cette recette d'arrêt et de navigation. Je vais vous expliquer dans cette leçon. Alors commençons. Et ce que nous allons faire, c'est nous allons répliquer cet écran, et la première chose que nous allons faire est de déplacer dans cette zone ici, Skip. Ok, donc c'est actif, inactif. Et d'abord, ce que nous allons faire, c'est d'enlever les inactifs et de passer à l'état inactif, parce que maintenant sur les repas est parti. On veut un mauvais terrain. Toby a emménagé dans les salades ici. Et nous allons aussi changer son riche, parce que maintenant il est un peu plus petit parce que les salades sont un grand mot. Donc ça va être ici comme ça. Ok, donc les vendeurs pour les vendeurs, nous avons un état actif. Un inactif va être caché. C' est ainsi que ça va bouger. Hum, donc maintenant on va faire la même chose. On va juste changer toutes ces images et tout. Le magasin d'impôts ici rapidement. Et c'est tout. J' essaie normalement de cacher ma navigation inférieure une fois que vous pouvez le verrouiller ou vous pouvez le cacher orteil facilement, manipuler ces éléments. Alors, je vais aux orteils. La plupart du temps le cache comme ça. Si quelque chose comme ça se produit, c'est parce que nous avons cité la culture des orteils afin que vous puissiez aller à remplir, et puis vous pouvez à nouveau aller à la culture pour le placer où vous vouliez être. Donc, c'est ce qui se passe. En fait, j'ai spécifié Grob Ah, dans mon, euh, arnaque précédente McCandless ou s'ennuient ici. Donc ça se passe avec moi, alors n'ai pas besoin de t'en inquiéter. Tu peux réparer ça. Donc, si j'y vais, je peux utiliser Phil et ensuite je peux sélectionner n'importe quelle image d'ici. Peut-être que celui-là et moi allons le laisser tomber ici comme ça, et ensuite je peux aller bouger les orteils et le déplacer comme ça. Donc maintenant, vous pouvez voir cet écran est également terminé le deuxième à côté sont également les mêmes. Donc je ne vais pas nous répéter. Même conception étapes encore, encore une fois. Donc je vais les créer par moi-même, et je vais sauter ces leçons parce que c'est la même chose que nous allons faire dans les deux prochains écrans. Donc, une fois que j'ai terminé, tous ces écrans allaient se rencontrer ensuite, et nous allons utiliser nos outils de prototypage pour prototyper ces quatre et cinq peaux. Passons donc à la leçon suivante. 45. Écran des recettes saines - Recipes en sain et en sain de la recette Mobile Mobile: Donc maintenant je suis en train de créer, en fait, le dernier de ces quatre écrans, qui est sain maintenant ici est une partie délicate. C' est pourquoi je me suis arrêté ici et j'ai commencé à enregistrer. Maintenant, vous pouvez voir ici nous avons cette histoire. Donc, si nous essayons de le déplacer ici maintenant, en fait sain va se déplacer à l'intérieur de l'écran plutôt que par ici. Donc, Donc, quand on doit faire quelque chose comme ça, on doit bouger toute cette navigation. Alors utilisons cette école, déplaçons les dehors. Donc, nous avons toute cette navigation avec l'arrière-plan. Allez, G, G, c'est un autre haut qu'ils ont. Ok, donc ce qu'on doit faire, c'est qu'on a les orteils bougent ça sur la gauche. Donc ça va bouger comme ça, alors signifie va sortir. Et maintenant, on va changer les statistiques. Donc ça va être inactif. Ce fond va bouger les orteils en bonne santé. Et, euh, maintenant ce sera une fosse en dehors de la santé, et les riches le seront. Je pense que c'est bon et, euh bien, c'est sain. Ok, donc l'état actif inactif va être caché et, hum, le prochain déplacer au milieu. espoirs. Donc, nous voulons vraiment déplacer ce fond au milieu de tout ça. Ok, donc ça a l'air bien. Nous avons tout déplacé ici, et ça va être comme ça. Le reste est le même. Je vais remplacer toutes les images et je vais vous rencontrer dans la prochaine leçon où nous allons être en fait animer ces et en fait essayer le prototype orteil cette section Nous sommes ici. 46. Prototyping de glisser dans Figma: Maintenant, vous pouvez voir que nous avons créé notre force, ces grands écrans et cet écran d'introduction ou de connexion. Et nous sommes dans une position où nous pouvons ajouter du prototypage ici. Maintenant, vous pouvez voir tous ces quatre écrans. Ils ont 940 exil haut. J' ai laissé un peu d'espace en bas. Donc, si vous le regardez ici Donc en fait, j'ai quitté l'espace parce que cette navigation et ce fond tout le contenu va bouger . Donc, une fois cette page déplacée vers le haut, ça prendra sa place ici. Donc ça va être ici comme ça, donc non, donc non, vous pouvez voir que c'est ça. C' est pourquoi j'ai laissé un peu d'espace en bas. Ok, donc maintenant on va relier ces écrans, et on va passer à ce prototype ici. Et la première chose est que ça va être notre écran principal. Donc nous allons prendre les orteils d'ici, et nous allons le lier à celui-ci pour que vous puissiez voir ce bouton de lecture. C' est cela montre que ce sera le premier écran maintenant Nous pouvons également ajouter quelque chose ici. Par exemple, groupez toutes ces commandes G et appelons-l' Logan Group. Et nous pouvons aussi lier ceci à celui-ci et sur le robinet nous n'aurons jamais les pieds ce moyen moyen et cela ne sera pas instantané. Nous allons utiliser smart, animate, et nous allons utiliser la facilité d'entrée et de facilité pendant 400 millisecondes. Donc, ce sera le fait que nous allons utiliser de la même manière pour celui-ci. Ok, donc une chose qu'ils doivent mentionner est que chaque fois que vous essayez d'utiliser n'importe quelle icône, il y aura une zone cible touchée. Pour cela, j'ai frappé zone signifie que nous devons concevoir quelque chose à l'arrière-plan, qui va être à la zone capable qui est accessible au doigt. Donc, si vous avez une très petite zone capable ou cible touchée, votre doigt ne va pas orteil toucher cette icône facilement. Donc, utilisez un vrai donjon sur le toucher, et cela ne fonctionnera pas. Donc ce qu'on va faire, c'est, hum, allons à l'intérieur de ce groupe. Créons un rectangle ici comme ça. Je déteste vraiment cette fonctionnalité que je veux un Simon dans un groupe. Il devrait créer ce rectangle à l'intérieur de ce groupe plutôt que de le lire en haut. Donc je vais le faire glisser vers cette flèche à gauche et pour l'angle de secte, ce sera, euh, idée humide pour cette erreur gauche. Il suffit d'aller à la conception et juste Jack ce Injecter ce contenu de clip maintenant, la zone de pas va en fait orteil être transparent. 0% de transparence, parce que nous allons simplement l'utiliser pour le prototypage. Donc, une fois que nous avons les médias et que nous voulons, vous savez, baser sur tous les autres groupes aussi. Donc je vais faire la même chose pour celle-là. Donc, je vais avoir une section d'onglet ici. Tape-le encore pour celui-là, Do et je vais Teoh, utilise des DeBlieux comme ça. Uh, allons utiliser quelque chose comme ça et nous allons le déplacer à l'intérieur. Cet entonnoir Ceci est également dans l'application de cour. Oui, et modifions le contenu de ce clip. Je m'en vais si tu l'as. Donc, vous devez vérifier s'il y a un cadre autour de votre icône et que vous avez ce contenu clip cela va être une douleur dans votre tête. Donc, um, zone Tab va être transparente, donc je vais changer la transparence à 0%. Donc nous avons des icônes d'entonnoir et de flèches ici, et nous allons relâcher le Kamar et voir les deux hors d'eux. Et on va les orteils, hum, les biest ou ici comme ça. Alors, enlèvons-les , diluons-les. , Et je vais espérer ne pas aimer ce temps basé que nous sommes ici, ils vont être basés à l'endroit si moins à côté de mener ces dans les secondes comme cette commande, nous votre contrôle v, pour les coller de la même manière pour celui-ci. Nous le faisons parce que nous n'avons pas fabriqué ces composants. Si nous avions fait ces composants, nous n'avions qu'à ajouter dans la section des composants. Mais je pense que ce genre d'autres vont travailler de toute façon. Donc, nous les avons ici. Maintenant, nous allons relier ces sections, donc nous allons aller au prototype et ouvrir ceci et sélectionner le poignard Inde et nous allons le relier. Uh, ça va naviguer vers, et nous n'allons pas utiliser l'animation intelligente, mais nous allons utiliser, hum, déménager ou ça va être en destruction. Donc cet écran va se déplacer comme ça, et cela va revenir de la même manière pour celui-ci, Nous allons faire la même chose. Paramètres qui sont déjà les mêmes. Donc, nous avons lié sac et nous avons lié ce journal de remorquage. Ce D est pour cet écran principal. Ok, alors testons celui-là. D' accord ? Donc nous avons l'écran pour le poignarder, et vous pouvez voir l'effet Yum xyz monter. C' est en fait intelligent. D' une minute à l'autre, vous pouvez voir sortir et émettre comme ça. Maintenant, la prochaine chose que nous allons faire est d'ajouter des zones capables pour tout ça. Donc, ce que je dois faire, c'est que je dois ajouter ah zone d'onglet de zone adaptable dans tous ces domaines. Je pense donc que nous aurions dû créer cela dès le début. Mais, euh, c'est comme ça que je voulais vous montrer que si vous ne créez pas la cible de couteau, ce qui est beaucoup en fait, ce qui est beaucoup en fait, et que les designers manquent à chaque fois qu'ils enseignent leurs cours. Donc, cela va être la cible du robinet. Et, euh, ça va être 0% ce que ça veut dire. Ensuite, nous avons le même temps il dupliqué va être quatre Sellards comme ça dans le même. Oui. Ensuite, nous avons Viens sur D. On va aller dans les déserts. On est là. Ensuite, nous allons de nouveau et faisons la même chose pour celui-là par ici. Donc, ce sont les joggers de robinet pour tout ça. Donc ça va être utilisé dans notre prototype. Ce sont la cible de frappe pour les doigts. Donc, si vos doigts si vous avez cette étape cible très petits doigts vont manquer cette Porte des étoiles, et il aura quelques problèmes. Donc, c'est comme ça que j'essaie de vous montrer comment vous allez faire l'expérience utilisateur ou améliorer la facilité d'utilisation de l'application ? Non. Je vais ajouter toutes ces cibles tactiles dans tous ces ou ici. Maintenant, j'ai créé toutes les cibles tactiles. Pourquoi ? Je n'ai pas fait de composant parce que je dois déplacer tout cela ici et ce qu'ils sont donc je voulais juste vous montrer comment créer ces cibles tactiles et pourquoi elles sont nécessaires pour prototypage. Donc maintenant, nous allons passer à cette section prototype ou ici. Et cela signifie que ce sera des repas pour les vendeurs. Vous pouvez maintenant voir la cible de portée. Nous allons le déplacer dans les salades ici. Et ça va être, euh, intelligent de toute façon. Et ça va être facile à entrer et à sortir. Donc, ce sont les mêmes paramètres qui allaient utiliser pour chaque off chacun de ceci. Donc celui-ci va bouger, donc ça mérite ça. Healthy va orteil déplacer vers le dernier à portée de main. Suivant. Zoom arrière afin que vous puissiez facilement voir que de la même manière, nous avons ce Sellers Désolé signifie et il va revenir à moi années. Dessert cerceaux Dessert va aller dans le désert. Healthy va kowtow Healthy de même toute la paix. Maintenant, vous pouvez voir que je les ai liés. Maintenant, testons cela et voyons comment ce menu de navigation fonctionne et ressemble et se sent comme Alors commençons et voyons ce que nous pouvons préférer. J' ai avec Sigma. Donnons-le un peu de temps à Seigneur, il faut beaucoup de temps pour abaisser la même chose. Donc, nous allons aller de l'avant et voir nos prototypes généraux. Donc, certaines des images ne se chargent pas, mais vous pouvez voir l'effet de surcharge en ce moment pour GMA fonctionne réellement leur service. C' est pourquoi nous avons cette lenteur lente dans cette , animation et ce prototype, j'espère que ça ne vous dérange pas, mais c' est en fait comme ça que nous allons créer ce, euh, ou ici. De même, nous pouvons cliquer sur ce et revenir en arrière aller ou cheveux en bonne santé leur école de deux repas sains Desser , Sellards et moyens. Donc c'est comme ça que vous prototypez et liez vos écrans ? Assurez-vous que les positions de ce texte et tout est le même parce que vous pouvez voir ici . Si j'essaie de cliquer ici, on dirait qu'il bouge. Certains problèmes sont là dans les prototypes de masse de figues ou n'ont pas besoin d'être beaucoup trop parce que vous devez montrer à vos développeurs que c'est à quoi cela ressemblera et il y a des contrôles et des programmes standard qui vont faciliter ce mouvement. J' espère que vous avez apprécié ça jusqu'à ce que ça. J' espère que vous avez beaucoup appris sur la figue, maman, nous allons créer les prochains écrans dans les prochaines leçons. Passons donc à la leçon suivante. 47. Conception d'applications de recherche en recette: Maintenant, dans ces quelques vidéos, nous allons créer ces écrans de recherche 123 et 4. Donc, en fait, dans ce vert, nous avons choisi de désactiver ces sélections, donc je vais rester avec une seule celle-ci. Je vais vous montrer la technique, et vous pouvez l'appliquer à autant. Si c'est le cas, tu veux que les orteils soient baissés ici. Donc nous avons Ah, cet écran avec ces réserves sont montrés que nous avons. Trois écrans étaient des filtres et des options de recherche avancées sont donc chaque fois que quelqu'un clique sur la recherche, ces écrans apparaîtront. Alors commençons et commençons à concevoir ces écrans de filtre de recherche. Maintenant, nous allons revenir à notre fichier réel, et la première chose que nous allons toujours faire est de répliquer ceci. Alors répliquons ce sain et nous allons le renommer orteil. Je sens qu'ils sont tout ce que vous pouvez appeler ça comme ça. Donc, ce sera notre premier article de ce genre. Et, euh d'accord, pour qu'on puisse ramasser quelques trucs ici. Par exemple, nous n'avons pas besoin de cela ici, donc nous allons supprimer ceci que cet orteil, et à partir de ceux-ci nous allons Nous n'avons pas besoin de ces petites recettes. On a peut-être besoin de cette taxe, donc je vais la garder ici comme ça. Je pense qu'on n'a pas besoin de l'utiliser. Peut-être qu'on a besoin de quelque chose comme ça, mais maintenant, je pense que c'est important qu'on ait supprimé. Ok, donc nous avons un cap, et allumons notre grille Lior, et je vais l'aligner sur la gauche. C' est garder l'orteil de distance. Hum, 48, c'est bon. Suivant. Activez nos règles. C' est le boulot, en fait. Donc d'accord, je pense que 40. Ça a l'air génial. Cachons tout. Maj sur le quart de travail contrôlé ou le contrôle G, si vous êtes sur un Mac, et ici nous avons notre Paul, vous êtes comme donc je pense qu'il devrait être aligné ici pour que les gens ne puissent pas beaucoup scintillement ou quelque chose comme ça. Donc je vais aller orteil ici comme ça. D' abord, on va le renommer en terre morte. Donc, nous avons un plan de régime. Les options étaient là. Non, nous allons créer différentes options de plan de matrice pour ça. Nous allons utiliser une technique qui va vous aider à accélérer votre travail et nous allons commencer par le texte. Par ici. bétail est mort. Utilisons ça et je vais colorer les orteils ça va aller tuer les tueurs locaux. Et je vais utiliser ce blanc même f f ou vous pouvez utiliser un peu plus de combattant ici comme ça . Non, la technique la plus simple est que vous allez aux pieds. Ajouter un décalage de cadre, plus un Maintenant, vous pouvez voir ici nous avons un cadre, donc nous allons l'appeler option. Et une fois que nous avons fait le cadre, nous pouvons ajouter la couleur de remplissage ici, et ce sera neuf e cinq. Donc ça va être une grande couleur, donc nous ne pensons pas qu'elle soit active. C' est donc un état normal. Donc on va y ajouter un peu de rondeur. Agissons 1 à 6 et à gauche et à droite mordre. Je vais y aller avec 16. Quelque chose comme ça. Et en haut et en bas. Je vais passer plus de 12 ans. Utilisons 13 quelque chose comme ça. Donc, ça a l'air super. Nous avons une très belle boîte qui va s'agrandir avec notre texte. Donc, si vous vous souvenez que nous avons utilisé ordonnée avant. C' est en fait la boisson ordonnée. Maintenant, je vais reproduire ça. Nous ne allons pas le piler dans un autre conteneur, alors nous allons répliqué par sont en appuyant sur la touche d'option art. Et nous allons en avoir un autre, qui est d'acheter un nouvel acte criminel. Nous allons créer un autre toutes les options de dessin glisser pour en créer un nouveau. Je garde une distance de 12 ici entre ces deux éléments. Donc nous avons quatre options par ici. Regroupez-les ensemble. Allez, G. Donc c'est notre groupe mort ici, donc je vais le déplacer dans cette petite section parce que nous avons déjà eu ce groupe. Ok, donc à partir d'ici, on a beaucoup d'espace, donc on ne veut pas que ce soit trop. Ok, donc encore un truc, je vais vous montrer, alors laissez-moi vous montrer le contrôle du quart quatre. Ok, donc si vous zoomez, vous pouvez voir que ceux-ci ne sont pas alignés correctement. Et une autre chose est, si vous avez des coins arrondis comme ces formes ovales, vous devez les garder un peu plus d'un de la frontière, est-ce pas ? Si tu veux les garder à la frontière comme ça, comme ça 15. Ça va avoir 12 ans. Ça va être essayé. Ok, donc je vais faire de celui-là un choix comme ça. Ou peut-être que je vais le déplacer un peu à l'intérieur parce qu'on a des coins arrondis par ici . Ça va avoir l'air un peu différent. Oh, tu peux voir un peu. C' est en fait un problème visuel que chaque fois que vous voyez quelque chose comme ça, ce n'est pas le cas. Il n'aura pas l'air aligné. Donc, c'est une astuce simple que si vous avez beaucoup d'éléments arrondis comme celui-ci, vous devez déplacer votre texte un peu sur l'orteil droit, l' aligner visuellement dans la ligne. Donc le vaisseau quatre contrôlé. Ça a l'air un peu mieux. Même toi, tu peux le déplacer. Deux pixels de plus dans ce look génial. Plan mort. Ok, donc nous avons ce groupe, juste nous allons répliquer ce groupe et créer sous groupe ici en bas. Ok, donc pour l'instant, c'est 54. Je vais les orteils, le déplace plus bas 56 et je me repose. Tu le sais déjà. Je répète la même chose. Ce que j'ai fait ici. Ok, donc ça a l'air bien. Maintenant, nous devons réduire la hauteur de ce tableau d'art. Wasit est un peu trop. On n'a pas besoin de ça. Donc nous y voilà. C' est donc la ligne d'arrivée pour cet écran. Une autre astuce est ici parce que si vous voulez changer la hauteur sont la distance entre ces éléments, vous pouvez relâcher cela. Prenez ceci et vous pouvez augmenter ou diminuer la distance entre eux. Donc c'est 13. Et si je ne peux pas le faire d'ici, je peux utiliser quelque chose d'ici. 12. Je voulais avoir 12 ans et de la même façon ici. Je voulais avoir 12 ans. C' est ainsi que vous le faites rapidement. Ce sont les quelques caractéristiques qui sont vraiment brillantes dans la Fig Meyer. J' espère donc que vous avez apprécié cette leçon pour la prochaine fois. Nous allons faire l'état de sélection, et je vais vous dire comment nous allons le faire dans un prototype plus dans quelques prochains. Passons à la leçon suivante 48. Prototyping de recherche: Maintenant, nous allons reproduire cet écran et nous allons à l'état suivant, qui va être l'étape de sélection. Donc je vais orteil utiliser le zoom orteil 90% à mon goût. Celle-ci a l'air bien. Maintenant, je vais cliquer orteil et maintenez mon art et la touche d'option pour le faire glisser et répliquer cet écran ici. Donc, cela va être terminé et ici nous allons avoir quelques états de sélection ici. Donc, une fois que quelqu'un tape tout ici, il y aura un objet de recherche ici. Donc ça va ce qu'on va faire dans cet écran ? Une chose que nous avons oublié ce qui est ici est que nous devons changer cette recette et nous allons utiliser une porte ici, chercher duh ou sélectionner des options. Appelons ça maintenant un, quelqu'un clique dessus. Donc, nous allons aller à cette valeur, est mort une option, et nous allons orteil répliqué cela par la commande E. Donc, nous en avons une autre, et nous allons l'appeler option. Appelons ça la valeur de l'option. Et appelons ça l'option, euh, normale. Et appelons ceci une option correcte pour l'état actif. Nous allons utiliser la couleur que nous avions, qui est vert très vif, qui est notre couleur primaire. Ce zéro e 5956 C'est donc un schéma de couleurs. Nous avons déjà décidé. Ce sont nos couleurs primaires sur l'écran. Un et je aime vraiment et profiter de cette couleur. C' est très gentil, ma fille. Ok, donc nous avons cet état de sélection, mais nous voulons aussi une icône ou de l'aide. Et une autre chose, c'est que la même chose va être ajoutée aux frais généraux. Donc, ce qu'on va faire, c'est amener l'icône ici, traîner ici, et en créer une pour nous-mêmes. La première chose, c'est que nous allons avoir besoin d'une ellipse ici, qui est Hold shift. Et je voulais Toby 16 par 16. Faisons 16 par 16 et ce sera de la même couleur. Celui-ci, l'écran, et il aura un coup d'un cochon malade, et il sera blanc. Ok, donc je vais vous dire pourquoi je vais devenir Dwight, parce que ça va le séparer de cette histoire sur lui. Nous pouvons aussi avoir un peu plus grand, comme 18 par 18. C' est ça qui a l'air bien. Ok, donc on a celui-là, et ça a l'air de créer. Maintenant, nous avons juste besoin d'apporter le Je suis allé ici, alors amenons Daikon. Ok, maintenant, voici les icônes que nous avons déjà sélectionnées. Il y a deux icônes qui ont le vérifié comme ceci. Vous pouvez voir celui-là et celui-là. Donc je vais y aller avec celui-là. Je vais le glisser dans mon sigma et on va vite changer quelques choses ou ici. Par exemple. On a juste besoin de ce chèque. Mark, nous n'avons pas besoin que ces lignes soient là, donc j'ai juste besoin de celle-ci. Donc je vais traîner dehors de ce groupe, et je vais le déplacer à l'intérieur, comme ça, nous allons utiliser une couleur blanche. Excusez celui-là, et vous obtenez un peu plus blanc. Ajoutons cette couleur blanche orteil plus blanc, exclu, plus léger. Zoom avant en utilisant des touches commande plus, et nous allons relâcher cela et nous allons le rendre un peu plus petit parce qu'il est très, très grand. Prenez ici. Donc, je pense qu'on a besoin de ... comme celui-ci. C' est bien. Ok, ça a l'air super. Excusez la bordure de la même couleur que celle-ci. Cet écrivain, d' accord ? Bordure Et cette case à cocher doit avoir la même couleur. Ok, donc je pense que nous avons notre direction choisie. Maintenant, nous allons le regrouper ensemble parce que nous avons des choses à travailler séparément ici et là . Donc ce sont nos deux ellipses. C' est bon, donc c'est une petite section. C' est des allergies. Donc c'est die Pan di. Option de groupe planifiée vierge. Ok, donc ici nous avons l'option active et l'option normale. Donc, nous allons déplacer nos deux icônes juste au-dessus de cet actif. Nous n'allons pas le déplacer à l'intérieur parce qu'il appliquera les mêmes choses ici. Les paramètres ici. Donc, nous allons à la pointe, sélectionnez toutes ces commandes G, et ce sera notre option. Étudiant actif. C' est donc notre option active. C' est une autre option. Normal. Donc, chaque fois que quelqu'un clique ici, ou peut-être par ici, ça va aller de l'avant. Ok, maintenant on va ajouter quelque chose. Nous sommes là, et la première chose que nous allons faire est de cacher ça et nous allons en faire un autre et c'est vraiment désolé rectangle ici. Et nous allons utiliser quelque chose des mêmes paramètres comme celui-ci. Ou peut-être que nous pouvons utiliser juste le texte ou ici et l'appeler régime de valeur. Et, hum, nous allons ajouter le décalage A qui va bout Adauto couche à elle. On va utiliser 12 et 11. Et nous allons utiliser, euh, 36 ici à un particulier, qui va être notre couleur bleue, que nous avons déjà ajoutée. Un. F. Quatre d 96 Maintenant, nous allons changer la couleur du texte orteil quelque chose de blanc, qui va être un plus vital ici. Mettons-le ici et voyons ça parce que ça va. Non, c'est un peu plus grand, donc on va en avoir un peu moins. Alors 10 a l'air bien. Zoom avant et voyons si nous avons des espaces égaux en haut et en bas quelque chose comme ça. Zoom arrière et voyons un peu plus petit. Celui-ci, celui-là fonctionnera. Oui, ok, donc en ligne est le paramètre, donc nous avons une valeur de point mort ici, qui est déjà ajouté, et voyons si le même type est côté. Ok, donc c'est la même chose parce que je ne peux pas penser 11 mais un texte d'action. Donc, c'est 11 texte de connexion. Ok, donc c'est bien. Fais-le au milieu. Ok, donc une fois que celui-ci est sélectionné, celui-ci va comme ça. Et, euh, nous allons créer une icône ici. Croix icône, Il est utiliser ce décalage. Utilisons une ligne droite et nous allons utiliser moins 45 quelque chose comme ça, et nous allons orteils ont plafonné. Toby arrondi. Ah, un peu plus gros. Qui va être de la taille ? Et nous allons commander la réplique et nous allons les orteils. Déplacez-le à 45 degrés comme ça. Laissons juste ça faire. Ok, donc je pense que ça a l'air marqué. Nous avons déjà traversé. J' appelle, on va aller aux pieds. Regroupez-les ensemble et appelez ça croix ou X. je suis le suivant. Déplacer ici semble un peu plus petit, donc nous allons changer sa peau un peu. 13. Cela semble mieux avant ça. Loin de cela qu'elle avait 14 ans ou ici. Des chaussures, tu sais, devant. 16. Ok, donc 16 est en fait la taille pour celle-là. Donc j'utilise la hauteur. La hauteur va être 15. Et disons que vous 16 16 a l'air un peu plus grand. 15.5. Donc je vais utiliser une taille comme celle-ci, et ça doit être, on va le déplacer à l'intérieur. C' est comme ça par ? Je pense que nous ne pouvons pas le déplacer parce que c'est en fait sur l'exemple. Donc nous devons soit casser cette instance. On doit le casser. Alors gardons ça comme ça et changeons la couleur grosse de la même façon, cette même couleur. Ok, donc on n'a pas ça ou peut-être qu'on peut avoir ça. Je pense que ça a l'air bien. Ces deux actions sont assez distinctes. Donc, nous avons un état de sélection prêt à maintenant. L' astuce est, chaque fois que vous voulez orteil quelque chose minute dans la fig, ma ou l'un de l'application de conduite proto acheté ces états devrait être le même. Pour que vous puissiez voir ou entendre. Entendre ? C' est différent. Nous avons différentes options. Option, option, option, option. Et nous voilà. Nous avons des choses différentes, donc ça doit être pareil. Donc ce que je vais faire, c'est que nous allons générer ceci en répliquant celui-ci. Donc je vais le croire. Répliquer celui-ci parce que nous avons nous avons Nous avons besoin de tous ces états actifs pour si nous voulons tout milieu et nous allons dans cet état. Donc ça va être une recherche une recherche une. Et dans cet état, cette polio, nommons, devrait être la même. Donc, si vous avez un cadre qu'il doit être encadré un ici orteil. Donc je vais le déplacer comme ça ici, et ça va être C 0%. Donc, il va être la transparence devrait être de 0%. Ok, donc on l'a caché ici, et on va se mettre aux pieds. Utilisez la recherche. Sélectionnez l'option. Toby présent. Ici, il va être actif de la même manière ici, nous devons cacher quelque chose. Option active. Il va être de 0 %. Déplaçons d'abord vers le bas. Donc je voulais glisser comme ça. Donc je vais le déplacer ici, et je vais utiliser 0%. Donc si vous comprenez ça, je l'ai fait, j'essaie de cacher ces états. Et quand nous sommes passés à cet orteil ennemi. Celui-ci, cet état actif, nous allons juste les montrer d'accord De même, pour cette icône de croix. Nous allons le déplacer ici comme ça peut être par ici, par ici et bouger. Fais 0 %. Donc, chaque fois que quelqu'un essaie de cliquer ici, il va aller dans l'état. Donc, chaque fois que quelqu'un essaie orteil, choisissez notre essayer d'activer cela. Il va entrer dans cet état et chaque élément va se montrer lentement et progressivement. Donc c'est en fait l'astuce derrière ça. De même, ici, nous allons aux pieds. Montre-le. Mais nous allons utiliser l'opacité ici. C' est hissé en utilisant l'opacité comme celle-ci. Ok, alors essayons de les faire et essayer de les connecter. Allons le prototype des orteils et je vais les orteils. Va par ici. Et si quelqu'un d'accord, alors on va aller par ici. Si quelqu'un essaie de cliquer sur le bouton sur celui-ci, il va aller à ceci et nous allons utiliser Smart Enemy. Il est à l'extérieur. Aucun défilement ne se dégage qu'il fait froid. Commençons ça. Relions également certains de ces bars ici à cette zone. Donc, nous allons passer aux pieds vers celui-ci. Intelligent. N' importe quel simple. Ok, donc celui-ci, même, celui-ci de la même manière, celui-ci. Ok, donc toute la barre de recherche là correctement à celui-ci. Jouons à notre prototype et voyons ce que nous avons encore attrapé. Ok, donc nous avons ici c'est notre menu de viande animée. Ensuite, si nous cliquons sur cette telle recette, il va vous voir, cela arrive comme ça. Nous ne pouvons pas revenir en arrière maintenant parce qu'il revient à celui-ci que nous avons les pieds. D' accord. Donc, une fois que nous sommes sur cet écran, laissez-moi vous montrer ce que nous avons fait jusqu'à maintenant. Donc, pour cliquer ici, voir la mission ici et laissez-moi vous connecter pour que nous puissions le répéter encore et encore. Ok, donc nous avons cette croix et où est en face ? À travers. Donc c'est vraiment que je n'aime pas ça chez maman stricte, parce que mon nom. Et quand j'ai dormi ça, je devrais être à l'intérieur, prendre les pieds cette couche ici. Donc c'est une icône à travers et je vais ajouter um, tape ce 80 ici. Donc ça va être mon onglet ? Oui, pour cette icône de croix. Que se passe-t-il ? Je veux avoir un enchevêtrement qui sera leur opinion pour celui-ci. C' est l'icône de la croix. Appelons ça la profondeur. Oui, je vais à 0% d'opacité, et ça va revenir en arrière. Donc, dans le prototype, je vais aller aux pieds. Déplacez ça et ça va revenir à celui-ci. Et rejouons ça. Non. Vous voyez l'effet ici ? Tu vois comment ce copain ton régime glisse en même temps que celui-là ? Donc, c'est comme ça que vous créez un joli prototype immédiat dans la figue. J' espère que vous avez appris apprécié cette leçon. Passons à la leçon suivante où nous allons montrer la recherche. De telles réserves. J' espère que vous avez apprécié cette vidéo, et je sais que ces vidéos sont très longues, mais vous devez continuer à regarder pour apprendre quelque chose de nouveau 49. Concevoir et Prototyping des résultats de recherche: Maintenant, nous avons créé la recherche, n'importe quelle mission et le prototype. Maintenant, nous allons passer orteil à l'écran suivant, qui va être les résultats de la recherche. Alors appelons-le ces réserves et vous pouvez voir ou entendre. Nous allons avoir un certain statut ici comme nous avons trouvé ces nombreuses réserves qui supprimer cette prochaine. Diluez ça. Donc je garde ça parce que je dois le montrer. Cinq réserves téléphone. Donc je vais garder cette même section supérieure ici, et nous allons changer la couleur des orteils en quelque sorte génial parce que nous ne voulons pas qu'elle soit très mise en évidence ici. Et maintenant, nous allons créer une surcharge rectangulaire. Donc rectangle va être de la même taille que cette barre. Ici, il est 3 39 3 39 et gardons la hauteur 1 24 et nous allons les orteils allongés comme ça . Il va être à 20 pixels loin des réserves d'arrêt, et nous allons avoir quelques coins arrondis, quatre excrétés pleins. C' est activer notre Donc il est un peu à l'extérieur de la section Fallar ici. Ok, donc ça a l'air marqué. Ok, donc non, c'est notre point de départ. Donc je vais cacher mon, euh, euh, contrôle de la classe 4 et contrôle G. Je pense que pour les utilisateurs de Mac, je vais utiliser la couleur blanche. Alors maintenant vous pouvez voir pourquoi j'ai utilisé ce blanc parce que les regards blancs créent sur ce fond pâle et fini. Donc c'est un truc. Je voulais vous montrer que si vous essayez d'utiliser un fond de couleur très claire ou très léger associé , votre couleur blanche va briller dessus. Alors maintenant, nous allons ajouter une ombre, celle-ci. On va faire des effets sur les orteils. Ombre portée et sang sera trois cinq. Tout sera un. Parce qu'on ne veut pas qu'il soit très loin. Et la couleur avec 363636 Et l'opacité sera de 10%. Vous pouvez voir qu'il est très subtil. Ombré. Reprendre en. Vous pouvez voir que c'est très, très ombre légère, et il a l'air vraiment génial. Il est très proche de cette couche, et cela a l'air génial. Maintenant, nous allons ajouter une image ici à gauche et à droite, nous allons avoir quelques informations, comme un concert de lait ou quelque chose comme ça. Donc d'abord, nous allons aux pieds. Ça va être notre Dana. Et maintenant, nous allons ajouter un autre conteneur à l'intérieur de celui-ci. Donc ce sera là comme ça. Ça va contenir notre image. Non. Ce que nous voulons faire, c'est que nous voulons que ce conteneur serve de mosquée pour tout cela. Donc nous allons répliquer ce contrôle de commande D et nous allons relâcher ce conteneur une mosquée. Nous avons été de le renommer, contenir une mosquée en arrière-plan, et nous allons dormir orteils. Tous les meilleurs joueurs que nous voulons à l'intérieur et nous allons utiliser cette mosquée ou ici. Maintenant, vous pouvez voir tous ces leaders. Ils ne peuvent pas échapper à cette taille. Donc, si j'essaie de le redimensionner, vous pouvez voir qu'il restera toujours ici dans ce cas. Une autre chose, c'est que je pense que notre ombre est perdue ici. Alors nous allons déplacer ça de là, et nous allons l'ajouter à notre groupe de mosquées. Alors ajoutons le partagé ici. Le 3 66 et nous allons utiliser 10% de celui-ci ici. Donc, ça a l'air de travailler. Ça a l'air bien. Donc, nous avons ce prochain conteneur d'image de l'appelant, et nous allons glisser et déposer sur l'image à l'intérieur de celui-ci. Utilisons ceci et remplissons ceci avec une image ici, comme cette image et exposons l'image. Et ce sont les images. Ils s'attendent à celui-ci. Ok, donc ça a l'air bien. Ça a l'air bien. Super. Ok, donc nous devons avoir des informations ou ici. Donc, dans le dîner du Michigan, on a l'image à l'intérieur. Ensuite, nous avons ce conteneur. Ça va être le conteneur blanc complet. Appelons ça continuer la lumière. Et puis nous avons continué la mosquée, qui est en fait masquer tout. Ok, donc maintenant on va ajouter quelque chose par ici, comme le lait de kick. Ce sera notre titre. Ok, donc nous voulons avoir une bonne séparation de cette image. Déplaçons ça à l'intérieur. Ce groupe perdu 2120 s bon du haut. Excusez 12. Ensuite, nous aurons quelque chose d'autre comme 5 36 Les gens l'adorent. Nous aurons également un examen ici, donc nous allons utiliser 251 commentaires et étoiles. Donc nous allons utiliser une forme d'étoile ici, créer un décalage d'étoile ou un décalage. Je vais utiliser un autre angle, comme 45. Ça a l'air marqué. Et je vais utiliser une couleur orange comme celle-ci. Un peu plus lumineux serait mieux. Comme cette taille sera 12 l'année prochaine. Ça a l'air bien. Pas seulement nous devons les répliquer. Allez, De. Allez, D. Maintenant, je vais utiliser le gentleman de parce que la plupart de ces sélections que vous pouvez voir ici si vous allez par ici. Celui-ci, il y a de l'arabe. Je vais utiliser dans certains des 16. De même, ici, je vais utiliser votre fraise de 16 ans. Et la couleur sera la même. Comme celui-là. Un peu créer. De même, pour celui-ci, je vais l'utiliser et monsieur. Et nous allons regrouper tout ce qui va bien pour celle-là, nous n'allons pas utiliser ce noir, mais nous avons un noir vert. Donc nous allons utiliser celui-ci de la même manière, pour celui-ci. Nous ne voulons pas que ce soit très brillant. Nous pouvons peut-être utiliser cette couleur primaire verte parce que les commentaires sont très Vous pouvez voir menting hors de toute application Les gens aiment les lire. Donc, c'est presque prêt que zoomer et voir comment sont différentes distances. Celle-là a l'air un peu plus petit, donc je vais augmenter la taille express et maintenir le décalage. a l'air un peu plus petit, Ok, donc celui-ci a l'air mieux maintenant. Ligne infirmière gauche sites. OK, donc ici nous avons la distance pour elle a utilisé ça. Déplacez les un peu vers le haut parce qu'il est très proche de la frontière ici. Ok, donc une fois que nous avons créé ce groupe de mosquées, c'est en fait notre, euh, tel résultat. Ou peut-être qu'on peut petite carte. On peut appeler une petite carte. Maintenant, nous allons répliquer celui-ci. Si vous souhaitez créer un composant, vous pouvez également le faire. Donc je vais changer les orteils de certaines choses ici et là, et ensuite je vais le bouger. Faisons de cela un composant. Contrôle des commandes. Découragé. Répliquer. J' utilise. Je vais déplacer ce composant Theis, ce composant maître dans notre guide de style. Alors allons Harrod ou ici comme ça. Maintenant, nous allons reproduire et juste changer les images et la taxe. Alors, je vais aux orteils. Je ne vais pas entrer dans les détails. Ça va être sauté. Je vais l'ignorer très vite. - Non , l'écran est prêt. Vous pouvez voir par ici. J' ai changé tous les différents éléments ici, et j'ai laissé un peu d'espace ici en bas. Donc, chaque fois qu'on est à l'école, on a l'espace pour cette navigation en bas, ou ici. Alors maintenant, nous allons lier ces éléments ici. Donc, une fois utilisé comme ceci et cliquez sur la recherche, il devrait continuer. Cette recherche est le discours er. Alors faisons ça. Donc, nous allons sélectionner cette icône, et nous devons également ajouter un rectangle ici pour avoir la zone active du robinet comme ceci. Et ça va être près de ce bar. Touchez un DEA, baissez-les ensemble le week-end. Si nous ne voulons pas de groupe, nous pouvons laisser ça comme cette idée d'étape pour un tel groupe. Et puis on va utiliser l'opacité à 0%. Et une fois que nous allons le prototype des orteils ont dormi le même Cet onglet 80 ici et va déplacer. Donc celui-ci est dans n'importe quel fait. Essayons donc de voir ce que nous avons accompli. Toujours encore. Donc tous vos taux de régime Suivant, cliquez ici et ici nous avons nos résultats. Maintenant, si vous voulez tout fait ces mérites, c'est une autre histoire. Nous avons orteil utiliser les mêmes réserves que vous pouvez voir. Ok, donc c'est un petit problème. On est là. Nous avons beaucoup d'espace en bas parce que vous avez des choses ici. Laissez-moi vous montrer ce qui se passe réellement. Donc, chaque fois que vous avez quelque chose comme ça, vous devez avoir du contenu de clip. Et pour cette image, on veut un résident des orteils Phil, on va faire une culture des orteils. Vous pouvez voir que cette limite est en dehors de cette zone. Donc, chaque fois que vous avez ceci, mais ce genre de limite, cela va orteil donner plus d'espace au bas. Nous allons donc utiliser les cultures et les appels. Il va corriger cela et aussi vous pouvez voir ici ce qui se passe. Donc le fond BG est un peu plus grand. C' est un autre problème. Assurez-vous donc que vos couches ne sortent pas de ce conteneur, donc si une couche est à l'extérieur de ce conteneur, elle va à bout. Vous donnez des maux de tête comme ça. Ok, Donc avant d'aller à celui-ci, nous devons animer ces pour donc nous allons les sélectionner tous. Allez, tu vois ? Et nous allons les baser sur les orteils ici. Bonjour, V. Maintenant, on va les déplacer un peu, Doan et, euh, on va aussi changer les distances entre eux comme ça ? Non, on va faire le même tour. 0%. 0%. 0%. Celui-ci va être 0% à celui-ci va être 0%. Donc on a tout ça ? Non, essayons de le jouer à nouveau et voyons ce qu'on peut obtenir. Donc nous l'avons ici. Ensuite, si nous cliquons ici, vous pouvez voir qu'il vient d'un haut de bas qui est joué à nouveau. D' accord. Il vous dit que ce sont les actions possibles. C' est ainsi que vous faites les animations de type en utilisant le prototypage. J' espère que vous avez apprécié cette leçon si vous avez des questions, des suggestions ? Assure-toi de me le dire toujours. Passons à la leçon suivante. 50. Conception d'écran de recette d'ingrédients: dans les prochaines vidéos, nous allons créer ces ingrédients de recette unique et profession de recette unique, ces deux écrans et cette superposition. Et ces deux-là, je vais sauter le profil et les paramètres et celui-ci est presque similaire à ce désert ici. Donc je vais sauter ça et je vais vous le laisser et vous allez faire ça. Vous avez déjà vu ça. Je vais orteil Inclure tous ces liens d'application afin que vous puissiez les voir et vous pouvez créer votre propre comme votre affectation. Ça va superposer. Et ces deux recettes simples que je vais finir parce que ce sont tous ces écrans qu'ils vont finir toutes les techniques que je vais vous montrer à l'intérieur de Sigma Onda Thies. Ce sera un répétitif que je pense que je n'aime vraiment pas. Les orteils le font maintenant. Alors commençons avec un seul ingrédient de recette et puis je vais revenir à vous et aller voir vos devoirs et ce que vous avez fait et vous avez créé Non Commençons et commencez à envoyer l'écran de recette unique. Nous allons revenir à la façon des orteils étaient avant. Et je pense qu'on a besoin de quelque chose ici, comme celle-ci salades, et je vais reproduire ça. Répliquons mérite cette fois. Donc je vais répliquer celui-ci et zoomer et je vais l'appeler simple. Oups. Que s'est-il passé ? Simple. Ce serait bien. La première chose est qu'on n'a pas besoin de ça au sommet. Aussi, notre cette image, il va aller ried. On n'a pas besoin de celui-là. Et ça va rester ici la même chose. Ça va rester ici la même chose. Euh, ça va aller orteil. Va-t'en. Et maintenant vous allez le déplacer comme ça, et nous allons l'étendre en appuyant sur Shift. Voyons comment parfait se développe. Ok, donc c'est ce Look marqué. On n'a pas besoin des coins arrondis ici, donc on va aller à l'intérieur de cette mosquée. On n'a pas besoin des coins arrondis ici, Utilisons zéro. Donc, nous avons des coins de rue. Cette flèche va être blanche maintenant, et non, nous devons agrandir cette image. Donc ce que nous allons faire, c'est que nous allons voir ce groupe de mosquées, ce rectangle ici, en fait, et nous allons le faire glisser en bas comme ça. Donc, créons un T 100 puis hauteur ou angle de dissection. Redimensionnons cette image ou ici, comme ceci. Déplacez-le à l'intérieur. Enlèverons trop la hauteur de ça, accord ? Et puis nous allons aussi déplacer ces ce titre ici aussi dur. Je vais sur ces trois en bas quelque part, et c'est notre Dag le cerf en vedette. Nous devons aussi le déplacer ici comme ça. Ok, donc c'est fait. Une autre chose est que nous devons changer trop maintenant parce que nous voulons montrer nos icônes en haut. Donc je vais aller à cette superposition. Allez à cette superposition. C' est en fait linéaire. Donc je vais déplacer ce gris en haut par ici. Maintenant, euh, quelque part ici comme ça, pourquoi ça va être dans cette zone là, rendre un peu plus sombre comme ça parce que nous avons une très grande image. Non. Ok, donc maintenant je pense que notre flèche arrière est une grande visible maintenant, euh, ok. Donc, si vous voulez en faire un peu plus. Essayons d'utiliser un gros plus sombre ici comme ça. Comme ça. C' est à vous de décider. C' est à vous de décider. Qu' est-ce que tu veux faire ici ? Ok, donc j'aime ça comme ça. Maintenant, je vais ajouter plus d'icônes quand sa part je vais courir ce coeur que j'ai si tu n' aimes pas ce fonds alors voici ma part. Je fais appel à celui-ci et à mon icône de cœur ISS, celui-là. Donc je vais au bateau de crabe de leur ex les a déplacés à l'intérieur. Jane Doe coloré blanc comme ça il a certainement gagné sur la grille des lignes de grille et les déplacer dans la droite. L' art va être fini. Allons le déplacer ici et plus ça comme ça. C' est un bon contrôle. Expédiez quatre ou contrôlez G pour les cacher. Maintenant, nous avons fait la partie supérieure ici. Maintenant, nous allons passer au reste du fond, alors diluons celui-ci. Ces trois espoirs que je pourrais Nuit ont besoin de celui-ci. Utilisons-le pour les ingrédients. Vous allez avoir une navigation ici. On est là quelque part, donc on a besoin de celui-là. Diluons tout le reste. D' accord ? Maintenant, nous allons dessiner quelque chose ici pour montrer les statistiques de ça. Donc nous allons avoir quelque chose ici comme ce 48 qui est utilisé 48 quatre. Il va être blanc. Et ici, nous allons montrer certains des départs comme à la maison d'une minute à l'autre pour combien de portions de personne et combien de kilocalories cette recette est. Alors faisons-le. On va utiliser ça et un de plus. C' est ce qui était la 1ère fois dans cette horloge. On va traîner tous ces trois dans Sigma et on va utiliser cette horloge ici . Celui-ci va être ici. Celui-ci va être ici. Le reste de la chose est l'alignement et les couleurs. Donc le tueur sera celui-là. C' est en fait vert moyen. Nous ne voulons pas qu'ils soient très mis en évidence parce que ce n'est qu'une information. Utilisez une porte. Nieto, cliquez dessus encore et encore ou faites quelque chose à leur sujet. Et je pense que les magasins doivent aussi être comme ça. C' est du texte utilisé ici. 30 signifie 30 minutes qu'elle était un espacement. Six. Nous allons utiliser votre Ramana Déclignoter parce qu'il nous faut une très petite porte quatre , petite taille 14. Et la couleur sera comme ça. Ou peut-être comme ça. Comme ça. OK, donc la même couleur que l'icône et je vais l'aligner comme ça. Quatre personnes, quatre personnes ont été marquées. Quatre personnes et 1,5 kilo de calories. Quelque chose comme ça. Assurez-vous que vous nommez ces icônes parce que pour le moment je ne les nomme pas. C' est de l'énergie. Donc non, je vais juste les aligner. Et d'après ce bar ici et juste essayer de voir ce qui me semble mieux. Vous pouvez voir quoi ici ? Les combats ici sont moins nombreux. Je dois juste, vous savez, résoudre ces problèmes. La distance entre les deux est de quatre. Donc ça doit être six. C' est un peu beaucoup. C' est un pour sept six. Cela a l'air génial Suivant, leur permettant de voir Ok, ça semble mieux maintenant. Beaucoup mieux. Neuf. De là, nous avons 13 sélections. Faites-le Dan. Nulle part ici et alors aussi d'ici maintenant ce corps est presque fini. J' ai un problème. Ou ici, nous avons beaucoup d'espace, donc je vais l'aligner au milieu juste en utilisant mes yeux. Je n'essaie pas d'être très pixel parfait ici. Donc maintenant prochaine naissance cette barre de menu ingrédients ici. Donc je vais utiliser vous pouvez utiliser une ligne. Utilisons une ligne en dessous. Décalez pour le rendre droit. Faisons deux pixels. Nous allons utiliser la couleur majuscule B Round sera cette couleur bleue. Qu' est-ce que c'est, Bill ? Non, on n'a pas besoin de Facebook Blue. Quoi ? On a besoin de notre bleu violet ici. Je pense qu'on ne l'a pas ajouté à nos couleurs. Utilisons ceci et ajouté à d'autres styles. Bleu au deuxième degré. C' est notre bleu. Ce n'est pas Facebook. Un indice. Donc, nous l'avons échangé à notre bleu primaire, celui-là. Ok, donc ça va être un peu plus proche. Quatre grands, ce qui devrait être 105 Ok, donc ça a l'air génial. Maintenant il nous en faut un autre ici, qui va être Déplaçons ça dans ce groupe avec ce groupe. Donc ça va être à l'intérieur par ici. Recette. Ok, donc nous l'avons dans cette recette, une petite section. Donc, il est à l'intérieur, en fait petite section. Euh, cette ligne va bouger, et, euh, nous avons aussi besoin d'états par ici. Alors, commande, gardons ça comme ça. Nous allons juste changer les couleurs et déplacer cette ligne en déplaçant la vie exclue. Ligne mobile. Maintenant, je vais répliquer ça. Ok, maintenant, ça ne va pas être mis en évidence. Donc nous allons utiliser une autre couleur comme celle-ci vert moyen. Ça a l'air bien. Cet ingrédient est en fait vert foncé, celui-ci. Donc, notre menu est également prêt. Voyons combien la distance est d'ici. Il garde 36. Nous voulons avoir un bon espace autour de lui. Donc, l'utilisateur n'a pas de difficulté est de passer ici dans cette section ou ici. Maintenant, nous allons énumérer les ingrédients ici. C' est très facile. Ce n'est qu'une liste. Je vais préparer la 1ère 1 et vous reposerez, nous allons répliquer. Alors commençons. Et nous allons utiliser. Ou ici 10 j'étais Salman Fish poisson. Ensuite, nous allons utiliser une ligne à une autre par ici, et la ligne va être décolorée. Ou peut-être cette décoloration. Donc, nous voulons être très légers. Nous ne voulons pas qu'il soit très important ici, parce que ce n'est qu'un séparateur. Donc, utilisons le commun off. Et je vais voir Pete Dexter dans la couleur pour être quelque chose comme ça. Je vais séparer les rôles d'alors quelque chose comme ça. Ensuite, nous allons utiliser le même Laissez l'opacité off 80% parce que c'est juste séparé ou 50% cela semble mieux. Je ne veux pas qu'il soit très important. Et ah, qu'est-ce que je cherchais ? Je cherchais cette adresse ici. On veut qu'on utilise le même ou c et on va le placer ici. Oups. Ou ici. Allez, télé. Donc ça va être ou entendre quelque chose comme ça. Donc, chaque fois que l'utilisateur tape ici, il va être activé. Donc, nous avons, Par exemple, nous avons cet article préparé ou nous l'avons avec nous. Ensuite, utilisez un peu plus comme ça. Suivant. Regroupez-les maintenant d'ici à là. Mark Control G, voici notre recette. Sois le repos C B. Donc c'est fini. Élément de recette que nous pouvons également créer si vous voulez créer un composant, vous pouvez créer un composant. Et ça serait utile pour et, euh, ça bouge un peu vers le haut. 49. Allons 40 barbe. Grande distance entre ceux-ci et nous reproduisons vraiment ça. Créons ça. Allez, contrôle D. Allez, X. tu vas le déplacer au guide de style par ici. Oups. Comme ça. Si vous voulez changer le paramètre, par exemple, si vous voulez les déplacer à nouveau dans un groupe, je peux l'appeler icône et vous voulez le déplacer ici dans la destruction en bas et à droite, vous pouvez les réparer. De même pour celui-ci, je vais le fixer à gauche et en bas. Donc, c'est à vous de décider. Je ne vais pas entrer dans ces détails de conception trop nombreux parce que je vous ai déjà appris. Maintenant, nous allons juste répliquer ça comme ce matin D dd knee de et D. Donc nous avons la liste de tous ces articles. C' est que je vais les sélectionner tous et je vais aller aux pieds. Qu' est-ce que c'est ? Supprimons ceux-ci. C' est vide pour les hymnes ? Ils sont tous sélectionnés. Oups. Verrouillons ce fond. Il y avait ça me donne des maux de tête. Aussi, cet arrière-plan, j'ai déplacé serrure. Donc, je veux sélectionner seulement ceux-ci. Maintenant, je vais m'en servir. Alors améliorons ça un peu plus. Je veux plus d'espace, Dean. 20 ou peut-être plus de 20. Semble 24. Ok, donc je pense que 24 a l'air mieux. Donc on ne va pas juste changer ces ponts ici. Et une chose de plus est que je vais orteil augmenter la hauteur de celui-ci et aussi l'arrière-plan . Donc, je suis allé déverrouiller l'arrière-plan est l'arrière-plan est le numéro de sac. C' est un coup. Il le redimensionne comme ça. Alors, je vais être voyou dans la serrure. Nous avons besoin d'un bouton ou d'un cheveu qui dit de commencer à cuisiner quelque chose comme ça. Donc, nous allons utiliser notre bouton standard cette école à notre guide de style. Donc quand on essaye les pieds, on change la cachette de ce tableau d'art, on peut voir ces icônes. ce tableau d'art, Ils ont été foirés. Maintenant, ce problème se produit lorsque nous avons l'échelle définie. Alors n'essaie pas d'orteils quand tu en as. Une icône par ici. N' essayez pas d'utiliser l'échelle, mais ce que cela va être un problème. Donc la prochaine école de retour que c'est vraiment arrivé. Ok, donc nous les avons de retour. Voyons voir, Quels sont les changements ? Ok, donc une chose que vous devez remarquer est lorsque vous essayez orteil, si vous sélectionnez, cet article entendra cette icône double-cliquer dessus. Vous pouvez voir si nous essayons d'utiliser le droit et le bas, le fond se passe réellement avec celui-ci. Donc c'est ce prétendu orteil en bas ici, vous pouvez voir la ligne descendre. Donc, si j'essaie de changer de haut en bas, il va aux pieds. Reste ici. Donc je pense que nous devrions vous arrêter et à droite plutôt que d'utiliser Donc il ne va pas descendre, à droite et en haut. Donc c'est mieux. Vous pouvez voir celui-ci est centre d'arrêt et celui-ci est laissé. On ne veut pas qu'il soit au fond. On voulait bouger avec le haut. Alors, déplacons-le maintenant. Avec succès et ça ne va pas tomber comme ça. Et c'est Jane. Cela créons un mais personne ici. Nous allons faire glisser notre même bouton avec l'icône, mais cette fois nous n'avons pas besoin de l'icône. Donc, ce que nous allons faire, c'est que nous allons à Ceci est l'instance que nous allons délier l' instance. Donc parce que nous avons besoin d'un autre bouton avec sans l'icône afin que nous puissions faire un clic droit sur celui-ci et nous allons utiliser l'instance de Dat Maintenant, une fois que l'instance a été détectée, nous allons supprimer cet Ikonomou ici et pour ce texte, nous allons le déplacer à l'intérieur au milieu. Ce sera un texte aligné au milieu, et nous allons le renommer jambes. Commencez à cuisiner. Ok, donc maintenant c'est un bouton bleu. Nous ne voulons pas que ce soit Facebook bleu. Nous voulions Toby notre couleur verte, qui est notre vert primaire. Non, nous avons ajouté plus de couleur. Non, nous allons double-cliquer et aller à cet arrière-plan. Mais et plutôt que d'avoir la couleur simple, nous pouvons avoir un radiant linéaire. Donc je vais aller avec vraiment ingrédient et on va avoir quelque chose comme ça de gauche à droite. Et nous allons utiliser la même galera ici presque la même chose un peu. Sur le côté plus léger. Vous pouvez voir ou entendre ce look créer. Maintenant, vous pouvez voir que cela a une teinte plus foncée d'un côté et l'eau plus claire et plus nette sur le côté droit. Donc, ici, nous avons le deuxième bouton, et maintenant ce que nous pouvons faire est que nous pouvons facilement créer une autre instance ou une autre. Vous pouvez voir primaire, mais ce sera donc un autre composant. C' est donc notre composant maître. Appelons ça Burton. Une commande de contrôle simple e. Je vais déplacer mon composant Marcia à mon style. Cerf-volant par ici. Donc, ici, nous avons deux sortes de prétention que vous pouvez voir d'un côté à l'autre. L' un est ce bouton avec Icahn. Deuxième est, mais dans l'icône sombre. Donc, nous allons l'école de retour ou principal conçu. Alignons ça au milieu comme ça, comme au milieu. Voyez si c'est au milieu de ce que je pense. Oups. Allez, G suivant, appelez-les des recettes. Ça va être dans la porte du milieu. Que s'est-il passé ? Sélectionnez tout ça, Margie, et ils vont être dans un groupe. Faites-les au milieu maintenant c'est au milieu. Maintenant. Le reste est que vous avez juste à changer toutes ces icônes. Donc, ici, nous allons cacher ce facteur et cette ellipse qu'il va être vide. Donc nous allons utiliser Vied et nous aurons de la paille qui va être opposée. Donc ça va être mieux comme ça comme ça. Ok, donc si on a quelque chose vide ici, on va utiliser quelque chose comme ça. Le reste est que je dois juste changer tous ces moyens de texte. J' ai donc gagné le texte. Maintenant, nous allons le tester dans le prototype ici. Donc je vais lier mes desserts ici. Cette image, je vais le lier donc cela ici. Donc ils s'attendent à ça et le déplacent ici comme ça. Commencez n'importe quelle minute intelligente et mariée Easing est sorti. Passons à notre Désolé, celui-là. Ce n'est pas un. Jouons à ce Sellers signifie et déserts. Donc, sous l'écran du désert, nous allons orteil klik Ceci et vous pouvez voir ceci est l'effet. C' est vraiment sympa. Donc, nous devons le relier. Donc, si quelqu'un clique sur le bouton Retour plutôt que d'aller ici, il va revenir aux salades. L' écran de l'homme. Oups. Que se passe-t-il ? Celle-là. Diluons ça. Donc ça va retourner dans les desserts comme ça ? Vérifie ça. Vérifiez que ça mérite de revenir en arrière. Oups. Donc revenir en arrière, c'est un peu différent. Intelligent et émir. Voyons voir ce qui se passe chez Cletus remontant à 80 ans ici. Nous devons sélectionner le poignard 80 en fait. Et ça va retourner dans le désert, pas passer à autre chose. Mais nous allons naviguer vers Smart. Tout mérite est dans son dehors. Qu' est-ce que le 2ème 1 ? Donc, nous en avons un. Et si nous sélectionnons le 2ème 1, nous voulons le supprimer. C' est plus supprimer. C' est tout ce dont nous avons besoin. Ok, donc c'est un fait que je cherchais. Vous pouvez voir si on fait défiler celui-ci. Vous pouvez voir que nous avons ce bouton. Commençons à cuisiner. Très gentil. Cruel. Ok, donc ça va mettre fin à cette leçon. Nous allons créer une autre préparation d'écran, ce qui est presque similaire à celui-ci. Beaucoup d'Urgh répétitif sur le nouveau. La prochaine sera trop, alors passons à la leçon suivante. 51. Prototyping d'écran de recette: dans cette vidéo, nous allons créer la prochaine reine, qui sera des préparatifs. Donc nous allons répliquer le départ, mais répliquer ceci en répliquant celui-ci. Donc on va répliquer ça et on va bouger cet orteil ici. Donc cette ligne mobile va être déplacée ici. Taille d'échange orteil 100 102. Tu as dit que celui-là a l'air bien. Changeons ça, Sculler Toe celui-ci. Oups. Celui qui est plus sombre et a dit que ça va être dans cet état. Donc nous avons déjà Jane, ça. Maintenant, nous allons aller dans ce domaine. Notre ici. Donc, nous allons tout supprimer ici sauf le haut. Et maintenant, nous allons appeler un plutôt que le groupe un. On va appeler ça les étapes des opérations. C' est donc notre premier pas. Donc je vais appeler ça l'étape 1, et on va le faire, non ? Cliquez et acte, agissez. Déjecté. Instance. Donc, une étape pourrait avoir besoin de cette ligne. C' est diluer ce régal. C' est ce que je peux faire. J' avais juste besoin de celui-là. Ok, maintenant, ce qu'on va faire, c'est qu'on a un rectangle d'eau par ici. qui va encore être de couleur blanche. Ce sont nos pas. Donc ça va être blanc, blanc, blanc, et ça va être le fond de cette première étape. Nous sommes ici dans ce groupe. C' est en fait un cadre. Essayez donc d'utiliser des cadres lorsque vous voulez avoir un peu plus de contrôle sur les contraintes, ces contraintes. Ce sera donc nos frais généraux imposés à l'intérieur. Donc nous voulons qu'il soit détaché. Et nous voulons utiliser un correctif. Bizarre comme ça, quelque chose comme ça. Nous avons donc cette largeur fixe. Cela va être en mesure paragraphe idées dures. Qu' est-ce que c'est ? Estes. Étape 1. Ok, donc nous ne sommes pas concernés par la hauteur et nous avons arraché celui-ci. Échangez ses hauteurs, euh, à il y a un groupe d'orteils changeant parce qu'il se comporte très différemment. Maintenant, nous avons les soupirs du groupe. C' est le déplacer ici. Force a essayé de réparer tout ce que vous avez averti, puis convertir en cadre parce que nous cadre est en train d'essayer orteil utiliser sa propre hauteur et Brits donc nous n'avons pas besoin de cela. Ce sera donc notre paragraphe. Alors maintenant, je vais m'en servir. Ok, donc ça va être mon 1er 1, alors je vais utiliser la rondeur de quatre. Euh, d'accord. S 4 a l'air bien, et puis on va utiliser une icône ici. Avant ça, on va nettoyer les orteils sur un enchevêtrement par ici. Et ce qu'on va faire, c'est que ça va être là aussi. Ce sera zéro. Ça va aller avant, et ça va être Oops. Tellement désolé. Ça va être zéro orteil. Donc, en fait, j'essaie de créer les mêmes angles ici. Donc nous en avons deux. Ici, nous en avons quatre, ce qui n'est pas égal à ce, euh, blanc ou ici. Maintenant, nous allons utiliser notre Calero orange ici. Faisons un peu de couleur plus claire. Alors ajoutons-le dans le maïs orange clair. Et maintenant, vous allez avoir un polygone, qui va être notre bouton de lecture. Faisons tourner l'orteil. 90 degrés. Oups. 45 degrés. Que se passe-t-il ? Moins 90. Victoire. Utilisons un grand rayon de vente qu'elle était de cette couleur verdâtre. Lex, réduisez l'exercice aussi. 16. Ok, donc ça a l'air carré. Donc, chaque fois qu'un utilisateur clique ici. Il ou elle va voir cette étape dans une vidéo. Donc vidéo avec Bob et ils verront cette étape. Donc, c'est presque terminé maintenant je pense que nous devrions le convertir en cadre. Et nous allons supprimer ce groupe. Nous allons au groupe de l'ONU ceci. Maintenant, nous avons un seul contexte. Lorsque cela, nous avons un polygone rectangulaire, Cela va être une icône. Déplaçons le dans ce cadre. Et cette icône sera à gauche, en bas, à gauche dans la bouteille. Ça va être à gauche et en haut. Ok, le cyclone va être dans le fond. Cela va être laissé en haut et c'est tout ce dont nous avons besoin. Ok, donc une autre chose est qu'on doit ajouter une couche d'attaques ici pour le titre. Donc pour le titre, on va utiliser l'étape 1, sortir l'œuf. Donc ça va être notre méchant cap. Et pour cela, nous allons utiliser, euh excusez le même fort mourir féroce et nous allons utiliser la couleur qui va être notre vert vert. Excusez celui-là. Donc ça va être notre couleur verte plus nette. Donc, ce sera la première étape si nous voulons. Nous pouvons aussi utiliser celui-ci. Ce n'est pas un problème pour nous. Alors utilisons ceci pour zoomer. Et c'est notre étape principale. Alors maintenant, nous allons répéter ça. On va les regrouper ensemble, et on va répéter ça. Voici nos étapes Étape et répliquons ceci et déplacez-le vers le bas comme ceci. On a besoin d'un thé au moins 16 ans. Faisons 20. Allez, de. Allez, D. Donc maintenant, je vais utiliser seulement trois étapes qui ont utilisé ces trois étapes. Non, on va changer sa taille. Nous pouvons voir que cela va très bien parce que c'est un cadre et nous avons déjà l'objet d'une contrainte ici. De même, pour celui-ci échangera la taille de la même manière. On peut ralentir cette étape de préparation et on va la bouger comme ça. Ce sont donc nos quelques pas. Déplaçons cette rupture ici. Et cette fois, nous avons besoin de quelque chose avec, hum avec une icône. Ceci ici, Supprimons ceci. On n'entend pas 48 pour l'air dans la distance entre ces deux pour l'icône, on va le changer. Sélectionnez les couches scolaires. Icahn scelle celle-ci. Ok, donc pour ce truc d'icône, je dois vous montrer que si vous voulez ajouter une icône ici, vous ne pouvez pas ajouter une icône comme celle-ci. Vous ne pouvez pas glisser-déposer un Nikon, par exemple. Par exemple, celui-ci à l'intérieur de celui-ci, ce n'est pas comme ça. Il ne va pas vous laisser ajouter. Je tente de votre instance. Donc, au lieu de passer par ici, nous allons aller à Sy Guide le composant maître de charge. Nous allons ajouter une autre icône. Laisse-moi te montrer le truc. Donc nous allons ajouter sur cette icône ici. Donc, nous avons notre icône que vous pouvez voir. Non, c'est à l'intérieur de celui-ci. Et, euh, on va changer sa couleur trop large. Elle était plus blanche, et on va la cacher ici. Donc, quand on veut traîner quelque chose, laisse-moi te montrer comment on va l'utiliser. Donc nous avons ce bouton maintenant et simplement nous allons cacher cette icône et montrer le cycle. Donc c'est tout ce qu'il nous faut faire. Alors laissez-moi voir si nous pouvons l'aligner correctement, parce qu'il n'est pas au milieu. Ok, donc maintenant c'est au milieu. Ok, donc cette porte dérobée de l'école veut dire le design et l'échange, et je vais changer sa couleur deux. Ok, Donc encore une chose, nous allons ajouter ce bouton BGN, et nous allons l'ajouter à nos styles de couleurs. Ce sera un int Grady très vert. Ok, donc on n'a pas de super. Et par ici, donc une fois que nous aurons notre ingrédient, nous allons assouplir ce contexte, et nous allons passer à Big Radiant. C' est tout ce que nous avons à faire ici. Donc c'est comme ça qu'on a fait ça ? Essayons les orteils. C' est une chaussure d'orteil éprouvée, notre navigation en bas par ici. Ok, alors rendons ça un peu plus petit comme ça. Aussi ce contexte plus tôt ? Non, pour celui-là, nous avons besoin d'un média de profondeur qui va être ici. Deux zones, en fait. Quoi ? Ça ? Celle-ci à la vérification. C' est celui-là. Donc ça va être préparé poignard. Et ça va être un ingrédient. Oui. Donc je vais juste les cacher de 0%. Et maintenant, nous allons aller prototype des orteils et simplement allaient orteils utiliser quelque chose comme ça. Glisser-déposer ne soyez jamais trop intelligent. Et il a fait. Et à partir d'ici, nous devons aussi déloger les deux, euh, Lears la plupart de ces couches ici aussi. Quelque chose comme ça. Alors déplacons ça ici. Excusez celui-là de revenir en arrière. Maintenant, nous allons tester notre prototype. Voyons ce qu'on a fait ici. D' accord ? Cela a l'air bien, et nous pouvons descendre et nous pouvons cliquer ici, et il va aller à notre revue pop up, que nous allons faire dans la prochaine leçon. Donc, nous avons des ingrédients et de la préparation. Maintenant, si vous voulez montrer la progression et les déplacer vers le haut, les déplacer vers le haut, vous voulez montrer la mission que vous avez à faire la même chose que vous avez orteil sélectionner tous ces, et thats groupe les contrôler. Allez. G X les appelait pas. On va aller aux pieds. Allez, tu vois ? Et on va les baser ici. Donc ici, nous les avons comme ça. Et à l'intérieur de ce groupe, on va les déplacer en ville, positions de Jayna. Et maintenant on va cacher ça. Donc, vous allez utiliser 0% pour l'opacité. Voyons ce qui se passe ici. Vous pouvez voir quand ils sortent comme ça, vous pouvez également ralentir l'animation ou ici. Donc, si vous voulez ralentir l'animation sur le mouvement ici, vous pouvez sélectionner ceci et nous avons 300 millisecondes que nous pouvons utiliser pendant 50 secondes. De même, pour celui-ci, nous pouvons utiliser 3 50 Voir, quel est l'effet maintenant ? Vous pouvez voir que ça a l'air mieux quand on a, euh, ce genre de réglages. Donc ceux-ci viennent très bien comme ça. Donc, cela se termine sur ce prototypage dans tout cela, je vais créer un écran de plus qui va être trop et reste des écrans et de l' application majeure. Vous allez concevoir pour moi et me montrer ce que vous avez attrapé. Alors passons à la leçon suivante et où nous allons concevoir nos orteils sur l'écran, et je vais vous montrer comment les orteils utilisent cette superposition pop-up et fig MMA 52. Référer des transitions de superposition: dans cette leçon. Nous allons créer cet écran trop dans fig MMA et où je vais vous montrer comment orteil pop up cette superposition et le cacher quand quelqu'un soumet des commentaires. Donc on va retourner à l'endroit où on est restés. C' est la section où nous sommes partis et maintenant vous allez créer un écran de superposition ou ici , qui va être un combat. Donc, nous allons aux pieds, créer un nouveau cadre et il sera de notre propre taille. Ce sera le cas. Il sera 328 pixel vied parce que nous voulions à l'intérieur de cela. Laisse-moi te montrer. Donc si je dragon que vous pouvez voir ici, vous pouvez voir qu'il va être dans ce conteneur. Donc, nous allons utiliser 330 et la hauteur sera de 400 70. C' est juste et vous pouvez voir l'estimation et nous voulions être des coins arrondis. Donc, je vais en utiliser quatre ici. Vous pouvez utiliser augmenter plus, par exemple il, par exemple, comme ceci qui va fonctionner aussi bien. Aussi, si vous voulez orteil, ajoutez un peu d'ombre, c'est à vous de choisir. Mais en ce moment, je vais utiliser du texte ici. Connectez-vous comme, hum, boue. Ok, donc le tueur qu'on va utiliser va gagner celui-là. Donc, cela va être une couleur de lien que je suis déjà connecté à partir du haut. Je vais en avoir 30 de la gauche. Je vais avoir 20 de moins. Gardez-le pointu. Quelque chose comme ça. Puis en descendant. Nous allons avoir une sélection de notation, donc nous allons montrer à l'utilisateur quelques fanées beaucoup ici. On va utiliser le bouton d'action. Et la couleur sera cette sombre, noir verdâtre se séparant. Et nous allons utiliser le même, euh, ce Starwood ici qu'elle était la star. Basons ça ici. Le classement des étoiles. Et maintenant, en fait utilisateur navires de guerre Electric. Donc on va augmenter sa taille. Il y a la serrure. Utilisons les compétences ici. Et je pense que celui-ci est bon. Je pense que nous pouvons aussi augmenter la distance entre eux en haut comme ça. Donc, je vais sélectionner la touche Maj enfoncée, et je vais l'utiliser. Répartir l'espacement horizontal, l'espacement horizontal. Donc c'est ça semble mieux. Nous voulons avoir une certaine séparation entre eux afin que les utilisateurs puissent facilement le savoir, cependant. Laissez cette lecture. Donc, nous allons en avoir 14 entre ces deux. Excusez-moi encore une fois, et je vais utiliser la bonne critique, et ensuite nous allons avoir une boîte de texte ici dans ce manuel. Elle était qui va monter son avis. Il y a un mensonge sur eux à gauche, comme ça. Ok, donc je vais réduire la hauteur de celui-ci parce que nous avons aussi besoin d'un fardeau. Étaient là, donc je vais utiliser à nouveau. Quatre existent. Excusez ceci ou ici. Le pire. On va utiliser des observations inversées par ici. Ajoutons un peu de trait. Ça va être ça. Il a utilisé une couleur plus claire comme celle-ci. Ça a l'air mieux. Maintenant, nous avons besoin d'un mais et nous allons aller les actifs orteils, et nous allons utiliser sur simple bouton ici, et nous allons changer la taille. Ok, donc on doit mettre ce bouton dans notre donc on doit mettre ce bouton dans notreguide de style et voir ce qui se passe ici. C' est au milieu. Euh, salut. Hors mot. Et, euh, ça va rester au centre et en bas. Alors voyons maintenant, veste maintenant dans le design. D' accord. Donc juste à regarder. D' accord. On a juste besoin de changer la couleur du pardon ici. On va aller avec nos espoirs. Euh, donc on va aller avec notre couleur unie qui va être à propos de cette couleur bleutée. Donc je vais l'utiliser cette fois. Donc je voulais être plus proche de ça. Et nous avons Nous voulons avoir un peu d'espace en bas. Vous pouvez également augmenter ce cadre dur. Ça va être nos lèvres. Laissez-moi vous montrer ce qui se passe ici. Donc, c'est que vous pouvez voir que c'est mis à l'échelle. On voulait être à gauche et en haut. Nous ne voulons pas que le gonflement des compétences va les déplacer maintenant. Et ça a l'air de Crète. Maintenant, un peu d'espacement vertical. Ok, donc c'est bien. 30. C' est 21. Ça va être 20 en retard pour D. Donc nous avons ce, euh, conçu. Ce sera notre superposition. Et ce texte va être soumis. Soumettre un avis ? Non, à l'écran. Quand quelqu'un essaie de cliquer sur ce prêt à manger maintenant, Bouton. On va leur montrer ça trop. Donc, une fois qu'ils ont tout terminé, ils ont préparé le plat. Nous voulons qu'ils laissent un commentaire ici. Donc, pour ce faire, nous allons lier ça, mais jusqu'à ce début. Donc, on va aller au prototype et ça bientôt sorti. Et nous allons lier ce fardeau à cela et sur le robinet. On ne va pas aux pieds Jamais faire. Mais on va trop utiliser cette ouverture. Donc, dans cette section ou ici, cela va être trop. C' est superposition. Nous essayons l'utilisation des orteils et il y a des options comme le centre dob gauche. On va l'utiliser en bas centre. Utilisons ce centre inférieur et nous allons utiliser déménagement et il va se déplacer à partir du bas comme ça. Utilisez ensuite 400 millisecondes et dépoussiérons cela dans notre application. C' est là le fardeau. Donc, si j'ai pressé prêt à manger, vous pouvez voir ou entendre. C' est un pauvre livre comme ça, mais nous avons besoin d'un arrière-plan. Donc, euh, sur cette sélection, nous sommes là. Donc voici notre injection cette interaction. Nous voulons qu'il se ferme lorsque vous cliquez à l'extérieur. Nous allons orteils ajouter trop derrière. Donc je voulais être 50% et voyons ce qui se passe maintenant. Donc, c'est l'effet en fait. Donc, si nous cliquons à l'extérieur Donc maintenant si nous cliquons sur ce bouton, vous pouvez voir que c'est comme ça qu'il apparaît comme ça qu'il descend. Donc aussi, vous pouvez cliquer, Vous pouvez utiliser le bouton soumettre et vous pouvez le lier en arrière Cet écran principal qui vous remercie aimerait quelque chose comme ça Ou peut-être commencer à aller quelque chose de nouveau, quelque chose comme ça. Ainsi, vous ne pouvez jamais obtenir tout ce que vous pouvez parcourir pour revenir à cet écran. C' est à vous de voir. Alors testons-le maintenant. Et si on clique ici, d' accord. Donc, vous devez voir qu'il va orteils. Retourne. Il va déménager maintenant, et ce sera Will est dans ses magasins. L' utilisation est éteinte. Donc je ne sais pas pourquoi ça me donne un idiot quand ça revient. Smart et image rencontrée dans les années est en dehors, emménager, déménager en fait, donc il va déménager. J' utilise l'emménagement. C' est pour ça qu'il fait ce crétin. Ok, c'est qui est au carré. Donc, il se déplace très rapidement. C' est bien. Donc, je pense que cela va finir notre voyage avec cette application. J' ai laissé quelques écrans parce que je pense que c'était un travail réparateur. Je voulais te montrer ça trop comment ça sort du tuyau, bouge. Il se déplace dans la façon dont nous faisons toute mission hors de cette sélection ici valeur est mort. Comment ? Nous montrons ces résultats et toutes ces choses différentes. J' espère donc que vous avez apprécié cette leçon. Si vous avez des suggestions que vous voulez apprendre quelque chose de moi, vous pouvez toujours me demander. Vous pouvez me contacter. Je suis ouvert aux questions. N' oubliez pas de me poser des questions. Chaque fois que vous êtes frappé. Je suis là pour toi. Continuons et apprenons quelque chose de nouveau. 53. Application de projet en 6 écrans: Maintenant, vous avez appris tout ce que je vous ai montré comment j'ai conçu toute cette application. Maintenant, il est temps de créer n'importe quelle application. Vous pouvez effacer l'application de recette si vous le souhaitez, ou vous pouvez créer n'importe quelle application votre propre idée. Je ne te limite pas. Donc, créez une application avec au moins 6 à 7 écrans. Au moins six écrans qui vont faire la transition. Ils ont des effets de transition. Ils ont des effets de mouvement, effets surgissant. Ils ont quelques superpositions qui sort avec un certain temps eso créer ceci. Donc, je vais vous montrer au moins cet écran de connexion. Ensuite, nous avons ce Minsk là-dedans. Nous avons quelques transitions et puis un écran avec un certain mouvement orteil un autre écran, qui est un seul objet ou un seul fichier ou un seul enregistrement. Peu importe ce que vous appelez ça, alors nous avons les constructeurs de recherche quelque chose. Je veux que tu crées quelque chose comme ça. Vous pouvez voir cet effet déménager, emménager. Donc, je veux que vous fassiez un effet comme celui-ci. Aussi, les écrans se déplacent vers le haut. Enregistrez vos conclusions sont recettes trouvées ou vos enregistrements téléphonent quoi que ce soit. Popping up up un par un de Bordeaux et en bas. Donc c'est la mission que je veux de toi. Alors commencez à le lire maintenant. Au moins six écrans. Si vous voulez augmenter les écrans, je limite le nombre d'écrans. Je vous donne les derniers chiffres parce que je pense que le temps ne devrait pas être perdu. Si vous créez, si vous l'êtes, vous pouvez avoir. Si vous avez beaucoup de temps et que vous voulez créer comme, 10 écrans, allez-y. Je n'ai pas de problème, mais six écrans, au moins donc je peux faire différentes transitions. Comment vous passez d'un schéma à un autre et avez-vous utilisé le robinet de votre zone cible, ce qui est une expérience utilisateur très importante. Point sur la convivialité Point de vue. Beaucoup de designers qui n'utilisent pas ce robinet zone urbaine, donc il va manquer hit la plupart du temps. Donc c'est votre mission. Créez un AP complet 6 à 7 écrans ou 10 écrans, tout ce que vous voulez avoir, et montrez-moi toutes les transitions, comment tout fonctionne autour de cette application. J' adorerais voir vos idées que je lis pour votre mission, alors commencez à le créer maintenant. 54. Merci et quoi en ensuite et à la prochaine: Maintenant, merci beaucoup d'être avec moi pendant toute cette durée de temps et d'apprendre avec moi, j'espère que vous avez appris quelque chose d'utile. Si vous n'êtes pas en mesure de comprendre quelque chose ou si vous avez des questions, vous pouvez toujours me contacter via cette plateforme. Vous pouvez toujours me contacter via mon site web. Ensuite, vous excited.com. Vous pouvez me contacter, vous pouvez m'envoyer un e-mail. Vous pouvez me rejoindre sur les réseaux sociaux et me poser des questions ou n'importe quoi, toutes les questions que vous avez concernant la conception de l'expérience utilisateur, la conception de l'interface utilisateur ou le freelance en général. Alors del alors nous allons vous voir à l'intérieur d'un autre cours. Découvrez mes autres cours et cours sur le design, sur la typographie, la conception de mise en page, schémas de couleurs et toutes ces choses différentes. Essayer de laisser un examen honnête, écrire quelques commentaires sur tout ce que vous avez appris dans ce cours. Tilden, à bientôt dans un autre cours ou cours. Jusque-là, prenez soin et au revoir.