Adobe XD de débutant à expert - Conception, prototypage et collaboration | Muhammad Ahsan Pervaiz | Skillshare

Vitesse de lecture


1.0x


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

Adobe XD de débutant à expert - Conception, prototypage et collaboration

teacher avatar Muhammad Ahsan Pervaiz, UI UX Visual Designer 15+ Years

Regardez ce cours et des milliers d'autres

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

Regardez ce cours et des milliers d'autres

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

Leçons de ce cours

    • 1.

      Introduction au cours Adobe XD

      2:27

    • 2.

      What Xd ?

      7:28

    • 3.

      Téléchargez et installez Adobe Xd

      2:31

    • 4.

      Pourquoi Adobe Xd Est tellement génial

      3:33

    • 5.

      Mise à jour de l'écran de bienvenue

      2:56

    • 6.

      Introduction à l'interface adobe XD NEW 2020

      6:13

    • 7.

      Panneau de propriétés Adoe Xd Interface

      2:53

    • 8.

      Adobe Xd Mac et des différences de gaines

      4:40

    • 9.

      Mises à jour et fonctionnalités à venir Xd

      2:33

    • 10.

      Exercice - Première de l'affectation

      6:47

    • 11.

      Planches de art dans XD

      7:48

    • 12.

      8 outils dans XD

      4:44

    • 13.

      Outil de rectangle pour créer des boutons

      5:46

    • 14.

      arrière-plan et flou d'objets

      3:20

    • 15.

      Outil Ellipse

      1:49

    • 16.

      Les bases de l'outil du stylo dans XD

      2:43

    • 17.

      Outil du Pen pour créer des icônes

      5:34

    • 18.

      Outil de ligne

      1:16

    • 19.

      Outil de texte dans Adobe XD

      3:25

    • 20.

      Outil polygon - UPDATE

      1:54

    • 21.

      Couleurs et palettes

      3:50

    • 22.

      Gradients de couleurs dans Xd

      5:58

    • 23.

      Utiliser coolors.io pour créer des schemes couleurs

      3:44

    • 24.

      Masques dans Xd

      5:41

    • 25.

      Styles de personnages dans XD

      4:48

    • 26.

      Utiliser des guides dans Adobe XD- MISE à jour en

      2:54

    • 27.

      Référencer la grille

      8:47

    • 28.

      Composants dans Adobe XD - MISE à jour de

      5:28

    • 29.

      Les actifs liés dans XD - mise à jour

      9:35

    • 30.

      Raccourcis communs

      5:47

    • 31.

      Plus de touches de raccourcis

      8:25

    • 32.

      What conception de niveau de bloc ?

      12:15

    • 33.

      Ébaucher des idées de première conception de niveaux de niveau

      8:14

    • 34.

      Premier prototype de papier - Ajouter des détails

      4:06

    • 35.

      Prototypes T horizontaux verticaux

      8:58

    • 36.

      Niveau de fidélité et de prototypes

      4:06

    • 37.

      Ajouter des détails à votre conception de bloc dans XD

      7:36

    • 38.

      Utiliser des motifs d'Ui pour le design de vitesse

      6:04

    • 39.

      Créer un exercice d'écran Ios

      14:04

    • 40.

      Démarrage de préparations de conception

      5:11

    • 41.

      Réglement des couleurs

      5:27

    • 42.

      Résoudre les problèmes de l'ancienne application

      4:10

    • 43.

      Conception d'écran de bienvenue

      9:42

    • 44.

      Concevoir l'écran de connexion

      14:28

    • 45.

      Design d'un écran activé

      11:39

    • 46.

      Conception d'écran dans XD

      7:04

    • 47.

      Conception de tableau Partie 1

      12:24

    • 48.

      Conception de tableau Partie 2

      11:08

    • 49.

      Conception de navigation de série

      9:03

    • 50.

      Conception d'écran d'actifs

      10:35

    • 51.

      Conception d'écran Sync

      8:13

    • 52.

      Mise à jour de l'état de synchronie

      4:25

    • 53.

      Utiliser des grilles pour améliorer les conceptions

      5:11

    • 54.

      Affiner les guides de style dans XD

      8:22

    • 55.

      Lignes de conception IOS

      8:58

    • 56.

      Fixer des limites de cibles de clavier de clavier

      6:14

    • 57.

      Entrée et d'écrans de prototype

      10:11

    • 58.

      Prototyping et d'autres écrans dans XD

      11:14

    • 59.

      Partage du prototype avec les autres

      3:51

    • 60.

      Prototype sur Mac

      2:15

    • 61.

      Outil d'inspection du design

      3:57

    • 62.

      Pourquoi exporter en 1x 2x 3x ?

      9:10

    • 63.

      Exemple parfait de 1x 2x 3x

      2:45

    • 64.

      Exporter des planches pour créer des maquettes

      7:31

    • 65.

      Complicité de exportation dans Adobe XD

      6:23

    • 66.

      Prévisualisation de votre application sur Iphone

      2:11

    • 67.

      Dépend de développeurs avec Zeplin

      12:57

    • 68.

      Handoff Developer

      13:47

    • 69.

      Fichiers de clichés de photohsop et Illustrator dans XD

      7:38

    • 70.

      Adobe XD en avril 2018

      4:10

    • 71.

      Le mois de juin 2018 Adobe XD Overlays fixe

      10:11

    • 72.

      Révisions de masse de juin 2018

      3:02

    • 73.

      06 d'ordres d'empilage 2020

      4:37

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

Généré par la communauté

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

2 071

apprenants

4

projets

À propos de ce cours

Conception et prototype d'une application d'iPhone médicale en utilisant Adobe XD de Scratch. Collaborer avec des développeurs à l'aide des outils Zeplin et Avocode

Chaque design est une solution à un de et les conceptions sont inutiles si vous ne pouvez les convertir en applications codes. Ainsi, dans ce cours Adobe XD, vous apprendrez de zde comment concevoir en utilisant Adobe XD. Ensuite, comment créer et partager vos prototypes avec vos utilisateurs instantanément et le plus important comment collaborer et transmettre vos conceptions à vos développeurs de manière à leur de lancer

Même si vous en êtes un novice ou un débutant, vous aurez aucune difficulté à apprendre l'outil Adobe XD de l'outil de l'Adobe XD car il couvre toutes les éléments de l'étape et d'étape à étape

Ce cours les sujets clés sont

  • Toutes les raccourcis de clavier d'Adobe XD (de zéro)
  • Concevoir une application d'iPhone dans XD
  • Créer des guides de style pour votre application iPhone
  • Prototypage papier (types et comment les dessiner sur papier)
  • Interactive en utilisant Adobe XD
  • Exporter tous vos actifs et planches d'art dans 1X 2X et 3X
  • Collaborer avec des développeurs en utilisant Zeplin & Avocode
  • Ouvrage de plans, Photoshop et Illustrator avec Adobe XD
  • Toutes les dernières mises et fonctionnalités d'Adobe XD dans Adobe XD
  • Apprendre les spécifications de conception IOS / lignes de conduite d'Apple IOS

Si vous êtes le concepteur ou vous êtes un concepteur UI qui utilise Photoshop et veut apprendre à concevoir et à prototype d'Adobe XD, ce cours est pour vous. Son plus simple et de lumière parmi tous les outils de conception où vous pouvez en faire un expert en un rien en un temps. Croyez-moi

La meilleure en Adobe XD, il est à la plupart des systèmes d'exploitation Windows et MAC et je les montrerai dans ce cours, alors n'hésitez pas et et maintenant en s'en apprendre maintenant à connaître sur Prototyping et Adobe XD

Même si vous n'avez jamais utilisé d'outil de design, vous pouvez apprendre Adobe XD

Rencontrez votre enseignant·e

Teacher Profile Image

Muhammad Ahsan Pervaiz

UI UX Visual Designer 15+ Years

Enseignant·e

Hi, I'm Muhammad Ahsan, a Senior UX/UI & Product Designer with 20 years of experience in UX design, product strategy, and design consultancy.

I started my journey from scratch and went on to work with FORTUNE 500 companies including Intel, Panasonic, and Coca-Cola, along with SaaS startups and ProductHunt launches. I've helped teams design user-centered products and UX onboarding systems, including a startup that ranked Top 3 Product of the Day on ProductHunt.

Currently, I work as a Lead UX Designer at Prodesign.tech, where I design and scale dashboards, portals, and SaaS applications. For the past few years, I've been leading UX efforts for a U.S.-based weight loss healthcare company, LumiMeds, designing patient, provider, and admin portals used by real users daily.

<... Voir le profil complet

Compétences associées

Adobe XD Design Design UI/UX Prototypage
Level: Beginner

Notes attribuées au cours

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

Pourquoi s'inscrire à Skillshare ?

Suivez des cours Skillshare Original primés

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

Votre abonnement soutient les enseignants Skillshare

Apprenez, où que vous soyez

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

Transcription

1. Introduction au cours Adobe XD: bienvenue à mon cours à ce sujet. Plus de 60 ans et dans les écoles, vous allez apprendre toutes les choses de base et tout ce qui offert plus de 60 ans que nous allons concevoir, nous allons créer des prototypes, nous allons aller aux pieds, tout apprendre sur le prototypage papier et tous les différents prototypes interactifs, prototypes en direct. Et nous allons collaborer avec vos développeurs. Donc, ce que signifie la collaboration, c'est que nous allons remettre notre conception à plus de développeurs utilisant Zeppelin et Advil cold. Alors ne vous inquiétez pas si vous ne savez pas ce truc avancé parce que vous allez apprendre que dans ce cours je vais couvrir toutes les bases. Des raccourcis ? Quels sont les différents outils que vous pouvez utiliser pour construire votre design ? Et puis nous allons passer à la phase de prototypage où nous allons générer l'application grippe off et différentes peaux. Nous allons connecter les différents écrans les uns avec les autres. Et puis, à la fin, nous allons utiliser notre conception pour collaborer avec d'autres développeurs. Nous allons concevoir, nous allons orteils, leur donner des spécifications de conception et différentes distances entre les différents éléments et les guides de style cités, que vos développeurs peuvent utiliser instantanément il ya conception d'application ou Conception de l'application iPhone Maintenant, nous allons couvrir beaucoup de choses sur le typage des bordures. Vous me verrez créer différents prototypes papier allaient couvrir la partie esquissée ou la conception au niveau du bloc, qui est la première face de toute conception. Donc, ce cours est un mélange de techniques d'expérience utilisateur, peu d'entre eux. J' ai discuté dans beaucoup de TD comme le prototypage et aussi sur Adobe X T. Comment vous pouvez utiliser et créer des prototypes instantanés proviennent des prototypes instantanés en utilisant Adobe X'd . Maintenant beaucoup de concepteurs, J'ai vu qu'ils ne parlent jamais de lignes directrices de conception, I US lignes directrices de conception ou les lignes directrices. Chaque concepteur et développeur doit savoir que la barre de navigation ou qu'ils sont mais hors l' application U. S. S.devrait être de 49 points ou le fardeau devrait être de 44 points. Toutes ces spécifications que je vais couvrir dans ce cours. Et si vous avez un problème ou si vous rencontrez un problème, vous pouvez facilement me contacter. si vous avez un problème ou si vous rencontrez un problème, Pourquoi sont des réponses aux questions et vous pouvez également me demander directement en me envoyant un message. Nous allons faire beaucoup de choses ensemble, donc à bientôt dans ce cours, et je serai votre instructeur 2. What Xd ?: Bonjour, tout le monde. Aujourd'hui, nous allons rencontrer le nouvel outil sur Adobe, qui est un travail x d et je lisais depuis longtemps pour quelques fonctionnalités l'introduit juste maintenant dans X t. Et maintenant, je vais vous montrer certaines des grandes fonctionnalités hors de lui. Et ils sont ah, l' équipe Robur. Ils travaillent un mois sur ces fonctionnalités et publient chaque mois sur la base de l' attribution de différents concepteurs et concepteurs d'expérience utilisateur de partout dans le monde. Ok, donc c'est à plus de 60 ans. Je suis en ce moment sur Windows. Il y a peu de différences mineures dans la version macro et la version Windows, mais elles sont presque similaires. OK, maintenant je vais vous montrer quelques fonctionnalités super et cool de X'd et pourquoi vous devriez utiliser comme, ah conception via cadre et outil prototype dans votre expérience utilisateur, conception, conception, flux de travail ou votre vous un travail de conception. Ok, maintenant pourquoi ces trois outils pour esquisse boutique et il ya dos D Ils sont parfaits pour votre conception ou conception l'expérience utilisateur parce que Apple sont U S leader version, ils produisent leurs graphiques dans ces trois pour Max Okay, donc en ce moment, ils sont sportifs pour la boutique esquisse et aérobic T. Et si vous regardez les tailles de fichier le fichier adobe X t tailles les plus petites quatre-vingt, 18.9 MB donc vous pouvez voir qu'il est très proche de la taille du fichier de croquis, il est donc cinq taille est très petite. Ok, donc c'est un très gros point positif parce que vous pouvez créer, genre, des centaines de tableaux d'art différents dedans. Ok, Donc différents écrans, peut-être que des centaines sont 20 ou 30 écrans différents, et votre taille de fichier sera toujours petite. Ok, donc il est plus facile de partager une fonction hors de la grille sur un travail X t est. C' est la répétition. Bien. Savoir quoi ? Répéter la cupidité est que vous créez votre élément de conception une fois, et vous allez le répéter en faisant un grand Royaume-Uni Vous pouvez voir dans cet exemple de conception que nous allons créer une fin sur les scores. Vous pouvez voir ceci est notre répétition crée. Donc, si j'essaie les orteils courts, vous pouvez voir qu'il supprime tous les autres, euh, ces, um, modèles de contenu ici. Ok, donc ça bouge ça. Ok, Donc vous pouvez étendre votre grille dans la destruction et dans la direction verticale, à la fois hors de ces directions et il va multiplier votre contenu unique et vous pouvez changer. Tu peux. Je l'ai fait. Et tu peux faire ce que tu veux. Et ah, ça veut dire un groupe. Ok, donc c'est une très grande fonctionnalité pour créer l'origine. Lisez le contenu instantanément. D' accord. Donc, vous n'avez pas besoin de tout générer encore et encore. Vous pouvez voir par ici. Ce sont des doublons. D' accord. Ma protection de l'enfance. Production d'enfants, formation à la protection de l'enfance. Ensuite, nous avons une autre fonctionnalité qui est appelée prototypage. Vous pouvez lier tout l'écran que vous pouvez voir ou entendre. Voici un prototype de section, et vous pouvez voir le prototype sur votre bureau. Tu peux voir tes cheveux. Voici un prototype. C' est une excellente fonctionnalité car dans la conception de l'expérience utilisateur, vous devez tester vos prototypes avec vos utilisateurs. Vous devez voir comment les utilisateurs vont vraiment utiliser cela. Que ce bouton soit suffisant pour leur Tom ou s'il manque là, Tom. OK, donc toutes sortes de choses, si l'espacement entre ces deux éléments est assez bon pour que l'utilisateur ne tape pas sur celui-ci et ouvre celui-ci. Ok, donc ce sont d'excellentes fonctionnalités d'Adobe X'd, et ah, nous allons couvrir beaucoup de choses dedans. D' accord ? Aussi, vous pouvez bouger. Je vais prévisualiser vos, euh, ces prototypes. Vous pouvez les voir directement sur votre mobile. Le mobile de votre utilisateur. En outre, vous pouvez partager les spécifications de conception. Ok, laissez-moi vous montrer les spécifications du design. Ici, nous avons les spécifications de conception du même projet, et vous pouvez voir si je vais à l'un de ceux-ci. Cela me montre que ce vert est lié à celui-ci. Donc si je vais à celui-ci, Ok, donc il montre toutes les couleurs utilisées sur ce tableau d'art avec tous les styles corrects . Donc, si je clique sur un de l'article, il va montrer les détails de ce qui est le village en hauteur de cet article ? Quelle est la distance entre ces deux éléments d'eso ? 16 points. Donc toutes ces choses couleurs, rondeur. C' est la rondeur de ce bouton. Ok, coins arrondis. Et il montre aussi d'autres faits, comme l'ombre et tout ça. Ok, donc c'est très pratique. C' est en ce moment dans les spécifications amères du design, Peter. Ils tentent de l'améliorer et j'espère que ce sera une grande caractéristique dans avenir proche. D' accord. D' accord. Maintenant, les pieds arrière, Adobe X'd quelques fonctionnalités plus, que j'aime vraiment est cette bibliothèque de symboles. Vous pouvez voir les actifs. Je peux ajouter toutes les couleurs que j'ai utilisées tous les différents textiles, et, et, euh, les styles que j'ai utilisés dans les symboles sont en fait l'élément réutilisable. Vous pouvez créer un symbole et vous pouvez le multiplier ou l'utiliser sur n'importe quel écran. Et si j'ai fait quelque chose en dehors des symboles, vous pouvez voir les frais généraux. Je sais qu'on est plus en prototype. Ici, nous avons un symbole. Ok, donc c'est un symbole. Et si j'essaie de changer la couleur du symbole, vous pouvez voir qu'il a changé partout. Différents ennuis d'art dans l'ensemble du design. Partout où j'ai utilisé ce symbole, il va être changé. C' est donc une grande fonctionnalité. Vous pouvez instantanément modifier n'importe quoi sur votre tableau d'art. Si c'est un symbole, il sera mis à jour sur tous les tableaux d'art. Donc, ce côté est fondamentalement dans les guides de style que nous utilisions normalement pour créer dans un autre logiciel ou n'importe quoi dans Zeppelin. Ou si vous avez lavé mes autres cours, vous savez ce que sont les guides de style ? Ils sont essentiellement les guides de style, de coloration et de typographie pour utiliser différentes quatre tailles, différentes couleurs et comment ils vont être utilisés dans notre conception. Ok, donc ce sont toutes les grandes fonctionnalités de X t, et je vais vous montrer beaucoup hors affaire et comment nous pouvons rapidement générer ces conceptions en X t. Dans le monde réel, situations créant des conceptions avec beaucoup de vitesse est vraiment nécessaire. Vous voulez montrer votre prototype ou vous travaillez en ab démo. Faites votre client ou votre utilisateur et vous vouliez le faire instantanément dans les deux heures ou deux mètres ou peut-être quatre heures. Je pense que ce genre de dessins avec ces nombreux écrans, comme une porte neuf écrans. Je pense que vous pouvez le faire dans le nôtre. Et aussi vous pouvez partager vos prototypes. Vous pouvez voir ses cheveux publier prototype. Ok, vous pouvez partager votre prototype link toe n'importe quel client ou client en l'instant, et ils peuvent le faire sur leurs appareils. Ok, Maintenant, dans la prochaine leçon, je vais vous montrer comment le télécharger et comment acheter ce logiciel si vous voulez vraiment l'acheter. Mais en ce moment, si vous apprenez, vous suffit de télécharger la version d'essai. Ok , passons à la leçon suivante. 3. Téléchargez et installez Adobe Xd: Ok, maintenant, je passe à autre chose. Nous allons télécharger à Obey X'd version d'essai. Donc, vous allez aller à ce bijou adobe dot com produits slash x acte artiste TML ou je vais partager ce monde avec vous. Ok, donc c'est l'essai gratuit. Vous pouvez télécharger l'essai pendant un mois, et vous pouvez également l'acheter. Donc, si vous cliquez sur ce maintenant, il est la saleté pas cher en ce moment, et il est disponible pour $10 appartement. Ok, donc c'est tout récemment, je pense qu'il y a d'autres APS là pour 20$ par mois, mais est en fait disponible pour 10$ appartement. Ok, si tu veux vraiment l'acheter. D' accord. Maintenant à la configuration requise du système. D' accord. Donc, avant de l'installer sur votre PC sont Mac, c'est très cool chose à propos de cette application qu'il est disponible pour les deux systèmes d'exploitation . Ok, Donc si votre utilisateur ou votre client travaille sur un PC ou un Mac, ils peuvent voir leur design, et ils peuvent jouer avec. Ok, donc ici nous avons la configuration système requise pour Mac OS, qui est Mac OS 10.11 et versions ultérieures. Ok, voici la mémoire pour G B, 1,4 gigahertz connu. Prêt ? Ne pas afficher. Retina recommandé. D' accord. Et puis nous avons Windows 10. Quelqu' un ? Trois mises à jour. OK, donc si vous avez des fenêtres simples, puis et le nord et miséricorde mise à jour ou quoi que ce soit en dessous de cette version 16 07 il va orteil. Ça te donne un problème. Vous ne pouvez pas l'installer beaucoup sur les étudiants. Ils m'ont demandé que comment l'installer sur Windows 10. Assurez-vous que vous avez une mise à jour de miséricorde ou la dernière version de Windows 10. D' accord. Et ce sont les exigences CPU, deux gigahertz mémoire pour G B A, G B, hors espace d'installation et d'affichage. Et descends là. D' accord. Je préfère vraiment que tu aies une bonne carte graphique à Leeds. Au moins avoir Koji bi ou un Go de RAM sur votre carte graphique. D' accord ? Parce qu'il est nécessaire pour la plupart d'entre eux concevoir des applications intensives. Ok, maintenant, ce sont les exigences, alors assurez-vous d'y aller. Si vous n'avez pas encore installé Baxter. Essayez d'installer la version d'essai gratuite et téléchargez-la et installez-la, et je vous verrai dans la prochaine leçon. 4. Pourquoi Adobe Xd Est tellement génial: trois et va vous présenter. Filaire sera éteint est si populaire parmi les concepteurs d'interface utilisateur. Vous êtes des concepteurs et des concepteurs d'expérience utilisateur. Il y a plusieurs choses ou vous pouvez dire, fonctionnalités qui devraient être présentes dans n'importe quel outil de conception hors type pour le rendre parfait pour l' expérience utilisateur . Les concepteurs aiment les designers. Maintenant. La première caractéristique est qu'il devrait générer prototype Êtes-vous ? Je conçois ou désactive n'importe quelle application rapidement afin que nous puissions y construire rapidement. On peut concevoir. Certainement. Il ne devrait pas prendre comme une journée entière pour créer cinq ou six choses, souvent application. Ok, donc c'est une chose. La deuxième chose est que nous pouvons facilement le partager et nous pouvons est un fantastique avec les utilisateurs, qui est également vous pouvez construire un dammit prototype rapide, Prototype de votre produit X Test avec vos utilisateurs rapidement. Donc, si vous testez avec l'utilisateur et lui montrer ou cœur votre première idée hors de votre application et hey n'aime pas quelque chose ou il dit que ce n'est pas ce que je veux. Vous pouvez instantanément changer instantanément dans adobe X T et générer un autre tour prototype loin et a montré que vous voulez vraiment celui-ci. Ok, donc c'est une autre caractéristique. Troisièmes fonctionnalités, qu'ils ont vraiment introduit en ce moment, est pour les développeurs. Ce dont les développeurs ont besoin, c'est qu'ils ont réellement besoin de spécifications, couleurs les cordons hors couleurs dans des valeurs accessibles ou des valeurs RVB ou parfois une autre valeur rgl pour la valeur. Ok, donc ils sont plus intéressés par les spécifications que les couleurs que nous avons besoin d'utiliser dans notre équipe sur cette application ou site Web. Et quelles sont les différentes spécifications qui se réjouissaient avec ? Ok, donc ceux-ci sont récemment introduits dans Adobe, En fait, qui est que vous pouvez extraire votre générer vos éléments, vos spécifications de conception, que cet élément est si loin de ce bouton. Ok, vous pouvez générer en elle dans l'élément inspecter, qui est, je pense qu'ils sont la fonctionnalité d'Adobe dans la division B en ce moment. En outre, ils ont récemment introduit que vous pouvez exporter vos conceptions supplémentaires adobe dans Tow Zeppelin , qui est un autre outil pour créer sur les spécifications de conception et enregistré toute mention de votre conception. Et puis aussi ils ont introduit que vous pouvez exporter vos couches dans toujours cool. D' accord. Et il y en a aussi un de plus. Je pense que proto by pour créer des missions à partir de votre prototype. Plus de détails et les émissions sont micro animations. Ok, donc tout est à propos de cette leçon. J' espère que vous avez apprécié mon introduction txt opérationnelle et ce que vous pouvez faire avec elle et pourquoi il devient populaire parmi d'autres outils. Parce qu'il y a une autre raison pour laquelle sa taille de fichier est vraiment petite. Je pense que c'est encore plus petit que le croquis. Si vous connaissez une carte d'esquisse, elle est plus petite que schématique. Donc, il se développe à un rapide et la paix et beaucoup de fonctionnalités sont ajoutées chaque mois en elle. Donc, je conseille vraiment que si vous aimez concepteur sont dans un design UX sentir que vous devriez vraiment apprendre à, vous savez, se mêler avec cette offre excédentaire de main loin. D' accord. C' est vraiment cool. Léger, et j'espère que vous allez adorer. Ok, bientôt. Dans un autre moindre 5. Mise à jour de l'écran de bienvenue: J' espère que jusqu'à présent, vous avez déjà installé Adobe XD sur votre machine. Maintenant, nous allons voir ce que cet écran de bienvenue ici. Ainsi, chaque fois que vous exécutez Adobe X D, il s' agit du premier écran que vous allez voir. Donc, ici en bas, vous pouvez voir ce sont mes fichiers récents. Ce sont donc mes projets ou fichiers récents que j'ai ouverts. Je peux les rouvrir en cliquant sur l'un de ces éléments. Sur la gauche, nous avons différents domaines comme l'apprentissage à la maison. Découvrez si vous voulez voir certaines des vidéos de la société Adobe sur la façon d'utiliser cet Adobe XD. Ensuite, nous avons des documents cloud. Adobe XD a récemment été déplacé vers le cloud. Ainsi, chaque fois que vous ouvrez ou enregistrez un fichier, il est également enregistré sur le cloud. Il vous apporte donc les modifications et l'historique modifié de votre document. Donc, peu importe ce que vous concevez, par exemple, comme une heure pour aller à la nôtre, si vous l'avez sauvegardée, cela reflétera tous les changements que vous avez apportés avec le temps. Il va donc le mettre à jour automatiquement sur le cloud. Ce sont donc des documents cloud. Si je clique ici, vous pouvez voir ce sont tous les documents que j'ai téléchargés sur mon cloud. Vous pouvez voir ici, ce sont quelques documents. Si vous voulez les supprimer, vous pouvez cliquer ici. Vous pouvez les supprimer comme ceci. En outre, vous pouvez les trier. Ce sont des options différentes. Et puis nous avons partagé Dab avec vous. Ce sont donc les fichiers si quelqu'un d'autre a partagé ses projets avec moi et que je travaille avec eux sur les documents cloud. Ça va être par ici. Ce sont tous les fichiers supprimés. Donc, je le supprime récemment, j'ai levé ce fichier. Donc c'est tout ici. Maintenant, si vous cliquez sur Gérer les liens, il va aller à votre cloud ici vous pouvez voir ce Macleod et une fois que vous cliquez sur la gestion, mais ce sont les prototypes publiés ou les spécifications de conception ou les projets I ont partagé avec eux. Donc, vous pouvez voir si vous regardez de près ici en bas il est dit prototype, prototype, spécifications de conception prototype, spécifications de conception prototype. Ce sont donc des fichiers différents que j'ai partagés avec d'autres. Vous pouvez voir ici, ce sont des liens publiés, donc ce sont tous ceux que j'ai partagés avec d'autres. Vous pouvez les gérer ici. Vous pouvez cliquer ici, vous pouvez copier ce lien et le partager avec d'autres personnes. Vous pouvez supprimer définitivement ces liens partagés ou publiés. Maintenant, revenons à notre écran Adobe XD et vous pouvez voir si nous retournons à la maison, c'est tout ce que nous avons ici, nos documents cloud partagés avec moi, les fichiers supprimés, les LINCS gérés, les liens gérés pour les fichiers que j'ai partagés avec d'autres. C' est donc tout au sujet de cet écran de bienvenue. J' espère que vous avez apprécié cette leçon. Allons plus loin et discutons de l'interface dans la prochaine leçon. 6. Introduction à l'interface adobe XD NEW 2020: Maintenant, nous allons ouvrir un nouveau fichier pour ça. Nous avons différents modèles ici. Ici, nous avons iPhone, différents quelques-uns veulent concevoir une application iPhone ou Google App ou application Android, vous allez aller et ici, si vous voulez aller pour le web design, vous allez utiliser certains des modèles ici. Si vous voulez concevoir quelque chose pour les médias sociaux, les messages Instagram, les messages Twitter, en-tête Twitter fondu, les messages Facebook, filmez votre vidéo. Tu vas aller par ici. ce moment. Je vais choisir quelque chose d'ici. Comme, sélectionnons ce Google Pixel pour, pour Excel. Maintenant, c'est notre tableau d'art par ici. Donc, maximisons celui-ci. Et vous pouvez voir en haut il dit sans titre et voici un petit login cloud et il me montre le temps ici. Donc, nous allons cliquer ici et changer le nom de notre, disons première visite à XD enregistrer. Donc maintenant vous pouvez voir que j'ai déjà quelques plug-ins et star, donc il me montre qu'un plug-in a besoin de mise à jour que nous avons ce moment je vais fermer celui-ci. Et c'est notre interface simple ou Adobe X sur la droite, vous pouvez voir que nous avons peu d'options ici comme ceci est le niveau de zoom. On peut zoomer à 100%. C' est un 100% de ce design. Voici notre aperçu de bureau pour le prototype. Voici notre aperçu mobile. Si nous avons installé l'application mobile et que nous voulons voir cet écran sur notre mobile. Ça va être o ici. Si je veux inviter quelqu'un d'autre, quelqu'un d'autre, un autre designer, je peux cliquer ici. C' est toujours dans la bêta, donc je peux activer l'édition. Donc un autre concepteur peut éditer mon design deux. Sur la gauche, ici, nous avons trois onglets, design, prototype et cisaillement. Le design est l'endroit où nous allons concevoir se vanter de nos écrans, nous allons mettre différent. Mais comme nous allons faire des choses différentes ici. Par exemple, ce bouton ici. Et dans la section prototype, nous relierons deux ou trois écrans. Par exemple, si j'ai un autre écran où nous apprenons chaque raccourci et tout, j'essaie juste d'expliquer. Maintenant, vous pouvez voir que nous avons deux écrans. La première est cette 11 est la seconde. Je peux les relier ensemble comme ça. Et ça va être dans notre prototype. Nos prototypes interactifs seront donc des frais généraux. Nos fichiers de dessins seront des frais généraux. Le partage se fera lorsque nous voulons partager nos designs avec quelqu'un. Donc, vous pouvez voir que nous avons différentes options où examen de conception pour obtenir des commentaires sur votre conception ou prototype. Ensuite, nous avons un développement où nous partagerons notre document avec développeurs pour leur montrer le code que nous avons pour tous ces éléments ici. Alors pour la présentation, peut-être voulons-nous le montrer à nos clients. Et puis pour les tests utilisateur, puis pour les paramètres personnalisés. Il s'agit donc de paramètres différents pour partager votre document. Non, je retourne à la maison. Et si je clique sur Accueil, vous pouvez voir que nous pouvons retourner à cet écran d'accueil où nous pouvons ouvrir n'importe quel autre document récent. Encore une fois, nous avons quelques menus ici, vous pouvez voir sur la gauche dans Adobe XD est la version Mac, nous avons le même menu en haut de MAC ici. Donc je peux cliquer ici, vous pouvez voir que nous avons un nouveau document ouvert. Ensuite, nous avons différentes portes d'interface utilisateur. Ensuite, nous avons un document récent, renommer ce document, enregistrer comme document local. Vous pouvez donc également enregistrer celui-ci en tant que document local. Maintenant, le problème sera que si vous essayez de l'enregistrer comme votre document local, vos modifications sont l'historique ne sera pas enregistré ici. Donc, vous pouvez voir ce sont les deux changements que j'ai faits à 302 PM et 15h04 PM. Trois notre 15h et la quatrième minute, j'ai ajouté ce deuxième écran. Donc, il est en fait enregistrer toutes mes modifications dans le cloud. Donc, chaque fois que je veux y accéder, je peux revenir, par exemple, à celui-ci. Je peux revenir en arrière. Vous pouvez voir ouvert dans une nouvelle fenêtre. Donc, si j'essaie d'ouvrir cela dans une nouvelle fenêtre, vous pouvez voir qu'il n'aura qu'un seul écran. Donc vous pouvez voir que nous avons ce temps emprunteur ici. Et c'est le premier écran avec lequel je pense avoir commencé. C'est le plaisir. Nous avons commencé avec un écran vide. Donc, il va sauver tout l'historique de tous les changements que vous allez apporter ou peut-être économiser après quatre ou cinq minutes. Je ne suis pas sûr de toute façon. Donc, à gauche, nous avons tous les outils. Ce sont les outils que nous allons utiliser dans les prochaines leçons. Je vais vous expliquer chacun d'eux. Ensuite, en bas ici, nous avons des actifs, nous avons le panneau des couches, nous avons nos plug-ins ici. Donc, quels que soient les plugins que vous allez installer, ce sont des plugins gratuits. Certains d'entre eux sont payés. Vous pouvez les installer ici et vous pouvez les utiliser comme ceci. Donc, si vous cliquez ici, vous pouvez voir qu'il dit une erreur. Échelle de couleur trop large. Nous allons créer, vous pouvez voir que c'est une échelle de couleurs ici. Ce sont donc les plug-ins qu'ils vont automatiser et améliorer vos capacités Adobe XD. Donc, ce sont les outils. Ce sont les trois que nous allons surtout regarder ce tableau d'art ici à bord d'Arbor, Pelham. Ce sont des tableaux d'art, en fait, ce sont des tableaux d'art. Et c'est tout au sujet de l'interface d'Adobe XD. Nous avons trois onglets principaux ici, conception, prototype et partage. Et c'est le niveau de zoom. Nous l'utiliserons beaucoup. C' est le bouton de lecture pour prévisualiser notre séjour parfait. Vous pouvez voir dans cette fenêtre, cela va également être utilisé beaucoup. C' est donc toute l'introduction de l'interface. Nous allons approfondir les textos Adobe dans la prochaine leçon. Allons au prochain S Et maintenant. 7. Panneau de propriétés Adoe Xd Interface: Donc, si je vais à nouveau à cette conception, vous pouvez voir ici nous avons un autre panneau, qui est notre panneau de propriétés. Ok, donc si je clique sur ce tableau d'art donc ce tableau d'art est sélectionné, et cette ligne bleue montre que ce tableau d'art est actif, je vais montrer un voir toutes les options alléguées. Faites cette planche d'art, comme sur la position de cette planche d'art hauteur sur tribord. Quel sera le défilement et la hauteur du panneau de vue. Combien de hauteur est visible, alors nous avons l'apparence, la couleur de remplissage. Je peux aussi changer la couleur si je veux. Oh, et je veux dire, je dois cliquer dessus. Ok, donc je peux aussi créer des grilles et Leo est dessus. On va parler des mises en page de Gretchen plus tard. Je vous montre juste que c'est le panneau des propriétés. Ok, Donc si je clique sur ce rectangle arrondi, ok, donc si je clique sur cet angle de rejet rond, vous pouvez voir toutes les options plus tard, comme l'alignement. Une note de répétition. Cet ajustement et ces colère relation Tout va bien, donc tout est ici. D' accord. Sur la barre supérieure seront alignements. que nous ne l'avons fait. La répétition a créé notre union. Ce sont ces options ? Je ne veux pas t'expliquer maintenant. Juste vous devez savoir que cette zone est pour contrôler vos objets de conception. Ok, donc si vous avez une planche d'art, vous pouvez contrôler sa hauteur et d'autres caractéristiques. Si vous avez ah, rectangles, vous pouvez créer différents effets et différentes tailles et différentes rondeur et capacité différente en utilisant les panneaux de propriétés de la. Ok, donc tout, la plupart des choses sur n'importe quel objet sera de ce côté. Vous pouvez voir quoi ici. Maintenant, j'ai sélectionné ce texte et le texte. Les options sont par ici. Vous pouvez voir. Et si vous sélectionnez l'art embarqué, propriétés liées au tableau d'art seront ici. Donc c'est comme ça que nous utilisons un travail. A x t. OK, Maintenant, Maintenant, il y a deux autres icônes sur la gauche. En bas, vous pouvez voir ou entendre des couches et des ressources. Ok, maintenant, ces atouts vont y avoir toutes les couleurs. Les styles de personnages sont des symboles que je vais utiliser tout au long de ma conception ou de tous les tableaux d'art. Ok, Donc si j'essaie d'ajouter ceci comme le style de tante Corrector, vous pouvez voir, il a ajouté un style de tracteur R dans ces actifs. OK, donc ne confondez pas ce design et ce prototype avec ces deux-là. D' accord ? Ceux-ci vont vous montrer toutes les couches et cela va vous montrer toutes les ressources que vous avez utilisées dans votre conception. Ok, donc c'est l'introduction à l'interface d'Adobe X'd. J' espère que vous avez apprécié cette leçon. Passons à l'exercice suivant. 8. Adobe Xd Mac et des différences de gaines: Ok, maintenant dans cette écoute, nous allons voir quelles sont les différences entre la version Max off. Non, B, x d et B. version B, x d et B. C est éteinte, alors soyez extra. Ok, Donc la première chose que vous allez remarquer est cette barre d'arrêt, qui est la barre de raccourcis ici, qui n'est pas présente dans les fenêtres. Et bien que les raccourcis sont très faciles à retenir, mais il va quand même aider beaucoup. Ok, donc vous pouvez voir que vous savez ce que vous pouvez faire avec ces objets. Vous pouvez les ajouter. Tu peux. Il y a des options de texte que nous avons une plage et tout le reste cap sur. Ensuite, nous avons ceci une date et un dossier. Ok, donc c'est la première différence majeure. Ensuite, nous avons encore quelques différences. Comme vous pouvez le voir récemment adobe X t. Ils ont au moins certains, um, um, plug-ins qui sont pris en charge, ou les outils tiers qui sont pris en charge par Adobe X'd sur. Et si je vais à cette exportation, vous pouvez voir ici il y a Zeppelin. Maintenant, Zeppelin est un outil, et un autre outil est jamais appelé et deux, ou voir ces outils de type off qui sont utilisés pour générer le cordon et générer des spécifications et des documents spécifications. Si vous ne connaissez pas Zeppelin, vous devriez retirer mon flux de travail plus que représenter cours où nous générons tous les guides de style , couleurs, équipes, équipes, tout au sein de Zeppelins en utilisant pour la boutique. D' accord. Non, nous sommes tous prêts. J' en ai créé un, un paragraphe un en-tête dans un seul bouton, et nous allons l'exporter. Zeppelin d'orteil. Voyons ce que ça va se passer ici. Ok, alors sélectionnons ce tableau d'art, et on va l'exporter à Siplin. Ok, donc c'est important. Donc je l'ai créé dans un X. Donc, je vais l'importer dans un suivant, et il est en train de télécharger le design en ce moment. Ok, donc tout est fait. Voyons voir ça. Ok, donc c'est très cool. J' aime vraiment ça. Ok, Donc c'est notre cap, et c'est toutes les tailles sont que vous pouvez voir dans les points qui sont pour le développement mobile. Vous pouvez voir par ici. Ensuite, nous avons cela aussi, la couleur vient également en RGB. Je pense que c'est pour nous. Donc vous pouvez voir ici comment nous pouvons l'exporter dans ah Zeppelin. Ok, donc on verra ça plus tard. On va aller aux pieds. Voyez cela en détail plus tard. Dans les dernières leçons en ce moment, je voulais juste vous montrer que vous pouvez faire beaucoup de choses avec Adobe XY. Donc, ce qu'Adobe Extra fait c'est qu'ils ont normalement publié leurs nouvelles fonctionnalités en premier pour ma question, et après un ou deux mois, vont être inclus dans le remorquage. La question des fenêtres. Ok, alors ne vous inquiétez pas si vous avez des fenêtres qui vous manquent derrière. Ok, donc ce n'est pas une grande différence. Ok, donc il y a une autre différence que j'ai oublié de vous dire si vous créez un prototype ici , donc je vais dupliquer cette touche d'option d'art. Et je vais aux orteils. Il suffit de créer un prototype simple. Je lierais ces deux écrans, apparaissais si dissous, et juste changer la couleur de ce bouton. Donc nous savons que nous sommes à l'intérieur. Un autre est allé par ici. Ok, alors tout est fait. Maintenant, nous allons jouer ça et vous pouvez voir par ici. Euh, donc ce que vous pouvez voir ici, c'est un petit bouton, qui est l'enregistrement. D' accord. Pour que je puisse appuyer dessus et que je puisse enregistrer une vidéo de mon aperçu. D' accord ? Et puis je peux l'exporter comme ça. Ce sera une vidéo. Il va sauver un renouvellement vidéo, type brutal. Et vous pouvez partager cette vidéo avec n'importe qui. Bon, instant, cet officiel n'est pas disponible sous Windows. J' espère qu'il viendra bientôt en eux. Les prochaines mises à niveau, peut-être le mois prochain ou peut-être de Mars ou d'Apple. Je ne sais pas. C' est aussi une fonctionnalité soignée qui n'est présente que dans la version Adobe X'd Mex. Et j'espère que vous avez apprécié cette leçon pour les utilisateurs de Mac. Je pense que c'est un créateur, Will et vous pouvez faire beaucoup de choses avec. J' espère que vous avez apprécié cette leçon. Si vous avez des questions à me poser à moins de passer à la prochaine leçon. 9. Mises à jour et fonctionnalités à venir Xd: l' une des meilleures choses à propos de l'aérobic T est qu'il est mis à jour régulièrement. Donc, adobe une entreprise et ils travaillent sur elle un jour par jour et nuit par nuit et le presque vous donner une mise à jour tous les mois. Ok, donc vous pouvez voir la dernière mise à jour. WAAS 11 décembre 2017 et le dernier est généralement 22 2018. OK, donc ils ont de meilleures performances de zone. Prévisualisation Dropbox pour basculer de fichier supplémentaire entre la couleur morse trois différentes couleurs morse qu'ils offrent en ce moment et de nouveaux INT gourmandes. Really Ingrédients améliorer les spécifications de conception mentale affichage sont bordé 100% et nouvelle fonctionnalité, qui est appelé exportation par lots. En outre, ils commencent à travailler par des tiers à travers des intégrations comme Zeppelin. Jamais la cour. Il suffit de mettre une tarte et un guide composées. Ok, donc ah, vous pouvez voir ici qu'ils ont montré que disponible pour Mac sur Lee. Il y a donc peu de fonctionnalités que je vais vous montrer dans la prochaine leçon. Quelques-uns des différences que vous allez voir sur ma question. La version Mac est comme, euh, 10%. Ou peut-être que je peux dire 5% tête hors fenêtre vision. Ok, donc ils ont plus de fonctionnalités sur Mac. D' abord, ils les ont lancés sur Mac, puis ils se lancent sur Windows. Ok, donc c'est à propos des mises à jour. Permettez-moi de vous montrer encore une chose qu'ils travaillent sur un grand nombre de demandes de fonctionnalités. Ok, donc c'est Adobe Extra formulaire de demande de fonctionnalité, et vous pouvez voir ici les gens votent pour différentes nouvelles fonctionnalités, comme le texte pour l'accouplement. Et puis nous avons l'objet fixe statique entre les traditions. Donc, vous pouvez voir que c'est l'examen d'un débat ? Ils disent fonctionnalité en cours de révision. Ok, donc ils sont en train de revoir cette fonctionnalité qu'ils ont besoin de plus d'informations que ce qu'ils ont présenté dans l'arriéré. Ok, donc il y a peu de fonctionnalités sur lesquelles ils ont déjà fonctionné, commencé , commencé à travailler, comme vous pouvez voir ou entendre parler des fonctionnalités sportives des réfugiés ont commencé, alors j'espère qu'ils vont perdre dans le mois prochain, ou peut-être deux mois après ça. Commencez à travailler dessus. Donc, vous pouvez dire que c'est très cool Feature. Vous pouvez rester au courant de ce qui se passe ensuite dans une porte. X'd. Ok, passons à la leçon suivante où nous allons voir comment commencer à utiliser X d. Ok, donc nous allons réellement commencer à l'utiliser 10. Exercice - Première de l'affectation: Non. Nous allons obtenir des trucs pratiques avec Adobe Extra. Ok, on en a beaucoup parlé, et maintenant je vais vous montrer comment vous pouvez créer des trucs simples dedans. OK, donc nous allons faire cette première mission. Ça va être votre mission. Je vais créer un écran simple. Laisse-moi te montrer. Donc, j'ai ouvert ce tableau d'art, qui est l'iPhone 678 et je vais appuyer sur le contrôle zéro commande zéro, zoom avant. Ou vous pouvez aussi aller ici et zoomer 200%. D' accord. Maintenant, ce que je veux que vous fassiez, c'est juste cliquer sur ce tabouret ellipse et simplement glisser et maintenez votre touche Maj pour que vous puissiez faire une circulaire proportionnelle. Nous sommes là, et maintenant nous allons appuyer sur ça, sélectionner nous et nous allons le faire au milieu. Ok, donc une fois qu'il est au milieu, vous pouvez voir qu'il y a ah, ligne rose ou guide intelligent, ce qui nous montre que c'est au milieu. Ensuite, nous allons aller ici dans cette zone et c'est notre taille de frontière. On peut augmenter la taille de la bordure à quatre comme ça. Et je vais prendre mon image Jewel devant, et je vais la traîner et la déposer dans ce cercle comme ça. Ok, donc je veux que tu fasses quelque chose comme ça. Vous pouvez utiliser votre propre image. Vous pouvez également modifier la couleur de la bordure. Cliquez ici et je peux changer l'orteil de la frontière à 7 à 7 à 7. Quelque chose comme ça. Et puis je veux que vous écriviez du texte ici. Par exemple, c'est mon titre. Um, comme Mohammed s et le CES. Quelque chose comme ça. Et je veux que vous écriviez votre cour préférée ici. Ok, donc peut-être d'accord, donc si ton texto est un peu plus long alors je vais orteil, c'est la taille de l'attaque ici. Ne t'inquiète pas pour ce que je suis ça. Je vais aller dans beaucoup de détails dans la section suivante, donc ne fais pas très maintenant. Juste en voyant la taille du texte à quelque chose comme ça, vous pouvez voir Non, quand j'essaie de bouger, il me montre les distances entre les différents éléments. Aussi, je peux sélectionner celui-ci et je peux aller d'ici orteil quelque chose planche, ok ? Et je peux aussi les aligner au milieu comme ça. C' est déjà au milieu. D' accord ? Et puis je veux que tu sois orteil. Avoir un bouton par ici. Nous allons donc créer un bouton avec l'outil d'angle de district. Cliquez sur l'angle de secte. C' est un exercice très simple. Ne vous inquiétez pas que vous êtes non. Vous allez avoir des problèmes. Retirez la bordure et pour le champ. Je veux la couleur. Et je vais utiliser mon outil fiscal pour créer quelque chose dessus. Comme m'embaucher. Ok, donc j'ai l'évasion mammaire ou V2 sélectionné. Et puis je vais choisir ailleurs. Oui. Déplace-le au milieu comme ça. Et je vais changer d'impression. La couleur est là-bas sur la droite. Je vais le rendre nul. D' accord ? Vous pouvez également sélectionner les deux comme ce mou de dragon, et vous pouvez les aligner au milieu comme ceci. Mais normalement, j'aime ça. Je devrais le déplacer vers le haut. Et j'ai choisi de les acheter à nouveau comme ça et de les déplacer comme ça. C' est très simple Outils, conception des orteils et travail ici. K Aussi, si vous voulez, vous pouvez également taper quelque chose ici comme ça. Donc si je veux un paragraphe hors texte sont beaucoup de texte, je vais cliquer et faire glisser comme ça et bla bla, bla, bla, bla, bla, bla, bla, bla, bla , bla, bla bla, bla, bla. Ok, c'est une belle poésie. Et je vais changer la couleur de remplissage. Ok, donc d'abord je dois sélectionner ce texte et regarder la couleur du film à quelque chose comme ça. Ok, donc je ne veux pas que tu écrives bla, bla. Hey, donc je vais y aller avec normal et je vais aller orteil. avoir ? 18 sorties hors de la taille. Ok, alors écrivons quelque chose par ici. Je vais l'ignorer. Ok, donc j'ai écrit quelque chose sur moi. OK, donc je vais supprimer celui-ci, et je vais utiliser ça ici comme ça. Et vous pouvez l'utiliser au milieu. Quelque chose comme ça ? Oui, parce que c'est un très mensonge au milieu, et je peux utiliser quelque chose comme ça. Et maintenant vous pouvez voir ici nous avons Changer la couleur de remplissage orteil couleur plus foncée comme ceci. Ok, donc ça va être votre première mission. Juste votre nom, ce que vous aimez, ce que vous faites et ce que vous aimez et ce que vous avez regardé en deux lignes et Abberton. Ok, donc si vous voulez changer le rayon de la charge veulent orteil, faites les coins arrondis que vous pouvez faire ici comme je voulais l'être. Huit pixels arrondis. Vous pouvez voir vos cheveux Si je veux ajouter un peu d'ombre, vous pouvez cliquer sur cette ombre ne change rien, Ne pas jouer beaucoup avec ces valeurs allaient couvrir Ah, beaucoup dans les détails. Donc, ce sera votre première affectation que vous voulez créer quelque chose comme cela. Il suffit de créer une ellipse. Faites glisser votre image dedans votre nom, ce que vous aimez. Vous pouvez également changer orteil un peu de couleur grâce. Il y a donc un contraste entre ces deux-là et un joli fardeau et une ombre autour. Vous pouvez également arrondir les coins si vous le souhaitez, et vous pouvez également utiliser quelque chose de spooks. Donc je vais utiliser quatre pour les coins arrondis. Faisons de la capacité à 100%. D' accord. Donc tu peux faire quelque chose comme ça. Laisse-moi changer cette couleur pour quelque chose comme ça. Donc c'est plus professionnel. Ok, donc je veux que tu crées quelque chose comme ça et ah, posté dans la prochaine mission. Et je vous verrai bientôt dans la prochaine section. 11. Planches de art dans XD: , La première chose dont je vais parler,c'est les tableaux d'art, parce que c'est la première chose que vous allez rencontrer dans Adobe X'd. Ok, donc je suis pour cet exemple. Je vais orteil sélectionner ce web, et je vais sélectionner ce 12 80 yard board et nous allons zoomer commande ou contrôle plus ou simplement appuyer sur commande ou contrôle zéro orteils. Umit orteil l'ajustement et à l'intérieur de cette toile. Donc nous avons ici sur notre conseil. C' est le nom du tableau d'art. Si vous voulez faire, vous pouvez double-cliquer, et vous pouvez modifier comme la conception de site Web ou quelque chose comme ça. Ok, Maintenant, chaque fois que vous voulez sélectionner un tableau d'art, vous devez cliquer sur son nom, alors cliquez une fois et il va être sélectionné et vous pouvez voir différentes options et plus tard orteil ce tableau d'art sur ici. C' est la largeur et la hauteur. Si vous voulez médaillon, vous pouvez si vous voulez. Regarde, ça va verrouiller le rapport d'aspect. Et une fois que vous augmentez cela, la deuxième valeur va également être augmentée, ce que nous ne voulons normalement pas. Ok, Ensuite, nous avons ce portrait et paysage plus, qui n'est pas euh, sens dans la conception Web, mais dans l'application mobile, donc il est logique. Ok, alors nous avons ce défilement. Ok, Donc, le défilement est que lorsque vous créez un prototype à partir de cette conception, si vous voulez une barre de défilement ici pour faire défiler leur conception et ok, donc quelque chose comme ça. Donc Vieux Port Height va décider où le corps du défilement. Donc si j'ai ce, euh, euh, Vieux Port Heights a dit à 600, tu peux voir que c'est mon truc d'école. Ok, donc c'est mon vous pouvez dire la page pleine gesso en design web. pli temporel est la zone qui va orteil visible la première fois, et quelqu'un visite. D' accord, donc jusqu'à ce que cette zone, le site sera visible ensuite, nous allons fouetter le rollerball. Ok, maintenant passer à cette apparence. L' apparence est fondamentalement la couleur de fond de votre conception entière. Vous pouvez le régler à ce que vous voulez, mais je pense que garder les orteils blancs est la meilleure option. Ou ici. OK, on recommence à cliquer. Ok, maintenant nous avons les grilles. Ce sont des concepts très importants, et ceci est principalement utilisé dans la conception web. Beaucoup. Ok, Donc, même dans la conception graphique, il y a deux types de mise en page hors grille. L' un est cette mise en page, qui est basée sur la colonne, et le 2ème 1 est le meilleur carré. Ok, donc la taille carrée est normalement destinée aux abdos mobiles. Ce n'est pas bon pour je pense que la conception Web, mais il peut rapidement placer des objets si vous le souhaitez. Oh, comme ça. Ok, donc c'est très, tu sais, ça va s'écrouler chaque boîte. Ok, donc c'est plus facile à vous d'orteil comme ça. Ok, Mais il est plus logique dans la conception mobile est venu et vous êtes en train de concevoir pour les laboratoires mobiles. C' est plus logique. Supprimons à nouveau. Allez sur le carré et c'est la taille de la tuile. Tu le veux si tu veux, comme 24 cochons, analphabètes, effrayants, taille carrée. Vous pouvez le définir sur 24. Vous pouvez le définir sur 64. Tout dépend de votre propre choix. Alors, nous allons aux pieds. Discutez de cette autre mise en page, qui est basée sur des colonnes. Nous utilisons normalement dans la conception Web. Une disposition de 12 colonnes et le bon de cela dépend de votre propre choix. Mais normalement, si vous utilisez les paramètres de bootstrap, il va être de 30 pixels. Ensuite, nous allons à ces marges. Les marges sont fondamentalement tout l'espace sur la droite, cet espace blanc ou et sur la gauche. Donc je vais l'ajuster à 30 quelque chose comme ça. Ok, donc ça me montre ça. Voulez-vous des marges différentes de chaque côté ou des mêmes marges ? Donc, si je clique sur la même marge va le définir 31 pixels, donc un pixel n'a pas beaucoup d'importance, donc je vais vivre avec ça. Ok, donc c'est notre cupidité presque bootstrap. Et si vous voulez vous congee dans la taille de l'orteil 12 sous 11 70 quelque chose comme ça. D' accord. Et si vous voulez des marges différentes de chaque côté, c'est l'option que vous allez utiliser Stop, foulée inférieure et marges gauche. D' accord. Vous pouvez également en faire la colonne par défaut Paramètres ultérieurs. Ok, comme ça, et ça va être réglé par défaut. Donc, chaque fois que vous commencez à utiliser certaines colonnes, il sera dit à ce paramètres Defar. Donc, c'est les bases. Propriétés de base sur n'importe quel tableau d'art. Maintenant, si tu veux un autre tableau d'art, peut-être que je veux un autre jeu de fléchettes. Alors cliquez sur cet outil de tableau d'art et je vais cliquer sur un. Alors quoi ? Ici ? Et elle va générer un autre art maintenant. La deuxième option est que si je veux orteil, il suffit de cliquer sur V. D. Sélectionné en premier et de cliquer sur le tableau d'art à nouveau et vous pouvez voir différentes options de démarrage d'art . Donc, si je veux et iPhone six sonne un modèle ici, je peux cliquer dessus, et il sera parallèle à mon design Web. Ok, donc si je t'ai vu, j'ai encore cliqué. Donc, nous allons déplacer orteil à nouveau, déplacé tout et je vais zoomer un peu afin que nous puissions voir acheté les ennuis d'art. Et maintenant, si je veux le déplacer, je viens de le sélectionner et je peux le déplacer, accord. Donc je peux le placer ici, ou je peux le placer là où je veux. OK, donc c'est comment vous créez des vues différentes sur le même site Norgay et je vais cliquer à l'extérieur et sélectionner l'outil de tableau d'art en appuyant sur un et je peux également cliquer sur tablette Android . Ok, donc, non, j'ai trois vues. L' un est un site Web ou bureau vous que nous avons modèle, vue, et puis nous avons iPhone vue. Si je clique ici, je peux changer sa mise en page orteil quatre colonnes, que nous utilisons normalement sur Mobile APS et obtenu plus. Il va être 16 et je veux que les marges à droite et à gauche soient 24 s. Donc, je vais orteil sélectionner 24 ou ici. D' accord. Donc d'accord, donc ça l'entoure à 25, ce qui est bon. Ok, donc voici ma mise en place pour la version Web sur le même site Web un jeu. Donc, je vais utiliser quatre colonnes ici, et puis je vais utiliser huit colonnes ici, donc vous pouvez voir qu'il est réglé assez loin à huit colonnes, ce qui est très créé. J' adore ce logiciel. Ils ont de très bonnes valeurs par défaut, alors mettons-le à 32. Ok, donc ça a l'air super. C' est ainsi que je vais mettre en place mes ennuis d'art si je conçois différentes vues de mon site Web . D' accord. Donc, vue mobile, vue tablette Andhra et vue de bureau. D' accord. Donc, je ne vais pas entrer dans les détails et créer un design de site Web dans ce, mais c'est comme ça que vous allez mettre en place vos bruts. Maintenant, si vous voulez supprimer un tableau d'art, vous pouvez sélectionner et appuyer sur Supprimer, et il va supprimer ce tableau d'art. Ok, donc c'est aussi simple que ça. En outre, vous pouvez sélectionner ici et supprimer. Et aussi, vous pouvez dupliquer la copie et différentes commandes que vous pouvez voir ici. Ok, donc c'est comme ça que tu utilises les livres d'art. J' espère que vous avez apprécié cette leçon. Passons à la leçon suivante et à bientôt. 12. 8 outils dans XD: dans cette leçon. Nous allons en apprendre davantage sur la barre d'outils que nous avons dans Adobe X'd. Donc je vais passer rapidement à travers tous ces objets et le tabouret bar. OK, donc nous allons commencer avec cet iPhone 678 Nous allons zoomer. Commande zéro sur le contrôle zéro. Et ici, nous avons notre hardball. OK, donc c'est l'outil de sélection le plus riche en V, qui est, euh, ceci vous pouvez sélectionner n'importe quoi avec elle. Ok, alors nous avons l'outil d'angle de secte, qui est notre r et vous pouvez créer mais se termine avec elle. Juste presse sont, et ici nous avons juste glisser et déposer au milieu. Et c'est la frontière. Ce sont des propriétés différentes hors de lui. Nous reviendrons dans cette région plus tard. OK, donc ce sont des alignements. Répétez les hauteurs de nivellement avec l'apparence et différent de ce rayon coin de la bordure de sensation. Nous allons les examiner dans une autre leçon maintenant. Je vais juste vous présenter tous les outils disponibles ici. D' accord ? Nous avons des outils très limités et c'est le truc de la rue à propos de cet adobe extra. Okay, alors nous avons cette éclipse et vous pouvez partager tenir l'orteil de changement, vous savez, vous savez,l' avoir dans une proportion proportionnelle et vous pouvez appuyer sur l'art avec elle sont l'option clé orteil faire et le cultiver dans la destruction. Ok, donc ça va grandir du centre comme ça. Donc c'est à vous de choisir. Je vais le placer au milieu. Ok, alors on a cet outil de ligne. Vous pouvez utiliser cet outil de ligne où vous le souhaitez. Ok, donc nous avons cette ligne. Ensuite, nous avons le combustible usé et ces raccourcis sont très faciles. Et ah, ce que nous appelons dans l'expérience utilisateur. Conception, cartographie, cartographie Il est plus facile de se souvenir. Ok, donc ps Pentti est envoyer un texte à nos frontières un Exumas e. donc ceux-ci sont explicatifs. Tu n'as pas besoin de te souvenir d'eux. Ok, alors nous avons cet outil de texte que nous avons cet outil de stylo avec mental, vous pouvez créer différentes formes comme ça. Continuez à scintiller. Et puis nous pouvons aussi cliquer et faire glisser. Cliquez et laissez-le comme ça. Ensuite, cliquez et faites glisser afin que nous puissions créer de nombreuses formes différentes. C' est presque similaire à un magasin. Ok, nous reviendrons vers elle plus tard en profondeur. Ok, donc c'est du textile. Vous pouvez simplement sélectionner le 30 ou et vous pouvez écrire quelque chose ici comme quelque chose. Qu' est-ce que la presse évasion et c'est tout. Appuyez sur V, et vous pouvez le sélectionner et le déplacer. Maintenant, les options d'alignement. Ou vous pouvez dire que l'alignement intelligent est très sophistiqué pour le nouveau à venir. Votre logiciel de conception est comme un croquis, et ce sera plus au Royaume-Uni. Une fois que vous déplacez quelque chose, il va montrer la distance avec tous les éléments différents ici par rapport à eux. OK, donc ça me dit que maintenant il est aligné sur celui-ci. Et la distance entre ces deux est de 15 pixels. Ok, alors on a ces outils de tableau d'art. Je pense que nous en avons déjà discuté. Vous venez de sélectionner et de créer un autre tableau d'art. C' est le tableau d'art pour iPhone X. Et puis c'est l'outil de zoom que vous pouvez zoomer sur n'importe quel élément. C' est un peu de retour ? J' ai appuyé sur control zero command zero, et vous pouvez zoomer sur tout le port d'art comme ceci. Ok, donc c'est très simple. Vous pouvez également définir le niveau de la zone à partir d'ici dans. Zoom arrière. Ce sont vous pouvez voir différentes touches de raccourci. Contrôle d'un contrôle orteil plus plus et contrôle plus mineur. Zoom arrière et ah, zoom à la sélection, Contrôle ou commande trois. Donc, s'il utilisait Mac, il va être remplacé par la commande. Ok, si simple. Très facile. raccourci. Je vais aux orteils. Créez une leçon séparée pour toutes les touches de raccourci utilisables. Ok, donc nous pouvons rapidement utiliser et commencer à utiliser Adobe X'd. Donc ce sont tous les outils. 3456 et huit outils que vous avez sur lui. Et la plupart d'entre eux sont justice. 123456 Donc six outils un est tableau d'art et un zoom, ce qui est un peu un utilitaire à utiliser sur. Effectuez un zoom avant et effectuez un zoom arrière sur vos tableaux d'art. C' est tout au sujet de la barre d'outils. Ici, nous l'avons fait. Si vous avez des questions à me poser, passons à la prochaine leçon. 13. Outil de rectangle pour créer des boutons: à distance. Et je vais parler de cet outil rectangle et comment nous pouvons l'utiliser et comment il existe différentes propriétés. Laissez-le attendre et comment nous pouvons créer un joli bouton avec la direction. Ok, donc je vais juste sélectionner notre presse sont et nous allons glisser ici et créer un rectangle comme celui-ci. Et vous pouvez voir sur le côté droit nous avons la largeur et la hauteur. Réglons à 75 dans la hauteur de 60. Picks est là. Donc nous l'avons mis à 60 et hiatus à 75. Maintenant vous pouvez voir ici nous avons le premier contrôle, qui est cette opacité, qui est comment sont de retour. Ce sera le cas. Et je vais le laisser 200%. Ensuite, le suivant est le rayon de coin. Donc, si je voulais être là, je vais aller aux pieds. Utilisez un rayon de coin comme six par ici. Vous pouvez voir maintenant qu'il est 100. Donc, si j'ai choisi de concéder Ok, si vous voulez différent pour des raisons différentes pour chaque coin, vous allez sélectionner celui-ci. Ok, donc si j'appuie sur zéro ici et aussi sur zéro pour celui-là. Ok, donc vous pouvez voir maintenant qu'on a deux coins chargés ni tronqués. Ok, donc c'est comme ça que tu peux le faire. Donc si je veux 32 ici, je peux avoir quelque chose comme ça. Ok, donc je vais appuyer sur celui-ci. Donc, si vous voulez une forme de pilule, vous pouvez l'augmenter à, genre, 39 ou quelque chose comme ça. Soy ce 1 39 et vous pouvez obtenir cela été expédié. Mais alors nous avons ces deux propriétés, qui est l'une est Phil, qui est la couleur. Donc je vais le remplir avec une belle couleur bleue. Peut-être que ce magasin Buchler ici comme ça. Ok, alors on a cette frontière. Je pense qu'on va l'enlever tout de suite. Et si vous regardez les propriétés de la bordure, vous pouvez voir ici est combien vous voulez la bordure autour d'elle et remplir la bordure sera Il devrait être dans un coup. Le Bader devrait être à l'intérieur. Ils sont à l'extérieur de notre centre. Donc je vais utiliser dehors et nous allons changer la taille de l'orteil 10 pixels. Donc je vais utiliser dehors et nous allons changer la taille de l'orteil 10 pixels. Ok, donc maintenant vous pouvez voir ici nous avons la sélection et la frontière est en dehors de ça. Ok, donc je vais utiliser une bordure de cette couleur comme ça juste pour vous montrer ce qu'on peut en faire. Ok, alors nous avons cette ombre et le sang de fond. Je ne parlerai pas du sang de fond. Nous allons en parler dans la prochaine leçon maintenant, nous allons ajouter un peu d'ombre à ce bouton, et vous pouvez voir que nous avons cette position de compétition et ce sang. Donc, c'est fondamentalement le rayon sanguin. Jusqu' où il va brouiller le sang de rayon. Cette ombre. Ok, donc si je le mets à 20, vous pouvez voir maintenant l'ombre est plus floue dans cette zone. Si vous regardez de près, ok, pourquoi est la position de ces deux haches ? Et pourquoi la position est-elle hors de votre ombre ? Ok, donc si je veux orteil, faites-le un peu plus en dessous de ma forme, je vais ajouter plus de moi et vous pouvez voir Non, c'est dans cette zone. Il l'est. Je ne sais pas. Ok, donc aussi, je peux le déplacer horizontalement dans la direction. Donc, si j'ajoute 50, vous pouvez voir maintenant qu'il est sur le côté droit. Donc X est le moment de la destruction. Vous pouvez également mettre des valeurs négatives ici moins 10 et il va être dans cette zone de sorte que vous pouvez également utiliser moins neuf. Si vous le voulez, il va se déplacer en haut. Alors c'est comme ça que tu vas mettre ton ombre ? Non. Si vous voulez la couleur de votre ombre, vous pouvez cliquer sur cette zone et vous pouvez définir la couleur de votre ombre. Peut-être que je veux un peu d'ombre dans la gamme de brassage de couleur bleue. Et ah, c'est l'opacité de ton ombre. Je voulais Toby comme 20 % de rabais, 30 % de transparence. Donc vous pouvez voir maintenant l'ombre est comme ça. C' est ainsi que vous allez utiliser les ombres et les différentes choses avec votre forme, rectangle et ah, tout cela est au sujet de ce rectangle. Vous pouvez également les aligner sur l'alignement. Je vais parler de l'alignement dans une autre leçon. Et aussi, vous pouvez l'atteindre. Mais normalement, on n'a pas besoin de le répéter comme ça. Mais si tu veux, tu peux le faire. Ok, donc je vais y retourner. Allez. Voyez votre contrôle, Z Et ce sont toutes les propriétés. Si vous avez des questions à me poser et que vous essayez de créer quelqu'un comme ça, je vais aller à la pointe. Mettez du texte dessus. Bonjour, ma chère. Ok, quelque chose comme ça. Et je vais appuyer sur V et l'exporter au milieu et changer sa couleur de remplissage orteil blanc. Ok, alors passons un peu vers le bas. Ok, donc 16 porcs sont en haut et 17 picks en bas. Donc, si vous pouvez effacer quelque chose comme ça, j'aimerais le voir et essayer orteil. Montrez-moi les boutons que vous pouvez créer dedans. Et j'aimerais les revoir et voir ce que vous pouvez trouver. Ok, Donc tout est sur la façon dont vous pouvez créer différents types de boutons arrondis, arrondis , carré de coin ou Bill sauvé, mais ansf en utilisant x d. Passons à la leçon suivante. 14. arrière-plan et flou d'objets: Parlons de l'objet. Flou de sang et de fond. Fait dans Adobe X'd. Ces deux effets sont très cool. L' un d'eux. J' utilise beaucoup de sang de fond. Ok, donc je vais vous montrer des exemples, tous les deux hors d'eux comment les utiliser correctement. Ok, alors commençons à utiliser du sang d'objet ou ça sur du sang. On a besoin d'une image. Ok, donc je vais juste faire glisser et déposer l'image sur ce tableau d'art, qui est l'iPad, et je vais l'aligner au milieu et appuyer sur le décalage. Et même si je vais le rendre un peu plus petit merci. Donc quelque chose comme ça. Ok, donc on a cette image maintenant. Je veux un sang de fond pour ça. J' ai besoin de n'importe quelle forme. Peut-être que je vais utiliser ce rectangle et je vais orteil utiliser l'ensemble arraché cette presse de toile nous et non, ce rectangle est sélectionné. L' image est derrière. Donc non, je vais utiliser mes antécédents. Donc, une fois que je clique sur ce sang de Bagram, vous pouvez voir tout le fond est floue. Cachons cette frontière et tu peux changer le montant de ce satané besoin. Alors peut-être que je veux autant de sang. Tu veux qu'elle soit brillante dans le côté vital ? Ou vous vouliez être sombre du côté sombre. Vous pouvez voir l'effet est différent et aussi l'opacité. Je n'utilise pas autant. Il va changer l'opacité de cet effet, alors gardez-le orteil 0%. Ok, donc peut-être quelque chose comme ça et quelque chose comme ça et je vais l'étendre en dehors de cette zone. D' accord ? D' accord. C' est ainsi que nous utilisons le sang de fond. Donc, même si vous voulez l'utiliser au milieu comme ça, alors peut-être que je veux juste que cette zone soit floue. Je peux l'utiliser de la même manière. OK, donc cette forme est fondamentalement notre principale zone de sang de fond. Donc, cette forme va définir quelle zone va être floue. Alors on a ça. Si vous allez à cette liste déroulante, nous avons ce plan d'objet qui va faire du sang des orteils. Ce Onley cet objet. Donc, si je clique sur l'objet que vous pouvez voir maintenant notre rectangle est fondamentalement le sang ni le fond. Donc si je change ton orteil Sculler noir ou quelque chose comme ça, OK. Vous pouvez donc voir maintenant que cette forme est en train de se fondre en arrière-plan ni en arrière-plan. Ok, donc c'est la différence entre le flou d'objet et un sang de fond que j'ai utilisé dans mon application mobile. Vous allez concevoir à la fin de ce cours, alors restez à l'écoute, et c'est un effet très cool. Vous pouvez utiliser ce flou d'arrière-plan dans de nombreux endroits et il est à la pointe. Rendez votre texte et vos boutons visibles si l'arrière-plan est très occupé. Donc, c'est à propos de la fille de Bagram et du sang de l'objet. J' espère que vous avez apprécié cette leçon. Passons à la leçon suivante. 15. Outil Ellipse: aujourd'hui, je vais parler des lèvres selles et ah, son but principal. Pourquoi on l'utilise ? Et c'est un orteil très rapide, vous savez, couper le plus de mes images d'avatar. OK, donc on va cliquer et faire glisser comme ça, et je maintiens le décalage pour le rendre en proportion. Et si je voulais grandir à partir du centre, je vais appuyer sur la touche d'option art avec ma touche Maj. Ok, donc je tiens la touche Shift et art et option maintenant pour faire comme ça. Ok, maintenant je vais le placer au milieu comme ça. Je vais cacher sa bordure, et je vais changer sa couleur de remplissage pour que vous puissiez facilement la voir. Maintenant, je vais glisser et déposer n'importe quelle image dessus pour créer un avatar. Rapidement. OK, maintenant vous pouvez glisser-déposer n'importe quelle image sur cette ellipse que vous pouvez voir ou entendre pour créer un avatar rapidement. Donc, ce qu'il fait fondamentalement, c'est qu'il est coupé à l'intérieur de ce cercle. Ok, le problème est que vous ne pouvez pas changer ou déplacer cette image. Ok, donc ce que tu peux faire c'est juste que tu peux augmenter la taille de ce cercle. Il va aux orteils. Augmentez l'image. Et aussi vous pouvez changer la forme que vous pouvez voir ici. Ok, maintenant c'est une forme d'oeuf, et l'image est que vous pouvez voir s'ajuster avec ce vaisseau. Donc, la plupart du temps, nous utilisons l'outil Ellipse à cet effet. Les autres options que nous avons pour un tabouret à lèvres sont presque les mêmes. Nous avons la frontière, le remplissage, opacité, l' ombre et le sang de fond. n'y a rien de grand chose à ce sujet. Donc, la plupart du temps, nous l'utilisons à cette fin. Il suffit de glisser et de déposer n'importe quelle image pour créer un radar. Nos icônes comme ça. Donc, c'est tout au sujet de la balade de glissement. Si vous avez des questions à me poser, passons à la prochaine leçon. 16. Les bases de l'outil du stylo dans XD: dans cette leçon, nous allons créer ces trois icônes. L' un est ce fromage. L' une est cette icône de carte et l'autre est cette icône de chat utilisant Adobe Excuse. Donc, d'abord, nous allons apprendre à utiliser dépenser deux regarder. Je ne vous recommande pas d'aller de l'avant et de créer toutes les icônes de type différent à l'aide d'Adobe Extra car il n'est pas destiné à créer AARP. Les icônes sont des icônes. Vous pouvez simplement utiliser les icônes SPG de toutes les lignes. Il y a beaucoup en ligne gratuit sur les bibliothèques. Off icônes SVZ sont si d'abord nous allons voir comment utiliser Bento. Donc, je vais créer une autre expiration de conseil d'art de cet iPhone X et assumer dans un peu. Et d'abord, nous allons aux pieds. Sélectionnez cet outil de plume pour créer des formes simples. Cliquez, cliquez, cliquez, cliquez, cliquez ou cliquez sur OK et cliquez sur retour sur le premier point et il va fermer le navire. Vous allez appuyer sur V, et maintenant vous pouvez déplacer cette forme ici. Donc, voici comment vous créez des navires simples maintenant contre, comme cet outil de stylo, cliquez et cliquez et faites glisser pour obtenir quelques coins arrondis et puis je vais cliquer, étaient ici et puis cliquez sur retour. Donc ici, j'ai créé une arche par ici. Donc, si vous double-cliquez sur cette forme, vous pouvez voir que vous pouvez cliquer sur n'importe quel de la et il y a le guidon. Vous pouvez les ajuster après que vous le souhaitez, comme vous le souhaitez. Ils bougent alors que je bouge ça. Ok, donc j'ai choisi celui-là. Donc si je veux juste déplacer celui-ci et que ça ne devrait pas affecter celle-ci, vous investissez votre option ou Archy. Ok, Donc sur votre clavier, si vous appuyez sur votre touche are, puis cliquez et déplacez ceci, il va bouger. Juste celui-là. Ok, donc ce sont les deux poignées, donc maintenant ça va bouger indépendamment. Donc, si je l'aligne avec cela, vous pouvez voir que c'est maintenant une ligne droite. Donc, si j'ai sélectionné, c'est une ligne droite. C' est une ligne incurvée. C' est ainsi que vous contrôlez et éditez vos pièces et ah, différents points d'ancrage. Donc si je double-clique dessus, il y a trois points d'ancrage ici. Ok, donc l'un est celui-là. Je peux aussi utiliser quelque chose comme ça. Donc j'appuie sur l'orteil de changement, aligner dans un angle parfait. Donc, il est en ce moment, je pense que 90 degrés ou voulait degrés. C' est ainsi que j'ai créé cette bosse. Très gentil. bosse lisse. Ok, donc c'est comme ça qu'on utilise notre pento. 17. Outil du Pen pour créer des icônes: Ok, donc je vais supprimer cette forme. Et maintenant je vais commencer par le rectangle Tauqir, cette première icône. Nous allons donc créer un rectangle. OK, alors, appuyez sur V et maintenant on a l'angle de secte. Double-cliquez dessus. Et nous avons ces quatre points d'ancrage. Maintenant, nous allons sélectionner Ah, mental maintenant. Si vous ne sélectionnez même pas de crayon, vous pouvez voir le lieu, Khobar. Sur ces lignes où vous pouvez mettre quelques points d'ancrage, il est tourné orteil mental, Donc il suffit de cliquer une fois mais ici, une fois par ici et un quelque part. Nous avons donc ajouté trois points d'ancrage à ce vaisseau. Maintenant ce que je vais faire, c'est que je vais appuyer sur V, et je vais le déplacer en bas comme ça. Bon, maintenant j'ai ce vaisseau de base, donc si je double-clique dessus à nouveau, je peux sélectionner ce point d'ancrage et je peux le déplacer. Si vous voulez quelque chose de mal ici, double-cliquez dessus. Et vous allez obtenir ce nid autour autour ici et points d'ancrage plus de guidons pour contrôler la rondeur de votre forme à nouveau afin que vous puissiez voir maintenant que j'ai arrondi cette zone comme ça. C' est donc une façon de créer plusieurs formes différentes à partir de navires de base. Ok, maintenant on va créer ce fromage, OK ? Donc la plupart des souris vont vraiment adorer ça si elles regardent mon père, celui de Dorian. Ok, donc on va faire un clic une fois, cliquer deux fois, et j'ai un guidon ici. C' est une autre façon, et je vais juste cliquer ici, et alors ce que je vais faire, c'est que je vais aller au bout d'eux en ce moment comme ça. Et je vais appuyer sur ma touche d'option d'art pour déplacer ça comme, Ok , donc , non, c'est redressé. Et nous allons le déplacer pour faire une parfaite Elle est comme ça. Ok, donc nous avons notre vaisseau. Faisons la bordure deux pixels. Et pendant l'orteil de couleur de remplissage, ce jaune tout peut être un peu plus léger, jaune comme ça. Ok, donc on a surforme. Nous allons ajouter quelques formes plus ici avec ce tabouret ellipse. Donc, j'appuie sur l'orteil de changement effacé, déplacer et glisser pour créer les cercles comme ça. Ok, donc nous avons nos formes maintenant, nous pouvons changer la couleur de la bouteille pour celle-là, qui est un jaune plus foncé et ah, nous avons un très destin. Bon sang, ce n'est pas bon d'appeler une balade si tu m'aimes. J' ai un taux de cholestérol élevé, donc ce n'est pas bon pour moi, mais quand même. Ok, donc nous avons notre icône du fromage. C' est ainsi que vous créez des formes personnalisées, Icône. Maintenant, je vais créer celui-là. C' est essentiellement maire par maïs. C' est très facile. Il suffit de sélectionner ce tabouret ellipse élevé, Ah, les lèvres ici. Et ce que je vais faire, c'est appuyer sur V DoubleClick et je veux juste changer ce guidon. Donc je viens de sélectionner celui-ci, ce point d'ancrage, et je vais appuyer sur les touches Maj et fléchées pour le déplacer en bas comme ça. Ok, maintenant notre forme de base est complète. Ce que je vais faire est de double-cliquer ici pour obtenir notre coin pointu. Ok, donc c'est très beau truc DoubleClick orteil obtenir des coins arrondis différemment pour obtenir des coins pointus . Ok, donc j'ai un coin pointu par ici. Maintenant, je vais créer une autre petite ellipse de forme à l'intérieur comme ça et juste sélectionner la forme extérieure et, ah, juste enlever la bordure et utiliser la couleur de remplissage à quelque chose comme, Oui, je vais utilise ce coup. Utilisons ce bleu. Ok, donc pour celui-ci, je vais enlever la frontière, et je vais ajouter une ombre ici, qui va être zéro zéro et six. Ok, pas d'ombre est qu'il allait mettre cette forme et juste l'aligner ici comme ça . Sélectionnez ces deux-là, et je vais l'aligner au milieu comme ça. Ok, donc vous pouvez voir ici notre icône de carte est également construite. Vous pouvez l'étendre si vous le souhaitez. Vous pouvez rendre cela un peu vital de le rendre plus professionnel. D' accord. D' accord. Donc, voici comment vous pouvez créer différentes icônes en utilisant mental. Je ne vous recommande pas d'aller de l'avant et de créer quelque chose comme ceux-ci ou quelque chose comme celui-ci , vous pouvez utiliser des icônes SVG déjà construites et créées professionnellement. SPD est synonyme de graphiques vectoriels évolutifs et dans les leçons suivantes, quelques leçons ou dans les dernières leçons où nous allons créer notre application. Je vais vous montrer comment utiliser les icônes SPG. D' ici là, je te verrai bientôt. Dans une autre leçon, passons à la liste suivante. 18. Outil de ligne: Maintenant, parlons de l'outil de ligne. Si nous cliquons ici ou appuyez sur l c'est un outil de ligne et vous pouvez créer une ligne ou un séparateur avec elle. Ok, donc c'est notre ligne. C' est la frontière de cette ligne. Créons une bordure de cinq pixels comme ça. D' accord ? Donc aussi, vous pouvez voir que ces options sont cachées ici. Je ne suis pas sûr qu'ils soient activés ou non en premier lieu. Créons dans la ligne. Ok, donc cette frontière extérieure n'est pas une option pour celle-là. Ce n'est qu'une ligne. Et, ah, tu peux changer la couleur si tu veux. Oh, et aussi l'opacité, l' ombre et le retour sur le sang. Ce sont les quatre options que nous avons ici. La seule utilisation hors de l'outil de ligne, ce que je vois est qu'il va être utilisé pour le texte du lien. Donc si j'ai un lien ici, je peux mettre une ligne et ça comme ça. Ok, donc c'est la seule nouvelle que je peux penser. Et vous je conçois pour cette ligne à la recherche. C' est donc tout au sujet de l'outil de ligne. Si vous avez des questions, vous m'avez posé. Passons à la leçon suivante où nous allons voir l'outil de texte 19. Outil de texte dans Adobe XD: Non. Nous allons parler de cet outil de texte, savon, lusty ou texte. Et je vais traîner les pieds ici comme ça pour créer un paragraphe. Tout ce que vous pouvez simplement cliquer n'importe où pour effacer. Juste à la ligne de Dexter ici. Donc, je vais créer un paragraphe ici. Ok, maintenant, j'ai du texte dans mon paragraphe. Je peux simplement cliquer n'importe où ailleurs pour créer un paragraphe et seins V et je peux étendre sont contractés en utilisant les poignées de la que vous pouvez voir ici. Ok, donc je vais utiliser ça comme ça et le déplacer ici comme ça. D' accord ? Maintenant, sur le côté droit, vous pouvez voir que nous avons un texte. C' est le téléphone. Tu peux changer de téléphone, tout ce que tu veux, Toe. Et là, nous avons le fort. Nous avons tous les styles différents. Et cette Ford, c'est la taille que je veux 24. Je peux sélectionner 24. Maintenant, il se cache. C' est le rendre plein. Et, euh, que certains sont là pour voir la taille réelle du correcteur. Ok, alors on a cet alignement. C' est le centre. Ceci est essayé, aligné, a laissé une ligne. Et c'est la différence entre notre texte d'idée ou vous pouvez voir un paragraphe et un texte de point de ligne . Ok, donc nous avons ce texte de point. C' est mieux pour l'alignement. Vous pouvez voir maintenant qu'il s'agit d'un carré fixe. Ok, donc si j'essaie de changer les orteils. Il ne s'agit pas fondamentalement d'un paragraphe. Il s'agit d'un paragraphe. Donc, ce n'est qu'une nouvelle fonctionnalité. Ils y ont ajouté. Ensuite, vous pouvez le souligner si vous le voulez. Et puis nous avons cet espacement de ligne que vous pouvez mettre orteil autre chose si vous voulez. Oh, comme si je l'avais mis à 32. Et c'est un cactus qui pissait la largeur de l'espace à l'intérieur du réalisateur. Donc, s' il avait 10 ou 25 ans, vous pouvez voir maintenant l'espace entre les lettres est beaucoup. Ok, donc ce sont les principaux contrôles que nous avons à nouveau. Les mêmes contrôles similaires, comme tous les autres rectangles. Laura, les outils. Nous avons un laissez-passer. Nous avons échoué. Nous avons des frontières, ombre et de l'arrière-plan, du sang, du sang. On n'utilisera nulle part sur cette ombre. Peut-être que nous allons utiliser quand il y a un fond sombre ou quelque chose comme cette bordure. Je pense qu'on n'utilisera pas le fond. Reste avec le Phil et ah, utilise n'importe quelle couleur que tu veux. Comme celui-là. Et c'est tout ça. Ah, vidéo texte. Maintenant, il n'y a qu'un requin qui vient dans cette zone, ce qui est que ce serait génial si je peux voir différents styles ou cheveux. Et maintenant je peux juste voir le nom de téléphone hors de la partie force Nordea comment ça ressemble ou comment ça ressemble. Ok, donc je dois passer à ça pour voir ce style de force. Donc, je pense que peut-être qu'ils auraient pu fondamentalement le faire juste à un plus grand traitement et le rendre rapide. Ok, donc peut-être que dans les versions ultérieures, ils pourraient ajouter du textile d'aperçu ici pour une force différente. C' est donc tout au sujet de l'outil de texte dans adobe X t. J'espère que vous avez apprécié cette leçon. Passons à la leçon suivante. 20. Outil polygon - UPDATE: Nous ne parlerons pas d'un tout nouvel outil qui a été introduit dans Adobe EC. Steve démange. Ils repérent sur l'outil et vous pouvez plus pourquoi, trop lisse ou juste cliquer ici. Et maintenant, nous allons dessiner un polygone. Donc ici, je le dessèche. Si vous pouvez maintenir un décalage de presse, il va être dans des proportions et juste laisser comme ça. Maintenant, vous pouvez voir sur la droite ici dans l'apparence coup de couteau, nous pouvons contrôler son opacité. Nous pouvons changer sa taille Conch, par exemple, sur les sites que nous voulons, comme cinq côtés et nous pouvons le changer pour combattre. On peut aussi changer sa couleur remplie. Par exemple, si je veux l'avoir, peut-être dans cette couleur et que je veux cacher la bordure, je peux cacher la bordure, et je peux aussi avoir un rayon de coin comme 50 20 ou des choses comme ça, quelque chose comme ceci. Et je peux aussi contrôler le rayon de coin de là pour vous voir qu'il s'agit d'un petit cercle à l'intérieur. Si je veux changer le rayon de coin, je peux l'utiliser. Ok, donc si je veux orteil, il y a huit coins à concéder. Je peux avoir huit coins, donc c'est un outil très pratique. Si vous voulez créer des flèches ou des choses comme ça. Je pense que c'est l'une des formes de base autres que le rectangle, ellipse. Et c'est un polygone ou un triangle. On avait besoin de quelque chose comme ça. Des chars d'épée à obéir. Vous avez ajouté quelque chose comme ça, Sénateur B X d. J'espère que vous allez l'essayer et créer des formes à l'aide de cet outil polygone. Il est presque similaire à d'autres rectangle et ellipse sur. Et c'est tout au sujet de ce nouvel outil polygone. Passons à la leçon suivante. 21. Couleurs et palettes: aujourd'hui, je vais parler des couleurs et comment nous pouvons créer qui créer des jeux de couleurs dans Adobe X'd. Ok, alors commençons. Commencé avec ce tableau d'art, qui est l'iPhone 678 Et ce que nous allons faire est juste de créer un coin très agréable, rond, rond,à la terre. La Grande-Bretagne. Je vais appuyer sur la télé et la déplacer et créer six cochons de la grognesse. Ok, donc j'ai l'air super. Ok, donc je vais aller aux pieds, enlever la frontière. Et quand je vais à cette couleur de remplissage, si vous cliquez ici, vous pouvez voir ici nous avons nos couleurs. Ok, donc nous avons ça. Ah, vous bar où on peut changer la teinte de la couleur que vous voulez. Qui est fondamentalement la couleur moyenne. Ok, donc peut-être que si j'aime y aller, toi et moi voulons qu'il soit là, ok ? Donc, quand je monte dans la destruction et que la teinte ou la saturation est éteinte, cette couleur augmente en fait, Ok, Donc quand j'ai déménagé dans la zone de découverte, il devient plus sombre dans cette zone. Il va devenir plus léger. Ok, ajoutez une invitation. Donc je vais garder les orteils presque au milieu par ici. D' accord ? Maintenant, c'est l'opacité. Donc si tu voulais être transparent, tu peux bouger ça, je crois. Ah, je devrais le garder ici. Ok, donc c'est comme ça que ta boîte de couleur unie, Ok. Non. Ah, voici quelques options que nous allons en discuter. Est-ce la valeur décimale exacte ? C' est donc ce dont vos concepteurs web vont avoir besoin. Les orteils colorient les Britanniques. Ok, donc c'est pour les développeurs. Donc, si vous voulez, vous pouvez convertir ce RVB plus, qui est rouge, bleu, vert et Alfa RVB. D' accord. Et, ah, normalement nous concepteurs, j'utilise normalement cette teinte, la saturation et la luminosité, saturation et la luminosité, qui est plus facile à contrôler et plus facile orteil. Vous savez, j'ai juste vos couleurs dans créer de beaux schémas de couleurs. En utilisant ça, c'est SB. Ok, donc ici nous avons vous que la saturation. Combien de couleur vous voulez mettre en saturation de cette couleur. Et c'est la luminosité. Ok, alors à quel point le joculaire devrait être brillant ? Donc, si je le réduit à 90%, vous pouvez voir maintenant cette couleur est à la recherche créé est une couleur bleu un peu plus foncé . Ok, remontons à cette année. D' accord ? Donc, non, vous pouvez ajouter votre couleur orteil votre étirement de couleur. Donc il suffit d'appuyer sur cette icône plus et vous pouvez voir ici nous avons $1 ajouté ici. Ok, maintenant, si je veux ajouter une circulaire, le meilleur moyen est juste de changer ça. Ok, donc je veux que ça soit créé. Et peut-être juste deux très quelque chose. Je vais aux orteils. Ah, réduisez sa luminosité orteil 80%. Voyons comment cette couleur apparaît. Donc je vais ajouter celui-ci pour qu'on puisse aller à quelque chose comme ça, ce noir foncé. Donc vous pouvez voir ici. J' ai créé une très belle palette de couleurs et vous pouvez voir la plupart des couleurs que j'ai générées ici. Ils sont vraiment assortis. Super. OK, donc ce sont toutes des couleurs médicales, ce bleu Seong et cette couleur bleue. Maintenant, tout est à propos de ce panneau de couleurs. Comment vous pouvez être un jeu de couleurs différent ici, se déplaçant dans cet espace 22. Gradients de couleurs dans Xd: Maintenant, on va aller à ce radiant linéaire. Tellement indulgent. Brillant, c'est que nous avons une et deux couleurs et c'est l'angle ici de haut en bas. Donc 90 degrés est l'angle de votre ingrédient. Ok, donc on a mélangé ensemble pour que vous puissiez voir non, si je bouge l'angle de changement de l'ingrédient. Donc si je le déplace comme ça, d' accord. Et, ah, changeons les couleurs pour autre chose. Donc, vous pouvez voir maintenant j'ai créé un très joli bouton int gourmand ici. Et si je veux changer l'angle, je peux changer l'angle comme ça, peut-être le déplacer comme ça pour que vous puissiez voir à quel point il a l'air génial. Encore une fois, je vais cliquer sur ça et aller aux pieds, Phil. Et vous pouvez voir ici nous avons notre radiant Essayons d'ajouter disque. Rayonnant. Donc, il n'y a pas d'ajout ici. Donc c'est une chose. Je pense qu'ils devraient avoir quelque chose. Eso si j'appuie sur ce bouton, il devrait ajouter mon gourmand. Et par ici. Ok, donc ça n'ajoute pas ici, mais on peut l'ajouter à quelque chose ailleurs. Droit ? Cliquez et cliquez sur ce tueur d'annonces. Ok, donc une fois que j'ajouterai cette couleur, ce sera dans mes actifs des tueurs. Vous pouvez voir par ici. C' est mon guide de style. En gros. Donc je vais tout couvrir plus tard. Deux tueurs dans Adobe Extra. Ok, donc nous avons cette couleur. Ensuite, nous avons les quatre couleurs. En ce moment, ils ne sont pas ajoutés à cela. Donc nous pouvons faire est juste de créer quelques rectangles que je vais créer lundi enchevêtrement. Et je vais le dupliquer en appuyant sur l'art ou la touche d'option plutôt que de le faire glisser comme ça . Et comme cette nana maintenant, je vais utiliser les mêmes couleurs que je veux ici. Retirez juste la bordure et je vais utiliser ce sculler que décolorer. Ok, puis découvert Maintenant voici mon schéma de couleurs. Juste créé ceci instantanément, alors ne vous inquiétez pas beaucoup à ce sujet. C' est quoi ce schéma de couleurs ? Ok, donc je vais orteil comme, sélectionnez toutes ces couleurs et je vais faire un clic droit et ajouter de la couleur. D' accord. Donc vous pouvez voir Non, j'ai toutes mes couleurs bougent vers mes actifs. D' accord. Vous pouvez également advi couleur ou variations de blanc ou de pâturage. Si vous souhaitez l'ajouter à votre jeu de couleurs. Ok, donc c'est la façon dont vous pouvez ajouter des INT gourmandes et tout le cholestérol, votre palette de couleurs ou le guide de style. D' accord. Guide de style est essentiellement l'orteil guide pour vos développeurs et vos concepteurs que quelles couleurs sont utilisées dans quel but et comment nous pouvons construire ce système de conception en utilisant ces couleurs . Ok, donc maintenant, arrivant au dernier point, qui est un ingrédient Zadie, ils viennent d'ajouter cet ingrédient vraiment, qui est un int gourmand de l'intérieur. Il bouge dans un cercle, alors rendons-le un peu plus grand comme ça. Ok, alors faisons-en un arrière-plan. Donc je vais aller aux pieds, créer un sac comme ça. Il est plus visible. Ce genre rayonnant est plus visible lorsque vous avez un fond. D' accord. Donc, vous pouvez voir maintenant il est à la recherche grille à l'intérieur d'un sac rond. Changeons nos couleurs pour celle-là. D' accord ? L' un est un peu plus sombre. Un dans le 2ème 1 est un peu plus léger. Retirons ça. Ok, alors essayons avec ça. Changeons cette couleur plus foncée avec ce bleu. Et, euh ok, donc ça a l'air super. Déplaçons, Ajoutez-y quelques points supplémentaires. Donc j'ai juste cliqué ici et ajouté un point de plus. Ok, donc je vais changer la couleur en noir. Ou peut-être quelque chose de plus net que ça ne peut pas. Je vais vous dire de tout coeur ces points d'ingrédients radiaux. Ok, Donc seul point que vous pouvez supprimer est le point que vous avez créé jusqu'à présent un ingrédient. Il doit y avoir deux couleurs. Ok, donc ils ne sont pas Ah, je ne suis pas capable de dire supprimer ces deux points et c'est juste. La plupart ou 0% et 100%. Et le point que j'ai créé au milieu, j'ai terminé en appuyant simplement sur supprimer sur mon clavier. Tout ce que je peux déplacer comme ça et le faire glisser, et il va être supprimé. Ok, donc ces deux couleurs, elles sont, vous savez, nécessaires pour cet int gourmand, et vous pouvez contrôler l'ingrédient d'ici. Ok, donc si tu veux, c'est quelque chose comme ça. Vous pouvez voir maintenant cela est à la recherche d'un grand fond. Ok, alors mettons un message ici pour que vous puissiez voir ce que j'ai fait. Je viens d'ajouter une ligne avec l'épaisseur de cinq. Et je n'ai pas seulement invité un texto. Bonjour, Docteur. Et ça a l'air superbe. Ok, donc vous pouvez être ce genre d'arrière-plans pour vos écrans d'ouverture de session ou pour les écrans d'inscription. D' accord. Avec un ingrédient dedans. Donc, tout cela est sur les couleurs et l'ingrédient radio dans les couleurs unies et les ingrédients linéaires . Et ces trois couleurs off de Moore Hexi décimal RGB et être normalement nous allons utiliser celui-ci ou Hexi décimal pour Web principalement, mais je pense que celui-ci est parfait pour créer les jeux de couleurs, ok ? 23. Utiliser coolors.io pour créer des schemes couleurs: un outil que je recommande pour la génération de schéma de couleurs est celui-ci refroidisseurs point ru ? Je suppose que vous pouvez rechercher ce nom sur Google. Je vais partager l'u R l Alors allez à cela. Générer ? Oui. Donc, je vais aller à ce généré et il va commencer avec quelques couleurs aléatoires. Ok, donc ce que je suggère c'est que vous essayez d'abord d'utiliser une couleur que vous avez déjà. Ok, donc je vais me baser sur une couleur bleue de mon schéma de couleurs ou deux couleurs à partir de là pour obtenir le reste des couleurs. Ok, alors revenons à X'd. Maintenant. Ce que je vais faire, c'est que je vais copier cette couleur bleue et ce Ah, voir, voir, sur un orteil de couleur, mon schéma de couleurs. Ok, donc je vais aller à la pointe, copier cette valeur valeur valeur décimale, et je vais revenir ici. Ok, donc j'ai une couleur d'entreprise, et je vais l'enfermer ici. OK, alors appuyez sur cette serrure et elle va vous montrer la serrure fermée. Ok, alors je vais copier la deuxième fille ici, et je vais aussi verrouiller cette couleur. D' accord ? Maintenant, je dois enregistrer les couleurs. Maintenant, je vais appuyer sur la barre d'espace pour obtenir plus de couleurs. Couleurs l'Amérique à ces deux tueurs. Ok, donc on a cette couleur pourpre. Ça a l'air bien. Aussi, cette couleur bleue je suis j'aime cette couleur bleue. Et nous pouvons aussi utiliser quelque chose comme celui-ci qui est un peu orange. Maintenant, dans mon schéma de couleurs original, j'utilise quelque chose de plus proche du jaune et ah, ce violet est un peu violet foncé, donc vous pouvez créer n'importe quel jeu de couleurs. Non, je vais encore appuyer sur la barre d'espace et j'aime cette couleur. Ok, alors je vais appuyer à nouveau sur la barre d'espace pour que vous puissiez verrouiller n'importe quelle couleur que vous voulez. Ok, donc j'ai enfermé ces enfoirés. Donc celui-ci ne va que changer. Donc je n'aime pas cette couleur trop jaune. Peut-être que celui-ci est bon, Onda. Peut-être que je vais essayer un peu plus de temps. J' aime vraiment cette couleur jaunâtre, bien qu'elle soit un peu terne, mais je pense que ça ira bien avec ces milieux. Ok, Donc une fois que j'ai ce jeu de couleurs généré, je peux prendre une image ou une photo de ceci ou Ah, je peux l'exporter dans un fichier PDF ou PNG ou SVG 5. Donc, nous allons utiliser le fichier SVG. Il est donc clair créé ce fichier SVG. Maintenant, je vais importer ce fichier svg dans mon, euh X'd. Ok, donc moins. Allons le déplacer ici. Non, vous pouvez voir ici que nous avons ce schéma de couleurs, fichier svg, et, euh, je vais aller aux pieds. Rends-le un peu plus petit comme ça. Diluons ce fond et tout le reste. Maintenant, vous pouvez voir que vous avez ce schéma de couleurs et il est inévitable. Vous pouvez voir ici nous avons 45 boîtes et vous pouvez changer votre schéma de couleurs. Donc c'est comme ça que je vous conseille de l'avoir pris. Schémas de couleurs. Vous devez avoir au moins une ou deux couleurs pour commencer. Vous pouvez saisir ces couleurs à partir de l'icône de l'application ou du logo de cette entreprise et commencer à partir de là. Donc, tout est sur les couleurs et comment créer des jeux de couleurs. Instantanément avec ce tabouret et ces quelques conseils. J' espère que vous apprécierez cette leçon. Passons à la prochaine 24. Masques dans Xd: dans cette leçon, nous allons apprendre sur le masquage et comment nous pouvons le faire dans un no b x d. Il y a deux façons, et l'une est ah, ce que j'aime vraiment c'est comment nous pouvons contrôler nos mosquées et l'image à l'intérieur . Ok, donc maintenant nous allons créer celui-ci, et vous pouvez voir si je double-clique dessus, je peux déplacer l'image comme ça. C' est donc une mosquée contrôlable. Maintenant, si je crée un elipse simple comme celui-ci, Ok, donc je vais vous montrer tous les deux. Maître, c'est le plus simple, et ce n'est pas irritable. Donc je vais juste glisser et déposer cette belle image de fille dans celle-ci. Ok, donc nous avons ce clip dans cette ellipse, et vous pouvez voir qu'on ne peut pas l'éditer. Donc, si je double-clique dessus, il va modifier la forme, mais je ne peux pas déplacer l'image autour. Ok, donc c'est sa limitation. C' est donc une façon de créer instantanément des mosquées. Maintenant, je vais le diriger, et nous allons créer cette mosquée. D' accord. Donc, la masse sur mesure. Je vais aussi supprimer celui-ci. Donc, abord, tout ce que nous allons faire est que vous pouvez soit utiliser n'importe quel rectangle dans la forme que vous voulez, soit vous pouvez construire votre forme avec un mental. Donc, je vais orteil ici la forme avec mon outil de stylo, cliquez, faites glisser, cliquez, faites glisser. Et je vais créer quelque chose comme ça. Juste un vaisseau personnalisé. Donc, j'ai cette surcharge de forme personnalisée, et j'ai ce rectangle ici. Ok, c'est autour de ce rectangle. Pixels orteils Ok, donc on a deux formes ici en ce moment. L' un est celui-là. Ok, donc c'est un autre. Ok, donc nous avons cette partie, qui est Ah, forme personnalisée. Nommez-le forme personnalisée. Donc j'ai développé, genre, cette zone, et j'utilise cette chose et nous allons créer Call this rectangle. Ok, donc mon sexe orthographique, donc ne t'inquiète pas pour ça. Ok, donc maintenant ce qu'on va faire, c'est que tu vas aller aux pieds. Ah, glissez et déposez n'importe quelle image. Donc je vais faire glisser et déposer une image ici comme ça. Ok, maintenant l'image est très grande, donc vous pouvez juste la raccourcir avec le décalage et l'art je vais l'utiliser et aller le raccourcir . Il suffit de zoomer, contrôler ou de commander moins, et nous allons utiliser celui-ci. Ok, donc comme ça. Ok, donc je vais le placer ici pour que vous puissiez voir la forme. D' accord. Maintenant, l'astuce est que vous allez utiliser je vais utiliser ce rectangle. Je vais donc déplacer ce rectangle au-dessus de cette image dans mon panneau de calques. Ok, donc maintenant je suis ça dans ces couches, et cette image est en dessous, et l'angle de secte est en haut. Non, je vais changer les orteils et je clique sur le bâbord pour sélectionner le bateau de tous. Vous pouvez les sélectionner tous les deux à partir d'ici. Droit ? Cliquez sur. Et vous pouvez voir qu'il y a une mosquée optionnelle avec un quart de navire. Control em ou shift commande M est une touche de raccourci, et vous pouvez simplement appuyer dessus et maintenant il a glissé à l'intérieur de cette boîte. Maintenant, cool, c'est que si je me développais comme ça, je peux déplacer l'image comme ça. Donc c'est vraiment cool. J' ai donc plus de contrôle sur ma mosquée, et je peux changer l'emplacement de l'image. Peut-être que je veux me concentrer ici. Je peux utiliser quelque chose comme ça. Ok, maintenant nous avons une forme personnalisée. Et de même, nous allons juste le faire plus gros et faire tourner le pied 30 comme ça. Ok, maintenant je vais le croire, et je vais utiliser ce vaisseau à la place. Et je vais importer ce fichier, Il suffit de glisser et déposer, et il est très grand. Donc je vais aller aux pieds, le rendre un peu plus petit. Ok, donc c'est à la maison. l'extérieur. Vous pouvez voir que l'image est trop grande pour notre zone d'écrêtage. Maintenant, ils sont presque bons. OK, donc je vais déplacer cette forme personnalisée au-dessus de cette image et aller à sélectionner les deux hors d'eux en appuyant sur Maj sur mon clavier et clic droit et peut mosquer avec navire. Donc nous avons une belle mosquée ou ici et c'est juste bouger et ah, aller quelque chose comme ça rend ça plus intéressant. Et maintenant vous pouvez voir que je peux aussi changer cet idiot demander nos têtes. Si je fais quelque chose comme ça, vous pouvez voir que je peux changer la zone de la mosquée, donc double-cliquez. Et vous pouvez également changer cette mosquée dans la zone, puis aussi cette image afin que vous puissiez voir la boîte de délimitation de cette demande Inde est différente et cette image est différente. Pour sélectionner cette image, vous pouvez voir Non, ceci est de sélectionné afin que je puisse déplacer cela comme ça et je peux ensuite cliquer à nouveau n'importe où ailleurs orteil, voir ma mosquée. Ok, c'est ainsi que vous pouvez créer des mosquées sur des mosquées personnalisées dans Adobe X'd. Ils sont vraiment utiles dans votre conception. J' espère que vous avez apprécié cette leçon et passons à la suivante. 25. Styles de personnages dans XD: Maintenant, je vais vous parler des tuiles de pratique et comment vous pouvez réutiliser vos textiles dans tout votre document Un jeu. Maintenant, moment, je suis ça dans cette profondeur d'actifs, qui est par ici. Ok, Donc, vous allez orteil appuyez sur celui-ci, et vous allez orteil Venez à cette actif donc ou tout dans votre étape d'actifs si leurs couleurs, correcteur, styles ou symboles, ils sont mondial. Donc, si vous changez quelque chose ici, il sera reflété dans tous vos tableaux d'art. Ok, Alors laissez-moi illustrer exemple hors style tracteur et comment nous pouvons en ajouter quelques-uns. C' est mon cap. Ok, donc j'ai créé un changement de cap Lex, Sculler toe quelque chose d'autre comme celui-ci. Et je vais le créer dans un paragraphe. Déplaçons ça en deux lignes comme ça. Ok, donc c'est mon cap, et ensuite je vais créer des orteils. Ah, paragraphe par ici. Il utilisait régulièrement. Ok, donc c'est mon paragraphe, d'accord ? Et aussi, je vais changer sa couleur pour autre chose. Peut-être que j'en veux. Ah, couleur gris clair noir par ici. Comme celui-là. Autre que ah, pitch black. Ok, donc juste pour faire la différence entre mon titre dans mon paragraphe. Ok, donc c'est mon pantagraph. Ajoutons un autre lien. Ok, donc la maison I liens seront cliquer ici pour passer à autre chose. Donc c'est mon lien. Je vais utiliser la couleur, qui est celle-ci pour ce lien et je vais utiliser un soulignement. Ok, donc c'est mon lien. C' est mon paragraphe. C' est mon cap maintenant. Ce que je vais faire, c'est que je veux qu'ils soient tous dans mes styles de personnages. OK, donc je vais les sélectionner tous et aller orteil Cliquez à droite ? Cliquez sur et ajoutez un style de caractère. Ok, donc maintenant vous pouvez voir qu'on a trois styles. Il me montre le quatrième nom. J' ai utilisé ça. Voir Goy, vous I et aussi différentes tailles et couleurs 48.20 point. C' est un peu terne, Grey. C' est une couleur sombre, noirâtre et puis nous avons ce plaisir pour nos liens dext. Laisse-moi te montrer quel est le courant ? Ok, donc je vais appuyer sur notre tibia et je vais dupliquer ça sur un autre tableau d'art. Donc on n'a pas de livres d'art Ok, donc je vais le changer. Fais quelque chose. Ça va. D' accord. Maintenant, ce que nous allons faire, c'est que nous devons changer la couleur de ces titres simultanément . D' accord ? Maintenant on peut le faire à partir d'ici. Craqué de côté, non ? Comme à elle. Et je vais aller aux pieds. Utilise un autre. Quelque chose d'autre comme celui-ci. Et je vais utiliser une autre couleur. Peut-être que je veux cette couleur sur peut être découvert. D' accord. Maintenant, vous pouvez voir comment j'ai changé instantanément tous les styles de réalisateur, ce qui est fondamentalement mes quatre styles. Et ils sont globaux. Donc, si je le change dans un domaine, ça va changer partout ailleurs. Ok, c'est vraiment cool. D' accord ? Donc, si je veux changer mes paragraphes, oui. Où est mon paragraphe ? Je pense que c'est mon paragraphe. Je vais modifier sa couleur. Je ne le fais pas. Je voulais avoir plus de degré. Je peux changer la couleur d'ici. Maintenant, vous pouvez voir que j'ai changé le degré d'orteil Sculler et je peux aussi changer d'autre parement. Donc si je veux changer, la Ford est l'espacement. Tout va être changé. Donc si je veux une télé, allez ici et je veux que l'espacement soit linéaire. Salut, Toby. 28. Je peux le changer d'elle. Ok, donc c'est très pratique. Vous pouvez changer n'importe quoi instantanément sur tous vos différents tableaux d'art. D' accord ? Donc, si vous avez, genre, 20 tableaux d'art sont des écrans et que vous voulez changer de cap, vous pouvez le faire instantanément. D' accord ? Ça va te sauver. Dunn est absent. Donc, c'est comme ça que vous utilisez ces styles correcteurs ? Vous pouvez les ajouter et les supprimer d'ici. Vous pouvez également supprimer un style de texte, le style de directeur. Et ah, c'est comme ça que vous utilisez ce mode de mise en scène et sera X t. J'espère que vous avez apprécié cette leçon. Passons à la leçon suivante. 26. Utiliser des guides dans Adobe XD- MISE à jour en: Maintenant. Récemment, en mai 2019, Adobe X T a introduit une nouvelle fonctionnalité, qui est des guides qui était essentiel à tout outil de conception. Et moi dans cette vidéo, je vais vous montrer comment les utiliser et comment les copier orteil et autres planches d'art. Donc maintenant, vous pouvez voir que j'ai sur notre tableau. Et si vous allez sur le dessus ici, vous pouvez voir discuter er a été changé pour autre chose. Donc cet espace ici, vous allez l'obtenir et le faire glisser et le laisser comme ça. OK, donc vous pouvez voir que nous avons la navigation top stop toe où nous avons les paramètres du compte et le bouton retour . Donc je vais avoir un guide ici. Ensuite, je vais repartir sur le côté gauche et je vais en prendre un autre et le laisser ici, puis un sous un, et je vais le laisser ici comme ça. Utilisons un autre, et je vais aller aux pieds. Va du côté droit par ici. Ok, donc nous avons la marge droite et gauche , l' arrêt, marge et nous pouvons aussi définir notre marge inférieure ici, et nous devons encore le faire glisser du haut et le laisser ici juste en dessous de ce bouton suivant . Ok, donc nous avons fait sur ces guides. Si vous voulez les cacher, traquez-les. Ce que je vais faire, c'est créer un nouveau tableau d'art. Créons un autre tableau d'art X s et nous allons orteils. Copiez tous ces gars en cliquant avec le bouton droit. Et voyons où nous avons des guides, des guides copie. Et ici, nous allons le contrôle de la pression des orteils ou commande V, ou vous pouvez basé nos guides capillaires ou cartes de place. Ok, donc c'est tout. Vous pouvez également cacher tous les gars par contrôle. Et ce point-virgule, c'est, je pense, le même raccourci clavier sur tous les abdos supplémentaires d'Adobe. Donc, si je veux les cacher rapidement, je peux aller à celui-ci, et je peux contrôler ou commander des demi-deux-points. Ok, donc nous l'avons. Vous pouvez voir qu'ils se cachent partout sur tous les tableaux d'art. Donc c'est une autre nouvelle fonctionnalité de Toby X. T. T. J'espère que vous allez l'apprécier, l'aimer et l'essayer. Parce que c'était très nécessaire. Parfois, nous avons orteil ont quelques lignes directrices pour placer nos objets rapidement. Donc maintenant, si j'ai ces lignes directrices, je sais que je vais orteil placer mon primaire mais un pas de cheveux et comme ça. OK, donc il correspondra parfaitement à tous les autres écrans. C' est donc tout au sujet des guides et de la façon dont vous pouvez les copier, comment vous pouvez les supprimer et comment vous pouvez les utiliser. J' espère que vous avez apprécié cette leçon. Si vous avez des questions à me poser, passons à la prochaine leçon. 27. Référencer la grille: Jusqu' à présent, nous avons parlé de symboles, styles de personnages, couleurs et de tout. Maintenant, nous allons parler orteil de la fonctionnalité la plus puissante sur un no B x d, qui est chardon. Répéter brut. Ok, donc ce que ça fait, c'est qu'on a ce bloc de contenu comme celui-ci. Ce bloc post, par exemple. Et je veux que les orteils créent une répétition. Créez à partir de ça. Donc, je vais lancer ça et juste faire glisser médicalement au fond comme ça et vous pouvez créer plusieurs copies d'instances de ça dans sexuellement dans cette direction et aussi dans la destruction. Si vous le voulez, vous pouvez utiliser quelque chose comme ça. Ok, donc c'est à vous de choisir, Restriction. Tu veux y aller maintenant ? La deuxième grande partie est la distance entre eux, sorte que vous pouvez changer la distance entre eux. Donc peut-être que je veux cette distance de 48 pixels entre ces deux poteaux de bloc. Et maintenant, nous avons ceci. Et la troisième partie de création est que vous pouvez créer un fichier texte et sur chaque ligne, vous allez un texte clair pour différents titres. Nous avons donc cette rubrique, qui est similaire. Changez-le en autre chose. Changez-le en autre chose. Maintenant, nous allons créer un fichier texte et changer ce titre instantanément. Toutes ces rubriques facilement. Ok, donc c'est mon fichier texte. Donc je vais effacer ce premier titre, puis sur la ligne suivante, je vais voir le cap faire pour vous. Et sur la troisième ligne, je vais dire, direction 34 Comey. Ok, donc je vais enregistrer ce fichier. Et maintenant, l'astuce est que vous devez faire glisser et déposer ce fichier sur la première instance cette grille reproductible. Ok, donc voici mon fichier texte. Donc je vais le glisser et le déposer dessus. Ok, donc c'est mon cap. Donc, sur la première copie, c'est ma première copie de mon instance. Donc, traînez-le toujours ici. Pas dans cette zone. C' est donc la première copie et je suis allé orteil, traînez-le et déposez-le. Laisse tomber. Ou ici, comme ça, et vous pouvez voir instantanément. Les trois titres sont créés. Ok, donc c'est la magie de la répétition Cred. De même, vous pouvez faire la même chose avec les images. D' accord. Donc, par exemple, si je retourne juste en arrière et, euh, supprime juste ce paragraphe et que je vais orteil, crée une image. Une ogive. Ok, maintenant vous pouvez voir que j'ai ouvert toute la collection des images de mon peuple de ma collection d'images gratuites . Et je garde ma collection comme ça. Ok, donc ce que je vais faire, c'est que je vais faire glisser une image dans celle-ci. Ok, donc maintenant vous pouvez voir que j'ai cette image le laisse sortir de la frontière et pas de haut. J' ai cette image de titre et puis ce lien. OK, maintenant je vais les sélectionner tous, et je vais créer un crit répété et juste effacer quelque chose comme ça. Ok, donc maintenant j'ai trois vantaux de bloc et je veux changer ces trois images instantanément. Ok, donc ce que je vais faire, c'est que je vais faire glisser ces trois images, et je vais les déposer ici en premier lieu. Maintenant, vous pouvez voir que tous les trois ont été changés instantanément. Ok, donc c'est la magie. Répétez la croyance. Et je pense qu'il est l'une des meilleures fonctionnalités de adobe extra vous. Maintenant, nous avons ah maîtrisé cela. Répétez la création. Vous pouvez également prolonger votre rythme Great ici comme ça. Si tu veux. Oh, mais je ne le recommande pas pour l'instant. Nous ne sommes pas dans cette affaire. D' accord ? Plus aucune chose est que maintenant vous pouvez voir ici nous avons quelque chose coupé. Ok, donc ce contenu se déplace dehors. Maintenant, si on passe à ce prototype et ah, écoutons-le. Deux écrans juste pour calmer celui-ci. Ok, alors bouge ça, remorque ce prototype, et quand je clique sur cette zone, ça va être mon écran d'accueil. Rends-le à la maison. Ce clic ici et je vais bouger les orteils dans celui-ci. Juste son look, donc c'est tout. Essayons de le faire, et tu vois que je ne peux pas y aller. Essayons de le faire, Ce qui nettoie. Il semble que lorsque je ne suis pas en mesure de voir la différence de simplement changer cela à autre chose afin que nous puissions voir instantanément la différence. Quelque chose comme ça. Ok, alors maintenant on va faire ça. Ok, donc on n'a pas sur le deuxième écran ici. Maintenant, ce que nous allons faire est à l'écran. Maintenant, nous avons le tableau de vue caché 6 67 Non, nous allons le déplacer vers autre chose. Suivant. Changez-le orteil pour que nous puissions voir l'ensemble du contenu. Ok, alors maintenant on a ça. Et, euh, allons-y à l'heure. Type préféré et non, vous pouvez voir que nous avons cette barre de défilement. Non, c'est cruellement. Est-ce que la première semaine aura de l'air frais ? Juste le défilement vertical et peu de hauteur de planche va être la même. Ok, ne change pas ça. Sinon, ça va aller aux pieds ici. Quelques problèmes. La porte change la hauteur du panneau de vue. Faites simplement glisser votre clic sur votre tableau d'art et faites-le glisser en bas de votre écran. Ok, donc tout est visible. Alors que waas la partie la plus basse de votre zone de tableau de vue de l'écran, vous pouvez voir les lignes de fille. Et maintenant, nous avons ceci. Si je peux étendre si je veux l'étendre plus comme ça. Et si j'étends ceci à quelque chose d'autre que vous pouvez voir maintenant nous avons plus d'espace ici et nous pouvons faire défiler un peu plus vers le bas. Maintenant, si je lance cet aperçu à nouveau maintenant, vous pouvez voir que nous avons plus de zone de niveau de défilement. D' accord ? Maintenant, si vous voulez supprimer cette répétition créer, OK, donc je vais cliquer dessus et sur le groupe Bon. Pourquoi en ai-je besoin ? Donc, si vous allez à des couches, vous pouvez voir ici que nous n'avons rien. Donc juste un groupe appelé répétition. Super. Je ne peux pas modifier ou changer quelque chose si je le veux. Ok, donc ce que je vais faire, c'est la grille du groupe de l'ONU et je vais changer quelque chose. Peut-être. Allons passer à autre chose. D' accord. Et encore une fois, je vais orteils créer un rythme. Super. Si tous ces groupes maintenant vous pouvez voir que j'ai tous sélectionné tous ces trois groupes et clairement cela a semblé génial à nouveau. Ok, donc vous pouvez voir maintenant que j'ai créé ça et un d'eux. Je viens de le faire éditer. Ok, Donc, si vous voulez personnaliser votre lecture super et édité comme ceci, juste Hoy avez-vous pouvez soit un clic droit et une grille de groupe ou utiliser cela sur le groupe créer et édité puis contre, comme, tous les groupes que vous avez séparés. Donc si je suis à nouveau groupe, vous pouvez voir que nous avons ce groupe en ce moment et ah, à l'intérieur de Discover, nous avons trois groupes. D' accord ? Donc tu peux changer tout ce que tu veux ici. Peut-être que je ne changerai pas celle-là. Oui. Donc je vais aller dans ce groupe et je vais au groupe Owen parce que c'est un groupe supplémentaire . Ok, donc nous avons maintenant trois groupes. une fois hivernale. Je vais créer Beat Creed et je peux créer un grand hors. Ok, donc c'est comme ça que vous pouvez, euh, en groupe votre note et un groupe votre super à nouveau et vous pouvez instantanément mettre à jour vos valeurs, votre texte à vos images, tout ce que vous voulez. Il suffit de glisser et déposer. C' est tout au sujet de cette nouvelle fonctionnalité, qui est la grille de répétition. J' espère donc que vous avez apprécié cette leçon. Passons à la suivante. 28. Composants dans Adobe XD - MISE à jour de: hier. Adobe X'd waas mis à jour à la version mai 2019 et ils ont publié une mise à jour massive. Donc, dans cette mise à jour, ils ont remplacé les symboles par les composants. Donc, plutôt que d'utiliser des symboles, ce qui était ma vieille leçon, je la remplace par des composants de quoi ? Nos composants. Je vais expliquer tout ce concept dans cette leçon. Alors restez avec moi et commençons. Donc ici, nous avons juste un tableau d'art avec juste quelques supplémentaires étaient ici un bouton et cela Vous pouvez voir ceux-ci sont séparés Ce calque est l'arrière-plan et ceci est du texte. Puis encore en bas. Vous pouvez voir que nous avons ceci pour ces quatre groupes sur nous ? Ah, un autre groupe, qui est la navigation en bas. Donc toutes ces quatre icônes que vous pouvez voir ici, ils sont à l'intérieur de ceci et ensuite nous avons l' arrière-plan. Donc, hum maintenant, ce que nous allons faire est dans tous les sens, concevoir des systèmes ou des conceptions d'interface utilisateur en est quelques-uns. Le meilleur système est que vous pouvez réutiliser vos composants afin composant est tout comme des symboles, Mais ils sont un traitable. Tu peux changer leurs mots. Vous pouvez changer leurs tailles. Vous pouvez changer leurs couleurs. Vous pouvez remplacer une autre propriété. Donc vous pouvez voir que nous sommes là pour savoir comment nous pouvons fabriquer un composant. Sélectionnez simplement la couche de groupes que vous voulez. Par exemple, celui-ci et je vais appuyer sur la commande ou le contrôle K ou Et cela va être un composant que vous pouvez voir ici, nous avons composant von Dishman. Donc vous pouvez le renommer comme, euh, bouton souligné primaire. Ok, donc nous avons ce composant maintenant, il y a une chose à comprendre ici. Vous pouvez voir ici nous avons un petit enchevêtrement vert autour de ce composant. Cela signifie que c'est le composant maître. Donc, si nous essayons toe, allez à ces actifs et vous pouvez voir ici nous avons un autre onglet ici, qui s'appelle Composant. Nous pouvons le renommer ici premier re lecture quelque chose comme ça. Et maintenant ce que je vais faire, c'est que je vais faire glisser cette ogive et je suis alignée comme ça et vous pouvez voir ou entendre sur ce bouton que nous avons. On n'a pas de carré ou de diamant ici, donc si je sélectionne celui-là, vous pouvez voir qu'on a un diamant. Et si je sélectionne celui-ci, c'est en fait une instance sur ce bouton. Donc, c'est le maître de ceci est un enfant. Instance instantanée. Et c'est Vous pouvez le changer sans changer celui-ci. Alors n'essaie pas de changer le maître. Nous allons éditer celui-ci, donc je vais double-cliquer sur l'orteil pour que vous puissiez voir comment cela a été ouvert . Ce composant est ouvert. On peut voir les couches à l'intérieur. On peut changer la couleur. Donc je vais aller avec, euh, euh, cette couleur et vous pouvez voir que le composant principal est là. Ok, donc nous utilisons le même composant. Et si je veux revenir au composant précédent, je peux faire un clic droit et réinitialiser le composant Mars Master. Donc, il va réinitialiser mes paramètres orteil le composant maître précédent, qui était celui-ci. Ok, donc, euh, c'est une chose. Nous pouvons également changer la taille hors de lui sans que vous puissiez dire, échanger la taille hors d'ici. Vous pouvez donc voir maintenant que je sélectionne le composant entier plutôt que ses parties. Donc je vais faire du crabe des orteils ici, et je vais l'agrandir comme ça, euh, orteil tout mon écran et vous pouvez voir tout de même. Nous n'avons aucun changement dans le composant maître. Mais si nous essayons de changer quelque chose ici, par exemple, le procès de force, changeons-le en autre chose. Changeons-le pour mieux servir. Donc, vous pouvez voir une fois que je t et faire un changement dans la composante martiale, il va réfléchir dans tous ses enfants. J' ai donc changé ma police de caractères, et maintenant elle se reflète dans tous les Enfants. Donc c'est une grande, je pense, amélioration parce que nous pouvons éditer, nous pouvons créer différentes instances sur le même bouton, peut-être à vos quatre différents types de Poutine primaire secondaire, tertiaire Burton différents adul des messages directs ou des choses comme ça. Donc c'est génial. Ok, donc je pense que c'est tout pour celle-là. Maintenant, je vais créer un autre composant en utilisant celui-ci. Ok, donc vous pouvez voir ici nous avons cette navigation en bas et je vais créer un composant. Vous pouvez également faire un clic droit. Et ici, nous avons fait composant et il va être un composant Ok, donc maintenant vous pouvez voir si je vais tableau d'art en appuyant sur un et je veux aller avec cet écran iPhone six émaner. Je peux aller à ma section de composant ici, et je peux le faire glisser comme ceci. Donc maintenant, si je veux changer la taille de lui, par exemple, c'était iPhone X sont écran d'accès et cette charte d'unité donc je peux aller ici et je peux accro ici. C' est donc tout au sujet des composants dans les débris. En fait, j'espère que vous avez apprécié cette leçon. Si vous avez des questions à me poser, passons à la prochaine leçon. 29. Les actifs liés dans XD - mise à jour: dans cette vidéo, nous allons parler d'une toute nouvelle fonctionnalité que Adobe vient de sortir il y a deux jours en mai 2019. Et c'est en fait un système de conception. Vous pouvez maintenir un système de conception dans Adobe X T. Et si vous ouvrez un nouveau fichier, vous pouvez voir sur la gauche, nous avons des actifs de lien. Nous allons donc voir comment nous pouvons développer tout un système de conception. Et nous pouvons lier notre système de conception à tout nouveau projet que nous concevons. Par exemple, um, Airbnb ou uber vous pouvez voir ces sites Web ils ont leur système de conception entier il semblant qu'ils sont des icônes là, Di biographie. Tout est, vous savez, dans un design avec un système. Donc, ce qu'ils font, c'est qu'ils utilisent tout le système de conception et les Juifs les composants de ce système de conception et les utilisent pour construire un nouveau design. Maintenant, avant d'entrer dans les actifs liés, nous allons Toe télécharger ce beau design une sémantique. Vous le réveillez pendant plus de 60 sémantiques. Vous êtes en fait un framework pour les développeurs frontaux pour construire des abdos fab et c'est un excellent . Vous pouvez visiter leur site Web. Je vais montrer le lien. Voici donc un kit gratuit et il est très détaillé. Vous pouvez voir que nous avons des boutons. Nous avons des pas. On est morts. Bogra couleurs de frais, formulaires, espaces réservés, commande, recherche tout ce que nous avons ici. Donc, cela s'appelle en fait l'ensemble du système de conception. Nous avons des composants. Nous avons des fardeaux. On a de la typographie, des échelles et tous les titres et tout ça. Donc, une fois que vous avez téléchargé ceci, vous pouvez voir ici. Télécharger Sémantique. Tu aimes ça ? Nous allons ouvrir ce fichier X T dans notre adobe X'd. Maintenant où vous pouvez voir, j'ai ouvert Sémantique. Vous l'aimez et c'est un détail. Tu l'aimes avec beaucoup de tableaux d'art. Vous pouvez voir où si je zoom avant, vous pouvez voir ce sont quelques messages d'avertissement. Il y a d'autres choses que si on va par ici. Vous pouvez voir que nous avons des icônes. Nous avons des fardeaux. Onda, Celui-ci ce document que vous pouvez voir existe, composant maître. Si vous vous souvenez de ma dernière leçon précédente, ce composant maître est en fait celui que vous avez créé à l'origine. Et si vous apportez des modifications ou ici, cela sera reflété dans l'ensemble de votre système de conception . Donc tout ce qu'ils ont ici, ce n'est pas maître. Ils sont dans ces nombreux cas. Nous avons des fardeaux. Ce ne sont pas des composants maîtres. Ce ne sont que des instances sur le même bouton. Soulure primaire. Laisse-moi zoomer. Vous pouvez voir par ici. Soulure secondaire primaire. Ce ne sont pas des composants principaux car nous n'avons pas de diamant sur la gauche. Donc ici, nous avons jeter sauver. Ok, alors on a des boutons colorés. Ensuite, nous avons étiqueté bouton avec des goûts ou des choses comme ça. Quoi qu'il en soit, donc la première étape, si vous voulez, si vous avez développé tout votre système de conception Alors comment allez-vous faire cela ? Vous allez orteils, spécifiez quelques couleurs. Vous allez avoir de la typographie, des effractions et tout ça et vous allez aussi les ajouter ici dans le panneau SX. Ok, donc vous avez créé ce fichier. Vous pouvez voir toutes ces couleurs sont ici. Ils sont nommés correctement avertissement, message, arrière-plan et tout ça. Vous devez vous assurer que tout a été ajouté ici et ensuite nous allons sauvegarder ce document. Nous allons aller enregistrer sous et nous allons l'enregistrer en tant que document cloud. Je vais donc l'enregistrer en tant que document cloud. Ok, donc il est en train de le sauver. Cela prendra un certain temps car il est en train de le télécharger sur mon cloud plusieurs de Toby, et voyons combien de temps cela prend. Ok, donc maintenant il a été sauvé. On va le fermer. On va ouvrir un nouveau fichier. Donc je vais ouvrir un nouveau fichier. Ouvrons ce web 1920 et nous allons orteil klik. Maintenant, si nous voulons apporter tous ces composants que nous avons sauvés dans la sémantique vous façon, nous allons toe klik ou ici liens actifs et nous allons aller orteil aller à ces nuages, documents cloud documents, et nous allons sélectionnez celui-ci. Donc maintenant, vous pouvez voir qu'il a apporté tous les actifs sur le côté gauche. Vous pouvez voir que j'ai toutes les affirmations. J' ai tout le système de typographie, tout ici. Donc, si je veux construire quelque chose rapidement Oups. Si je veux construire quelque chose rapidement, je peux traîner ici. Et c'est mon bouton. Vous pouvez voir maintenant. ce moment. cela a été le cas. Il a une petite icône ici qu'il est un atout lié. Donc, nous pouvons également dissocier ce composant si nous voulons savoir si nous voulons rester avec le composant et utiliser celui-ci comme notre um sémantique, Kate ou système de conception, nous pouvons le faire. D' accord. Ainsi, nous pouvons également réinitialiser le composant maître. Si nous avons apporté des modifications, nous pouvons également ajouter ce composant dans les documents source maîtres. Donc, si nous cliquons ici, il va ouvrir un document source, et ici nous l'avons et nous pouvons l'éditer ici. Donc, il y a beaucoup de choses que vous pouvez faire ici et faisons glisser ce fonds Donc nous avons Facebook , mais puis nous avons des composants de base de la carte. Tu vois, on est là, et, hum, peut-être que je peux ajouter ce bouton ici comme ça. Déplacez-le au-dessus de quelque chose comme ça afin que vous puissiez voir en quelques glisser-gouttes. J' ai créé ce garde pour Christie et on peut, tu sais, utiliser celui-ci. OK, donc ce sont en fait des composants. Ils peuvent facilement aller ensemble les uns avec les autres. Nous pouvons aussi traîner quelques choses comme nous avons ici. Une barre d'école verticale manuelle. Donc, nous avons ce menu de navigation de menu, alors nous avons beaucoup vertical. Donc, ceux-ci sont intégrés dans des composants. Nous pouvons les réutiliser. On peut les ajuster si on veut. Si nous voulons que nous les lions et les modifions, nous pouvons le faire aussi. Donc nous allons le remplacer ici, et je vais vous chercher ma boîte de réception. D' accord. Si simple. Simplement, c'est, je pense, le système parfait que vous pouvez faire. Et si on va par ici, tu peux voir qu'on a, euh, on n'a pas d'icônes par ici. D' accord ? Donc, si vous voulez Oh, utilisez les icônes qui étaient dans l'autre document. On est là. Vous pouvez voir ces icônes et toutes les icônes dont vous avez besoin pour les ajouter à vos ressources. Ok, donc si nous avons ceci ou peut-être de cette façon, nous voulons les ajouter à plus d'actifs. Je vais donc choisir leurs sélections. Icahn est cette icône et ah en a fait un composant. Je vais en faire un composant. Ok, alors appelons-le, comme pour agrandir. D' accord. Alors assurez-vous que vous nommez est parfait. Tu n'as pas besoin, tu sais, faire quelque chose comme ce jeu. C' est donc un spectacle. Non, sauver ça. Le même document, qui est mon document maître. Je change. J' ai créé un atout, qui est mon icône ici. Non, revenons au premier document qui était lié, que nous étions en train de concevoir ici. Et vous pouvez voir ici nous avons un bouton disant mise à jour. Donc, cela signifie que quelqu'un a mis à jour dans les documents maîtres. Je vais appuyer après le mot ici ou si je descends, vous pouvez voir que je vais appuyer sur la mise à jour et va orteil Vous pouvez voir. Montrez-moi un nouveau car il a été ajouté de sémantique. Tu aimes ça alors je vais descendre. Et voici le composant. Je viens d'ajouter C'est l'icône. Ok, donc c'est ainsi que vous pouvez intégrer votre système de conception en remorquage. N' importe quel design que vous faites, donc quoi que vous soyez designers, si nous avons ah système déjà fait, nous avons un système de conception. Nous pouvons l'utiliser et nous pouvons augmenter leurs changements dans les composants maîtres ou le fichier maître, ce qui est notre sémantique que vous avez lié par ici et il va lier tous les composants. Tous les styles étaient ici des styles de titre, toutes les couleurs, tout ce qu'il va importer dans notre nouveau document. C' est donc tout au sujet des actifs liés. Je pense que c'est une grande caractéristique. Nous pouvons généralement est que, Ah, et créer des interfaces utilisateur impressionnantes You yeux. J' espère que vous avez apprécié cette leçon. Si vous avez des questions à me poser, passons à la prochaine leçon. 30. Raccourcis communs: Si vous voulez apprendre n'importe quel logiciel, n'importe quelle application, n'importe quel logiciel de conception et logiciel correspondant, si vous voulez obtenir rapidement dedans. Et si vous voulez que O rend votre flux de travail très rapide, vous devez apprendre ses raccourcis sur le raccourci. Les clés sont, ah, un peu différentes, pas très différentes dans Mac et Windows. Il y a trop de similitude, et j'aime vraiment les touches de raccourci qui sont mappées dans ce logiciel Adobe Exley parce qu'elles sont très faciles à retenir. Ok, donc nous allons couvrir les clés Crocker les plus basiques ou les plus utilisées dans cette leçon. Et dans la prochaine leçon, nous allons en explorer quelques autres qui peuvent vous aider à nous allons en explorer quelques autres qui peuvent vous aider à accélérer votre flux de travail dans Adobe X'd. Ok, alors commençons. Donc, tout d'abord, nous allons voir quelques outils sur la gauche. C' est très facile. Sélectionnable est V comme toujours comme nous avions dans un magasin et je pense que dans illustrateur alors nous avons cet angle de secte, qui est rectangle pour notre et si vous appuyez sur sont vous allez orteils. Donc, je vais sélectionner ceci et je vais appuyer sur notre et maintenant j'ai un rectangle Nous allons dessiner un rectangle ici et enlever sa bordure. Ok, donc on a un rectangle, puis on a cette ellipse et très facile et tu vas prendre une ellipse. Vous pouvez appuyer sur la touche Maj pour la rendre proportionnelle comme ça. C' est donc très facile. Je vais à nouveau appuyer sur v saoudien. Pas par ici. Je vais appuyer sur V et je vais cliquer n'importe où pour le sélectionner. D' accord. Ok, alors nous avons cet outil de ligne, qui est L. C'est aussi très facile. Juste une ligne que vous pouvez contrôler. Les options étaient encore là. Je vais appuyer sur V et je vais cliquer ailleurs que ce mental. Ce sera très facile. Vous pouvez faire glisser et faire quelque chose comme ça. Donc, c'est notre outil de plante et je vais à nouveau appuyer sur escape pour le laisser comme ça et v d sélectionné et sélectionné à nouveau. En outre, vous pouvez utiliser le remplissage si vous le souhaitez. Alors voici Bendel. Ensuite, nous avons ce texte sur HST D est pour l'outil de texte. Vous pouvez utiliser n'importe quel type de texte. Ok, donc c'est très facile. Ensuite, nous avons ce tableau d'art A et vous aurez plus de nos planches. Nous allons créer un tableau dur iPhone X ici, et je vais appuyer sur la barre d'espace, qui est également la clé très commune pour déplacer tout et comment. Ok, pourquoi ? Vous concevez des contrôles et je vais appuyer sur V, et je vais appuyer sur la barre d'espace pour tenir cette toile, et je vais déplacer vers le haut pour le concentrer au milieu. Ok, donc c'est une autre carte courte. Vous pouvez appuyer sur la barre d'espace pour déplacer ces choses comme ça. Ok, alors nous avons l'outil de zoom Z, et vous pouvez l'utiliser presi, et vous pouvez l'utiliser pour zoomer sur un élément. OK, Maintenant, si vous voulez revenir en arrière, vous pouvez appuyer longuement sur votre art ou la touche d'option, et vous pouvez zoomer comme ceci. OK, alors cliquez une fois et vous allez aux pieds. Zoom arrière. Donc c'est le nouveau fou. Il va être dans ce plus. Si vous voulez effectuer un zoom arrière, vous devez appuyer sur l'art ou la touche d'option et continuer à appuyer dessus et il sera zoomé. Ok, Maintenant, nous sommes Vous pouvez voir ou entendre dans l'outil de zoom grossissement que nous sommes à 75% ou 100% en ce moment. Donc si je fais un zoom arrière, nous sommes maintenant 75 50%. D' accord. Maintenant, si nous voulons revenir en arrière avec les enfants raccourcis, zoomez et zoomez. C' est aussi très courant, et nous allons utiliser beaucoup de temps, c' est-à-dire le contrôle ou le commandement. En plus comme ça. Donc appuyez sur contrôle ou commande et puis le ski de souffle que le moins pour zoomer. Cela va être utilisé plusieurs fois. Ensuite, pour un zoom 200% ou zoom toe cette fenêtre, puis nous allons appuyer sur contrôle et zéro. Ok, donc maintenant vous pouvez voir qu'il appartient à 79.44% et qu'il est zoné par rapport à la zone que j' ai ici avec ma toile. Ok, donc s'il utilisait, j'ai rencontré des prévisions King 5 k ça pourrait supposer plus de 200 %. Vous êtes en ce moment, j'utilise mon PC Windows. Donc j'ai moins d'espace. Donc, il est zoné à 79.4% ce qui est confortable pour moi orteil Faire mes trucs de design graphique. Maintenant, si vous voulez zoomer 200%, vous pouvez le faire à vous pouvez commander ou commander ou contrôler Appuyez sur un. Ok, maintenant vous pouvez voir qu'il est presque sorti. Mon écran et ma toile sont hors de ma portée. Donc, c'est pourquoi ce logiciel développé toe 79.4%. OK, donc vous pouvez appuyer sur zéro pour zoomer l'ajustement. Vous pouvez appuyer sur contrôle ou commande un, et ah, et contrôler et commander zéro pour l'ajuster à la toile. Ok, donc ce sont des outils. On va les utiliser beaucoup de temps. Zoom avant, zoom arrière et zoom arrière. Maintenant, dans la leçon suivante, nous allons couvrir quelques touches de raccourci mawr qui vont nous aider à nous déplacer avec les calques. Donc si on va à l'intérieur des couches de ce panneau, on peut voir qu'on a 12345 ans. Nous allons donc faire quelques choses avec ces couches, les déplacer, les aligner et des choses comme ça. Passons donc à la leçon suivante. 31. Plus de touches de raccourcis: Ok, Maintenant, commençons par apprendre la plupart des touches de raccourci pour le travail de remorquage d'Adobe X T. Foster dedans. Maintenant, nous allons verrouiller quelque chose des années. D' accord ? Maintenant, si vous avez une couche d'arrière-plan ici, par exemple, créons un arrière-plan ici comme ceci. D' accord ? Maintenant, vous pouvez voir qu'il est en haut. Je voulais être à l'arrière. Créons un ingrédient linéaire et choisissons quelques-unes des couleurs ici. J' aime ça comme ça. Ok, donc on a un ingrédient. Citons deux couleurs. D' accord. Maintenant, vous pouvez voir que c'est là que certains de la frontière et maintenant vous pouvez voir qu'il est en haut. Non, on veut qu'il soit déplacé vers le bas. Ok, Donc ce que nous allons faire, c'est si vous avez raison, cliquez ici, vous pouvez voir l'option organiser. C' est donc très facile. Au centre de l'arrière. Amenez à un ami. Ok, alors gardez à l'esprit. Déplacement de pointe très facile. Donc on va passer ça au sac. Donc, nous allons appuyer sur commande Shift et le support arrière ou le support inverse pour le renvoyer et le support avant pour le ramener à différent. OK, donc je vais le faire tout de suite. Déplacement de commande ou contrôlé. Retourne, Retour. Beckett et le record. Maintenant, vous pouvez voir à gauche dans le panneau Calques. Il se déplace de haut en bas. Maintenant, nous pouvons voir que cette couche est en bas. Ok, donc comme c'est notre expérience, on veut le verrouiller pour que tu puisses le faire de deux façons, non ? Vous pouvez faire un clic droit. Et vous pouvez voir ici est le prêt. ou contrôle de raccourci facile. Et alors verrouillez-le comme ça. Maintenant, vous pouvez voir une petite serrure. Je suis allé ici maintenant. On ne peut pas le déplacer accidentellement comme ça. Donc, si nous sélectionnons, nous allons sélectionner ces textures et tout ce qui est propre plus tard. Ok, donc on ne va pas la couche de fond du sélecteur d'orteils ici. D' accord. D' accord. Donc vous pouvez voir maintenant nous avons trois couches sur les cheveux. L' un est à l'arrière et il est verrouillé. Maintenant, une autre chose que vous pouvez faire, c'est que vous pouvez cacher vos couches. Donc, si vous sélectionnez n'importe quel jour comme celui-ci et si vous voulez cacher est que vous allez le contrôle de la pression sur les pieds et le virgule ou le contrôle ou sur le Mac, Ce sera la commande, contrôle de la touche ou la commande semi deux-points. Et ça va se cacher comme ça. Vous pouvez voir que je me cache et que je le montre encore et encore. C' est donc aussi une clé commune que vous devez apprendre. Ensuite, il y a encore une chose. Par exemple, ces deux-là. Je veux qu'ils soient liés. Alors je le suis. Ce que je vais faire, c'est que je veux qu'il soit regroupé avec celui-ci. Ok, donc je vais le couvrir en blanc. Et donc j'y vais. Je veux qu'ils soient en groupe. Donc, je vais appuyer sur la touche Maj et continuer à cliquer que les éléments ou les calques. Je veux être dans un groupe où je vais appuyer sur le contrôle ou le commandement G. Donc, vous pouvez voir sur la gauche. Maintenant, c'est le groupe 1. Non, si vous voulez le renommer, vous pouvez double-cliquer ici et vous pouvez les renommer. Vous pouvez voir que nous avons regroupé une des trois années et nous pouvons aussi les regrouper jusqu'à présent en les regroupant, nous allons simplement changer une clé avec elle. Donc commande et notre contrôle G était pour le regroupement et la commande Shift G est sur le groupe maintenant vous pouvez voir qu'ils ont été regroupés. Ce sont donc peu de choses que nous allons utiliser beaucoup, par exemple, regroupement et le regroupement. Maintenant, une chose de plus est que si vous voulez dupliquer plus tôt, si je veux dupliquer celui-ci, je peux soit sein sont tomber tibia clé et glisser comme ceci et il va créer un dupliqué. L' autre moyen est que je peux aussi appuyer sur le commandant de contrôle D et il va dupliquer. Donc, ce sont deux façons de dupliquer n'importe quel leer dans Adobe X'd maintenant un peu plus de choses. Par exemple, si je veux tout sélectionner, il est à venir Controller Command. Il est presque commun dans toute la conception de l'abside, AP, même Microsoft Word. Et si vous voulez désélectionner, vous pouvez à nouveau ajouter une touche Maj dans le mix, contrôle ou la commande. Déplacez-le et il va le disséquer. Donc, nous allons le sélectionner maintenant. Une autre clé que nous allons perdre beaucoup est l'alignement. L' alignement est très nécessaire. Par exemple, si j'ai ceci ici et que je voulais au milieu horizontal. Ok, donc ce que je vais faire, c'est que je vais utiliser les orteils et voir sur Windows Szefc Donc c'est très facile. Il suffit de déplacer cette couche au centre. Ok, alors changez de vue ? Ça a du sens. Ok, Maintenant, sur le Mac, nous avons une touche différente de mise en marche, qui est contrôlée commande et voir sur Windows shift Voir, et sur Mac contrôle système d'exploitation, commande et voir. Ok, alors gardez ça à l'esprit. Maintenant, c'est parce que le cœur est sous le centre de la destruction. Non, si vous voulez qu'il soit au milieu de cela,par exemple, par exemple, si je supprime ceci et que je le veux au milieu de toute cette toile, ce que je vais faire, c'est que je vais appuyer sur la touche de raccourci. Shift em, ce qui est pour le milieu. Donc le milieu est verticalement. Le centre est horizontalement, donc le décalage em est la clé. Et sur Mac, il va être contrôlé commande et m il est le même. Juste le mélangé des touches comme la commande et le contrôle. C' est différent. Donc, si vous êtes sur un Mac, vous devez appuyer sur le contrôle, commandant. Et ok, maintenant il y en a un peu plus que nous pouvons utiliser, qui est lié ou decks. Donc si je jette un peu de Dextre Quoi ? Ici. Ok, donc on a des textos par ici. Et si je veux le rendre gras, je vais le sélectionner et la commande de contrôle soit orteil, faites-le commande de contrôle gras vous pour le faire souligner et en italique pour moi, qui est très similaire aux éditeurs de texte va utiliser Ceci est pratique maintenant si vous voulez pour changer une taille suivante et si vous voulez augmenter la taille du texte instantanément, ce que vous pouvez faire est juste comme les étapes suivantes et sur les fenêtres il est changement de contrôle et irakien à l'intérieur de vos clés, qui est fondamentalement votre arrêt complet. Donc, le changement de contrôle arrêt complet. Et puis il y a un coma, qui est une autre touche fléchée arrière Carol pour réduire l'augmentation de taille réduite. Donc, j'appuie sur mon changement de vitesse et de contrôle garder sur mes fenêtres sur le système d'exploitation Mac vient supprimer la touche Maj. Et ce sera Kamande et vos Irakiens, votre fille et votre virgule. D' accord. Et maintenant, la dernière touche de raccourci que je veux vous montrer est celle de masquage. Donc, si vous avez deux ans, l' un est en haut, cette image, et puis c'est un rectangle. Vous alliez choisir le bateau avec la touche Maj. Et vous et vous allez appuyer sur commande. Maj em ou contrôle. Déplacer em. Ok, donc comme ça. D' accord. Donc je peux maintenant déplacer ça comme ça, et vous pouvez voir que j'ai masqué cette image à l'intérieur de cette forme. Donc, c'est le dernier changement de contrôle ou de commande de décalage M m formulaire demandant. Ces clés sont très faciles à retenir. Je les aime juste. Ces touches de raccourci Adobe X'd sont très faciles à retenir car elles sont mappées avec concepteurs de la mine et elles sont faciles à mémoriser la fonction qu'ils font. Par exemple, le masquer est pour eux. Et c'est pourquoi c'est la chose principale. J' adore cet outil autre que par les fonctionnalités. Donc, assurez-vous, Jack,que Jack, vous avez appris le plus de bases et que vous pouvez facilement faire ces choses dans ce logiciel. Et maintenant, si vous voulez créer un credo répétitif, c'est très facile. Il suffit de sélectionner celui-ci, et appuyez sur contrôle ou commande sont et vous allez avoir notre secret comme ça afin que vous puissiez voir ou lui. C' est une autre carte courte, mais je pense que le grand bien Nous avons ce bouton ici, donc il est plus facile d'accéder ici. Donc, tout cela concerne ces touches de raccourci. Si vous avez des questions, demandez-moi. Passons à la leçon suivante. 32. What conception de niveau de bloc ?: aujourd'hui, nous allons créer cette conception de niveau bloc et nous allons apprendre de très nouvelles techniques en concevant des applications mobiles, sites Web de magasin ou tout ce que vous concevez. Donc, cette technique est essentiellement utilisée lorsque vous commencez votre conception. Il y a donc deux choses que vous pouvez faire lorsque vous commencez votre conception. La première est que vous pouvez construire plusieurs couches à partir de différents éléments que vous avez sur votre écran. Deuxièmement, vous commencez essentiellement avec le stylo et le papier. Donc, je vous recommande vraiment que chaque fois que vous conceviez, vous commencez avec un stylo et du papier et je vais vous montrer mes croquis en papier pendentif et prototypes de stylo et de stylo papier dans ce prochain Nellessen bientôt. Mais en ce moment, nous allons nous concentrer sur cette conception de niveau bloc et sur la façon dont elle peut nous aider à accélérer nos idées de conception. Et, ah, disposez les différentes mises en page et les différentes compositions qui le feront. L' image sera l'endroit où le texte sera, où les titres seront et quels éléments seront interactifs et interactifs sur votre écran. Maintenant, nous allons commencer cet exercice et je vais en faire un hors de l'écran et le 2ème 1 est pour vous. Pour votre mission. Je vais créer une vidéo d'affectation dans la prochaine leçon, qui sera cet article un. Vous allez générer ça et savoir ce dont nous avons besoin, ce n'est que deux tueurs d'arbres. Comme vous pouvez le voir. Sa couleur grise est un peu sombre, d'accord. Et voici un noir gris noirâtre régulier et une couleur pour nos éléments interactifs. Comme des boutons. OK, donc vous pouvez deviner quel écran est celui-ci juste en regardant les éléments ici. Ok, donc c'est notre logo ou n'importe quelle image. Il s'agit d'un texte introductif. Bienvenue dans notre Une nouvelle application créative ou quelque chose comme ça. Il s'agit de la connexion et du mot de passe. Et puis nous avons ce bouton de connexion. Alors on a eu ça. Oubliez le texte de votre mot de passe, puis en bas, nous avons signé lien. Vous pouvez voir un peu plus petit et la ligne ou elle. Ok, donc c'est très facile. Très simple. Ne vous inquiétez pas pour ça. On va l'apprendre en un rien de temps. Alors commençons. Donc, ce que je vais faire est que je vais créer un nouveau tableau d'art va cliquer sur le tableau d'art et nous allons orteil créer un iPhone 67 plus sont OK, allons cliquer dessus une fois. Allez nous réoutillons, appuyez sur ma barre d'espace, et je vais le déplacer et le contrôle zéro ne omet le bout de l'ajustement. Ok, donc nous allons créer cet écran de connexion maintenant. C' est très simple. Ce que nous allons faire, c'est que nous allons utiliser cet outil de rectangle et juste dessiner un rectangle ici comme ça. Supprimé la bordure, utilisé la couleur. Celui-ci, j'utilise deux D deux D deux D pour les images sur DA pour les images. J' utilise celui-là. Ok, donc le milieu est d'accord couleur. D' accord. Et puis on va s'évader sur les orteils. Nous, je vais le mettre au point au milieu maintenant pour le texte. Vous pouvez voir votre ici. Voici différentes lignes de différentes longueurs. Comment je suis capable d'utiliser ceci est parce que sur un très beau fort de cadrage viral, qui s'appelle Block, laissez-moi vous montrer. C' est un site web où vous pouvez le télécharger. Ok, donc vous pouvez voir que c'est bloc pour dot com. Je vais partager le lien avec vous, et vous pouvez télécharger ce téléphone ici. Télécharger le téléphone. Il est également investir les agriculteurs de téléphone. Donc, si vous allez utiliser n'importe quel téléphone Web voulez-vous afficher ce transfert sur votre site Web ? Tu peux le faire, orteil. D' accord. Pour que vous puissiez voir par ici. Ils l'utilisent pour créer des mises en page très simples comme celle-ci. Vous pouvez voir par ici. Et recommençons, Leo. Choisir ça. Alors téléchargez ce quatrième, installez-le, et c'est tout ce dont nous avons besoin. Ok, donc non, on va utiliser le même téléphone, et on va à Presti sur notre clavier. Cliquez une fois par ici. Donc c'est le quatrième. Vous allez le sélectionner à partir d'ici. J' utilise ce nouveau fort. Et une fois que vous cliquez ici, vous pouvez taper quelque chose comme n'importe quel. N' importe quel type de lettre, n'importe quelle lettre. OK, si vous appuyez sur l'espace, il va être beaucoup plus loin entre les deux éléments. Voici les deux zones de texte. Donc, ce que je fais normalement est que je supprime cet espace arrière, et je sélectionne juste un caractère et change sa couleur orteil blanc. Donc j'ai aussi juste ici. Maintenant, vous pouvez voir ça a l'air beau. Super. Et aussi, euh, assurez-vous que cette couleur de sexe est 707070 Maintenant, j'ai besoin que les orteils refassent la même chose. Maintenant, vous pouvez voir les événements que j'avais l'habitude de tuer à l'intérieur. Un élément de couleur de remplissage est déplacé dans ce tableau de bord, et il n'y a pas de Colette dedans parce que nous utilisons plusieurs voitures. Ok, donc ici nous avons nos deux éléments dit, Maintenant, nous allons utiliser notre rectangle ah, Samer emmêlé outil, et nous allons dessiner pour un champ de texte. On va faire la frontière cinq cinq cinq. Et je vais utiliser le même tueur de frontière pour celui-là, que j'utilise pour cette image. Ok, donc on a celui-là que je vais appuyer sur la touche d'option d'art pour le dupliquer. Vous pouvez voir par ici. Je l'ai compliqué. On peut tous oublier ce portrait ici. Retirez juste quelque chose d'ici à l'avant. Ensuite, nous reprenons les pieds pour l'apaiser en faisant passer notre touche d'option sur votre clavier. Il suffit de le déplacer ici. D' accord ? Alors voyons la distance. Meilleur art sur la touche d'option et garder sélectionner un hors des éléments. Si vous voulez voir la distance, nous allons zoomer un peu. Laissez-moi vous montrer comment je vais à mon oreille. La distance entre ces deux éléments je clique sur l'un des éléments, appuyez sur ma touche d'option d'art et vous pouvez voir contre elle a commencé à me montrer les distances. Mais l'élément avec lequel je veux comparer est celui-ci. Donc, je vais juste sur ma bouche sur celui-là, et ça va me montrer que c'est ce que c'est des cochons. Les maux de vos huit points de là. D' accord. Encore une fois, Si je fais cela, il est sept. Donc je vais en faire huit. Donc, ils ont l'air professionnel et ressemblent. Il y a une harmonie dans la conception. Donc on va utiliser les orteils. Cela peut aussi nous déplacer. Enlevez celui-ci ici. Donc, non, je l'alignerais au milieu. D' accord. Comme ça. Maintenant, nous avons terminé notre Celle-ci était image ou faible. Vas-y. Celui-ci était le bienvenu. Impôt. Bonjour, Essen, ou quelque chose comme ça. Voici nos deux champs mot de passe connexion et mot de passe. Et puis nous allons utiliser un personnel ici jusqu'à présent. Mais nous gagnons à utiliser le même rectangle ou ce que vous pouvez faire est juste pour apaiser celui-ci sont la corruption et l'utiliser ou ici, comme ceci. Retirez la bordure. Changez le filtre. Oh, celle-là ou celle-là ? Je vais utiliser cette couleur maintenant. Juste un peu changer les orteils. Change un peu l'équipe. Ok, donc on a cette couleur en ce moment. Il doit être de couleur très vive. Donc, il est différent de l'ensemble de l'arrière-plan ou de l'interface entière, parce que c'est un possible, mais Ok. Encore une fois, je vais cliquer ici. Il suffit d'utiliser l'ombre trois points vers le bas. C' est donc le en bas dans la position verticale. Et c'est le sang. Combien ? Il est floue. D' accord. Et nous pouvons également utiliser 20% de sorte que l'ombre est visible ici nous avons l'ombre à nouveau. Je vais dupliquer ça, et je vais le déplacer. Et la commande de travail décalage de contrôle, enregistrement avant et ah, en utilisant la couleur vied Suivant plus Allez-y. Il y a quelque chose comme ça. Donc l'espace est très grand. Donc je Ce que je fais normalement, c'est que j'ai juste Ok, Donc celui-ci est aussi à l'air bien. Et nous pouvons utiliser quelque chose comme ça pour le fardeau qui est beau et net. Ok, donc on a fini notre fardeau. Il nous reste deux éléments. L' un est oublié. Votre passeport et l'un d'entre eux va à la pointe de l'écran d'inscription. Ok, donc vous devez penser à tous les éléments qui vont être placés sur l'écran, vous devez d'abord les lister. Donc, si vous pouvez les énumérer, vous pouvez facilement les planifier ici. Et vous ne manquerez pas souvent. Ok, donc maintenant on a laissé celui-ci et celui-ci. D' accord. Donc encore une fois, nous allons orteil répliquer ce texte ici regarde garder proche de décourageant parce qu'il a sens. Ça va l'être. Et puis je vais le dupliquer à nouveau, et je vais le dire un peu. Ah, loin. Et je vais utiliser cette couleur, qui est Sept Trudy. Trudy. Une couleur un peu plus foncée. Et aussi je vais perdre ce soulignement. D' accord. Si vous ne voulez pas utiliser ce souligné, vous pouvez également utiliser cet outil de ligne pour placer une ligne en dessous comme ceci. Il est donc un peu loin de celui-ci. Et ah, juste échapper à V et je vais les orteils le rapprocher un peu de ça. Comme ça. Eso cette attente est 105 Donc nous allons faire le morceau de celui-ci. Ce 105 bouddhiste, un pixel court, et je vais sélectionner. se sont battus et se sont déplacés. Tu vois ? Ok, donc ils sont en mer décalée. Et sur Mac, vous allez appuyer sur la touche de contrôle. Vous voyez, je suppose que le commandement des navires facilement. Il est donc dans une ligne au milieu. Vous pouvez voir que j'ai utilisé un peu une technique différente de ce seul air. J' utilise de l'espace dans le texte ici que ce sera deux mots comme Logan hair ou quelque chose comme ça. Ici, j'en utilise un seul. Ça n'a pas d'importance. Ce n'est qu'une représentation. Donc, si vous voulez quelque chose comme ça, utilisez juste Colette blanche ici et laissez-moi utiliser vital. Euh, hein. Ok, donc maintenant vous pouvez voir que tout est beau et beau. Déplaçons le vital de celui-ci. Et ici, nous avons notre écran de connexion préparé. D' accord. Maintenant, votre mission est que je vais en faire un autre avec vous dans la prochaine. OK, donc je vais vous montrer quelle est votre mission. C' est très facile. Vous allez utiliser ce bloc un nouveau fort pour créer cette conception de niveau bloc. Il va vraiment aux pieds. Hum, faites vos dessins, vous savez, semblez professionnels. Et c'est la première étape de votre conception. Au contraire, vous êtes un designer expérimenté ou vous êtes un grand pas designer. Tu dois commencer comme ça. Cela va vraiment améliorer vos compétences en conception. Ok, Vous pouvez voir que l'espacement est parfait entre tous ces éléments. Certains sont, vous savez, alignés correctement. Donc c'est un conseil aussi, vous allez commencer avec une seule couleur. C' est la meilleure bande que je vais vous donner pour n'importe quel design. Donc, chaque fois que vous commencez votre conception, n'essayez pas d'introduire cinq ou six couleurs à la fois. Vous pouvez voir ici sur ces écrans sont très simples en utilisant juste une couleur Greg et différentes actions sur trois. Et je n'en utilise qu'un pour voir sur la couleur bleue ou lui ici. J' utilise une couleur bleu violacé et vous pouvez voir à quel point cet écran semble OK Alors gardez ces étapes dans votre esprit. Et, ah, si vous avez des questions à me poser, passons à la leçon suivante, qui sera votre mission. 33. Ébaucher des idées de première conception de niveaux de niveau: Ok aujourd'hui. Ce que nous allons faire, c'est que nous allons créer un design de niveau bloc en utilisant un stylo ou du papier, ou j'ai ces quelques surligneurs ici avec moi. L' un est cette Sharpie, ou vous pouvez dire un peu le marqueur. Pauvre marqueur. Alors on a ça. Vous pouvez également utiliser ce stylos gel, qui sont un peu plus foncés. Et vous pouvez également utiliser juste défensive sur ce genre de papier. Ok, donc ce que j'ai fait c'est que je l'ai plié en remorque. Tu vois ? Des plis comme vous pouvez voir par ici. Donc ça va être un écran, seconde peau et sa peau. Vous pouvez les séparer après avoir dessiné la joie. OK, donc l'avantage du crayon est que vous pouvez le dessiner plusieurs fois et vous pouvez l'enlever avec cette réserve. Et donc commençons. Donc d'abord je vais faire ou utiliser. Je vais juste utiliser mon crayon pour dessiner ces éléments de niveau bloc. Donc ça va être notre logo. Ne croyez pas qu'ils ne sont pas grand facteur de fermeture à glissière jour. Ça n'a pas l'air très bien. D' accord. Et puis nous avons ce regard supplémentaire ici. D' accord. Ok, alors on va devoir aller dans les champs ici. C' est le même que je vais. Il s'agit d'un écran de connexion que vous pouvez voir ici. Donc, nous allons rester. Détails surentend. Ok, donc on peut avoir quelque chose comme ça alors ça va être d'un second champ. Ça va être notre Burton. Ok, alors assurez-vous que les textures au milieu comme ça. Ok, donc nous avons mis nos éléments. Maintenant, c'est oublier le mot de passe. Vous le faites ? Peut-être quelque chose comme ça. Ensuite, nous avons ici. Inscrivez-vous. Donc, nous avons l'inscription. D' accord ? Maintenant, nous avons construit notre premier, nous pouvons échanger sur cette mise en page beaucoup. Comme si nous pouvions avoir notre logo ici et ensuite le texte de bienvenue ici. Il y a quelque chose comme ça. Peut-être quelques statistiques. Nous voulons montrer ça quelque chose comme ça, quelque chose comme ça. Peut-être quelques éléments par ici. Ok, alors on pourra avoir cette, euh, encore une fois, ce Logan et ça, ce champ de Spotswood. Ensuite, nous avons ce bouton, nous pouvons également avoir plus de bouton ici et oublier le champ de mot ici. D' accord. Vous pouvez donc voir comment cette mise en page est différente. Il n'y a pas de titres ici. Ils vont être ici. Ok, quelque chose comme ça. Peut-être que nous allons utiliser quelques icônes ici sur ces champs, et ce sera sur le bouton. Donc, nous allons utiliser du texte ici. Et puis on a cette inscription ici, accord ? Donc nous pouvons avoir un autre bouton, ce qui va être un peu différent. Ça va être fini. Inscrivez-vous maintenant, mais d'accord. Donc vous pouvez voir que ces deux mises à pied sont totalement différentes. Ok, donc vous pouvez voir ici comment j'ai dessiné ça. Si vous voulez partager, vous pouvez les partager comme ceci. Comme si ça ne les rendait pas très jolies. C' est juste qu'on va aux pieds. Remplissez-le que ce sera une image. Ok, une autre façon est que vous utilisiez n'importe quel surligneur comme celui-ci. J' utilise cette couleur bleue, et ce que je vais faire, c'est que je vais juste mettre en évidence les boutons. Donc ça va être mon bouton. Et ça va aussi donner mon bouton, ok. Et ah, ce que je fais normalement c'est que j'utilise un autre tueur comme ce jaune pour mettre en évidence les liens texte ou quelque chose comme ça. Comme si c'était un lien. Donc je vais utiliser le jaune pour ça. Ok, donc ce genre de choses. Donc, si celui-ci est lié, je peux aussi utiliser mes stylos gel pour mettre en évidence quelque chose comme ça. Ok, donc peut-être que c'est un champ d'entrée, donc je vais utiliser quelques points forts. 100. Euh, comme ça. D' accord. Ainsi, vous pouvez voir comment facile et rapide. On était tout à fait dehors pour la même page. Ok, donc peut-être qu'on a besoin de termes et de conditions ou quelque chose comme ça pour une autre itération. qu' Peut-êtrequ'on a quelque chose par ici, un qu'il voulait dire plus. Donc vous pouvez voir ici. Nous avons plus d'éléments ici. Peut-être que nous avons des termes et conditions. Ou peut-être aider la ligne ou quelque chose comme ça. Donc, ici, nous en avons plus. Laisse-moi bouger. Celle-ci ici. Nous avons plus d'articles sont sur un seul écran, et ici nous avons moins d'articles. Vous devez donc vous assurer que cette aide de mise en page va nous aider à décider ce que nous allons utiliser un balisage horaire ou un cadre métallique. Ok, donc ça va être beaucoup moins détaillé. Pas de détail du tout. Juste les espaces réservés pour tous les éléments. Ok, donc vous pouvez voir que j'ai utilisé seulement deux couleurs. Et si vous le souhaitez, vous pouvez utiliser ce genre de mise en évidence des orteils de gélatine. Différents liens comme celui-ci est mot de passe. Donc je vais juste le souligner. Oubliez votre mot de passe C' est un lien. Donc je vais juste le souligner. Quelque chose comme ça. Vous pouvez également utiliser cet orteil Sharpie. Mettez en surbrillance. Peut-être que je veux que c'est une ombre. Quelque chose comme ça. Aussi, je vais mettre un peu d'ombre ici qu'il est animé. C' est important. Donc ce sont les détails qui vont être dans votre, hum, hum, conception de niveau de bloc de gens. D' accord. Donc vous pouvez voir que j'ai vraiment été dehors. Vous pouvez décider de nombreuses mises en page. Cet écran est très simple. Nous avons peu d'éléments ici, donc si nous avons trop d'éléments, comme peut-être 10 éléments ici, nous pouvons passer à une autre mise en page. C' est ainsi que vous pouvez créer rapidement beaucoup de Leo's avec seulement un stylo et du papier et quelques autres marqueurs ou peut-être des surligneurs comme ceux-ci. Ok, alors laisse-moi te montrer une autre chose comme tu peux voir ici. C' est le prototype de notre peuple qui allait aux pieds. Discutez dans la leçon suivante et la salle affaiblir. Casser celui-là. Ce sont donc les quatre étapes. Chaque fois que vous alliez commencer à concevoir ou à résoudre un problème conçu ou une application que vous construisez, vous résolvez les problèmes de l'expérience utilisateur. Ok, donc pour résoudre ces problèmes, vous allez changer d'orteil ces prototypes de papier. Vous pouvez voir ici nous avons cette augmentation dans le nombre hors de cet écran. Donc c'est le numéro un. Écran notre tableau de bord eso j'ai utilisé celui-ci. Ok, donc dans la leçon suivante, nous allons concevoir quelque chose comme ça. Nous allons orteils, créer plus de détails pour cet écran et vous assurer que vous pouvez utiliser mettre des prototypes de papier orteil, le tester avec vos utilisations. Donc, ce sera votre premier que vous pouvez voir pour l'étape. Si vous n'allez pas utiliser de prototypes papier, alors vous allez dire à Adobe X'd de créer les mêmes prototypes. Et vous pouvez cliquer, cliquer sur les prototypes applicables ou interactifs pour obtenir mieux et le jugement sont voir ce que leurs utilisateurs pensent de cette application ou comment ils se comportent en utilisant ce prototype. Ok, donc c'est tout. Vous avez besoin de quelques choses comme cette épingle à gel, ce mercure et ce crayon. Et c'est tout. Un surligneur quand goupille gel et un crayon. Et vous pouvez créer ce type de disposition de conception de niveau bloc plusieurs mises en page instantanément. Maintenant, dans la leçon suivante, passons à la leçon suivante où nous allons discuter de la façon de concevoir les prototypes détaillés et détaillés sur papier. Passons donc à la leçon suivante. 34. Premier prototype de papier - Ajouter des détails: D' accord. Maintenant, dans cette leçon, nous allons commencer par détailler cette disposition de bloc de papier, et nous allons utiliser ce cadre de fil statique créatif Je cadre tout ce que vous pouvez utiliser le même via le cadre dans le remorquage. Prototype de papier. Donc, ce que nous allons faire, c'est maintenant que nous allons utiliser leurs titres ou leur texte ici. Ok, donc je vais utiliser quelque chose comme ça et appeler ça un logo. Ok, alors on va utiliser du texte. Bienvenue, sn ou quelque chose comme ça. Donc, c'est le texte de bienvenue. Ensuite, nous allons utiliser des champs de texte ici comme celui-ci un et deux, et je vais utiliser peut-être crayon ici pour montrer un excellent login ext et mot de passe. Ok, donc on a atteint ce point, et ensuite on va utiliser un bouton. Voyons donc que nous avons décidé d'utiliser celui-ci ici. Connectez-vous. D' accord. Et ici, nous avons le travail du patron de la cour. Ok, donc nous avons utilisé cette mise en page, et ensuite nous pouvons utiliser quelque chose comme ça. Euh, je n'ai pas de signe de comptage. Nous avons donc nos éléments disposés, et maintenant nous allons utiliser le même surligneur pour mettre en évidence nos boutons s. Mieux vaut que nous l'ayons. L' un d'eux. Et maintenant je vais utiliser ce gel rouge pinto sûr que ça va être un lien. OK, vous pouvez utiliser ceci ou vous pouvez simplement utiliser celui-ci Cette aide noire en remorquage Mettez en surbrillance comme ceci . Donc ça va être un lien. Donc, ici, nous avons tout mis en place. Vous pouvez également utiliser ce marqueur Sharpie sont pour mettre en évidence cette querelle comme ce K aussi comme ça . Et si vous voulez, vous pouvez également mettre en surbrillance ce logo un peu si vous voulez y aller. Mais c'est comme ça qu'il va orteil Regardez maintenant donc vous pouvez voir ici nous avons la technique de bloc simple et ici nous avons notre cadre métallique ou le prototype de personnes ou des croquis de conception de papier pour construire un prototype de papier. Ok, donc vous pouvez construire plusieurs écrans comme j'ai grand pour cette application. C' est essentiellement une application de billetterie et je pense que je ne veux pas entrer dans trop de détails, mais c'est comme ça que vous allez le construire. Donc, fondamentalement, ce que j'utilise est quelques couleurs, une couleur pour les liens mettent en évidence ma première seconde réaction. Et voici ma famille ou moi dans les boutons sur mon écran. Ce sont les actions principales que l'utilisateur doit prendre sur ce bouton. D' accord ? Sur l'écran. Donc ce sont quelques choses que je voulais vraiment vous montrer avant d'entrer dans Adobe X'd parce que c'est la phase de planification de tout design, il est plus important que de créer un design très agréable ou très brillant ou un design parfait pixel dans Adobe X'd. Donc tout ça vient de moi. Et j'espère que vous avez apprécié cette leçon. Si vous avez des questions à me poser, je vais vous donner un orteil d'affectation, créer une personne, un prototype ou une conception de bloc de papier, et un cadre métallique détaillé de ce même design et prendre une photo et soumis. Ok, donc dans la leçon suivante, nous allons à la période de cette mission. Donc, si vous avez des questions à me poser, passons à la prochaine leçon. 35. Prototypes T horizontaux verticaux: Ok, dans cette leçon, nous allons parler de ces cinq choses sur les prototypes papier et les utiliser plus. Ensuite, on va faire des prototypes horizontaux. Quels sont le prototype vertical STI prototype et le type parfait local. On va couvrir tout ça. Je vais vous donner les exemples. Et d'abord, nous allons passer par le prototype en papier. Non, prototypes en papier sont le meilleur moyen et le plus simple et le moins cher moyen de créer n'importe quel prototype dans le sport. Comme vous pouvez le voir ici est un papier pour radier. Différents écrans hors processus de réservation de cette application de train, vous pouvez voir ici. Il s'agit de l'écran d'ouverture de session. Ceci est le tableau de bord qui est la réservation. Et puis nous avons les sièges et les rêves et ensuite nous avons voir les détails que vous pouvez voir ici. Ensuite, nous avons un peu plus de remplir les détails, détails de réservation et ainsi de suite et ainsi de suite. Ok, donc quel est le prototype horizontal ? Ok, donc je vais vous donner l'exemple de l'utilisation de ces prototypes de papier que j'ai ici prototype horizontal. Comme son nom l'indique, il va orteil être dans cette direction. Direction signifie que si je construis ah Horace sous prototype, vous pouvez voir ici ce tableau de bord. Si je construis un prototype horizontal pour cet écran de planque, il y a quatre éléments interactifs ici. Peut-être ce combat. Donc ce que je vais faire, c'est si l'utilisateur clique ici, je vais concevoir ces quatre et cinq autres écrans qui vont être liés à ce statut. Mais d'un autre côté, je ne vais pas créer en profondeur processus de réservation. Donc, si quelqu'un clique sur le livre, les preneurs vont voir l'écran suivant pour réserver comme celui-ci regardant plan. Mais après avoir cliqué ici ne va pas aller à l'un de l'écran, il va revenir pour attraper. Pour. Pourquoi ? Parce que nous ne testons pas le travail détaillé à travers aucune hors de ces fonctionnalités ici. Ok, donc, euh, ça va être notre prototype de centre cardiaque. Très limité dans la destruction. Il va couvrir principalement l'information, l' architecture ou la navigation de votre site Web. Donc, si vous avez, comme, 10 catégories, vous allez orteil, créer 10 pages, et l'utilisateur va juste bout taper sur n'importe quel hors d'eux. Visitez cette page. Ok, donc il s'agit d'un prototype horizontal. Pas de prototype vertical. Ça va être dans la profondeur. Donc vertical signifie que vous descendez profondément dans le sol. Ok, donc maintenant, si je vous montre le prototype vertical pour réserver des billets, il va frapper ou il va être spécifique orteil une caractéristique d'une fonction de votre pomme. Notre site web. Ok, donc je vais construire un prototype vertical pour les billets de livre, ce que j'ai fait ici. Donc, si vous cliquez sur les tickers de livre, ce sera le prochain plan de réservation d'écran. Vous allez lâcher mort et votre itinéraire et vous allez voir les disponibilités des places. D' accord. Et ensuite, vous allez voir le siège dans les trains. Ensuite, vous allez obtenir les détails. Consultez les détails pour plus d'expansion de cette souche que vous avez sélectionnée que vous ne pouvez cliquer sur ce livre pour obtenir maintenant. Et vous allez aller à ces détails de réservation. Ok, donc après avoir sélectionné vos coordonnées, vous allez me montrer cette dernière reine que j'ai conçu des options de paiement . Vous avez des options de remboursement. vous en sélectionnez un, il est mis en surbrillance et vous sélectionnez Ce bouton va changer. Ubl préféré cette carte et vous allez taper ici et votre paiement sera fait. OK, donc c'est un exemple de prototype vertical. Pas de prototype. Comme son nom l'indique, vous pouvez voir ici. C' est horizontal et c'est vertical. Donc, dans les prototypes t, nous allons mélanger des prototypes horizontaux et verticaux. Alors laissez-moi vous montrer ici que nous avons comme, ici nous avons cet écran de connexion. Laisse-moi te montrer. Ici, nous avons l'habillage de slogan pour la même application de réservation de drain. Et si vous allez au type plus raide, si je construis l'écran de connexion de la justice et cet écran d'inscription, ce sera mon prototype d. Parce que je suis, je peux voir ces deux écrans horizontalement et puis je peux aller à cet écran Celui-ci ok, aussi, aussi, si vous construisez quatre écrans différents pour les écrans pour cela, ces trois fonctions et le groupe vont en détail sur Lee. Celle-là. D' accord. Pourtant, ce sera votre prototype d. Donc, euh, une caractéristique que vous allez tester en profondeur d'autres, vous allez aux pieds. Tu ne vas pas tester en profondeur. Il y aura un ou deux écrans pour chacun d'eux. Si c'est OK, alors on va venir à bout de ce prototype local. D' accord ? Maintenant, ce que signifie le prototype local, c'est que nous allons tester les orteils. Juste une zone spécifique de votre application. Ok, donc peut-être que si nous avons cette donc peut-être que si nous avons cettefonctionnalité oublié mot de passe. D' accord ? Nous voulons tester différentes heures de relâche ou différents flux de travail à partir de cette fonctionnalité de mot de passe oublié . Nous allons seulement tester ça. Ok, donc peut-être que si je tape dessus, je l'écran suivant sera ça. Saisissez votre adresse e-mail pour obtenir votre mot de passe. Donc c'est ma première idée. Et si je tape à nouveau, ou peut-être dans la prochaine idée de prototype, si je tape ici, j'arrive à un écran où je viens de mettre mon émetteur mobile. Ok, donc peut-être ce mot de passe pour quatre gardes. Il m'a demandé un numéro de portable dans un prototype dans un autre. Il m'a demandé un email dans un autre. Il m'appelle sur mon téléphone. Ok, donc ce sont des options différentes. Tu peux essayer pour celle-là. Donc, si vous vous concentrez sur un seul élément dans votre application entière sur un seul écran, vous allez utiliser ce prototype local. Donc, tout est sur les prototypes de papier, horizontal vertical de prototype, prototype local, Tous ces types et comment vous allez utiliser le prototype de papier. Donc, ce que nous faisons normalement, c'est que nous montrons à l'utilisateur le premier écran et cela va être caché. Ces écrans prochains écrans seront à nouveau. Laisse-moi te montrer ces trois choses. Je vais faire quelque chose comme Thetis. OK, donc je vais cacher ces écrans et je vais montrer à mon utilisateur cet écran, pas celui-ci. Ok, donc c'est le texte de bienvenue du logo. OK, entré ton mot de passe de téléphone portable, et je veux lui ou orteil. Pensez à haute voix signifie qu'ils vont dire, OK, je veux mettre mon numéro de portable ici. Je veux mettre mon passeport ici, et ensuite je vais me connecter à la presse. Ok, donc après ça, je vais me mettre aux pieds, glisser comme ça, et je vais leur montrer que cette cachette vaut peut-être glisser vers eux. Et une fois qu'ils verront ce tableau de bord, ils vont se concentrer dessus. Ok, ce sont mes livres. Vous, ces billets dépendent. Ce sont mes billets annulés. Ok, donc je veux un billet O. D' accord. Avant cela, je veux m'assurer que mon utilisateur, elle sait que je suis je veux difficile de réserver des billets. Ok, alors laissez-moi enlever cette étiquette ici pour vous montrer le haut ici. C' est le Pakistan. Aide et profil des chemins de fer. Ok, donc, euh bonjour, Essen. Et voici votre tableau de bord. Tous vos excavateurs réservés et annulés et en attente, et puis vous avez seulement quatre choses que vous pouvez faire. Donc, je veux une dure protestation. Juste ce pays de réservation de billet. Ok, aussi, vous pouvez voir par ici. J' ai les numéros. Vous pouvez voir que c'est zéro, et ceci en est un. C' est juste pour m'assurer que je ne perds pas tout mon prototype et que je ne les mélange pas. Et puis je dois, vous savez, les combiner. Je suis confus. Ok, encore une chose que vous pouvez voir, j'ai enregistré ça. C' est très facile. Dans les prototypes de personnes. Vous pouvez simplement utiliser un autre papier et le joindre avec le premier écran sur la partie que vous voulez. Si vous voulez juste Jane, ces boutons vous pouvez l'arracher et vous pouvez attacher une autre pièce sur les gens. Ok, donc je pense que c'est tout sur des prototypes papier sur le travail horizontal paradisiaque, un prototypes verticaux. Je pense que nous les avons tous couverts. Et passons à la leçon suivante. 36. Niveau de fidélité et de prototypes: D' accord. Maintenant, dans cette leçon, nous allons commencer par détailler cette disposition de bloc de papier, et nous allons utiliser ce cadre de fil statique créatif Je cadre tout ce que vous pouvez utiliser le même via le cadre dans le remorquage. Prototype de papier. Donc, ce que nous allons faire, c'est maintenant que nous allons utiliser leurs titres ou leur texte ici. Ok, donc je vais utiliser quelque chose comme ça et appeler ça un logo. Ok, alors on va utiliser du texte. Bienvenue, sn ou quelque chose comme ça. Donc, c'est le texte de bienvenue. Ensuite, nous allons utiliser des champs de texte ici comme celui-ci un et deux, et je vais utiliser peut-être crayon ici pour montrer un excellent login ext et mot de passe. Ok, donc on a atteint ce point, et ensuite on va utiliser un bouton. Voyons donc que nous avons décidé d'utiliser celui-ci ici. Connectez-vous. D' accord. Et ici, nous avons le travail du patron de la cour. Ok, donc nous avons utilisé cette mise en page, et ensuite nous pouvons utiliser quelque chose comme ça. Euh, je n'ai pas de signe de comptage. Nous avons donc nos éléments disposés, et maintenant nous allons utiliser le même surligneur pour mettre en évidence nos boutons s. Mieux vaut que nous l'ayons. L' un d'eux. Et maintenant je vais utiliser ce gel rouge pinto sûr que ça va être un lien. OK, vous pouvez utiliser ceci ou vous pouvez simplement utiliser celui-ci Cette aide noire en remorquage Mettez en surbrillance comme ceci . Donc ça va être un lien. Donc, ici, nous avons tout mis en place. Vous pouvez également utiliser ce marqueur Sharpie sont pour mettre en évidence cette querelle comme ce K aussi comme ça . Et si vous voulez, vous pouvez également mettre en surbrillance ce logo un peu si vous voulez y aller. Mais c'est comme ça qu'il va orteil Regardez maintenant donc vous pouvez voir ici nous avons la technique de bloc simple et ici nous avons notre cadre métallique ou le prototype de personnes ou des croquis de conception de papier pour construire un prototype de papier. Ok, donc vous pouvez construire plusieurs écrans comme j'ai grand pour cette application. C' est essentiellement une application de billetterie et je pense que je ne veux pas entrer dans trop de détails, mais c'est comme ça que vous allez le construire. Donc, fondamentalement, ce que j'utilise est quelques couleurs, une couleur pour les liens mettent en évidence ma première seconde réaction. Et voici ma famille ou moi dans les boutons sur mon écran. Ce sont les actions principales que l'utilisateur doit prendre sur ce bouton. D' accord ? Sur l'écran. Donc ce sont quelques choses que je voulais vraiment vous montrer avant d'entrer dans Adobe X'd parce que c'est la phase de planification de tout design, il est plus important que de créer un design très agréable ou très brillant ou un design parfait pixel dans Adobe X'd. Donc tout ça vient de moi. Et j'espère que vous avez apprécié cette leçon. Si vous avez des questions à me poser, je vais vous donner un orteil d'affectation, créer une personne, un prototype ou une conception de bloc de papier, et un cadre métallique détaillé de ce même design et prendre une photo et soumis. Ok, donc dans la leçon suivante, nous allons à la période de cette mission. Donc, si vous avez des questions à me poser, passons à la prochaine leçon. 37. Ajouter des détails à votre conception de bloc dans XD: D' accord. Maintenant, dans la dernière leçon, nous faisions cette conception de niveau bloc, et je vous ai montré beaucoup de prototypes papier et différents types hors prototypes et tout sur le prototypage. Ok, maintenant on passe à l'étape suivante. Ok, donc la prochaine étape dans n'importe quelle phase de conception est rapide. Vous avez commencé avec la conception de niveau bloc, et l'étape suivante sera que nous allons ajouter des détails. C' est comme quand on voit un peintre quand il commence à peindre quelque chose sur sa toile. Ce qu'elle fait est qu'elle va orteil mettre juste quelques couleurs ici et là. Des tueurs majeurs pour obtenir la forme de sa peinture ou quelque chose comme ça. Ok, alors ils commenceront à y ajouter des détails. Ok, c'est comme ça que les croquis fonctionnent. Même si vous allez essayer d'esquisser quelque chose, vous allez orteil premier croquis. Très perdue. Ce qui ne ressemble pas trop à une Cardone ou à quelque chose que vous commencez à l'affiner. Et à la fin, ça a l'air vraiment incroyable. D' accord ? De même, dans la conception Web, l'application mobile, concepteurs, l'expérience utilisateur, la conception de toute la physique hors conception de l'expérience utilisateur à partir de l'obtention d'informations des utilisateurs, des entretiens avec les utilisateurs, tout ce que vous ajoutez des détails, étape par étape. Alors que nous passons à l'étape suivante, nous allons ajouter plus de détails. Ok, donc maintenant ce qu'on peut faire, c'est créer un seul cadre de feu de tueur. , Ce que je veux dire par couleur unique,c'est que pour n'importe quelle action, je vais utiliser une seule couleur . D' accord ? Donc, plutôt que de les remplacer sur ce téléphone bloqué, ce que nous allons faire, c'est que nous allons le remplacer, bout de quatre, peut-être source. D' accord. Donc je vais m'en servir. Aucune OTAN n'envoie. Ok, donc ce que je vais faire, c'est ajouter, genre, genre, accueillir une personne, accord ? Quelque chose comme ça. Donc ça va être par ici, et ensuite nous allons aussi aller aux pieds. Dites à l'utilisateur que ce sera le logo. Ok, donc nous allons ajouter un calque de texte de plus par ici. Il va dire logo. Ok, donc ce que nous essayons de faire, c'est d'ajouter plus de détails. Fais-le. Ok, donc ça va être logo que ce texte est le bienvenu. Ensuite, ce sera notre supprimons ceux-ci et je vais dupliquer cela parce que c'est plus logique. Et c'est plus facile comme ça. Je passe ma clé d'archie ou d'option. Ça va être le mot du patron. Ça va être long chez l'humain. Il est donc plus clair que les e-mails sont plus faciles à mémoriser pour les utilisateurs. Donc on va utiliser les courriels ici, K. Donc aussi, on va utiliser un peu, hum, changeons ça. Donc, nous allons également utiliser quelques indices visuels comme ceci est plus important, cela va être un peu plus petit que celui-ci. Donc, je vais utiliser, hum, 24 et ici je vais aussi utiliser 20 sur. Ensuite, ici, nous allons à nouveau à Il était deux coutures comme ce changement de commande record avant pour le faire. Je le présente à l'avance, et ce ne sera pas un mot de passe. Ça va être, hum, hum, journalisation. Non. Oh, sont l'accès. Ok, alors rendez les choses plus faciles. Connectez-vous. Non. Ok, donc c'est ça qui fait des mouvements, et ensuite on va les sélectionner tous les deux en appuyant sur Shift, et je vais appuyer sur les pieds. Je suis donc il voit pour le centrage de la manière horizontale et propre Mac, Vous allez appuyer sur commande Shift ? Si. OK, donc ce sont les touches de raccourci. Je le fais encore et encore pour que vous puissiez vous en souvenir facilement alors. Ici, nous avons pour Dieu, votre mot de patron. Laisse Shing, c'est l'orteil du téléphone. Pas besoin d'orteil Quelle est la racine du sens et nous l'avons. On ne va pas le faire tirer. Ça va être 20 gros Oezil et, euh, on va l'aligner au centre. Ok, chef. Tu vois ? Ça n'a pas l'air d'une ligne au milieu. Peut-être que tout le reste n'est pas aligné. Donc elle crible les fenêtres et je vais l'aligner ici comme ça. Il a l'air génial. Et maintenant, nous allons ajouter Ah, très simple détail ici, qui est inscrit. Ok, donc inscrivez-vous moins Imo, gardez cette ligne et je vais reproduire ici. Signe. Oh, faites le trajet. Nouveau compte. Faites toujours votre déclaration très claire pour l'utilisateur qu'il s'agit d'une action distincte . OK, donc je vais le garder comme ça. Maintenant, je vais utiliser ça sur la ligne. Ça a l'air un peu virer. Alors, je vais aux pieds. Utilisez la même ligne. Voyons ce que le verdict de celui-ci il est Ah, à 71 pixels de large. Donc on va faire ça le même jour. Et puis on va les aligner comme ça. Je vais les regrouper, Commandant Contrôle G, vous voyez ? Et ça va être au milieu. Voyons si tout le reste est au milieu. Faisons les regrouper orteils pour qu'il ne soit pas aller. Et ça va être notre groupe d'inscription. Allons bouger. Déplacez tout au milieu. Avant cela, Nous pouvons également regrouper ces deux maintenant il semble équilibré et tout est au milieu. C' est ce que nous voulions créer. Maintenant, tout semble au milieu. C' est ce que nous voulions créer. Maintenant je Ce que je veux que vous fassiez, c'est que vous allez créer un écran d'inscription similaire à celui-ci dans l'affectation. Donc, je vais créer une autre mission. C' est la prochaine étape. Ce sont essentiellement nos cadres métalliques. Vous pouvez également les utiliser pour connecter deux écrans et si vous voulez créer un prototype simple protestation avec vos utilisateurs. Ce sera un faible niveau ou faible fertilité ou, Je pense fait cadre de fil Fidelity ou prototype. Alors ne vous inquiétez pas, vous pouvez facilement destituer parce que votre action est visible. Maintenant, c'est un Burton. OK, j'espère que vous avez apprécié cette leçon. Si vous avez des questions à me poser, passons à la suivante. 38. Utiliser des motifs d'Ui pour le design de vitesse: dans ce. Écoutez, je vais partager avec vous deux mes secrets, ce qui vous aidera à concevoir plus vite et mieux. Ok, donc ces deux chercheurs que je vais révéler dans cette leçon, et nous allons les concevoir pour inscrire des écrans dans cette leçon, et ce seront la première étape dans la construction du prototype. Ok, donc dans la section suivante, nous allons en fait concevoir, améliorer et concevoir l'application médicale que je vous ai montrée au début. Et maintenant, je vais terminer cette section avec cet exercice, et j'espère que vous en profiterez. Ok, Donc le premier secret est que quand tu dessines pour quelque chose comme ça et que tu étais tu essayes d'améliorer quelque chose. Notre conception ou essayer de construire une solution. Vous avez besoin d'utiliser les orteils aussi moins de couleurs que vous le pouvez. D' accord ? Donc, utilisez juste une couleur, ce qui est ma recommandation. Et j'utilise toujours ça. Vous pouvez voir ce sont ces deux écrans vraiment regarder créer. Même j'utilise une seule couleur. D' accord ? Et cette couleur est cette couleur bleue. Ainsi, vous pouvez voir cela peut facilement simplifier votre processus. Et vous pouvez facilement créer quelque chose comme ça. Ok, Maintenant, le deuxième secret est que toujours essayer d'utiliser construire des bibliothèques patrons déjà construites ou bibliothèques graphiques. Mais vous pouvez l'utiliser pour accélérer le processus comme vous pouvez le voir. Quoi ? Ici. C' est le clavier. Je ne l'ai pas conçu, parce que si j'ai essayé de le concevoir moi-même, peut-être que je ne suis pas capable de le concevoir La première chose et la deuxième chose d'entraînement est qu'il faudra , genre, peut-être, trois ou quatre heures juste pour concevoir ce clavier. Ok, donc ce que j'ai fait, c'est que j'ai eu cette planche à clés de la bibliothèque, je vais vous montrer dans une seconde et aussi la barre d'arrêt. Vous pouvez voir que c'est de mon standard américain à De Library de l'OPEP. Ils ont construit gratuitement, mais vous pouvez télécharger gratuitement sur le site d'Apple et aussi celui-ci et aussi cette zone en haut . Ceci est également bordé de la même bibliothèque. Ok, donc ces bibliothèques de modèles, guides de voiture Styx. Ils vont nous aider à construire et à accélérer notre travail. Ok, alors n'essayez pas de créer des icônes comme celles-ci. Est-ce que c'est celle-là cette batterie ? Je t'appelle. Cela va ralentir votre pourcentage de conception. Et cela ne va pas vous aider dans votre vie professionnelle. D' accord ? Normalement, ce que je fais est que j'achète normalement Great sont cool look icônes du marché créatif ou un autre site Web, parce que cela va m'aider à garder mes dessins et les garder, vous savez, les faire très rapide. Ok, donc ce qu'il nous faut, c'est qu'il nous faut un design rapide. Nous ne voulons pas gaspiller comme Dan Astor a conçu une icône. Ok, donc c'est tout ce qui parle de deux secrets que vous allez d'abord utiliser des bibliothèques construites dans des bibliothèques de design déjà construites, bibliothèques mécènes, qui allaient emprunter pour nos designs. Ce sont des bibliothèques standard. Et aussi ce sont des claviers rus standard. Ok, donc nous concevons les orteils. Vos écrans sont essentiellement Donc, cela va vous aider si vous concevez dans la boutique photo ou Adobe X'd ou croquis. Ces bibliothèques intégrées sont vous, comme c'est normalement qu'ils les appellent généralement des enfants de conception d'interface, ils vont vous aider beaucoup. Ok, donc je vais vous montrer les ressources dont nous avons besoin pour cet exercice. Comme moi. Allez dans mon navigateur. D' accord. Maintenant, la première chose dont nous avons besoin est si vous êtes sur Windows, la première chose dont nous avons besoin est cette Ford de San Francisco, qui est ah, sentir Ford hors de nous, ABS et sur Mac, il est déjà installé. Si vous êtes sur, hum, dernière question Mac et deuxième chose, vous pouvez le télécharger à partir d'ici. Ok, donc vous pouvez appuyer sur ce téléchargement, télécharger , zip, et installer la version pdf, pas la vraie plongée ouverte. Ok, alors laisse-moi te montrer. Ok, donc ici je m'attendais à ce dossier que j'ai téléchargé, qui ont s f téléphone pro San Francisco prouver à San Francisco compact, qui est pour les montres Apple, je suppose. Ok, donc pro de San Francisco, je suis ouvert et ils ont un type ouvert de vrai type. Essayé. Installez celui-ci TDF. Ok, ça suffira. Alors sélectionnez-les tous, installez-les. Et nous sommes un peu comme moi partager avec vous les travailleurs U que vous devez télécharger avant commencer cet exercice. Maintenant, si vous allez à ce développement art pomme dot com, ces sources de slash design. Il y a des ressources pour concevoir ces, Vous savez, je nous 11. ce moment, la version est 11. Je nous 11 interface. Vous pouvez voir qu'on est là. Ceci est à partir des directives de l'interface humaine pour le fichier d'esquisse de show file et sera défié X . Alors téléchargez ce fichier et nous en aurons besoin lorsque nous allons concevoir ce fichier. D' accord ? En outre, vous pouvez trouver beaucoup de rabais. Autre ressource est comme vous pouvez voir vos cheveux sur extra poussé. Il y a un autre enfant comme celui-ci. En outre, il y a avec ce site, gratuit par point de fourniture com. Je cherche XDR nous. Vous pouvez voir qu'il y a vous évasions aussi. Vous pouvez voir ici est un autre cas que j'aime vraiment. Assurez-vous qu'il s'agit de graphiques standard. Ils ne sont pas un que vous travaillez pour une application spécifique. Vous pouvez voir ce sont des choses standard dont nous avons besoin lorsque nous concevons. Comme vous pouvez le voir, ce sont des claviers ici. D' accord. Et ah, c'est tout. Avant de commencer votre conception, vous avez besoin d'au moins celui-ci, ou au moins celui-ci. Ok, alors ne les laisse pas tomber. Et pour les garder dans un dossier séparé et aussi essayer de télécharger installer. Si vous êtes sur Windows 10 installé ce San Francisco Prue dans San Francisco Compact. Vous pouvez voir que c'est pour les hommes vertueux. Donc, dans la leçon suivante, nous allons réellement commencer à concevoir ça. Ok, passons à la leçon suivante et commençons à concevoir les écrans d'inscription dès maintenant. 39. Créer un exercice d'écran Ios: Ok, maintenant on va commencer à concevoir ça pour ça. Nous allons ouvrir un nouveau fichier et nous allons sélectionner cet iPhone 678 Click dessus. Et nous avons un autre dossier ici. Contrôlez ou commandez zéro pour zoomer sur le niveau maximum que nous pouvons avoir. Ok, maintenant nous allons commencer par le haut, et pour cela nous allons avoir besoin de notre Toi comme ça. D' accord, donc avant ça, je pense qu'on devrait préparer nos autres choses rapidement. D' accord. Alors rectangle DOOL orteil obtenir quelques cheveux textuels. OK, donc on se sent blanc. Voyons si ça va tenir au milieu. Ok, donc ça a l'air super. Ok, maintenant nous avons plus de texte. Vraiment ? Maintenant, nous allons ajouter une étiquette ici, et pour ça, nous allons utiliser un calque de texte, et je vais aller à la force, qui va être San Francisco. Alors appuyez sur s f sur votre clavier et vous verrez comme centre de presse moitié affichage. On va utiliser un texte de chef ou un peu de latex, selon ce que vous voulez. D' accord. Et je vais utiliser à l'exception du texte. Et nous allons taper, hum Ok, donc nous en avons un. Ah, champ de texte. Et aussi, je vais dans l'obscurité à la frontière de celui-là. D' accord ? Et ça va être deux pixels comme ça. Ça a l'air bien. Ok, donc nous avons un champ, et ce que nous pouvons faire ici, c'est que nous pouvons créer un symbole de marque, et ce serait, euh quelques suivants simplement dit, et nous pouvons avoir un autre symbole en faisant glisser ou ici. Et vous pouvez voir que je suis passé à ce SX, et il y a mon symbole, et je peux aller de l'avant et changer x deux. Um, possible donc on a en ce moment à se sentir, et maintenant on a besoin d'un bouton. Ok, donc pour ça, je vais retourner ici. Goto cet outil rectangle, et je vais orteil créer un bouton un peu plus lourd que cela. Ces deux-là. Ok, donc ça a l'air génial. Et je vais prendre un peu de couleur comme ça, accord ? Donc non, pas la frontière. Mais je veux le remplissage. Toby, on va entendre quelque chose comme ça. Eh bien, peut-être qu'on va bien. Donc je vais ajouter ce tueur aux commutateurs Michaela, donc je n'ai pas besoin d'y accéder encore et encore. OK, donc c'est une couleur. D' accord. Aussi, je peux ajouter cette grave ular ce travail créatif prochain véhicule afin que je puisse l'utiliser encore et encore . Aussi cette couleur de bordure. C' est une autre nuance sur trois. Donc j'ai des tueurs d'arbres en ce moment, donc je n'ai plus d'orteils, vous savez, ajoutez-les encore et encore. Maintenant, je vais dupliquer ce texte afin que vous puissiez voir dans ce panneau de bail symbole et le texte est en dehors de ce symbole. D' accord ? Et vous pouvez également appuyer sur le contrôle, les déplacer et voir pour le doublure au milieu. Je vais changer une grosse vente parce que je l'aime comme ça. Ça a l'air plus naturel. Ok, donc nous avons maintenant ça ici, deux craintes qu'une connexion et ce qu'il nous faut c'est qu'il nous faut deux choses de plus. Comme mot de passe oublié. Allons-y. Donc vous pouvez voir quand je le traîne près, les deux sentent qu'il y a une distance. Montre que chaque distance est égale à 22 picks est OK, donc je vais le laisser comme ça. Ok, donc aussi, je pense que ces, euh, j'ai quitté l'école pour le symbole que je vais prendre les pieds. Changez-le. Oui, je vais le fermer comme si deux porcs étaient plus proches et maintenant ils ont l'air mieux. Ok, déplaçant celui-ci un peu plus vers le bas. Ok, donc ça a l'air de créer. Ok, donc le slogan doit aussi être un peu bas. Ok, maintenant nous avons juste besoin d'un mot de passe oublié et un autre mot de passe. OK, alors cliquez ensuite sur cette copie et je suis basé ici. Et puis quand le moovit et vous pouvez voir quand j'essaie de payer quelque chose, il est toujours dans la position. OK, assurez-vous que votre distance est bonne entre les deux éléments capables. Donc, si je veux o taper sur celui-ci, vous ne voulez pas que je touche aussi sur celui-ci. D' accord ? Alors assurez-vous que vos deux éléments ils ont un bon espace parmi eux orteil beaucoup les robinets par votre bouquet tom, alors assurez-vous qu'ils sont au moins 44 ou 50 pixels les uns des autres. Donc cette zone doit être 54 photos ou quelque chose comme ça. Ok, alors nous avons, hum non, ce sera un lien, et je vais le déplacer un peu plus vers le bas pour que les utilisateurs puissent facilement taper dessus. Ok, Ne pas le rendre plus proche de ces bords sont en bas ou trop en haut parce que les utilisateurs ne peuvent pas accéder à cette zone. C' est une grande région. Si vous avez vu mes scores d'expérience utilisateur, vous savez de quoi je parle. Donc je vais le garder ici comme ça, et je vais changer sa couleur orteil ce bleu et aussi mettre une ligne en direct. Ok, donc voyons, quel est le taux de cette 81 et je vais utiliser mon outil de ligne pour créer une ligne en appuyant sur décalage. Et il est aussi 1 81 Je vais changer la couleur à ce bleu, et c'est tout. Breast V. Et je vais bouger. Ça s'en sort, quelque chose comme ça. Ok, maintenant vous pouvez voir que j'ai presque créé le plus de mes sentiments. Maintenant, nous pouvons ajouter quelques ombres ici sur cet écran de connexion. C' est ce qu'on appelle l'ombre. Ok, donc j'ajoute cette ombre trois sur violation et souffle 66 et la couleur est celle-là. Je suis je peux aussi utiliser celui-ci et ah, je peux le réduire à 20%. Quelque chose comme ça. Ok, donc nous avons ah ajouté ombre et ah, sont nos deux mots de passe et ce champ. Et vous pouvez aussi les saluer à la frontière. Ça a l'air très lourd. Je suppose que oui. Je vais utiliser le même que vous pouvez voir une fois que je changerai celui-ci, il va être reflété à celui-ci. ce faire, c'est très je peux voir une très belle fonctionnalité. Je ne veux pas qu'ils soient trop soulignés parce que pour l'instant, notre action principale est pathétique. Ok, donc si on a fait ça, va le déplacer un peu en haut de 20. Ok, donc maintenant tu peux voir si je passe sur ce symbole. C' est la région. Il va être accessible. Donc, si je tape sur ce coin sont sur ce mot de passe, il devrait être activé. Ok, donc c'est une chose que tu dois considérer. Vous pouvez en parler à vos développeurs. Que ce sera que ce trou va être la zone capable sont vidéo interactive . Ok, maintenant nous allons ajouter quelques choses pour les détails de notre vous, comme si c'était sur. Et je voudrais que vous téléchargez le nous Vous le réveillez de mes nôtres et, ah, allons importer ça d'ici. Ok, donc maintenant je vais ouvrir ça ici, et on va traîner quelques choses ici. D' accord ? Donc, non, je suis dans mes sources xdd pour les personnes âgées, et vous pouvez voir si j'ai appelé celui-là. Je peux. C' est le dossier, et vous pouvez voir ici est pour iPhone X, et c'est pour iPhone. Donc, je vais ouvrir le simple, qui est pour iPhone, et je vais zoomer contrôle votre commande. Zéro un peu plus. Importons ce titre ici. D' accord ? Donc, vous pouvez voir que ça va orteil avoir tout à l'intérieur. Donc, ce sont les embouteilleurs de navigation. Essayez de le cacher et de le montrer. Donc, ce dont nous avons besoin, c'est que nous n'avons pas besoin de la barre d'outils, mais nous avons besoin de l'état une place en haut. Donc, je vais le copier. Commande et contrôle ou contrôle C. Et je vais me pencher sur mon dossier. Je travaille et contrôle ou commande V pour le coller ou ici et juste le faire glisser en haut et il va rester ici. Ok, donc c'est un détail que nous avons ajouté en ce moment. Et puis nous pouvons aussi ajouter l'autre détail qui va être Ah. Ok, alors quoi ? J' avais besoin de Waas. Ok, donc, en fait, j'avais besoin de cette zone blanche. Laisse-moi le copier d'ici. Et, euh, fondamentalement avec ça. Donc je me souviens maintenant que j'ai téléchargé ça pour ce blanc parce qu'il nous faut un blanc sur cette cible. Tu vas bien ? Donc, je vais aux pieds, utilisez cette barre de navigation. Copiez-le, et je vais le badigeonner sur mon année ici comme ça, et vous pouvez voir qu'il est en haut, donc nous allons le déplacer en bas. Ok, maintenant vous pouvez voir que j'ai appuyez sur commande Shift et le support arrière, et c'est tout le chemin du retour. Donc je pense que j'aurais dû appuyer. Laisse-moi prendre ce contrôle et notre noyau commande ce support. Ok, donc il y a un retour ici, et maintenant on va changer la couleur, alors double-cliquez dessus et je vais changer la couleur de l'orteil. Ça a l'air de mener ces étoiles parce qu'on n'en a pas besoin. Droit ? Accédez e et laissé excessif. Tu es là. Et ah, prochain mouvement chez le chien. Que se passe-t-il ? Ok, maintenant c'est frit. Changeons sa couleur blanche et utilisons-nous. Inscrivez-vous. Inscrivez-vous, vous savez. Ok, donc on n'a pas de SMS ici comme si c'était gratuit ou quelque chose comme ça. Nous ne voulons pas que l'orteil de l'utilisateur soit confus. Cette inscription coûte ou quelque chose comme ça. Donc, nous allons ajouter du texte ici. Apporter l'inscription est gratuite. Ok, maintenant, encore une chose. Nous pouvons également ajouter celui-ci pour assembler les orteils. OK, donc je vais en faire un symbole, mais on va avoir besoin de ces outils. Et aussi, je vais voir si on peut en faire un symbole. Ok, alors laissons-le. Parce que ce soulignement sera un problème. Si nous pouvons utiliser le soulignement de ce textile ici, ce sera mieux. Solaire. Tu sais, je vais aussi en faire un symbole. Il est donc plus facile pour moi d'ajouter des liens, mais comprenez cela. Inscrivez-vous. Des figues. D' accord. Non, je vais arranger quelques choses ou de l'air ici et là juste pour faire le bon espacement et je vais laisser le prochain écran que Toby a conçu pour vous. Et vous allez importer le clavier d'ici comme ça ? Non, j'appuie sur ma touche d'art ou d'option pour voir les distances. Et j'espère que celui-là. Suspect celui-là. Attendez ça. Vous pouvez voir les distances. Maintenant, vous pouvez voir que j'ai fini de tout aligner. Et nous avons utilisé avec succès le RUS. Vous travaillez avec Apple et que ce mec orteil copie ces choses et le fait rapidement. Ok, donc dans la leçon suivante, je vais vous donner une mission pour créer plus d'écrans, écrans similaires en leur montrant le statut est et aller les lier orteils, créer un prototype. D' accord, ici là, prends soin de toi. Au revoir. Et j'espère que vous avez apprécié cette leçon. Passons à la prochaine 40. Démarrage de préparations de conception: D' accord. Maintenant, Intersection, nous allons concevoir notre superbe application d'outils GP dans Adobe X T. Et avant de creuser dans ce design, je dois discuter de quelques choses. Comme comment ensemble ces ressources est que j'ai utilisé comment vous allez les télécharger et comment nous allons orteil sélectionner ce schéma de couleurs. D' accord. Donc, vous pouvez voir ce sont tous les différents écrans. Allons zoomer et, euh, vous montrer quoi ? 100% ? Je pense que c'est mieux parce que ça rend ma force. Ok, donc vous pouvez voir ici que j'ai utilisé trois couleurs. Ok, si vous regardez de près, l'une est cette couleur principale, qui est terminée. Vous pouvez dire « prime regular » pour les actions primaires comme celles-ci sont pour les boutons. Vous pouvez voir que ce sont tous nos principaux fardeaux pour créer une voiture. Blogging. Connectez-vous maintenant. D' accord. En outre, vous pouvez voir que j'utilise la même couleur ici dans le menu déroulant. Et comme c'est notre couleur principale, j'ai utilisé une autre couleur, mais vous pouvez voir ici, qui est une Betsy sur la couleur. Ok, donc non, non, ces deux tueurs sont liés au domaine médical des orteils ou à la médecine. Ok, donc tu as besoin d'orteil. Gardez à l'esprit comme ça ce que vous essayez d'utiliser, d' accord ? Et vous pouvez voir sur cette couleur que j'avais besoin d'une couleur très nette afin que je puisse avoir quelques éléments mis en évidence dessus. Donc j'utilise cette jeune couleur. Ok, donc ils combinent des femmes. Ensuite, il y a un problème que si je veux montrer le lien sur ce fond cette couleur sombre, j'avais besoin d'une couleur de plus, qui était cette couleur jaune. Donc j'ai utilisé un orteil de couleur jaunâtre, vous savez, mélangez avec mon schéma de couleurs. Ok, alors on m'a laissé te montrer. D' accord ? Donc, j'ai déjà une couleur de plus pour ces liens, qui est une couleur supplémentaire. Vous pouvez voir si je passe à celle-là. Vous pouvez voir que cela a également l'air génial. Ça n'a pas l'air très mauvais. Ok, donc si tu veux aller sur la décoloration, c'est notre couleur bleuâtre. Vous pouvez voir ou entendre qu'il est un un six e c trois. OK, donc vous pouvez voir ici. J' ai beaucoup de couleurs. Quand j'essaie de concevoir quelque chose, je fais beaucoup de couleurs. J' ai essayé d'expérimenter avec eux. D' accord. Alors plutôt que d'avoir un ou deux tueurs. Pour commencer, je commence avec une couleur comme celle-ci une couleur principale et essayer orteil. Ajoutez quelques couleurs en combinaison à cela. OK, donc vous pouvez voir que ce bleu fonctionne aussi avec celui-ci. D' accord. Et ah, l'autre levier Hlinka que j'utilise ici, qui est ma couleur standard est un bleu violacé qui est le même, je pense comme ce bouton. Ok, donc tu peux essayer différentes couleurs si tu veux Toe. Il y a beaucoup de ressources en ligne pour créer des jeux de couleurs que je vais vous montrer en seulement une minute. L' un d'eux est mon préféré, où vous pouvez utiliser une seule couleur pour créer un jeu de couleurs entier. Ok, alors vous pouvez voir ou entendre dans ce coup de couteau sont vous pouvez voir que j'ai utilisé une couleur sombre et sur l' ensemble étaient ou état actif. J' utilise cette couleur. C' est un peu comme toutes les moyennes. Bon, maintenant vous pouvez voir ici sur ce bouton. C' est différent. Il fait un peu plus sombre. Ombrage de la même Voir sur la couleur très nette. Couleur très brillante. Donc, c'est Britt sont de couleur terne. D' accord. Vous pouvez également utiliser cette couleur. Mais j'utilise la décoloration de cette couleur pourpre foncé bleuâtre pour mes actions primaires. Ok, Et à l'intérieur de l'ab, quand vous étiez à l'intérieur de l'application dans le coup, j'utilise la décoloration pour différents boutons. OK, donc vous pouvez voir que c'est aussi un bouton ici. Et cela est aussi à propos d'un pas de cheveux. OK, afin que vous puissiez voir la similitude dont vous avez besoin pour être cohérent au sein de votre application. Donc, si j'utilise une couleur bleu foncé pourpre Calero ici et utiliser ah couleur Pil Seong ou ici ce sera ce est l'incohérence. Donc, vous devez l'enlever toutes ces incohérences. Donc, votre application semble incroyable et cohérente dans votre design visuel et vos couleurs et tout va bien. Et avant de commencer cette conception, je veux que vous téléchargez tous les actifs que j'ai utilisés dans cet exercice. Vous pouvez les trouver dans les ressources dans cette section dans la première leçon sur peut être attaché à cela. Ecoutez, la force des icônes du SPD appelée le fond que j'ai utilisé. Ce sont tous libres et c'est l' icône que j'ai réellement conçue pour l'air par ceinture. Ok, j'ai conçu Ok, donc c'est une application britannique pour les médecins. Ok, Donc avant de commencer ce design, je veux que vous téléchargez ces actifs qui sont attachés à ça. Ah, conférence. Et vous avez besoin de tous ces atouts avant de commencer cet exercice. Téléchargez ces forces à nouveau. E sable dit si vous y Ford et vous pouvez également utiliser roboto si vous voulez. Oh, et ça encore, E. Et ils vont aussi très bien paraître. Ces autres ressources les téléchargent et nous allons commencer dans la prochaine leçon. Ok, donc à bientôt dans la prochaine leçon. 41. Réglement des couleurs: Ok, Avant de commencer à concevoir cette application géniale, nous allons discuter de quelques choses. Ok, le numéro un est l'inspiration. Avant de commencer une conception, vous allez voir les abdos similaires et sites similaires pour voir quels jeux de couleurs ils utilisent. Quel genre de typographie courte ils utilisent. Ok, donc pour ça, laissez-moi vous montrer comment j'ai commencé ce processus. Avant d'entrer dans ce domaine, j'ai dû choisir au moins deux tueurs pour commencer. Ok, alors laissez-moi vous montrer mon inspiration et comment je les utilise. Vous pouvez voir que c'est mon dossier d'inspiration. J' ai juste trois choses par ici. Ce schéma de couleurs. Je pense que j'ai réussi à créer celui-ci à partir de refroidisseurs point C or. Peut-être que je pense qu'un travail à un particulier Ok, AB, Et c'est un autre que vous pouvez voir. Laissez-moi vous montrer que vous avez zoomé. Donc, cela utilise également une couleur et une couleur verte et l'autre est bleu. Et il y a ces différentes nuances de bleu off de l'alcool des orteils lumineux. Ok, donc c'est un autre exemple à mon show. Vous en avez entendu un que vous pouvez voir ici. Ça a l'air génial. Et si vous regardez de près les deux tueurs qui étaient le but principal pour moi. Ok, donc j'aime vraiment ces deux tueurs, qui peuvent être utilisés dans notre ab. variation arabe de la décoloration de Michaela n'est pas similaire. Alors n'essayez pas de tout copier. Bien que je pense que vous pouvez utiliser les mêmes couleurs qu'elles sont ou ici. Mais j'avais besoin d'un poisson brillant et d'un oncle bleu de la mer plutôt que d'un croquet de style. Donc c'est mon dossier d'inspiration. Et ah, je crois que j'ai déjà vu beaucoup de choses sur l'APS médical. Donc, euh, ce n'était pas un gros, gros problème, mais vous pouvez voir principalement le schéma Michaela est à l'intérieur de ça. Ok, on utilise le jaune van, la mer sur le bleu qui est entre CNN et cette couleur violacée. Et puis ce téléphone est un peu brûleur bleu vif. Ok, donc vous pouvez y ajouter du vide ou du noir, et vous pouvez les rendre ternes en ajustant la luminosité et la saturation et en éliminant plus de tueurs . Ok, alors laissez-moi vous montrer comment j'en ai obtenu différentes couleurs. D' accord ? Donc, vous pouvez voir que c'est une couleur. C' est une grande, couleur bleu terne bleu foncé. Allez-y. Maintenant, si je vous montre celui-ci et ce tueur, alors cette couleur Ok, donc vous pouvez voir que c'est presque la même couleur bleue, mais dans le grand côté. Ok, donc j'ai utilisé ah, peu de gris et cette zone noire a déplacé une couleur d'ici. Ok, donc si je vais à cette couleur comme moi vous montre si découvert, je suppose. Ok, donc vous pouvez voir maintenant quelle est la différence ? Comment j'ai réussi à utiliser sur la même couleur et créé une nouvelle couleur à partir de lui en le faisant glisser dans cette zone, vous pouvez voir. Ok, donc ici, c'est presque proche de ça. Ok, alors retournez en arrière. Ok, donc j'utilise pas purement Kriegler. Ici, il est un peu de couleur bleu grisâtre. Et aussi vous pouvez voir que c'est aussi la même chose. Vous pouvez voir qu'il est toujours dans cette zone 211 Hugh et Ah, et si je vais à celui-ci, je pense que c'est aussi 211. Laisse-moi aller à celle-là. Je vois. Alors, qui est le même ? Donc, cette couleur est la même. Juste la saturation et la luminosité. J' ai changé. J' ai montré cette technique dans mes autres cours orteil que vous pouvez Vous créer de nombreuses couleurs à partir de en changeant juste la luminosité et la saturation et en gardant la teinte même. Ok, qui est la couleur de base qui définit ça ? De quelle couleur vous utilisez ? Il était en fait la couleur. Ce sont des paramètres ensemble maison de situation hattrick saturé. La couleur sera Et que c'est la luminosité médicale sera du côté de la vie ou du côté sombre. Ok, Donc c'est comme ça que j'ai choisi ce jeu de couleurs et comment j'ai eu des inspirations et des couleurs différentes. Comment les orteils, tu sais, commencent à concevoir avec ce genre de désactivation. Vous savez, le professionnalisme. Une autre chose est que vos designs vont orteils s'améliorent avec le temps. Ok, donc si vous pensez que je viens de créer ce design instantanément et qu'il n'y avait pas de processus entre les deux où j'ai donc si vous pensez que je viens de créer ce design instantanément et qu'il n'y avait pas de processus entre les deux où j'ai essayé différentes mises en page ou essayé différents clients Avant cela, j'utilisais essayé différentes mises en page ou essayé différents clients Avant cela, Juste ah, l' arrière-plan de l'avion. OK, donc je n'utilisais pas Laisse-moi cacher celui-là et celui-là. Ok, donc j'utilisais quelque chose comme ça. Ok, alors j'ai pensé que je devrais utiliser un contexte en arrière-plan, et j'ai dit que je devrais utiliser quelque chose derrière toi. OK, donc c'est comme ça que nous utilisons l'inspiration et le jus pour créer nos APS à la recherche. Il n'y a pas de design original dans le monde. Ok, tout est pris de quelque part. Ok, donc c'est un sujet hors de ma conférence. J' espère que vous avez apprécié cette leçon. Passons aux suivants et où je vais discuter des points d'expérience utilisateur. Nous allons améliorer et vous montrer les anciens écrans de la même application. 42. Résoudre les problèmes de l'ancienne application: Ok, maintenant dans ce Écoutez, je vais vous montrer ce qui indique les aspects de l'expérience utilisateur que nous avons améliorés dans chaque conception. Ok, Maintenant, vous pouvez voir ceci est la première version de cette application qui peut zoomer 200% et vous pouvez voir des cerceaux. Ok, donc nous avons, vous pouvez voir l'écran de connexion. Il dit mot de passe de nom d'utilisateur, ce qui est très déroutant. Nous l'avons changé avec e-mail. Aussi, Celui-ci Il n'y a pas d'accusé visuel clair et équipe visuelle, comme vous pouvez voir ce chien bar bleu et ce journal, et ils sont les mêmes. Ok, donc ce bouton d'action, qui est appelé action primaire, il devrait être différent de cela parce qu'il n'a pas besoin de savoir que c'est une action. Et c'est un titre qui était une très grosse erreur de conception visuelle. Ensuite, nous avons beaucoup de champs différents, que nous allons réduire orteil trois sensations, et ensuite nous avons la planque, qui est vraiment ne ressemble pas à un tableau de bord. Et vous pouvez voir toutes les couleurs et tous les boutons. Si vous regardez de près ici, ils sont les mêmes. Il n' y a aucune indication que c'est actif. Cela est floue avec le fond, qui est orteil très difficile, vous savez, années de défense. Ok, alors nous avons cet écran et il y a beaucoup d'activités différentes ici. Et c'est un écran d'entrée d'activité que nous n'allons pas concevoir. Et je vais vous montrer quelques autres écrans qui sont leur récent et design. Ceci est un design récent de leur ah ah ah, application Android. Et vous pouvez voir que nous sommes aux pieds. Rends-le plus bon. Ok, donc cet écran, on prend presque la même chose. Mais vous pouvez voir comme vous pouvez voir ou entendre cette zone est un bouton. Cette zone est aussi un bouton, mais ils ne semblent pas trop peser. Ok, donc si vous voyez mon exemple dans mon équipe, je change ça en un bouton. Ensuite, nous avons ah, très grand fond de mouette à l'arrière, ce qui est que je ne sais pas me semble étrange. n'y a pas d'image d'avatar ici. D' accord. Et, euh, laissez-moi zoomer, aller à l'autre. Ok, donc voici nos activités. Ce qu'ils ont fait est, plutôt que d'avoir ah, beaucoup sur une très grande barre de navigation en haut. Les Juifs, ils combinent toutes les activités de celui-ci. Ok, donc toute activité qui est utilisée la plupart du temps est principalement utilisée par l'utilisateur. Ils doivent être au sommet. OK, donc vous pouvez facilement y accéder. Et puis nous avons l'évier depuis. Nous sommes presque en train de faire face à la même structure, mais nous essayons de l'améliorer. Ok, donc le design visuel de cette application craint vraiment. Bien que ce soit mieux que la première version qui était celle-ci. Mais je pense qu'on peut s'améliorer beaucoup. Ok, donc ils ne ressemblent pas à ça. C' est possible. Ils utilisent aussi un tueur pour tout. Ici, vous pouvez voir la même couleur pour tout. Pour les boutons, pour le statut, pour tout. Maintenant, vous pouvez voir ici c'est le statut. Là, là, cinq évaluations. Mais il n'y a pas de schéma de couleurs que ce pur différent que c'est ah, bouton possible ou non. D' accord. En outre, l'écart entre ceux-ci semble un peu moins pour moi, à mon goût. Ou peut-être que je pense qu'il va congé des orteils. Ah, beaucoup de choses. Des faux pas. Les faux pas signifient que si quelqu'un essaie de taper ici, il va taper dans cette zone parce qu'ils sont très proches. Ok, donc on doit les séparer. C' est un autre problème d'expérience utilisateur en elle. Ok, donc c'est tout ce que j'aimerais dire que nous allons améliorer l'équipe visuelle de ça. On va faire la différence entre l'action primaire, qui est le bouton, qui est un titre. Et quelle est l'information ? Ok, donc nous devons séparer tout ça. Alors commençons à concevoir ceci. Nous allons commencer par le premier écran, alors passons à la leçon suivante. 43. Conception d'écran de bienvenue: D' accord. Non, dans cette leçon, nous allons commencer à concevoir celle-ci. Ok, maintenant vous pouvez voir en haut. Ceci est emprunté sur vous comme ça à la pomme. Et je vous ai montré avant, et vous pouvez voir que cet écran est un peu floue. On utilise du sang de fond ici, et tout le reste c'est qu'on va faire des orteils, est-ce pas ? gnocchis. Donc, ce que nous allons faire est de créer un nouveau document, et il va être iPhone 67 écran d'année. Appuyez simplement sur kick une fois et avec zoom avant contrôle, commande zéro. OK, maintenant, on va commencer par ici avant ça. Je sais déjà que vous avez téléchargé le dossier d'actifs que je vous ai donné. Ok, donc ce qu'on va faire, c'est apporter les photos et tout ici avant ça. Nous avons besoin de cette barre de navigation supérieure, alors amenons-la de, euh, vous étiez un gamin d'Apple. Donc, c'est sur pomme. Tu aimes ça. Et si je vais par ici, j'ai besoin de celui-là au nord, en fait. X iPhone X un. Ok, donc on a besoin de celui-là. Alors copions le haut. Donc nous l'avons ici. Copie-le. L' état de l'avenir. Excusez celui-là. Ok, donc ici nous avons le Skopje et juste le glisser en haut, et il va sortir un statut médicalement OK, non, nous Garda, mais en haut. Maintenant, nous allons apporter l'image d'arrière-plan ici, - un autre rectangle en haut pour créer l'effet hors flou d'arrière-plan. Donc, je vais avoir un rectangle ici enlevé la bordure, et vous pouvez voir que la taille est la même qu'une toile. Et ensuite, on va utiliser du sang de fond. Ok, maintenant le flou d'arrière-plan. Les valeurs seront le sang parmi les arbres. Nous avons besoin d'un très petit sang. La luminosité sera moins un. Nous avons besoin d'un peu de retard. Sombre sombre, sol nu et opacité sera de 15%. Ok, maintenant vous pouvez voir que c'est l'effet que j'ai créé. Nous devons à nouveau le déplacer comme ça ici avant cette image. D' accord ? Maintenant, ce que nous allons faire, c'est que nous allons aller aux pieds, les sélectionner, les regrouper, et nous allons le verrouiller. C' est notre expérience. Nous avons créé notre arrière-plan flou ici et la navigation d'arrêt. Mais maintenant, nous avons besoin d'un logo ici. Alors suivons ce logo. C' est en PNG. Faites-le pour que nous puissions utiliser la transparence ici. Ok, donc c'est un gros gros, donc je vais le rétrécir en appuyant et en tenant le quart de travail. Peut-être 1 72 Donc je vais la taille des orteils il 1 72 pixels par 1 72 Pourquoi pensez-vous que j'ai un très gros logo ? Parce que peut-être pour d'autres écrans, peut-être l'iPhone X. Nous en avons besoin d'un plus grand. Toby a exporté. Ok, ça va être dans nos discussions ultérieures en ce moment. J' ai juste besoin de savoir qu'on a besoin de ça. Et nous allons aussi ajouter un peu d'ombre sur elle. Et les réglages de l'ombre sont six et six. Ok, donc six cochons mal au fond, et six, c'est le sang, et ça va être 10%. Ok, donc plutôt que 16%, je vais utiliser 10% ici. Donc la couleur est par ici. C' est le pourcentage de l'ombre, l'opacité. C' est essentiellement la transparence et l'opacité de cette ombre. Alfa, tu vois quoi ? Ici. Ok, donc ici nous avons une très belle ombre crémeuse autour d'elle. Et puis nous allons créer un peu du texte ici, c'est comme du thé. Et je vais appuyer une fois par ici et nous allons utiliser la Ford à nouveau. A je vois. Ok, alors allons d'abord les orteils en textile Taipower Hair GP, et ensuite on va encore se moquer. Et je vais utiliser extra gras. Et, euh, la taille est de 32 photos sur 32 points. Je vais ensuite appuyer sur la télé, amener au milieu, et aussi la couleur va être quelque chose comme ça. Toto. Aussi, si vous voulez, vous pouvez utiliser quelque chose qui va être dans la chemise bleue. Ok, alors peut-être quelque chose de plus proche de ça dire, oui, ok. Donc, la couleur que vous pouvez voir, ce que j'ai utilisé est que je suis passé à cette teinte, saturation et luminosité, saturation et luminosité, et j'utilise l'énorme 211 qui est notre couleur principale, moi et premier régulier de ce design. Ensuite, j'utilise cette situation et cette luminosité. Ok, donc nous réduisons la situation. Si nous essayons de l'augmenter, il y mettra un peu plus de couleur. Vous pouvez voir qu'il se déplace vers ce côté de la couleur Ok, donc si je le déplace ici comme 90%, ça va être ici, donc on ne veut pas que ce soit une couleur noir bleuâtre. Mais nous voulions être quelque chose, euh, dans ce domaine. 17. Ça a l'air bien. Ok, Maintenant, nous allons taper notre texte ici, et nous allons la première fois le texte. Maintenant, vous pouvez voir que j'ai cliqué sur ce texte de zone car il s'agit d'un paragraphe. Nous devons donc l'ajuster avec ça. Passons la taille à 16 et on va la déplacer comme ça. Alors amenons-le dans quelque chose comme ça. Peut-être comme ça. D' accord ? Non, nous avons besoin d'un fort régulier, et nous devons le changer pour vous si je mélange. Va à ça. D' abord, celui-là. Maintenant, nous allons utiliser le milieu et le centre ici et nous allons aligner. Économique. Ok, maintenant la hauteur de la ligne et l'espacement des lignes est 19. Vous pouvez l'améliorer à 20 si vous voulez. Oh, mais je pense que 19 a l'air parfait. C' est un très bon téléphone lisible sur de très petites tailles. Et vous pouvez également l'utiliser à nouveau. Si tu veux un orteil, c'est à toi de décider. Mais j'aime vraiment l'agonie. Ah, je vais demander au bateau sont les formes libres et vraiment belle force. Donc je vais rester à nouveau avec maintenant parce que je pense que j'ai partagé avec vous l'agonie. Ok, donc notre écran de chargement ou le premier écran de notre ab est déjà terminé. J' espère que vous avez apprécié cela. Ah, assurez-vous que cette couleur de ce texte est un peu, hum, moins ou peut-être plus sombre comme ça. Une autre chose que nous devons faire ici, c'est que nous devons sélectionner cette couleur et l'ajouter à notre interrupteur de tueur. Ok, donc c'est notre première couleur. On devait donc être dans la nuance de couleur. Et aussi, je veux cette couleur Toby dans la nuance de couleur orteil. Ok, donc on a deux couleurs par ici. En fin de compte, on va, tu sais, trouver un tombeau. Très bien. Réglez ces couleurs, alors ne vous inquiétez pas pour ça maintenant. C' est notre premier écran. Si vous voulez le changer, pointez ce, euh, point X. Vous pouvez le changer en texte de point si vous voulez, parce que maintenant nous l'avons déjà fait. D' accord ? Donc c'est notre écran. Laissons la chambre 200% comme ça et il a l'air vraiment génial. Faisons-le à nouveau. La même couleur sauf avoir l'air vraiment pointu. Ok, donc notre premier écran est terminé. Créons un autre écran dans la leçon suivante. Et j'espère que vous avez apprécié cela. Une autre chose que vous pouvez faire, c'est que ce sera notre cap. Ok, donc on a besoin que ça soit dans ce sexy OK, donc on doit faire un clic droit et créer et tueur. Ok, donc nous voulons une décoloration pour nos en-têtes de texte. Et aussi, nous allons aux pieds. Vous faites encore une chose , c' est que nous allons créer le texte. Ok, donc ça va être au style tracteur. L' un est celui-là. Et ça va être au-dessus du style de la direction et du réalisateur. Ok, Donc vous pouvez voir que nous avons déjà à corriger un style, donc il sera plus facile pour nous de faire la même chose dans la prochaine leçon. Ok, donc c'est tout ce que nous avons déjà commencé à construire sur le style correcteur et nos couleurs. Je vous conseille normalement de créer et d'améliorer vos couleurs de guide sty et craquelé de côté et les symboles que vous allez de l'avant dans votre conception plutôt que de tout construire d'abord, puis implémenter dans la conception. Ok, alors nous allons vous retrouver dans la prochaine leçon où nous allons concevoir le prochain écran. 44. Concevoir l'écran de connexion: maintenant dans ce. Écoutez, nous allons concevoir cet écran d'ouverture de session pour la même application. Avant de concevoir celui-là. Ceci dans le processus, et nous avons conçu cet écran d'accueil ou écran de chargement, et maintenant nous allons aller à cet écran d'ouverture de session. Ok, donc nous avons un peu ce bouton. Ombre ces deux boutons avec ces couleurs. Alors commençons et concevons vraiment quelque chose comme ça. Je vais fermer celui-là. Et c'est notre dernier fichier de travail. Maintenant, tout simplement ce que je vais faire, c'est que je vais dupliquer ce tableau dur, contournant ma touche d'option d'art et en le faisant glisser comme ça. D' accord ? Non, on n'a pas besoin de celui-là. Nous avons déjà le textile, donc nous n'en avons pas du tout besoin. Ok, donc d'abord nous allons faire, c'est nous allons avoir un arrêt en direction ici, que nous pouvons aussi obtenir de mon U Y de pomme. Laisse-moi aller à celle-là. Et voyons avec le titre. Oui. D' accord. Nous avons donc ce titre. Vous pouvez voir que C'est que notre titre dans cette barre de navigation ? Ceci est une barre d'outils. C' est le corps. On n'a pas besoin du corps. On a juste besoin de cette barre de navigation. Et nous avons besoin de ça, en fait, oui. Donc je vais contrôler les orteils, voir une commande C et la placer ici. Ok, donc on va le déplacer en haut sous la barre d'état, et on n'a pas besoin de couleur dans celui-ci. Et je vais utiliser la même zone pour écrire Jeep être le visage de Toole, de sorte que vous pouvez voir en ce moment il est sur l'écran pro de San Francisco. Quoi ? On n'en a pas besoin pour l'instant. Peut-être qu'on peut utiliser le même téléphone si tu veux. Oh, parce que les écrans pour la direction. Alors faisons un clic droit pour une couleur étrangère à chaque besoin local, et puis je vais l'ajouter à d'autres erstein fissurés. Alors peut-être qu'on peut changer cet outil aussi prodigieusement. Ok, maintenant ce que je vais faire, c'est que je vais l'aligner au milieu comme ça, et on va enlever ces étoiles parce qu'on n'en a pas besoin. Ok, alors allons-y à cette couche et voyons que c'est notre groupe, non ? Accessoire et accessoire gauche. On va les enlever. Ok, donc ici nous avons les mêmes spécifications qu'Apple utilise. C' est les spécifications par défaut aussi nous pouvons faire la même chose à elle. On va cliquer sur celui-ci et c'est tout. Vous pouvez voir maintenant cela converti à cela. Ah, celui-là. Je vais aux orteils. Croyez-le pour vous sf un texto. Et celui-ci est sensé hors de San Francisco produits. Mais vous pouvez également utiliser à nouveau. Ce n'est pas un très gros problème en ce moment. Maintenant, on va utiliser des bougies. Étaient ici sont et je vais carrière des orteils quelque chose comme ça ici. Ce sera notre champ de texte. Faisons 60 haut. Je pense que 60, c'est trop. Peut-être que 50 six waas ont l'air bien, enlevé la frontière et on va y ajouter de l'ombre. Ajoutons un peu d'ombre. C' est trois et six. Je vais aussi faire des coins arrondis et je vais être très bien réglé. Donc, je vais utiliser ou ici et je pense que Shadow a l'air bien avec les valeurs par défaut. Je crois que je ne veux pas que toutes les ombres se répandent. Je voulais être proche de cela et aussi je voulais très léger. Donc 10% vous pouvez voir 000 10%. C' est de couleur noire. Ok, donc nous avons un champ de texte. Alors nous pouvons avoir notre texte dessus. Et ce côté email comme ça. Et maintenant, nous allons utiliser un coffre-fort. Tu as un texto. Et on va utiliser une autre couleur. Ajouter une autre couleur à elle peut être discrète. Donc nous avons ce Kriegler. Maintenant, appuyez sur V et déplacez-le ici. Je vais avoir 18 pixels de distance de cela. C' est notre seul champ de texte. Ça a l'air super. Ensuite, sélectionnez à la fois hors d'eux et à droite. Cliquez sur et créez un symbole. Ok, donc maintenant nous avons un texte trois plus bas ici. Il suffit de le faire glisser comme ça. Donc je vais avoir le mot du patron pour que vous puissiez voir à quel point c'est facile maintenant. Et il est très facile de créer différents champs à partir du même type. Ok, donc on a deux champs ici, et maintenant on a besoin du bouton de connexion. Oui. Donc, ce que je vais faire est à nouveau un rectangle et je vais avoir la même taille comme un peu plus haut 60 pour la hauteur, hors du fardeau parce qu'il devrait être différent de notre champ. Ok, donc la couleur que je vais utiliser est 211 et 84 60. Ok, donc c'est la couleur. Et Ah, je suis ajouté. Ou ici. Et on va à l'air des orteils. Une ombre, ce bouton ombre portée et nos valeurs sont l'ombre extrême. Les couleurs éteignent l'ombre. C' est la même couleur, et ça va être 36 22. C' est une couleur d'ombre, et ah, alors nous allons changer les valeurs à quatre et ça. Ok, donc ce sont ces valeurs qui vont être après quelques expérimentations. En outre, le coin arrondi est de quatre pour celui-ci. Il est plus arrondi que ces deux-là. D' accord ? Et en être ainsi ça ressemble à un bouton. D' accord, aussi, ce pourcentage est différent. Il va être de 30 %. On a besoin d'une ombre plus lourde dessus. Ok, donc il est séparé de l'arrière-plan. Cela dit, le texte, qui va être nul ici. Ajoutons le texte de connexion. Tu sais, quelque chose comme ça. Cous blancs et le collatéral blanc devant. Et, euh OK, donc je vais le déplacer au milieu comme ça. Et cela semble créer parce qu'il est déjà avoir moins d'espace. Le haut. Je pense que je dois le déplacer en haut comme ça. Donc ça a l'air bien. Ok, Maintenant, nous pouvons aussi ajouter cette collection de deux heures, clic droit et ok. Donc, plutôt que d'ajouter celui-ci, nous allons ajouter les deux. Donc OK, ajoutons pour le style Specter, et puis nous allons ajouter le groupe. Ok, donc ne les groupons pas faire un simple oui. Donc nous avons une meilleure connaissance ici maintenant. D' accord. Donc, si j'ai fait quelque chose ici, il sera détenu sur tout le monde. Alors assurez-vous que ce sera votre bouton, et vous n'allez pas changer beaucoup de choses dedans. OK, maintenant nous allons ajouter un texte qui va encore être formé. Mot de passe oublié. Ça va être un lien. Donc, je vais ajouter le singulier pour le lien en ce moment, il va être le milieu. Assurez-vous que vos attaques et tout est une ligne au milieu parce que maintenant nous concevons tout pour le milieu. Ok, donc c'est bien. Ok, donc il n'est pas au milieu, il y a un petit tout au milieu. Et puis ce seul orteil par rapport au scan était correct. Donc, nous pouvons aussi le déplacer un peu vers le haut comme ça. Comme ça. Aussi, nous avons beaucoup d'espace ici, alors pourquoi ne pas le déplacer au-dessus ? C' est pour ça que je vais avoir 44 pixels de la ville. Donc nous avons beaucoup d'espace ici parce que nous en avons besoin. Nous allons concevoir les preuves du journal pour Facebook et Google. Ok, donc maintenant, on va faire la même chose par ici. Et cette fois, je vais avoir moins de hauteur pour le bouton. On va être à 50, quatre. Je pense que ça devrait correspondre à celui-ci. C' est 56. Ok, donc ça va être 56 et le haut. Très dur. C' est 5 60 t. C'est 5 63 ou environ. Tout devrait être cohérent dans ce sur conçu. Alors, on va bouger la frontière. La couleur de remplissage sera, Ah, le Facebook bleu à 18. 84 % de saturation et 60 % de luminosité. Ok, donc nous avons cette couleur bleue, qui vient de Facebook clics. Déplaçons un peu plus vers le haut dans la luminosité comme ça. Ok, donc on va en ajouter quatre autour de cette étude. Pleine rondeur à elle. C' est une capacité de seigneur pour tout ça. Ok, donc maintenant il est beau, et puis on va le dupliquer et utiliser notre autre couleur orange pour notre, euh, Google Google. Ok, donc nous avons dans la cullerie zéro orteil 70 et 85. Alors, comment vous pouvez obtenir ces couleurs ? Vous pouvez obtenir les sculpteurs en ligne. Vous pouvez les choisir en couleur. Vous pouvez en choisir une couleur en utilisant certains des outils que j'ai. Je te montrerai bientôt un jour. Ok, donc on a ces deux boutons, et ensuite on a besoin d'un texto. Nous vous abonnons juste avec email. D' accord. Alors déplacons-les un peu vers le haut. Oui. Donc, comme ça, alors nous allons aussi le déplacer vers le haut parce que nous avons moins de base en bas et nous allons dupliquer cela. C' est notre lien. Donc, nous allons utiliser l'inscription, humain, quelque chose comme ça au milieu, aussi petit au milieu. Ok, alors assurez-vous qu'ils sont séparés pour qu'ils puissent être facilement capables. Ok, donc maintenant je vois beaucoup moins d'espace ici. Donc je vais changer ces Albert, donc il y a plus de place pour ça. Orteil refoulé. D' accord. D' accord. Donc, nous avons tout tracé. Apportons nos icônes SPG des icônes de la fondation. Je vais ouvrir. Cette ressource est asserts et icônes SPD. En fait, je garde ces icônes. Je les ai choisis dans les icônes de la fondation et, ah, vous pouvez avoir moins de temps, vous savez, les chercher. OK, donc je vais les enlever tous les deux. Il suffit de les traîner dans le remorquage. J' ai l'air tellement, mais c'est comme ça et l'a traîné ici. Ok, maintenant vous pouvez voir que nous avons acheté des icônes ici. Allons les déplacer ici, dans cette zone. Ensuite, passez au panneau des calques, et ce que je vais faire est correct, donc je vais les déplacer à la pointe de la position réelle. Et Jane la couleur de remplissage le blanc pour celui-ci, aussi. Je vais les rendre plus petits. Faisons 48 par 40. C' est verrouillons ça. Essayons. 36. 36 est trop petit, je pense que pour le il avait l'air bien. Ensuite, faites-le au milieu comme ça. Je pense qu'ils ont l'air bien. Maintenant, nous allons ajouter du texte ici. Déplaçons ce texte et amenons-le à l'avant. Ok, donc on va changer la couleur du blanc tout ce qu'on peut utiliser quelque chose comme ça. Sélectionnez ceci et sélectionnez ce blanc et nous allons changer orteil. Connectez-vous va l'aligner au milieu de celui-ci plus près de cette connexion avec Facebook, va le dupliquer à nouveau et se connecter avec Google. Maintenant, vous pouvez voir que ces achetés sur eux sont alignés à gauche avec leur texte. OK, alors n'essayez pas de les décaler ou de le déplacer au milieu par ici. Ok, maintenant tout a l'air à l'école. Nous allons ajouter un style de personnage de plus, qui est nos liens texte. Droit ? Cliquez sur et ajoutez le style Correcteur. Ok, donc c'est nos liens texte de test. Il s'agit d'un texte sur un fond sombre. C' est sur fond clair. C' est notre cap. Ou vous pouvez également utiliser celui-ci. Aussi utilisé Roberto pour cela si vous voulez. Oh, et ça aurait l'air cool, Tok. Nous en avons donc terminé avec cet exercice. Nous avons créé peu de symboles comme celui-ci sur ce fardeau et ceci. Ah, quelques autres styles, styles de personnages. J' espère que vous avez apprécié cette leçon. Si vous avez besoin de plus d'aide ou si vous voulez poser des questions, vous pouvez me poser à tout moment. Passons à la leçon suivante. 45. Design d'un écran activé: D' accord. Non, dans ce Écoutez, on va concevoir ça. Ah, des sabots et des écrans que vous pouvez voir ici. C' est notre Logan Skin ont été conçus dans la leçon précédente. Et je pense qu'on a oublié d'ajouter ça , comme pour montrer le mot de passe. Et maintenant, nous allons concevoir cet écrande Passmore activé de . Déplaçons ça. Déplacons-nous ailleurs comme ça et déplacons le chardon ici pour que ça donne plus de sens. Aucune inscription n'est de l'autre côté. Maintenant, nous avons trois écrans d'ouverture de session. L' un est cet écran d'ouverture de session de bienvenue. Ensuite, cela est activé une fois que vous essayez de soumettre votre mot de passe et e-mail et c'est pendant que vous essayez d'ajouter essaid'écrire quelque chose. Ok, donc une fois que tu as cliqué sur ce calque. Donc, c'est notre champ de texte Quand quelqu'un essaie d'entrer quelque chose ici, il va aller aux pieds, obtenir une bordure bleue en bas, et cette icône d'œil va devenir bleue. Ok, donc en ce moment nous activons deux choses ce champ et aussi ce bouton Ah, Ok, donc ça va être un fardeau. Ce sera passionnant domaine que je vais vous montrer quand nous commencerons à créer un prototype pour cela. Très bien. D' accord. J' ai eu beaucoup de problèmes à créer des prototypes parce que nous avons besoin d'un fond complet sur les cheveux pour lier orteil un prototype. Donc toute cette zone est capable, non ? Non seulement celui-ci est un pas en avant. Ok, alors commençons. Et ah, nous allons créer ces deux écrans là-bas. Presque similaire. Juste un peu de différence. Donc nous allons commencer avec celui-ci. Ok, donc on va emprunter ça à notre réveiller à Apple et commençons. D' accord. Maintenant, tout simplement ce que je vais faire, c'est que je vais dupliquer l'écran, et nous allons le répliquer comme ça et les alertes qui l'alignent sur celui-ci. Ok, donc maintenant c'est une ligne. Maintenant, nous sommes à l'intérieur de cet écran et nous ne changerons rien ici. Alors ajoutons d'abord ce II disparu. Donc, je vais aller orteil mon dossier d'actifs icône SVG. C' est mon icône traînée dans notre adobe X'd ce fichier et oops traîné ailleurs parce qu'il va orteil. Cliquez-la dans ce conteneur donc je vais le déposer ici. Je vais la taille des orteils à 32 chênes, 32. Ok, maintenant, je pense que ça a l'air bien. Je vais le faire glisser dans tout ici et nous allons l'école sur le panneau de dentelle et voir si l'œil est dans ce champ de mot de passe ou non. Où est notre mot de passe ? C' est nos passeports, donc je vais nommer un mot de passe. Assurez-vous de nommer vos listes dès maintenant. Je ne les nomme pas parce que je ne veux pas qu'ils orteils comme ça parce que je vais grouper ça et le mot de passe que je t'ai donné quelque chose comme ça. Et c'est je pense que c'est notre champ e-mail. Je suis les factures qui regardent par ici. Ok, donc c'est notre icône sociale, euh, euh, Google. C' est notre navigation. C' est proche. Tout X près, celui-là. C' est quoi ce symbole ? C' est le bouton ? Oui, c'est bon. Alors connectez-vous B, T n Dash, Logan, VT. Et interdit. Je vais l'activer. Ok, donc on a presque tout le nom probablement ici et cette icône de l'œil. On va changer son orteil de couleur. On a donc deux couches à l'intérieur. Alors je vais changer. Ton Sculler fait quelque chose comme ça. Donc il y en a un. Celle-là. Peut-on les combiner ? Je vais combiner ce bateau à des formes. Sélectionnez ces deux formes et Prestes. Ok, donc maintenant on a juste une forme avec une couleur. Donc, il est plus facile pour nous orteil, vous savez, changer la clé de couleur. Notre changement de couleurs orteil celui-ci. Ok, maintenant tu peux voir là. Ça a l'air super. Maintenant, on va aux pieds. Créez un autre écran à partir de cela. Ok, donc nous avons un autre écran, et maintenant nous avons besoin de notre clavier ou ici, ce que nous allons obtenir de notre et de ça. Désolé, celui-là. X evers, le clavier. Ok, alors nous avons le clavier. Prochain grad, Ce clavier et le contrôle. Voir ou commande. Tu vois ? Et je vais aux orteils. Fermons celui-là. Ok, donc j'ai été battu. Notre esprit a été conçu comme ça. Ok, donc vous pouvez voir maintenant que ça a l'air vraiment cool. Nous allons changer l'email pour mon email. Ok, donc ça a l'air super. Le mot de passe va être, euh, statique comme ça. Suivant. Bougez-le un peu. Désolé. Maintenant, nous avons besoin de détacher les orteils. Celle-ci du symbole. Ok, donc je vais les orteils, le détacher du symbole et nous allons le déplacer dehors. Le symbole. Donc un symbole de groupe. Ok, donc on a sous le symbole. Je vais le déplacer un peu au milieu. Comme ça. Ok, maintenant on a tout. Maintenant, on va aux pieds. Nous pouvons les regrouper si vous voulez, mais je pense qu'ils sont déjà là. Donc je vais laisser ça comme ça parce qu'on n'utilisera pas cette sensation de passeport. Nous avons juste besoin d'un symbole génétique, qui est notre champ de texte que nous avons ici. Laisse-moi te montrer. Nous avons un champ de texte. C' est ce que nous n'avons pas vraiment besoin d'un champ spécifique encore et encore. Donc ça va être comme ça. Ok, donc c'est un état. Donc, si quelqu'un essaie de cliquer sur celui-ci dans cette zone pour voir son mot de passe, ça va être comme ça. Alors bonjour, World on. Ok, donc je vais à Mon mot de passe est un groupe unique. Ok, donc ça a l'air bien, et je vais changer la couleur de remplissage orteil une autre couleur, qui est magasin voir Oncle A Voyons ce que waas cette couleur C zéro e six. Ok, donc je vais l'ajouter maintenant. Donc je n'oublie pas cette couleur. Ok, donc ceci est ajouté à celui-ci et de ce que je vais faire est dans la boutique photo. Il est plus facile de clipser Ah ah, un autre calque dans un autre calque, ce qui n'est pas plus facile ou ici parce que je veux des formes Toby découpé. Donc ce que je vais faire, c'est que je vais orteil est apparu et autre rectangle ici. Et il sera quatre de haut, pas 40% de quatre pixels de haut. Et je vais enlever la couleur de la bordure sera celle-ci. C' est notre état activé et je vais utiliser ces coins arrondis séparés autour de cet arrêt de coin sera zéro en haut à gauche sera zéro. Ce sera zéro orteil. Ah, c' est vrai. En bas à droite, ça va être fait. Et celui-là va bien se passer. Donc maintenant je vais l'aligner sur les orteils et le bas du milieu de ce que vous pouvez voir comme ça et nous devons aussi le déplacer un peu vers le haut comme ça. Donc maintenant je pense que c'est mieux si vous ne réduisez pas la taille, vous pouvez réduire. Mais je pense que ça a l'air bien. Ok, donc on en a un directement activé où quelqu'un essaie de taper dans ce champ, et il va changer les orteils sous échange de couleur de celui-ci. Donc ça va être un peu plus sombre, et notre sentiment est en ce moment de l'activité, OK ? Non, il y a encore quelques choses que vous pouvez ajouter en ce moment. Nous n'avons pas de couleurs ici, donc je vais ajouter quelques tueurs de plus. Ajouter de la couleur. Ok, donc on a encore quelques couleurs ici. Aussi, nous allons ajouter dans cette couleur cette couleur bleue ici. Ok, donc j'ai fait quelques tueurs. Ajoutons cette couleur orteil. Je vais orteil aéré couleur. Donc c'est un Greg Miller sur. Ensuite, nous avons ceci un noir, gris noir blanc. Et je pense que ce sont toutes les couleurs. On va avoir besoin de tous les savons. Je ne fais que chardon par un mystique. Ok, donc je pense que nous avons fait ces deux écrans et vous pouvez le voir maintenant en utilisant des symboles et dupliquant d'autres tableaux d'art. C' est combien plus facile orteil, vous savez, produire le genre d'écrans facilement. D' accord. Et je pense que vous devriez les renommer. Si vous voulez savoir, je vais les verts séparément. Mais vous devriez les renommer. Vous devriez les regrouper. Et ah, cela vous aidera à créer cela facilement. Étaient tellement comme vous pouvez le voir ici Nous n'avons rien groupe ici, que vous devriez être regroupés dans un bouton. Et Ah, d' accord. Donc ça va avoir moins de gâchis ici comme ça. Regroupez-le sur ce sujet. Ok, donc j'ai celui-là et Facebook. Il est dernièrement à Facebook. Donc, je vais appuyer sur commande de contrôle et sélectionner les deux hors d'eux. Contrôle G. Allez, G. Et voici notre groupe Facebook. Ok, je pense qu'on a laissé ce social. Euh, d'accord. Maintenant, vous pouvez voir que c'est un problème que vous pouvez rencontrer lorsque vous ne les avez pas nommés correctement. Il s'agit d'un livre de visage d'icône. Ok, donc j'essaie normalement d'utiliser le type de cette chose avant ce nom. Donc maintenant, nous pouvons avoir cet aspect, celui-ci et celui-ci contrôlant. Allez, G, G, pour rendre ce visage rayonnant. De même, vous allez combiner tous ces éléments. Ok, donc tu allais organiser tes couches comme ça. J' espère que vous avez apprécié cette leçon. Nous avons créé ces écrans de remorquage plus. De plus, je pense que nous ne changeons aucun titre, mais au milieu. Et nous avons fini de concevoir les écrans. J' espère que vous avez apprécié cette leçon. Si vous avez des questions à me poser, passons à la leçon suivante où nous allons créer un écran d'inscription. 46. Conception d'écran dans XD: maintenant dans ce. Écoutez, nous allons créer et vous inscrire par email et vous dire que cela va provenir de la peau. Ok, donc l'utilisateur va tot klik celui-ci ou taper celui-ci et il va déplacer orteil l' écran d'inscription ici. Ok, maintenant, sur le panneau de l'écran, peut-être qu'il veut revenir en arrière et ne veut pas s'inscrire. Peut-être qu'il l'a passé avec le mystique. Donc, vous devez avoir quelque chose par ici sur le bout du haut. Revenez à l'écran d'ouverture de session. Ok, donc maintenant ce que je vais faire, c'est que je vais copier cet écran. Ok, donc je vais zoomer, et je vais déplacer l'écran ou ici. D' accord. Donc je vais le nommer, m' inscrire à l'écran, parce que je pense qu'il vaut mieux nommer celui-ci parce que je n'ai pas produit de nom. Eso Nous avons besoin de ce bouton en bas. Peut-être que ce texte sur lequel nous n'avons pas besoin de celui-ci. On n'a pas besoin de celui-là. Ok, donc aussi, on n'a pas besoin de celui-là. Ok, donc on a besoin de lui pour s'inscrire. C' est un médecin. Peut-être qu'il avait un numéro de décision médicale. Je pense que nous allons utiliser ça ici dans l'air d'origine, mais je pense que je n'ai rien utilisé comme ça. Nous allons donc nous étendre à quatre domaines en ce moment. Email, mot de passe, et Ah, deux autres. Déplaçons ça. Remorque le fond comme ça. Et commençons par la duplication, celle-ci va juste Toby DoubleClick. DoubleClick va être votre nom. Et nous allons commencer avec le numéro de poste Dr Medical parce que je pense que c'est une nécessité pour cette application. Hum, ok, donc on va se mettre à bout, on le limite à quatre champs de ferme. Je pense que c'est une nécessité. Donc, il va enregistrer tous vos détails en fonction de ce numéro de position. Ok, alors maintenant, bougeons ça un peu en bas. En ce moment, celui-ci est à 13 h 48, celui-là est celui pour 34. Alors, je vais aux pieds. Laisse tomber, orteil. D' accord. Et si on essayait de tout sélectionner ici ? Il a gagné 40 ans. Oups. Utilisons celui-là. Distribuer verticalement et il va orteil distribuer tout verticalement comme ça. Déplaçons tout un peu plus vers le bas. Peut-être par ici. D' accord. et je vais le déplacer un peu vers le bas. Membre. Euh, alors tu dois rester longtemps ici. Ok, peut-être qu'on peut le séparer en deux lignes parce qu'ici nous avons cette image n'est pas vraiment belle . Je vais orteil ligne centre ce texte et également aligné cela au milieu. Donc, pour cela, je vais utiliser la couleur Celui-ci déjà un membre se connecte ici. Ok, donc ça a du sens. Maintenant aussi, nous allons ajouter une ligne ici, qui va être comme celui-ci Morsi Il est préférable d'utiliser Réutiliser vos éléments et c' est quelque chose par ici. Je vais l'utiliser. Ok, alors déplaçons ce bouton un peu vers le bas. 24 porcs maux et nous devons changer le texte à ce compte. D' accord. Et nous allons à la ligne centrale. Ok, donc avant d'aller aux pieds Kamanzi, je vais faire pas en arrière parce que je dois m'assurer qu'ils sont la ligne centrale. Sinon, ça va bouger les choses ici et là. Ok, donc la ligne centrale. Et maintenant, si j'essaie d'utiliser quelque chose effacé compte, il restera au centre. Vous pouvez voir maintenant qu'il est au centre. Je n'ai pas besoin d'aligner quoi que ce soit, alors assurez-vous que lorsque vous créez un bouton et que vous envoyez des textos au milieu, il est aligné au centre. D' accord. Je pense que nous avons créé cela. Je n'ai pas besoin de ce genre ici. Peut-être, hum, je pense qu'on va montrer le mot de passe. Peu importe ce qu'il écrit, on va le montrer. Peut-être qu'on en a besoin. Ou ici. D' accord. Donc peut-être l'utilisateur veut voir son passeport Erhardt mot de passe en tapant. On va le montrer ou frapper. Donc, non, nous avons besoin d'une navigation arrière ce premier écran précédent qui manque ici. Et pour cela, nous allons aller à notre bibliothèque, et nous allons zoomer un peu et nous allons voir où est la navigation ? OK, donc nous en avons besoin cette année. C' est la navigation à gauche et ce dont nous avons besoin est celui-ci un accessoire gauche ? Oui, je vais aux pieds. Copiez ceci. Maintenant, vous pouvez voir que j'ai sélectionné ce contrôle de RNC, et je vais revenir à mon écran et je vais le baser ici. Quelque chose comme ça. Ok, donc maintenant vous pouvez voir qu'on peut retourner à l'écran de connexion des orteils. Et maintenant, nous devons changer la couleur pour autre chose parce que nous avons quelque chose. Et donc nous sommes là. Et je pense que peut-être nous pouvons aller à d'autres couleurs, qui est une couleur bleue un peu plus nette, comme celui-ci, Que Aussi pour celui-ci. Je vais utiliser ça parce qu'on doit le séparer de celui-ci. Ok, peut-être qu'on peut utiliser ce O r. celui-ci. Celui-ci a aussi l'air bien. Ça n'a pas d'importance. Okay , donc maintenant je pense que notre écran est terminé et qu'il cherche créer. Je pense tout. Tout ce que six a fait que ça devrait être. Et nous venons de trouver quatre champs pour créer ce processus d'inscription facile. Ceci est vraiment nécessaire dans l'expérience utilisateur hors de n'importe quelle application. Passons à la création de nouveaux écrans dans la leçon suivante. 47. Conception de tableau Partie 1: Ok, maintenant dans cette écoute, nous allons créer ce tableau de bord génial. Et pour ça avant ça, on va aller aux pieds, voir les changements de couleur. Donc ce que j'ai fait, c'est que je te montre avant que cette guerre ne l'ait eue. Vous partez à 11 ou deux. Alors je suppose que maintenant j'ai changé à 218. Maintenant, il est dans un peu d'ombre violacée. Maintenant, pourquoi je l'ai fait parce que notre décoloré cette couleur est dans la teinte de 20. Ok, donc si vous utilisez deux couleurs, je ne veux pas que vous en ayez trop. La différence entre le qui un ou deux points est bonne, mais plus que cela aura l'air des couleurs totalement différentes. D' accord. Aussi, je voulais être séparé de cette couleur bleue Facebook. Donc, il est un peu hors de couleur bleu violacé. Si vous voulez changer plus comme peut-être ajouter plus de saturation, plus collaborer, vous pouvez l'ajouter. Vous pouvez voir à quel point ça ressemble à ces deux tueurs. Ok, donc c'est notre principale interaction ici. Ok, maintenant nous allons commencer à concevoir celui-ci, donc nous allons passer à notre autre tableau d'art où nous concevons. Alors commençons. Vous savez, nous sommes à l'écran, et je pense que nous allons commencer avec celui-ci, donc je vais le dupliquer comme ça. Ok, donc je vais l'aligner ensuite. Snam it tableau de bord. Ok, donc ce qu'il nous faut ici sur tout ce qu'on va supprimer ? Ok, donc je vais le nommer tableau de bord Toe, et on va l'aligner au milieu comme ça. Voyons voir. Qu' est-ce que le 64 ? 64 ? Ok, c'est parfait. Non, nous allons le nommer si bienvenu. Ok, donc je vais les orteils, le déplace vers le bas, et on va créer une ellipse prenant un tabouret Ellipse. Ok, donc c'est loin d'avoir l'Abadan hors du médecin. On est là. Déplaçons la frontière tout de suite. Nous allons utiliser essentiellement la bordure blanche avec quatre saoudiens quatre épaisseurs. Ok, maintenant on va faire glisser l'image ici. Ok, donc c'est l'image de son médecin. Mettons-le à l'intérieur ici. Et ça a l'air génial en ce moment. De plus, nous allons changer la couleur pour le Stark Black pour ce message de bienvenue. Suivant Rapprochez-le de plus en plus. Toe cette image de médecin une clé. Ok, donc c'est fait. Essayons d'utiliser cette zone inférieure et de créer la barre de navigation. Est-ce que la barre d'outils est ici ? Ok, ça s'appelle Gold Bar dans le design américain. Et en fait d'accord. Maintenant, laissez-moi vous montrer que la taille de ça. Ah, tableau de bord. Désolé. C' est la planche d'art de 375. Donc, si nous le divisons par trois, permettez-moi de le diviser par 33 75 divisé par trois. Donc, il est 25 Ok, donc nous allons créer. Désolé. Donc ce que nous allons être, c'est que nous allons regarder trois boîtes de 25 verdict, et ils vont agir comme une barre de navigation de bouteille entière. Ok, Ok. Avant ça, je vais aller dans mon dossier de sexe A, et je vais chercher cette pomme. Je nous et nous allons utiliser les mêmes spécifications de conception pour barre d'outils ou la hauteur et sur la taille du pont, qui Apple a. Ok, donc ce sont leurs spécifications. Voyons voir, est une barre d'outils. D' accord. Donc d'accord, Donc il y a deux exemples que vous pouvez utiliser l'un est celui-ci. Et l'autre, c'est celui-là. Ok, donc fondamentalement, nous avons besoin de quelque chose comme ça avec des titres, donc je vais copier le contrôle de commande C et je vais payer resté loin. Donc je vais le coller au fond, et nous allons le changer pour nos couleurs où nous allons aller orteils colorés bleu et violet. Alors faisons ça. Ok, maintenant vous pouvez voir par ici. C' est le bar de notre père. Et c'est cache-cache, c'est 49. C' est la principale chose que nous voulions copier. Ou aussi, si vous regardez cette taille de texte, elle est 10. Ok, donc nous allons utiliser des tailles similaires parce que ce sont les normes. Donc, je vais aller aux pieds, enlever ça, d'accord ? Et nous allons utiliser l'enchevêtrement sec, l'orteil outil, créer un rectangle, et nous allons dimensionner. Il a gagné 25. Donc je ne sais pas pourquoi cette opacité s'avère. Ok, 25 et 49 sera sa hauteur. Nous allons supprimer la bordure et exprimer V et film prendre le bas et nous allons le dupliquer sans clé d'option. Donc, un et ok, alors nous allons avoir un espacement horizontal de distribution. Et c'est ainsi que nous allons créer notre bar. Nous allons zoomer et vous pouvez voir qu'il y a juste un peu de problème ou ici si je zoome un peu plus. Ok, donc maintenant il a disparu. Mais si on fait un zoom arrière, il y a une ligne entre ces remorques. Ne vous inquiétez pas pour ça. Ce n'est que la représentation. n'y a pas vraiment. OK, donc nous allons utiliser la couleur pour celle-ci, qui est active. Et ça va être, je suppose, ce 11 91 90 sur 90. D' accord. Et puis pour ces deux-là, qui sont inactifs, nous allons utiliser la couleur, qui va être notre nouvelle couleur. C' est 220 et 65 40% de justesse, parce que ce sera une grande couleur terne. Alors, je vais aux orteils. Désolé. Je vais l'ajouter ici si on la veut. Si tu veux. Retirez un peu de couleur, faites-le glisser comme ça et il va être supprimé. Ok, donc la même couleur pour celle-là. Ok, donc maintenant nous avons notre bar ici. Ils ont des poignets, et nous avons besoin d'icônes. Et Dexter ici. Donc, pour le texte, je vais utiliser cet outil de texte, et nous allons écrire dans l'outil de texte saoudien. Allons Taipower, heu, premières fonctions Acti de Dec, et je vais sectionner les orteils, alors, ok, comme ça. Et je vais utiliser la couleur du blanc. Ok, donc c'est un coffre-fort. Toi, un texto. D' accord. Tout est regard, chanter semble bien. Droit ? Cliquez sur et ajoutez au style de crypto. Ok, donc nous avons ces petits ponts ici, et nous avons besoin de notre icône ici. D' accord ? Avant cela, nous allons les aligner au milieu en sélectionnant Shift et en sélectionnant les deux. OK, alors cliquez sur ceux qui décalent et sélectionnez l'autre, et je vais l'aligner sur les orteils. La majorité est déjà au milieu. Ok, maintenant je vais le dupliquer, et je vais l'aligner au milieu d'un ici, et voici notre évier, Deb. Ok, donc on a encore ça au milieu. C' est notre maison, Dabord, tableau de bord. Nous pouvons aussi l'appeler je pense tableau de bord plutôt que la maison. Donc, cette fois, je vais avec le tableau de bord plutôt que la maison. Ok, alors déplacons-le au milieu. Ok, donc le texte est mis en place. Non, nous devons apporter nos icônes. Ou ici. Donc, pour cela, nous avons déjà plus d'icônes dans le dossier, que j'ai déjà sélectionné pour U. S icônes occupées. Vous pouvez utiliser n'importe quel SPD que je peux vous aimer. Sauf pour vous. L' un est cette maison. Je dois l'amener ici. D' accord. Donc juste copié dehors, et je vais le remplir avec de la couleur blanche. Et je vais réduire sa taille à 32 verre City. Utilisez-le pour dire vidéo suivante parle taille deux 32. Ok, c'est toujours grand, donc je vais y aller avec 24. Ok, donc ça a l'air sympa. 24 taille, et je pense toujours qu'il est un peu plus grand. Alors quoi ? Je le croyais. Je vais réduire cette hauteur à 24 comme ça. Nous allons zoomer et voir si cette icône a l'air bien ou n'a pas l'air grande, donc elle semble un peu plus grande pour moi maintenant. Je vais déplacer ça à 20 voir à quoi ça ressemble. Ok, donc 20 ont l'air marqué. Déplaçons cela vers le bas et déplacez-le un peu vers le bas. Donc maintenant, il a l'air superbe. Uh, déplacons-le au milieu de celui-là. Ok, donc c'est notre maison ou tableau de bord ou quelque chose comme ça. Ensuite, nous avons ces activités ici. Nous allons utiliser une autre icône, qui est une icône de page multiple, je pensais qu'elle correspond à cette catégorie où nous allons effectuer beaucoup de choses différentes . Ok, maintenant vous pouvez voir qu'il a plusieurs formes. Donc ce qu'on va faire, c'est de combiner tous ces vaisseaux en un seul, donc je vais les ajouter. Donc maintenant, vous pouvez voir qu'il est une fois la forme, et nous pouvons juste sélectionner la couleur et la changer une fois, et c'est tout. Ok, donc je vais le déplacer à l'intérieur ici, et changeons sa taille orteil 20. Je ne pouvais pas comment tu allais ? Tu vois, c'est presque la même chose. Assurez-vous que vos distances de haut et de bas sont les mêmes pour vos icônes et votre extriction. Donc ce texte est que si vous appuyez sur impair, il est à quatre pixels du bas, donc je vais faire ce seul orteil. Sept cochons. Arbre frontal. D' accord. Aussi, je vais aux images sonores de sept porcs. Parfait. Ok, maintenant, on a besoin d'un évier. Je suis allé ici et je vais ajouter un truc. Je maïs, qui waas cette boucle. Je suppose maintenant que vous pouvez voir que toutes ces couleurs sont très lumineuses et très nettes ou ont beaucoup de saturation. Alors pourquoi les couleurs semblent bien ? Ok, donc tu dois t'en assurer. Peut-être qu'il ne semble pas bon parfois sur votre schéma de peau de couleur afin que vous puissiez passer au noir ou quelque chose comme ça. Une autre couleur de votre choix. Ok, donc c'est notre onglet sont terminés. D' accord. Pour que vous puissiez voir ou entendre. C' est notre onglet sont maintenant. Je pense qu'on devrait le regrouper pour qu'on puisse facilement l'utiliser comme ça. Org. Ok, donc je m'assure juste qu'il n'est pas groupé avec nos antécédents. C' est donc notre groupe. Allons, Collard. Ah, papa, Barre quelque chose comme ça et je deviens inhygiénique. Ok, donc notre tambour est terminé maintenant. 48. Conception de tableau Partie 2: Créons de longs boutons d'or et de journalisation ici. Ok, donc je vais le nommer, déconnectez-vous d'accord. Et je vais aller aux pieds. Déplace-le d'ici, et je vais le déplacer. Un 24 5 Donc peut-être par ici en tapant avec ça. Ok, alors voyons. Quelle est la distance ? Huit pixels. Ok, donc c'est bien. Ok, maintenant, par ici, nous allons utiliser Ah, effacer cette icône de hamburger Une ligne, et il va être dans cette couleur ou peut-être décolorer. OK, donc je vais utiliser cette couleur, faire pour la taille un direct hors de cette ligne, et je vais utiliser. Peut-être que je vais faire 24 pixels de large. Nous allons le dupliquer. Il y a plusieurs façons de créer Parfois, beaucoup de gens qu'ils ont créés avec cette grille de répétition , et ils le répètent simplement comme ceci. D' accord. Et puis ils sont juste de la taille entre ça comme ça. Quelque chose comme ça. Mais j'ai essayé de l'utiliser autrement. Je viens juste que je n'aime pas parce que j'ai besoin de personnaliser le milieu, donc je vais la taille des orteils il 18 pixels, et le dernier vont aussi être 24 picks est comme ça. Donc je vais le croire, d' accord ? Non, nous avons construit notre menu hamburger. Déplaçons ça. Regroupez-les. D' accord. Sélectionnez tous ces éléments. Trois. La gauche Access E. Allez, G. Ok, alors ce que je vais faire, c'est que je vais les combiner en une seule forme, donc je n'ai pas besoin de changer la couleur encore et encore. Donc je vais utiliser ce Brugler parce que c'est le cas. Je pense que c'est la même couleur pour cette déconnexion. Ok, donc je pense que c'est bien. Nous devons vérifier les distances avec les spécifications de la pomme. Donc je vais aller ici et voir quelle est la distance de ces accessoires. Fais les frontières. OK, donc je vais double-cliquer, double-cliquer à nouveau quand nous réfléchissons et voir quelle est la distance. Donc, c'est un citron. Les pixels sont 11 points d'un similaire, celui-ci, Donc je vais voir qu'il est presque je pense 12.6, c'est 11 ou 12. Ok, donc c'est 11 ou 12. Comme penser. OK, donc je vais utiliser 12 maintenant. C' est huit pixels, donc je vais le déplacer ici. 1234 Et aussi ce chef 11 tau. Maintenant, vous pouvez voir que nous avons Nous utilisons les mêmes spécifications, que nous utilisons. Ok, donc vous devez vous assurer que ces distances et tout est conforme à vos spécifications , qu'Apple a là-dedans. Tu le réveilles. Ok, donc on a ça. Donc maintenant, nous allons créer la zone médiane qui est dégagée à un enchevêtrement par ici. Pourquoi ? Réalisateur ? Et je vais enlever la frontière, et je vais avoir des ennuis autour d'elle. Quatre points. Et puis nous allons utiliser un peu hors de l'ombre. Peut-être qu'il suffit de quitter l'abri maintenant, et je vais utiliser Ah, Dexter ici. Donc, nous allons d'abord remplir ceci avec du texte, donc je vais faire le texte de zone, et nous allons commencer, et nous allons aller à nos actifs de cette zone, et je vais utiliser notre avant et tout sur les spécifications. Ok, maintenant nous allons tailler cet orteil 347. Oups. 3 47 Donc, je vais le mettre au milieu, donc j'utilise autant de surface que je peux vivre. J' ai plus 14 photos des deux côtés. Ok, donc vous savez, vous pouvez voir ici que nous avons ce truc et nous allons créer un autre bouton ici, qui va avoir la même hauteur. Ok, comme ça. Et nous allons utiliser un être quatre fixateurs enlever la frontière. La couleur sera 1 91 Mais nous allons le changer pour quelque chose d'autre comme 100 83 clé de luminosité. Donc ça va être plus pointu et un peu terne, comme sombre. OK, maintenant vous pouvez voir que c'est notre bouton interne à l'intérieur de notre application et ah, allons le déplacer un peu au-dessus C'est rendre un peu court. Et je vais utiliser l'ombre autour. OK, donc c'est un bouton. C' est pourquoi nous avons besoin d'une ombre autour. Aussi, si vous allez dans ce contexte, ce fond, mais nous allons le faire, c'est que nous allons le déverrouiller, et nous pouvons changer certaines valeurs comme, euh peut-être nous avons besoin de luminosité. Ah, changeons le montant. Donc je vais faire le sang des orteils plus ici, presque le double d'accord, alors passons à cinq. Et j'y vais encore. Lockett et moi pensons qu'il est préférable d'avoir plus de clarté ici, parce que dans nos autres écrans, nous essayions juste de verrouiller l'utilisateur ou de créer un nouveau Konkey. Soho était là. Je l'ai un peu plus floue. Et maintenant, vous pouvez voir qu'il est plus clair et vous permet un peu de texte ici sur le fardeau. Et nous avons besoin d'icônes sur le côté. Et il y en a un, je pense ici sur l'icône de la flèche et, ah, nous allons au milieu. Donc, cela va être un peu hors du problème, parce que ce texte est aligné Northern Line au milieu, et ce sera au milieu. Donc, on le laisse comme ça. D' accord ? Et nous allons mettre notre flèche large ici, qui est notre Où est notre Aargh ? Aargh ! Aargh ! Est-ce que c'est OK. Donc c'est une flèche, donc je vais l'amener ici comme ça. Donc aussi, je pense que nous devrions arracher une autre ombre un peu plus, peut-être 30% parce qu'il nous faut plus d'ombre autour du fardeau que je vais utiliser ici et je vais utiliser Ford ou ici. Ok, donc 30% avant, et ça va être mes valeurs pour mes boutons, et vous pouvez voir que ça a l'air vraiment sympa. Ok, donc une partie est faite. Nous avons besoin, et je suis allé ici, qui est Link Icône. Ok, donc on n'a pas besoin d'un noir. Laisse venir ici. Ok, donc c'est presque fini. Et maintenant, nous allons passer à la prochaine zone. Est-ce que je pense que tout va bien, donc je vais réduire sa taille un peu plus parce que nous n'avons pas besoin d'aller groupe orteil ce. Margie, c'est un fardeau Bt et des louanges. Et donc je vais le déplacer comme ça, remontant le noir dans celui-ci, l' alignant en haut comme ça. Suivant. Déplacez-le un peu plus vers le haut. Ça n'a pas l'air d'une ligne. Ok, donc nous avons terminé cette zone. On va aller aux pieds. Euh, sélectionnez tout ici. Allez, G. Et ça va être notre tableau de bord. Et oui, OK, donc c'est une idée de tableau de bord, et je vais la dupliquer ici comme ça. Peut-être le monter vers le bas. Mais ça. Ok, maintenant je vais colorer ça en gris sont peut-être plus comme un gris. Et nous avons besoin d'un grand dans le bleu A Okay, donc je vais utiliser ce truc fiscal comme ça. Ok, maintenant tu peux voir à quel point cette couleur a l'air cool, OK ? Alors n'essayez pas d'utiliser une couleur. C' est pour ça que je vais aller aux pieds. Essayez un ou deux tueurs comme ça. Vous pouvez voir qu'il y a une couleur de plus. Mm, par ici. Ok, donc j'ai ajouté des habitués, et je vais les essayer tous. Je pense que celui-là a l'air marqué sont peut-être celle-là. Ok, donc je vais le laisser comme ça, et je vais enlever l'ombre d'ici parce que ce bouton est désactivé. Ok, donc on ne peut pas appuyer sur ça, donc je vais utiliser le texte ici. Ok, donc on doit penser à l'évier, à l' évier, à l' évier. Ok, alors utilisons la même chose. Je suis allé par ici. Celui-ci, et copiez-le et coller IQ étaient ici et se déplacer. Bouge, Lex. Changez votre orteil Sculler à l'endroit où il waas distance de 24 pixels et tout est superbe. Ok, donc, hum, je pense que ça a l'air bien. Donc, ça a l'air génial. Ok, donc tout a l'air super. Nous avons construit notre zone de tableau de bord principal, et dans la leçon suivante, nous allons créer notre zone de diapositives, qui sera la barre de menu latérale lorsque nous avons appuyé sur ce menu hamburger. Donc la zone apparaît, que nous allons concevoir dans la prochaine leçon. Passons donc à la leçon suivante. 49. Conception de navigation de série: Ok, alors commençons et créons ça. Ah, barre latérale géniale. Navigation. OK, maintenant ce que nous allons faire, c'est que nous allons commencer avec notre tableau de bord, et nous allons le répliquer. Appuyez sur toute la touche ou la touche d'option. Et ici, nous avons une copie de la planchette. Non, ce que je vais faire, c'est que ça va être latéral. Donc ce que je vais faire, c'est aller dans toutes les couches et tout, et nous allons tout sélectionner et créer un groupe. Margie, séparons cette 12 et ça va aussi être dans ce groupe. Oui, je vais aux pieds. Nommez-le. Tableau de bord. Ok, donc nous avons notre tableau de bord. Oups. Il y a donc quelque chose qui ne va pas, je crois. Ok, donc je vais le déplacer vers le bas, ce qui était l'arrière-plan. Et maintenant ce que nous allons faire, c'est que nous allons utiliser un autre rectangle dessus et que allons utiliser le fond, sang, la même affaire. Ok, donc ils ont déplacé le flou d'arrière-plan de la frontière, et nous allons utiliser quelque chose comme ça. Six. Oups. Sur la diversité, cela va être six luminosité va être moins cinq. Et l'opacité sera de 15 ans. Quelque chose comme ça. OK, donc cette fois, j'utilise un peu sa couleur plus foncée ici. Vous pouvez également l'utiliser pour moins deux ou quelque chose comme ça. Non, l'opacité. La luminosité moins deux. Ok, donc c'est ce qu'il nous faut au sac. Non, non, nous avons créé le dos. Maintenant, nous allons utiliser et d'autres rectangle sur le dessus, et nous allons aux pieds. Ah, dessinez-le d'ici et allez remplir Presque 2 36 étaient aussi. D' accord. Et je vais faire de la hauteur la même que la frontière. Et nous allons utiliser la couleur, qui est celle-ci pour notre site. Jamais. Et nous allons utiliser un peu d'ombre autour. Donc pour que ça prenne un peu d'accord, donc je vais utiliser l'explication pour ça parce que nous avons besoin de l'ombre Toby en destruction de gauche à droite. Ok, donc l'ombre sera par ici, donc on va l'utiliser. Excusez-le. Zéro sur la position via, et je vais utiliser quatre ici. Ok, alors voyons. Maintenant, vous pouvez voir un peu d'ombre par ici. Un immeuble par ici. Nous devons faire un peu plus de ticks sur la sortie 20%. Et je vais utiliser huit ici pour l'étaler un peu plus. Ok, donc nous avons l'ombre que cet élément est au sommet de celui-ci. Ok, donc aussi, vous pouvez le rendre un peu plus lumineux si vous le voulez, donc l'ombre va être plus claire. Ok, maintenant vous pouvez voir que l'ombre est plus claire dessus. Ensuite, utilisez les mêmes valeurs moins un. Et à propos de celui-là. Ok, donc on a notre côté, mais on est là, et maintenant on va utiliser la même chose. Ah, Aladar. Et je vais être stricte ici. Amenez-le ici. On peut peut-être serrer les orteils 72 par 72 plutôt que de le rendre un peu plus grand. Donc je vais en faire un petit. Et nous allons utiliser un autre Dexter ici, ce qui va être que j'ai fait profil. Maintenant, vous pouvez voir cette couleur est également belle ici parce que c'est la même fille comme cette couleur de fond. Mais maintenant, nous allons introduire un nucléaire, qui va être notre couleur jaune. C' est le 3ème 1 va être Hugh 54 41 situation et 100% hors luminosité. Donc, il est de couleur très vive et jaune vous et vous pouvez voir ici. Ok, donc nous avons plus éditer le profil en haut, et maintenant nous allons utiliser un peu hors de la zone Je voudrais ici comme ça, ok. Et enlevez la bordure. Il va être invité, mais je vais utiliser un peu de l'opacité. Ok, donc je pense que ça devrait être ce ne sera pas le cas. Vijit va être décoloré. Presque. Ok, donc je vais appuyer sur V, et nous allons avoir une icône ici, qui est notre autre icône. Fermons celui-ci et allons dans notre dossier. Propre, sec, Khan. Et je vais le faire glisser dans mon 80 nos cheveux et nous allons voir combien de boîte il a. Il a donc beaucoup de pièces, beaucoup de vaisseaux, donc je vais les combiner. Syndicez-les. Ok, alors assure-toi que ça va avoir la même forme. Ok, alors maintenant on va changer ton Sculler. Dwight, voici l'icône de notre calendrier, et nous allons la dimensionner. 24 correctifs comme ça. Je vais l'aligner au milieu de cela, et nous allons utiliser un peu de texture. On est là, ce qui va être au milieu. Et je vais aller à la pointe de mes atouts, notre guide de style. Et je vais choisir ce texte blanc. Roy. Maintenant, vous pouvez voir qu'il a l'air parfait. Alignons. Retirez-les. J' appuie. décalage au milieu a également aligné celui-ci au milieu. C' est déjà au milieu. Ok, alors maintenant nous avons notre bouton. Tes cheveux allaient utiliser les orteils par ici, ce qui est le cercle X. Donc je vais me mettre à la pointe Dragon ici comme ça. Utilisons-le d'abord à l'extérieur pour que nous puissions combiner ses puces. Ok, donc il y a deux formes que Lex use les change rapidement, donc je vais le changer rapidement. Ensuite, Faire cette taille à 24 qui est très petit parce que je vais orteil tapoter dessus. Mon utilisateur va aux pieds. Tape-le avec les doigts, donc je vais le rendre un peu plus grand. Les sélections de touches utilisent 32. Donc, c'est bien. Aussi, je pense que cela semble plus petit quelque chose pour aller aussi en faire 32. Zoom arrière et voir à quoi cela ressemble. Ça a l'air trop grand ? Oui. Ok, donc je vais utiliser à nouveau 24 qui a l'air bien. Joli. Sélectionnez les deux avec Shift. Donc, chaque fois que vous essayez d'aligner quelque chose, vous devez l'aligner avec quelque chose d'autre. Un autre objet. Vous devez sélectionner les deux en appuyant sur Maj. Ok, donc maintenant ce bateau a sélectionné, donc il va être au milieu. Ok, donc ça a l'air effacé. Pourquoi ? J' ai tout déplacé vers le bas parce que la plupart des interactions qui utilisent font 70 à 80% vont être tumurist maintenant. La meilleure zone pour la direction roulée est celle-ci Vous n'allez pas utiliser vous connaissez la radio supérieure . Aussi, je vais le déplacer un gros haut parce qu'il regarde un peu vers le bas. Ok, donc je vais changer le calendrier et le rectangle de l'année du Brésil. Warren G, ça va être mon menu. Oups, je ne sais pas. Et nous allons cibler et tirer. OK, donc ça a l'air bien. Suivant. Déplacez-le un peu vers le haut. D' accord. Donc je vais le déplacer au milieu de ça, ce qui ne ressemble pas à ça. C' est au milieu. Ok, alors on va bouger ça un peu comme ça. Et aussi celui-ci parce qu'il est trop en bas. Oui. Maintenant, ça a l'air mieux. Et nous avons fini de faire notre barre latérale ici. Et j'espère que vous avez apprécié cette leçon. Si vous avez des questions à me poser, passons à la création des deux autres écrans, qui sont activités et couler. 50. Conception d'écran d'actifs: Ok, maintenant, Incessant. Nous allons créer cet écran d'activités, et ah, nous allons utiliser cette grande fonctionnalité API sur Adobe X. bords Steve que vous pouvez voir ou entendre oncle, Créer ceci est un grand et nous allons le répliquer et utiliser cette grande caractéristique pour concevoir la peau. Ok, donc ça va prendre beaucoup moins de temps parce que la plupart du temps je pense que waas pour la planque parce qu'il a beaucoup d'éléments différents. Et maintenant, on va y aller. Alors commençons. Donc je vais aller à ça et on va reproduire celui-ci. Je vais le dupliquer en bas ici, et nous allons le nommer, en fait,ce en fait, qui est Ne me dérange pas mes orthographes si elles ont tort. Donc c'est le cas. Et maintenant, je vais appuyer. Allez, un est contrôlé. Un orteils omettent l'orteil mon écran, et nous allons supprimer ceci et ceci sur ce sujet. Ok, donc je vais utiliser celui-ci comme évaluation d'évaluation. Non. Donc c'était des activités, des activités, et je vais le déplacer au milieu comme ça et ce convoi avait 64 ans. Donc je vais le déplacer à l'endroit que ça devrait aller. Maintenant, nous avons beaucoup d'espace, et nous allons créer de bonnes répétitions. Mais avant cela, nous allons utiliser autant d'espace que nous, ou ici pour créer ce credo répétitif. Donc je vais laisser presque autant d'espace, et je vais utiliser la couleur ried. Ok, donc et nous allons utiliser huit pixels par ici, si vous voulez. Oh, utilisez plus sauf pour vous. Ok, nuit. Maintenant, je vais l'utiliser, et je vais utiliser un peu d'ombre parce que ça va réprimer l'état capable. Il devrait être capable. Donc, nous allons dire en utilisant des signifiants que cet état est possible et qu'il va être 20% ombre noire. Vous pouvez voir maintenant à quoi il ressemble. Ça ressemble et ressemble à celui-ci. Ok, donc ça a l'air pressé ou possible état. Ensuite, nous allons utiliser un texte attribué, qui sera par ici comme cette évaluation. Et nous allons utiliser notre texte texte noir ici dessus. Déplaçons-le au milieu. Et, ah, nous devons aussi utiliser la même chose pour trop utilisé ici. Donc, je vais la copier et badigeonner cette annonce ici. Changez son orteil de couleur, celui-ci. Et ah, nous pouvons aussi utiliser l'autre couleur, qui était 83. Désolé. Non. 90 et entité. Donc la luminosité réduit la luminosité pour le rendre terne et sombre Whitmore. Donc je vais juste aimer ça et le déplacer ici. Ok, donc toute cette zone sera terrible. Donc nous ne sommes pas inquiets à propos de ces objets, donc je peux me rapprocher de cette , hum, frontière. Ok, donc 10 pixels, donc 10 porcs ont l'air super. Une chose que nous allons créer ici est le statut que le nombre d'évaluateurs que vous avez terminé. Donc, je vais créer une ellipse, enlever la bordure et aller pour la couleur de remplissage à celle-ci. moment, nous allons changer le pied quelque chose comme ça, et nous allons utiliser moins de luminosité 55% ou peut-être moins 50% peut-être plus ou moins. 40 %. Ok, donc ça a l'air bien. Et je vais utiliser un outil de texte pour avoir quelque chose ici comme ça. Ok, donc tu dois t'assurer que si la boîte va aux pieds a, genre, genre, deux valeurs, donc ça a toujours l'air cool. Ok, donc si cette ellipse ne peut pas contenir 22, 21 ou deux chiffres, ça va être un problème avec vous. D' accord. Assurez-vous donc que votre bureau est conçu pour respecter ces limites. D' accord ? Donc, il ne va pas au centre des orteils. Alignez-le dans ce. Faisons 36 choix est et ah, voyons. Maintenant, si elle s'aligne correctement, c'est mieux. Maintenant, vous pouvez le déplacer de haut en bas de votre propre goût comme ça. Donc je vais utiliser, vous savez, quelque chose comme ça. Ok, donc on va utiliser à nouveau la couleur blanche ici, et on va la déplacer un peu vers le bas. Vous avez vu que c'est parfait maintenant, et essayons de regrouper ces choses. Margie, ça va être nos lèvres dirigées ça. D' accord. Et alignons toutes ces trois choses au milieu comme ça. Alors maintenant, ils sont alignés. Regroupez-les pour que nous puissions les aligner sur ce contexte. Ok, maintenant, c'est ce qu'on appelle un alignement parfait. D' accord ? Non, nous avons notre seul objet ici, et nous allons au groupe des orteils. Regroupez-le à nouveau. Donc, ce sera notre article. Je viens jouer c'est. Ne me dérange pas mes orthographes. Je mes doigts ne sont pas sous mon contrôle. Ok, donc maintenant nous allons le répliquer en créant un crit répétitif. Et je vais garder ça un grade B, et je vais le répéter dans cette direction comme ça. Ok, maintenant, encore une chose. Nous avons besoin de plus. Salut. Porte ici. Donc je vais orteil utiliser quelque chose comme 850. Ok, donc ce que je vais faire c'est maintenant que je vais déplacer une grande ville comme ça aussi, ce contexte va être changé. Je vais le déverrouiller, et on va augmenter sa taille. Quelque chose comme ça, quelque chose comme ça. Je vais le déplacer ici pour qu'on ne voie pas son bras ou ici. Donc je vais le déplacer comme ça. Peut-être comme ça. Et aussi je vais réduire le montant, apprendre à trois. Ok, donc nous avons notre expérience et tout. Je vais dupliquer ça un peu plus. Ok, donc jusqu'à. C' est un 12345678 donc j'en ai huit ici. Je vais fixer la distance entre eux, donc je vais aller dans cette zone et essayer de la serrer autant que possible. OK, donc 14 ont l'air marqué. Et je pense que la taille de celui-ci est de 67, ce qui est facilement capable. Donc, si j'ai essayé déjà l'utiliser à 62, vous pouvez voir tout le reste est introduit. Donc, ce sont les groupes de thérapie médicale. Si j'essaie de changer les choses dans le 1er 1, cela va se refléter dans toutes les choses. Alors maintenant, je vais réduire la taille à 10. Et maintenant, vous voyez que je peux en avoir un de plus. On est là. Donc ça va être voulu. 3456789 neuf. Ok, maintenant ce que je vais faire, c'est que je vais en avoir, je pense copié ici, ce qui va être mon fichier texte. Et c'est déjà mon dossier fiscal. Prêt. Appréciation. 123456789 10 11. C' est du citron. Et ce sont 1234569 Ok, donc je vais les retirer d'ici, ok ? Laissez-les comme ça et voyez ce qui va se passer. Ok, donc je vais sélectionner ceci, puis cette évaluation, et je vais faire glisser mon fichier texte. Oh, sur elle. Ok, c'est le dossier. Je vais utiliser ce fichier ici et le déposer ici. D' accord. Ainsi, vous pouvez voir maintenant tout le texte a été modifié. Auto. Médicalement. Ok, donc c'est créer. Vous pouvez voir que c'est comme ça que je l'aime. Si vous voulez modifier certaines de ces valeurs, vous pouvez également créer un fichier. Ou vous pouvez utiliser juste une valeur aléatoire comme celle-ci. Ou peut-être 05 ici. La cloche à collectionner, double-cliquez pour entrer et plus de détails. Et vous pouvez également appuyer sur le contrôle ou l'orteil de commande Aller directement à cela. Ok, Donc si vous relâchez cela, cela va sélectionner le grand ensemble, puis double-cliquez pour sélectionner ceci un ce groupe, puis ce groupe. Si vous voulez éviter tout cela, vous pouvez appuyer sur commande, contrôle ou commande, et juste aller ici comme ceci et double-cliquer et sélectionner celui-ci. Donc, je vais aussi à Jane, certains hors des valeurs ici juste pour m'assurer que ça a l'air aléatoire et bon. D' accord. Aussi, je pense que cette couleur de couleurs est un peu différente de ma couleur conçue. Donc je vais aller avec autre chose comme ça. Ok, Maintenant, il regarde plus près de ce que j'ai réellement conçu et utilisé. Ok, Donc vous pouvez voir ici nous avons utilisé plusieurs fois orteil créer instantanément ceci, et ah, c'est tout ce que je pense pour cette fenêtre d'activités. Et une chose que nous devons faire ici, c'est que nous allons activer celui-ci, et nous allons désactiver celui-ci, donc je suis juste qu'on va changer les orteils. La couleur commence. Ok, donc nous en avons fini avec l'écran, et j'espère que vous avez apprécié cette leçon. C' est le grade de répétition de mise hors tension. Et passons à la leçon suivante où nous allons personnaliser cela pour être bon et créer notre évier 51. Conception d'écran Sync: Ok, maintenant dans cette écoute, nous allons créer ce lavabo à l'écran du nuage, et je suis heureux que nous atteignions la fin de ce processus de conception parce que ces longues vidéos avec ma voix d'embarquement pourraient, vous Tu sais, te faire aller dormir. Ok, alors ne va pas dormir. Nous allons utiliser la conception de cet écran, et nous allons utiliser le même écran que celui-ci. activité est un, et nous allons orteil réduire cette répétition bien et créer un bouton et l'état de l'évier ici . Ok, donc c'est tout. Commençons avec ça. Et je vais fermer celui-ci, et nous allons revenir à notre peau de design, que nous utilisions moins dupliquer ces activités et faire passer l'écran. Ok, donc je vais changer leur évier, nuage d' orteils, et je vais les orteils faire au milieu. Alors maintenant, je vais y aller. Utilisez cette même note de répétition et le rendre plus petit, et , ah, nous allons utiliser l'orteil du fichier texte, obtenir tout ici, ce texte quatre ou ici. Alors on va chier ce fichier texte. Donc c'est notre écran de texte. Vous pouvez voir intérêt à télécharger intéressé. Télécharger signifie télécharger un prospect depuis le cloud. OK, donc je vais faire glisser ce fichier ici. Ok, donc nous avons cette taxe sur les lavabos. Avant cela, je vais sélectionner celui que je vais changer. Donc celui-ci et moi allons déposer ce dossier là-dessus. Leah. Alors, Jack. D' accord. Donc, vous pouvez voir notre texte est déjà fait. Ok, donc maintenant ce qu'on va faire, c'est un peu de repos. Ceux-ci sont désactivés, nous avons donc besoin d'une couleur désactivée ou un peu de création. Un peu de savon pour les cheveux. Donc on va faire un groupe de ce grade, et je vais te changer de couleur ici. Comme celui-là. Je vais le changer, orteil cette couleur et aussi celui-ci. Je vais le changer pour cette couleur, qui est un gros grisâtre. Ok, donc 00 ou juste dire, zéro au milieu d'un 00 me semble un peu dur. Ok, donc il n'y a pas de téléchargement d'orteils d'intérêt, et puis aussi, je vais enlever l'ombre de lui. Donc, il n'est pas capable de seins. Tout cela est possible, donc je vais juste désactiver celui-ci. Ok, donc si vous voulez désactiver autre chose, vous pouvez faire la même grâce. Donc, votre style est vos couleurs doivent vous assurer que l'utilisateur que ce n'est pas capable. Cela ne permet pas de cliquer. Ok, donc c'est ah, bit off afford extrémités et signifie concert, que j'ai discuté dans mon expérience utilisateur pour les scores bigness. Et j'espère que si tu conduis si tu ne l'as pas vu, tu devrais le prendre. Et puis nous allons aussi la couleur des orteils ce remorquage cette couleur mise en évidence et cela va être dans le noir. Couleur bleutée. Ok, donc c'est fait. Maintenant, nous allons créer notre meilleure connaissance ici. Aussi. Il faut que les orteils remontent ici parce qu'on n'a pas besoin d'orteils. Fais-le 667 Ok, désolé. 667 Devrait être les groupes de hauteur. Ce qui se passe pour refléter cela et nous allons utiliser 667 qui est un écran de rapport par défaut pour ce prochain film ap six il en bas. Ok, donc nous avons notre écran de retour, et maintenant nous allons utiliser un bouton ici et ah, créons un bouton. Ou peut-être qu'on peut avoir ce bouton de tous ici. Ok, donc c'est notre évaluation de bouton, et je vais être mystique avec ici, et je pense que c'est un peu plus grand, alors peut-être qu'on peut le rendre plus petit un peu. Voir Korpi. Ou peut-être plus. Voir 100. Ok, donc 300 regards marqués. C' est enlever ça. Oups. Le sport se passe ici. Je veux verrouiller cela parce que je ne veux pas le sélectionner encore et encore. Ok, donc je vais supprimer ça, et nous allons le déplacer au milieu et couler tout. Pas d'orthographe. synchronisation désactivée ne sont pas correctes. Donc je vais les faire corrects. OK, donc nous avons besoin d'une icône ici, qui est la même, celle-ci , et ah, je vais la copier et la coller ici. Ok, donc je vais le faire dans celui-ci, cet orteil décourageant à l'intérieur, le crabe et le traîner ici, et on va le rendre un peu plus grand parce qu'il a l'air très petit ici. Donc, je vais utiliser 24 taille ou cheveux. Alignons ça au milieu comme ça et Ah, oups . Fais-le juste. Oh, d' accord. Maintenant, ça a l'air génial. Pense tout maintenant. Et je pense que notre fardeau est presque fini. Voyons voir à quoi il ressemble de loin. Donc, il a l'air vide séparé d'ici. Donc je vais choisir les orteils comme ça. Ok, je pense que c'était bon, donc on ne s'inquiète pas trop des alignements. Ok, peut-être qu'on peut réduire la taille d'ici. Quelque chose comme ça. Maintenant, il a l'air plus équilibré et nous allons l'aligner au milieu, comme ceci. Ok, donc, euh, juste un statut par ici, qui est notre dernier texte. Et je pense qu'on a besoin d' une zone de texte ici. Changeons la couleur pour que vous puissiez la voir clairement. Et ah, nous allons aux pieds. Pourquoi c'est moins 24 ? Ok, donc je pense que c'est le cahier des charges. Je pense que je dois faire confiance ici, et on sélectionne des soldats extérieurs dans la ligne suivante. Je vais le centre des orteils comme ça. Je pense qu'il doit être plus proche de ce fardeau parce que c'est juste un statut sur ce bouton. Donc, cela a du sens parce que les choses plus proches les uns des autres vont être que je vais être considéré ensemble. Donc ils sont attachés Ok, donc l'écran de chant est fait. J' espère que vous avez apprécié cette leçon. C' était un moyen rapide de le faire avec notre note de répétition. Et si vous voulez répéter notre changé un grand dos. Vous pouvez tous les sélectionner et vous pouvez à nouveau créer un rythme. Créer ici. Et vous pouvez également l'étendre de cette façon. Parce que quoi ? On n'en a pas besoin. Ok, donc c'est tout pour cette leçon. J' espère que vous apprécierez cette leçon. Passons à la leçon suivante où nous allons créer le message de nuage de l'orteil. Donc, quand on a appuyé sur ce bouton, le message s'élève que tout a été coulé. Nous allons donc déplacer les commandes en créant le dernier vert de cette conception sur. Et ne vous ennuyez pas ou ne vous endormez pas. Ok, donc bientôt dans la prochaine leçon. 52. Mise à jour de l'état de synchronie: D' accord. Maintenant, dans cette leçon, c'est la dernière leçon de nos villes design. Et c'est notre écran qui allait orteils couler nuage d'orteils. Quand quelqu'un est pressé, laisse-moi te montrer. Lorsque nous avons appuyé sur ce bouton, il va afficher cet écran et tout sera synchronisé, et il donnera le statut. Donc, c'est ce qu'on appelle les commentaires dans l'expérience utilisateur Design sont la conception de la facilité d'utilisation. Ok, donc notre application devrait être ah disant que ça a été fait sur ces cheveux. C' est toujours en attente ou quelque chose comme ça. C' est donc le message de rétroaction, et c'est le service de notre système d'exploitation américain. Eso nous allons les orteils l'emprunter à mon usu je conçois enfant. Alors commençons et concevons cet écran maintenant. Okay, Maintenant, on va se contenter de commencer à partir de cet écran et il suffit de le répliquer. Et voici l'écran de lavabo. Ok, donc tout sera coulé. Ok, Donc ce que nous allons faire, c'est que je vais déverrouiller ça, sélectionner tout avec la commande Shift, G control G, et voici notre clé d'écran de lavabo. Et ce que nous allons faire, c'est que nous allons verrouiller ça pour ne pas le sélectionner. Et je vais orteil créer un autre rectangle de couche en haut, lui hors de la bordure fond flou. Et je vais utiliser la valeur pour être cinq luminosité. Toby. Moins orteil. Quelque chose comme ça. La capacité sera de 15%. Ok, maintenant nous allons emprunter le message de notre Rus get et ouvrons l'US Kate. Les vêtements sont votre sketch ici ? Nous avons juste double-cliquer dessus, et il va s'ouvrir, mais pas s'ouvrir. Allez, Tzeitel. Et venez sur un ou contrôlez un. Oups. Laisse-moi voir. Où sont les messages ? Ici, nous avons les messages que vous pouvez voir ici. C' est un message. Donc on va se moquer des orteils. Ce message. Allez voir, ça s'appelle une alerte. Contrôle de commande V. Ok, donc nous avons ce message ici. Ok, donc c'est grand dans une couleur grise. Je le change. Diviser. Je pense que cela doit être possible avec nous design. Donc je vais utiliser le blanc ici, et aussi, je vais utiliser une partie de l'ombre ici. Ok, donc c'est comme ça que j'ai utilisé ce titre. Je ne suis pas sûr que si c'est possible à nos États-Unis, je pense qu'il serait possible de simplement changer la couleur. Tout le reste est pareil. Alors couler. Ah, Et ici nous allons dire ça et ça va être fait. Ok, donc c'est notre écran, et revenons en arrière et le changement est la luminosité de moins Désolé, moins trois. Il est donc plus terne pour que nous puissions voir clairement ce message. Ok, aussi, je vais bouger l'orteil d'ombre d'un côté plus sombre. Ok, donc maintenant ça a l'air mieux. Ok, donc c'est notre écran allumé. Et si vous voulez changer cette couleur, je voudrais la changer pour une belle couleur. Ou peut-être un disque régulier. Ok, donc ça a l'air super. Et j'espère que vous avez apprécié cet écran de conception Cities. C' est la dernière reine. Maintenant, dans la leçon suivante, on va le prototype des orteils. Nous allons le lier, et je vais vous montrer quels sont les problèmes que nous avons normalement rencontrés par les zones de table sur DA. Beaucoup d'autres choses. Ok, donc dans la prochaine leçon, nous allons commencer à le prototyper, et nous allons lier le flux de travail à partir de ces écrans, donc j'espère que vous avez apprécié cette série. Si vous avez des questions à me poser, passons à la section suivante. 53. Utiliser des grilles pour améliorer les conceptions: Maintenant, nous allons en voir un peu hors de la grille. Introduit le designer Rory dans l'ensemble de l'exercice de conception. Je n'ai jamais utilisé aucune sorte de grand est parce que je construisais assez rapidement. Maintenant, je vais aux orteils. Si vous voulez vraiment trouver le design junior dont vous avez besoin crée pour cela. Les notes OK vous aident à aligner et à harmoniser votre conception comme vous pouvez le voir ici Ceci est un grand 12345678 colonnes grand. Et j'ai laissé quelques zones à droite ou à gauche, ce qui est des marges Ici, vous pouvez voir que j'ai laissé 11 points des deux côtés pour être en sécurité et je suis aligner tout Mon journal vous pouvez voir ici est mon menu hamburger logoed tout orteil ces les créatures. Ok, donc ça va faire plus d'harmonie et aussi ça va aider à nous utiliser orteil, vous savez, un large clic sur ou taper sur les zones ville. Il n'est pas accessible, alors assurez-vous d'avoir au moins 11 ou 12 points de marge sur les deux côtés. Donc, une chose est que la deuxième chose est que vous pouvez voir ici vous pouvez également aligner votre ou faire le Everton Heights hors de vos éléments. D' après Toa ceux-ci, ils vont être plus gentils. Comme vous pouvez le voir. Voici mon bouton. Je peux l'aligner sur ça. 123456 six colonnes du milieu ici et aussi toutes. Ils vont donc laisser ces deux colonnes à l'extérieur pour avoir une bonne marge. Laisse-moi créer de l'amusement pour celle-là pour toi. Donc, je vais cliquer sur ceci, qui est notre nom de tableau d'art, et je vais cliquer sur Créer. Et je vais utiliser des colonnes, qui va être ici et ensuite laisser le bien tel qu'il est. 10 pixels. Et ce que je vais faire, ce sont les marges. Je veux des marges similaires des deux côtés. Donc, je vais utiliser 12 pour celui-là. Donc je pense qu'on a utilisé 11. Donc, je suis désolé que je vais utiliser celui-ci, donc je vais utiliser 11 et je pense qu'il y a un problème. Donc, nous allons cliquer sur ce utilisé avant parce que j'ai fait la valeur par défaut ici. D' accord. Et, ah, vous pouvez voir ou entendre. C' est nous allons utiliser 11 pour ici orteil pour voir. Pourquoi est-ce un problème ? Parfois, c'est un calcul. Donc, le calcul n'est pas juste. Nous pourrions donc avoir des problèmes, comme des marges inégales des deux côtés. Vous devez donc vous occuper d'eux plus tard. Donc maintenant, vous pouvez voir qu'il est corrigé. Cela, je vais faire cette valeur par défaut. Et maintenant, vous pouvez voir que c'est la zone que nous utilisons. Et c'est que tu peux voir si je fais un zoom avant. Il y a des secteurs qui sortent comme celui-ci. Donc, je vais l'utiliser comme ça et ça va s'accrocher à ça. Donc maintenant, il est plus correctement aligné à cela. Cette zone Vous pouvez faire la même chose pour celui-ci. Donc, le vert est à 62. Donc je vais faire ça de 1 à 62. Qui a six pour ? Ok, donc vous pouvez voir maintenant qu'on a une taille une carte de notre avidité, et ça a l'air plus naturel. Plus vous pouvez dire plus aligné conception Okay s Oh, c'est génial. Et c'est pourquoi je veux faire pour voir cette nuance de mise en page afin que vous puissiez créer la vôtre. Et ah, tu peux avoir ton design comme ça. Ok, donc tu peux voir si j'y vais. Ça a l'air joli. Il est plus bas dans le coin gauche. Il est dans le coin droit. Et Ah, ce sont mes autres éléments sur ma page. Je ne suis pas en ce moment re les dimensionnement, mais je vraiment vous pouvez dire que je recommande vraiment que vous devriez utiliser une sorte off crée parce qu'ils vont orteils faire votre design look assez OK, donc je suis l'alignement sur ce domaine de ce côté. Ce 3 52 aussi, cela va être 3 52 Alors assurez-vous que vos zones entières ou cette zone de contenu intermédiaire est 3 52 points de large. Donc c'est la taille que j'ai obtenue de ce credo. Ok, donc c'est tout ce que je voulais vous montrer ce bon système et comment nous concevons en utilisant ce grade. Et vous pouvez voir ici si vous allez à cette zone de bouton. Nous utilisons ces six colonnes pour ce bouton également pour ces champs. Il s'agit donc de systèmes de grille. Et si vous voulez vraiment en savoir plus dans un grand système et vertical d'entre eux. Vous devriez voir ma typographie pour les écoles de designers et de développeurs. Si vous avez des questions à me poser, passons à la leçon suivante où je vais discuter du guide de style manquant et de la façon dont nous allons le préparer. Ok, alors passons au guide de création de style. 54. Affiner les guides de style dans XD: Maintenant, nous allons regarder notre guide de style, et nous allons affiner nos couleurs, nos styles de pratique. Nous avons utilisé nos symboles Nous allons utiliser encore et encore. OK, alors commençons. Et nous allons utiliser tous ces écrans pour créer ces couleurs. OK ? Et maintenant, jusqu'à maintenant, nous avons une couleur majeure, qui est celle-ci. C' est mais en double clic et vous pouvez voir ici nous avons échoué. Vous pouvez faire un clic droit. Et vous pouvez, hum ok, donc il est déjà ajouté. Donc, il ne me donne pas l'option d'ajouter la couleur. Donc je vais aller avec celui-ci, donc double-cliquez avec le bouton droit, et vous pouvez voir ici. Ça dit ajouter de la couleur. Maintenant, cette option va venir lorsque vous faites un clic droit sur ce sim sur ce calque. D' accord ? Aussi, vous pouvez en faire un symbole et ah, c'est que nous n'avons pas besoin parce qu'il va apparaître ici une fois, donc nous n'avons pas besoin de faire un simple Ok. Donc, sur Lee, ces éléments réutilisables que nous allons utiliser encore et encore notre répétition dans notre conception qui vont être un symbole est venu alors nous avons ce planches de planches, qui est agonie. Je pense que c'est celle-là. Si je double-clique dessus, il utilise le sens que si l'affichage pro est correct. Et d'une manière ou d'une autre, il dit qu'il n'est pas capable de le trouver dans les fenêtres, mais je pense qu'il va le trouver dans mon Mac. Donc maintenant je vais changer est orteil. Ah, oui. Si vous je vous déconnecte, j'ai affiché. Alors je vais y aller avec toi. J' affiche et ça va changer celui-ci. Ok, donc pour Windows, je vais utiliser celui-ci pour Mac. Vous pouvez utiliser l'affichage SF Prue. D' accord. Cet endroit est essentiellement pour cacher la force, donc nous avons édité. Donc nos tailles de cap sont 32 cette agonie et 34 celle-ci. Donc, nous utilisons comme vous un affichage partout qui est cette taille. Donc, en ce moment, si vous voulez supprimer, vous pouvez à juste titre compléter ou supprimer le style de tracteur d'ici. D' accord ? Donc je le garde juste pour m'assurer que je n'ai pas utilisé ailleurs. D' accord. Ah, OK. Ensuite, ici, vous pouvez voir que nous avons notre couleur de lien, qui est par ici. Vous je texte Ceci est aussi une autre alerte de lien que j'ai essayé d'utiliser. Ce serait créatif. Je peux les réorganiser, mais pour l'instant, je pense que je ne peux pas les réorganiser dans Adobe X'd. Ok, donc soit je peux essayer ce style de lien. C' est un peu bleu clair, qui est, vous savez, plus nette que cette couleur pourpre terne . Ok, donc je l'ai gardé ici. Il y a donc deux styles de liens, celui-ci et celui-ci. Alors peut-être encore une chose. Ce que nous pouvons essayer ici, c'est que nous pouvons changer l'arrière-plan ou ici, donc je vais le déverrouiller. Et si nous rendons ce fond plus lumineux, fond s. Alors laissez-moi vous montrer ce que je veux dire. Donc je vais aller avec le rendre plus lumineux. Donc je vais améliorer la luminosité orteil trois espoirs trois. D' accord. Et maintenant, je vais vouloir cette capacité 200%. Et faisons-le aussi Ah ah, cinq. Ok, maintenant vous pouvez voir l'effet maintenant Mon tout. Mes champs, mes liens. Tout est plus visible. Donc, il est à vous de choisir votre design si vous voulez le rendre plus visible parce que sur la lumière où ces couleurs sombres seront vraiment impressionnantes. Ok, donc c'est juste en effet, ce que je vous ai montré. Vous pouvez voir par ici. Je vais revenir à mes réglages précédents et ah, ok. Donc, contrôlez ou commandez Z pour revenir aux paramètres précédents, nous allons utiliser la même valeur. Je pense avoir moins un. Et le montant waas, je pense, était de trois ou cinq. Excusez cinq pour ne pas passer à nos autres couleurs que vous pouvez voir ou entendre que cette couleur est manquante de notre couleur. La couleur est par ici. Vous pouvez voir parce que c'est une couleur un peu plus foncée et c'est un peu plus net. Autre. Donc, je vais faire un clic droit. Il a déjà été ajouté, sorte que vous ne pouvez voir aucune option pour l'ajouter à nouveau. Donc, je vais orteil DoubleClick, DoubleClick et double-cliquez à nouveau Toe. Passez à celui-ci et séché clic. Vous pouvez voir que cette couleur n'est pas ajoutée, donc nous avons deux tueurs, qui est un ist plus sombre. L' un est une couleur plus nette, plus claire et trois couleurs pour notre texte. Noir foncé et Gree et celui-ci. Ok, je pense qu'on n'a pas ajouté d'avuncular pour ce nom. Alors je vais faire une annonce sur les orteils. Je pense que je devrais l'ajouter comme un style de personnage, parce que si je veux ajouter plus de texte, je vais juste cliquer dessus. Ok, donc c'est notre textile. C' est notre super essai X pour notre lien. Désolé. Notre sens du tour de puissance. Sens que ça va être par ici. Ok, donc c'est presque fini. Passons à d'autres domaines. Ok, donc encore une chose, tu peux aussi en faire un symbole, non ? Cliquez et faites le symbole et il sera ajouté ici, ce que j'ai déjà fait. Vous pouvez voir si je fais défiler ici. J' ai le symbole parce que nous pourrions avoir besoin de l'utiliser encore et encore sur différents écrans. Ok, alors on a ah, cette couleur manquante. Ok, donc je vais faire un clic droit sur les espoirs, non ? Cliquez sur et ajoutez un style de directeur. Donc nous avons ce 17 point Sand dit si pro dext Donc une chose de plus. Je pense que je vais passer avec le s si je te défile. Alors je vais te changer ça ? Je suis sur mes fenêtres. Ok, donc sur votre Mac, vous allez utiliser SF Brutus en jouant au téléphone SF proof. D' accord. Ok, donc c'est bien. Nous avons presque toutes les couleurs ajoutées à nos palais. C' est un presque tous les styles de collection dont nous avons besoin. D' accord. Ah, OK, donc je pense que c'est tout. Peut-être qu'on n'a besoin de rien d'autre. Peut-être celui-là. C' est notre plus petit. Je crois que je l'ai fait. J' ai tout fait ici. C' est 10 points, donc peut-être ces couleurs que je n'ai pas ajoutées. Ok, donc c'est la couleur de ce tabouret ellipse. Et si je fais un clic droit, je peux l'ajouter aux couleurs. C' est une couleur différente. Aussi celui-ci c'est un grade différent est une couleur gris bleuâtre. Ok, donc maintenant vous pouvez voir comment j'ai créé ça. Pourrait-on ces couleurs que j'ai commencé avec une seule décoloration. Ensuite, je continue à ajouter cette deuxième moyenne de rappel était celui-ci et j'ai créé deux nuances hors lui. Ensuite, j'ai ce programme bleuâtre pour les enlever. L' un est sombre, l'autre est clair. Ensuite, j'ai trois variantes différentes de noir et de grâce pour le texte et une vitale. Donc, c'est tout ce dont vous avez besoin pour votre jeu de couleurs ou un grand jeu de couleurs, qui est juste deux couleurs. L' une est la réaction première. Deuxièmement, votre deuxième couleur de réaction ou votre deuxième rappel que vous allez utiliser pour les boutons ou les liens entrés est deux ou trois parts Gree au large de la prochaine, et le quatrième est une autre variation de trois et votre tueur. Ok, donc ça va inventer toute votre application. Donc, c'est tout ce qui concerne ce schéma de couleurs, le style, les gardes et tout. Je pense que nous avons terminé notre guide de style. Je vais enregistrer mon document et c'est tout. J' espère que vous apprécierez cette leçon. Passons à la leçon suivante et à d'autres choses sur Adobe X'd. 55. Lignes de conception IOS: aujourd'hui, nous allons apprendre la partie la plus importante de la conception, c'est-à-dire Ah, vous êtes spécifications et monuments et différents éléments hors conception que vous avez besoin pour répondre lorsque vous concevez tout. J' étais app. Ok, alors commençons. Donc c'est un temporaire que je vais partager avec vous. Je viens de le créer en ce moment. Peut-être dans les 30 dernières 35 minutes, hein ? Donc, ce que je vais vous dire est que différentes tailles de différents éléments de votre conception IOS . Donc, en ce moment, nous concevons pour iPhone 678 ni la version plus sont l'iPhone X. Ok, Donc ces monuments, ils sont presque les mêmes dans toutes les spécifications différentes pour même pour X. Mais la taille est éteinte. Les écrans sont un peu différents. Ok, maintenant, ce qu'on va faire, c'est qu'on va commencer par ça. Ah, en haut par ici. Ok, donc c'est notre état de place au sommet, et ça va faire 20 points de hauteur. Ok, donc vous devez garder que ces monuments à l'esprit que nous concevons c'est l'espace pour 20 points. Ils vont être occupés par ce statut. Bouteillez-le. Ok, la prochaine est notre idée d'action. Ou maintenant barre où vous allez naviguer entre votre application. Il pourrait y avoir des boutons ici. Il s'agit de la version US 11 sur la mise à jour récente dans le système d'exploitation iPhone IOS. Ok, donc il est dans le moment est le même, ce qui est 44 points. Et c'est la taille standard de votre Tom ou de votre doigt dans le port. Ok, donc c'est fondamentalement un concept d'expérience utilisateur, votre tout bouton ou voisin possible ou actionnable ou tout élément que vous voulez que votre utilisateur soit pressé plus appuyez sur, vous devez l'avoir avec la hauteur off au moins 44 points et aussi la vit. Donc, si vous regardez ce titre parent, accord, donc si je vais à cet accès gauche E, vous pouvez voir que c'est la cible atteinte. Donc c'est très grand. Il est de 1 80 vied et 44 en hauteur. Ok, donc tu dois garder toutes ces choses à l'esprit. Aussi, si vous regardez ça, c'est la zone touchée. devrait être ici comme ça. OK, donc vous devez spécifier le mal de tête. Ok, Ok. Aller à l'avant. Maintenant. C' est en fait la pleine hauteur de cette zone de titre ou cette barre d'action Ni avec cette zone de titre est 96 points. Donc tu peux voir ce que j'en pense ? C' est presque 56. Peut-être des points. Je ne suis pas sûr. Peut-être 50 pieds. Eh bien, devine ou tu peux faire ça. Tapis et calcul. Ok, donc ce sont deux monuments. Je vais aller orteil avec le texte et les tailles de différents en-têtes et texte de paragraphe plus tard . En ce moment, je bouge juste avec ces moments, ok ? Pas juste en bas. Si vous regardez ici, nous avons le coup de couteau notre et il a cinq icônes, ce qui est standard. Alors n'augmentez pas plus de cinq. Les icônes sont des zones de tabulation ou ici parce que chacun va être de 75 points. Pourquoi ? Ce qui est assez bon pour votre chute, vous savez, la taille de votre temps Bookie. Maintenant à la hauteur de ce jour, mais est de 49 points. Donc, si vous double-cliquez dessus, vous pouvez voir ici nous avons la hauteur est de 49. Et aussi je pense que nous utilisons la même chose dans notre nous allons utiliser la même hauteur dans notre conception. Ok, donc pour les boutons que vous pouvez voir, c'est le bouton. La norme est la même. Il doit être de 44 points de hauteur minimum et vous pouvez modifier. J' ai en ce moment 1 80 Et aussi vous pouvez voir qu'il doit y avoir une bonne distance entre ces deux sont maintenant nous Creed travaille sur huit porcs Ill, Grand, Grand, que j'ai enseigné dans mon flux de travail hors cours de conception web moderne. Et si vous savez, ne savez pas grand-chose sur l'auxiliaire 8.8, le simple simplement je vais vous montrer que ce sont les multiples hors il est quatre. Donc toutes ces distances que vous pouvez voir, vous entendrez 16.16 points, 16 points. Ceux-ci sont tous aussi sur les multiples de 16 ou huit ou quatre ou peut-être deux. Donc, tout est en nombre pair. Ok, donc ah, 44 c'est le minimum. Vous pouvez également utiliser si vous le souhaitez. Vous pouvez également utiliser 48. Ce n'est pas un très gros problème. Alors ne colle pas que je veux juste que les orteils fassent tous les boutons. Ils doivent avoir 44 de hauteur. Vous pouvez augmenter la hauteur si vous le souhaitez, mais ne l'attirez pas. Ce sera un problème pour l'utilisateur de taper dessus. Ok, donc j'utilise la distance de 16 points entre deux boutons possibles pour que mes utilisateurs ne fassent pas de faux pas . Ok, donc si l'utilisateur essaie de taper ici, il ne manque pas un clic accidentellement sur ce bouton. Donc c'est ça. Ok, donc maintenant je bouge les pieds les tailles de cap. Donc, cette taille, fondamentalement, ce titre principal est de 34 pixels ou 34 points. En gros. Donc c'est le titre principal ou le titre moyen de votre page, et puis nous passons à ce corps de texte. Le corps du texte va être de 17 points. C' est standard. Vous ne pouvez pas essayer d'aller en dessous de cela, car il aura quelques problèmes de lecture sur des appareils plus petits comme iPhone 5. Ok, alors gardez à l'esprit que vous concevez pour tous les différents. J' étais mannequins. 5678 sur. Ne regardez pas seulement huit ou sept et utilisez cette taille de texte. Ok, donc c'est une taille de texte confortable. C' est dans leurs normes pour la rubrique. Tailles sur. Ils sont à droite. Tout ce qui dépasse 20 points. Vous pouvez en faire un titre. Donc, j'utilise ici. 27 points. San Francisco, tu es présentoir. fords sont essentiellement quatre rubriques. Donc, chaque fois que vous essayez d'utiliser des en-têtes, vous allez utiliser l'affichage pour cela. Ok, donc vous pouvez voir la force d'affichage Pro de San Francisco est pour les en-têtes. Je l'ai montré dans ma typographie pour les designers, les écoles et si vous savez, je veux en savoir plus sur la ligne, la peau de la main et le rythme vertical et tout cela. Tu devrais regarder ma typographique Xeni Hope. Ok, donc maintenant je vais orteil, viens à la marge. Maintenant, vous pouvez voir ici à gauche et à droite. Il y a des marges de 16 points, donc c'est fondamentalement un huit points Grand. Ils vivent donc deux fois sur huit, ce qui est 16 points des deux côtés. Ceci est une marge sûre parce que je vais doigts ils ne peuvent pas taper sur cette zone Si vous essayez de, vous savez, presser votre doigt ou essayer de tabulation sur quoi que ce soit ici parce que je joue un jeu sur mon mobile Android. Et quand j'essaie de taper, il y a un fardeau qui est un bâton sur il est coincé dans ce domaine, et il est vraiment difficile d'accéder que je dois, vous savez, taper dans un autre comme Dan. Différents angles. Tu sais, en fait, et appuyez sur ce bouton ici. Ok, donc vous avez besoin d'orteil essayer une large zone que vous pouvez voir ici. C' est beaucoup de zone hors zone capable est en dehors de ces marges. Vous pouvez également voir ce titre ce texte. Tout est hors de ces marges. Alors essayez de l'utiliser dans votre conception. Maintenant, tout est au sujet des spécifications de conception. Il y a beaucoup d'autres spécifications de conception comme différentes hauteurs d'autres articles et d'autres éléments graphiques. Je ne vais pas entrer dans les détails. Ah, beaucoup. Je vais vous donner un ou deux articles de plus. Vous pouvez lire sur toutes les différentes spécifications. Mais ce sont les bases. Je pense que vous ne pouvez pas vous tromper si vous obtenez tout ça parfaitement. Donc, la zone de robinet sera presque toujours 44 points de hauteur minimum et ah, ceux-ci sont différents. La taille du texte correspond également à la taille du texte dans l'escalier. Mais si vous regardez de près, cela va être de 10 points. Parce que ce texte n'est pas destiné à la lecture, il est juste pour obtenir l'indice de cette icône. Donc, si j'utilise une toute nouvelle icône et que mon utilisateur est incapable de la reconnaître, il le peut. Il ou elle peut lire ce texte et savoir instantanément que c'est ah, des revenus. Je suis parti ou quelque chose comme ça. Ok, donc tout cela est à propos de différentes spécifications de conception de nous 11. J' espère que vous avez apprécié cette leçon. Je vais partager ce document afin que vous puissiez le télécharger. Il sera dans mon dossier Google Drive. Alors, vérifiez celui-ci et concevez votre peut-être magnifiquement. Et l'utilisation des dépenses sont U S lignes directrices. Ceux-ci sont appelés J'utilise des directives de conception. J' espère que vous apprécierez cette leçon. Si vous avez des questions, demandez-moi. Passons à la leçon suivante. 56. Fixer des limites de cibles de clavier de clavier: non. Avant d'entrer dans le prototypage et de creuser dans le prototypage, nous allons orteils arranger quelques choses et affiner Peu de choses que j'ai trouvé très problématiques lorsque j'ai testé mon prototype sur mon iPhone. Ok, donc le problème, c'est Ah, nous avons beaucoup d'écran. Donc on va d'abord aller aux pieds. La première étape que je vais faire est que je vais les arranger. Eso nous avons moins d'écran en une étape. Donc je vais déplacer ce tableau de bord vers le bas. Nous sommes là, puis ces activités avec tableau de bord, et puis nous avons cette barre latérale, qui est menu. Après que nous sortions de la planque et de ces deux écrans, je vais les déplacer ici. Ok, alors sélectionnons tous les livres. Sélectionnons tous ces éléments en cliquant sur les noms et en appuyant sur Maj, et je vais les déplacer comme ceci. Ok, donc c'est tout ce dont nous avons besoin en ce moment, et il y a un autre problème que j'ai trouvé, c'est la zone touchée qui signifie, par exemple, si j'essaie de lier cette loi orteil de chèvre, l'écran suivant ou l'enregistreur. écran ou cet écran 1er 1 OK, maintenant sur cet écran, il va fonctionner. Très bien. Si j'essaie de le tester sur mon PC C'est en utilisant ce prototype ici, ça va fonctionner. Très bien. Mais si j'essaie de le tester sur mon iPhone cinq s ou n'importe quel appareil et le problème sera que l' utilisateur est incapable d'onglet sur cette petite zone. Ok, donc nous devons rendre cette zone terrible un peu plus grande pour le doigt. Ok, Donc ce que nous allons faire, c'est nous allons nous occuper de ce domaine capable, ce qui est je pense que j'ai discuté de ça dans l'expérience utilisateur pour les scores de grosses infirmières. Donc, il doit être au moins 44 points ou quelque chose de plus proche de cela, sorte que les utilisateurs peuvent facilement capitaliser. C' était 44 pixels de 44 points. Ok, donc d'abord je vais faire, c'est créer des arrière-plans vides ou des arrière-plans transparents derrière ce logo. Ok, alors faisons-le avec un écran d'abord pour que tu puisses voir ce que je voulais dire. Ok, alors sélectionnons celui-ci ici. Maintenant, vous pouvez voir que c'est notre retour à Logan. D' accord ? Maintenant ce qu'on peut faire ici, c'est si je vais à cette inscription et si je vais à ce design et que je vais dans les détails de celui-ci, accord. Donc nous pouvons voir que c'est un accessoire laissé. D' accord. Une chose que nous pouvons faire, c'est que vous pouvez voir ici. Ils ont ajouté que c'est emprunté à vous comme à notre nôtre, qui est à Apple. Donc, vous pouvez voir qu'ils ont ajouté la limite, qui est si grande. Donc, si vous touchez même dans ce domaine, il va revenir en arrière. Ok, Mais pour nous, vous pouvez voir si je vais à ce mot de passe sentir si quelqu'un essaie de taper sur cette icône I icône, il est juste cette icône, donc nous devons étendre sa zone de base maintenant. Ce que nous allons faire, c'est que nous allons utiliser quelque chose de similaire à ça, et je vais utiliser cette zone autant de médias qui est lui hors de la frontière et aussi le plein. Ok, donc c'est un rectangle vide, et je vais l'utiliser juste en dessous de cette icône de poisson, et je vais l'appeler frontière pour I Icahn. Ok, maintenant, quand quelqu'un essaie de taper dessus, il va montrer cet écran. OK, donc ce sont quelques détails mineurs. Vous devez garder à l'esprit que votre prototype doit avoir de bonnes zones capables qu'un utilisateur peut facilement toucher. Aussi, si vous regardez ce journal dans les cheveux, nous pouvons également ajouter une chose similaire ici. Donc je vais rendre cette zone capable. Je vais enlever la frontière, lui hors du champ, et je vais prendre les pieds. Déplacez-le en dessous de ceci. Ça va avoir faim longtemps ici, ok ? Et je vais les regrouper. Allez, G. Donc, on se connecte ici, Link. Donc ce sont des choses que vous devez considérer. Ce sont de très petits détails qui vont rendre votre prototype parfait. Alors assurez-vous de le faire avec tous vos éléments capables ici comme ceci. Celle-là. D' accord. Donc vous pouvez voir que c'est un groupe, donc je vais l'ouvrir et je vais nettoyer les orteils. Sont zone capable par ici. Donc ça va être quelque chose comme ça ici. Enlève cette bordure de cette remplie, et je vais la déplacer en dessous de ce vaisseau. Appelons ça une limite. Ouais, quelque chose comme ça. Et, euh, je pense que c'est bien. En outre, nous pouvons faire la même zone limite pour cette déconnexion. Aussi, nous pouvons faire la même chose pour cela. Fait. Donc, nous allons orteil utiliser toute cette zone en bas ou tout cet écran parce que fait, si quelqu'un va cliquer sur tout étaient sur l'écran cette petite étape pop-up zone, il va être revenir à cet évier à l'écran Clark. C' est donc tout ce que je voulais partager avec vous qu'avant de commencer un prototypage, nous devons corriger quelques choses, qui est le problème de la surface de base. D' accord. Et la limite de votre cible de robinet, il est fondamentalement appelé cible de robinet de celui-ci. J' espère donc que vous avez apprécié cette leçon. Passons à la leçon suivante et commençons vraiment le prototypage. 57. Entrée et d'écrans de prototype: Ok, maintenant nous allons commencer le prototypage, et dans cette leçon, nous allons passer à cet écran prototype et commençons. OK, donc d'abord on va faire le prototype des cinq meilleurs écrans parce qu'on ne peut pas tout prendre dans un seul Clough en une seule leçon. Ok, donc, euh, si vous cliquez sur un autre écran, vous pouvez voir qu'il y a deux options si vous pouvez le lier à n'importe quel autre écran sur et aussi cette icône d'accueil. Ok, donc la maison dans ce sera l'écran de départ, donc je vais cliquer sur celui-ci. Donc, cela va être à propos de l'écran de démarrage. Donc, si je joue cette revue de bureau, vous pouvez voir cet écran de démarrage est cet écran. Donc, si j'essaie de cliquer sur un autre écran et de le faire démarrer Si j'ai commencé, vous pouvez voir qu'il va commencer à partir de cet écran. C' est une chose. Ok, alors faisons cet écran de démarrage, et je vais le lier à mon journal et bienvenue, parce que c'est ce que nous voulons. Il suffit de marcher sur l'écran et d'être sur l'écran d'accueil. D' accord ? Donc, je voulais être la cible est longue et bienvenue. Alors nommez vos écrans à bon escient. Bienvenue au Royaume-Uni. Et je veux la tradition qui va être l'effet Slide gauche. J' ai essayé alors j'ai séché. Poussez à gauche, poussez. Droit. Donc je voulais être dissoute dans l'écran suivant. Et c'est un assouplissement. C' est comme ça qu'il va glisser les orteils. Quelle est cette transition ? Comment leur tradition va alléger plutôt qu'avec ralentissement ou il sera très rapide dans le démarreur à la fin. Je ne veux pas entrer dans les détails. C' est un assouplissement. Il suffit d'utiliser ceci dans et dehors sont dehors. Ok, donc j'ai choisi celui-là. Alors je vais aller à ces durées. Combien de temps cet effet d'assouplissement apparaîtra ? Devrait-il être trop long ? Je ne vous recommande pas d'aller au-dessus de 10,5. Cela va prendre beaucoup de temps. OK, alors assurez-vous que vous êtes entre 0.12 point 4.5. Donc, je vais utiliser ceci, ce qui est un point pour donc je pense que je devrais utiliser quelque chose de plus près. 2.25 D'accord. Et c'est une autre option que je vais montrer dans la prochaine leçon. Donc pour l'instant, ne veste pas et ah, essayons notre saillie. J' ai et voir si c'est des liens de sorte que vous pouvez voir Non, Je peux appuyer ou cliquer dessus. Donc, si je clique dessus, vous pouvez voir maintenant j'ai orteil de maïs cet écran de connexion. Ok, maintenant on est sur cet écran. Nous avons réussi le prototype pour le jeu à partir de cet écran. Donc, nous décidons de flux de travail hors de notre application ou de notre site web ou cape de conception. Maintenant sur cet écran, nous avons conçu des interactions pour ce Logan. Maintenant bouton, parce qu'il va aller au processus de slogan ici. Et puis nous avons cette inscription avec le processus de courriel, qui va prendre à cet écran pour vous connecter avec Facebook et Google. On n'a pas conçu d'écran pour ça. Sur ce sera Ah, prototype très vertical. Si vous vous en souvenez, il sera très en profondeur Prototype pour ce Connectez-vous et signez un processus. Je ne veux pas que ce soit un processus très approfondi. Et ah, c'est que nous allons lier cet écran. Cette zone que vous pouvez voir non cette zone de robinet froid est sélectionnée. Donc, vraiment, on veut que ça arrive. Alors maintenant, je vais orteil va à cet écran et utilisons la diapositive gauche. Ok, maintenant il y a une chose très importante que vous devez garder à l'esprit. Diapositive gauche sera appliquée orteil cet écran, pas l'écran. Et je voulais Toby 10.4 2ème parce que le point sera trop rapide. Donc, je vais l'utiliser 0,4 seconde et utilisons-les. Ah, notre est en dehors. Excusez celui-là. Ok, maintenant une interaction est faite. Maintenant, une interaction de plus sur cet écran est celui-ci se connecter maintenant et il va orteil goto le journal de l'écran et rempli. C' est juste l'écran suivant. Nous voulons montrer à l'utilisateur que comment sera l'écran. Et aussi, nous pouvons aller à ce journal inactivé, qui est mieux, parce que par défaut, nous allons montrer le mot de passe à l'utilisateur pendant qu'elle ou il est en train de taper . Ok, donc je vais aller orteil la peau plutôt que longtemps. Et Fred regarde un si cet écran et je veux qu'il orteil. Dissolons-le car il va à l'écran suivant et le point Durée forcée. Ok, maintenant nous avons quelques valeurs liées. Allons juste cet écran et je vais aller aux pieds. Utilisez cette revue de bureau et voyons comment il est. Maintenant, cliquez sur le slogan. Ok, donc ça va très bien. Et Ah, moment, celui-ci n'est pas lié ou pas. Même pas celle-là. Donc je suis coincé avec ça. Donc celui-ci est créé. Et, ah, si nous lions cette zone, qui va être lions ce mot de passe et ensuite nous avons il est une limite pour l'icône. Ok, donc c'est la limite que j'ai sélectionnée sur le côté gauche dans le panneau des calques, et je vais la lier, orteil celui-ci. Alors, cliquez sur l'écran, et il va se dissoudre les orteils, ok. Et tous ces paramètres seront les mêmes. Et si sur cet écran j'essaie de cliquer sur celui-ci, je vais revenir à celui-ci. C' est donc notre thèse de connexion, mot de passe, vue, interaction. Et donc je veux revenir à celui-là. Donc, il est fondamentalement basculer entre ces deux états, et je voulais être très rapide, donc je voulais être 20,2 secondes. Et changeons aussi celui-ci. Deux points. Si vous voulez changer quelque chose, il suffit de cliquer sur l'écran et sur l'interaction ou ici qui va vous montrer les options que je voulais. Toby. 0,2 seconde. D' accord. Maintenant, Ah, nous avons aussi besoin de sélectionner des personnes, et nous voulons qu'il aille à la pointe des tableaux de bord. Après la connexion. Je voulais que tu ailles sur cet écran de tableau de bord, donc cette fois on veut qu'il soit orteil, pas se dissoudre. Um, poussons ça à l'accord. Donc, je vais utiliser que c'est tout droit maintenant, parce que je pense que c'est le bon. Et je voulais être quatre secondes aussi la même chose pour ce journal à Berlin. Je voulais être quatre secondes que c'est bon. Maintenant, je vais jouer ça dès le début. Je vais cliquer sur celui-ci. Ok, donc je veux me connecter. D' accord. Je suis en partie en tapant mon mot de passe et est montré à moi. Cliquez sur ce bouton à nouveau. Encore une fois. Donc, c'est très agréable et cool effet que vous pouvez voir ici. D' accord. Et puis je vais reprendre les pieds. Connectez-vous. Et voici mon tableau de bord. C' est ainsi que j'utilise cet écran et ces interactions et pour créer ce prototype. Et maintenant, nous allons voir s'il y a un lien manquant ici. Donc celui-ci est Pensez à cette inscription. Ok, donc sur Sign up. Je veux retourner à l'exploitation forestière. Donc ce sont les deux interactions qui étaient ici au sommet. Je veux retourner à la liste, connecter à l'écran, et je veux qu'il selle. J' écrirais. Ok, donc je veux que celui-ci glisse dans la destruction, et celui-ci glissera dedans. Ok, donc c'est fondamentalement glisser dehors, en fait. Quoi qu'il en soit, ça va être glissé à gauche. Et si je clique sur celui-ci, voyons. Qu' est-ce que l'Okay, Donc c'est aussi diapositive à gauche. Ok, donc c'est la glissière à gauche. Ce genre devrait être diapositive. Droit ? Donc ça va être dans la bonne direction, alors d'accord, alors ça va être diapositive, non ? Et aussi, cela va être glisser à droite et facile maintenant point pour. Ok, alors testons celui-là. Et maintenant je vais cliquer sur celui-ci. Inscrivez-vous longtemps et inscrivez-vous. Blogging. Inscrivez-vous. Blogging. Ok, donc ils ont vraiment l'air très gentils. Vous pouvez jouer avec ça toute la journée. D' accord ? Alors revenez à vous connecter. Celui-ci fonctionne aussi. Donc, nos écrans supérieurs sont terminés Maintenant nous sommes Nous les avons correctement liés. Si vous exécutez ceci, vous pouvez voir qu'il s'agit de notre écran de chargement. Et puis si je vais au slogan, je peux voir que c'est l'écran de connexion d'activité où je tape mon mot de passe et je peux vous le servir et je peux le cacher. Je peux encore couper le son. Je peux aller à cette connexion. Et ça va être mon tableau de bord en ce moment. Nous n'activons pas. C' était celui-là parce que nous allons les aborder dans la prochaine leçon. J' espère que vous avez apprécié cette étape et tout. Comment cela va être lié. Si vous voulez supprimer une interaction, faites-la glisser comme ceci. Et il est Il sera supprimé. Maintenant, vous pouvez voir que cet élément n'est lié à aucun écran. C' est ainsi que vous le supprimez. Donc c'est à peu près tout. Si vous voulez modifier des paramètres, vous pouvez simplement cliquer et un pop-off s'ouvrira. Avoir la cible, la transition et l'assouplissement que vous voulez. Et c'est tout. Si vous avez des questions à me poser A passons à la leçon suivante et créons la grippe pour le reste du prototype. 58. Prototyping et d'autres écrans dans XD: Ok, Maintenant, dans cette leçon, nous allons relier le reste des écrans et faire le club avec eux, et nous allons terminer le reste de notre prototype. Ok, alors commençons. Ok, nous allons zoomer sur le remorquage, contrôler ou commander un. Ok, donc c'est notre tableau de bord, et voici notre barre latérale. Nous devons donc nous assurer qu'ils glissent. Très bien. Donc, si quelqu'un clique sur ce bouton ici, qui est le menu hamburger. Donc, d'abord, nous allons créer cette interaction et aussi cette déconnexion. Donc, sur tous ces écrans, je vais créer la même interaction. Ok, alors sélectionnons celui-ci. Et je vais aller à ce prototype, et je suis comme ce groupe, qui est mon, euh, euh, menu ex Nommez le menu. Et je vais aller orteil va à cet écran, qui est ma barre latérale, qui va apparaître, et je veux que ce buisson d'orteil fait est la poussée de buisson qui essaie de payer. Donc, ici, nous allons utiliser l'action push, et testons ça. Je vais faire cet écran d'accueil juste pour la facilité de cet exercice que je ne veux pas supporter. Passez tous les écrans avant, alors essayons-le. Ok, donc ça a l'air un peu bizarre. On a peut-être besoin d'orteils. Fais le favoriser. Faisons un 0,15 seconde ou 0,1 seconde à nouveau. Et je veux voir à quoi ça ressemble. C' est très rapide. Maintenant, faisons-le 0,2 seconde et voyons à quoi ça ressemble. Ok, donc ça a l'air mieux. Maintenant, voyons si une autre interaction semble mieux dessus. Donc, je vais utiliser la facilité. Et aussi, je vais utiliser la diapositive. droite. Donc, voyez si les droits de diapositive fonctionnent mieux ou le buisson. droite. Ok, alors verrouillons cet écran et ah, cliquez sur cette interaction et ça devrait être Bush. Droit ? Et nous allons utiliser ceci est en dehors, et je vais l'augmenter. 2,3 secondes. Ok, voyons comment ça a l'air génial maintenant. Ok, maintenant, c'est bien. Choisissons celui-là. Ok, donc j'essaie de copier cette interaction, mais je pense qu'il n'y a pas moyen. Donc, je vais utiliser les mêmes paramètres. Bush, à droite. Il est sorti et 0,3 seconde. Oui, une poussée. droite. Note facile. 12 secondes. Ok, maintenant nous allons lier cette, uh, frontière. Juste celui-là. Je vais revenir au prototypage, et nous ne le lierons pas à cette première clé d'écran de connexion. Donc, je veux qu'il le fasse bien. Ou devrais-je le dissoudre ? Je pense que je devrais le dissoudre parce que ça a l'air plus naturel. Donc je voulais sortir du chemin et le dissoudre, orteil cet écran de connexion, et je vais utiliser cette 0,4 seconde pour dissoudre. Ok, maintenant, j'en ai fini avec ça, donc je vais aller à celui-là. Oups. Donc, j'ai choisi celui-ci donc semblent à nouveau. Et puis il y a celui-là, et je crois que je n'en ai pas utilisé. C' est une limite. Je veux la frontière ou ici, qui sera celle-ci. Et je veux qu'il soit relié orteil. Cet écran est le même. Ok, maintenant nous allons tester tous nos, pour voir que tout fonctionne bien. Donc je vais commencer avec cet écran qui est testé. Ok, alors je travaillais juste. Et nous allons juste les autres choses comme la loi Gold. Ok, donc ça a l'air super. Se déconnecter est superbe. Maintenant, il y a encore une chose. Je voulais revenir à cet écran, donc je veux activer quelque chose ici. Comme si j'avais prévenu tout cet écran de retourner à celui-ci. Ok, donc je veux que Bush soit à gauche et dans le même cadre. Voyons voir à quoi ça ressemble. Donc, je vais faire ça. Avez-vous l'un de vous prestes marcher n'importe où ? Presttes Stéphanie. Ok, donc maintenant ça a l'air plus naturel. Ok, donc c'est fait côté, mais c'est fait. Non, nous avons ces activités. Ok, donc cette barre inférieure, la barre de couteau ou le tabouret, on veut les relier ensemble. Ok, alors faisons-le celle-là. C' est très simple. Nous allons lier cela à cela et ça va aller de l'avant. Je pense que je devrais le dissoudre. Cela va se dissoudre dans cette 0,2 seconde, que j'aime vraiment. Cette valeur est vraiment l'amour. C' est selon notre psychologie humaine. Ok, donc c'est bien. Commençons à utiliser celui-ci. Ok, donc sur cet écran, je veux que ce soit celui-là, et je veux préserver cette position à l'école. Ok, donc la position de défilement est que c'est en ce moment l'école au sommet, et ça va préserver ça. C' est toujours commencer par le magasin, bébé. Ok, donc je le veux. Toby coulissant à gauche. Donc, cet écran, ce tableau de bord va glisser vers la gauche, et cette activité avec l'écran d'activités entrera dans. Ok, donc je voulais Toby point trois secondes de la saison, d' accord, accord, même façon pour l'évier. Donc on va aller un écran à la fois pour l'évier. Je vais faire la même chose. Ça va glisser vers la gauche et il est dehors et préserve la position de l'école. Et pour cet écran. Maintenant, cet écran est terminé. Tous les liens ont été faits. Ce tableau de bord est déjà lié à celui-ci afin que nous n'en ayons pas besoin. Toby, il est déjà actif. Donc nous ne voulons que les deux derniers. Ce qui est celui-ci ou cet orteil construit Tok. Alors maintenant, on remonte aux pieds. Liez-la comme cette lumière à gauche. Ok, donc ça s'appelle Ok, alors on le veut. Celui-ci va glisser vers la gauche parce qu'il va les mots des orteils vers celui-ci. Ok, mais maintenant, si on retourne au tableau de bord, la direction est différente. Ok, donc si je retourne au tableau de bord, il devrait glisser. Droit ? Donc ça devrait se passer comme ça, et le tableau de bord reviendra. Ok, alors essayons-le en mer. Quoi ? Je veux dire, donc c'est la position de l'école. C' est donc au sommet. Ça va être comme ça. OK, donc maintenant ce dont j'ai besoin ou ici c'est que je voulais être Ne pas préserver l'emplacement du défilement. Rappel. C' est difficile ou différent pour moi. Peut-être. Je pense qu'on devrait l'utiliser comme ça. Je n'aime vraiment pas l'école encore et encore de toute façon, donc ça va être laissé de toute façon, alors ok, alors on essayait de les utiliser. Ok, donc ces deux écrans sont terminés. Ces deux interactions, toutes les interactions sur ces écrans sont terminées. Maintenant, nous allons passer à cette fois ou tableau de bord va être diapositive arrière. droite. Ok, donc ça va glisser, non ? C' est bon. Cela a aussi marqué celui-là. Celui-ci va aussi orteil cet écran, et il va aussi glisser. droite. Ok, donc c'est bien. Ok, donc j'ai aussi besoin de lier ça, mais sous cet écran, qui va orteil Non, je pense qu'on devrait utiliser dissoudre. D' accord. Nous ne voulons pas glisser parce que dans la conception d'interaction, nous n'allons pas sur un autre écran. C' est le même écran. Nous voulons montrer le message sur l'écran, donc je vais le dissoudre. Ok, alors injectons ça. Maintenant. Je pense que tout notre écran a un prototype de haricot. Et objectons celui-ci et je vais l'utiliser sur l'écran d'accueil pour celui-ci, et je vais le tester. Ok, donc je vais tester cet écran. Cachons tout le reste, et je vais tester ça dans l'écran pour votre fenêtre. Cliquez ensuite sur coincé. Suivant. Allez à l'inscription. Ok, inscrivez-vous. Ça a l'air bien. Je vais aller me connecter et juste dans cette zone. OK, donc ça a l'air super journalisation maintenant je vais aller à l'écran. Le menu de la barre latérale. D' accord. Recherches, travail. Superbe look. Allez à ces activités. Et si je vais couler et revenir aux activités, il est à nouveau préserver sur la zone supérieure. Je n'aime vraiment pas quand il me montre la boule de défilement. C' est ça a l'air vraiment hideux. Mais je pense qu'ils travaillent le jour le jour et la nuit la nuit, donc ils vont l'améliorer. Donc je pense que tous nos écrans de travail de Knoller test celui-ci est superbe. Ok, donc tu peux voir comment ça s'estompe. Vraiment cool et sympa fait. Déconnectons-nous et revenons à notre écran de connexion. Alors maintenant vous pouvez voir comment nous avons créé ce prototype et dans tout ce processus, essayez de lier hors écran par écran. Donc, vous n'oubliez pas de lier votre interaction. J' espère que vous avez apprécié cette leçon dans les prochaines années, et nous allons voir comment vous pouvez enregistrer la vidéo de ce prototype et comment vous pouvez partager ce prototype avec d'autres utilisateurs pour le tester ou le commander. Passons donc à la leçon suivante. 59. Partage du prototype avec les autres: le but principal de tout prototype est que vous pouvez le partager avec d'autres. Vous pouvez discuter de ce que nous pouvons améliorer en elle et d'autres peuvent commenter à ce sujet. Cela peut être possible en publiant sur ce partage notre prototype avec les autres membres de notre équipe . Et pour cela, nous avons cette icône ici partager. Et si vous cliquez dessus, il ya trois options publié prototype, gérer, gérer, publier des liens et spécifications de conception publiées. Nous allons parler des spécifications de conception, électrons qui sont essentiellement pour les développeurs et peut-être d'autres membres de l'équipe qui ont vraiment besoin de leurs spécifications de conception. Et on va aux pieds maintenant. Cliquez sur ce prototype de publication. Maintenant, je vais le nommer X'd. Voici donc le titre. Je vais l'appeler X'd Gauss. Attribution quelque chose comme ça. Et je vais les orteils décocher ce plein écran ouvert mains sport durs. Ok, donc ça va me montrer que quels domaines sont interactifs beaucoup commande d'autres types, Commandant. Donc je vais créer un lien public. Il va orteil Télécharger. Il faudra un certain temps pour le télécharger. Ok, Maintenant vous pouvez voir qu'il a été téléchargé, et je peux ouvertement en copie convaincante et cordon de lit, et je peux l'intégrer dans n'importe quelle autre page ou quelque chose comme ça. Alors je vais ouvrir le lien. Je peux copier le lien et envoyer un email aux autres membres de l'équipe ou à toute personne avec qui je veux partager ce prototype. Je suis travaillé en ce moment. Ouvrez ce lien. Ok, Maintenant, vous pouvez voir que le prototype a été ouvert dans mon navigateur, et si je clique dessus, vous pouvez voir qu'il fonctionne. D' accord ? Pour que je puisse cliquer dessus, je peux travailler dessus. Et aussi, je peux cliquer sur ce spectacle. commandement a dit qu'il va me montrer le commentaire. Je peux également faire quelques commentaires comme celui-ci. Le tableau de bord a l'air génial. Creusez. Donc, je vais appuyer sur les pieds soumettre. Et aussi, si je clique sur d'autres choses comme, peut-être que cette couleur semble agréable. Et si j'essaie de cliquer dessus Pinto Art Board, je peux cliquer sur n'importe quelle zone du tableau d'art où je veux. Par exemple, si je veux ça, alors maintenant vous pouvez voir ce tueur semble sympa. Il est attaché à cette zone, donc je parle de décoloré afin que vous puissiez voir comment C'est vraiment cool. Vous pouvez montrer aux membres de votre équipe qu'ils peuvent discuter de la conception que cela a l'air bien . Ça a l'air mauvais. Quelque chose comme ça. OK, donc vous pouvez voir que c'est un prototype qui fonctionne. Vous pouvez le partager avec n'importe qui. Cela va fonctionner dans le navigateur, et c'est tout. Vous pouvez également passer au plein écran si vous le souhaitez. J' ai juste meilleure évasion et vous pouvez voir Voici un lien fait avec Adobe X T et c'est la date et l'heure et tout. Et je pense que c'est ainsi que vous pouvez le partager avec les membres de votre équipe. Et maintenant, si vous voulez gérer vos liens, il y a un autre lien de publication de gestion. Il va aux orteils. Accédez à tous les liens que vous avez partagés. Ok, OK. Maintenant, vous pouvez voir qu'il y en a deux, qui est en fait le petit déjeuner. Inverser moins. Et c'est la mission de classe. Donc en ce moment, je vais croire ce lien partagé et juste garder celui-là. Ok, donc je vais aussi partager ce lien avec vous les gars pour que vous puissiez le tester et voir vous-même. J' espère que vous avez apprécié cette leçon. Et vous allez vraiment, j'aime Ah, améliorer votre prototype et vous pouvez le partager avec d'autres. Vous pouvez commencer par les autres, les membres de votre équipe ou votre famille, vos amis ou autre. Ok, donc c'est tout au sujet du partage de votre prototype. Passons à la leçon suivante. 60. Prototype sur Mac: D' accord. Maintenant, dans cette leçon, je vais vous montrer la très belle et cool fonctionnalité d'enregistrement de votre prototype vidéo dans la macro. ce moment, je suis dans mon système d'exploitation Mac. Et si vous voyez si vous, je vais cliquer sur celui-ci. Donc, je vais jouer mon prototype et vous pouvez voir ici est mon prototype et il y a un petit bouton d'enregistrement en haut. Non, si je clique sur cet enregistrement, il va commencer à enregistrer mon prototype. Et si j'essaie d'interagir avec elle va enregistrer toutes les interactions. Donc je vais enregistrer toutes les interactions comme ça. Et si je passe à d'autres écrans, il va enregistrer tout ça. D' accord. Et si je vais ici comme ça, déconnectez-vous, et maintenant vous pouvez voir qu'il a tout accordé. Je vais appuyer à nouveau sur celui-ci, et il va enregistrer cela dans mon cloud créatif plein si je veux O dans le format MP quatre. OK, donc je vais le sauver comme ça. Et maintenant, je vais ouvrir ce fichier dans un plan de temps rapide. D' accord ? Maintenant, tu peux voir sa vidéo. Je pense que celui-ci a été créé aujourd'hui à 11 ans. 29 heures et je vais ouvrir les orteils en temps rapide, joueur. C' est un peu grand, donc je vais le faire court comme ça. Ok, maintenant vous pouvez voir si je le joue, il va jouer toutes les interactions comme ça. Maintenant, vous pouvez voir qu'il est vraiment cool, transition très lisse et tout et enregistré à une très belle résolution parce qu'il est Mac cinq écran. OK, donc c'est la fonctionnalité d'une question Mac auto B x d Mac où vous pouvez enregistrer vos écrans ah . Et si vous n'utilisez pas Mac, ne soyez pas dit parce que la version de Windows le suit. Donc, jusqu'au moment où vous voyez ce cours, ou peut-être dans les prochains mois, peut-être leur louer cette fonctionnalité dans l'orteil du système d'exploitation Windows 10. OK, donc ah, c'est tout au sujet de l'enregistrement de votre prototype dans le système d'exploitation Mac. Si vous avez des questions à me poser, passons à la prochaine 61. Outil d'inspection du design: Maintenant, dans cette vidéo, je vais vous montrer une très belle fonctionnalité qui est en ce moment en beta Better, qui est d'Adobe X'd. Et ce nom de fonctionnalité est conçu. Inspecter. Ok, donc, Inspecteur, qui va essentiellement vous montrer, vous montrer les couleurs et tous les différents espacements entre les différents éléments pour vos développeurs. Donc, si vous voulez Oh, remettez votre design à vos développeurs et vous envisagez d'utiliser des outils. Outils de tierce partie. Vous devriez d'abord voir qu'il est intégré dans et obéir extra, qui est appelé publication. Inspecter. Ok, alors laisse-moi voir si ça va, donc les spécifications du design. Donc ils appellent ça les spécifications de conception. Il est en ce moment en version bêta. Ils essaient de l'améliorer encore et encore et jour après jour. Alors, maintenant, quelles sont les caractéristiques que je vais vous montrer. Alors il suffit d'ouvrir votre design comme ça, et vous allez Toe cliquez sur ces spécifications de conception et vous pouvez voir que je l'ai déjà partagé sur mon site ah, adobe X t spécifications. Et maintenant, vous pouvez voir ici, il dit vignoble basé sur IOS. Nous avons donc vraiment besoin que les unités soient aux États-Unis, ce qui est des points. Alors je vais ouvrir ce lien. Ok, maintenant tu peux voir ça. Il a ouvert ce lien et je l'ai nommé créé en classe. Donc, si vous cliquez sur survoler un hors de l'écran, il montre également la grippe de sorte que cet écran va orteil celui-ci ou celui-ci ou celui-ci. Donc il me montre aussi le flux de tous les écrans, différents écrans Et aussi, si vous cliquez sur l'un d'eux, ça va prendre un certain temps à Lourdes et vous pouvez voir qu'il me montre toutes les couleurs. Je peux également changer les valeurs de couleur pour exercer décibel rgb, alfa et le I s L. A qui est la teinte, la saturation, saturation, la légèreté et Alfa qui est utilisé principalement dans selon je pense et il est différent de juste être normalement. Donc, ce sont les cordons qui sont utilisés sur les sites Web RGB a ou en fait aussi vous pouvez voir cela me montrant tous les styles de réalisateur en bas. Vous pouvez voir que vous pouvez également changer la taille de deux pixels ou points ou DP DP est normalement pour Android. Ok, donc pour l'instant c'est pour notre U.S . Air. C' est un iris. Abso les tailles sont en points. Ok, alors revenons en arrière et cliquons sur n'importe quelle autre fenêtre. Si je clique sur celui-ci et maintenant nous allons venir à bout des distances entre les différents éléments. Donc, si je clique sur celui-ci, vous pouvez dire qu'il me montre qu'il fait 352 points de large et 62 points de hauteur. En outre, il me montre à droite l'apparence d'une rondeur de huit points de tous les coins . Opacité, 100% calories. L' ombre blanche est zéro point sur l'axe X y un point. Il est vertical en bas. Un point, c'est le sang. D' accord. Sachez aussi si je clique sur celui-ci, il me montre les distances sur le côté gauche. Il est 18 points à l'intérieur de ce rectangle blanc. C' est ainsi que vous donnez les spécifications à vos développeurs ? Il y a des outils tiers que vous pouvez intégrer avec Toby supplémentaire chiennes jamais tenir et Zeppelin, qui va vous montrer dans la dernière section où nous allons utiliser à la fois Zeppelin et jamais appelé toe show conçu les cordons et la conception spécifications et tout ce qui se passe dans ce bureau. J' espère que vous avez apprécié cette leçon, et si vous avez des questions à me poser, passons à la leçon suivante. 62. Pourquoi exporter en 1x 2x 3x ?: D' accord. Maintenant, dans cette leçon, je vais parler des différentes tailles d'exportation, dont nous avons besoin pour différents iPhone iPhone, comme iPhone X iPhone six plus iPhone, six écrans et iPhone, cinq écrans. Ok, donc la conception de la salle dans Adobe X'd Le design que vous faites est toujours dans un X. Ok, Donc vous concevez à cette Résolution un X. Donc, si nous avons besoin de plus de résolution ou nous avons besoin des boutons et des icônes pour d'autres écrans iPhone six plus et l'iPhone X et l'iPhone six, nous avons besoin de doubler la taille de cette ressource. Ok, je vais te montrer dans quelques secondes. Assurez-vous juste que, vous savez, et comprenez ces termes. Un à côté des œuvres et trois X. Maintenant, vous pouvez voir si nous regardons ces écrans. iPhone cinq écran. Vous pouvez voir qu'il est 6 40 par 11 36 pixels que l'iPhone. Six. C' est celui-là 7 50 en 1334. C' est la hauteur, et c'est le mot. Et non, si vous sautez orteil iPhone six plus, c'est fondamentalement c'est ah, résolution. Et normalement, nous ne concevons pas sur ce parce qu'il est réduit à l'échelle par iPhone six un six plus Et pour iPhone X, Vous pouvez voir que c'est la taille du portrait. Ce sont donc des tailles différentes et vous pouvez le voir sur ces trois écrans. Ici, nous avons besoin d'images de résolution différente parce que si nous avons conçu en utilisant celui-ci X comme 6 40 11 36 ou quelque chose par ici. iPhone 3 20 par 40. La Grande-Bretagne que nous avons sera très petite parce que nous avons moins de pixels. Nombre de pixels. Maintenant, nous avons plus de pixels. Donc, sur ce nombre de pixels, si nous avons, comme 50 pixels, cacher un bouton, il aura l'air très petit sur cet iPhone X. Nous devons donc extraire. Notre ressource est en trois tailles différentes, un XTO fonctionne et trois X afin que nous puissions concevoir et répondre à tous. Faites ces différents écrans. Donc, vous pouvez voir ici nous avons toutes les différentes tailles montrées ici, ce que l'on utilise I de nos deux prochains X et trois X. Maintenant, je vais passer à pour le magasin parce que parfois vous avez besoin de basculer orteil entre pour le shopping et plus de 60 et plus de 64 images différentes et pour différents arrière-plans Maintenant, si vous voulez concevoir un arrière-plan dont vous avez besoin, vous devez toujours concevoir un arrière-plan en haute résolution. Ok, Donc si vous êtes en train de vous concevoir, vous devriez concevoir quelque chose dans cet iPhone six plus taille parce que nous avons besoin de ce fond et nous allons le réduire sur différents appareils. Ok, donc vous pouvez aussi voir cet iPhone six, mais nous avons besoin d'un plus grand fond. Donc, si vous préparez votre arrière-plan, votre image d'arrière-plan dans iPhone six, vous devez orteil utiliser la taille six plus, et vous devez créer un fond plus grand. Par exemple, Si je crée juste un arrière-plan ici, créons un arrière-plan. Ok, donc maintenant je vais utiliser une superposition int gourmande sur ça dans la boutique photo. Et utilisons quelque chose comme ça. Ok, donc, par exemple, je l'ai retrouvé. Non, non, je vais l'exporter. Et ah, c'est la taille dans laquelle j'exporte. Et j'utilise PNG 24 Je vais sauver ce qui va être exporté. Mauvais prêt pour le magasin. Ok, maintenant je vais passer à mon X T et je vais ouvrir l'iPhone six plus. Ok, donc j'ai ouvert celui-là. Faisons ça à 100%. Et non, je veux importer ce fond d'écran dans celui-ci. Donc, je vais aller à l'exportation de mon bureau et juste importer ceci. Maintenant, vous pouvez voir que c'est l'arrière-plan, ok ? Et c'est très grand. On a besoin de quelque chose comme ce week-end. Ajustez le décalage de taille et juste la taille comme celle-ci. Donc, c'est plus facile pour nous si nous avons une plus grande expérience. Nous avons un plus grand fond de conception. Maintenant, vous pouvez voir ici nous avons ceci, um 4 14 par saumon, 36 Donc si nous essayons de concevoir la taille réelle de deux X taille parce que dans Adobe X garderait une chose à l'esprit, il va toujours concevoir dans un X. Donc, en ce moment, cette taille n'est pas fondamentalement deux X ou trois X. Donc, si je passe à celui-ci et voir la taille qu'il waas, nous allons utiliser cette taille 10 80 en 1920. Ok, donc je vais changer la taille. Uh, vert va être 9 10 80 et ça va être 1920. Donc maintenant c'est en fait la taille do X. D' accord ? Je pense que trois x Donc, si je fais glisser mon arrière-plan ici maintenant, vous pouvez voir qu'il convient bien. Donc c'est en ce moment cette taille de trois x et les grandes cellules réelles qui étaient les trois guerres X. Celui-ci 12 24 par 2200 et huit. Donc, si vous voulez vraiment la taille réelle de trois X, il est en fait celui-ci et les tailles de réduction de l'échelle cette 1 10 ity d'ici 1920. Donc tu as besoin d'orteil. Gardez toutes ces choses à l'esprit. Non. Si nous essayons de créer un tableau d'art sur iPhone X, vous pouvez voir qu'il est dans Vanek. Donc, il a l'air très petit. Non, si on essaie de faire trois x, ça devrait être quelque chose comme ça 11 25. Donc je vais utiliser la hauteur. taux d'Eso est de 11. 25. Donc, il est 11. 25 et la hauteur va être 2436. Ok, maintenant vous pouvez voir que c'est la taille réelle de trois cochons X mal sur votre iPhone X. Et si on y retourne, c'est mourir pour la prochaine taille sur un X donc Ah, Adobe Axity. Il est toujours vice de concevoir en utilisant Benex n'a jamais essayé de concevoir dans une plus grande résolution parce qu'il aura quelques problèmes. Essayez toujours de concevoir en un X, mais lorsque vous importez vos graphiques dans Adobe X'd toujours conçu en trois X la plus grande taille que vous avez pour vos arrière-plans car il sera exporté en trois tailles différentes plus tard lorsque vous le remettre à vos développeurs. C' est le conseil que je voulais vous donner. Un X est en fait la taille réelle. Il est sur la taille réelle du pixel et deux doubles supplémentaires et trois X est triple les côtés. Donc quelque chose comme ça. Donc, nous avons trois pixels au lieu d'un sur iPhone X et iPhone 67 Plus, nous avons combattu trois X oui, trois pixels sur DA sur iPhone six. Nous avons deux X, ce qui signifie deux pixels pour chaque pixel au lieu d'un pixel. Donc, si nous avons iPhone simple le 1er 1, nous aurons juste un pixels. Et si nous passons à l'iPhone 5, alors nous avons la double résolution. Nous avons plus d'espace, et donc notre design sera très petit. Donc, nous allons concevoir pour les cous et nous pouvons améliorer notre taille d'exportation, orteil ces deux tailles. Cela aura plus de sens à l'avenir parce que nous allons réellement exporter nos graphismes et nos ennuis d'art. Ok, donc je voulais m'assurer que tu puisses l'idée de celui-là. Suivant deux x et trois X Ici, nous avons le plus grand écran plus de pixels. Ici, nous avons un peu moins de taille d'écran, un peu moins de pixels. Et ici, nous avons les plus petits sont les pixels réels traduits en design réel. Ok, donc si nous concevons en un X, il sera affiché sur iPhone. Comme notre design. C' est les deux x plus grands. C' est les trois x plus gros. Nous allons donc exporter en remorquage, toutes ces trois tailles dans la prochaine leçon. 63. Exemple parfait de 1x 2x 3x: maintenant dans cette leçon, je vais vous donner l'exemple parfait orteil, comprendre un x deux x et trois X et leur relation. Et quelle est cette densité de grandes cellules et ces ennuyeux est et ces deux x trois x et un x problème. OK, donc pendant longtemps je n'ai pas pu le comprendre. Et maintenant je suis juste parfaitement compris. Mais je veux que tu comprennes parfaitement ça aussi. Ok, donc ici vous pouvez voir que c'est un suivant et la taille physique de la place. C' est un carré parfait dans ces trois exemples et c'est la même chose. Supposons donc qu'il s'agit d'une zone de pixel d'un pouce. OK, donc c'est un pouce, un pouce. Maintenant, sur iPhone quatre ou les appareils qui sont un X appareils plus anciens, il va avoir 10 pixels par 10 pixels. Alors, qui est un X ? Certaines petites boîtes ici et stand photos ici pour qu'il parle mal sera une boîte un peu plus grande pour occuper le même espace maintenant sur les appareils de la rétine ou deux appareils X où la résolution est très élevée. La même zone est soutenue par plus de pixels ou plus de ces portes. Donc, chaque porte carrée que vous pouvez voir. Non, on a 20 sur 20. Maintenant, nous avons le double de la taille de ces portes. Ici. Nous avions 10 pixels, et ici nous avons 20 pixels dans le même espace Maintenant dans les trois x les derniers appareils qui sont iPhone sept plus huit plus six plus et iPhone X. Ici, nous avons plus de résolution ou plus de pixels plus en détail dans un petit espace sur ce même pouce. Ok, donc nous avons maintenant 30 petits et petits et 90 tang endosse. Je sais ce que cela signifie, c'est que nous voyons Mawr Chris, passer des graphismes plus colorés sur ces appareils. OK, donc et tu dois garder ces choses à l'esprit. Vous pouvez voir ici, ils ont montré que vous avez besoin de sport toute autre haute résolution que vous avez remorqué Attendez deux X et trois X et von X, votre ah, toutes les images pour différents appareils. Vous pouvez également utiliser un suivant. Si vous souhaitez prendre en charge des appareils plus anciens, si vous ne voulez pas prendre en charge et vous pouvez en parler à vos développeurs. Aussi, ici, nous voyons à nouveau qu'il pixel par pixel Great. Donc, il est basé sur la conception est basée sur le taux de huit points exhilaré. Donc, ce sont quelques-unes des lignes directrices sur ce que sont les images, tailles et résolution. Et qu'est-ce que celui-ci excentrique supplémentaire. J' espère que vous avez été détruit ce concept maintenant, et, hum, si vous avez des questions à me poser, passons à la prochaine leçon. 64. Exporter des planches pour créer des maquettes: Ok, maintenant, dans cette leçon, je vais vous montrer comment explorer différentes images. Et nous allons en comprendre plus sur un prochain deux X et trois X. Ok, Donc, si vous sélectionnez un hors de votre tableau d'art et aller à votre barre de menu, vous avez différentes options d'exportation, mauvais sélectionné et tous les tableaux d'art. Vous pouvez exporter tous les tableaux d'art ou exporter uniquement un tableau d'art sélectionné. Et vous pouvez exporter des badges. Je vais montrer cette exportation de patch dans la prochaine leçon. moment, nous allons orteil, sélectionnez celui-ci et maintenant vous pouvez voir ici sont différentes options pour votre exportation. PNG SPD pdf jpg Nous allons utiliser PNG ou peut-être SPD pas ces orteils, peut-être pour les arrière-plans. Nous pourrions utiliser cette image JPEG. Ok, Maintenant, à partir de toutes ces options, nous allons sélectionner nos États-Unis parce que nous avons conçu pour IOS et c'était iPhone six écran et ne jamais changer cela parce que vous êtes, ah, concevoir votre conception par défaut. Mais les rituels iPhone 67 ou six plus ou X il sera toujours un x sur votre OBE supplémentaire. Ok, sauf si vous avez changé la résolution Maintenant, nous allons sélectionner cliquez sur OK. Maintenant, aussi, vous pouvez changer le dossier. Nous n'exporterons pas. Je le suis. J' ai sélectionné déjà hors dossier ici. Et maintenant, je vais cliquer sur Exporter. Et voyons ce que ça nous montre. Maintenant, vous pouvez voir ici est mon dossier d'exportation. Et si j'ouvre ce dossier d'exportation, vous pouvez voir ici nous avons trois sur différentes tailles d'arrière-plan deux x trois x et c'est le vrai. Donc, si j'ai ouvert celui-ci, vous pouvez voir que c'est un grand plus petit et faire X sera un peu plus grand. Vous pouvez voir la différence de taille sur trois x sera un peu plus grand. Mais en ce moment, il ne le montre pas à 100%. Il s'agit de la taille réelle de trois x. Maintenant, vous pouvez voir que c'est différent pour tous ces écrans différents. Et maintenant, si dans la boutique photo, si vous essayez orteil, créez une maquette de ce design, laissez-moi vous montrer. D' accord ? Donc si on a cette maquette en ce moment, celui-là ce dossier, je vais partager celui-ci avec vous, donc je vais ouvrir la boutique. D' accord ? Maintenant, vous pouvez voir que c'est ouvert pour le magasin et j'en ai un suprême, et je pense que c'est ça me ressemble comme ça. Voyez la taille de celui-ci. Ok, donc c'est l'écran de l'iPhone six. Et voyons si j'ai essayé orteil utilisé. Ah, celui-là, euh, celui suivant. OK, donc je vais utiliser ce X et essayer de le déposer ici. Maintenant, vous pouvez voir qu'il est plus petit parce que l'iPhone six n'est pas une sortie est deux x Donc sur. Maintenant, je vais faire est que je vais faire glisser ces deux x dans ma boutique de photos et maintenant vous pouvez voir qu'il est adapté à l'écran. Voy parce que nous c'est iPhone six est fondamentalement deux x. Donc maintenant nous avons ce deux x cri. Donc, il est en forme et je vais le sauver et vous pouvez voir Laisse-moi te montrer. Il s'agit de la version mise à jour. Ok, Maintenant, si vous ex extraire d'autres écrans, laissez-moi juste extraire celui-ci, et je vais l'exporter par sélectionné, et je vais l'exporter dans le même dossier et nous allons déplacer ce dossier et je repars. Prenez ce deux x un deux X et oups. Désolé. Je dois ouvrir quelque chose ici. Ok, donc c'est l'écran. Je vais aux orteils Prenez mon écran de deux x et je vais aller aux pieds. Mets-le ici. Enregistrez-le et il sera mis à jour dans ce. Ok, Maintenant, vous pouvez voir comment il a été mis à jour. Maintenant, si je vais à cet écran de soif et si je double-clique et efface un autre écran ici maintenant je vais exporter. Exportons. Cet écran, exportons cet écran. Cet écran, C' est le 3ème 1 Je vais explorer sélectionné. Et je vais exporter la même chose. Je vais faire la même chose ici. Celle-là. Je vais faire glisser et déposer ici, et c' est gratuit parce que c'est la résolution iPhone six. Maintenant, vous pouvez voir que c'est à quoi il ressemble. Et c'est le gros plan. Et vous pouvez voir à quel point cela a l'air. Ça a marqué plein écran. Et vous pouvez voir maintenant cela semble vraiment génial. Vous pouvez ainsi créer vos designs dans adobe X t et créer vos autres flics comme celui-ci dans Adobe Photo Shop. Donc, si vous avez ces deux outils, vous pouvez vraiment les combiner sans effort et vous pouvez créer beaucoup de superbes designs comme ça . C' est ainsi que j'ai créé plus de tasse sur mes écrans. Laisse-moi te montrer. Je crois que j'ai utilisé celui-là. Il y a une autre ressource. Je ne l'ai pas fait. J' ai utilisé celui-là de toi. Mange-le. Celle-là, je suppose. Ouvrons ça pour le magasin. Et vous pouvez voir qu'il y a différentes balises comme celles-ci. Donc, si je sélectionne un de ces et que j'utilise, par exemple , celui-ci, je peux faire la même chose avec ceci. Ok, maintenant je vais voir la taille de l'image, si c'est bon, donc je pense que ça va prendre les trois accises. Ou essayons celui-ci parce qu'il a l'air plus grand. Oui. Ok, donc il faut trois X parce que la taille de la toile est plus proche de 2000 quelque chose 11 25 ce qui est un trois très difficile. X iPhone X sont accise iPhone. Donc je vais le fermer et vous allez voir que c'est le premier écran. Si je fais un zoom avant, vous pouvez voir à quel point il a l'air vraiment cool. Vous pouvez également modifier l'annonce et l'écran ici. Laissez-moi ajouter un autre écran comme celui-ci. Ok, donc je vais le sauver rapidement et laissez-moi vous montrer. C' est comme ça que ça arrive maintenant. Ce n'est toujours pas le cas. Je pense que c'est sur 100%. Et si je sélectionne ce vert, il va me montrer un autre écran. Utilisons ce 3 X et je vais le mettre ici maintenant. Pourquoi ? Je vous montre tout ça. Donc vous avez une bonne idée de toutes ces résolutions trois x quatre x et vous pouvez facilement, euh, montrer à vos clients vos designs d'une manière cool comme ça. Ok, donc j'espère que vous avez compris cette option d'exportation. Si vous souhaitez exporter tous vos tableaux d'art simultanément, vous pouvez exporter tous les tableaux d'art. Et il va exporter tout notre conseil d'administration en trois résolutions. Où à côté d'étendre trois x. Donc si je clique sur celui-ci, je vais remplacer les autres. Et maintenant, vous pouvez voir que j'ai tous mes tableaux d'art ici. Ok, donc c'est comme ça que vous exportez tous vos tableaux d'art, et je vais parler de l'exportation par lots dans la prochaine leçon, alors ils vous verront bientôt. Et si vous avez des questions à me poser, passons à la prochaine leçon. 65. Complicité de exportation dans Adobe XD: Maintenant, dans cette leçon, nous allons examiner l'exportation des badges, qui est la toute nouvelle fonctionnalité d'Adobe X'd. Et c'est vraiment utile. Ainsi, vos concepteurs , par exemple, veulent ces boutons dans différentes résolutions. Ils ont averti cette icône I icône en trois résolutions. Quoi ensuite ? Deux x et trois X. Ils ont aussi besoin de ces Ah ! Ah, ce logo ici en trois résolutions. En outre, ces deux boutons Google se connecter avec Google, connectez-vous avec Facebook dans trois résolutions différentes. Alors, quel est le moyen le plus rapide et le plus facile de le faire ? C' est très simple dans Adobe. En fait, cette exportation par lots est vraiment génial fonctionnalité. Et si je vais à celui-ci, Ok, donc ce que vous devez faire est que vous devez sélectionner n'importe quel élément de votre actif que vous voulez exporter et vous allez aller à ceci sur le panneau des calques ici, et vous allez marquer cette marque ici . C' est pour une mauvaise exportation. Ok, donc je vais également sélectionner cet arrière-plan ici, et je l'ai également sélectionné comme marque pour l'exportation par lots. Et une autre chose que j'ai ajustée est que je mosquée ce fond avec cette couche. D' accord ? Et il y a une autre façon d'extraire cet arrière-plan en trois résolutions différentes . Et je pense qu'il va le faire avec cette exportation par lots. Vous pouvez également le faire dans la boutique si vous le souhaitez. Oh, et ah, maintenant sur cet écran, nous ne menons que ces deux choses. Ok, alors, sur cet écran, on a besoin de ce bouton. C' est notre bouton de connexion. C' est que nous devons l'exporter. Exportation de badge. Ensuite, nous avons également besoin de cet un bouton Facebook badge export. Et je vais également lisser cette connexion avec Google avec Google. Ok, donc tous ces boutons aussi, j'ai juste besoin de celui-ci si je je je peux vous assurer que vous aussi les nommez correctement. Je vais sur quelque chose comme ça. Donc ils ont plus de sens, d'accord ? Parce que vous les exportez pour vos développeurs, et cela doit être un bon nom pour elle. Donc ils peuvent facilement le reconnaître aussi, vous pouvez voir que c' est mon I. J'appelle, euh,j'ai activé quelque chose comme ça et je vais sur euh, le marché pour l'exportation par lots et puis sur cet écran je n'ai pas besoin. Ok, donc j'ai besoin de ça. Mais c'est différent. Donc je vais marquer les orteils, celui-là. Ok, donc de cette façon, vous allez marquer toutes les icônes et toutes les différentes choses que vous voulez exporter. D' accord. Par exemple, vous pouvez voir cette icône ici. C' est, euh, cette Glenda rike sur cette icône ici, c'est l'icône du cercle F. Donc x cercle cercle I sur. Je suis du marché. Donc, vous allez marquer tous vos atouts dans votre présent dans votre conception, et vous allez vous attendre à tout pour vos développeurs. D' accord ? Vous pouvez également utiliser celui-ci. Par exemple. Ceci est désactivé. Et pour chaque off, ces icônes que nous allons orteils ont différents états, par exemple. Par exemple, ce tableau de bord que vous pouvez voir ici ce tableau de bord Nous allons en fait j'ai Ceci est en fait devrait être dans un groupe. Donc c'est le tableau de bord. Ok, donc je vais le nommer tableau de bord et capable. Ok, donc ça va beaucoup aider. Donc, je vais l'exporter comme ça et ce sera notre tableau de bord pas activer ou désactiver ou quelque chose comme ça. Ok, donc tu vas nommer ce que tu veux. J' appuie sur le contrôle, la touche de commande pour sélectionner différents articles et la marchandise du contrôleur pour les tâtonner. Donc, cela va être désactivé tableau de bord, quelque chose comme ça. Vous pouvez parler à vos développeurs de la convention qu'ils utilisent, ils utilisent désactivé ou quelque chose d'autre actif ou non actif, quelque chose qu'ils peuvent avoir autre chose. Maintenant, tu vas aux pieds. Cochez cette marque pour l'exportation et il va exporter trois images pour les éléments activés et désactivés. D' accord. Et vous allez faire la même chose pour ces activités et couler. Et puis ce bouton, c'est notre évaluation de bouton. Il est déjà sélectionné, donc n'avez pas besoin d'orteil. Sélectionnez cela. Et une fois que vous avez sélectionné tous vos différents actifs et que vous voulez exporter par exemple ce bouton ici mais une évaluation je veux l'exporter. Sachez que c'est, mais je suis désactivé. Je n'exporterai pas. Assurez-vous d'exporter les deux états pour ces boutons activés et désactivés. Ok, alors nous allons aller à cette exportation et nous allons sélectionner ce badge et nous allons sélectionner notre nous un x export et c'est tout. Allons dans notre dossier d'exportation et vous pouvez voir ici C'est vraiment cool. Donc nous avons ce bouton, ce bouton pour deux x trois x tout le fardeau pour toutes les tailles différentes Vous pouvez voir que nous allons les orteils Donnez-les à nos développeurs et ils vont, vous savez, vraiment nous embrasser les mains parce tous les actifs là-bas dur ils ont tous les actifs là-bas est venu maintenant vous pouvez voir ce tableau de bord différentes icônes que nous avons exportés Vous pouvez voir ceci est l'icône I toutes les différentes tailles pour toutes ces icônes Vous nous avons déjà tout ce dont nous avons besoin orteil donner à nos développeurs et il est vraiment, vous savez, facile. J' ai déjà marqué Si je veux changer quelque chose, Je peux changer sur ce bouton et je peux cliquer sur l'exportation à nouveau Batch export. Il va mettre à jour tous mes éléments déjà exportés clé. C' est donc la meilleure fonctionnalité que je pense dans Adobe X'd, qui, comme ils l'ont récemment publié, j'espère que vous avez apprécié cette leçon. Si vous avez des questions à me poser, passons à la leçon suivante 66. Prévisualisation de votre application sur Iphone: D' accord. Maintenant, dans cette leçon, je vais vous parler du capital supplémentaire. En fait, vous pouvez vivre en moyenne. Prévisualisez votre APS en corrigeant votre Mac avec votre iPhone. Et c'est l'application que j'ai installée. Vous pouvez taper dessus. Et c'est la vue que vous allez voir. Il y aura trois onglets en bas. L' un est en supplément. Le document 1 est un aperçu en direct lorsqu'il s'agit de paramètres. instant, nous allons aller avec cet aperçu en direct. Assurez-vous que votre téléphone est connecté via ceci. Vous devez être ici. Vous pouvez voir que je n'ai pas agi avec l'USB de mon Mac. Donc, la deuxième fin va être avec le Mac. Ok, alors maintenant on va se mettre à la pointe. Utilisez ce bouton de prévisualisation de la vie, et vous pouvez voir qu'il va à Lourdes à partir de mon Mac. Donc, si vous regardez votre Mac, si vous regardez votre Mac ici, vous pouvez voir ici est une petite icône hors de la vie, vous villages montrant essence iPhone. Ok, donc ça doit être quand tu te connectes, ça va montrer quelque chose comme ça. Maintenant, je vais vous montrer comment vous pouvez utiliser la même carte ici. Je vais appuyer sur le journal de connexion pour le tester. Vous pouvez voir qu'il me montre le sport du cœur ici. Et je vais m'assurer qu'il est facilement capable et d'autres. L' utilisateur ne manque pas le robinet. L' Inde va bien, donc le focus de cette caméra est un peu Jaggi, donc ne t'en fais pas. D' accord ? Donc, vous pouvez voir Voici l'aperçu en direct de cette application ici. Nous pouvons également avoir un menu ouvert ce menu de la barre latérale. On peut allonger l'or. Et c'est ainsi que vous pouvez connecter votre iPhone ou n'importe quel appareil IOS iPhone 678 ou X avec votre ah , Adobe X'd avec votre Mac. Et vous pouvez également le faire avec les pros de votre Mac book. Vous pouvez le connecter avec elle et vous disputez en direct. Juste ton prototype. Ok, donc c'est une fonctionnalité que je veux vraiment que vous vous disiez. J' espère donc que vous avez apprécié cette leçon. A bientôt dans la leçon 67. Dépend de développeurs avec Zeplin: vous savez, dans ce Écoutez, nous allons couvrir la partie collaboration de la collaboration de conception signifie que vos développeurs, ils ont besoin de couleurs citées. Ils ont besoin des ombres et tout dans l'ancien cité sur les polices de caractères, la force que vous avez utilisée, ils veulent tout, chaque détail. Comme combien de distance entre ces deux éléments et tout ? Divorce Il incluait l'ancien. Il est donc plus facile pour eux de convertir votre conception en remorquage. Bien. D' accord. Pour ce faire, nous avons peu d'outils auxquels Adobe X'd a récemment mis à niveau et qui est, si vous allez dans le fichier, vous pouvez exporter vos designs sur votre Mac. Il est juste une fonctionnalité Mac seulement chaque cour et séparer le premier nous allons orteils, prendre soin de la Zeppelin et évaluer dans. Donc, si vous ne connaissez pas l'avion d'abord, vous devez le télécharger. Allons voir Zeppelin, ma fille. Vous pouvez vous inscrire compte gratuit, qui est gratuit pour une application ou une application, et vous pouvez aller à ce concepteur Simon ou quelque chose comme ça. Ah, en bas, vous pouvez voir qu'il y a une application Mac et des fenêtres, donc Ah, à droite. vers le bas. Ceci est pour Mac uniquement. Vous pouvez donc télécharger cette maquette. En outre, vous pouvez télécharger ceci. Ah Magan application Windows directement. Si vous effectuez une recherche sur Google, vous pouvez y accéder. Leurs partisans comme pomme en fille vous et vous pouvez voir il y a trois versions pour Windows et deux versions différentes pour Windows et une pour Mac. Assurez-vous de créer un compte car il va fonctionner sur la première ligne. L' APP est gratuite pour toute une vie, donc ce n'est pas une grosse affaire. Je pense que c'est une fonctionnalité très douce qu'ils ont donné cette option gratuitement, un projet actif et ah, nous allons l'essayer gratuitement. Ok, donc une fois que vous aurez téléchargé et installé leur ab, ce sera quelque chose comme ça. Ok, voici Zeppelin. J' ai dirigé le Zeppelin, et il n'y a pas de projet en ce moment. Ok, donc nous allons créer un projet, ça va être un projet américain donc nous allons créer un projet, ça va être un projet américain parce que nous avons tout conçu en points. C' était un ah, nous iPhone 67 écran de l'année. Donc, nous aurons besoin rapide gored et objective c. Selon Ok, Donc nous allons obtenir cela et créer. Et il a créé un projet pour nous. OK, maintenant je vais nommer A GP fait parce que c'est le nom de l'application réelle. Ok, alors laisse-le comme ça. Maintenant, on va aller à une lettre, Toby X'd et on va sélectionner tous les tableaux d'art. Donc, je vais sélectionner tous nos conseils d'ici avant cela, assurez-vous que vous l'êtes. Vous avez le numéro de vos écrans comme ça. Comme vous pouvez voir ou entendre 030 à 0 pour, parce que ce sera un enfer de problème si vous essayez de les trier ou essayer de les réorganiser sur Zeppelin ou tout autre pour aimer ça. Ok, donc ces outils ne vont pas aider. Donc ce que je vais faire, c'est que je vais les sélectionner tous. J' appuie sur Shift et je vais exporter Toe Zeppelin. Vous pouvez voir ça me montrant celui-là. Ce projet que je vais importer. On a conçu celui-là. Suivant. Nous allons sélectionner un prochain, et maintenant vous pouvez voir qu'il a commencé à télécharger mes écrans toe adobe de adobe XTC voir toe mon projet sur Siplin. Ok, donc on peut accéder à ces fichiers. Pourquoi y a-t-il application en ligne, qui est application Web et aussi celui-ci Vous pouvez voir que vous pouvez également exporter votre feu de croquis. Ce sera l'esprit X t chiffre pour la boutique cc. Ce sont donc quatre outils populaires de votre conception et de conception de l'expérience utilisateur qui va prendre un certain temps. Alors, je vais aux orteils. Fais vite, d' accord ? Non, je pense que tous mes écrans et tableaux d'art ont été téléchargés. Et laissez-moi voir. On va tout va bien ? Donc tout est ici. 01 chargement et tout. Maintenant, on peut régler ça. Ici est le nom par son nom ? Non. Vous pouvez voir qu'ils ont été téléchargés et triés par leur nom. Ok, vous pouvez voir que c'est la densité que j'ai conçue dans celle à côté de nous est le type du projet. Il s'agit du lien de l'application Web. Vous pouvez le partager avec d'autres personnes et vous pouvez voir ce projet en ligne et ces autres intégrations. Si vous voulez ajouter au mou, vous pouvez ajouter au mou, qui est un logiciel de communication. Et ah, nous avons ici les scènes sur Lee conçues et guidant les gardes Styx. C' est essentiellement une autre fonction hors d'eux que vous pouvez dessiner sur vos écrans si vous le souhaitez. Oh, mais on ne va pas faire ça. Ce sont les extensions ici, qui est fondamentalement la partie correspondante. Alors, quelles sont les extensions qu'ils utilisent ? Ils ont récemment je peux dire qu'ils ont externalisé leurs programmes. Ok, donc vous pouvez voir que nous avons besoin de Swift par Zeppelin et attributs. Cordes. Les deux sont pour sont les systèmes d'exploitation U S et les choses est le langage suivant pour Rus abs. OK, maintenant je vais le fermer. Si vous souhaitez explorer d'autres extensions ou ajouter d'autres extensions, vous pouvez les ajouter. Vous pouvez également les désactiver. Vous pouvez aller aux paramètres plus sur comme j'ai utilisé pour la cible de déploiement. Si vous voulez quelque chose, vous voulez changer quelques choses. Tu peux le faire ici. Ok, donc je le suis maintenant. Le propriétaire. Je peux aussi inviter les membres de mon équipe ici. C' est l'interface d'être de mon projet. Et maintenant, si vous allez à Sy Guide, que nous allons créer dans ah, quelques secondes, qui est le but principal de ce Siplin. Ok, donc ce qu'on va faire, c'est aller à celui-ci, et c'est notre rubrique principale. Nous allons donc créer notre guide de style. Donc, au cours de l'analyse de Cooder, nos développeurs peuvent facilement utiliser get this. marqué ces couleurs sur les tailles de ces textes et les différents éléments de conception des éléments , et ils peuvent rapidement l'utiliser et juste utiliser une cour de celui-ci. Ok, donc vous pouvez voir ici est la taille, et voici la couleur. Ok, donc si j'essaie d'ajouter cette couleur, vous pouvez la voir. J' ai fait ce cri de charbon de bois. Je peux aussi ajouter du charbon de bois ensuite, par ici. Quelque chose comme ça. Ok, donc ça va être comme ça alors. C' est mon textile. Je vais dire « cap » et tout. D' accord. Donc je vais l'ajouter comme ça. Appuyez sur Entrée, et il va être ajouté à notre guide de style. Maintenant, nous allons continuer à l'ajouter à notre Steiger. Allons à l'écran suivant et nous pouvons cliquer sur celui-ci. Ce sont d'autres actifs. Si vous voulez télécharger des actifs dans les agriculteurs PNG pour les trois tailles un travail supplémentaire et trois x Vous pouvez le faire à partir d'ici. D' accord. Aussi, si je double-clique, vous pouvez voir qu'il me montre cette couleur sentir. Je vais l'ajouter. C' est ma couleur primaire. Donc, ajoutez primaire à Dyn. Ok, donc la convention de dénomination utilisée principalement aux États-Unis est que commencer par une petite lettre et le prochain séparateur sera capital et le prochain séparateur sera capital. Si sombre ardoise primaire. Ok, donc tu peux ajouter des choses comme ça. Vous pouvez également ajouter, par exemple, ceci est mon alerte de lien. Je vais orteil ajouter cette lumière, peut-être lien et je vais orteil Ajouter comme ça aussi je peux ajouter dans les textiles. Ah, Blue link quelque chose comme ça. Ok, passons à l'écran suivant. Et je pense qu'on n'a rien ni tête. Et si vous voulez ajouter, vous pouvez ajouter ce texte blanc que vous pouvez voir que vous pouvez également copier le contenu de différents éléments. Donc, si je veux le contenu hors de cela, mais que je peux le copier et je peux le suivre dans mon écran ou mon logiciel selon, où j'utilise mes accords et persiste tout OK, passons à la suivante. D' accord ? Donc on peut continuer à ajouter ces couleurs, ok, à travers le pays, c'est notre deuxième régulier. On va l'ajouter. Donc, si nous allons continuer à ajouter différents styles Donc c'est notre essai de paragraphes, donc nous allons l'ajouter mal. Euh, graphique suivant. Quelque chose comme ça. C' est qu'il a déjà rassemblé la couleur, qui est ce gris anthracite. Nous l'avons déjà sauvé. Ok, maintenant, encore une chose. Si tu vas à cette rubrique, que nous n'avons pas sauvée, c'était le pied. Sauvez-le en tête 1. Alors, je vais aux orteils. Fais une petite lettre ici. Quelque chose comme ça. Ok, donc c'est notre texte à utiliser. Donc je vais au champ de texte ou ah, formulaire. Regarde, c'est un champ de texte à côté. Donc c'est notre Donc c'est notre champ de texte clé supplémentaire. Alors, oui. Donc nous l'avons fait, mais celui-ci. Donc, vous allez continuer à créer différentes couleurs et tout ici. Ceci est désactivé, mais en couleur. Et c'est notre actif. C' est notre sommeil sombre. Couleur primaire. Donc, nous allons continuer à ajouter tout. D' accord. Donc, vous pouvez également ajouter celui-ci. Ah, jamais débarquer ensuite. Ok, donc vous pouvez voir que c'est très facile pour vos développeurs d'obtenir cela. Donc tu gardes l'idée. Une autre chose que vos développeurs peuvent facilement voir est les distances entre les différents éléments. Donc, si vous cliquez sur quoi que ce soit, vous pouvez dire qu'il me montre la distance du haut, cette barre primaire à droite, à gauche, et aussi à partir du bas. Ok, donc si je planque sur n'importe quel autre élément, vous pouvez voir me détruire ce point 21. Donc, mes développeurs, ils ont réellement besoin de ces distances en points. Il sera donc très facile pour eux de, vous savez, concevoir et développer ces écrans. Ok, donc , non, on va retourner au tableau de bord et on va passer à notre guide de style. Maintenant, vous pouvez voir que c'est le cordon que nos développeurs vont vraiment aimer. C' est le cordon rapide que vous pouvez voir en haut. couleurs Swift, toutes les couleurs différentes, classes pour eux à utiliser. Aussi, vous pouvez voir ceci est notre quatrième livre, nous avons toutes les différentes rubriques et toutes les différentes formes Styles que nous avons utilisés à travers notre Si je l'ai manqué comme là, nous avons la couleur jaune et d'autres couleurs. Vous pouvez les ajouter. Cette leçon vous permet de comprendre comment vous pouvez utiliser cet outil pour, vous savez, explorer plus d'options. Maintenant, vous pouvez voir que j'ai cliqué sur l'extension et nous pouvons également voir les extensions Plus extensions hors Zeppelin. Donc, si vous travaillez sur un système Android ou autre chose, vous pourriez avoir besoin de quelque chose comme ici. Laisse-moi te montrer. Ok, donc vous pouvez voir Voici l'exemple. Exemple est fondamentalement pour les ressources android de couleurs Textiles objectif C et shift est pour U S C ss Les dit un stylistes CSS, ce sont pour le développement Web. Réagissez Ah natif, et ah chaînes attribuées en fait vraiment des chaînes. Je ne sais pas grand-chose à ce sujet, mais je pense que c'est pour moi avant le système Apple IOS de quelque chose comme ce naufragé natif est de Facebook. Il peut créer un abs natif pour iPhone et Android. Les deux systèmes ag Zamel examen allié Zimmel. Je crois que je ne sais pas grand-chose à ce sujet. Je vois Emmanuel, connu que c'est pour le développement. Ok, donc tu peux ajouter ces deux Zeppelin si tu veux. Si vous travaillez sur un projet exécutant un autre projet, vous pouvez l'ajouter et vous pouvez changer d'orteil. Change tout. C' est bon, donc vous pouvez le décocher et vous pouvez l'ajouter. Quelle tête ? Ok, donc tout est à propos de Zeppelin et comment nous pouvons utiliser Zeppelin orteil, soulager la douleur hors de nos frontières et développer cette superbe application médicale . Et j'espère que vous avez apprécié cette leçon sur ce type de style. Ceci est un tableau de bord. Si vous voulez inviter vos plus d'utilisateurs ou plus de membres de votre équipe sont vos quartiers. Vous pouvez le faire car il sera plus facile pour eux de voir les distances et toutes ces couleurs sur les guides de style dans l'ancien cité. Ok, donc tout est à propos de Zeppelin. Je pense que cette conférence devient très longue. Vous pouvez explorer plus si vous le souhaitez. Vous pouvez me poser des questions. Si tu l'as fait. Passons à la prochaine leçon où nous allons explorer l'application jamais cordon. 68. Handoff Developer: D' accord. Maintenant, le deuxième outil dont je vais parler est toujours le code, qui est similaire à Zeppelin. Mais il a quelques fonctionnalités plus, et pour moi, je pense qu'il est construit pour les développeurs de designers. Perspective. Je ne pense pas que ce soit très facile à utiliser, et il y a peu de fonctionnalités qui manquent dans chaque accord. Peut-être que c'est votre propre opinion, ou peut-être que c'est ma propre opinion, mais je pense que ça manque un peu, comme un pas derrière Sepp. Ok, donc tu peux aussi faire la même chose avec tous les tribunaux. Laissez-moi vous montrer leur site web. C' est un record et j'ai un point com et vous pouvez l'essayer pendant 14 jours. C' est un problème ici. Bien que leur modèle de prix soit très bon marché, je pense que 6,75 mois pour chaque membre de l'équipe. Ok, donc si je suis un pigiste seul, je pense que c'est un super paquet pour moi. Vous pouvez l'utiliser pendant 14 jours. Essai gratuit si vous voulez orteil. Si vous le testez. Si vous l'aimez plus que le Zeppelin, vous pouvez aller de l'avant et utiliser celui-ci. Ok, donc je vais te montrer. J' ai déjà acheté leur voiture pour vous montrer les gars dans les scores. Donc, je vais aller à mon adobe x'd je l'ai téléchargé et l'installer déjà afin que vous puissiez le télécharger et l'installer. Si vous voulez suivre le long de moi et vous pouvez voir qu'il peut également importer à O B X D fichiers et un peu Photoshopped tiré et les fichiers d'esquisse. Donc tous, il ne sport pas fig Ma, Je pense en ce moment eso Zeppelin est juste, Je pense qu'un ou deux pas d'avance sur eux. Donc je vais aller à la pointe de mon Adobe X et aller dans le dossier et exporter tous les tribunaux. OK, alors gardez à l'esprit qu'avant d'installer et d'enregistrer, cette option ne va pas apparaître parce que cette ah, cette application doit être installée sur votre dos. Ok, donc je vais cliquer sur chaque cour. Une bonne caractéristique de chaque cour est que je n'ai pas besoin de sélectionner tous mes tableaux d'art. Il va orteil détecter tout mon coeur et aller orteil. Téléchargez-les. Quoi ? Ici. Ok, donc je vais créer un nouveau projet. Alors créons un projet ici. Créer un nouveau projet. C' est un projet d'iris. Ok, donc on va le nommer. Est-ce que le projet américain est quelque chose comme ça. Créer un projet. Ok, donc il a déjà commencé à télécharger mes écrans. Ok, donc il a terminé le téléchargement, et pour moi, c'est très farce, mais ils ont des propriétés de puits différentes. Ok, donc encore une chose que ça me montre du bon côté. Cela peut montrer que je suis les propriétaires du projet ou les personnes avec qui je partage ce projet. En outre, il y a une autre fonctionnalité qui est l'activité, je ne pense pas avoir vu Zeppelin en ce moment, elle me montre l'activité de chaque utilisateur. Donc, si j'ai ah, moyenne un fichier ou quelque chose comme ça, il va montrer l'activité aux autres utilisateurs que cet utilisateur ajoute des fichiers sur cet utilisateur a ajouté une nouvelle version du fichier. Donc, cet accord M, il est aussi vous pouvez dire, la gestion du contrôle de version, ce qui est un très je dirais, problème très difficile dans la plupart de l'abside. Ok, donc c'est par nom, donc je vais au néo trié par nom. C' est la même chose que Zeppelin. En outre, vous pouvez appuyer sur le lavabo pour couler vos fichiers si vous avez quelque chose de changement et vous pouvez également partager votre fichier supplémentaire de partage de fichiers. Donc, en haut, vous avez votre recherche de paramètres de compte inviter les personnes que vous voulez inviter. C' est un projet, et c'est le fichier x'd. Je suis en ce moment ouvert. D' accord. Donc si j'essaie d'ouvrir quelque chose, laissez-moi double-cliquer. Il va télécharger des données de matière, donc essentiellement télécharge les images et d'autres données après avoir double-cliqué dessus. D' accord. Bien que je pense que c'est rapide pour moi, c'est juste une expérience utilisateur. Point de quelques-uns. Ok, donc je vais le traîner ici. Aucune chose cool à ce sujet est qu'il va vous montrer toutes les couches sur le côté droit gauche . Donc c'est mon expérience. Il s'agit du logo de la barre de surface d'arrière-plan sur les outils GP. Ok, donc si vous cliquez sur le logo ici, il vous montre la taille et les distances tout ici. Vous pouvez également voir les règles si vous voulez dessiner quelques lignes ici comme ceci et quelques marges ou guides ici pour vos développeurs, vous pouvez le faire. Ok, donc, euh, sur le côté droit, vous pouvez voir que ça me montre d'exporter ça sur le logo. Ok, Donc si ça va, ça me montre à exporter trois x deux X, mais je ne sais pas pourquoi ça me donne le problème de résolution d'exportation . Je ne vous recommande pas d'exporter vos ressources à l'aide de cet enregistrement. J' ai vu que vous pouvez dire des résultats très horribles. Je n'aime pas l'extrait. Vous pouvez dire les actifs qu'ils extraient. Ils sont très misérables sur la très faible qualité. Je ne sais pas pourquoi ils ont ça. Ah, problème. Ok, donc je ne suis pas sûr qu'il me montre que le moteur J peg B, comme avec l'optimisation est activée. Mais vraiment, vous pouvez économiser dans ces 44 minutes. Vous pouvez voir où ici, mais je ne recommande pas d'utiliser celui-ci. Ok, utilisez Adobe x de bads export pour exporter vos graphiques. Ok, Donc maintenant, si vous cliquez sur cette couche, qui est notre textile, vous pouvez voir ici nous avons vu tous les styles. Ce qui est un très pour le sport est la grande capacité quatre taille, mais c'est une Ford qu'ils ont utilisé et Si vous allez à celui-ci, vous pouvez voir tout le Gordo à l'avance. Qui dans Zeppelin il n'y avait pas beaucoup de cour disponible, mais dans ah record, j'ai vu qu'il génère des cordons pour beaucoup de différentes couches. Ok, parce qu'il importe toutes les couches avec. Donc, si je clique sur ce, vous pouvez voir ici la cour pour cela aussi le quatrième nom, taille tout. Il génère la cour, bien que vous devez copier le score mentalement. Ok, Donc vos développeurs ont besoin d'excès ici sur vous venez de télécharger et ils vont copier coller dans leur application pour construire ceci. Vous pouvez voir Voici le texte si vous voulez copier. Si vous voulez copier le texte ici, vous pouvez. C' est un accord pour générer ce style et c'est un texte. Donc, tout est à propos de ce côté-ci. Il me montre également leurs paramètres de conception. C' est celui-là. Ensuite, vous pouvez également masquer et afficher les guides des concepteurs si vous le souhaitez. Vous pouvez également effectuer un zoom avant. Zoom arrière. Je vais zoomer en ce moment. Et il y a une autre fonctionnalité Nous sommes ici sur la droite. Vous pouvez voir. Ok, donc ici dans le style, il y a encore une chose que je veux te montrer. Si vous cliquez sur ces options, vous pouvez voir qu'il y a d'autres options de différentes autres langues ah. Comme android comme le style ccs réagit, réagissez natif. Donc, si je clique sur réagir natif, vous pouvez voir qu'il me montre le code pour réagir. Natif. Donc c'est vraiment cool. Je pense qu'il a plus d'options ici, et il est plus facile de basculer entre différents styles de guillemets. Ok, donc c'est Ana, une autre chose est que si j'ai celle-là, accord, donc si j'y vais, laisse-moi te montrer. Donc si j'ai ce texto ici et que vous pouvez voir ici est le tueur. D' accord. Donc, je peux ajouter cette couleur comme une variable et je vais la nommer Gray. Excellente taxe. même chose qu'on y a ajouté. Mais il va être dans la variable ici, donc vous pouvez voir ici Nous avons une variable. Et si je clique dessus et ajoute ceci, il me montre Copier, variable, créer, extricer. Donc, il est également excellent extra partout où la même couleur est utilisée dans toute l'application. Il va montrer être cette variable. Donc, ces variables sont tout comme le style, les couleurs de guide ou les couleurs globales pour toujours court. Il est juste, vous pouvez dire un flux de travail un peu différent de ah Siplin, mais je pense qu'ils y arrivent. Ok, donc vous pouvez voir que vous pouvez ajouter toutes vos couleurs comme ça. Donc si je vais à un autre écran, peut-être comme celui-ci, Ok, donc, non, je suis à l'écran. Ok, donc si j'ajoute celui-là, c'est ma beauté des couleurs primaires et quelque chose comme ça. Donc, je vais créer une variable. Maintenant, vous pouvez voir que j'ai deux variables tueurs d'orteils ici, et OK, donc vous pouvez générer la cour à partir d'ici. Je pense que si vous cliquez dessus, vous pouvez voir que vous pouvez voir tout le cordon de ces variables. Donc, si vous continuez à ajouter toutes les couleurs ici comme celle-ci, je vais le nommer Lien bleu. D' accord. Donc vous pouvez continuer à ajouter différentes couleurs comme ceci est, euh, champ de texte, vous voyez, donc je vais continuer à ajouter des variables ici, et si vous voyez ou entendez que j'ai déjà quatre variables, et je peux créer le bien pour toutes ces variables. Donc, c'est presque la même chose. J' aime vraiment ça. Leur application montre toutes les différentes couches ici. C' est pourquoi il génère plus d'or. Ok, donc tu peux voir si je clique sur le slogan No button et y passe. Il me montre la cour pour ce qui génère ce bouton de connexion. Ok, donc tu peux voir ici. Il me montre également ce décalage d'ombre. Donc je ne suis pas sûr de ne pas être 1/4. Mais du point de vue d'un quart, je pense qu'ils n'ont pas besoin de ces actifs. Ils peuvent générer ce bouton sur la base de cette cour seulement. Ok, alors c'est ça ? Non, il y a encore quelques choses ici. Comme si c'était la main. Vous pouvez l'utiliser pour bouger les choses, et ensuite nous avons ah, cet outil de mou. Vous pouvez sélectionner différents éléments ici pour afficher, montrer quels sont les différents styles, les rejeter. Et puis nous avons ce monument. Ça va être Meiring. Tout va bien ? Donc, si j'ai essayé de cliquer sur n'importe quoi, il va modérer comme ça. D' accord ? Donc, vous pouvez voir maintenant qu'il me montre quelque chose de différent sur les tailles et les distances entre les éléments. Ils sont plus importants maintenant, et c'est aussi plus agitant. Vous pouvez ajouter des couleurs en cliquant ici comme ceci. Donc, si j'essaie d'ajouter des couleurs ici, je peux avoir différentes couleurs. Ok, donc je n'ai pas compris ce qui est le sens d'ajouter toutes ces couleurs ici. Parce que si je vais à un autre écran, laissez-moi aller à un autre écran. D' accord ? Donc, si je vais à cet écran et qu'il n'y a pas de couleurs ici, elles ne sont pas globales. Ils sont définis dans cet écran sur Lee. Donc je n'aime pas ça. Vous pouvez dire cette méthode ou un dysfonctionnement. Aussi, vous pouvez féliciter pour vos, euh, dessins. Si quelqu'un veut féliciter ici, ils peuvent le féliciter ici. Et bonjour là. C' est le commandement général. Si vous voulez la génération, vous pouvez également ajouter un ajout comme celui-ci en cliquant ici. Et ah, tu es là, il y a une erreur d' orthographe. Ok, donc je vais créer cette génération comme ça. Ok, donc il a renforcé et vous pouvez également rejoindre le statut. Vous pouvez le supprimer ou vous pouvez dire qu'il a été résolu par moi, le concepteur ou le développeur. Il y a donc beaucoup de fonctionnalités ici, dont je veux vraiment discuter. Andi, je pense que quelques autres choses me supportent encore quelques secondes. OK, donc je vais ouvrir celui-là. Et si vous allez à cette fenêtre de projet est la barre latérale gauche. Ok, donc si j'ouvre un de ces dessins, vous pouvez voir sur le côté gauche il y a le contrôle de version . Donc, c'est le contrôle de version. Donc, si j'essaie de télécharger un nouveau design ou une chaîne conçue va me montrer que c'est la version un. C' est Virgin pour laver l'entrée. Je peux les prévisualiser. Je peux ouvrir toutes les versions que j'ai ici. Donc c'est vraiment cool. Je me détruis aussi. Les informations sur le projet. Inviter à l'équipe. Copier la force du lien public. Je ne sais pas pourquoi ça se forme. C' est bon. Vous, je ne suis pas sûr de ce que c'est. Je ne l'ai pas utilisé. Et aussi l'ancien Il est celui-ci. Ok, donc ce n'est que l'information générale. Donc, il a le contrôle de version, ce qui est une bonne fonctionnalité qu'il montre toutes les couches. Et ah, vos développeurs peuvent également télécharger le fichier à partir d'ici. Ils peuvent le partager. Vous pouvez le partager avec la commande des membres de votre équipe. Inspecter. Ah, beaucoup de choses. Tu peux le faire ici. Je pense qu'ils sont sur le même Tough. Zeppelin et tous les tribunaux. Ils sont orteils créatifs. Collaborez avec vos développeurs. Je ne veux pas que cette conférence dure 30 minutes. J' espère donc que vous avez apprécié cette leçon. Si vous aimez cette vidéo ou si vous voulez vraiment en savoir plus à ce sujet, vous pouvez me poser les questions. J' espère que vous avez apprécié cette leçon et les informations contenues dans cette leçon. A bientôt dans une autre vidéo. 69. Fichiers de clichés de photohsop et Illustrator dans XD: Non. La fonctionnalité très décente de txt est qu'il peut ouvrir des fichiers Photoshopped et aussi il peut importer vos fichiers d'esquisse. OK, donc je vais essayer ça. J' ai enregistré quelques croquis et un pour les dossiers de la boutique. Donc je vais le faire si ça peut l'ouvrir, accord. Pour qu'il puisse l'ouvrir. BST forex t je vais orteil ouvrir. Voyons voir, Quels sont les styles qu'il peut convertir et à quoi il ressemble et Ok, donc assez bien ok. Vraiment bien. J' aimerais vraiment ça. C' était très rapide. Et vous pouvez voir la Quatrième Force sont les mêmes. L' arrière-plan, Il a un arrière-plan. J' avais une formation. Ok, donc c'est pareil. Ok, donc j'ai un fardeau et puis on a ce Phil, qui est Grady int ? Ok, si super cool. Tout est pareil. J' ai utilisé un ingrédient. J' ai utilisé notre dossier fiscal. J' ai utilisé l'ombre et ah, ne sais pas d'où vient l'ombre. Ok, donc si je vais à cet arrondi, Ok, donc l'ombre est aussi traduite Eh bien, donc je vais donner 10 points sur 10 sur celui-ci, alors ouvrons ce fichier de croquis dans Adobe X T et je suis ouvert celui-ci. C' est aussi très simple. Woops. Ok, donc c'est presque le même que dans un croquis. Et Ah, je pense que je suis vraiment excité par cette nouvelle fonctionnalité. Il peut tout importer. Vous pouvez voir toutes les couches sur le côté gauche et ah, ne dites pas d'accord. Aussi, nous avons ici j'ai eu quelques groupes dans mon fichier photo show. Vous pouvez voir qu'il a également importé tous les groupes. Donc c'est juste apparu récemment, je pense que peut-être quelques jours il y a un ou deux jours, j' ai trouvé ceci. Ok, donc une fonctionnalité de plus, qui est que vous pouvez utiliser l'image des bibliothèques CC dedans. OK, donc si vous avez une bibliothèque, quelques couleurs enregistrées. D' accord. Alors assurez-vous que vous allez bien, donc, comme, vous pouvez voir ici j'ai les palettes de couleurs et tous les styles de collection et de paragraphe de mon fichier Photoshopped. Je les ai sauvés ici. Vous pouvez l'utiliser dans votre cloud créatif. Ok, donc si je fais glisser quelque chose ici et que je veux remplir cette couleur ou cette couleur à partir de mes palettes de couleurs , j'ai généré des informations pour apparaître ou illustrateur je peux le faire. Et il y a une autre fonctionnalité que je vais vous montrer dans une autre leçon, qui est que vous pouvez également utiliser votre trading en direct de vos icônes ah illustrateur. Si vous concevez des icônes dans illustrator, laissez-moi voir si j'ai illustrateur ici. Ok, donc je vais créer un nouveau fichier. Je vais utiliser n'importe quoi de mobile. Ok, donc juste éclaircir quelque chose, et je vais utiliser une seule forme. Je vais utiliser une seule forme ici. AVC. J' utilise neuf points. D' accord ? Et laissez-moi me changer. Donc, je vais utiliser mental. Ok, donc je vais aller avec ce vaisseau, juste ce vaisseau, et voyons si je peux le copier et l'utiliser dans le Royaume-Uni supplémentaire. Donc, copions-le à partir des cheveux et basé sur un noble 60. C' est moi et c'est mieux Oops. OK, ça peut apporter des formes vivantes ici. Vous pouvez voir ici que j'ai dessiné cette forme en adobe, en fait. Donc, l'illustrateur adobe, qui est en fait il a beaucoup de contrôle sur les formes et les icônes. Vous pouvez créer beaucoup d'icônes dans adobe Illustrator, ce qui est un excellent outil de création de logos, icônes, tout. Vous pouvez supprimer le filtre, vous pouvez voir que nous sommes ici, et il a créé ce vaisseau. C' est donc une autre caractéristique. Vous pouvez copier votre contenu à partir d'illustrateur ou pour la boutique et le copier de lui. D' accord. D' accord. Donc, il y avait une autre fonctionnalité qui était de C C. Si vous avez utilisé votre symbole dans votre bibliothèque C C. D' accord. Donc, si j'y vais ici, ouvrez les bibliothèques CC. Et si vous avez un symbole ici dans la bibliothèque CC, enregistrez-le dans la bibliothèque C à deux heures. Bibliothèque. C' est plus de ça. Ou les cheveux. Rappelle-moi plus tard. Ok, donc je vais utiliser ma bibliothèque, et je vais l'ajouter ou siffler. D' accord. J' ai donc mon graphique ici, qui est l'illustration un. Laissons-le comme ça et je vais l'utiliser de la même manière. Ou ici. Où est ma bibliothèque sissy ? Et je vais aller à ma bibliothèque et je vais importer cette forme ici. Eso, il va réellement relier ces ? Oui. Donc, si j'essaie de changer quelque chose ici, il se reflètera automatiquement sur les cheveux. Ok, alors laissez-moi vous dire que celui-là aussi diluer celui-ci. Celui-ci, celui-là . D' accord. Donc, non, j'ai importé ma forme de ma bibliothèque. Pour un clic droit sur. Il doit y avoir une option orteil. D' accord. Donc je vais éditer celui-là par ici. Mettons fin à ça. Ou ici parce que c'est celui qui est lié. Alors, je vais aux orteils. Fermez-le, sauvez-le. Et je pense que non, ça devrait être reflété ici. Donc nous avons maintenant, voir si Ok, donc maintenant vous pouvez voir que je pense qu'il a déjà été affecté par ici. Changons-le à autre chose. C' est pour regarder celui-là. Allez, C s alors j'ai celui-là. Ok, donc ce que j'essaie de faire, c'est que j'essaie de changer l'orteil. Ok, donc ce que j'essaie de faire, c'est d'essayer de changer sa couleur. Les propriétés vont changer sa couleur en bleu. Je vais le sauver comme ça. Ensuite, fermez celui-ci et voyons ce qui se passe avec. Ok, donc il a été mis à jour ici. Je ne sais pas pourquoi il n'a pas opéré ici. Ok, alors c'est le médecin. Vous pouvez travailler votre designer. Si quelqu'un est en train de concevoir une icône, il peut travailler dans Illustrator. Et s'ils opèrent une icône là-bas, il sera reflété dans vos fichiers adobe axity instantanément sans aucun effort. Si vous utilisez ces bibliothèques, pas de bibliothèques BCC, bibliothèques cloud créatives. Ok, donc ce sont les quelques fonctionnalités que je voulais vraiment vous montrer qu'il peut importer. Ah, beaucoup de différents formats de fichiers et, ah, beaucoup de différents outils d'Adobe Family et aussi de sketch. Et ah, j'espère que vous avez apprécié cette leçon. Passons à la leçon suivante. 70. Adobe XD en avril 2018: aujourd'hui, je vais vous mettre à jour avec la dernière. Qu' est-ce qui se passe avec Adobe X T Et je voulais vraiment parler de leur nouveau plan, qui est le plan de structure et Adobe ? En fait, ils ont un boulot, une entreprise. Ils l'ont rendu libre. Donc, si vous êtes un concepteur ou développeur ou concepteurs d'expérience utilisateur. Vous devriez profiter de celui-ci. Parlez-en à vos amis et à d'autres personnes, et dites-leur que Prenez mon cours. Ok, donc c'est Adobe X T. et vous pouvez partager un prototype un et deux GP hors stockage cloud, qui est gratuit avec Adobe X'd et ah, c'est pour vous. Si vous êtes freelancers, vous pouvez facilement l'utiliser. C' est un excellent outil. Et il y a quelques autres mises à jour qui arrivent là dedans. Ma et Apple Session, laissez-moi vous montrer. Voici donc les quelques mises à jour qui sont plus tard sujets hors. Ce sera XTC. Voyez ma pomme. Je vais vous en montrer quelques-uns dans cette vidéo. Alors passons à notre adobe, en fait écran et voir quels sont les acteurs. Ok, donc nous avons à l'écran. Je dois faire des symboles ici. Quelques symboles, trois écrans, trois planches de cour, des cheveux textiles. Donc, si vous allez à cet actif, étendez-le en jetant ces actifs ici. Si vous voyez du textile ou de la pratique, je l'appellerais à juste titre. Il y a une nouvelle chose, qui s'appelle Highlight on Canvas. Donc, si je clique dessus, il va mettre en évidence le même style utilisé sur tous les tableaux d'art et mettre en évidence sont chacun hors d'eux. Ainsi, chaque instance de ce style de tracteur utilisé sera mise en surbrillance. Encore une chose. De même, vous pouvez faire la même chose avec celui-ci, donc ceci est utilisé ici. Donc, c'est le symbole va le mettre en évidence trois fois sur trois différents tableaux d'art. Donc, c'est un truc très cool si vous avez beaucoup de symboles et que vous ne voulez pas, vous savez, gâcher votre bibliothèque, vous pouvez facilement aller à eux et voir où ils ont été utilisés. En outre, vous pouvez faire la même chose avec les couleurs. Les couleurs étaient que vous avez utilisé le point culminant d'un tueur sur toile. Ils vont mettre en évidence cette couleur verte surbrillance sur toile. Ils vont mettre en évidence l'usure du texte. Cette couleur a été utilisée. Donc, c'est un très cool une nouvelle fonctionnalité. Encore une chose. Vous pouvez également vendre vos actifs comme ce correcteur de couleur, styles, symboles. Vous pouvez également rechercher dans les symboles. Par exemple, je les ai nommés symbole un. Donc, ça va juste aller aux pieds. Cherchez le symbole et il me montre ce symbole un. C' est le nom du symbole que je cherche. Donc, si vous allez ici et allez à cet écran et ah, si je vais au symbole, vous pouvez voir le symbole un symbole dans un texte. Donc c'est un super là-haut. Ils ont encore une chose que j'ai vraiment aimée. Il remplace. Vous remplacez vos symboles. Ok, donc si je veux que ce symbole sur ces trois symboles verts soit remplacé par celui-ci. Je vais juste faire glisser ça ici et partout ailleurs, il va être remplacé par le symbole un. Donc, vous pouvez voir que c'est un grand tour de magie. Si vous avez Ah, adobe x t. Vous pouvez essayer ceci. Ok, une nouvelle mise à jour est basée sur plusieurs ennuis d'art. Ok, Donc, par exemple, si mon texte est là et que je veux qu'il soit au même endroit sur tous les autres tableaux d'art , je vais le copier et sélectionner les bateaux, les tableaux d'art. Je vais sélectionner les deux cartes cardiaques en appuyant sur la commande de contrôle de changement de vitesse. Nous et vous pouvez voir qu'ils sont collés au même endroit exact où je voulais qu'ils soient, sorte que vous pouvez utiliser plusieurs tableaux d'art, et vous pouvez coller un élément ou un symbole plusieurs tableaux d'art en même temps. Maintenant, il y a une autre fonctionnalité de protection pastorale de vos spécifications de conception et de support prototypes, que vous ne voulez peut-être pas que tout le monde voie votre prototype publié. Vous pouvez cliquer dessus. Vous pouvez cliquer sur le mot de passe requis ici aussi de la même manière, pour les spécifications de conception publiées, vous pouvez exiger un mot de passe, donc ce sont les quelques nouvelles fonctionnalités d'Adobe Xt. J'espère que vous avez apprécié cette leçon. Si vous avez des questions à me poser, passons sur orteil en apprendre plus sur txt 71. Le mois de juin 2018 Adobe XD Overlays fixe: aujourd'hui, nous allons regarder l'une des plus grandes et plus de 60 mises à jour jamais, que j'étais en train d'attendre et l'une d'entre elles est ce soutien excessivement. Je vais te montrer dans cette leçon. Quelles sont les nouvelles mises à jour qui ont été récemment ajoutés toe adobe XTC C était dans des positions fixes définies . Private invite un meilleur contrôle pour les champs d'image, conception en utilisant des calculs mathématiques et, euh , sur le conseil Lissa. Donc, je vais passer à mon extra adobe. Je vais vous montrer d'abord ces deux qui sont liés au prototypage des orteils. Voyons donc, quelles sont ces mises à jour et ce que vous pouvez faire avec celles-ci et ce que vous pouvez faire de nouveau avec vos prototypes ? Ok, maintenant j'ai créé juste un prototype simple sur ces écrans et laissez-moi zoomer, et je vais vous montrer qu'il y a encore quelques tableaux d'art. L' un est ce clavier Un est cette feuille d'action pour nous. Maintenant, si vous jouez ce, hum, ce prototype et vous pouvez voir la chose très belle à ce sujet est donc si je fais défiler, vous pouvez voir que mon icône plus ceci est fixe et cet en-tête d'arrêt est fixé. Ce bas une barre de navigation ou en bas ? Jamais. Il est également fixe, et mon contenu est que vous pouvez voir se déplacer et glisser en dessous d'eux. Donc, c'est Ah, vraiment créer une mise à jour pour Adobe X T et vous allez vraiment en profiter. Donc, la plupart du temps, lorsque nous créons leurs AP mobiles ou peut-être des sites Web là en-têtes sont fixes. Donc, lorsque nous déplaçons le contenu, l'en-tête va coller au sommet. Donc, c'est la nouvelle mise à jour dans ce Juin X'd mise à jour 2018 Juin 2018 Et vous pouvez le faire avec vos éléments. Ok, donc encore une chose et trop, et je vais te montrer. Donc si j'y vais, je vais appuyer sur cette icône plus. Vous pouvez voir que c'est sur moins d'écran de sorte que vous pouvez utiliser la même superposition dans plusieurs tableaux d'art différents et laissez-moi vous montrer à nouveau. C' est superposition. Et si je vais au deuxième écran, vous pouvez voir ici C'est mon deuxième écran et vous pouvez voir le correctif de Saleh Mantis, mais d'autres se déplacent. Donc, si je clique sur celui-ci, c'est que c'est une autre superposition. Alors j'attendais celui-là. Ainsi, vous pouvez superposer n'importe quel élément au-dessus de n'importe quel autre art. Et vous pouvez utiliser cela trop plusieurs fois une seule superposition dans différents ennuis d'art. Ok, donc je vais te montrer comment tu peux faire ça. C' est donc très facile. Je vais créer un nouveau document ici. J' ai trouvé 678 et nous allons zoomer sur le contrôle ou la commande zéro. Et ce que je vais faire, c'est que je vais créer ah, en-tête fixe, et c'est très simple. Et les orteils le remplissent d'un peu de couleur. Rendons-le rouge et retirons la bordure. Ok, donc voici vous pouvez voir qu'ils ont ajouté sur la position fixe du côté droit, donc cela va le rendre réparé. Et une autre chose que vous devez vous rappeler dans ce panneau de dentelle gauche, l'ordre hors de la liste a également de l'importance. Donc, si vous calquez le haut, cela va être corrigé. Arrête. Il l'avait. Donc je vais le nommer comme ça. Et maintenant ce que je vais faire, c'est que je vais mettre du contenu juste pour apaiser cette ligne plusieurs fois. D' accord ? Donc nous l'avons ici. Nous avons des lignes différentes. Maintenant, assurez-vous que votre haut Heather, il va être au sommet. Donc, je vais le déplacer dans le haut dans la pile de couches parce qu'il y a un défilement des orteils en haut de ces lignes. Ok, donc c'est que tu dois t'en assurer. Et Ah, ce que vous pouvez faire, c'est si vous savez, appuyez sur ça, juste vous arrêter. Il n'y a rien qui se passe. Donc nous devons réparer une autre chose que nous allons rendre cet art un peu plus gros comme ça ici. C' est faire comme OK, donc si vous pouvez voir cette ligne bleue dans cette barre, c'est loin de définir votre tableau de vue. Ok, alors laisse-moi te montrer. Donc vous pouvez voir ici nous avons la vue. Le réglage du port est 2667 Donc si j'essaie de déplacer cela, il va bouger. C' est donc une autre nouvelle fonctionnalité qu'ils ont. Je n'ai pas eu de versions récentes. Ok, donc maintenant si j'essaie de le jouer, vous pouvez voir que j'ai une barre de défilement, et vous pouvez voir que mon contenu va être derrière cet en-tête fixe supérieur Okay, alors ajoutons un peu Shadow pour que nous puissions voir correctement ce qui se passe sur ici. Donc je vais avoir une ombre sombre qui va se répandre, comme 30 gros Oezil ou 30 points par ici. Ok, donc je vais savoir jouer et vous pouvez voir comment il se déplace derrière ça. Ok, donc c'est vraiment cool fonctionnalité. Vous pouvez également faire l'effet sanguin de fond avec elle. Donc, si vous avez une image avec des cheveux et que vous avez un flou d'arrière-plan ajusté à celui-ci, vous pouvez également faire le fond noir. D' accord. Alors assurez-vous que votre en-tête est en haut ici. Ou n'importe quel élément fixe que vous voulez. Toby sur le dessus. Vous, il doit être dans le haut dans le proche espagnol. Ok, donc c'est une fonctionnalité, donc la prochaine que je vais te montrer est trop OK. Donc ce que tu peux faire, par exemple, si je me laisse aller à ça, nos nôtres, tu le réveilleras, ok ? Maintenant, vous pouvez voir que j'ai ouvert le réveil de vous pour nous. Et ce que je vais faire, c'est que je vais utiliser certains des éléments d'ici, par exemple. Et ce sont toutes ces boîtes de message. C' est donc une feuille d'action. Je vais contrôler les orteils. Tu vois ? Ou commande. Voir toute la feuille d'action ici. Et je vais aller aux pieds. Fermons celui-ci. Ok, donc nous l'avons. Basons ça ici. Ok, donc c'est ma feuille d'action, et vous pouvez voir qu'elle est dans la plinthe. Donc, si je vais à l'arrière de ce design, vous pouvez dire, c'est notre planche. C' est Spaceport. Donc ce que nous devons faire, c'est d'en faire un tableau d'art d'abord. Ok, donc c'est comme ça que ça va marcher. Donc je vais appuyer sur les orteils 678 et vous pouvez voir ici qu'on l'a dedans. Faisons ça comme ça et sache ce que je vais faire, c'est ici. Je vais ajouter un bouton, peut-être quelque chose comme ça ici. Fais juste un bouton bleu. C' est ça. Cet exercice est juste pour vous montrer ce que vous pouvez faire avec. J' ai donc créé un bouton ici sur cette zone, et je vais aussi le faire pour l'expédition. Donc ça va être réparé ici et en haut. Ok, donc, euh donc maintenant on va aller au prototype. C' est là que nous allons faire la magie. Je vais donc le lier à cet écran. Et plutôt que de la transition, je vais le faire trop. Ok, donc maintenant vous pouvez voir sur le côté gauche il vous montre où vous placez votre trop . Ok, Donc si vous avez une petite taille là-bas comme vous pouvez voir qu'il prend toute la taille de la toile sont notre vue entière. pores. Si vous avez un port de vue plus grand, vous pouvez le déplacer de haut en bas. D' accord. Donc si je le déplace ici, vous verrez que je peux le déplacer vers le bas ou je peux le déplacer vers le haut. Donc je vais le déplacer comme ça. Ok, alors modifions la transition. Overly dissoudre est sorti. Ok, donc c'est créer. Même si vous voulez le soutenir par le bas, c' est nous allons ah, allons le faire glisser vers le haut. Donc je vais utiliser Slide Up maintenant. Nous allons jouer et laissez-moi vous montrer comment ça va pour que vous puissiez voir qu'ils glissent du bas comme ça. Et aussi vous pouvez voir du haut il est en dessous un peu. Je l'ai ajusté, mais c'est vrai, mais je pense que vous devriez prendre tout l'écran. Et c'est juste pour la démonstration. D' accord ? Maintenant, quel est le bénéfice de ça ? Donc, nous avons plus de bail. Donc, si j'ai un autre tableau d'art comme celui-ci et que j'ai un autre fardeau ici, qui est , par exemple, celui-ci et qu'ils veulent aussi le lier à la même feuille d'action, je veux juste qu'il soit lié à celui-ci, et je vais les orteils, faire glisser vers le haut, et c'est tout. Ok, donc maintenant vous pouvez voir que je peux l'utiliser plusieurs fois sur différents écrans. Donc je n'ai pas besoin de, vous savez, euh, dupliquer mon tableau d'art plusieurs fois. Donc, si j'ai un composant qui peut être utilisé sur d'autres écrans ou il peut trop d'autres écrans, peut-être l'action tricher quelques options plus, donc je peux le faire en appuyant simplement sur ce bouton et en le rendant trop donc C'est notre trop et nous pouvons l'utiliser plusieurs fois dans nos prototypes. Ok, donc c'est ce sont l'un des plus puissants, je pense que les mises à jour offrent d'être extradées. Pourtant, je ne suis pas sûr de l'avenir, mais en ce moment, c'est la meilleure chose. Je pense que vous pouvez obtenir d'Adobe 61. Est-ce corriger la pollution et visser le contenu ? Il fait défiler derrière elle. Et l'autre est que ce trop éléments Vous pouvez également superposer vos claviers et d'autres éléments si vous le souhaitez. Oh, donc c'est tout ça. Je vais vous partager avec vous un peu plus de mises à jour qu'ils ont fait leur pas très significatif dans la prochaine leçon. Ok, donc j'espère que vous avez apprécié ce nouveau prototypage. Belles mises à jour de prototypage d'adobe X t et à bientôt. Dans une autre leçon. 72. Révisions de masse de juin 2018: Maintenant, nous allons regarder quelques mises à jour supplémentaires qu'Adobe X a fait en juin 2018. Et l'un d'eux est un calcul fou par ici. Ok, donc si je le multiplie par 1,5, vous pouvez voir que je vais avoir la prochaine hauteur. Donc c'est très cool. Tu peux le faire. Par exemple. Je vais le moins avec 58, il va le déplacer vers le haut. Ok, donc c'est vraiment cool. Vous pouvez faire des calculs mathématiques sont ici, où l'il est très serré et l'exposition. Et pourquoi écarter cet élément ? Donc c'est un de leur côté. Il y a encore une mise à jour. Donc, si vous allez à ce prototype de publication, si vous cliquez dessus, vous pouvez voir un nouveau lien privé dans une meilleure version. Donc, si vous cliquez dessus, vous pouvez voir que vous pouvez mettre le titre ici et créer un lien privé que vous pouvez partager avec vous notre spectacle avec une ou deux personnes en privé. Ok, donc ça ne va pas être global pour tout le monde. Vous pouvez également créer um vous pouvez voir que vous pouvez également inviter ici. Vous devez publier la partie I avant d'inviter les gens. Ok, donc, hum, vous pouvez créer ce lien privé. C' est une nouvelle fonctionnalité qu'ils viennent d'ajouter ici. Ok, maintenant, la troisième mise à jour, ce qui était très ennuyeux Première au début. Donc, si vous essayez de créer une ellipse ici sur un cercle par ici, le problème est donc si j'essaie d'apporter une photo ou une image ici, par exemple, ce gars. Donc si j'essaie de le coller ici comme ça, en utilisant une mosquée. Donc, dans la version plus laide avant cela, vous n'étiez pas capable de déplacer cette image. Maintenant, vous pouvez double-cliquer dessus et vous pouvez le déplacer comme ça. Vous pouvez ajuster la hauteur et la taille n'importe quoi. Donc c'est, je pense, fonctionnalité très nécessaire qui manquait dans la première version de celui-ci. Les versions avant cette mise à jour de juin 2018 et je l'adore vraiment. Pour que tu saches. Il vous suffit de glisser et de déposer votre image dans n'importe quelle zone. Par exemple, celui-ci et vous pouvez simplement le faire glisser comme ceci et le déplacer comme ceci. Ok, donc ça va aux pieds. Clip ça à l'intérieur. Cette zone, et vous pouvez facilement éditer en double-cliquant et en ajustant votre taille quelque chose comme ceci. Ce sont donc les quelques mises à jour qui sont très cool. J' adore celle-là. C' est vraiment cool. Ainsi, vous pouvez facilement une date votre mosquée de film ou Phil Phil Image Mosquée forme ici. Et vous pouvez aussi faire des calculs mathématiques ici. Et l'un est ce prototype publié avec Link privé. Ce sont donc toutes les mises à jour de juin 2018. J' espère que vous avez apprécié cette leçon et j'espère que vous allez adorer ces mises à jour. Quelques-uns d'entre eux. Je les aimais vraiment. Une ombre me manque encore ici. Je ne sais pas quand ils vont. orteil avait une ombre de plus sur les cheveux ou plusieurs ombres. J' attends ce jour là. J' espère que vous avez apprécié cette leçon. Passons à la leçon suivante. 73. 06 d'ordres d'empilage 2020: Dans cette vidéo, nous allons en apprendre davantage sur les dernières fonctionnalités d' Adobe XD, qui est l'empilage. Maintenant, empiler, comme vous le savez déjà, cela signifie que nous allons mettre nos choses en haut et en bas et ensuite nous pouvons les réorganiser. Alors comment cela fonctionne réellement. Nous allons donc créer quelques-uns des groupes. Donc, cela fonctionne avec des groupes. Par exemple, j'ai cette ligne ici. Enlève la bordure. Et je vais cliquer dessus comme ça bleu. Et puis je vais créer une taxe ici. Et faisons-en 12 pixels par ici. Donc ça va être notre commande de groupe ou contrôle g. Et puis je vais le répliquer. Ok, maintenant vous pouvez voir que nous avons six groupes ici gauche, vous pouvez voir que nous avons six groupes, le groupe 123456. Non, je vais les regrouper dans un autre groupe juste pour contrôler leur empilement. Donc commande et contrôle G, Ceci est notre, appelons-le groupe maître. Maintenant, vous pouvez voir que nous avons créé ce groupe de monstres. Maintenant, nous allons cliquer sur sélectionner ce groupe MOSFET et activer notre empilage. Nous allons donc cliquer ici. Et c'est notre empilage de haut en bas, de droite à gauche. Donc, en ce moment, nous sommes de haut en bas. Donc, nous allons rester avec la pile verticale. Et vous pouvez voir ici, si j'essaie de cliquer et de cliquer et de sélectionner ceci et de le faire glisser ici, vous pouvez voir qu'il est en train de changer la position avec le second. Maintenant, si j'essaie de déplacer celui-ci, déplacons-le ici. Il va s'en tenir à la position où le dernier était encore. Je peux l'utiliser à nouveau. Appuyez et maintenez la touche Maj enfoncée, sorte qu'elle passe dans la ligne. Donc aussi vous pouvez voir ici, vous pouvez réduire la distance entre deux groupes ici comme ceci. Vous pouvez vous voir devant, la disposition et la distance ou l'espacement des cheveux avant et après. Donc, vous pouvez enchaîner ces frais généraux. Donc si on sélectionne celui-là, ok ? Donc, c'est comme ça que fonctionne l'empilage. Maintenant, dans chaque fois que vous concevez, vous pouvez avoir la barre de navigation supérieure. Vous pourriez avoir quelques zones en vedette ici, des images ou quelque chose comme ça. Donc vous pourriez avoir d'autres groupes ou ici, peut-être vous pourriez avoir une image ici, par exemple, comme celle-ci. Donc, vous pourriez avoir un rectangle. Voici donc quelques images. Je vais glisser et déposer un cheveu imageable sur ma flèche vx t. Copions ça ici. Revenons aux oreilles, aux sphères et double-cliquez dessus. Et vous pouvez voir que c'est notre image. Donc si je veux le déplacer, vous pouvez voir ici, je peux facilement le déplacer. Donc, cela est vraiment utile, vraiment, vraiment utile si vous voulez changer la mise en page de votre application mobile ou de votre site Web. Vous voulez déplacer certaines sections vers le haut et vers le bas. Vous pouvez le faire en un instant. Donc, c'est vraiment utile. De nouvelles fonctionnalités empilage, vous pouvez changer l'ordre à coller vertical à celui où nous avons cet empilement ici. Dans cet ordre. Vous pouvez voir ici maintenant il a été, la mise en page a été modifiée. Alors nous allons changer la taille de la, notre emprunteur ici. Zoom arrière un peu. Et maintenant vous pouvez voir si je veux changer l'ordre, je peux le faire comme ça. Donc, c'est en fait l'empilement horizontal. Et la première que je t'ai montrée, la verticale. Vous pouvez également avoir un peu de rembourrage autour comme ça. Donc, c'est toute la section. Vous pouvez ajouter un peu de literie. Vous pouvez voir si j'essaie de réduire le rembourrage, c'est un rembourrage sur tous les côtés de ce groupe MOSFET, tout cet ordre d'empilement. C' est ainsi que vous utilisez l'empilage horizontal ou vertical dans Adobe XD. J' espère que vous avez apprécié cette leçon. C' est la dernière fonctionnalité des lasers récemment introduite en 2020, je pense. Passons donc à la leçon suivante pour en apprendre davantage.