Transcription
1. Intro: Salut, je m'appelle Rob. Je travaille dans une petite entreprise de conception et de développement Web que cette entreprise je conçois des sites Web. Donc ce que je vais faire, c'est travailler avec un client pour avoir une idée de ce qu'il cherche. Ensuite, je vais créer une maquette en fonction de ce qu'ils veulent, et ensuite je vais aller et venir avec eux sur la maquette, peaufiner jusqu'à ce qu'on arrive là où le client veut. Et puis je me suis retourné à notre équipe de développeurs et je reste avec le projet en tant que
chef de projet pour donner vie à la conception des orteils. Donc, dans ce cours, ce que je vais couvrir est une introduction à la conception de sites Web. Plus précisément, nous allons concevoir une page d'accueil, puis aussi une introduction à l'utilisation d'Adobe X D. Donc, pour les personnes qui conçoivent des sites Web depuis un certain temps, espérons que vous pouvez obtenir quelque chose de l'introduction à Dobie X'd. Si vous n'êtes pas familier avec ce programme, et pour les personnes qui n'ont pas d'expérience, cela devrait être suffisant pour vous aider à concevoir des sites Web dans Adobe X'd. Donc je suis excité à propos de ce cours, et j'espère que vous apprécierez tous. Commençons
2. Étiquettes vidéo: Alors j'ai mis ces lunettes pour que, genre, j'ai touché une intro. Je veux que les tribunaux soient utiles aux personnes qui ont de l'expérience dans la conception de sites Web et aux personnes qui y sont également nouvelles. Donc, pour faire en sorte que les gens qui ont déjà de l'expérience ne passent pas par, euh, choses qu'ils savent déjà pour qu'ils puissent simplement sauter aux vidéos qui sont axées sur Xd. J'étiquette toutes ces vidéos compétence X'd. Donc, si vous êtes un designer expérimenté et que vous voulez juste apprendre un peu sur X d, je vous recommande juste de sauter à ceux-ci et,
euh, euh, ce serait génial si vous complétez les projets, et je pense que cela vous aidera à vous rappeler ce truc. Mais je ne pense pas que vous ayez probablement besoin de regarder toutes les vidéos de design. Et si votre nouveau je vous recommande de passer par le tout et certainement faire le projet , parce que vous pouvez l'aider pendant le projet va juste vous aider à tout apprendre. Vous pouvez également l'utiliser pour démarrer votre portefeuille.
3. XD dans l'écosystème: Il y a beaucoup d'outils de conception là-bas, et je veux juste donner un aperçu de l'emplacement de X'd. La plupart des outils conçus. Faites l'une des deux choses que vous les utilisez pour concevoir. Ah, moque-toi ou utilise-les pour prototyper tes simulations que tu as fait un autre programme. X D fait les deux choses dans un programme assez unique. Teoh dans les outils de conception existants sur une autre chose à propos de X'd, où il s'intègre dans un système dhobi. Jusqu' à il y a X'd, nous n'avions pas vraiment quelque chose qui était adapté à la conception de sites Web. Beaucoup de gens ont utilisé photo shop pour concevoir des sites Web, mais photo shop est un outil conçu pour éditer des photos. Il y avait une tonne de choses qu'il n'avait même pas là. C' était un peu maladroit. Il en faut beaucoup plus. Un ordinateur beaucoup plus puissant que X'd fait donc X'd a juste adapté juste pour la conception de sites Web et APS. Donc, à cause de
cela, c'est beaucoup plus rationalisé. Vous pouvez bouger beaucoup plus vite, et puis ,
oui, j'aime X d. Allons commencer à apprendre à ce sujet
4. Prototypage: nous allons couvrir comment faire un prototype dans cette série comment faire un prototype dans D. Nous ne allons pas réellement en construire un complet, mais vous devriez vous apprendre les concepts afin que vous puissiez construire à partir de quatre prototypes si vous le vouliez. Cependant, nous ne traiterons pas de la façon de tester votre prototype. Ce serait une toute autre vidéo. Chez Siri. Donc on ne va pas inclure ça dans ça. On en couvre déjà assez. Une chose avant de vous montrer comment créer un prototype en X que je voulais aborder est une sorte de raisonnement derrière les prototypes. Juste pour que vous ayez des antécédents si vous n'êtes pas familier avec ça. Donc, la raison pour laquelle vous pro type de site Web est parce que c'est qu'il est long et coûteux de coder. Ah, site web. Donc, afin de limiter votre risque avant de faire cet investissement complet, codant le site Web. Vous pouvez créer un prototype beaucoup plus rapidement, euh, et à moindre coût, puis coder un site Web pour que les gens construisent le prototype,
puis ils feront des tests utilisateur et ils s'assureront, soit soit ils confirmeront que leur conception va fonctionner et qu'ils sont fixés, ils l'enrobent ou plus probablement, nous allons probablement découvrir quelques problèmes. Ils résoudront ces problèmes dans le test du prototype et continueront à passer comme ça jusqu'à ce qu'ils aient résolu autant de problèmes qu'ils pensent raisonnablement que possible avec le prototype, puis ils poursuivront leur développement. Le prototypage n'est donc qu'un moyen de réduire les risques. Et, euh, assurez-vous que ce que vous construisez va vraiment marcher pour ce qu'elle voulait, Teoh.
5. Utilisez le prototype: prototypage consiste essentiellement à construire une version rapide du site Web afin que vous puissiez le tester avant de mettre tout l'argent dans le revêtement. C' est maintenant ce que X D est conçu pour faire avec sa future fonctionnalité de prototypage pour construire ces prototypes. Mais j'ai découvert que vous pouvez également utiliser des prototypes pour faire en sorte que vos clients sur des idées ou des orteils ou pour obtenir des projets à travers le processus de demande de propositions. Donc, parfois, ce que nous ferons c'est plutôt que de dire, il y a une demande de propositions qui appelle ah, vous savez, un peu se moquer. Donc, plutôt que d'envoyer des images avec notre proposition,
ce que je vais faire, c'est tout ce que je vais créer des prototypes dans X d et ensuite envoyer des liens vers ces derniers aux clients. Allez, allez, allez voir comment faire ça dans une vidéo plus tard. Mais fondamentalement, les clients cliquent sur ces liens et ils peuvent faire défiler, et peut-être qu'ils peuvent cliquer sur quelques choses, et je pense que, vous savez que cela peut vraiment aider les clients à comprendre votre vision. Il est beaucoup plus facile de montrer aux gens des choses qu'il est d'écrire des choses et d'essayer de faire comprendre aux
gens à travers votre écriture, donc je pense que les fonctionnalités X'd adobes utiles pour le prototypage. Mais je pense que c'est aussi utile pour expliquer vos idées et concepts aux clients.
6. Inspiration et processus: Donc, quand je conçois un site web, la première chose que je dio est que j'ai parlé au client, et je leur demande habituellement de me donner, um, 3 à 4 sites Web qu'ils aiment, qu'ils aiment le look et la sensation de. Et à partir de là, je vais examiner ces sites et ensuite aussi regarder, naviguer moi-même pour les sites qui, je pense, tombent en quelque sorte dans cette zone. Et puis sur Lee, juste prendre des notes. Je ne commence pas à esquisser les choses après. J' ai l'impression d'avoir une bonne idée de ce que le client aime, que je commence à réfléchir à la façon dont je peux prendre ça et s'adapter à leurs besoins. À ce moment-là, je commence à esquisser, et quand je fais des esquisses, je ne regarde pas directement les sites que les clients m'ont donnés ou les sites que j'ai trouvés pendant que je naviguais. Je le fais parce que cela m'aide juste à m'assurer que je crée quelque chose de nouveau, que je ne copie pas, quelque chose que je ne copie pas. Un site que le client aime parce que je veux dire d'abord, vous savez, vous ne voulez pas voler le travail des autres, et deuxièmement, je veux dire, même si les clients aiment ce site. Ils ne veulent probablement pas que ça regarde. Ils ne veulent vraiment pas que leur site ressemble exactement au site qu'ils veulent. Ils te payent pour faire quelque chose d'unique. Donc, je trouve que ça m'aide à le faire si je n'ai pas vraiment le site tiré vers le haut quand je croquis parce que vous connaissez mes souvenirs en parfait. Et même si j'essaie, je ne peux pas recréer sans l'avoir devant moi. Alors c'est ce que je fais. Après avoir eu de l'inspiration, je commence à dessiner ce que j'aime, puis je passe à X d et je commence à marquer.
7. Croquis: d' accord. Donc, comme je l'ai dit, euh, je commence par obtenir des sites des clients et regarder ces sites. Et puis je fais aussi de la navigation sur mon propre pour trouver des sites similaires. Et tout le temps que je fais cela, je pense dans mon esprit comment je peux appliquer des idées et des concepts dans ces sites aux
sites clients . Et j'essaie de le faire d'une manière différente de ce qu'on fait sur ces sites. Donc, une fois que j'ai quelques idées, je vais à mon cahier et je commence à dessiner des choses. J' utilise habituellement un stylo. Cela m'aide à avancer rapidement et à ne pas être trop obsédé par les détails, car ce n'est pas vraiment productif lorsque vous esquissez la plupart du temps. Vous voulez dire ça jusqu'à ce que vous arriviez à X et que vous commenciez à faire de la maquette. Donc je pensais qu'on faisait juste quelques croquis pour que tu puisses voir un exemple de ce que je fais. Donc, je commence généralement par faire la première section qui montre au-dessus du pli. Alors j'aime dessiner. C' est là que j'ai à peu près le rapport de la première section au-dessus du pli. Et puis j'ai mis quelques lignes pour représenter les éléments du menu et ensuite je vais juste faire un cercle pour le logo. Et puis nous avons un grand appel à l'action pour que je veuille m'assurer que c'est clair. Et puis je veux avoir un bouton pour que les gens cliquent s'ils aiment notre appel à l'action et qu'on a
besoin d'un moyen de rompre, briser la section suivante. Donc ça pourrait être juste une ligne droite. Mais, tu sais, c'est peut-être une ligne incurvée, donc je vais juste aller de l'avant et à travers une ligne incurvée là-dedans pour l'instant. Et puis je commencerai. Je vais passer à la section suivante. Donc j'aime travailler dans des sections genre de. Dis-nous juste de
penser à m' assurer que je couvre tout et ensuite,
euh,
çam'aide à ne pas être submergé. assurer que je couvre tout et ensuite,
euh, ça S' assure que j'ai couvert tout ce dont j'ai besoin. Teoh. Alors cette section, on va en quelque sorte étendre la ligne Kirby sur cette section sera quatre personnes qui n'ont pas encore été convaincues par cette section. Peut-être qu'ils étaient un peu nerveux sur la façon dont les choses se passaient. On va arriver. On va leur expliquer comment les choses se passent dans cette prochaine section pour leur expliquer le processus. Donc nous allons le faire par pas, donc il y aura une boîte pour l'étape 1 et ensuite ces lignes représenteront le texte expliquant l'étape 1, mis en air par ici. Donc, après vous étape quand vous allez à l'étape deux, puis vous étape trois et puis vous avez terminé et j'espère que vous voulez vraiment orteil vous convaincu à ce stade, Donc peut-être faire va mettre un autre bouton d'action d'appel ici. Peut-être pas. On verra. Ça pourrait être un peu exagéré, euh, quand il allait à la section suivante sur. Et je pense que c'est une bonne idée de montrer aux gens derrière les sites. Donc on va mettre la photo des clients ici. Peut-être que ce n'est pas la photo des clients. C' est peut-être une excellente destination de voyage qui va inspirer les gens. Et ça va être à propos du client et de leur service. Alors mettez des lignes, du texte et puis en espérant vraiment que d'ici là, les gens sont convaincus qu'ils veulent s'
inscrire pour cela. Donc on va mettre l'inscription, se
former ici. Donc c'est pour leur nom. Et puis on aura leur email, puis un bouton de soumission. Alors on aura un pied de page. On ne va pas détailler ça en ce moment, mais on veut s'assurer qu'on se souvient de mettre un pied ou là dessus. Et donc c'est une sorte de ce que je mon processus Non, avant que je passe à x d fasse normalement est de faire, genre, probablement cinq ou six comme ça, juste expérimenter avec des idées différentes. Je trouve ça avec le stylo et le papier. Je pourrais bouger beaucoup plus vite que je ne peux, même dans le prochain D et aussi juste une sorte d'aide mes idées à circuler plus rapidement et en douceur. Donc j'aime Teoh avoir quelques concepts et puis une fois que j'ai quelques concepts, je vais choisir un couple que je pense aimer. Et puis je vais aller à X de et me moquer d'eux. Et vous pouvez voir que j'ai gardé ces petits et la raison pour laquelle je l'ai fait c'est parce que je trouve que , , en utilisant un stylo, ça m'aide juste à bouger plus vite si je le rends plus grand que je suis tenté de dire, ,
en utilisant un stylo,
ça m'aide juste à bouger plus vite si je le rends plus grand que je suis tenté de dire,
tracer des lignes ici. Tu sais, je commence à écrire ce que chaque élément de menu va être, et puis peut-être que je commence à essayer,
genre, en fait, de dessiner le logo et,
vous savez, vous savez, laisser tomber les boutons et de mettre la taxe et écrivez l'appel à l'action. Et ce n'est pas vraiment nécessaire à ce stade. Dans mon processus, au moins je veux juste trouver des concepts, des idées. C' est un peu comme apporter du stockage pour moi, et ensuite je vais entrer dans les détails quand j'irai dans X'd. Très bien, donc c'est à peu près comme ça que je fais. Comme je l'ai dit, j'en fais quelques autres avant d'y aller. D. Donc, ce que je vous recommande de faire maintenant est de faire je veux dire, je dirais 3 à 5 concepts, donc vous voulez que tout le monde soit différent. Euh, donc tu as différentes choses, réfléchis à
Teoh, puis choisis. Choisissez votre favori et prenez cela et utilisez cela comme base est que nous apprenons comment orteil se moquer les choses à la prochaine D. Alors allez-y et faites quelques croquis, téléchargez-les dans la zone des projets, puis passez aux vidéos suivantes
8. Choisir un projet: le projet que nous allons faire au cours de ce cours consiste à créer une page d'accueil d'un site Web. Ce que je vais faire, je vais juste créer un client fictif sur mon client fictif. Ils ont un site de voyage, et ce qu'ils font, c'est qu'ils vous contactent, c'est et ils créent une expérience de voyage pour vous. Disons que vous voulez passer des vacances tropicales. Tu sais, tu leur dis ton budget, tu leur dis quel genre de nourriture tu aimes et tu n'aimes pas, euh, et quand tu vas aller dans ce genre de choses. C' est un peu comme un agent de voyage qui slash concierge. Donc ça va être le concept derrière le site sur lequel je vais faire. Comme je l'ai dit, c'est juste inventé. Donc je vais juste m'amuser avec ça et j'espère que tout le monde en appréciera. Euh, ce qui est de trouver quelque chose pour votre projet sur recommander de faire quelque chose similaire, peut-être que vous avez juste une idée. Tu veux en quelque sorte le tester et inventer quelque chose, rattraper pour le plaisir. Ou peut-être que vous avez un ami qui a une idée, et que vous voulez vous moquer de ça pour eux. Ou peut-être que vous connaissez un site Web que vous aimez, mais vous pensez que le design pourrait être amélioré ? Prenez ça, prenez ce site et puis redessinez-le pour ce projet ou dernière idée que je voudrais en quelque sorte jeter il y a peut-être un site Web que vous aimez vraiment la conception de vous, vraiment comme comment il est mis en place. Et puis peut-être que vous voulez juste jouer que peut-être vous voulez appliquer cela à une autre industrie . Ou peut-être que tu veux jouer ça d'une autre façon. Donc ce sont des idées que je dois vous faire commencer à trouver le projet vous-même. Eso. Pourquoi ne pas aller de l'avant et le projet de conflit, puis aller de l'avant et télécharger quelques notes sur ce que vous prévoyez de faire dans la zone des projets, puis passer à la prochaine vidéo
9. Charger des projets: Donc le projet pour cette classe va être de concevoir une page d'accueil d'un site web. Donc on ne va pas faire toutes les pages parce que ça va juste, c'est un peu trop pour la portée de cette vidéo. Ça va te prendre du temps, donc on va juste faire la page d'accueil, et je t'encourage à commencer sur la page d'accueil dès que nous commencerons sur les
vidéos X D dès que nous commencerons à dessiner, j'encourage vous de faire ce que je dio à votre manière après avoir regardé ma vidéo. De cette façon, vous le faites étape par étape, puis lorsque vous créez des choses, veuillez les télécharger dans l'espace du projet. Je pense que ça va vous aider à obtenir plus de commentaires sur votre travail au fur et à mesure que vous allez. Et puis je pense que ça va aussi t'aider à le faire au lieu d'attendre jusqu'à la fin . Et puis tu dis que, Oh, mon Dieu, j'ai toutes ces choses. Je ne me souviens pas de ce que je suis censé faire. Si vous faites une des fois, je pense qu'il y aura plus facile à gérer. Et puis cela vous aide aussi à mieux l'apprendre. Elle le fera tant que c'est encore frais dans votre esprit. Donc, je recommande après la moitié de regarder chaque vidéo où il y a quelque chose d'une compétence sur laquelle vous pouvez agir, que vous preniez des mesures dessus et ensuite que vous ayez téléchargé un projet ZA. Et puis nous pouvons voir l'ensemble de votre processus lorsque vous allez de la cueillette des couleurs à l'esquisse précoce maquettes, finaliser les
orteils et le prototypage. Donc, euh, c'est mes pensées sur les projets. J' attends avec impatience ce que vous créez tous. Commençons.
10. Obtenir le XD: Donc, la première étape dans l'utilisation de X D est, bien
sûr, et de le vendre sur votre ordinateur. Euh, je vais surtout te laisser ça. Je ne suis pas vraiment un expert dans ce domaine. Je ne sais pas quel genre d'ordinateur vous avez et ce genre de choses, mais je dirai que si vous ne l'avez pas déjà, vous n'avez probablement pas besoin de vous inscrire pour une version payante d'Adobe CC dès maintenant. Vous pouvez probablement obtenir un essai gratuit pour, comme, je pense, semaine ou 14 jours et ensuite voir si c'est quelque chose que vous aimez vraiment, ou je ne sais pas si ça va encore se passer. Mais quand cette vidéo a été faite, euh oh. On offrait un X'd
gratuit, gratuit. Vous n'aviez pas à payer. Donc, j'espère qu'ils vont continuer. Vous voulez payer, Alors allez-y et obtenez un X D installé. Si vous ne l'avez pas déjà installé, puis nous allons passer à autre chose. Teoh. La première vidéo sur la façon d'utiliser X'd
11. Interface XD: D' accord. Ici, nous avons le premier écran que vous voyez quand vous ouvrez. Prochain de ah, juste montant se passe ici. Vous avez vos dossiers récents ici. Vous avez des kits qui remonteront plus tard. Vous devez tutoriels et la ressource est. Mais ce dont nous avons vraiment besoin maintenant, c'est qu'il suffit de choisir une taille pour un premier tableau d'art. Euh, donc ils ont un iPhone iPad, et puis ils ont une sorte de taille standard de bureau 1920 sur 10. 80. Et puis vous pouvez faire votre propre taille aussi. Pour ça, on va commencer avec les années 1920 d'ici 10. 80. Alors vous cliquez sur ça, puis ça va tirer ça ici, et je vais vous donner un aperçu rapide de la façon dont tout est aménagé ici. Donc, sur le côté gauche, vous avez vos outils. Ah, vous avez aussi votre panneau d'actifs. On reprendra ça plus tard. Il s'agit de symboles, styles de
caractères. Et puis ce bouton est pour vos calques. Um, vous pouvez cliquer à nouveau pour fermer ça et vous montrer que le côté droit fera une forme ici, et ensuite vous pouvez voir quand j'ai fait cette forme. Tout cela est devenu cliquable, donc vous pouvez faire beaucoup de choses ici. Comme les alignements entrant. Vous pouvez changer les dimensions. Vous pouvez changer la couleur. Euh, donc c'est en quelque sorte en bref. C' est votre zone d'outils. Et puis c'est ce que vous pouvez faire avec vos outils et ce que vous pouvez faire avec la forme que vous avez sélectionnée ici. Et puis c'est le menu où vous pouvez obtenir un nouveau document, ouvrir un, conserver des documents ,
enregistrer l'exportation, etc. Et puis ce qu'on va faire vite ici, on va zoomer, on va en faire une copie, et on va en faire un autre. La raison pour laquelle on fait ça, c'est pour que je puisse vous montrer la zone prototype. Donc, pour arriver à la zone du prototype, vous devez avoir au moins deux tableaux d'art. Alors maintenant, on va juste ici et on clique sur le prototype. C' est comme je l'ai dit le lendemain, vous pouvez à la fois concevoir et prototype. C' est là que vous faites votre design. Et puis c'est là que vous faites votre prototype afin que vous puissiez voir que nous avons toujours nos mêmes
tableaux d'art . Ils ont l'air exactement pareil. Ils sont au même endroit. Mais on a perdu beaucoup d'outils ici, et on a perdu tout notre panel ici. C' est parce que la zone prototype nous n'avons pas besoin de ces choses. Donc ici, on peut juste aller se connecter, et ensuite on reprendra ça plus tard. Mais il y a beaucoup d'options sur la façon dont vous voulez faire la transition, puis aussi simplement connecter celui-ci en arrière. Bon, donc on prototypage ces choses. Ainsi, la vue, votre prototype et vous pouvez également le faire en mode conception, vous cliquez sur Aperçu, et maintenant vous pouvez voir qu'ils sont connectés. Clifton pour aller et venir. Eso c'est juste un aperçu rapide de
l' interface
X'd.
12. Compétences XD : Navigation: Bon, maintenant que nous savons avoir un aperçu de l'interface, nous allons parler de la façon dont vous pouvez naviguer dans vos documents X, donc il y a beaucoup de façons différentes de naviguer. Je vais juste vous montrer mes favoris rapidement ici. Ah, donc si vous êtes sur une mauvaise piste, vous pouvez utiliser vos livres de doigts. Utilisez vos doigts pour zoomer et arrière comme ça. Vous pouvez également garder le contrôle sur une commande PC sur le Mac et pendant que vous maintenez la
commande du contrôleur , vous aviez moins deux points Z plus pour zoomer. Donc, je tiens le contrôle moins plus apparemment dedans et dehors. Ensuite, vous pouvez sélectionner la forme et dire que vous voulez travailler sur cette forme ce que je vais faire beaucoup
de temps. Il y a tous eu le contrôle, le
commandement,
lecontrôle, le
commandement,
puis appuyez sur trois. Il y a tous eu le contrôle, le commandement, contrôle, le commandement, Et ça va remplir cette forme dans mon écran. Et vous pouvez voir en ce moment environ 120% que je préférerais être à, hum, 100% parce que c'est à ça que le design est censé ressembler. Un contrôle de 100 % 7 tous les coups. Non, je ne suis pas à 100%. Et maintenant je peux concevoir, donc j'utilise,
ah, ah, contrôle ou commande trois orteils tirer n'importe quel objet dans mon écran. Ensuite, j'utilise le contrôle ou la commande un pour atteindre 100%. Un autre raccourci clé utile ici est le contrôle ou la commande zéro. Et ça va tirer toute votre planche d'art pour que vous puissiez voir tous vos tableaux d'art en même temps. Donc, les principaux zoom que j'aime alors vous pouvez également tenir de l'espace et qui vous permet de vous
déplacer . Votre écran peut glisser à travers. C' est donc non, c'est ainsi que vous pouvez vous déplacer dans Adobe X'd. Au moins, c'est comme ça que je fais. Passons à la prochaine vidéo.
13. Compétences XD : Ajouter des couleurs: Ok, donc voici notre palette que j'ai dit que je voulais suivre pour ce projet. Donc je vais faire un clic droit et copier l'image, puis je vais passer sur le texte D. Et je veux dire ah, coller cette image ici et il y a plusieurs façons d'utiliser cette palette. Je vais vous montrer un moyen facile. Vous pouvez simplement le coller sur un autre tableau d'art. Et disons que c'est notre conseil sur lequel vous travaillez. Vous sélectionnez votre forme que vous voulez colorer, puis vous pouvez simplement utiliser votre outil pipette. Vous êtes pipette, outil et sélection, et il va changer la couleur de la forme. Donc tu continues à faire, tu peux le faire comme ça. Ou ce que j'aime pour dio,
c'est ,
c' j'aime mettre toutes les couleurs dans les extasies construites en petit palais ici, donc je trouve que c'est un peu plus rapide, surtout quand tu finis avec un tas de tableaux d'art. Vous n'avez pas besoin de traîner votre palais partout, et vous n'avez pas besoin de zoomer ou de zoomer un tas pour y arriver. Tu peux juste y aller. Il est déjà là, donc j'ai déjà mis ce rose moyen dedans. Alors je vais aller de l'avant et frapper. De plus, et puis vous pouvez voir qu'il apparaît, et puis papa et d'autres couleurs utiliseront simplement l'outil pipette. Et chaque fois que je vais ici, assurez-vous de frapper. En plus, j'ai compris ça. C' est encore ? Attends, que quelqu'un l'a déjà fait. Je pense que faire celle-là. Bon, maintenant vous voyez, nous avons les cinq couleurs, et si vous voulez,
vous pouvez les traîner et les organiser comme si elles étaient dans votre palais,
donc elles sont belles, mais c'est à vous de décider s Oh, c'est comme ça que vous pouvez tirer dans vos couleurs à X'd. Alors maintenant, je vous ai montré comment orteil, comment trouver une palette au moins une façon et aussi comment l'amener dans X D. Alors pourquoi ne pas aller de l'avant et choisir une palette, puis télécharger votre palais Teoh dans votre zone de projets de
partage afin que vous peut obtenir des commentaires à ce sujet, puis une fois que vous l'avez téléchargé , allez-y et tirez le dans X D, puis nous passerons à la prochaine leçon.
14. Compétences XD : Ajouter des photos: Bon, maintenant nous avons nos couleurs importées. Espérons que vous avez également importé vos couleurs. On va commencer à construire le site pour qu'on n'ait pas besoin de la place. Donc je vais juste frapper jusqu'à la piste pour me débarrasser de cette place. Et, euh, comme je l'ai dit quand je faisais des croquis, nous allons mener avec une sorte de zone de héros avec une zone de bannière avec un appel à l'action. Et donc, dans ce domaine, nous voulons rendre cela attrayant et attirer les gens tout de suite afin qu'ils soient susceptibles de
rester sur notre site Web et de le parcourir. Donc, une chose que j'aime que je trouve pourrait être utile pour cela est si vous trouvez une belle image qui est pertinente pour votre site et que vous faites que c'est ah, un grand fond. Donc, euh, l'étape suivante, si vous suivez, serait de trouver une image pour trouver des images. J' aime décompresser beaucoup de cendres sur Splash dot com. Regardons ça, euh, très vite. Ici. Donc, c'est unspool cendres affaiblir la recherche de type. Donc mes curiosités sont un thème de voyage, donc j'aime un peu l'idée d'une plage pour que vous puissiez voir une plage tapée. Et j'ai toutes sortes de photos cool. Si je trouve un que j'aime, suffit de cliquer sur télécharger et d'enregistrer la photo. Hum, mais je suis déjà allé, suis allé de l'avant et j'ai trouvé plusieurs que j'ai aimé. Alors jetons un coup d'oeil ici. Donc, après avoir trouvé les photos, comme vous pouvez le voir, j'aime les compresser. Ah, la raison pour laquelle je fais ça est parce que cela aide orteil à garder la taille de mon fichier ex d taille vers le bas un peu. Je n'ai pas l'ordinateur le plus puissant. Donc, parfois quand ces tailles de fichier deviennent trop grandes, il va commencer à ralentir X d. Et c'est aussi juste une sorte de Ah, bonne idée. Vous savez, si vous n'avez pas besoin d'un fichier énorme, pourquoi l'utiliser ? Alors j'aime aussi redimensionner les fichiers,
donc je le conçois 1920 pixels de large. Alors j'aime aussi redimensionner les fichiers, Donc, pour la plupart, je ne vais pas utiliser en image. C' est beaucoup de fil que 1920 s. Oh,
c' est aussi une autre façon d'économiser pour économiser,
euh, euh, l'espace et garder vos tailles de fichiers à bas niveau. Alors voyons. J' aime vraiment cette image, alors je vais en faire mes antécédents. Il y a beaucoup de façons d'apporter des images dans X D. Probablement ma façon préférée est, hum, juste les glisser et les déposer de l'exploration. Alors, on y va. Nous pouvons simplement glisser ceci et le déposer directement, puis une fois que nous l'avons, nous pouvons utiliser notre outil de sélection et le faire glisser, et vous pouvez voir qu'il a ces petits points. Cliquez sur ces points. Tu peux changer la taille et quelque chose de sympa à propos de X'd. C' est différent de certains produits de manipulation de photos comme Photo Shop. Est-il n'importe où vous faites glisser glisser glisser sur le côté ? Ou si vous faites glisser sur un coin, il va garder les parties de la photo ? Euh, donc, comme dans la boutique photo, si vous commencez à glisser sur le côté sans rien tenir d'autre, les photos seront déformées. Mais comme vous pouvez le voir, l'annexe D ne le fait pas parce que, vous savez, plupart du temps, quand vous construisez un site Web, vous ne voulez pas une photo déformée, donc nous allons juste aller de l'avant, n'
avait pas joué avec nous un peu. Amenez-le là où nous pensons vouloir faire un peu plus comme ça. Et une fois que vous voyez toujours sélectionné, vous pouvez obtenir ce point dans cette bordure bleue. Donc, une fois que j'ai choisi, vous verrez qu'il ne sera visible que sur mon tableau d'art. Alors pourquoi ne pas aller de l'avant et passer un peu de temps à trouver des photos que vous pensez que vous allez aimer, puis compresser et redimensionner et l'amener dans la remorque X'd et ensuite les télécharger dans votre zone de
projet afin que nous puissions donner des commentaires et et voir Voir votre progression au fur et à mesure que vous construisez le site s. Donc, dans la vidéo suivante, nous allons juste continuer à construire le site et et apprendre plus de choses sur X'd.
15. Compétences XD : Formes: D' accord. Donc, pour mon design, je vais utiliser des formes comme, ah,une sorte de ah, fonction d'intérêt
visuel. Je vais donc vous parler de la façon de créer des formes dans cette vidéo. Donc il y a deux formes ah que vous pouvez facilement faire en X que des rectangles. Il est dans l'outil rectangle et l'ellipse. Vous pouvez simplement cliquer sur le côté ou vous juste e et puis cela va tirer basculer vous à l'outil Ellipse sont pour l'outil rectangle afin que vous puissiez faire glisser autour. Vous pouvez voir si je fais glisser ça fait juste n'importe quelle forme. le mien, Pourle mien,je vais faire des cercles parfaits. Donc, pour faire un cercle parfait, vous maintenez la touche Maj enfoncée pendant que vous faites glisser, puis il
va garder la forme dans un cercle parfait et puis, si je frappe, sont de ramener l'outil rectangle et de le faire glisser et ensuite je vais tenir et vous pouvez voir la même chose fonctionne avec l'outil rectangle seulement il crée des
carrés parfaits lorsque vous maintenez la touche Maj enfoncée. Donc on a ma place. Une fois que vous avez votre carré, vous pouvez passer pour apparaître dans la zone d'apparence, et vous pouvez jouer avec son apparence afin que vous puissiez augmenter ou diminuer l'opacité, ce qui le fera plus ou moins voir à travers avec des rectangles. Vous pouvez manipuler le rayon de la bordure, manipuler les coins, donc si vous voulez le faire avec tout ce que vous sélectionnez, um, cette icône et puis vous pouvez cliquer ici et vous pouvez utiliser vos touches fléchées pour monter et descendre comme ça. Ou vous pouvez également entrer un nombre. Dites que vous vouliez les faire vraiment arrondir 90. Si vous voulez aller un par un, vous cliquez sur la petite icône en pointillés rayon différent, atteindre le coin sur. Ensuite, vous pouvez voir ici le ah, dans l'icône. Quel que soit celui que vous modifiez est mis en surbrillance en bleu, donc nous allons juste agrandir celui-ci afin que vous puissiez voir que dans l'action 1 80 je tape juste avec touches
numériques et entrer, et puis cela rend ce coin plus arrondi. Et puis pour le remplissage, cliquez sur ceci. Et comme nous l'avons vu plus tôt, vous pouvez, hum, des chambres. En fait, comme nous l'avons vu plus tôt, vous pouvez aussi, au lieu de cliquer que vous pouvez simplement utiliser l'outil pipette et sélectionner une couleur. De là, nous avons déjà ces belles couleurs tirées ici pour que nous puissions les utiliser. suffit de cliquer à travers et ça va changer à la couleur que vous choisirez. Et puis si vous voulez une nuance légèrement différente, vous pouvez jouer avec ça. Faites glisser cela autour de l'orteil, vous savez, ajoutez plus ou moins noir, plus ou moins blanc. Um, si vous voulez, juste apparaître la couleur ici, et puis si vous voulez changer complètement les couleurs et aller par ici, euh et puis cela définira l'opacité. C' est une autre façon de définir l'opacité. Le genre de chose que vous pouvez faire avec ça c'est que vous ne pouvez pas passer que vous aimez, et ensuite vous pouvez le plus, et ça va sauver ça ici. Et puis vous pouvez réappliquer cela dans d'autres domaines. On ne va pas faire ça maintenant, que je
puisse traîner ça. Ça va l'enlever de mon palais. C' est ainsi que vous changez la couleur de remplissage. Et puis la couleur de la bordure a la même configuration. Vous pouvez jouer avec les couleurs comme vous pouvez, hum, pour le remplissage, et ensuite vous pouvez également ajuster la taille de la bordure afin que nous puissions faire un mot à dire si nous entrons dans 15. Le clavier des chiffres et qui avait entré. Vous pouvez voir que la bordure devient beaucoup plus grande, beaucoup plus épaisse. Vous pourriez donner un tiret à la frontière, alors on a donné un petit tiret là. Et puis vous pouvez définir l'écart entre la frontière mais entre le tiret de bordure, puis vous pouvez voir à un 20. Donc l'écart est devenu beaucoup plus grand entre ces tirets, euh, et ensuite vous pouvez aussi jouer avec la forme du tableau de bord et ce genre de choses. Rends-le arrondi. Vous pouvez donner la forme de l'ombre portée. Couvre-toi plus tard. Mais vous cochez simplement cette case et vous pouvez mettre un fond flou ici, faire
sauter l'arrière-plan de ce qu'il était sous la forme. Ensuite, vous pouvez voir qu'il y a des contrôles supplémentaires pour le flou d'arrière-plan. C' est ainsi que vous créez et manipulez des formes. C' est les bases du prochain jeune et ajouter quelques formes à ma maquette. Alors passons à autre chose
16. Ajouter des formes: Bon, maintenant qu'on sait comment faire des formes, je vais vous montrer comment je vais les utiliser dans cette maquette. Donc j'aime vraiment cette image. Et je pense que nous pourrions juste laisser cette image telle qu'elle est et juste, euh, mettre nos textes sont appelés l'année du texte d'action et, vous savez, la prière. Regarde par ici et sois fini avec ça. Mais uhm, je vais utiliser quelques formes et mettre ces formes sur l'image pour en quelque sorte ajouter un autre élément. Et puis je vais utiliser les formes et porter cela tout au long de la conception askew. Allez plus loin vers le bas de la page afin que cet ordre ramène le tout ensemble . J' aime vraiment la façon dont ce bateau crée une arche. Et donc je pense que je vais utiliser des cercles. C' est ma forme. Donc, je vais aller ici,
sélectionner le cercle, pourrait aussi le faire juste en frappant n'importe quel et puis maintenez la touche Maj enfoncée pour qu'il fasse un
cercle parfait , et puis cette traînée dehors. Je veux commencer par un gros. Utilise ce gros. Qu' est-ce qui va tenir le décalage pour garder le cercle parfait et utiliser ce grand pour mon appel à l' action. Donc, si vous attrapez l'outil de sélection pourrait se déplacer comme ça. Et puis je ne veux pas que les frontières sur le quelque chose décoche la frontière. Et alors tu n'as pas à continuer d'aller et venir comme ça. Je veux dire, c'est assez facile si vous utilisez V pour l'outil de sélection, Andy pour l'outil Ellipse pour aller et venir. Ah, mais une autre chose que vous pouvez faire est que vous pouvez sélectionner et ensuite aller à l'outil de sélection en appuyant V, puis maintenez Ault ou son équivalent enfoncé sur le Mac, puis faites glisser tout en maintenant et faites une copie de la forme, puis vous pouvez maintenir la touche Maj enfoncée pour garder le cercle parfait. Je veux que les cercles soient de tailles différentes. Donc je sais que je suis vous en avez besoin d'un autre ici pour le menu afin que vous puissiez facilement voir le menu. Hum, alors rendons celui-là un peu plus petit et puis je veux dire souvent, traînez les orteils, entrez,
cercle en cours. C' est là que je vais mettre le logo. Mettez-la ici, rendez-la un peu plus grand. Mais faites-le sortir un peu de l'écran. Ne traîne pas pour en mettre un autre ici. Et puis je pense que je veux aussi en avoir une qui ne soit pas coupée où vous pouvez voir
tout ce qui tient le décalage pour garder le cercle parfait immobile et rendre cette petite chose. On va mettre celui-là là pour l'instant et je vais jouer autour du positionnement. Ah, plus. Mais c'est comme ça que nous allons commencer. Maintenant, j'ai toutes ces formes. Maintenant, je veux leur donner une couleur. Donc je vais juste aller un par un, sélectionner et ensuite aller ici. Et je pense que je veux faire la plupart de ce qui va être la couleur principale du site cette couleur rose
magenta. Donc il suffit de cliquer dessus avec la forme sélectionnée, et puis vous pouvez voir qu'il applique que Phil à la forme
comme Eh bien, comme nous avons discuté, euh et puis je sens que ces cercles air prennent beaucoup d'ils couvrent beaucoup de la et je veux que je ne veux pas qu'ils le couvrent autant, donc je vais leur donner un peu, je veux dire, un changement. Changer l'opacité. Pour que vous puissiez voir. Voir l'image en dessous. Et ce qui est cool, c'est qu'on peut changer l'opacité ici, trouver quelque chose qu'on aime. Disons que nous voulons un peu plus que dire, comme, nous aimons ça autour comme 75. Donc nous aimons 75 pour que je puisse juste cliquer plus, et ensuite ça va ajouter ce réglage exact ici, et ensuite je peux aller sélectionner ma prochaine forme, et ensuite je n'ai plus à jouer avec la capacité. Il est automatiquement appliqué cette capacité. Um, une autre façon. Tu peux faire ça ? Oui. Finissons tout ça. Dis, je leur fais toute cette couleur, sauf que je veux que celui-ci soit le vert. Donc je vais faire ça quand le vert et moi allons le donner, cliquez là et puis en utilisant mon numéro de clavier frappé, entrez, et puis il est 75. Mais disons que, vous savez, j'ai décidé, en fait, je pense que je veux que l'opacité soit un peu, hum, plus bas, donc je vais l'abaisser 38. Donc j'ai mis ça sur celui-là au lieu de
copier, copier, de faire ça ici. Une autre chose. Une autre façon. Vous pouvez le faire si vous cliquez dessus et puis contrôlez, hum, voir pour le copier et puis cliquez avec le bouton droit ici et coller l'apparence, et puis ça ne changera pas du tout la forme, mais ça va juste accélérer le style. Hum, donc c'est une autre façon de le faire. Mais j'aime en 75 en fait. Donc on va le laisser à 75 ans. C' est ainsi que vous pouvez faire vos formes. Pourquoi ne pas aller de l'avant et voir si votre image a l'air bien comme elle est et si
vous voulez justela quitter ? Pourquoi ne pas aller de l'avant et voir si votre image a l'air bien comme elle est et si
vous voulez juste Vous ne voulez pas mettre de formes, mais si vous décidez de mettre des formes ou et sur, l'autre chose que vous faites est que vous pouvez mettre des lignes dessus. Ajoutez un peu d'intérêt, mais jouez avec elle et a décidé ce que vous voulez faire. Ensuite, une fois que vous êtes satisfait, téléchargez dans votre zone de projets afin que nous puissions continuer à voir votre progression. D' accord, et donc nous passons à la prochaine vidéo
17. les polices de caractères: Donc, cette vidéo n'est pas vraiment sur le choix des fonds, mais avant d'aller dans la conception. Je voulais juste mentionner quelques choses sur les polices juste pour que vous ayez un rugueux Donc vous avez base à partir de quelques recommandations. Tout d'abord, je dirais que j'aime vraiment utiliser les fonds Google, donc je recommande d'utiliser les polices Google parce qu'elles sont gratuites et qu'elles fonctionnent bien et qu'elles
ont beaucoup de bons fonds là-bas si vous venez de commencer, C'est vraiment le chemin à parcourir, je dirais plus d'investir dans, hum, comme un plaisir payé. Donc, je recommande les polices Google, puis quand elles sont choses, je vous recommande de vous limiter à une ou deux polices lorsque vous commencez. C' est, euh, ça pourrait être tentant d'essayer d'Adam. Vous savez, un téléphone différent pour les boutons, un fonds différent pour les rubriques, front
différent pour votre menu. Ah, différents fonds pour les sous-titres et ainsi de suite. Mais ça va être vraiment difficile à faire, et je pense que c'est juste que c'est très susceptible de ne pas fonctionner bien, donc je choisirais un fonds et utiliserais un tas de différents poids et tailles t pour montrer votre hiérarchie ou peut-être deux polices. Peut-être que vous en faites un pour les en-têtes, les boutons de
menu, puis vous en avez un pour votre texte de paragraphe. Ah, donc ce sont les choses que je suis ce sont mes pensées sur les fonds. N' exagérez pas avec trop, et je recommande des fonds Google, et maintenant nous pouvons parler de la façon d'utiliser les polices et X'd.
18. Compétences XD : Texte: tous droits cette vidéo, nous allons couvrir comment ajouter du texte. Avant que je commence à faire ça, je veux juste te montrer à propos du verrouillage. Juste Ah, vous pouvez voir maintenant ce contour est gris pour faire ça, je l'ai verrouillé, donc je l'ai déverrouillé. Vous le sélectionnez, puis appuyez sur le contrôle ou la commande l Et puis vous pouvez voir qu'il devient gris, et maintenant vous pouvez le sélectionner, mais vous ne pouvez pas le déplacer. Donc, le déverrouiller que vous avez sélectionné à nouveau, contrôle. Eh bien, maintenant c'est déverrouillé. Je peux le déplacer,
mais je veux le garder verrouillé pendant que je suis en train de bouger. Donc je vais frapper le contrôle Lockett, et on a beaucoup de choses ici, donc je vais juste dessiner son rectangle blanc pour montrer l'ajout de taxes pour rendre un peu plus facile . Voir,
Donc, ajouter des taxes, vous sélectionnez l'outil de texte ou vous appuyez sur thé, puis vous pouvez simplement commencer à taper. Ah, Donc une fois que vous avez fini de taper, vous cliquez dessus et vous pouvez voir que vous avez des options ici pour changer votre ah, ici et ce que vous venez de taper afin que vous puissiez faire défiler et choisir un autre téléphone. Si tu veux. Dites que vous voulez faire honnête mur et ensuite va augmenter la taille pour rendre un peu plus facile à voir. J' utilise juste les chiffres sur mon clavier et j'ai tapé 60, puis appuyez sur Entrée devient plus grand et puis je vais cliquer sur V pour changer l'outil de sélection pour pouvoir le faire glisser au centre et vous pouvez voir que c'est ah, c'est, um, m' aider avec ces guides intelligents pour me montrer où je suis et quand il est centré. Ah, donc juste là, ce sont des sénateurs que vous pouvez voir et pour vous montrer d'autres choses, on va passer à un autre plaisir. Si vous connaissez le nom des fonds, vous pouvez commencer à le taper et ensuite beaucoup de remplir. Et quand vous voyez celui que vous voulez, vous appuyez sur Entrée, tirez vers le haut. Et maintenant tu peux voir quand j'ai fait ça. Merryweather, j'ai un tas de différentes options de police d'attente donc peut changer l'option, rendre légère ou, si vous voulez aller dans l'obscurité, rendre noire. Je suis vraiment drôle, et ensuite tu pourras l'envoyer. Ça ne va pas vraiment,
euh, euh, faire quoi que ce soit jusqu'à ce que tu recommences à taper. Um et puis c'est dans la belle fonctionnalité de X D. moment, il est réglé de sorte que le texte va juste prendre la quantité d'espace qu'il fait
naturellement. Si je commençais à taper à nouveau,
je ne cesse de grandir,
et j'ai la ligne de gauche pour que vous puissiez voir comment ça va à gauche.
Donc je vais cliquer pour qu'il soit là et le faire glisser en arrière. Si je commençais à taper à nouveau, je ne cesse de grandir, et j'ai la ligne de gauche pour que vous puissiez voir comment ça va à gauche. Et maintenant, il est sélectionné pour que je puisse l'éditer encore. Et maintenant, je vais cliquer sur ceci, et cela le convertit pour que maintenant le texte reste dans une zone. Donc maintenant je peux donner ce texte dans la zone et il va rester dans cette zone pour que je puisse le faire glisser. Disons que je voulais Teoh, hum, faire comme ça. Alors je peux juste le faire glisser. Et maintenant tout le texte que je tape va rester dans cette zone. Et disons que je veux centrer le centre, puis éditer ceci. Je double-clique ici, clique à la fin, et maintenant je peux juste commencer à taper, et peu importe ce que je tape, ça va rester dedans. Ah, ce domaine que je veux dire et ce qui est sympa à propos de X'd c'est que tu peux facilement changer d'avant en arrière . Donc disons que j'ai décidé plus tard, euh je voulais que Teoh retourne là où il prend juste de la place. C' est naturellement le cas, et il n'y a aucune contrainte à ce sujet. Je peux juste le faire en cliquant dessus. Donc c'est quelque chose qui est vraiment sympa ici. Il peut changer l'espace entre les lettres Une lettre espacement eso Parfois c'est sympa. Vous faites toutes les majuscules pour mettre un espacement supplémentaire des lettres. Nous allons juste mettre un peu d'espacement supplémentaire maintenant pour que vous puissiez voir. Et puis ici, vous pouvez changer l'espacement entre les lignes. Eso Faisons juste le plus grand pour qu'on puisse le voir. Et puis, euh ici, vous pouvez changer l'espace entre les paragraphes. C' est donc ce sont les principales choses que vous pouvez faire avec le texte lui-même. En plus de ces choses, vous pouvez également changer. L' apparence du texte pourrait changer l'opacité. C' est comme vous le pouvez avec des formes. Phil. Le changement a échoué à ce que vous voulez. Vous pouvez lui donner une bordure et ensuite,
comme vous le pouvez avec des formes, vous pouvez augmenter ou diminuer la taille de la bordure. Vous pouvez lui donner une bordure et ensuite, Enfiler un numéro touché. Entrez, hum, donnez une ombre portée. Donnez-lui ah, fond flou eso ceux Les principales choses que vous pouvez faire avec le texte eso Non, Dans la prochaine vidéo, je vais ajouter du texte la maquette.
19. Ajoutez du texte à la maquette: Bon, maintenant on va ajouter du texte à notre maquette. La première chose que nous faisons est d'ajouter un bon grand appel à l'action. Donc on va chercher notre outil de texte, et vous commencez à taper. On va appeler, on va dire,
euh, euh, prendre le voyage de toute une vie, peut-être de ta vie. Bon, donc on a eu notre texto, et maintenant je veux juste te montrer quelque chose. Vous voyez, le curseur est toujours là et rien n'est sélectionné. Donc si je viens ici et que j'essaie de changer la police en ce moment, j'ai sur Lata, qui est un fonds Google. Disons que j'allais revenir à Merryweather. Avait entré. Vous pouvez voir que rien ne s'est passé. C' est parce que le curseur est toujours là et rien n'est sélectionné. Donc, si je veux vraiment changer ce qui est dans ce que j'ai tapé que je dois aller à un
outil de sélection Il v ce qui est en fait quand vous tapez, vous ne pouvez pas il doit aller ici, obtenir l'outil de sélection. Ensuite, vous pouvez voir que la bordure bleue s'affiche autour de l'extérieur de ce que vous avez tapé. Et maintenant, si tu viens ici, frappe Merryweather et puis entre, ça va changer ton amusement, mais j'aime bien ce fonds. Donc on va aller avec ça pour l'instant. Vous pouvez voir que j'ai un assez grand que je veux que ce soit sympa et grand pour ce qu'on appelle l'action. Je veux être très clair. Et je vais aussi faire une découpe avec,
donc je voulais être vraiment audacieux. Laisse-moi m'assurer que c'est l'eso auquel je pense. Oui, j'ai le plus audacieux, euh, tomber disponible pour cette famille. Et je vais en faire une zone de texte pour que je puisse changer l'espace qu'il occupe. C' est là qu'on y va. Alors. Je veux que ça reprenne ça, et on va laisser ça pour là comme ça pour l'instant. C' est bizarre de mon dernier bébé. Je vais juste enlever ça, frapper zéro, entrer. Et maintenant, nous ne nous inquiétons pas de l'espacement supplémentaire. Quand je reviendrai. Maintenant, je vais ajouter le nom de cette compagnie. Ah, donc c'est le nom de l'entreprise de mon client. Et comme vous pouvez le voir, j'ai cliqué, cliqué hors des zones les boîtes bleues sur savoir ajouté. Je ne veux pas qu'il soit aussi grand que l'appel à l'action. Donc je vais aller ici et le déposer. Essayons 36. C' est un peu trop petit. Nous essayons 48 donc je l'aime plutôt bien. Et je veux mettre ça ici,
et en fait, et en fait, mon client ne l'a pas fait. Il n'a pas encore de logo, mais je vais faire quelque chose de très rapide pour eux. Donc j'ai mon outil pour les lèvres, et ensuite je vais tenir Ault et changer de vitesse. Quand vous maintenez, tout ce qui le fait. Comme quand vous avez commencé à créer votre forme. Ça va du centre. Donc on va faire un cercle pour l'arrière-plan comme ça. Hum, je vais enlever la frontière. Je vais lui donner une des couleurs. On va peut-être lui donner une légère couleur. C' est comme du vert. Et maintenant, vous pouvez voir qu'il le couvre. Je vais replacer la forme pour le faire,
tu maintiens lecontrôle ou la commande enfoncée sur un Mac,
et ensuite tu auras la touche de support qui bouge. Je vais replacer la forme pour le faire,
tu maintiens le contrôle ou la commande enfoncée sur un Mac, Il déplace le calque vers le bas, puis vous pouvez le voir à nouveau. D' accord. Tsunami pour faire un deuxième cercle pour cela. Tu fais un quart de travail pendant que je fais ça. Donc, il reste un cercle et faire un peu plus petit. L' un nous a traînés. Donc ça ne couvre pas tout le truc. Enlève la frontière. On va donner ce Ah, une légère couleur rose, puis sélectionné la raquette de commande du contrôleur et ensuite la pousser vers le bas. Et je suppose que c'est le support ouvert que j'utilise orteil,
um, um, pour déplacer la couche vers le bas pour la déplacer vers le haut, vous utilisez les vêtements de retour. Tu aimes ça ? Bon, donc on a ça. On a notre image de fond, et je vais jouer un peu plus avec nous. Mais, euh, pourquoi ne pas aller de l'avant et commencer à ajouter votre appel à l'action et peut-être faire un petit
logo rapide où vous n'avez pas vraiment besoin d'un logo si vous voulez, Vous pouvez simplement taper le nom de l'année de votre entreprise ah que vous créez le site pour, puis téléchargez-le et passez à la vidéo suivante
20. Compétences XD : Fusionner et convertir du texte en lignes: D' accord. Donc, cette vidéo, nous allons couvrir la conversion des contours des orteils de texte, puis aussi les formes émergentes. Donc pour fusionner des formes, on va prendre une forme ici, et on va commencer à la faire depuis le centre. Donc, pour ce faire, vous tenez sur Ault ou option sur le Mac et déplacez pour garder un cercle parfait. Et puis vous commencez à glisser et vous pouvez voir que ça va du centre. Et si on va par ici et qu'on ne tient pas tout ce qu'on vient de dire que je veux dire Dragon,
ça sort de côté. Et si on va par ici et qu'on ne tient pas tout ce qu'on vient de dire que je veux dire Dragon, Donc nous allons faire ces deux formes, euh, puis appuyer sur V pour passer à l'outil de sélection. Et puis nous allons sélectionner les deux pour faire ça et vous sélectionnez Ah, vous maintenez Maj. Ah,
bien, bien, en cliquant sur les deux. Et puis vous pouvez venir ici avec les deux sélectionnés, et vous pouvez faire ces différentes options de fusion. Ça va les fusionner ensemble, c'est
ce qu'on va faire. Mais vous pouvez aussi faire quelque chose soustraire qui va enlever le contrôle de l'objet avant Z annulera cela, et ensuite vous pouvez enlever la partie où ils se chevauchent et ensuite vous pouvez Onley Um à l'intérieur du dernier a quitté la partie, affaiblir plus. Et là où ils se chevauchent, celui-ci sortira là où ils se chevauchent. Pour que vous puissiez le voir. Supprimez la pièce où elles se chevauchent. C'est
ainsi que vous pouvez manipuler les formes. Laisse-moi défaire ce dernier. On va fusionner ça, et vous verrez que nous avons émergé la forme. qui est cool à propos de X d, c'est d'autres programmes, comme illustrateur. Parfois, quand vous utilisez certaines de ces fonctionnalités, c'est ah, c'est destructeur. Donc vous dites émerger la forme que je ne pourrais pas revenir en arrière, mais en x d. je peux si vous maintenez le contrôle. Ah, alors tu peux juste cliquer. Un certain contrôle serait commande sur un Mac. Je peux juste cliquer, et puis je peux voir que la forme est juste là où elle est et ils sont toujours fusionnés. Il y a encore entièrement comestible, mais je peux le rendre plus petit. Plus grand, tu sais, fais ce que je veux. Hum, et ils sont encore émergents, mais ils sont encore complètement affaiblis. Je peux toujours les contrôler. Et si je voulais les orteils, les
fusionner, je pourrais venir ici et puis ils sont encore des formes séparées. Donc c'est vraiment sympa à propos de x d Vous n'avez pas à vous soucier de l'émergence de choses détruisant. Donc quelque chose qu'on va faire pour la maquette, c'est qu'on va convertir nos contours de texte ou passer, et ensuite on va fusionner Teoh avec la forme. Donc je vais juste voir comment changer le texte en passe de passer. Donc, vous avez sélectionné, allez dans le chemin, convertissez en chemin, et maintenant ce n'est plus du texte. C' est ah, c'est une forme ou un chemin. Donc, vous le voyez double-cliquer, et puis ça fait apparaître les points d'ancrage. Il n'affiche pas le curseur où je pourrais taper à nouveau. Donc c'est quelque chose qui vous détruit. Une fois que vous faites ça, la seule façon de revenir en arrière est les orteils. Annuler. Tu ne peux pas. n'y a pas de bouton magique pour cliquer et le refaire du texte. Ce sera un peu prudent que tu aies ton texte comme tu le veux avant de le
faire . Bon, donc dans la prochaine vidéo, je vais te montrer comment je vais utiliser ces techniques dans la maquette
21. Compétences XD : Texte découpé: Bon, maintenant ce qu'on va faire, c'est que sa fusion s'appelle l'action avec notre avec le cercle. Donc, je pense que ce sera un peu cool, parce que vous serez en mesure de voir à travers le texte à l'image. Mais, , comme je l'ai mentionné, une fois que vous avez converti votre texte de chemins, vous ne pouvez pas revenir en arrière et édité comme, ah, comme, euh, taxe. Donc tu veux être sûr de l'avoir ? Comment tu le veux avant de le faire. Donc une chose à laquelle j'ai pensé, c'est que cet orteil a l'air bien. Je pense que je préfère avoir quelque chose qui est
un peu plus épais,
un peu plus lourd. plus épais, Donc je pense que je vais changer la police que j'utilise ici de Lado Teoh sont Chievo . Alors commencez à taper, puis appuyez sur. Entrez. Et maintenant, vous pouvez voir que c'est une police plus épaisse et
plus lourde. Je devrais peut-être réduire la taille pour qu'elle corresponde là où je veux. C' est ce qu'il est significativement plus épais. Ah, donc je vais aussi changer ça juste pour que les choses se passent ensemble. Je recommande de ne pas devenir trop fou avec les polices quand vous êtes surtout quand vous commencez, donc vous pouvez simplement coller avec un, puis utiliser différents poids étrangers comme le noir et lumière et les combiner de cette façon. Ou peut-être que tu veux l'utiliser. Vous pouvez juste appariements de polices Google si vous voulez, ou vous pouvez sorte de jouer autour généralement envie d'essayer de trouver à cela, hum, Je suppose qu'il ya beaucoup de choses sur le jumelage amusant, mais un moyen facile de le faire. C' est bien à ce look beaucoup différent, mais toujours belle ensemble. Il est facile d'avoir des ennuis si vous devez avoir l'air vraiment similaire. C' était un peu comme,
pourquoi payez-vous ces deux-là ? C' était un peu comme, Pourquoi tu n'en utilises pas un ? Donc, de toute façon, Ah, juste un peu loin. Ah, un peu hors de la piste sur les polices. Donc nous avons converti celui-ci Tar Chievo. Et je pense que c'est ce texte est un peu trop long pour ce que je quoi ? Je veux entrer ici. Donc je vais le changer pour dire, prenez votre voyage de rêve. C' est comme un peu plus petit. Et puis je vais le mettre ici. Vous pouvez voir Ondo. Il a l'alignement. Deux buts. Et aussi je veux vous envoyer ça. Ça va être mieux à l'intérieur de ce cercle, et donc je vais l'aligner au centre du cercle. Et une fois que je l'ai, où je pense que je voulais être, alors je vais faire un clic droit et aller chemin de halage, convertir en chemin et maintenant vous pouvez voir ce n'est plus du texte. C' est ah, forme. C' est un chemin par double Cliquez dessus. Je ne peux pas taper. Ça fait juste ressortir les points d'ancrage. Donc c'est ce que je voulais dio Um, alors maintenant nous allons fusionner la, ah, cette forme que nous avons faite à partir du texte avec le cercle derrière lui. Donc, je sélectionne le cercle en cliquant dessus. Ensuite, je maintiens Maj et sélectionnez le texte qui aime les deux à la fois. Et ensuite on pourra monter ici. Nous pouvons le fusionner, mais ce que nous voulons faire est soustraire, donc nous voulons soustraire le texte de cette forme. Donc nous cliquons dessus, et maintenant vous pouvez voir que c'est comme s'il y avait une découpe pour le texte. Maintenant
qu' on a fait ça, va bouger ça. Ah, nous devrons peut-être juste l'image de fond pour que nous puissions voir ce que dit le texte, alors faites-le . Et, hum, quelque chose à laquelle je pense ici est peut-être qu'on veut mettre un peu de superposition sur ça pour que ces zones soient un peu plus sombres. Ah, mais en fait, je pense que ça ira. On pourrait revenir et le faire plus tard. Mais pour l'instant, nous avons fusionné le texte, et vous pouvez voir que c'est un peu cool effet découpé. Ah, avec notre appel à l'action. Donc dans la prochaine vidéo, on va continuer à construire la maquette.
22. Boutons et menu: Donc, dans cette vidéo, nous allons ajouter un bouton sur lequel les gens peuvent cliquer juste en dessous de l'appel à action. Et puis on va aussi ajouter un menu hamburger. On va construire une annonce. Ces deux choses. Vous pouvez aussi aller aux pieds de vous. Je gamine, euh, je te
prends comme, il va à un cadre métallique un et clique dessus et fais quelques pas et tu peux tirer un bouton à partir de là. Mais ils sont assez simples à faire, donc nous allons juste vous montrer comment les faire ici pour faire le bouton, je vais à l'outil rectangle, puis je le fais glisser et l'essayer. Et comme je l'ai dit, c'est quelque chose que nous voulons concevoir quelque chose comme ça quand devrait probablement le faire avec le texte, aussi à 100% pour s'assurer que ce n'est pas énorme. Donc je veux dire, frapper le contrôle un. Zoom avant et je vais passer pour voir mon bouton, et vous pouvez le voir à 100%. C' est un gros bouton, donc je vais baisser la taille. Je veux dire, baisse la hauteur 48. Donc maintenant je peux commencer à voir OK, c'est un peu trop grand et généralement pour mes boutons. Je vais utiliser une taille de texte autour de 18. Donc c'est taper, euh, aller endroits pourraient le voir utiliser ça. Ah, des outils d'alignement pour voir quand il est centré. Et puis je n'aime pas vraiment la frontière. Donc je vais enlever la frontière. Vous pouvez voir en ce moment c'est les bords de l'air totalement carré. D' habitude, je n'aime pas utiliser des bords totalement carrés si vous voulez carré. Ecoutez, je mettrais au moins, vous savez, 2 à 5, um, sur le rayon de la frontière pour que vous puissiez voir ce genre de juste, euh, nettoie ça. Ça a l'air un peu plus professionnel. Un peu plus. Ah, comme si tu avais mis un peu d'effort dans un supposé juste les laisser carré. Mais pour celle-là, vu qu'on a tellement de cercles, je vais aller avec des bords arrondis. Donc on a ça,
euh, et je pense que, , si tu y vas, si tu veux vraiment entrer dans les boutons, tu peux aller chercher le manuel de Google sur la conception matérielle. Et puis Apple a également quelques bons matériaux sur la façon dont ils recommandent de faire des boutons. Il pourrait y aller si vous voulez avoir l'espacement exact à utiliser pour les boutons, mais nous allons juste aller avec quelque chose que j'aime personnellement, euh, et d'accord, donc on y va. Je l'ai centré. Et puis je veux dire, cliquez sur les deux de l'est en maintenant la touche Maj enfoncée, et je veux les regrouper afin que je n'ai pas à les faire glisser séparément ou en sélectionnant une fois. Alors fais ça. Maintenez enfoncé, contrôlez ou commandez sur un Mac, puis appuyez sur G. Et maintenant, il les regroupe et maintenant assimiler se déplacer autour de quelque chose d'un centre dans ce. Et puis nous allons ah, zoom arrière, commande
contrôleur moins. Et maintenant, prenons beaucoup de choses. Ecoute, tout
ce truc a sélectionné le contrôle 3. Et maintenant, tu sais, je crois que j'aime bien la façon dont ça a l'air assez
bien, euh , eh bien, je pense que c'est un peu trop gros. J' ai décidé que je vais baisser ça à 36 et je vais aussi faire tomber ça, Alton et passer au porte-monnaie Dragon. Rester centré. Bon, donc je pense que c'est un peu mieux. Je veux juste le faire quand j'y pensais. Alors maintenant on va au menu, donc on va faire un menu hamburger qu'on va mettre ici. Encore une fois, c'est probablement quelque chose. Nous voulons le faire à 100%. Donc, je vais juste faire des rectangles comme V pour l'outil de sélection, puis maintenez Ault ou option enfoncée sur le Mac. Attends une seconde, en fait. Je te laisse ce que je veux dans ces coins. Donc je veux dire et supprimer celui-là. Cliquez dessus et on va faire ces coins complètement arrondis comme nous l'avons fait, et ils supprimeraient aussi la bordure. Donc, là, nous allons et puis maintenez enfoncée l'option Alter sur le Mac, et puis vous pouvez voir où vous ne pouvez pas voir très bien. Je veux dire, traîné ça. Vous cherchez à voir afin que vous puissiez voir les chiffres montrant C'est l'espace entre deux eso. Nous voulons un espace égal entre eux et si vous maintenez Ault, vous pouvez voir l'espace qui les sépare. Donc on va tout tenir et traîner à nouveau. Et maintenant, vous pouvez voir l'espace est égal entre les trois. Donc c'est ce qu'on veut. Ensuite, nous allons maintenir la touche Maj enfoncée pour sélectionner tous les G une fois contrôlés pour les regrouper. Ensuite, on traîne ça ici. Nous voulions être dans notre, hum, un petit coin là-haut. D' accord, donc tu sais quoi ? En regardant ça, je pense que c'est un peu trop épais, donc je vais retourner en contrôle trois, pour que je puisse le voir. Contrôler un, obtenir 200% puis contrôler le décalage G willen groupe afin que je puisse jouer avec facilité, et puis ils sont tous sélectionnés encore. Donc je vais juste baisser la hauteur de leur petit plus mince. Je pense que c'était un peu trop épais. Bon, on
y va. Donc tu ne bouges pas. Sélectionnez les tous les contrôler groupe G à nouveau, accord ? Et puis vous savez quoi,
en fait, voulez contrôler le décalage g un groupe eux, faire cela au lieu de juste avoir tout ça, ah, même avec Zoom ici. Et puis je vais juste ce que je veux qu'ils soient de la même taille. Alors celui-là a changé. Donc je vais les faire pour qu'ils soient un peu décalés. Troll un, reviens. 200 % par ici. Sélectionnez notre contrôle de la carte 3 pour que je puisse voir tout mon tableau d'art. Donc je vais continuer à jouer avec ça. Mais c'est comme ça que vous pouvez faire un bouton et un menu de hamburger. Donc, je vais juste vous laisser aller de l'avant et ajouter ces simulations de jeer et ensuite télécharger votre progression . Nous voulons continuer à télécharger les progrès après chaque vidéo, juste parce que cela va vous aider à obtenir des commentaires. Espérons que de la part de vos camarades de classe, d'autres personnes qui font ça. Et puis ça va aussi aider les choses à rester pendant que vous les apprenez. Alors allez-y et ajoutez ces choses à votre maquette,
téléchargées, puis venez dans la vidéo suivante.
23. Nettoyer le général: D' accord. Donc, à ce stade, je voulais juste faire un peu de nettoyage. , Tu sais, tu n'as pas vraiment besoin de regarder cette vidéo, mais j'ai juste pensé te la montrer si tu es intéressé de voir comment les choses changent , comment ? J' ai décidé de changer les choses. Donc, vous savez, je regarde ça, et j'ai l'impression que pour une raison quelconque, je n'aime pas vraiment ces couleurs. Je pense qu'à cause de la capacité que nous avons donnée, cela ressemble beaucoup à ces blessures. Et puis, puisque c'est leur couleur principale, j'aimerais vraiment avoir leur couleur principale plus proche de leur logo. Alors j'ai décidé de changer ces couleurs. Je vais rendre ça dans l'obscurité. Je vais aller de l'avant et faire ce testament. Le texte blanc, vous pouvez le voir. Et puis je vais faire ça dans cette couleur verte. Mais je voulais lui donner une petite ville passée ici, lui donner un peu de passé. Moi alors. Je veux dire, juste bu ça autour. Non, non, je veux que ça ressemble un peu, que tu penses à un moins global. Alors, hum, maintenant que j'ai cette couleur ici, je me sens comme celle-ci. Peut-être que je n'ai plus besoin de celui-là. Alors débarrasse-toi de celui-là. Um, et puis rétrograder pour sélectionner ces trois choses contrôler g pour les regrouper, alors je veux dire, une sorte de pompes. Ils ont commencé à aligner un peu les choses, donc je veux en ligne le haut de, hum, le menu en haut de ce bas là-bas. Mais regrouperons d'abord le logo. Et obtenir ce que nous voulions avant de passer trop de temps à faire ça va mettre le logo là, pas voir. Ouais, je pense que oui, on croit le logo là-bas. Faisons en sorte que ce sommet de ces deux-là soit aligné. Et puis si vous maintenez la vieille touche enfoncée pour, um, option sur Mac, vous pouvez voir la distance loin des choses. Nous voulons donc l'obtenir à la même distance du bord de la planche d'art que le logo . Hum, alors fais ça. J' ai besoin de changer les orteils parce que maintenant c'est fini de couler l'aéroport, donc ça ne me laisse pas voir à quel point c'est loin. Hum, donc je vais déverrouiller ça rapidement. Les oreillons. Et puis je vais juste traîner ça ici. Non, je peux voir à quel point ça dit Si je maintiens l'option sur le Mac, ne peux
probablement pas voir ça, mais c'est 110. Je vais par ici. Tu vois à quelle distance c'est ? C' est ainsi que je devrais vraiment redimensionner ça. Donc, au lieu de le redimensionner,
ce que je vais faire, c'est faire un peu de maths. Je sais. Mon,
euh, mon tout ne peut pas. Tout mon tableau d'art est 1920. Donc, si je voulais être 110 de chaque côté que je dois soustraire 220 de 1920. Donc, ce rectangle de dessin ici, et puis nous allons faire le rectangle 1920 et puis vous pouvez continuer,
entrer moins à 20, puis appuyez sur . Entrez automatiquement faire cela pour vous. Ensuite, nous voulons centrer cela afin que nous puissions l'utiliser pour aligner ces choses. Donc, nous cliquons alors qu'il a sélectionné, nous cliquons sur le centre, puis nous revenons à notre outil de sélection. Alors je vais utiliser mes touches fléchées. J' ai besoin de regrouper ça pour faire ça. Donc je vais maintenir la touche Maj enfoncée, sélectionner toutes les parties qui composent notre logo, puis utiliser les touches fléchées pour le ramener jusqu'à ce que je reçoive sélectionner toutes les parties qui composent notre logo,
puis utiliser les touches fléchées pour le ramener jusqu'à ce que je reçoiveune ligne indiquant que je suis au bord du rectangle des deux côtés. Et puis j'en ai fini avec ce rectangle qui le mène. Et puis je pense que je vais faire tenir le poste,
sélectionner tout ça,
faire de ça un groupe G contrôlé,
et apporter ça un peu plus. Et puis je pense que je vais faire tenir le poste, sélectionner tout ça, faire de ça un groupe G contrôlé, Et pendant que j'ai ça, je pense que je vais jouer avec ça juste un peu. D' accord ? Donc je pense que j'aime penser, comme où c'est un peu mieux. Bon, donc c'est juste quelque chose que tu veux faire périodiquement. Un peu de recul par rapport à l'endroit où vous êtes et faites des ajustements. Hum, donc tu aimes la façon dont les choses vont mieux ? D' accord. Alors continuons à travailler sur nos simulations. Si vous voulez prendre un moment maintenant, toe sorte de redéfinir et de retravailler votre maquette, puis téléchargez cela dans la zone des projets. Ce serait génial. Mais si vous vous sentez bien à
ce sujet, ça continue à continuer. Une autre chose avant de partir, il peut voir que c'est sans titre, édité. Je ne l'ai pas encore gardé, donc tu veux toujours sauver ton travail. Tu peux faire face ici, sauver. Et puis on va appeler cette maquette, frapper, entrer, sauver. Et maintenant, vous pouvez voir qu'il s'appelle Mock up. Et rien ne dit qu'il a été édité. Donc, tout a été sauvé. Si je devais aller ici et,
hum, hum, changer la taille de ceci, il est écrit édité, donc il y a des changements dangereux. Donc, pour le
faire, pour les sauver, je pourrais juste prendre le contrôle s ou la commande sur les Mac s, et ensuite il va enregistrer ces changements. Bon, donc je pourrais jouer avec ce petit bouton. Ça suffit. Juste pour que vous ayez l'idée de comment je fais les choses. Bon, alors continuons,
continuons à faire le Markham
24. Introduction aux styles globaux: d' accord. Je veux juste parler un peu de,
um, um couleurs sont des couleurs globales, styles de
personnages et des symboles avant de les récupérer en extra juste pour que vous compreniez le concept derrière eux. Uh, quand vous concevez des sites web air abs, vous allez finir avec potentiellement,
vous savez, vous savez, des centaines de salles d'art différentes et ces tableaux d'art qui vont aux pieds. Répétez beaucoup des mêmes choses, comme vos boutons. Peut-être que tu as un bouton de soumission sur le sol et ça va être sur, comme, tu sais, 20 de tes tu sais,
20 de tessimulations de
20 ans sur ton tu vas utiliser les mêmes couleurs tout au long de ton projet. Vous allez utiliser les mêmes polices et tailles de police et ce genre de choses tout au long de votre projet. Donc, ce que les styles de personnages, les couleurs et les symboles globaux vous permettent de faire est plutôt que dire, vous avez ce bouton et vous pensez que lorsque vous commencez, vous pensez que c'est parfait, alors utilisez-le tout au long de votre site. Mais vous montrez au client que les clients aiment, vous savez, euh, désolé, je n'aime vraiment pas ça. Ah, merci. Normalement, vous devez passer à travers et vous devez trouver et changer chacun d'entre eux. Donc d'abord, c'est une douleur de les trouver tous. Et puis, deuxièmement, ça prend du temps de les changer tous. Mais avec des symboles. Si vous utilisez des symboles que vous pouvez prendre ce bouton et vous pouvez le modifier. Tu le trouves au même endroit. Vous faites les modifications, puis celles que son air appliqué aux boutons tout au long de toutes vos conceptions. Cela va vous faire gagner une tonne de temps et les styles de personnages et les couleurs globales. C' est une sorte de concept similaire. , Dis, disons, tu as ce vert que tu aimes vraiment et tu fais toute ta maquette en utilisant ce vert. Et puis il s'avère, vous savez que le client n'aime pas ce vert. Donc, au lieu d'avoir à trouver toutes ces instances du vert et à les changer une par une , vous pouvez simplement aller dans votre palette de couleurs globale. Changez-en un là, et il va l'appliquer sur tous vos tableaux d'art et la même chose avec les
personnages avec des styles de personnage. Vous pouvez simplement le modifier,
changer le style de caractère une fois dans votre panneau Styles de caractères. Ça va s'appliquer à tous vos tableaux d'art. Donc, fondamentalement, les symboles, les styles de
caractères et les couleurs globales sont une sorte de mesures de gain de temps pour ce projet. Il ne sera probablement pas nécessaire de construire une page d'accueil. Mais il y a un concept vraiment important et quelque chose que vous devriez vraiment essayer d'utiliser une fois que
vous concevez des sites Web complets.
25. Compétences XD : Compétences de couleur, couleurs et styles de personnages: Bon, maintenant
qu'on a un site de caniveaux bien en cours,
je pense que c'est le bon moment d'y aller. Ah, la zone des actifs. Donc, vous trouvez cela ici, cliquez dessus et puis vous pouvez l'étendre. Et il y a trois parties principales à ces couleurs, styles de
personnages et symboles. Donc, nous allons passer chacun de ceux en commençant par les couleurs. Donc, fondamentalement, ce que tout cela fait est qu'ils vous permettent de changer rapidement quelque chose dans chaque élément de votre document. Donc je veux dire maintenant Ah, ça
Ce n'est pas très difficile d'entrer et de changer. Vous savez, les trois cercles que vous avez qui sont cette Ah, cette couleur qui vous prendrait, comme moins d'une minute, probablement. Mais disons que vous faites comme, un prototype à grande échelle de l'application ah ou quelque chose et que vous avez, genre, 50 ans ah, 100 tableaux d'art ou plus. Si vous avez besoin de changer, vous savez, vous devez changer cette couleur dans ah 100 endroits. Ça va te prendre beaucoup de temps. C' est là que l'idée derrière ces choses est que vous pouvez changer quelque chose. Changez-le ici une fois, et ça change partout dans votre document, donc pour le mettre en place, euh, quand vous avez un tas de choses ah, déjà en place, vous pouvez juste les sélectionner toutes. Et puis vous voyez ces boutons plus deviennent actifs. suffit de cliquer plus, et puis il tire dans toutes les couleurs que vous avez jusqu'à présent, vous pouvez voir qu'il y a un couple que nous avons ajouté dans notre zone de remplissage qui ne sont pas encore ici parce que nous ne les avons pas encore utilisés. Mais ça devrait être tout ce que nous avons utilisé jusqu'à présent. Et maintenant juste pour démontrer, disons que nous voulions changer cela. Ah, rose. Donc, vous venez de cliquer avec le bouton droit ici, puis éditer. Et puis disons que nous voulons le changer en, ah un pour le changer comme, euh, un noir ou comme un gris. Fais ça. Et comme vous pouvez le voir, cela a changé tous les trois de ceux juste avec le changement à la fois. Mais nous ne voulons pas vraiment faire ça. On va défaire ça. Bon, donc c'est comme ça. L' idée derrière les couleurs, puis les styles de personnages est similaire. Je vais juste garder, hum, tout sélectionné dans cette affaire. Nous avons seulement,
euh, euh, à prendre soin de, um Eric Areas avec des textos. Rappelez-vous qu'ils ont été convertis ceci en chemin, donc cela ne va pas apparaître. Alors vous allez de l'avant et cliquez dessus et nous obtenons notre aussi. Donc ces deux air, hum, plateau sur. En fait, je voulais faire de ces Ah, notre chef. Allons-y et changeons-en maintenant. Donc, tout comme avec les couleurs, il
suffit de cliquer, modifier et de faire ce sont Chiba. Et puis ça a changé. Ça a changé celui-là. Et puis j'ai aussi remarqué que ça restait quand je le montrais avant. Je ne veux pas vraiment que ça soit réglé à ça. Si j'allais réutiliser ce style ailleurs, je ne le voudrais pas comme ça. Donc on va faire ça 48 bien ? Et puis nous allons aussi changer celui-ci, et vous pouvez voir maintenant nos hommes de ligne ont foiré sur ce bouton. Donc, je maintiens le contrôle. C' est le groupe. Donc je maintiendrais le contrôle pour sélectionner ça au sein du groupe, et puis je vais rendre ça un peu plus grand. Et puis je vais frapper le contrôle 3 pour zoomer afin que je puisse voir à York et voir un peu mieux. Et puis nous allons récemment là-dedans, nous y allons. On l'a centrée. Bon, maintenant
on va frapper le contrôle. Je veux revenir à 100% et ensuite on va donc vous en avez eu un peu plus. C' comme ça que vous utilisez les styles de caractères. Et maintenant, les symboles. C' est des symboles un peu différents. Ah, tu vas plus l'utiliser pour des choses comme ton en-tête. Des choses comme des boutons. Des choses comme ce logo que vous voulez garder le même sur plusieurs tableaux d'art ou sur
plusieurs endroits dans un tableau d'art. Des choses comme ce logo que vous voulez garder le même sur plusieurs tableaux d'art ou sur Donc, par
exemple, disons qu'on va utiliser ça, euh, laissez-moi zoomer un peu ici. Donc on va utiliser ce bouton. Laissez-moi choisir d'entrer. Ah, c'est vrai. J' ai oublié. Regrouper toutes ces choses. Allons juste aller de l'avant et contrôler le décalage G orteil sur le groupe que. Alors Aiken, fais de ce bouton un symbole. Donc maintenant ce bouton est groupe à Comptel parce que je ne peux pas cliquer dessus. C' est seulement sélectionner le tout. Donc c'est que certains groupes, alors nous le regrouperons et puis nous cliquons sur Plus, et maintenant nous avons fait un symbole. Alors maintenant affaiblir Dio Ah, partout où nous voulons utiliser ce symbole. Vous le faites glisser et le mettre là où on veut le mettre et vous pouvez me voir zoomer un
peu . Ici, vous pouvez voir cela au lieu d'avoir le bleu normal quand quelque chose est un symbole similaire, il a le contour vert si tôt revenir. Et, euh, imaginons juste qu'on ait ce bouton dans,
genre, genre, 30 endroits différents, ou peut-être même plus, et qu'on a décidé de changer la façon dont on voulait. Change le petit. Donc pour ce faire, je clique sur maintenir le contrôle pour obtenir ah, um, forme une partie du bouton. Disons que je voulais le faire sur ce genre de couleur verte mentholée. Donc je vais comme ça et puis disons que je veux changer le texte conceit a changé l' arrière-plan de ce bouton pour que nous puissions changer le texte en, disons un. Fais-le comme ça. Donc, comme vous pouvez le voir, hum, dans ce projet en particulier, ça ne va pas être vraiment nécessaire. Ils ne vont pas vous faire gagner beaucoup de temps, mais honnêtement, vous êtes probablement il est probablement très rare que vous ayez un projet qui n'est qu'une
page d'accueil . Donc, je recommande d'utiliser ces souvent souvent ce que j'aime faire avec ces ce genre de mettre place
les choses, vous savez, se déplacer où je suis en ce moment, peut-être un peu plus loin, et ensuite aller dans et mis en place une fois que je Parce qu'à ce stade, je vais avoir une idée de comment je vais utiliser dans le reste du document. En fait, je ne les instaure pas tout de suite, parce que tôt, je suis susceptible de changer les choses. Donc je ne veux pas avoir à m'inquiéter de changer ça et de mettre des
styles dont
je n'aurai pas besoin. Ça va juste me confondre. Alors j'attends que je sois, j'ai quelque chose dont je me sens, tu sais, décent. Et puis je commence à les mettre en place. Mais une fois que vous obtenez un peu de chemin dans votre projet, je recommande vraiment d'utiliser ces parce qu'ils peuvent vous faire gagner beaucoup de temps. Ah, en bas de la route. Si vous les mettez en place tôt.
26. Compétences XD : L'outil Plume: Maintenant ce qu'on va faire, c'est aller sur l'outil de stylo. Donc, comme vous pouvez le voir, avec assez de plis remplis cette zone de nos dessins allaient rendre cela un
peu plus grand Quand la chose cool à propos de X d est que vous pouvez aller par ici. Et si vous utilisez l'étoile comme, ah, vous pouvez multiplier. Donc, nous allons faire doubler ce double le site sur une double facture avec Doublons la hauteur . Ah, donc je vais continuer, faire ça et ensuite je vais faire ah star pour les fois pour entrer et ensuite ça double la hauteur que vous pouvez voir et j'ai un autre aéroport ici, donc je vais faire sortir ça du chemin et On va vouloir juste, tu sais, juste mettre un carré sur ça pour montrer le pento. Donc, l'outil de stylo, comme je l'ai dit, ah, c'est assez intuitif à moins que vous ne soyez utilisé pour des illustrateurs et des outils dans C'est un peu
différent de cela, mais toujours pas trop dur. Donc, si vous obtenez l'outil plume, vous pouvez soit sélectionner dans le panneau d'outils ici, soit vous pouvez simplement appuyer sur p ah, puis une fois que vous l'avez obtenu. Si vous tenez la bouche et que vous la tenez, si vous le retirez comme ça, vous allez commencer par une courbe. Et peu importe où cette petite poignée allait,
c'est l'année où votre ligne va entrer,
ça va commencer. petite poignée allait, c'est l'année où votre ligne va entrer, Donc nous avons un pointage par ici. Vous pouvez voir quand je relâche la souris. Ah, les lignes qui vont par ici. Mais parce que c'est une ligne incurvée, je peux la traîner ici. Ça va créer une courbe. Mais c'est toujours la courbe qui commence toujours dans cette direction. Alors je clique juste une fois sans tenir enfoncé. Alors la ligne suivante sera droite. Si je veux que la ligne soit à, ah ne faisant que des angles de 45 degrés autour du cercle comme ça, je maintiens le décalage, et alors cette ligne sera à zéro degré, puis je clique à nouveau et j'ai une ligne droite. Maintenant, si je clique et maintiens, alors j'ai une autre ligne incurvée. Et comme vous pouvez le voir, euh, cette dernière poignée va être là où la ligne pointe donc vous pouvez juste aller comme ça si vous cliquez et maintenez fait une courbe, juste cliquez une fois fait une ligne droite, et vous pouvez, Tu sais, fais ce que tu veux. Allez sauvage. Et puis une fois que vous avez fini avec votre forme, vous revenez au point de départ et vous pouvez voir qu'il remplit. Et maintenant, tu as une forme complète. Donc, il édite ceci. Vous pouvez utiliser votre orteil de sélection directe. Donc si vous double-cliquez sur un point d'ancrage comme
celui-ci,il va le convertir en une courbe,
il va le convertir en,
ah,
droit un angle droit. Donc si vous double-cliquez sur un point d'ancrage comme
celui-ci, il va le convertir en une courbe, il va le convertir en, ah, Si c'était ah ah ah. Si cela ne se produit pas en double clic,
ça va en faire une courbe. Si vous maintenez,
si vous faites glisser ces poignées,
vous pouvez voir comment ça
change la courbe. Si vous maintenez, si vous faites glisser ces poignées, vous pouvez voir comment ça si vous faites glisser ces poignées,
vous pouvez voir comment ça
change la courbe. Si vous les rapprochez, ce sera moins une courbe que vous apporterez. Ça va être comme une courbe plus large et
plus grande à son tour et voir comment ça change la courbe. Hum, maintenant, si vous voulez un comme vous pouvez le voir, il déplace les deux poignées à l'unisson ici. Donc, si vous voulez juste déplacer une poignée. Maintenez enfoncée, Ault ou ,
um, option sur le Mac, et vous pouvez en faire glisser un seul. Et maintenant tu verras celle-là
aussi séparé . Donc pour les récupérer, si tu voulais être toi et Eunice et encore, tu dois aller et double-cliquer et,
um, um, DoubleClick à nouveau pour revenir en courbe. Eso Puis une fois que vous avez votre forme comme vous le vouliez, alors vous pouvez venir à l'apparence et tout comme d'autres formes l'ellipse et
les rectangles que nous sommes allés plus tôt. Vous pouvez leur donner un remplissage et vous pouvez également jouer avec la bordure si vous le souhaitez. Donc tu veux lui donner un tiret, donne-lui un tiret de 10. L' écart de 10 ne peut pas vraiment voir ça. Laisse-moi aller un peu plus sombre ici et rendre ça un peu plus grand. D' accord. Donc, comme vous pouvez le voir, je sélectionnais la, euh la forme que j'ai utilisée comme arrière-plan. Donc il faisait ce que je pensais qu'il arriverait à ça sur cet eso. Si vous vouliez changer cela, alors vous pouvez venir ici rendra ce peu plus sombre. Donc, vous pouvez le voir et puis un peu plus épais. Et j'aime ces bords arrondis et arrondis. Donc nous allons entrer et lui donner un tiret de trois, et ensuite c'est automatiquement un écart de trois. Mais on peut faire,
Ah, Ah, plus grand écart si on veut et ce que tu peux vraiment voir. Rendons-le encore un peu plus grand. Trump a tous les droits. Ensuite, vous pouvez voir comment il a la bordure pointillée de temps en temps. Si vous voulez entrer en ce moment, vous pouvez voir qu'il sélectionne la forme entière pour que je puisse la glisser et la manipuler comme ça. Mais si je veux revenir en arrière et manipuler les points d'ancrage réels de l'acte, je double-clique et puis je suis de retour. Comme moi, Waas et Aiken, faisons toutes les choses qu'on a passées plus tôt. Une autre chose rapide à vous montrer est que vous n'avez pas besoin de dessiner des formes complètes avec l'
outil Plume . Vous pouvez juste dessiner, disons, vous voulez juste dessiner comme une ligne incurvée comme ça, et ensuite c'est tout ce que vous voulez. Donc tu viens de t'échapper. Et puis que ta forme, euh, comme je l'ai dit, on peut faire la même, hum, frontière ici. Donc disons que nous avons eu celle-là. On aime vraiment la façon dont ça est sorti. Pour une raison quelconque, reprenons le Pento. On va faire une autre ligne ici et vous pouvez voir l'évasion terminée. Et puis je veux dire que je voulais que ça soit pareil. Donc, un moyen facile de le faire est de sélectionner ce contrôle ou commande, voir pour le copier, puis sélectionnez celui-ci un clic droit et coller l'apparence et puis vous pouvez voir presque correspondre. C' est donc une sorte de vue d'ensemble rapide de l'outil de stylet dans X 'd sur la vidéo suivante. On va voir comment on peut l'utiliser pour cette maquette.
27. L'outil Plume en action: D' accord. Donc ce qu'on va faire ensuite c'est ah, on va mettre dans la zone suivante de notre page où on a trié les gens convaincus. Comme je l'ai dit quand je faisais mon croquis. Les idées Les premiers gens viennent ici. S' ils savent déjà qu'ils veulent le faire
, , alors ils vont juste cliquer sur ce bouton et commencer sur un formulaire d'inscription. Mais, vous savez, la plupart des gens vont avoir besoin d'un peu plus convaincant que ça ne l'est dans ce quartier. Nous allons donner un aperçu rapide des étapes qu'ils doivent franchir. Donc, si nous cliquons sur ceci, vous pouvez voir ceci. Vous pouvez voir cette ligne pointillée. Cette ligne pointillée représente ce qui est appelé au-dessus du pli le contenu, c'est ah, Les gens verront quand ils viennent d'abord à la page. Et quand ils font défiler vers le bas, ils en verront plus. Quand ils viendront ici, ils verront cette partie. Et alors qu'ils défilent vers le bas, ils en verront plus. Ah, une chose que j'aimerais faire pendant que je travaille sur des choses est le clic play de temps en temps parce que je ne le mets pas automatiquement en place au point de pause et ensuite vous pouvez faire défiler et avoir une meilleure idée de la façon dont les choses se passaient
et comment ça va ressembler en eux. Parcourez ici. Ok, donc je vais y aller. Et juste pour que j'ai une idée d'où cette Ah, où la ligne de départ est une meilleure idée. Je vais mettre un rectangle carré, enlever la bordure, donc c'est juste attendre. Et maintenant, dans ce domaine, je vais rapidement, eh bien, assez vite mettre les pas que nous allons dio pour convaincre les gens. Donc, comme je l'ai dit, une fois que j'ai passé la zone principale, j'aime garder ah, plus petit fouetté. Si tu gardes ça très large, ça va être dur pour les gens à lire. Et vous ne pouvez jamais vraiment savoir à quel point votre appareil sera, aussi. Alors commencez à avoir l'air bizarre, surtout à haute résolution. Si tu ne mets pas un maximum pour qu'on fasse les 13 100, il y a une autre façon de faire ça et je te montrerai plus tard que ça et je te montrerai plus tard que
X a intégré. Mais j'aimerais juste utiliser un rectangle. C' est rapide et facile. Alors je fais mon set. Peu importe ce qui pourrait Max avec ça ici. 1300. Centrer et puis je vais juste aligner le bord de tout à ça. Alors je fais les lèvres. Je veux dire, maintenez le quart de travail pour qu'il reste. Ah, cercle
parfait. Et maintenant je veux dire frapper le contrôle 3. Donc, je peux zoomer et me concentrer dessus pendant une minute. Enlevez la bordure, donnez-la avec ça plus tard, remplissez la couleur du curseur, et puis je commencerai à taper ici. On va en mettre un. C' est la première étape, et puis je vais faire une zone de texte pour que mon prochain soit mon en-tête et m'assurer que tout reste dans mon cercle. C' est pourquoi la zone de texte a fait. Donc ça va nous dire comment vous voyagez. C' est la première étape. Et puis je vais juste ajuster ma petite zone de texte pour s'adapter à l'espace et dans une tête ou sélectionner l' outil de
sélection. Eh bien, ne buvez pas ça. Et, euh, appuyez sur le contrôle ou la commande tout un plutôt pour sélectionner tout supprimer que j'ai un texte d'espace réservé que je viens de tirer de l'Internet. Si vous allez juste générateur Google Latin, vous devriez trouver beaucoup. Oups. On dirait que j'ai perdu ça. Laisse-moi aller le chercher. Voilà où j'ai eu le mien. Il suffit d'aller sur DCAA Pénis, le
coller et de cliquer sur pour que vous puissiez changer cela. Rendons cela plus petit que le titre. On va faire 18 ans et je ne veux pas ça. C' est trop d'espace entre les lignes pour moi, fiston. Et laissez tomber ça à 21 et je ne veux pas être audacieux comme ça. Donc, si vous voyez le habitué, je ne sais pas pourquoi, mais je n'étais pas un grand fan de l'habitué pour notre Chievo. Donc je vais changer ça sur les orteils Merryweather sur un alors on va dire que ça va être trois lignes. Si vous avez le texte réel, il est toujours préférable de l'utiliser dès maintenant. Mon client ne m'a pas donné le texte, donc je n'ai pas le texte qu'il va utiliser, hum, texte
réservé, mais toujours mieux si vous l'avez pour utiliser le texte rial. Alors je vais obtenir l'alignement, comment je le veux ici. Donc 30 du haut. Et puis si vous maintenez enfoncé toutes les options sur un Mac, vous pouvez voir l'espace entre les choses donc il y a huit entre cela et 16 entre. est Oh, je l'aime plutôt bien. Permettez-moi de m'assurer que c'est centré. J' attends juste que son adobe me dise que c'est centré. On y va. Sur. Celui-ci est également envoyé parce que vous pouvez voir comment ces trois lignes cela signifie que ces deux sont parfaitement alignés. Donc, si celui qui envoie l'autre doit être deux, et puis je vais y aller Eh bien, rétrograder, sélectionner tout et regarder. Et en regardant ça, je pense que je veux le déplacer un peu ici. Donc un peu plus d'espace égal a parlé de lui et ensuite déplacer le contrôle g pour le regrouper. Et vous pouvez voir que j'ai fait tout ça. Et avant de mettre dans des cercles plus dans la raison pour laquelle je l'ai fait est de sorte que je n'ai pas orteil, vous savez, refaire mon texte et l'espacement pour tout le monde peut maintenir l'option déchirée sur le Mac, puis faites-le glisser. Et puis je pourrais juste frapper, euh, le contrôle à la
maison et ensuite y aller, tout ce que j'ai besoin. Et donc il y a 12 sur traînée allait faire trois. D' accord. Alors je pense que tu sais quoi ? En fait, peut-être qu'on devrait le faire parce que je pense que je veux que le dernier soit un peu, tu sais, boum. Tu l'as accompli. Donc ce dernier, je pense qu'on va faire un peu plus grand. Donc, en maintenant le quart de travail, donc ça reste un cercle parfait, mais je vais faire le suivant. Je veux aussi tenir, changer de vitesse et tout ce qui va du centre, rendre celui-ci un peu plus grand. Alors je vais faire celle-là qui est vert menthe. Donc, il se démarque, et alors vous pouvez réellement le voir Aller et changer la couleur du texte. Bon, donc je vais m'assurer que c'est aligné avec ça. Donc maintenant j'ai tout dans ma largeur maximale, et puis je veux les déplacer, les
ajuster un peu. Je ne veux pas être espacé uniformément. Je veux être un peu aléatoire. Presque. Je ne veux pas qu'ils se chevauchent avec ce grand cercle, qui reviendra plus tard. Très bien, donc c'est assez bon. Peut-être que je jouerai ça un peu plus tard, mais c'est assez bon pour l'instant. Alors on va prendre le stylo P, et ensuite je vais faire des lignes courbes qui les relient. Et je veux juste que les
choses soient amusantes et organiques. Juste gâcher avec eux Personne n'a fini. Donc quand c'est fait, je m'étais échappé pour sortir. Donc, vous venez à l'étape un et puis cette ligne guide vous étape vers et je veux rendre cette ligne un peu plus épaisse Donc il se distingue un peu plus. Il est une touche fléchée peut être penser qu'il est encore plus épais, comme environ quatre. Alors j'aime le bouchon arrondi pour que vous puissiez le voir arrondi à la fin Genre de Peut-être que vous ne pouvez pas voir ce zoom dans Vous pouvez voir sur Arrondi à la fin Quand j'ai fait l'arrondi ne peut pas contre le carré comme l'arrondi je vais nous donner un tiret pour commencer par cinq et voir à quoi ça ressemble Donc je pense que ça a l'air assez solide, mais j'ai besoin de plus d'un écart. Essayons 15. Allons Ah, on a 100% et on voit à quoi ça ressemble. Ça a l'air assez solide. Bon, maintenant, laisse-moi appuyer sur P pour retourner à l'outil de stylo. Ensuite, je vais tracer une autre ligne qui relie la suivante. Hmm. D' accord. Laisse-moi revenir là-haut et faire celle-là, je crois. J' ai pas vraiment aimé la façon dont les soins se passaient. D' accord, s'évader de ça a été fait. Retour au pentacle. P, c'est un. Montez. Hum, ce n'est rien de personnel et de pointer là, mais c'est bon. Et boum. D' accord, évadez-vous pour sortir de ça. Alors maintenant je veux ce style sur tous les autres. Une façon si rapide de le faire. C' est juste un contrôle. Tu vois ? Ensuite, vous sélectionnez celui-ci. Contrôle Ault V qui va coller l'apparence. Vous pouvez également cliquer avec le bouton droit sur l'apparence. Et vous pouvez également obtenir le raccourci max. Si tu fais ça. Siemens Cannon Uh, option de
commande v Esso, puis nous y allons. On a de ces montants. On peut voir tout ça. Donc j'ai une sorte de mesures supplémentaires qui viennent convaincre les gens de s'inscrire pour notre sérieux. On les a aménagés. Dans la prochaine vidéo, je vais créer une forme qui reliera ces deux sections. Donc, ce n'est pas seulement ça. Ah, ligne droite
dure qui la finit. Il y a donc un lien entre cette zone principale et la zone suivante. Et je vais probablement les modifier un peu, mais on en a assez pour l'instant. Bon, passons à la prochaine vidéo.
28. Ajouter une forme courbe: C' est comme je l'ai dit. Maintenant, on va faire une forme qui, espérons-le, reliera ces deux sections ensemble . Alors débarrassons-nous de ça. Je n'ai pas besoin de ça maintenant. Je peux toujours le remettre plus tard si je veux. Et nous allons nous débarrasser de cela aussi, pour que je puisse voir avec quoi je travaille. Je l'ai verrouillé. C' est bien. Signez une sélection tous ces. Je veux tout déplacer. J' utilise ma touche fléchée pour les déplacer un peu vers le haut et en regardant ça dans le cercle, je pense vraiment que j'ai fait un cercle un peu trop grand, donc je vais frapper le contrôle sur Mac. Pourquoi ? vais ici pour que je puisse m'ajuster. Écoute, je veux dire, maintenez le quart de travail enought et juste rendre ça un peu plus petit
, en remontant un peu trop. D' accord ? Dis qu'on y va. Et maintenant je vais frapper P pour avoir l'outil de stylo, et je vais faire cette forme. Je pense que je voulais suivre cette île en quelque sorte suivre ce cercle de cette façon, quand on descendra au fond de tout ça, ça ne sera pas qu'on n'arrivera pas à une fin comme ça. C' est ce que je vais faire pour essayer les orteils. Mais le lien de ces deux-là donc le maintenir en bas. Donc, je commence par la courbe et puis je la tire à nouveau vers le bas. Alors je suis resté avec une courbe. Je veux garder tous les ah, tous les points se sont produits. Je n'aime pas ça quand je veux dire, défaites ça. Tu veux aller un peu plus bas ici. Je ne le suis pas exactement. Et je veux être parfaitement espacé. Alors montre-moi. Je veux dire, reviens un peu plus pour que tu puisses le faire comme ça. Ah, tu défaisais ? Si vous n'aimez pas les choses où vous pouvez juste mettre quelque chose de rude et puis revenir arrière et jouer avec vos points d'ancrage après avoir eu une idée approximative de ce que vous voulez faire ? D' accord. Alors emmenez-nous ici et je m'en soucie. Sortez un peu de l'écran, ramenez-le. Non. Comme je l'ai dit, nous ne voulons pas avoir un de mes objectifs est d'éviter cette fin droite. Donc je vais couvrir tout ça, amener ici et ensuite hors écran. Je veux dire, faites une autre courbe. Pour qu'on ramène cette photo. Je vais Lincoln que je veux dire un DoubleClick DoubleClick à nouveau. Retourne cette courbe. Je vais le retirer un peu de l'écran. Non, je vais enlever la frontière parce que je ne veux pas importer. Je vais mettre un Phil. Non, ça le couvre parce que j'ai fait ça dernièrement, donc je vais tenir. Ah, contrôle ou commande sur un support ouvert Mac pour déplacer cela vers le bas dans les couches afin que je puisse voir ce que j'ai fait. Donc, en fait, je l'aime plutôt bien. Je pourrais zoomer un peu et jeter un oeil à ce double clic pour que je puisse
atteindre les points d'ancrage. Je pourrais zoomer un peu et jeter un oeil à ce double clic pour que je puisse Je ne veux vraiment rien. C' est un peu pointu. Alors je vais essayer d'aller jouer avec ces petits pour les lisser. Mais, euh, en
gros, c'est plutôt fait. Je vais jouer un peu plus avec nous. tu dois regarder ça Maistu dois regarder ça. Alors maintenant pourquoi ne pas entrer et créer ce que vous allez faire dans votre prochaine section après vous après votre section d'atterrissage de héros. Allez-y et créez cela, enregistrez-le, puis téléchargez-le dans votre zone de projet afin que nous puissions continuer à voir comment votre itération de votre projet
29. Compétences XD : Masquer les images: D' accord, donc cette fois on va couvrir comment masquer une image avec une forme. Donc, ce serait comme lorsque vous voulez faire une image qui est un carré que vous voulez tourner cercle afin que vous puissiez simplement utiliser une forme pour le faire. Donc, je vais appuyer sur E pour l'outil Ellipse et ensuite je vais maintenir la touche Maj enfoncée pour qu'il reste un
cercle parfait et le faire glisser hors contrôle trois pour zoomer dessus afin que vous puissiez voir mieux. Et puis je vais d'abord vous montrer la façon la plus simple de le faire. Vous venez d'entrer et de saisir votre image que vous voulez utiliser, puis vous faites glisser dessus et quand la forme devient bleue comme ça, relâchez vos bouches sur leur il iss adobes l'a fait pour vous. Ils ont redimensionné l'image, comment ils pensent qu'elle devrait être et vous êtes tous prêts. Si j'appuie sur être pour mon outil de sélection, alors vous pouvez voir que je peux faire glisser ceci et tout ce qui reste connecté Comme je redimensionne la forme, il redimensionne également l'image. Si je vais ici, je peux enlever la frontière. Si je double-clique Ah, je peux changer la taille de l'image comme ça la rendre plus petite, plus grande maintenant. Une chose que je ne peux pas faire quand j'ai glissé à partir du fichier et que je dépose comme ça. Vous verrez que je double-clique sur cette forme, mais je ne peux pas la sélectionner, donc c'est une limitation. Lorsque vous le faites de cette façon, vous ne pouvez pas changer indépendamment la taille du mouton. Il a toujours lié eso. Maintenant, je vais aller de l'avant et supprimer ceci et je vais vous montrer une autre façon qui vous donne un peu plus de droits de contrôle cette fois frapper le P pour l'outil de stylo. On va juste nous faire une forme abstraite et
aléatoire ici. Ok, donc il y a notre forme sur une image de capture à nouveau. cette fois, Maiscette fois, je ne vais pas le glisser dans l'image. Je veux dire, traînez-le hors de l'image, au moins celle de ma bouche. Et c'est une image plus grande. Mon ordinateur se sent un peu surchargé, mais il finira même par y charger plus gros que ce dont j'ai besoin, alors je vais aller ici, entrer 500 pour le fouet, concéder que Locke est là. Donc, quand j'appuie sur Entrée, redimensionner est proportionnellement. Et maintenant je veux un masque, cette image avec cette forme. J' ai donc l'image sélectionnée et maintenez la touche Maj enfoncée. Sélectionnez la forme qu'il contrôle. Déplacer em. On m'a demandé une autre façon de le faire. Et défaisons ce qu'on vient de faire. Si vous faites un clic droit, démasquez. Alors maintenant, le masque est parti. Donc une autre façon de le faire et maintenez la touche Maj enfoncée à nouveau pour sélectionner à la fois la forme dans l'image . Ensuite, faites un clic droit Ah et masquez avec la forme. Maintenant, vous pouvez voir si je double-clique dessus. La première chose qui est sélectionnée est la forme elle-même. Maintenant, je peux changer la forme, et c'est complètement indépendant de l'image. Ensuite, si je clique à nouveau maintenant, j'ai accès à la forme. Donc, le faire de cette façon vous donne un peu plus de flexibilité que de simplement glisser et déposer directement dans la forme.
30. Ajouter une image circulaire: D' accord. Je vais vous montrer comment je vais utiliser cette technique de masquage que nous avons couverte dans ah, dans ce projet. Nous avons donc commencé à essayer de convaincre les clients, ou plutôt, nous avons commencé à essayer de convaincre les clients qu'ils devraient envisager ce service . Nous avons donc nos pas ici qui, espérons-le, aideront dans ce sens. Et maintenant, nous allons juste donner aux gens une idée de qui est derrière le site et en quelque sorte d'essayer de construire la confiance. Nous allons parler plus de qui est derrière le site au sujet de la section. Donc, puisque c'est un client hypothétique, je vais juste utiliser ma propre image ici. J' ai l'outil Ellipse ici. Je vais maintenir le décalage pour faire un cercle parfait. Je vais garder le contrôle ou la commande sur un Mac trois zoom dans cette forme pour que je puisse la voir facilement. Et maintenant, je vais prendre mon image. Donc juste la photo que j'ai de moi-même. Et au lieu de le laisser tomber dans la forme, je vais le déposer sur ma toile. Comme je l'ai dit, je vais me donner plus de contrôle. J' ai sélectionné mon image. Maintenez enfoncé, décalez comme mon changement de contrôle de forme. M. Et on me demande deux fois, cliquez, cliquez à nouveau pour obtenir mon image. Et c'est une image légèrement difficile à travailler quand j'essaie de mettre en cercle parce que mon visage est si proche du bord. Donc je n'ai pas vraiment d'espace pour travailler ici. Donc, probablement dans la vraie vie, je veux choisir une image différente. Mais on va aller avec ça pour l'instant. Très bien, donc on monte un mât
mon visage, je vais zoomer un peu et puis frapper E pour attraper l'ellipse pour tenir à nouveau ,
passer à sec J'ai un autre cercle et ce cercle sera pour le texte sur moi. Je vais maintenir la commande de contrôle sur le Mac. Ah, hum ouvert le support pour le pousser derrière. Je vais enlever la frontière. Donnez-lui un remplissage. On va aller avec ça comme du vert pour l'instant. Déplacez ça un peu. Je ne veux pas vraiment être au centre, mais je ne veux pas être juste pour trouver le bon endroit pour ça. D' accord ? Et j'ai pris du thé pour mon outil de texte et je vais juste taper sur moi. Pas de m'écrire. Grab zone ici, faire une zone de texte en faisant glisser, en disant que c'est probablement obtenir va jouer sans un peu. Et j'ai déjà copié et collé du texte d'espace réservé à partir de, ah, outil
en ligne. Donc je vais le rythme. Il est donc clair que j'ai besoin de réajuster la taille de ce texte. Alors je vais aller par ici. Ah, on va choisir la taille d'abord. Faisons ça. Allons voir ce qu'on a fait ici. J' aimerais être cohérent, donc je vais chercher mon outil de sélection. Alors voyons. Bon, donc c'est juste le contrôle. Copie, contrôle. Voir pour copier. Et puis on va faire l'apparence de pâte pour qu'on puisse copier ce style là-dedans. Bon, donc on a un texte réservé ici. Maintenant, je veux centrer ça dans le cercle, donc je vais déplacer ma souris jusqu'à ce qu'elle me dise que c'est centré comme ça. Une autre façon de centrer. Ah, sélectionnez les deux formes. Et puis il devrait être centré avec le plus grand. Je pense que c'est déjà centré. Donc, tout est là. Et je pense que c'est probablement un peu plus de texte que j'en ai besoin On va le faire comme deux paragraphes et ensuite le boire un peu. Je pense aussi que ce cercle a fait est trop grand compte tenu de la quantité de texte que j'ai. Donc je veux dire, hum, déposez ça pour tout sélectionner, essayer un peu. Donc je joue juste avec ça pour l'amener là où je voulais être. Donc c' est essentiellement ce que vous faites, comment vous pourriez incorporer ah, masquer avec forme dans votre design. Alors pourquoi ne pensez-vous pas s'il y a un moyen que vous voulez incorporer ? Je demande avec des formes dans votre conception, allez-y et faites-le, téléchargez-le, puis obtenez des commentaires, puis passez à la vidéo suivante.
31. Compétences en XD : Gradients: Bon, donc dans cette vidéo, on va voir comment faire un Grady int. Comme ceux d'entre vous qui ont regardé remarqueront que j'ai joué un peu avec la façon dont j'
avais ma section sur moi,
et ce que je veux faire c'est que je veux en quelque sorte lier ces deux sections d'une certaine façon. Comme ceux d'entre vous qui ont regardé remarqueront que j'ai joué un peu avec la façon dont j' avais ma section sur moi, Je ne suis pas sûr que ce soit une bonne idée,
mais on verra comment ça se passe. Je ne suis pas sûr que ce soit une bonne idée, Donc ce que je vais faire, c'est appuyer sur p pour l'outil de stylo. Je vais noyer une autre forme. Tu te souviens ? J' ai dessiné la forme en haut. Je suis juste en train de dessiner. Ah, forme organique
aléatoire ici. D' accord. Je reviendrai probablement et raffinerai ça plus tard, mais pour l'instant, je pense que ça fera l'affaire. Bon, donc je le pense. Au lieu de remplir ça avec la couleur, je vais le remplir avec un int Grady. D' abord. Je vais enlever la frontière. Vérifiez Phil, cliquez sur ce, et puis vous pouvez voir en ce moment il est réglé la couleur unie. Donc ça montre un blanc solide. Je vais aller à l'ingrédient linéaire. Et maintenant vous pouvez voir qu'il est converti en un int Grady. C' est la couleur blanche ah. La couleur blanche montre ici. Donc si je fais glisser ça, la couleur blanche va commencer là et alors quoi ? Revenons là-dedans ? Ma traînée à cette fin, la grande couleur va aller là-bas, qui est ce que je veux, mais je veux changer ces couleurs. Donc d'abord, je vais cliquer sur le blanc. Vous pouvez voir maintenant que c'est sur le blanc. Donc, pour changer cette couleur, je viens ici et je choisis une de mes couleurs dans cette zone. Et si je veux changer ce gris, je peux faire comme ça. Maintenant, j'ai ce Grady Int Ah, et c'est tout ce qu'il y a pour faire des ingrédients. C' est assez simple. Je vais aller de l'avant et jouer un peu avec nous. Mais ah, il n'y a rien de plus que tu dois apprendre. Ah, créez vos propres salutations. Ah, une chose que je vais mentionner est que vous pouvez aussi faire un ingrédient radio qui sera du centre, sorte de ah, cercle basé radiant. Donc, toute la radio rayonne du centre. Je ne les utilise pas souvent. J' utilise généralement le linéaire grand et gourmand dans ah donc c'est Grady incident Nutshell. Allez-y et réfléchissez à comment et si vous le souhaitez, appliquez cela à votre design. Et si vous le faites, allez-y et configurez-le, puis téléchargez afin que nous puissions continuer à voir vos progrès.
32. Ajouter un formulaire de contact: Bon, donc à ce stade, on va finir la maquette ici. Je vais y aller et ajouter un formulaire de contact. Donc, dans un premier temps, acheter un double clic sur ma toile et ensuite le faire glisser vers le bas pour que j'ai plus d'espace pour travailler, et ensuite je veux rester avec Oh, ouais. Comme vous pouvez le voir, je change la forme du lit. Je pensais juste que ça avait l'air un peu mieux que ce que j'avais. Alors j'ai joué un peu avec ça. Et en regardant ça,
je pense que je voudrais juste bouger ça juste un peu. Et en regardant ça, Donc j'ai un peu plus de chevauchement entre ces deux choses, et ça relie les deux sections d'une manière, euh, donc maintenant je vais descendre ici et nous allons commencer sur le formulaire de contact, alors maintenez le décalage. Commencez par un cercle parfait. Euh, mais je veux faire une sorte de forme juste parce que je pense que ça va mieux s'adapter. Et puis c'est aussi un peu plus ça va aller mieux avec ces autres organiques dans des
formes parfaites que j'ai faites. Donc je vais frapper V pour obtenir l'outil de sélection que je vais cliquer sur la forme contre ça , j'obtiens les points d'ancrage, et ensuite je peux juste faire glisser le point d'ancrage où je veux. Et c'est juste une autre façon de faire votre propre forme. Je vais juste jouer un peu autour de ça, Zach. Quelque chose à un autre point d'ancrage là-bas. Donc nous allons juste jouer avec ça jusqu'à ce que nous obtenions quelque chose qui fonctionne bien pour le contact pour Peut-être que je veux avoir un peu de chevauchement juste pour garder les choses liées. Et depuis que je suis sorti de l'écran ici, hum, pas un. Peut-être que je veux sortir de l'écran, donc je joue juste autour de la forme jusqu'à ce que je pense que c'est là que je voulais être. D' accord. Je pense que ça marchera. Monte ici et attrape ça. Et je maintiens enfoncée sur glisser ça ici, contrôler le crochet étroit pour le faire monter, et maintenant il va double-cliquer pour que je puisse changer ça en contact. Donc, comme je l'ai dit avant Ah, les gens ont une chance. Teoh, inscrivez-vous ici. S' ils cliquent sur le bouton « Go places » et si on l'espère, s'ils ne le font pas. Ils passent par ici, ils lisent sur le processus qu'ils viennent ici. Et ils, euh, lu plus sur la personne derrière le projet, et ensuite ils vont venir ici, et ensuite ils vont faire le Sinem. Alors maintenant, n'y allez pas. Je vais créer un rectangle pour le formulaire d'inscription. Et c'est un domaine où il doit vraiment faire attention à nouveau. Un peu comme quand vous êtes assis ici, vos tailles de police. Je suis zoomé sur 50. Donc je veux dire, pour moi, ça a l'air bien, mais je sais par expérience que je voulais vraiment beaucoup. Ah, beaucoup plus court. Donc je vais aller ici et frapper 48 entrées. Et si vous zoomez sur 100, vous pouvez voir qu'à 100% 48 fonctionne assez bien. Donc je vais aligner ça avec le formulaire de contact et ensuite je veux autour des extrémités ici pour qu' ils correspondent aux boutons que nous avons. Donc, je vais juste cliquer et puis maintenir ma touche fléchée enfoncée sur mon clavier jusqu'à ce que j'obtienne le bord
arrondi. Et c'est toujours une bonne idée de mettre ce que la forme est quatre au-dessus de la forme elle-même
plutôt que dans la forme que vous pouvez faire les deux. Si vous le souhaitez, vous pouvez faire un exemple dans le formulaire, puis mettre ce que c'est pour ci-dessus. Mais vous voulez toujours l'avoir là parce que les gens,
une fois qu'ils cliqueront sur ce qui était dans l'exemple ou ce qu'il était, quatre disparaîtront. Et là, ils pourraient oublier. Hum, donc tu veux toujours mettre l'étiquette au-dessus du formulaire. Donc on va faire cet e-mail. Mon texte est blanc, pour ça
que tu ne peux pas le voir. Donc on va aller de l'avant et le changer pour une couleur qu'on verra quand on ira avec ce
violet foncé . Et je pense que je vais aussi au lieu d'utiliser Merryweather, je pense que je vais utiliser Ah Chivo ici. Je vais devenir noir. J' aime ça. Je vais faire de cette petite sortie juste une étiquette de formulaire sur. On va le ramener à 12. C' est peut-être trop petit, mais on pourra toujours jouer avec ça plus tard. Et puis j'aime une sorte d'Aliant où commence cette courbe. C' est ce que je suis sur lequel je veux un peu plus grand. Je pense que ça va 16 ? Oui. Et je pense que je vais remplir ça. Remplissez ce champ de formulaire dans. Fais ça. Faisons ça ça. Je pense que ce sera facile. Ensuite, on peut faire du lettrage blanc là-dedans, et donc tu veux le mettre. Comment tu veux ton ah, champs orteil Regarde avant de partir et ah, fais un autre. Donc, une fois que vous l'avez dit, puis sélectionnez les deux maintenez enfoncé et puis dupliquez. Et puis vous pouvez mettre dans un autre champ ici si vous voulez. Pour qu'on puisse faire ce nom, et ensuite l'email de celui-ci. Ah, et puis je regarde ça, et je pense que c'est un peu trop j'ai ces deux larges, donc je veux rester dans la même chose avec nous, comme les deux en même temps ont bu ça dedans. Et puis je vais apporter ce bouton. Dobie me parle de cette nouvelle fonctionnalité. Bon, donc je vais glisser dans mon bouton de symbole qui a été créé avant, et je vais m'allonger avec le bord de ça. D' accord ? Et maintenant j'ai un formulaire de contact très basique. On va évidemment avoir besoin de jouer un peu plus avec ça, donc je vais continuer à travailler sur ça
33. Créer un menu: D' accord. Donc, comme je l'ai dit, j'ai passé un peu plus de temps à travailler sur la zone de contact ici, ai, genre, rayonnant à elle. Et puis j'ai changé autour des couleurs des formulaires d'entrée et des boutons. Donc j'ai fait beaucoup de changements, fondamentalement, et j'ai aussi ajouté dans un pied de page simple ici en collant avec le thème du cercle. Euh, et il y aura juste trois éléments de menu. Donc maintenant ce qu'on va faire, c'est qu'on va remonter, et quand je remonte, tu verras que j'ai apporté d'autres changements au design en cours de route. Euh, juste un peu nettoyé, et je pourrais nettoyer un peu plus avant que je l'appelle terminé. Mais maintenant ce qu'on va faire, c'est faire le menu, et pour faire ça, on y va. Nous avons déjà notre icône de hamburger ici qui représente le menu. Mais maintenant on va y arriver. Quoi ? Le menu ressemblera à ce que les gens cliquent dessus. Donc on va attraper par rectangle Tool on buvait hors de lui. Ah. Ensuite, je vais enlever la bordure, ombre portée sur et autour des coins un peu. Tenez, essayez quatre. Donc vous dans un peu plus. On peut voir ça. Passez à l'orteil de sélection directe, puis cliquez sur pour que nous puissions voir Gonna ombre portée, coins
légèrement arrondis. D' accord. Non, j'y vais. Teoh, attrape l'outil de texte. On va faire notre menu. Donc j'ai déjà oublié ce que j'ai mis le bas. On va devoir vérifier à nouveau. Je pense que c'est la quantité, puis l'outil de sélection directe Paul glisser pour le copier. Contact sur ce qui est encore le dernier ? Retournons longtemps. Oui. D' accord. D' accord. Donc on a eu ça. Et maintenant, nous allons choisir un lien que nous avons utilisé ici. Donc probablement soit sont ce que nous utilisons pour les boutons ou quelque chose de similaire. Donc je veux dire, sélectionnez ça, et je vais le copier. Ensuite, je vais sélectionner tous ces clic-droit et coller l'apparence. Vous pouvez voir qu'ils sont devenus blancs. Donc, évidemment, vous ne pouvez pas voir le blanc sur l'arrière-plan du menu blanc, donc on va passer à ce violet foncé. Et étant donné qu'il y en a si peu et tout l'espace, je veux dire, nous allons probablement rendre cette boîte un peu plus petite. Quoi ? On va encore avoir besoin d'espace, donc je pense que je vais agrandir. Essayons 30. D' accord. Bien, gentil ira même 36. Alors assure-toi de les avoir tous 36. D' accord ? On y va. Et ensuite, on va réduire ces petits morceaux. Je vois qu'on n'en a pas vraiment besoin. Ensuite, nous avons également besoin d'un moyen de fermer ce menu. Maken X a attrapé la ligne d'orteil maintenez le décalage de décalage de sorte qu'il fait un angle parfait de 45 degrés. Alors je vais faire augmenter la taille de ça. Essayons autour des bords. Ici, sur. On va faire la couleur. Ils sont violets aussi. Rex. Outil de sélection, le Là, nous allons. Et maintenant à la maison. En bas, encore une fois, copieur. Ensuite, on va faire pivoter 45 degrés
, en faisant tourner 90 degrés et ensuite on va l'aligner sur l'autre. Non, j'ai X pour les gens afin qu'ils puissent fermer le menu quand ils auront fini avec ce dont ils ont besoin . Et mets ça ici dans ce coin. Je suis au centre de ceux-ci dans ce et maintenez la touche Maj enfoncée pour tout sélectionner. Je vais ici et ça devrait être centré sur l'objet plus grand. Donc, ceux que j'ai centré, de sélectionner tous les rétrogradés, puis de sélectionner le rectangle en arrière-plan va être tout sélectionner. Je vais les espacer un peu plus depuis qu'on a tellement d'espace ici et ensuite je
veux m' assurer qu'il y a un espacement homogène. Je vais les sélectionner tous ici pour répartir l'espace vertical uniformément. On dirait que j'ai déjà fait ça. Donc nous sommes tous prêts. Ah, donc c'est un menu très simple qu'on a fait là-bas, donc probablement un peu là-haut. Mais si tu veux, je veux aller de l'avant et installer ça. Et ce qu'on va faire, c'est qu'on va utiliser ça dans la prochaine vidéo pour faire un petit
prototypage de base .
34. Compétences XD : Prototype de menu: nous avons fait un menu, et dans cette vidéo, nous allons y ajouter un mouvement afin que lorsque les utilisateurs cliquent sur le hamburger, ce menu entre en jeu. Donc, une partie de cela est, je veux m'assurer que ce X est à peu près là où se trouve le menu hamburger. Alors fais ça. Je vais donner réduire l'opacité sur ce, que je peux voir ce qu'il y a en dessous. Et puis je vais maintenir la touche Maj enfoncée pour sélectionner ces deux lignes sur le X. et pendant que j'ai fait ça, je vais frapper le contrôle G pour les regrouper. Je ne veux pas continuer à faire ça. Et puis je vais grossièrement aligner ça donc c'est à peu près sur le menu des hamburgers. Et maintenant que j'ai fait ça, ramène ça. Mais je veux jouer. Je veux dire, ça n'a pas besoin d'appuyer. Utilisaient juste ceci pour un exemple. Mais je veux juste que je ne peux pas m'empêcher de monter un peu et de baisser un peu ça. Bon, maintenant orteil prototype ça. On doit faire ça sur son propre tableau d'art. Donc, nous voulons faire de l'aéroport la même taille que ce menu est. Donc, il est 5 56 par 5 80 tri que Zoom ici grabber art board outil essayer une forme pour commencer. Ensuite, nous allons taper 5 56 par 5 80 il entrer sur nos mots, même taille. Et maintenant, on va choisir tout ce qu'on a ici. Et on va juste sécher ça sur la planche d'art en se déplaçant, en utilisant mes touches fléchées pour le déplacer de temps en temps. Si Dobie veut te dire quand c'est une ligne, laisse-moi juste zoomer pour que tu puisses voir un peu mieux. Vous pouvez voir dans le coin supérieur ici. Ça me dit combien il est loin du jeu de fléchettes. Donc je voulais être si je voulais être parfaitement aligné comme ça. Et vous pouvez voir quand j'ai atteint cet alignement parfait,
il y a la croix qui vient vous indiquer ça,
et on va faire un pas de plus. croix qui vient vous indiquer ça, Ce n'est pas nécessaire, mais je pense que ça peut être utile pour le prototypage juste pour rendre cette cible un peu plus facile pour les gens à frapper, on va mettre la forme juste au-dessus. Mais on va enlever la bordure et enlever les films que vous pouvez voir le X
passer . Toujours. Bon, maintenant nous sommes tous prêts, beau. Motion à ce sujet. Ah, pour faire ça, nous devons passer sur l'onglet prototypage, et vous pouvez voir quand j'ai cliqué sur le prototype, tout
ce menu a disparu. Et aussi, nous avons beaucoup moins d'options ici. C' est parce que cela est axé sur le prototypage, donc il y en a beaucoup dont nous n'avons pas besoin. Ils ont juste Adobe a sagement limité à ce dont vous avez besoin. Et ce que nous voulons arriver, c'est que nous voulons quelque chose qui s'est passé quand les gens cliquent dessus. Donc on va cliquer dessus et dire à Adobe ce qu'on veut, um, ce clic pour être connecté pour le faire glisser sur ce tableau d'art. Et puis une fois que nous l'avons sur le tableau d'art, nous le publions, et cela nous donnera ces options pour ce que nous voulons avoir. La transition par défaut est la transition, mais nous allons faire une superposition ici, et vous pouvez également voir que nous avons quelques options pour la destination. Notre conseil, notre mot un, puis l'animation se dissolvent. On va vouloir que je veuille avoir cette diapositive dans, hum, un moment difficile de se souvenir, euh, si je voulais glisser à gauche ou à droite, on va faire une diapositive à droite et voir comment ça se passe. Et puis vous pouvez également définir la durée Combien de temps cette petite animation prend. Donc juste pour le rendre plus facile à voir fera, euh, 0,8 seconde. Et maintenant on va cliquer sur jouer pour tester ça et voir comment ça marche. Donc nous cliquons dessus, et comme vous pouvez le voir, ça arrive du mauvais côté. Ce n'est pas une ligne correctement s donc nous devons retourner ici et jouer avec ça un peu plus. Donc, nous allons cliquer sur cela à nouveau. Et une chose que j'ai échoué et c'est quand vous faites la superposition vous donne que cette
version verte de l'art s'ennuie et que vous voulez faire glisser ça en place pour où vous vouliez
apparaître . Donc on l'a traîné en place là-bas, et maintenant vous pouvez voir que c'est là que ça arrivera quand les gens cliqueront dessus. Et comme je l'ai dit, j'ai remarqué que je l'ai en fait juste glisser à droite. Mais je voulais vraiment glisser à gauche. Alors allez-y et faites-le glisser à gauche. Et puis une autre chose. On va faire pendant qu'on est là après que ça arrive dans ce qui va se passer quand les gens cliqueront sur ça. Nous voulions revenir à ce tableau d'art. Donc maintenant, nous avons les deux animations mises en place. Euh, ouverture et la fermeture. D' accord. Et maintenant on va cliquer sur jouer, ne vois pas ce qu'on a fait ici. Peut voir qu'il s'est ouvert dans le menu parce que c'est ce que j'avais ah, sélectionné lorsque je clique sur jouer. Donc, nous voulons vraiment cliquer dessus. Donc, il s'ouvre, ouvre notre site Web, puis nous cliquons ici qui se glisse, cliquez ici, il glisse hors. Donc c'est Ah, simple petite animation. Ah, une petite animation prototype. Dans la prochaine année, on va montrer comment vous pouvez partager ça avec vos clients.
35. Prototypes de partage XD: Ok, Donc j'espère qu'après la dernière vidéo, si vous suivez tous, vous êtes allé de l'avant et avez fait une sorte de partie cliquable de votre designer. Peut-être que vous construisez un prototype encore plus avancé eso dans cette vidéo. Nous allons voir comment partager vos prototypes. Parce que si les gens n'ont pas X d, ce que la personne moyenne ne le fera pas, alors ils ne seront pas en mesure de voir ce que vous avez fait à moins que vous créez ah, longueur que ah ne soit pas vous permet de créer afin qu'ils puissent accéder et interagir avec prototype. Et comme je l'ai dit dans l'autre vidéo beaucoup de temps, je n'utilise pas nécessairement cette fonctionnalité prototype pour les prototypes. Je l'utilise pour partager des choses avec des clients. Donc c'est comme ça que je vais discuter de ça, euh, pour cette vidéo, pour partager. Ah, on va ici dans la zone de partage comme ça, et on va dire un prototype publié et j'ai déjà partagé ceci une fois pour que je puisse cliquer sur mise à jour où je peux créer un nouveau lien. Je vais juste super clic mise à jour, et puis ça va prendre un peu de temps pour charger. Et une autre chose que je veux mentionner en attendant que cet orteil soit complet. Il est mise à jour est que c'est sur Lee, si vous avez des prototypes quelque chose mais pas tout dans ah espace de travail, il va seulement montrer ce que vous avez ce que vous avez connecté. Donc, dans cet espace de travail, il n'a connecté que le menu et ce tableau d'art principal sur lequel nous avons travaillé. Et si j'avais le contrôle zéro ? Vous pouvez voir que j'ai tout un tas sur leurs affaires ici pour que je puisse contrôler trois pour revenir en
arrière. Mais vous verrez dans un instant qu'il va seulement montrer dans le lien les choses qui sont connectées. Alors maintenant, on va sortir. Et j'ai déjà ouvert ça et un autre et, euh, la navigation. C' est juste du chrome. Et j'ai juste collé le Lincoln ici. Parfois, il faudra un peu de temps pour que le lien se charge. Donc c'est quelque chose que je dis souvent à mes clients quand je partage avec eux qu'il faut
juste être patient. On en a beaucoup. C' est un grand projet, et j'ai beaucoup de choses à faire ici, donc soyez patient pour la charge des orteils de liaison. Ensuite, vous pouvez voir que vous pouvez simplement faire défiler normalement une fois que vous avez votre souris dessus tout comme être sur un site Web. Fondamentalement, venez ici et agrandir, et puis vous pouvez cliquer sur escape pour sortir de cette vue, ils aussi vos clients ont la possibilité de faire des commentaires ici. Cela pourrait être une fonctionnalité utile. Donc, disons, je voulais faire ça. Faisons semblant sur le client. Je peux faire glisser une épingle ici, la
mettre sur ce bouton, dire quelque chose comme ça un peu plus grand. Et puis cette comète va venir et je pourrai y répondre. Um, ok, je vais travailler dessus. Et vous pouvez également alerter les personnes mentionnant les utilisateurs. Je suis le seul avec qui cela a été partagé, donc je suis la seule option. Faire ça ? C' est juste une autre fonctionnalité. Et maintenant je vais vous montrer la, hum, elle avait un prototype qui fonctionnera, donc si vous cliquez n'importe où, vous pouvez voir qu'il met en évidence la partie qui a été rendue cliquable. Donc nous venons ici et nous cliquons dessus et il vient comme il l'a fait le jour suivant en utilisant le bouton de lecture. Ah, donc c'est une introduction rapide à la façon dont vous partageriez quelque chose que vous avez prototype avec votre client ou des utilisateurs avec lesquels vous allez le tester. , Dans la prochaine vidéo,
on va parler de la façon dont les orteils exportent vos tableaux d'art sous forme d'images, parce que quand je le fais, j'en ai l'habitude quand je partage avec des clients, j'exporte généralement sous forme d'images. Et puis je crée aussi ces liens juste pour donner aux clients des options. Alors pourquoi n'allez-vous pas tous créer des liens et les télécharger pour que nous puissions voir le travail de
prototypage que vous avez fait sur votre maquette ?
36. Compétences XD :: Donc, dans la dernière vidéo, nous avons parlé de la façon dont le partage avec des liens, et c'est utile lorsque vous voulez un prototype. Et honnêtement, lorsque je partage avec mes clients, je recommande généralement qu'ils utilisent les liens. Je pense que ça leur donne une meilleure idée de ce que ça va vraiment ressembler. Ils peuvent faire défiler et ils peuvent faire défiler, et il ressemblera à cela dans un navigateur. Mais je partage aussi généralement des images juste pour qu'elles aient aussi. Donc, la première chose que je fais quand je suis dans les partages, je double-clique ici et je change déjà le nom. Est-ce que cela a changé ce nom, la page d'accueil, Et puis vous prenez juste le contrôle E commande sur Mac, et vous pouvez sélectionner votre destination. Nous allons juste mettre des documents, sélectionner le dossier, et vous pouvez également changer le format. Si tu veux. D' habitude, je vais avec PNG, et je ne vais pas exporter ça, parce que je n'ai pas vraiment de clients, et je vais le partager avec pour le moment. Mais si je l'étais, je clique juste sur exporter, et cela l'exporterait dans ce dossier. Et puis vous pouvez aller et utiliser en exhortant besoin à partir de ce dossier. Ah, donc c'est tout pour cette page d'accueil. Hum, pour terminer votre projet sur recommander de passer un peu de temps ou de trouver ce que vous avez fait, puis télécharger tout ce que vous avez fait dans la
zone du projet de partage de compétences . Et, vous savez, j'ai vraiment hâte de voir ce que vous venez avec dans les prochaines vidéos. On va juste couvrir quelques conseils qui n'ont pas vraiment de sens pour ce projet. Mais cela devrait vous être utile au fur et à mesure que vous continuez. Ah, la conception de sites web.
37. Compétences XD : Répétitions de la grille: Donc l'une des caractéristiques les plus cool de X D est ce gars sur le système de grille qui vous permet de répéter , hum, quelque chose. Ensuite, vous pouvez apporter des modifications à tous les éléments de votre groupe en même temps afin de vous faire gagner
beaucoup de temps. Si, ah, c'est le type de marque que vous devez faire. Donc, titre d'exemple, je viens de créer cette carte. Peut-être que je n'avais pas de place pour ça sur ma page d'accueil, mais peut-être que j'aurais une place pour ça ailleurs sur une page ou quelque chose comme ça. Et disons que je voulais avoir un tas de cartes, dit que j'ai juste une. Donc, ce que je fais c'est que je vais de l'avant et que je mets en place la carte. C' est tout ce que je voulais et dont j'avais besoin. Et puis une fois que je l'avais configuré, je sélectionnais tous les éléments qu'il contient. Et puis je viens ici comme une grille de répétition, et vous pouvez voir qu'il a changé en vert, et ensuite vous. Si vous faites glisser dessus,
vous pouvez voir qu'il va répéter cette forme encore et encore, puis vous pouvez ajuster l'espace entre les formes en survolant ici, puis simplement en faisant glisser et en sortant, et que vous pouvez également les formes comme ça. Hum, donc il y a des choses que tu peux faire avec ça. Désolés groupes. Vous pouvez le déplacer comme un objet. Si vous voulez apporter au centre de la page, alors vous pouvez également l'ajouter le texte individuellement Ici,
um, um, sorte que vous pouvez aller de l'avant et changer tous ces comme vous le souhaitez, Mais alors vous pouvez également les changer ensemble. Certaines choses changent individuellement. Certaines choses vont changer ensemble afin que vous puissiez changer la couleur de ceci. Donc vous vouliez changer la couleur de ce bouton. Vous pouvez rapidement entrer ici et cliquer sur cette petite mise à jour tout de suite. Donc c'est un gros gain de temps. Et puis vous pouvez aussi prendre l'espacement comme penser que c'est peut-être un peu trop près de
l'image pour que je puisse utiliser ma touche fléchée et faire tomber ça un peu et vous pouvez voir qu'il s' applique à tous les éléments de ce, euh, groupe. Une autre chose cool que vous pouvez faire est que vous pouvez prendre un tas d'images et déposer le mannitol automatiquement. Répétez ces images dans toute la grille, sorte que vous devez aller un par un pour changer l'image. Donc je vais juste vous montrer un exemple de ça venir ici. Et j'ai un tas d'images, alors sélectionnez-les. Non, les
a traînés ici. Ça va dire copie. Et puis quand vous entrez ici, vous pouvez voir qu'il a mis à jour de sorte que ces images apparaissent tout au long de ces cartes que j'ai faites. C' est donc la fonction de répétition pour certaines mises en page et simulations. Ça va être un gain de temps important et utile récemment dans un projet où il montrait un tas de visages. Et j'utilise cette fonctionnalité et m'a sauvé une tonne de temps. Hum, donc je vous recommande de le savoir. Allez-y et essayez ceci et familiarisez-vous avec cela afin que vous sachiez comment l'utiliser. Euh, quand tu as besoin de Teoh
38. Compétences XD : Coller en place: Ok, donc une autre chose cool que X'd a intégrée est cette pâte automatique en place. Donc, par
exemple, disons que nous avons ce sera notre en-tête, il cercles, le menu et, hum, logo. Donc, je maintiens la touche Maj enfoncée pour les sélectionner tous. Et j'ai frappé le contrôle c trop arrogant. Et bien sûr, nous allons vouloir que l'en-tête soit le même à travers toute notre maquette. Disons que nous venons ici. Tout le monde avait ce tableau d'art ici, puis le coller, et il va le coller exactement dans la même position que, Ah, c'était sur les originaux. Cela pourrait être une fonctionnalité très utile. Donc habituellement ce que je fais avec l'en-tête est, euh ah, groupez-le et ensuite je vais en faire un symbole. Et puis c'est facile plutôt que de le faire glisser depuis le panneau des symboles. Ce que je fais habituellement, c'est simplement le copier à partir d'une paroisse d'Arc, puis passer à un autre rapport ,
puis le coller dans. Bien sûr, la seule exception à ce travail est si vous vous ennuyez,
ils sont de différentes tailles. Il ne sera pas capable de coller et exactement au même endroit sur les tableaux d'art. Ce n'est pas alors intelligent à ce stade, mais c'est quand même une fonctionnalité vraiment utile, un autre gain de temps agréable que j'aime.
39. Compétences en XD : Prototypage II: D' accord. Donc, même si cela est vrai, ce n'est pas vraiment une vidéo sur le prototypage. Nous allons juste couvrir un peu plus,
euh, euh, sur le prototypage juste parce que c'est une caractéristique si importante de X D. Donc je vais juste voir comment vous connecteriez les tableaux d'art si vous conceviez plusieurs pages sur un site Web . Donc, disons que nous avons Ceci est notre page d'accueil, bien
sûr. Et puis nous avons une sous-page eso vous allez lieux et puis vous cliquez sur ce bouton et il va vous amener
à quelques options de voyages différents. Tu peux continuer. Donc pour ce faire, on clique sur le bouton et on va faire glisser cet air à l'aéroport, veut être connecté à vous libérer, et ensuite on peut régler les différentes transitions. Donc on va aller avec la transition et l'animation régulières. Personne ne pense que c'est le plus naturel de naviguer entre les pages de Quinn. Et puis on va faire revenir le logo sur la page d'accueil. J' aime toujours avoir un moyen de revenir dans les prototypes, donc je vais juste vous montrer à quoi ça ressemble. Donc, vous venez surentendre cliquer sur aller endroits et il va tirer vers le haut cet écran que quelques pages et ensuite vous cliquez en arrière. Il est temps de revenir à la page d'accueil. Une autre caractéristique intéressante qu'Adobe X'd a intégrée est la position fixe dans positionnement lors du défilement. Donc, ce serait, par
exemple, disons que celui qui avait un peu d'options chat toujours que l'utilisateur défilait à travers notre site. Donc, je l'ai fait rapidement, et puis ce que vous faites pour faire un petit défilement, il aura une position fixe et restera. Euh, restez dans le port de vue. Au fur et à mesure que
vous faites défiler, vous sélectionnez tout. J' ai fait cela dans un groupe, puis hi vérifié position fixe ficc lors du défilement. Et puis, si vous cliquez sur jouer, vous pouvez voir à quoi cela ressemblera sur le prototype. Juste des jours dans les endroits où vous faites défiler la page vers le bas. Ce n'est pas cool fonctionnalité. C' est juste Ah, une courte intro. Comme je l'ai dit, cette vidéo syriza n'est pas vraiment axée sur le prototypage, mais je voulais vous en donner un peu plus pour que, euh, vous savez, vous avez quelque chose à faire et que vous puissiez commencer à construire prototypes
40. Conclusion: Ok, donc c'est la fin de ce cours. J' espère que vous avez tous apprécié. J' espère que vous en avez tous appris quelque chose. Je suis excité de voir vos projets. J' ai hâte de vous voir les télécharger. Alors merci pour votre temps. Et j'ai hâte de voir ce que vous avez créé.