Figma-Bootcamp 1 – Komponenten schnell lernen

1. ! Intro Bootcamp: Hey, alle auf Brian White. Du kannte X Designer aus Lawrence, Kansas. Ich mache auch Markendesign und ein paar andere Dinge in dieser Klasse. Wir lernen schnell, Komponenten wie Symbole in Sigma-Komponenten zu erstellen , oder? Warum? Elemente, die in Ihren Entwürfen wiederverwendet werden können? Sie unterstützen Sie bei der Erstellung und Verwaltung eines konsistenten Designs über Projekte hinweg. Sie strecken sich für ein ansprechendes Design, halfen beim Erstellen von Layouts und können im Handumdrehen bearbeitet werden. Diese Klasse führt durch den Aufbau eines Basiskomponentensystems in einem Schritt für Schritt Prozess. Diese Stigma Anfängerklasse wird Ihnen die Werkzeuge Zehe geben. Möchten Sie Ihre Benutzerschnittstellen-Karriere. Denken Sie daran, Figments kostenlos zum Download. Also schnapp dir eine Kopie, springe rein und lass uns loslegen. 2. Menu und Setup.: Ich werde Ihnen schnell zeigen, wie Sie einige Komponenten einrichten und in der Lage sein, sie zu dehnen, ohne sie schrecklich aussehen zu lassen. Also gehen wir zum Menü hier, gehen Sie zu Präferenzen, Schub Menge. Stellen Sie sicher, dass es eine Acht zu nett ist. Teilbare Zahl kann eine 10 sein, aber es ist in Ordnung. Gut einen Rahmen, und dann stellen Sie sicher, dass Sie im Design sind. Wir werden Desktop 14 40 überprüfen und diese Homepage umbenennen. Okay, wir werden Rechteck machen und ein kleines Menüleistensystem einrichten. Und machen wir es einfach einfach einfach. Nun, für die Verwendung von Achteln Hallo. Tu 88. In Ordnung. Und wir machen ein Logo Witze. Okay, was wir tun wollen, ist, unsere Layout-Gitter zu überprüfen. Wir haben keins. Wir werden tun, ist eine hinzufügen und schnell auf Spalten und was ist tun 12. Und ich mag es, das auf 3% zu senken. Das ist einfach nett. Als ob Rosa dich nicht vermasselt. Und dann, da, wo es acht ist, lassen Sie uns 24 Picks machen, um sie zu bekommen. Alles klar, jetzt sind wir da. Wenn Sie schnell auf den Namen der Seite, können Sie halten Sie den Befehl gedrückt und strecken Sie ihn. Es ist also irgendwie Nizza, sich darauf vorzubereiten, einige Komponenten hinzuzufügen. Also lasst uns das Menüsystem machen. Also werde ich Scharfsinn benutzen. Pro. Nehmen wir an, 18 Pixel und werden wir es verloren? Okay, mal sehen. Menüpunkt eins. Okay, jetzt wollen wir nicht einfach tippen Menü Menü Menü Menü Menü Menü Menü Menü Menü Menü Menü. Was wir tun wollen, ist, dies zu einer Komponente zu machen, also lasst uns es ein bisschen normaler machen. Also lassen Sie uns sagen, Portfolio oder wir können es einfach behalten Menüpunkt eins, und wir zeigen Ihnen, was los ist. Okay, das ist also Ihre Komponente, dass es noch keine Komponente ist, die Sie Komponente wollten, weil Sie diese erstellen möchten und Sie sie alle gleich haben und in der Lage sein möchten, mit Ihren Abschnitten zu dehnen und zu wachsen. Was wir also tun werden, ist ein System einzurichten, in dem Sie Ihren Menübereich haben. Also, was wir tun werden, ist ein einfaches Rechteck zu machen und dieses in die Mitte zu legen. Also machen wir es 32 Pixel hoch und machen das alles so, wie ich gehe. Also und wir wollen, dass dies genau hier eine Linie Mitte zentriert wird. Ok. Es ist ein wenig hoch, denn ich habe das etwas gestreckt. Alles klar, wenn Sie also in diesem Abschnitt sind und sagen wir, Sie wollen, wie, wie, ein Highlight weit oder so, gehen wir weiter und fügen Sie es so gut an einer Bar. Sagen wir vier. Okay, also sind wir bereits in Farben geraten. Wir wollen ein paar Farben hier reinbringen, da wir nicht Drahtrahmen dort sind, wo wir Komponenten machen. Aber wir werden es etwas lebendig aussehen lassen. Ich werde nur für eine Sekunde über einen Fotoshop springen. Dies ist eines meiner Projekte Produkte. Es ist, äh, eine Fotoshop-Aktion namens Instant Pallet Maker. Und was ich gerne mache, ist wirklich coole Bilder zu schnappen, die coole Farben haben und versuchen, dir I Farben daraus zu ziehen . Wenn Sie also einfach darauf klicken, wird es automatisch zur Palette gebracht. Es ruiniert dein Bild nicht. Es springt es auf eine andere Ebene. Wenn du es jemals bekommen willst, ist es ziemlich billig. Es ist ein kreativer Markt, Instant Palettenhersteller. Also, was ich tun werde, ist zu diesem Schuss zu gehen. Ich dachte, es macht Spaß, das Level zu ändern. Und keine Sorge, wir springen zurück, um mein wirklich schnelles Highlight auszuwählen. Das ist ein bisschen. Hol ein paar schöne Rosa da rein. Okay, also werden wir Palettenmedium ausprobieren und darauf klicken. Es ist zu ausgewaschen. Also, was ich tun werde, ist zurückgekommen. Klicken Sie auf die Palette, groß. Versuchen Sie, einige dieser lustigen Action-Farben zu bekommen. Ich werde das sogar ein bisschen schlagen. Manche glätten das. Mach dir keine Sorgen. Wir gehen viel zurück zu den Figments. Ok. In Ordnung. Also werden wir das kopieren, also haben wir dich nett, ich färbe da drin. Alles klar, wir sind wieder hier. Wir werden dieses Farben-Ding runterwerfen und ein schönes schnelles Farbschema für euch Jungs einziehen . Sie möchten also nach Ihrer interaktiven Farbe suchen? Und ich war ursprünglich auf der Suche nach Pink. Also sind wir grün, um für diese Art von Lachsfarbe zu gehen und zu sehen, ob wir tun können Es ist nicht hell genug. In Ordnung? Vielleicht sogar einige von diesem rosa nicht gesteigert. Nur ein bisschen. In Ordnung. Und dann wollen wir etwas Cool. Diese Grautöne, diese Luft. Nette Warren grasen. Also lasst uns das machen. Diese und diese Form. Und normalerweise würde ich gehen füllen. Weißt du was? Entschuldigung. Gehen Sie Füllfarbstil. Und dann, wie, nennen Sie es grau. Cool. Sie wissen, oder warm oder was auch immer. Erwärmen Sie einen und kreieren Sie diesen Stil. Ich bin nur ein bisschen schneller für dich. Ich will nur, dass du dich nicht langweilst, und wir haben es jetzt mit Komponenten zu tun, also in Ordnung. Sehen Sie? Erhellen Sie es ein wenig dunkel in diesem up ein wenig. Und lassen Sie uns noch ein paar Farben bekommen. Ich liebe einfach, wie diese können Sie so viele coole Farben wirklich schnell ziehen. Und es fühlt sich an, als gehöre es die meiste Zeit zusammen. Vielleicht ein Pfirsich. In Ordnung, wir könnten darauf zurückkommen, aber wir werden sehen, dass aber wir werden sehen, wir uns von den Oliven fernhalten und irgendwie in dieser Palette bleiben würden. Einige davon sind irgendwie lustig, wir werden sehen, ob wir etwas hineinwerfen können. In Ordnung. Ja, das sieht irgendwie cool aus. Ähm, wir werden das nur nah und griffbereit halten. Also werde ich diesen Teoh diesen Hintergrund von jetzt an ändern. Trotzdem könnten das alle Rechte sein. Wir haben unsere Speisekarte. Wir wollen Zeh, ähm, hoch. So wie das. Sag , mal,hey, das ist an. Also was wir tun werden ist, diese Lachsfarbe auszuwählen, und manchmal mag ich es, wenn ich eine Kopfzeile Einstellung, Ähm, Angst. Wenn Sie für jemanden arbeiten, benennen Sie alle Layer vollständig. Aber, ähm, was wir tun werden, ist, das jetzt zu einer Komponente zu machen, damit wir unser Menü machen und dann Änderungen vornehmen können . Das ist also unser aktives Ross, und wir werden einfach weiter daran stecken. Also offensichtlich, mit diesem Hintergrund, denke ich, dass ich es schon nicht mag. Ich wollte nur etwas dunkler werden. Ja, in Ordnung. Das Menü muss also nicht weiß sein, aber all dies kann sich im laufenden Betrieb ändern. Okay, was wir also tun wollen, ist unsere vielen sind der Hintergrund , den wir wahrscheinlich nicht einmal verwenden werden, aber bringen Sie es vorerst auf die Höhe Ihrer Bar. Weißt du, ich werde das laufen. Okay, hier ist dein Menüpunkt. Also werden wir den Optionsbefehl K drücken, und das machte es automatisch zu einer Komponente. Und was ich gerne mache, ist entweder das die Basisseite und alle Komponenten sind darauf. Oder, ähm, Sie können Befehl D drücken, was es zu einem Duplikat macht. Und dann können Sie Ihre Komponente nehmen und sie auf eine andere Seite verschieben, wie Sie können eine Seite erstellen . Das sind Komponenten, aber für Zweckmäßigkeit behalten wir es hier auf dieser Seite, damit ich Ihnen zeigen kann, wie es funktioniert. Also, was ich mag, ist ziehen Sie Ihre Dies ist Ihre Master-Komponente. Sehen Sie, wie es aussieht mit diesen vier Quadraten, der Diamantform, und dann ist dies die offene Diamantform, die ist dies Ihre Komponente. Ähm, kopieren Sie. Also, was auch immer wir hier tun, tun, sagen wir und wir ändern das in Blau, was schrecklich aussieht. Entschuldigung. Nun, was passiert, ist, dass sich alle Instanzen ändern. Also werden wir diesen Flug machen, und was wir tun werden, ist, diesen Hintergrund zu verstecken. Wir brauchen es nicht, aber wir können es. Wir können alle möglichen coolen Sachen damit machen, jetzt, wo wir diesen Hintergrund haben, etwas versteckt. Also was? Was passiert, ist, dass es nicht sehr gut funktioniert sofort. Also ist es nur irgendwie kaputt. Es gibt keine Polsterung. Das Stretching funktioniert nicht. Was wir also tun wollen, ist, dass dies die große Sache auf Komponenten ist. Wie funktionieren diese Abschnitte? Also was? Wir wollen diese Skala nicht. Wir wollen nach links und rechts gehen So wird es die besteuerte hier zentrieren und dann, wenn Sie tippen, wird es in diesem Rahmen zentrieren, so dass es die gleiche Breite beibehalten wird. Also wollen wir dasselbe für dieses Hintergrundstück tun, das gerade jetzt zeigt dass es irgendwie Spaß macht, wie Sie sehen können, wie es funktioniert. Was wir normalerweise tun wollen, ist es auf diesen die Komponentenkopie zu testen. Also dieses hintere Stück hier Hintergrund, den wir links und rechts skalieren wollten, wir wollen nicht Oh, wir werden es nicht riesig ziehen. Aber wenn du es wolltest, kannst du einen oberen unteren Teil setzen. Wenn sich dies ändert, z. B. auf einer responsiven Seite, muss der Header etwas größer sein, da der Inhalt verkleinert wird. Was wir also tun werden, ist, das besser aussehen zu lassen und diesen aktiven Zustand zu benennen. Okay, jetzt haben wir unseren Menüpunkt und wir können ihn ab und zu duplizieren, gehen wir zurück zu unserer Komponente. Das ist ziemlich cool. Sie verstecken es und dann, ähm sehen, mal sehen, geht um uns und ich bin ein schlechter Typ, oder manchmal komme ich gerne wieder rein und ändere meinen Text. Und ich möchte, dass all diese Großbuchstaben so schnell sind. Das und Boom, alle Ihre Komponenten sind Großbuchstaben, also werde ich einen anderen machen, der Portfolio und Raum aussagt. Nicht jeder will nach Hause. Das sind sie immer noch. Und ich bin wie, komm schon, bitte. Ok. Noch eine Seite. Das ist länger. Whoops. Entschuldigung. Dies ist also ein gutes Beispiel dafür, wenn Sie Ihren Text in die Mitte setzen und Ihren Absatzabstand in Ihrer Zeilenhöhe festgelegt haben . Korrigieren Sie das. Das könnte jetzt etwas zu hoch sein. Was wir also tun können, ist zu gehen, wo ist es? Sie haben so viel hinzugefügt. Jetzt ist es genau hier. Ich war auf der Suche nach ihren eigenen. Tut mir leid, ich soll dir beibringen. Also sieh zu. Das ist, ich tippe es an. Sie können sehen, dass die andere Seite ist, da wir mit diesem Teil durcheinander sind, aber es ist Sie können sehen, wie es hier funktioniert, also werde ich sagen, 96 Bücher, nicht 96 96%, aber okay, 20. In Ordnung. Du kannst jetzt sehen, dass ich einfach zu Hause sagen werde, nur weil Okay, also ist das unsere aktive Seite. Also, was wir tun können, ist in unsere Komponente gehen und Sie können sehen, dass wir den aktiven Zustand Hit im Hintergrund versteckt haben , so dass wir auf den aktiven Zustand klicken können und wir können tatsächlich auf den Hintergrund klicken , der wie poo aussieht. Also, was wir tun werden, ist zu diesem ursprünglichen Hintergrund zurückzukommen und es zu zeigen, und wir können es ändern Teoh White auf, wie, p Prozent so, aber wir wollen nicht, dass es auf alles zeigt. Und das zeigt, dass das, was schön ist, ist, dass Sie Ihre Abstände schrecklich sehen können. Aber was wir tun wollen, ist es zu verstecken. Aber es bleibt aktiv, weil zu Hause. Aber wir haben es, ähm, mit offenem Auge, damit du es sehen kannst. Also, ja, das ist eine nette Möglichkeit, ein paar schnelle Menüs zu machen. Lassen Sie uns also weiter in Bewegung bleiben und an der Einrichtung von Komponenten für Formulare arbeiten, die ins Spiel kommen und irgendwie ärgerlich werden 3. Form und wie du master erstellst.: Okay, lasst uns in Formen springen. Also werden wir ein paar dieser Grautöne verwenden, von denen ich vielleicht noch etwas mehr brauchen kann, von dem wir ziehen können. Es mag ein paar leichtere geben, aber nur für Zweckmäßigkeit werden wir weiter in Bewegung bleiben. Also, was wir tun werden, ist das Gleiche wieder zu tun. Wir wollen Art von Boxen für diese Bereiche, also will ich, wie, eine Art größere Formularbasis, und ich werde nur diese drei kommen überspannen und wir werden das auf 64 setzen. Das ist also unsere Basis. Und dann möchte ich, wie, wie, eine 32-Pixel-Basis für das Formular selbst erscheinen. Der Name des Formulars. Ok. Und manchmal, wenn du willst, kannst du einfach nur diese eine beliebige Farbe haben, die du willst, denn wir werden ihn nicht benutzen. So wow, das ist so schlimm. Aber wenigstens bekommst du die Idee. Das wird also unsere Form sein, und das wird der Name für das Formular sein. Das wird also unsere Form sein, Und wir wollten uns dehnen, ohne den oberen Teil oder den unteren Teil zu brechen, und es macht es einfach so viel einfacher, wenn Sie einen Namen, Vornamen, Nachnamen, was auch immer haben Vornamen, Nachnamen, Nachnamen, . Das ist, was wir tun werden, ist, das zu einer Komponente zu machen, und die Art und Weise, die das tun wird, ist, dass wir es in Komponenten haben. Also werde ich Text eingeben und sagen, ähm, Sternnamen. Also dieser Stern wird, wie, wie, leuchtend rot für das gleiche und dann der Name, der verwenden wird, Ich mag diese Marine. Also machen wir einfach das, Wer kann nicht vielleicht. In Ordnung, also wählen wir den Namen Click Phil Boot Camp aus, vielleicht. Okay, tut mir leid. Das sieht schrecklich aus, aber du wirst das Gefühl dafür bekommen, also wird das unsere Form selbst sein. Und was gerne tun würde, ist nur so, dass es ein wenig interaktiv aussieht. Wir werden einen Drei-Pixel-Rahmen darauf machen, sind keine Grenze, sondern abgerundete Ecken. Also werde ich diesen Abschnitt machen, ähm, seine eigene Komponente, seine eigene Komponente, und ich werde es als Schrägstrich zart nennen, und ich denke, ich werde dieses Mal alle Kleinbuchstaben behalten. Und so wird dann diesen Teil nennen. Bilden Sie einfach ein Feld, okay. Und ich werde das stylen, damit wir einen Schlaganfall machen. Eigentlich ist das eine Art alter Stil, also werde ich es einfach so behalten, aber Gleiche gilt. Sie möchten diese Größe, wenn Sie nur den zugrunde liegenden, wie Android oder einige der neueren Stile möchten . Ich zeige Ihnen in einer Sekunde, wie das geht. Ähm, mal sehen. Es ist wie ein separates Ereignis. Streichen Sie dies mit einem Pixel und sehen Sie, ob wir das nicht für ein wenig dunkler verwenden können. In Ordnung, gehen wir zu zwei, damit jeder sehen kann. Alles klar, jetzt haben wir zwei Komponenten. Wir haben den Formular-Header im Formularfeld. Und was wir tun wollen, ist in diesem Formularfeld, wir wollen eingeben sind Typ und sagen, mal sehen, Vorname. Und ich will nicht, dass das alles Mützen ist, also gehe ich zurück. Also bin ich im Weltraum es raus. 32 Pixel vom Rand entfernt. Und das wird, ähm, Formtext sein. Ordnung, also ist dieser Hintergrund offensichtlich nicht da, damit wir ihn verstecken können. Also haben wir den Anfang unseres Formulars. Wir haben einen Namen , der dafür wirklich groß ist. Wir sind nur stolz, etwas klein und schwer, kleiner und schwer. Okay, jetzt wollen wir in und in diesen Hintergrund gehen, und wir wollen, dass dieser Tiu bleibt, aber, aber, ähm, wir wollten uns dehnen und wir wollten auf dem Boden bleiben, weil wir konifiziert werden wollten gegen dieses Formular. Also werde ich hier reingehen und links und rechts sagen, damit es sich ziemlich dehnen kann. Wir machen dasselbe mit dem Namen, aber wir wollten bleiben. Und das Schöne daran ist, dass du das duplizieren kannst, und wenn es überhaupt scheitert, kannst du zurückgehen und sagen: Oh, Oh, ich habe es nicht links gemacht oder so wollte ich reagieren. Also werde ich das ausschalten. Und jetzt, was wir tun, ist jetzt, wo wir ein fremdes Feld und Header haben, werden wir eine Komponente von beiden machen. Okay, was passiert ist, war, dass es eine Instanz von beiden zur gleichen Zeit machte, also brach es Formular, Header und Formularfeld aus. Dies ist also unsere neue Komponente, die Master-Form ist oder lassen Sie uns Form Master, Kleinbuchstaben. Komm schon. Alles klar, was wir tun werden, ist, da wir das hier bereits haben, werde ich meine Komponenten oben auf der Seite behalten. Manchmal ist es schön, nicht gegangen zu sein. Machen wir ja, machen Sie die einfach ein wenig, machen Sie die etwas kleiner und halten Sie ihn vorerst hier. Und was wir tun, ist, diese beiden einfach links zu halten, wenn wir die Mitte wechseln müssen. Okay, jetzt, wo wir das haben, werden wir eigentlich Bruce Command De machen und wir werden eine Kopie davon machen. Wir wählen den Master aus und ziehen ihn aus Seite der Seite, so dass er sich außerhalb der Homepage befindet. Siehst du jetzt, was los ist? Also, was ist passiert? Soll dieser Name links und rechts sein? Also, was wir tun, ist, zurück zu gehen und zu sagen, links und rechts. Manchmal ist, was passiert ist, dass ich das absichtlich gemacht habe. Ist es? Wird es wird es überschreiben. Es wird nur sagen, Hey, wenn du nichts gesagt hast, wir es einfach verlassen lassen. Also dieser hier, dieser hier ist übrig. Das hier ist links und rechts. Also, was wir tun müssen, ist, links zu sagen. Und jetzt haben wir es richtig gestreckt. Es macht irgendwie Spaß. Nehmen wir an, wir haben hier eine Sidebar. Wir werden nur einen separaten Zeitraum haben. Okay, also sagen wir, wir wollen die hier ausräumen, also haben wir einen Vornamen. Also wollen wir, ähm, Vornamen hier haben ähm, , und wir werden Shift eine Option halten und dupliziert. Und natürlich brauchen wir das nicht. Es gibt also zwei Möglichkeiten, das zu tun. Du kannst das einfach , verstecken, was ich manchmal viel mache, , oder du kannst es glauben und dann hierher kommen, um Feld zu bilden und einfach die Option gedrückt zu halten, und es wird eine Kopie des oben größeren Fremdfeldes. Und das hat nicht den Header. Also kannst du hier reinkommen und Nachnamen sagen. Okay, das sieht für mich total schlecht aus. Also, ihr Jungs, wahrscheinlich Wow, dieser Kerl ist ein Designer, also werde ich das wirklich leicht machen, und wir machen das. Hoppla. Wir machen das Pillenfeuerzeug, und Sie können sehen, was passiert ist, ist in diesem Meister. Es ging nicht auf das Feld, also muss ich zurück. Und deshalb mag ich es, diese wirklich schnell zu verwirren. So können Sie sehen, ob Sie Ihre Formularfelder schnell ändern können. Also was? Wir machen sein Wechselgeld? Unser Schlaganfall Nur ein bisschen leichter. auch. In Ordnung, jetzt, wo wir eine schöne Formulareinstellung haben, können Sie eine Sache tun, Ihre Gebäude diese. Also, zum Beispiel, sagen wir, wir müssen uns dem stellen. Also bemerkte ich, als ich Land tippte, was geschah, war, dass dies auf Mittellinie gesetzt ist. Also müssen wir hierher zurückkommen. Auch wenn dies links und rechts ist, tun wir das und wir haben unseren richtigen Abstand für Land. Also, was schön ist, dass Land jetzt das ganze Ding überspannen kann, ohne sich zu dehnen und unordentlich nicht nach oben führt. Aber was wir wollen, wenn wir die Formen aufbauen, ist eine tatsächliche, die die gleiche Art und Weise ist. Also, was wir tun werden, ist zurück zu diesem Klick links und ich werde es reparieren. Die Ideen, die Sie herunterklappen möchten, um ein Drop-down zu zeigen So kommen Sie zurück zum Farm-Feld , was schön ist, ist wie, Sie können immer wieder zu diesem kommen und lassen Sie uns einfach eine enge gehen nach unten. Und offensichtlich wollen wir das nicht bei allen. Und lassen Sie uns nur einen einfachen Betrunkenen machen und wir werden diese interaktive Farbe dort machen, genau da wie diese Farbe, werden wir es Lachs nennen. Okay, warte einen Stiefel. Camp Lachs. Okay, was ist hier los? Warum ist das nicht da drüben? Wir wollen das nur auf dem Land. Wir wollen es nicht da drauf. Also, was wir tun, ist zurück ins Feld zu kommen und wir sagen, wir wollen, dass das versteckt wird. Aber bevor wir das tun, wollen wir, dass dies auf der rechten Seite bleibt und wir wollen es wie diese 32 Pixel Lücke. Was wir also tun, ist dies zu schreiben und zu zentrieren. Was also passiert, ist jetzt, sich das bewegt, bleibt es gleich und wird nach rechts gehen. Okay, jetzt gehen wir zurück zum Original, werfen eine Reihe und wir werden es verstecken. Und dann sind wir wie, Nun, es ist auf dem Land weg. Alles, was wir tun müssen, ist da rein zu gehen und zu klicken. Ja, ich wollte da sein, damit du sehen kannst, wie es super schön ist. Und einige der ursprünglichen Komponenten haben viele Felder in ihnen, die Sie verstecken und tun alle möglichen Sachen mit So, zum Beispiel, Name mit nicht benannt, aber Telefonnummer. Also lassen Sie uns eine Telefonnummerversion machen und was wir verwenden möchten, ist das Basisformularfeld, und dann werden wir erstellen, ich bin eine andere Version davon mit einer Komponente darin. Also haben wir einen Pluspunkt für Amerika. Also manchmal werde ich das tun und sagen, Hey, ich möchte diese Instanz trennen Dies ist nicht mehr das Formularfeld. Dies ist also das erste Mal, dass wir davon abkommen, diese Hauptinstanz zu verwenden, so dass wir das nicht tun können oder aber Sie wollen versuchen, das nicht so viel wie möglich zu tun, so dass Sie die gesamten Abschnitte verwenden , die Sie in der gesamten App ändern können oder Web. Das hier. Du änderst diese Farben. Es ändert sich im gesamten Bereich der Löcher. Also werde ich das Formularfeld behalten. Aber was wir tun werden, ist für gehen Teoh ausblenden Formulartext, und dann werden wir ein weiteres Stück hier hinzufügen, tatsächlich wird nur dupliziert. Also sagen wir Befehl D und C Telefontext. Und jetzt werden wir das bewegen. Keine Sorge, das wird es nicht. Es wird nicht alles vermasselt. Also, was wir tun werden ist sagen, wir wollen, dass Sie dreistellige Ortsvorwahl sind und dann drei Mitglieder auf vier Zahlen streicheln, und wir wollen, wie, ein Plus eins Drop Down haben wie, . Also haben wir diese Drop-down-Liste bereits, Held. Was wir tun werden, ist das zu nehmen. Ich halte nur die Option im Grunde und ziehe sie von diesem zu diesem. Und ich gehe die Zehe. Nicht ausflippen. Und wacht nicht da drüben auf der rechten Seite. Aber was wir tun wollen, ist, dass es hier runterfallen ist, und ich bin in einer Spezies es es ein bisschen. Nachdem ich das getan habe, werde ich dieses Rechteck kopieren, sind nur Option und Safe Telefon Drop. Und in diesem, Sie wollen es irgendwie zusammen halten, so dass Sie sogar eine interne Gruppe machen können. Also haben wir diesen Telefonabfall, und es ist der Innenteil. Also, was wir tun werden, ist wie eine 32 mal 32. Okay, Sieht 37 meine 32. Was muss das betreten? Ordnung, InOrdnung, also jetzt werden wir das aufräumen und den Tropfen daneben legen, und dann nehmen wir diesen Telefontext, duplizieren das und sagen Land, es ist ein Plus eins. Okay, also haben wir ihren Drop runter und es könnte ein bisschen größer werden, aber wir machen das einfach schnell. Also wollen wir, dass sich das dehnen kann, und wir wollen, dass es wirklich links bleibt, damit ich es nach links verriegle und nicht den ganzen Weg hindurchgehe . Sie möchten, dass dies ein Linienmittelpunkt ist, da es möglicherweise mehr tatsächlich gibt. Wird es tun. Links eine Linie links, wie es wächst sie den Pfeil drücken. Daher muss dieser Abschnitt gruppiert werden, damit er auch zusammen funktioniert. Also werden wir das unter der linken Zehe ändern. Ich weiß, das ist nur für Reformen, aber wenn du fertig bist, bist du fertig. Es ist schön. Also werden wir das auf drei aufteilen. Also haben wir unsere Telefonnummer hier, und wir werden nicht das sein, dass du sie brauchst. Ist es nicht. Das ist nicht nötig. Also hier ist unser Telefon, aber das ist jetzt alles vermasselt. Also gehen wir zurück zu hier und wir verstecken die bringen den Formulartext zurück ins Land, und wir werden sagen, das ist die Telefonabteilung. Also, jetzt haben wir die Telefonabteilung, die das Versteck, den Telefonbereich versteckt . Aber wir wollen, dass der Telefonbereich gesehen wird. Also, was wir tun wollen, ist hierher zu kommen und zu sagen, dass ich das Telefon sehen will, okay? Und wir wollen die anderen Teile wegnehmen. Hoppla. Da. Also, jetzt haben wir diese Telefonabteilung, die es wahrscheinlich so aussehen sollte, wo alle diese offen sind. Aber dann ist das geschlossen. Also machst du es wirklich schnell. Bumm. Und Sie haben ein Telefon und sehen, ob es sich dehnt. Das dehnt sich nicht richtig aus, also wird es, aber, ähm, ähm, wir werden dorthin kommen, damit wir zurück zum Telefontext gehen. Also bin ich gegangen. Ja, das stimmt. Okay, also jetzt einfach ganz einfach. Wenn wir eine E-Mail wollen, legen Sie sie einfach ab. 123 Und jeder braucht E-Mail. So tun E-Mail in der Mahlzeit. Nein, E-Mail. Nach, wie, dieser Formulartext ist zu ähnlich. Also, was ich tun werde, ist schnell zurück zu gehen und es von Boot Camp in Boot Camp grau zu wechseln. Alles klar, also macht es einfach Spaß. Wenn Sie die Komponenten aufbauen, können Sie sehen, wie Sie sie schnell dehnen, aufbauenund schneller gehen können aufbauen . Wir werden als nächstes ein Kommentarfeld machen, so dass dieses wird sich dehnen, weil Sie viele Absätze benötigen. Wir springen zu einem Kommentarfeld. Was wir tun werden, ist diesen Abschnitt zu duplizieren und auf einem Kommentarfeld, in der Regel einfach frisch aus dem Formularmaster beginnen, um es ein wenig einfacher zu machen. Lass uns sehen, ob wir das nicht alles zusammen machen können. Es wird eine Art verrücktes Formularfeld sein, aber wir werden es tun. Also werden wir einen Kommentar haben, der nicht notwendig ist. Und mal sehen, was passiert. Also, was wir tun werden, ist dieses Formular zu ziehen, Feld diesen ganzen Meister und sehen, was passiert. Es funktioniert also überhaupt nicht sehr gut. Was wir tun wollen, ist diese Stapel ohne sich zu ändern, und wir wollen, dass dies in der Lage sein, Absatz zu behandeln und dann wollen wir, dass kleine ziehen Borras öffnen . Wenn du ein bisschen mehr tippst, spiele ich irgendwie Teufelsfürworter auf alles, nur damit du ein Gefühl davon bekommen kannst, was passiert. Also werde ich diese Formulare nach unten verschieben oder die Komponenten nach unten, und was wir tun wollen, ist zurück zum Vorher und diesem Abschnitt dieses Formulartextes, und jetzt wollen wir oben sagen. Was also passieren wird, ist Boom. Sie bekommen das bereits, und ich werde voran gehen und fügen Sie einen Kommentar Beklagt inmitten. Okay, also das hier ist auch ein Beispiel dafür, auch ein Beispiel dafür, warum es nicht umhüllt. Was wir also tun wollen, ist, zu Ihren Formulartexten zurückzukehren und zu sagen, links und rechts, und jetzt werden wir es so einstellen, dass es innerhalb dieser Parameter angegeben wird. So wird wie 32 Pixel sein. Sie sind 32 Pixel von oben, und wir werden dorthin kommen. Also, jetzt wollen wir die Komponente Abschnitt Weg. Wir wollen, dass das behoben wird. Also dieser Abschnitt wollen wir wirklich diesen Kommentar Bereiche schweben. Also, wie bekommst du es? Richtig. Wenn also etwas seltsam ist, wie wenn du alles auswählst und es ziehst, funktioniert es nicht richtig. Sie können zu Ihrem Formular zurückkehren und lassen Sie uns dies überprüfen, damit wir es von links nach rechts gesetzt haben. Aber das ist auf Skala gesetzt, Also wollten wir wirklich von oben nach unten, also sperrt es automatisch, und wir werden dieses zu überprüfen, um Wir haben nicht links und oben. Was passiert, ist, dass es an der Spitze bleibt. Und wenn wir dies scrollen, wird es größer und Sie haben mehr Platz für Ihren Absatz. Also, jetzt sind wir tatsächlich nah dran gekommen. Wir werden Drop-Down-Bereich loswerden, Held. Wir gehen in das Formularfeld, machen Männer ziemlich viel. Und ich will dieses D c c, was auch immer. Wirklich einfach. Uh, ich werde Wein für die Einfassung zeichnen und die Schicht halten. Ich denke, ich werde näher kommen, aber mache es nur schnell für euch. Okay, also haben wir diese Feldzeilen, eine Kommentarzeile. Wir werden das verstecken, kommen hier rein und wir wollen die Kommentarzeilen sehen. Okay, was ist passiert? Jetzt sind sie da drüben. Deshalb ist es eine Schönheit aus Schönheit. Es ist nur ein schöner Zeh. Habe sie gleich hier. Diese Komponenten, um nur ein Chaos mit so gehen zurück in das Formularfeld. Schauen Sie sich diese Kommentarzeilen an. Wir haben sie gruppiert, aber lassen Sie uns voran und machen sie zu einer Komponente, die Sie nicht können, weil ich auf einem duplizierten Bereich bin, also muss ich hier Einkommen in die Kommentarzeile kommen. Klicken Sie hier. Oh, es muss draußen sein. Ähm , das stimmt. Also, was wir tun werden, ist, das einfach auf rechts und unten zu setzen, damit es immer genau dort bleibt. Es muss ein bisschen stärker sein, also werde ich es hier schaffen. Nein, das hier. Ja. In Ordnung. Also, jetzt haben wir unsere Komponente, die ihren Fleck rechts und unten arbeitet, und Sie können Ihre Komponente so viel wie unsere gehen runter, so weit Sie wollen. Es ist also wirklich schön und einfach, jetzt, wo wir ein Formularfeld haben, , das wirklich stark ist, hat eine Menge Inhalt darin, dass Sie das meiste davon verstecken können, und das brauchen Sie es. 4. Schaltflächen – die responsive button und sekundäre Buttons und mehr: gerade jetzt, da wir unsere schönen Formulare haben und wir unseren aktiven Zustand haben, den wir tun werden, ist einfach schnell macht ihn Header-Abschnitte. Abschnitt eins, sage ich euch 36. Okay , Okay was wir tun können, ist ein neuer Steuerstil, um das zu einer Komponentenoption machen zu können. Okay, nun, sag jeder mit mir, wir machen die Schlange lang. Das ist so übertrieben, aber nur zum Spaß zu tun. Also werden wir das links und unten machen und wir werden nehmen, wir werden diese Kontrolle duplizieren , de, ich nehme an,diese de, ich nehme an, Master-Komponente sind Komponente, und dann ist das hier drüben ein Komponenten-Duplikat. Also, was wir wollen, ist dieser Text, der sagt, es ist links und unten, so dass er neben der Linie bleibt , ihm ein wenig Atemraum gibt, viel mehr Atemraum, wenn wir so wieder hierher kommen wollen. Ich habe versucht, es ein bisschen schöner für euch zu machen, aber sagen, das ist unsere Abschnittslänge, die wir so 8 32 Also was wir tun wollen, ist hier zurück zu kommen und dieser Text sagen 8 32 Ich kenne Rap. In Ordnung, also machen wir einen neuen Abschnitt, rufen wir diese Knöpfe an, okay? Und da ich diesen Abstand hatte, will ich tun, ist Jet diese, um die Farbe zu entsprechen. Okay, ich werde nur ein bisschen schneller gehen und die ausschalten, um ein bisschen einfacher zu machen. Frieda ist also brauchen wir einen Knopf. Sagen Sie nicht, dass wir diesen primären Knopf aufrufen und wir werden das wirklich klein machen, weil es nur benennt. Wir benennen es nur. Also wollen wir nur einen Standardknopf und wir wollen nicht sicher. Lasst uns Big 64 nach 200 gehen, gehen, nur für schnelle Schnelligkeit. Also füllen wir es mit unserem Lachs, und wir werden hier einen Text schreiben, um zu sagen, wie einreichen, das weiß zu machen. Dies wird 18 Pixel sein. Lass uns 16 und 16 gehen. Hier gehen wir Teoh Mitte, richten Sie den Text aus und wir werden diesen Raum mit 32 Pixeln am Rand und dann ein wenig oben und unten. Wir werden es in einer Sekunde herausfinden, aber dies wird unsere primäre Schaltfläche sein, und Sie können diese auswählen und ausrichten, solange der Text zentriert ist. Manchmal ändert sich die Zeilenhöhe ein wenig, abhängig vom Text für den Schriftaufbau. Also haben wir den primären Knopf, den ich in meinem gebracht habe, ich denke, ich habe einen Zeiger genannt, was eine Ping-Datei ist, die ich gerade einbringe, also um schnell zu zeigen, was los ist. Also, was wir tun wollen, ist dann, ähm, das ist nur unsere primäre Taste, und wir machen eine sekundäre, aber wir werden das in einer Sekunde duplizieren. Was wir also tun wollen, ist, dies zu einer Komponente zu machen, andere Komponente zu erraten und Knopf zu sagen und wir wollten primär sein. Ich zeige dir in einer Sekunde warum. Also duplizieren wir das kontrollierte die Master-Komponente hier raus. Wir lassen es einfach auf der linken Seite. Und was wir tun wollen, ist hierher zu kommen und zurückzusehen, äh, Hintergrund. Und ich denke, es ist einfacher, einen aktiven Zustand zu machen, solange du das ganze Zeug nicht wie verrückt änderst . Aber wir wollten links und rechts, links und rechts und dann zentrieren. Also diese beiden Zentren, also werde ich das verstecken, und das ist unser aktiver Zustand. Also machen wir das Pink zum Spaß. Und, ähm, was wir jetzt tun, ist, das Aktive zu verstecken und wir haben unseren Hintergrund. Also werde ich ihre duplizierte Taste auswählen und die Option halten und verschieben Und lassen Sie uns es 40 Pixel auseinander setzen und wir sagen, Hover Tap, ich sage Fokus. Okay, also können wir es wie ein subtiler Schweber machen. , Was wir tun können,ist stattdessen nur diesen Hover genannt. Und was wir tun werden, ist zu sagen, dass es Onley auf der Unterseite rosa ist. Also, was schön ist, dass du hier reinkommen und Hoffnungen haben kannst, was? Siehst du, was ich getan habe? Explizite Benennen Sie es, aber dort. Und wir werden den Hintergrund zeigen, und wir werden den Mauszeiger nach unten nehmen und nur ein einfaches Drei-Pixel-Highlight unten machen . Das ist eine Art, sich zu begleichen. So können Sie Ihren Hintergrund nach unten nehmen und sagen, zurück Abdeckung, verstecken Sie dies für eine Sekunde und Sie können durch das passieren. Sagen Sie also , es sind 90%. Okay, was wir jetzt tun können, ist es immer noch nicht Ja, ich werde etwas anderes machen. Ok? Wir müssen nur Geduld mit mir haben. Ich werde tun, ist, also haben wir unsere Hover-Leiste und wir werden es so am unteren Ende tun und um es noch besser zu machen, Was wir tun können ist, wählen Sie beide, gruppieren Sie es auf, sagen wir, aber was wir tun werden, ist in der Tat nur einen einfachen Schlagschatten hinzuzufügen in der Tat . Ähm, viel zu viel so gut wegen und zwei und 10%. Viel zu wenig. Ok, da. 20%. Manchmal verwende ich gerne die Farben, die ich bereits hier verwende. Also ich mag es, zu einem lokalen Farben zu gehen und das Grau zu verwenden, aber dann bringen Sie es wieder nach unten, ich mag 40, weil es so wie, OK, cool ist. Alles klar, jetzt wollen wir das nicht. Also, was wir tun, ist zurück zu unserem Button primären und verstecken den schwebenden Reichtum. Eigentlich werden wir den Schweber halten und dann das alles verstecken. Und so, jetzt in Hever-Wochen, wollen wir das, aber nicht das. Also jetzt haben wir den Submit-Button, haben ihren Fokus, und wir können sogar einen Klick machen. Also, was wir tun werden, ist hierher zu kommen, duplizieren Sie unseren Hintergrund und sagen klicken Sie. Und was wir tun werden, ist es das gleiche Rot zu machen, aber haben eine innere die Tatsache. Also in ihrem Schatten und wieder, lokale Farben gehen mit der Marine und fallen sie auf, etwa 15% und auf OK, also jetzt haben wir auf Klick, und wir können das Duplikat der Submit 40 Pixel verstecken, Sehen Sie aktiven Klick, und wir werden klicken und hohen Hintergrund zeigen. Dies ist also Ihr Fokus und schweben, und klicken Sie dann auf Nur gibt es einen kleinen subtilen Schlagschatten. könnte es zu subtil Eigentlichkönnte es zu subtilsein. Also gehen wir zurück, um in ihren Schatten zu klicken und das bis zu 20% zu schlagen. Alles klar, was wir jetzt tun wollen, ist zu sagen, ähm, ähm, wir brauchten Behinderte. Also haben wir die Taste primär. Wir kommen hierher zurück, ich glaube, du verstehst die Idee. Wir Oh, ja. Weißt du, das wollen wir tun. Okay, jetzt tauchen wir ein, lecken Sie es den Hintergrund, und Sie können einfach die Option halten und ziehen Sie es. Ähm, wir werden das tun, um deaktiviert zu speichern. Hi. Dies und wir werden die Schaltfläche deaktivieren. Ok? Und das ist ziemlich einfach. Ich denke, das ist alles, was wir wollen, und wir werden in der Lage sein, die Textfarbe zu ändern, wie wir wollen. Aber um mich zu erinnern, denke ich, dass es wichtig ist, Ihren Text zu duplizieren und diesen als Farbe zu haben. Es ist wirklich hilfreich, denn wenn du vergisst, dann bekommst du all diese verschiedenen Grautöne und da, in Ordnung, also haben wir deaktiviert und einreichen, und so kannst du sehen, dass alle diese nach links und rechts gehen müssen, und du wirst das in einer Sekunde sehen. Aber was wir tun wollen, ist auch diese Farbe zu ändern . Das wollen wir nicht. Ja, und das muss etwas leichter sein. Wir gehen, OK, also jetzt verstecken wir deaktiviert und zeigen, senden und zeigen Hintergrund. Also dann kommen wir zurück hierher, um den Hintergrund zu verstecken und zu zeigen, deaktivieren und dann auszublenden Submit. Und da sind wir, Ordnung, ziemlich einfach. Aber die Idee ist, dass das, was Sie tun möchten, ist, diese so einzurichten, dass Sie es während Ihrer Komposition ändern und es super einfach machen können. Also, wie Sie bauen, haben Sie eine andere Schaltfläche und Sie sagen, Melden Sie sich an und Sie können kleiner machen und es ist Leerzeichen richtig und funktioniert wirklich gut gewesen und tun einige sekundäre Schaltflächen. Also, was wir tun werden, ist auf die primäre Schaltfläche gehen, die wir haben, und wir werden den Master duplizieren . Also, wenn du jemals so bist, wo ist das Ding? Weißt du, wenn du eine Tonne und Tonne von Komponenten baust und du wie ich bist, hast du manchmal einen unorganisierten Komponentenbereich bekommen . Uh, Sie können mit der rechten Maustaste darauf klicken und sagen, Gehe zu Master-Komponente wird direkt dort springen. Also jetzt haben wir es auf der linken Seite, was schön ist. Und was wir tun werden, ist einfach die Option Drag Duplicate zu verwenden, und ich raste auf das Raster, während ihr Jungs weg wart. Also, äh, jedenfalls, werde ich mit der rechten Maustaste auf Instanz trennen klicken. Also, jetzt haben wir diesen Knopf und wir machen ihn, ähm, sekundär. Wir werden es zweitrangig nennen. Und, äh, wir werden diese sekundäre nennen. Und wieder, wenn Sie möchten, dass Ihr Text alle Großbuchstaben ist, lassen Sie uns hier sehen, alle Großbuchstaben so und stellen Sie sicher, dass er in der Mitte ist. Also, was wir mit diesem hier machen werden, ist, dass wir weiß als Hintergrund und einen Strich von Boot Camp Samen zu haben , und dann werden wir unsere Unterwerfung oder sekundäre Farbe in das Rot ändern. In Ordnung. Also, jetzt, wo wir das haben, was wir tun können, ist dupliziert und machen Sie den Hover und Fokus. Genau wie der andere macht einfach Spaß. Manchmal, um so zu sein, Nun, wie wird das aussehen? Und Sie können es schnell ausspülen. Also werde ich das wirklich schnell machen. Sie gruppieren diesen, sagen wir, Hintergrund. Ich werde das duplizieren und Hover sagen. Whoops. Entschuldigung. Es geht zu schnell. In Ordnung. So wird der Hever aussehen. Das werden wir tun. Werden wir das einfach dazu bringen? Ähm, wie grau im Fokus. Wir werden rosa machen, da die Einfassung ein wenig zu hell aussieht. Also müssen Sie es aufhellen. Ich mache das zu einem neuen Grau. Also vier. Hoppla. In Ordnung, jetzt, da wir unsere Tarnung haben, werden wir einen Effekt zu diesem Effekt hinzufügen. Und wenn Sie wollen, Oh, wissen Sie, halten Sie die Effekte ähnlich. Du kannst hier reinkommen und wir mögen diesen Schlagschatten. Wir sehen nur Effekt-Stil. Wer kann nicht knöpfen lassen. Okay, jetzt springen wir zurück, um unseren Fokus auf die Bodeneffekte zu haben, aber können nicht knöpfen, also ist es so schön mit den einigen der Navy da drin. Ich möchte nur einige dieser Farben durchkommen lassen. Das ist ein wenig anderes Farbschema, aber ich habe Spaß, also lass uns damit gehen. Okay, Okay, also werden wir duplizieren, aber nehmen Sie das ab, und jetzt haben wir einen aktiven Klick. Also, was wir tun werden, ist, zurück zu gehen und zu sehen, was in der Schwebe ist. Nun, eigentlich können wir es auch hier tun, auch hier tun, damit du den inneren Schatten sehen kannst, damit wir Essen machen. Mütze kann nicht in ihrem Schatten. Ok. In Ordnung. Also gehe ich zurück zu hier, und eine Sache, die ich tue, ist Hey, wenn das wirklich nah ist, können wir das einfach nicht duplizieren. Bleiben Sie aktiv und zeigen Sie es. Und dann im Hintergrund wirkt es sich auf das Bootcamp in ihrem Schatten aus. Ich weiß nicht, ob das funktioniert, aber wir werden mit vorne gehen, um auf die Sache, die nett an Komponenten ist, wenn Sie das Gefühl haben, dass es nicht funktioniert, können Sie zurückgehen und es ausspülen. Und es wird sich auf dieser Seite ändern. Selbst wenn Sie mehrere Stücke haben, die wirklich lang sind wie ein Ende von, Ah, legen Sie fest,dass Sie eine wirklich große genannte Aktion wollen, was auch immer all diese Änderungen und wir haben es so eingerichtet, dass die wirklich lang sind wie ein Ende von, Ah, legen Sie fest, Ah dass Sie eine wirklich große genannte Aktion wollen, richtig dehnen. Also, ähm, jetzt sind wir aktiv, und wir werden, ähm, deaktiviert. Okay, also machen wir das einfach mit dem Grau und dem gleichen Grau müssen Sie vielleicht leichter sein suchen sind dunkler, also können Sie es sehen. Ja, das ist in Ordnung. Also, ähm, deaktivieren. Alles klar, jetzt schalten wir unseren sekundären Knopf ein, und bevor wir das tun, müssen wir sichergehen und drücken. Hey, hier ist Master Symbol Copy. Duplizieren auf. Wir werden unser Meister-Symbol hier rüber nehmen, und dann werden wir sicherstellen, dass ja, das ist unser zweites Duplikat. Geh in das hier. Deaktivieren Sie den Hintergrund. Aktivieren Sie das Duplikat mit dem Mauszeiger. Schalten Sie aus. Aktivieren Sie „Aktiv“. Und dasselbe mit Behinderten hilft, das zu tun. Ich bin der Falsche. In Ordnung. Ja. Auf dem Klick braucht etwas Arbeit. Es ist einfach nicht genug Veränderung da drauf. Also, was ist hier los? Wir gehen zurück zu unserem Meister, um sicherzustellen, dass wir es richtig abdecken, und wir werden es zu rosa machen. Sie werden die wir tun, die aktiv als rosa. Äh, du kannst nicht rosa. Okay, jetzt ja, das sieht ein bisschen besser aus, und es funktioniert. 5. Changes – Schneller Entwerfen durch Bearbeiten von master: Lasst uns Devil's Advocate noch einmal spielen und sagen: Wie zu diesem Zeitpunkt war der Kunde so, wie dies aussieht wie 2015. Wir mussten neuer sein, und wir wollen die Formularfelder, die nur einen Strich am unteren Rand haben. Also, was du tun kannst, ist hierher zurück in dein Original zu kommen. Und anstatt dieses Rechteck zu haben, müssen wir nur hinzufügen, was wir tun werden, ist es zu duplizieren. Also haben wir die gleiche Größe und nehmen die abgerundeten Ecken hier drüben ab, es zu zeigen, dass ich den Strich abnehmen werde und jetzt müssen wir füllen, aber Weg will es nicht. 64 Pixel. Lasst uns zwei Pixel machen und was wir tun werden, ist es fallen zu lassen. Und was ich gerne mache, ist dieses Basisrechteck da hinten zu haben, damit ich weiß, wo meine Kante für die Dimensionierung anhalten soll. Also, jetzt werden wir das verstecken. Also, jetzt haben wir einen schönen, ähm, schönen Rahmen sind Formularfelder, die ein wenig sauberer sind, und Ihr Kommentarfeld funktioniert nicht richtig, und es liegt daran, dass wir diese, ähm, die Rechteck, das auf Skalierung gesetzt ist So wollten wir wirklich Zehenboden und dann macht es automatisch, dass zwei Pixel, so dass Sie schnell sehen können, dass. Ich hoffe, Sie können es sehen. Es ist ein bisschen leicht. Also, was auch schön ist , ist, wenn Sie kommen und sagen Hey, ich möchte zeigen, dass dieser hervorgehoben ist. Sie können in dieses Formularfeld spezifisch kommen und sagen, Hey, das ist dies ist umsetzbar, wissen Sie, und wahrscheinlich brechen Sie dies und tun Sie dieses rosa zum Spaß. Also das ist auf Hever oder oder Fokus, und dann können Sie sagen, dass Sie tatsächlich tippen und gerade jetzt, also ist das eine andere Möglichkeit, es wirklich schnell zu tun. 6. Floating Menü-, das wir ändern und ein schwimmendes Menü aufbauen: Alles klar, willkommen zurück. Wir gehen zurück in den oberen Bereich und schauen uns einige Möglichkeiten an, wie Sie Komponenten pro Seite einfach wirklich schnell mit Bildern und Steuern ändern können . Also, was wir tun werden, ist dieser Teil loszuwerden und schwebte schöne Skateboard-Bild dahinter und machen es das Menü schweben auf dem Hintergrund des Bildes, so dass jede Seite wird eine andere Bildeinstellung haben. Also werden wir einfach ah, Menüsystem hier, das ich gerade schon gemacht habe. Und was wir tun wollen, ist sicherzustellen, dass wir ein bisschen dunkel an der Spitze haben, so dass das Menü immer zeigt, dass wir das einfach brechen und wir werden eine Grady Int Phil Linear machen . Und dann verblasst das auf Null. Wir werden sehen, wie es funktioniert, aber wir brauchen vielleicht nicht so viel wird es einfach in einer Sekunde zurückfallen. Also machen Sie im Grunde Rechteck und legen Sie es hinter seinem Optionsbefehl linke Klammer, und dann werden wir es mit einem Bild füllen. Also haben wir nur ein paar Skateboard-Bilder. Mal sehen, das hier ist irgendwie cool. Das könnte ja sein, lasst uns mit diesem gehen. Es ist ein bisschen zu niedrig. Also was wir tun können, ist gut davor zu überqueren, ich möchte sicherstellen, dass ich das A schöne A schöne Höhe habe. Also lasst uns für 92 tun. Okay, jetzt werden wir den Ausweis beschneiden. Bringen Sie das runter. Alles klar, das sieht also etwas seltsam aus. Nun, was wir tun möchten, ist, klicken Sie auf diese und gehen Sie zurück zur Master-Komponente, Gehe zu der Master-Komponente, die rechts dort auf der linken Seite ist. Wenn wir das haben, sieht sie jetzt einfach ein bisschen zu fett aus. Und diesen Hintergrund brauchen wir nicht. Also, wenn wir uns bewegen, wollen wir sicherstellen, dass wir das alles zusammen machen. Und normalerweise, wenn ich das zusammen als Menüsystem angelegt habe, werde ich dies auch als Komponente speichern. Was also schön ist, ist, wenn wir in diesen Hauptabschnitt gehen, dass diese Aktion oder der aktive Zustand auf der Schaltfläche, wollen wir sicherstellen, dass Sie Ihre linke und rechte haben, so dass es sich mit ihm als auch dehnen wird. Lassen Sie mich als aktiver Zustandsteil zurückgehen. Du willst, dass es auf der Unterseite ist. Wenn es also nicht unten ist und auf Skalierung eingestellt ist, passiert es , wenn Sie es verkleinern, die Linie schrumpft und Sie wollen das überhaupt nicht. Also willst du das auch unten oder oben gehen, abhängig von deinem Design. Also und jetzt, jetzt, wo wir irgendwie einige der Farben auf der machen dieses rosa zum Spaß gespült haben und wir diesen Hintergrund bei 8% loswerden, werden wir das verstecken. Ich werde es hier verstecken, Ausweis. Und jetzt gehen wir zurück zu diesem Hauptteil und schalten den aktiven Staat auf Also jetzt sind wir zu Hause und wir haben das schöne Menü. Und was schön ist, ist zu sagen, du willst Zeh, mach eine andere Seite und du machst das zu einer Komponente. Das könnte also Hauptmenü sein. Hand wird dies duplizieren und Hauptmenü herausnehmen. Hoppla. Was habe ich dort gemacht? Nehmen Sie das Hauptmenü heraus und legen Sie es über von einem anderen. Also, was schön ist, als Sie diesen Abschnitt auf der gesamten Website ändern können. Also, zum Beispiel, nun, wir werden das alles auch zu einer Komponente machen. Also werden wir hinzufügen, die Hauptnavigation sind nicht in der Navigation, Der Haupttext für die Seite. Also der Header eins und ich wollen, dass dieser nicht ganz Großbuchstaben ist, also werden wir es einfach regelmäßig haben. Wir werden das stinkende groß machen. Lasst uns gehen. 64. Ok. Alles klar, gehen wir. Noch größer. Alles klar, Also jetzt, was wir tun wollen, ist dieses dieses Grady int verblassen dieses Hintergrundbild und den Header eins zwei, in dem, was schön ist. Wenn Sie dies auf Ihren Textilien einrichten, gehen Sie einfach voran und nennen Sie es H eins. Aber wir werden alle drei dieser Optionsbefehle K auswählen , das wird unser Held sein, also kopiere ich das dupliziert und nehme den Helden hier raus. Also was schön ist, ist zu sagen, dass wir eine andere Seite wollen. Duplizieren Sie einfach die Seite. Bewegen Sie das ganze Zeug schnell, nur damit Sie es sehen können. Wir haben noch eine Seite. Wir wählen diese Komponente aus, sie ist ein Bild, und wir werden es versuchen. Ok. Und jetzt werden wir es beschneiden. Es ist bereits eingestellt, um cool zu schneiden. Wir gehen in unseren Header eins und mögen Knacken. Ich weiß nicht, ob das ein Skateboard ist oder nicht. Also brauchen wir noch eine Linie, also gehen wir zurück zu unserem Bauteil und ein Kalk links. In Ordnung. So schnell ein Gefühl bekommen, wie man verschiedene Seiten mit dem verschiedenen Menüsystem ausspült. 7. Knöpfe mit Symbolen mit dem Erstellen von Symbolen und aktiven Zuständen.: Lassen Sie uns einen schnellen Sprung in eine Schaltfläche mit einem Symbol machen. Was wir tun werden, ist wirklich einfach. Button hat die verschiedenen Social-Media-Symbole in ihm, und Sie können wirklich schnell tauschen. So gut, machen Sie einen weißen Knopf mit einem Strich und tun Sie es ziemlich subtil und machen. Dies wird auf 56 für die Social Media sinken. Und sagen wir, Sie wissen schon, machen eine Folge oder so etwas, um das noch kleiner zu machen. Es ist gut auf 48, also ist es nicht überwältigend. Und ich sagte, dieser Text die Zeile links, geben Sie ihm etwas Raum. Wir werden zuerst Twitter mitbringen. Also hast du Twitter und was wir tun werden, ist, das auszuräumen. Da sie alle folgen sagen, werden wir das zentrieren und den Abstand haben, den 32 Alles klar, so ziemlich einfach. Option Befehl K. Also haben wir unsere soziale Taste Kim Typ mit euch Jungs beobachten. Okay, was wir tun wollen, ist in der Lage zu sein, das herauszuziehen und die verschiedenen Folgen-Buttons zu haben, damit wir sogar eine andere machen können, auch wo wir nur das uns wie eine kleine 32-Pixel-Version haben. Das Gleiche. Manchmal, wenn Sie etwas haben, fügen Sie es einfach nach oben links schießt, nur um nach ihnen zu schauen. Also eines der Dinge, die Sie tun können, ist nur werfen Sie alle diese Symbole auf hier und eine Linie Mitte. Richten Sie vertikal aus und legen Sie es auf dieser Schaltfläche ab. Ausrichten. Vertikale Linie. Horizontale Option Befehl K. Sie haben Ihre Komponente Social klein. Okay, wir machen ein Duplikat davon. Ich habe das Original geschnappt. Zieh es raus. Also, was schön ist, ist zu sagen, Sie haben das, Meister, Sie kommen rein und verstecken einfach all diese. Dann, wenn Sie in diesen sozialen Hauptbereich kommen, lassen Sie uns sagen, fangen wir mit Twitter an und wir wollen, dass sie so zusammengeschlossen werden. In Ordnung? Ich glaube, das ist vermasselt. Alles klar, dann kommen Sie hier rein, schalten Sie aus, schalten Sie Facebook ein, dann freundlich aus. Twitter, schalten Sie Lincoln ein. Und so weiter und so weiter. Und super einfach. Super, super einfach. Aus irgendeinem Grund sieht das komisch aus. Also müssen wir zurück zu unserem Haupt ein schnelles YouTube und sehen, dass man im Hauptbereich nach unten geht . Das ist also eine Möglichkeit, diese kleinen Social-Media-Buttons zu tun und vergessen Sie nicht Dosen. Ähm, so zu sagen, ist aus und gut, dupliziere das und sag weiter und mache es voll grau. Also, weißt du, wenn du das auswählst und den Be On On Button oder den Rollover-Knopf zeigen willst, dann klickst du einfach auf Hoffnungen auf diese, okay? So können Sie schnell sehen, wie einfach es ist, diese Komponenten herzustellen. Und dann, zum Beispiel, wenn dies in der Fußzeile und den Fußzeilen auf der ganzen Website ist, dann können Sie einfach schnell ein Gefühl bekommen. Es ist fast so, als hätten Sie CSS visuell, um alles im laufenden Betrieb zu ändern. Also werde ich nicht eine Menge Zeit damit verbringen. Aber, ähm, also werden wir das einfach schnell klappen. Hoppla, ich hatte die anderen nicht da drin. Manchmal muss man eine Show haben, die man sehen kann, was man tut. Das macht irgendwie Spaß. Alles klar, jetzt gehe ich Teoh und mache Twitter aus. Er ist groß, macht es einfach super einfach und gut dran. Sie haben Ihre Social Buttons und Sie können Rollovers alles und Stil in irgendeiner Weise, die Sie wollen, aber bevor Sie fertig sind, wollen Sie sehen, wie das funktioniert? Responsiv. Also lassen Sie uns einen Blick auf das und sehen, ob es sich erstreckt und das ist, wovon ich rede, ist nein, das ist nicht richtig. Also, was wir tun, ist, gehen wir in diese, so wählen Sie sie alle und sagen, wir wollen ihn in der Mitte und wir wollen unter links und dann wollen wir , dass dieser folgen Welcher Song? Dieser soziale Hauptknopf genau hier. Wir wollen, dass es richtig gerechtfertigt ist. Lassen Sie uns es gerechtfertigt lassen. Aber was wir tun werden, ist, richtig und zentriert zu sagen. Also, wenn das herausrutscht, wird es größer werden. Jetzt haben wir es richtig gemacht, und Sie können diese sogar als Gruppe und Mittellinie diejenigen gruppieren, so dass sie zusammen in der Schaltfläche bleiben wie zuvor. Ich schätze, das sollte ich dir zeigen. Also, was wir tun werden, ist, das zusammenzufassen und was Sie tun müssen, ist zu sagen, ein Zentrum Zentrum und jetzt sollte gehen. Wenn nicht, müssen wir was? Es hat es gerade auf Twitter gemacht. Also, vielleicht musst du es zeigen, ähm, sagt Zentrum Zentrum. In Ordnung, also ist es schön, dass du es einfach testen kannst. Also, dann haben Sie einen schönen Button, der folgt und kein Wortspiel beabsichtigt und kann auf Ihre Antwort von Inhalten dehnen . 8. Selection – radio und check mit aktiven Staaten.: In Ordnung, lasst uns in Multi springen. Wählen Sie und wählen Sie einzelne Auswahl aus. Also, was angezeigt wird, ist ein Multi-Select-Kontrollkästchen wäre. Also werden wir diese 32 32 machen. Ich bleibe bei der gleichen Art von Stil mit dem weißen Hintergrund, wie ein bis Pixel grauer Strich. Ok. Und sie schnappt sich ein paar SMS. Rufen wir dieses Kontrollkästchen einfach ein Kontrollkästchen an. Wir haben einen Text nur regulär und legen diesen mit 24 Pixeln raus mit 24 Pixeln raus. Sie können sehen, wie es mir geht. Alles in Achteln versuchte Azzam. Ich gehe nicht zu schnell. Also, ähm, wir werden nur die Box selbst für die machen und es scheint immer noch zu groß zu sein. Also gehen wir runter auf 24. In Ordnung, also haben wir im Grunde unsere Kiste, du bist zurück. Und dann wollen wir einen Scheck bekommen. Und so benutze ich, äh, nicht so weit genial. Und so können wir nachschlagen, überprüfen Wenn Sie die Pro-Version nicht haben, haben, können Sie die kostenlose Version verwenden, also gibt es auch einen Scheck . Also mag ich ein paar davon. Die dünnen, die dem Stil entsprechen, den wir suchen. Also, was ich mache, ist, den Unicode zu kopieren und zurück zu Sigma zu gehen. Ja, fügen Sie das hier ein und füllen Sie es mit Hat das funktioniert? Oh, es ist auf Scharfsinn, Prue. Also brauchen wir Schriftart Awesome. Fünf, keine Marken, sondern nur fünf dort. Ja, es gibt einen Profi, und wir werden den Scheck da reinlegen. Ok. Sieht so aus, als hätte ich zu denen, die nicht sicher sind, wo das ist. Ordnung, zoomen Sie ein wenig hinein. Wir haben also ein Kontrollkästchen, und was wir tun wollen, ist zu sagen, damals werde ich das duplizieren und aktiv sagen. Und diese Überprüfung ist nicht heiß auf der Seite selbst. Manchmal schneide ich es einfach aus, befehle X und wähle etwas auf der Seite aus und sag Befehl V, und es wird es irgendwo in der Nähe einfügen. Also sind wir, wo unser Ja ist, wir sind weit da oben. Normalerweise gruppiere ich die ein bisschen besser, um ein bisschen schneller zu gehen, aber, ähm, wenn du die restlichen Seiten aufbaust, aber was wir tun werden, ist einfach weiter zu bewegen. Ok? Also haben wir unseren Scheck hier. Wir können diesen Scheck nennen und aktiv. Also wollten wir zu diesem Pink gehen. Und jetzt, was wir tun, ist zu sagen, aktiv. Ich gruppiere das und Oh, und wir werden das verstecken und dann beide auswählen. Und wir brauchen keine Gruppe mehr. Sagen Sie einfach Optionsbefehl K also haben wir unsere Komponente und, ähm, aktivieren Sie das Kontrollkästchen. Ordnung, also jetzt schließen wir das hier unten und wir werden das duplizieren. Halten Sie das zur Seite, falls wir jemanden wechseln müssen. Machen Sie diesen einen aktiven super Spaß. Ähm, jetzt gehen wir hier rüber und machen dasselbe. Also nehmen wir das Styling, machen ein Optionsfeld. Und Phyllis Flugschlag ist der graue zu und nach unten auf 24. Manchmal sind die Optionsfelder etwas kleiner, also könnten wir auf 22 gehen, nur, äh, bekommen dieses Gefühl für diesen Stil. In Ordnung? Es ist und dann sagen wir das Gleiche aus. Aber das hier, was wir tun werden, ist, einen einfachen Kreis in der Mitte zu machen was wir tun werden, ist, einen einfachen Kreis in der Mitte zu machen. Und eine Sache mit Ihnen wissen, 22 funktioniert nicht mit dem Kreis direkt in der Mitte, es sei denn, es ist einfach perfekt. Also gehen wir zu 21 und dann eine Linie Mitte, Vertikale Linie, horizontal und ist immer noch ein wenig aus. Also vielleicht ist das gut, ich schätze, ich hatte es richtig. 08 Hallo, Evens. Okay, also los geht's. Wir gehen nach Pink für den Film. Nennen Sie diesen aktiv und gehen Sie zu duplizieren. Ändern Sie das in Pink. Das gefällt mir nicht. Es muss das vielleicht sein. Okay, also, , nach Punkt,also gehen wir in die Teoh-Gruppe. Die machen es aus. Wählen Sie beide Option Befehl K. Und so haben wir Radio dupliziert. Ich verstehe, wie schnell du da kriegen kannst. Wie schnell Sie sich damit bewegen können. Kein Klick auf. In Ordnung. Und , zum Beispiel, wenn du mit dem Text so ändern willst, kannst du das , aber wir werden es einfach so behalten. 9. Tab -Komponenten – die Nutzung von reaktionsfähigen Komponenten, um neue Registerkarten hinzuzufügen.: Ich werde reinspringen und weitermachen und an ein paar Tabs arbeiten. Und so haben wir, wie, einen aktiven Tab-Zustand. Wir haben jetzt eine kondensierte Registerkarte mit, wie, wie, ich weiß nicht, wie, wie, , Hey, es gibt drei Dinge, die in diesem Tab passieren, aber das ist ein nettes -Komponentenabschnitt. So lange Sie Tabs erstellen, können Sie sie weiter ziehen und Ihre Sets ein- und ausschalten. Also, was wir tun werden, ist eine Linie zu erstellen, auf der ich gerne ein Rechteck verwende, nicht die Linien. Also hast du noch ein bisschen mehr Spiel. Ich bin mir nicht sicher, warum. Ich glaube, es war Sean Moynihan, der mir das beigebracht hat. In Ordnung, also werden wir Bootcamp gehen, toll für, und wir geben diesem Raum, um diese aktive Registerkarte wie einen Knopf zu behandeln, aber wir werden ein paar andere Dinge damit machen. Also werden wir den Hintergrund haben, bewegen Sie ihn nach hinten, die Option Befehl linke Klammer ist. Also geh auf 44 mit etwas größer, und wir werden es mit Weiß füllen und diesen, ähm, Strich, umdie gleiche Farbe haben ähm, Strich, um . So wird so übereinstimmen. Ich denke, das ist nicht die gleiche Farbe für und drei. Okay, also haben wir unsere aktive Registerkarte hier, und wir werden den ganzen Weg rüber in den Bereich der Sidebar gehen, okay? Ich habe das nur dupliziert, indem ich die Option hielt. Okay, jetzt haben Sie Ihren aktiven Tab. Nun, wenn Sie wissen, dass Ihre Hintergründe weiß sind, bringen Sie einfach einen schnellen, wie einen Schlag darüber, ähm, um zu decken, zu decken, was da ist. Und dann haben Sie das aktiv, vor allem, wenn Sie tun, wie, ein Stil Handtuch oder etwas, das Sie tun es wirklich schnell. Das ist ein netter, schneller Weg, es zu tun. Sagen wir, wir werden das als Ableger auf der Registerkarte haben ,um zu zeigen, wie viele Dinge passiert sind, die irgendwie Spaß machen würden. , In Ordnung, jetzt, wo wir unsere Grundstruktur haben, wollen wir ein Zentrum, den Text, und stellen sicher, dass ihre Abstände manchmal Oh, äh, ich werde die's reinlegen und sagen: Ich will eine 24-Pixel-Basis. Dann ist dies eine Art billige, schnelle, schnelle Möglichkeit, das zu tun. Und es hilft. Holen Sie sich einfach schnell Ihre Abstände. Okay, das werde ich nicht. Okay, jetzt, da wir einen Tab haben, der funktioniert. Das ist unser aktiver Zustand. Ich habe es dupliziert und den Meister hier drüben. Also können wir versuchen, etwas zu dehnen und so etwas zu tun, um zu sehen, ob es funktioniert. Und es ist der Grund, warum ist dies gruppiert und es ist auf rechts oben gesetzt. Bleiben Sie also immer oben. Wir wollen, dass dies 44 Pixel ist, und es ist nicht genau so. Ich werde es 44 Pixel machen. Und wir haben das an diese aktive Bar geschickt, im Grunde gesagt, Hey, Hey, das ist der Bereich, der aktiv ist. Ich wollte nicht, dass es den ganzen Weg hindurchgeht. Ich wollte, dass es zeigt, dass Hey, wir arbeiten an diesem Inhalt unten, aber wir wollen, dass das Zentrum und unten ist. Also bleiben wir immer in der Mitte und es wird nicht wachsen. Ich weiß, dass ich immer ganz unten bin. Jetzt, da wir das haben, müssen wir es ausräumen. Ich halte nur die Option, wenn ich so in einem inaktiven und aktiven ziehen. Okay, sagen Sie, es ist wie inaktive Registerkarte. Es ist ein bisschen länger. Ähm, also wollen wir wieder zwei Zeilen und wir werden diese Linie ändern. HaIf und, ähm, jetzt können wir das tun, und Sie können sehen, dass es korrekt mit dem anderen funktioniert. Also sind es 84 Prozent. Und aber eine Sache, die wir tun können, ist, es etwas breiter zu machen. Dies sollte also 20 sind 24 Pixel, 24 Pixel und 32 Raum sein. Was wir jetzt tun, ist, dass wir die Zahlen behalten oder sie schweben und den aktiven Start abnehmen und das abnehmen können. Also haben wir hier nur eine nette inaktive Registerkarte und wir werden wieder duplizieren und sagen, wie, wie, wir werden das einfach inaktiv nennen, also seien Sie ein wenig kleiner und die Art und Weise, wo Sie wissen, wo Ihre Größe ist, ist, dass Sie gehen, bis es springt zwei Zeilen. Also, jetzt ist das richtig für Ihre Abstände. Also lasst uns als nächstes in zwei Tabellen springen 10. Tabellen – Aufwand für den Aufbau und dynamische Veränderungen: Wir werden in Tische springen, also werde ich mir ein paar Sachen ausdenken. Ich habe den X-Spiele-Status. Jetzt haben wir ein weltweites Ich, versuchen wir es zu sehen, wie, ähm, Verfügbarkeit, um , um, Sponsor. Und vielleicht werden wir hier einen Namen machen, nur das erfinden. Was wir also tun wollen, ist, diese in unsere Säulen zu gehen oder an Räumen zu arbeiten, je nachdem, ob diese Luft bleibt oder dynamisch ist, also könnte dies auch eine Komponente sein. Also, zum Beispiel, möchte ich das, äh, Textil machen äh, . Also werde ich sagen, das ist, ähm, vor den Armen. Alles klar, Sie können dies setzen und klicken Sie auf sie alle, wählen Sie ihn und sagen, jede für eine Sache, die Sie tun können, ist, wenn Sie Abstand sind, können Sie dies zu einer Komponente machen, so dass es mit Ihren Tabellen als auch gleitet. Wir werden jetzt an den anderen Tischen arbeiten. Also, was wir tun werden, ist weiterzumachen und wir werden das brechen und einfach einige grundlegende Texte einen regulären Text bekommen und es auf 16 fallen lassen. Also werden wir 123478 9-001 haben, also ist das seine Nummer und Verfügbarkeit ist, ähm, ich sehe nicht verfügbar. Und was wir tun werden, ist dafür zu sorgen, dass dieser Text nicht im Zentrum steht. Großbuchstabe in Großbuchstaben. Dasselbe mit diesem, um sicher zu sein. Ja. In Ordnung. Also wollen wir das. Dies ist wie unser Header-Bereich. Wir wollen also, dass dies unsere erste Tabellenzelle ist. Wir werden das für 30 bis 48 Pixel platzieren, also wollen wir, dass es etwas stärker ist, also werden wir es als Marinebasis verwenden. , Ich denke,wofür wir nur unter Ihrem Status tun werden, okay, machen Sie einfach ein Date nur für den Heckman. Also, da dies ein Datum sein wird, schwächen, schrumpfen Sie das ziemlich viel und bringen Sie den Namen. Und fangen wir mit Rodney an, äh, Trauer. Das wäre also auch irgendwie cool . Die meisten Tische haben das nicht, aber wir können es tun. Nur, ähm, wir können ihr Sponsorenlogo einwerfen, und wir werden das einfach als Raum benutzen. Also werde ich das ziemlich klein machen und den Sponsor rüberziehen und mir verzeihen. Ich weiß nicht, welche Sponsoren ich schnappe ein paar Firmen, also nur zum Spaß, Prinzessin, siehe Adidas. Ok. Und wir schicken diesen Phil an ein Bild, okay? Und Status verfügbar. Also werde ein netter, wir gehen zurück und überprüfen. Symbol. Wir werden nach oben schauen. Mal sehen. Ähm, wir haben den Scheck schon. Ich sehe nicht nur zum Teufel, dass es reicht. Ähm, in der Nähe. Also haben wir mal Zeit, Sir. Cool. Also kopieren Sie das. Kopieren Sie es. Kommen Sie zurück zu Fig MMA. Stellen Sie sicher, dass es Schriftart genial und pro ist. , jetzt Also, jetzthaben wir unsere Klamotten, und wir werden die 24 Pixel anmachen, um zu sehen, ob er verfügbar ist oder nicht. Also was, wenn wir wahrscheinlich überprüfen wollen? Das ist wirklich ähnlich. Also gehen wir zurück, um den Kreis zu überprüfen. Aktivieren Sie eine Kopie umkreisen. Komm zurück. Frieden. In Ordnung. Also, welche Farben haben wir? Machen Sie das Grün oder das Rosa? Weil es die aktive Farbe ist und nicht verfügbar ist. Ist das überhaupt die grünen? Es ist, als ob ich es weiß. Also werde ich das stapeln und sie ausrichten, diesen Status richtig machen und dann sicherstellen, dass wir genug Platz haben, um nicht verfügbar zu sein. Art von Typ aus wie die meisten haben Sie so, wenn Sie wissen, dass es verfügbar ist, sind nicht verfügbar. Geben Sie nicht verfügbar ein, und überprüfen Sie, wo Sie sich befinden. Also haben wir das Logo beim Sponsor. Das Namensdatum und die weltweite I d. Nummer. Ich werde das nur ein bisschen in den Raum bringen, also wollen wir nicht, dass du nicht willst, also lasst uns das loswerden. Ich werde das nur ein bisschen in den Raum bringen, also wollen wir nicht, dass du nicht willst, Damit wir sehen können. Das ist also unser Tisch. Aber was wir tun wollen, ist, zuerst unsere Abstände zu betrachten, bevor wir dies zu einer Komponente machen. Also habe ich das in den Boden gelegt, und eigentlich werde ich es wirklich leicht machen. Und obwohl wir diese 1. 1 nicht sein wollen, ähm, ähm, Gray, wollten wir wahrscheinlich weiß sein. Ähm, wir wollen das im Hintergrund. Also wollen wir das ist der Raum. Also sage ich gerade 84 gerade, beobachte nur mein Gitter. In Ordnung, also wollen wir Platz. Das ist nur ein kleines bisschen. Ich war 24 Jahre alt. Das haben wir da drüben. Also, jetzt haben wir unseren Tisch, und ich mag den Hintergrund nicht so, aber was wir tun können ist, den gleichen zu benutzen, aber ihn auf 10 oder 20% fallen zu lassen. 30 wird funktionieren. Und was wir tun werden, ist, das zu duplizieren und es auf zwei zu bringen. Und manchmal, wenn Sie Probleme beim Futter haben, können Sie beide auswählen und sicherstellen, dass Sie eine Linie nach unten haben. Und jetzt weiß ich, dass dies der oben ist. Ich werde zu 50% gehen. Ich versuche, zu 100 zu gehen, um all den anderen zu entsprechen. In Ordnung, also jetzt, was wir tun, ist alle Option Befehl K ausgewählt. Sie sind. Sie haben eine Komponente, und es ist eine Tabelle. Also, was wir jetzt tun können, ist, das zu duplizieren, um unseren Tischmeister rauszuholen. Damit müssen wir ein bisschen spielen. Und wir werden das duplizieren, indem wir Option und Shift halten und dieses und dieses. Alles klar, also haben wir mal sehen, Bucky LASIK, um Quist zu verbrennen. Eric kostete, weil fertig. Okay, also habe ich keine Ahnung, mit wem diese Typen zusammen waren. Tut mir leid, wenn ich das durcheinander, ich habe nur dieses Logo ist verfügbar, so und abhängig. Okay, jetzt ist das hier gescheitert. Was wir tun werden, ist zu diesem hier zurückzukommen und sicherzustellen, dass wir den Platz haben, es zu tun . Ok? Ich glaube, es ist nicht unabhängig. Ja. Stimmt das, Mann? Ich hoffe, ich habe es nicht vermasselt, so dass Sie schnell die Zahlen hier ändern können. Sagen wir mal 3478 Sie haben 678 und Dates. Ich weiß es nicht. Wir machen nur die Substanz, die wir schnell ändern können. Aber es ist so schön, wenn du Kompass für Unternehmen machst. Also lassen Sie uns 12 und 2020 sehen. Alles klar, was wir jetzt tun wollen, ist, dass wir in das Bild gehen und unser Bild auswählen können. Und was war das? Zuerst weiß ich besser, welches von dem, was Adidas sieht, dass ich unabhängig hineinwerfen kann. Es ist so schön, einfach schnell tauschen zu können. Ich meine, die sind winzig, aber du verstehst die Idee, dass du allerlei Sachen erledigen kannst. Santa Cruz Plan B Bild Käse Bild und alles in Ordnung. Das ist also cool. Damit du jetzt reingehen und sagen kannst, , was ich hier nicht gemacht habe. Wir können dies nennen, ähm, verfügbar, und Sie können unten in diesen sehen. Es fängt an, die für dich auszufüllen. Jetzt wissen wir also, welcher ist. Sagen wir mal, er ist nicht verfügbar und wird sagen, Oops, er steht zur Verfügung. Also werden wir diese verstecken, damit Sie schnell ein Gefühl von Variablen bekommen , können,die Sie ein- und ausschalten können. Also, dieser hier, was wir tun werden, ist zurück nach hinten zu gehen und es zu verstecken. Dasselbe mit diesem Formular. Nun, eigentlich, lassen Sie uns das hier behalten und müssen diesen verstecken und den Rücken verstecken. Diese, sie kann schnell sehen, wie der Tisch gebaut werden könnte. 11. Blockquotes: Schließen Sie dieses Tutorial heraus. Ich möchte ein paar mehr Dinge durchgehen, nur ein Gefühl des reaktionsfähigen Verhaltens mit Komponenten bekommen . Also, zum Beispiel, habe ich dieses Walk-Zitat erstellt, und die Art, wie Sie bauen wollen, wie ein Zeugnis, Zeugnis oder ein Block Zitat, ist nicht in Stücke. Also haben Sie Ihren Hintergrund, ähm, Rückrufe und Ihre SMS, und ich habe Rückrufe und Ihre SMS, und ich habe ein kleines Zitat. Und, ähm, Doktor, ich bin ein lustiger Kerl. Also dieses Stück ist der Name, und das ist das Zitat, Zitat , Klammer oder Anführungszeichen, und dann ist dies das tatsächliche Blockzitat. Was wir also tun wollen, ist, das als Komponente zu speichern und nur für Zeitzwecke werde ich es direkt unten setzen. Also kopierte ich es, duplizierte es. Okay, wenn wir uns damit anlegen, geht es nicht so gut, und du wirst wirklich zerschlagen und nichts bewegt sich. Richtig. Also, was wir tun wollen, ist, dass wir es tatsächlich ein bisschen zerschlagen können, damit Sie sehen können, was passiert . Aber geh nach hinten und sag, links und rechts und oben und unten. Dann wollen Sie, dass Ihr Name auf der Unterseite steht. Also sagst du links, weil du immer links wolltest. Neben diesem Zitat sind wie Sprechblase Zitat, und dann wollen Sie es auf der Unterseite. Gleiches mit diesem hier. Du willst es links und unten. Und diese wollen Sie links und rechts. Sie können bereits sehen, dass es sich ändert und oben und unten tatsächlich können Sie oben. Und lassen Sie uns das auf, ähm, Mitte und Spitze setzen. Okay, sieh mal, also funktioniert das, richtig? Es sieht einfach so aus, als ob es nicht richtig funktioniert, denn wenn man das ausdehnt und dann räumt man es ein, denn wenn man das ausdehnt und dann räumt man es ein,damit man schnell sehen kann, wie das wirklich gut funktioniert, mit ansprechenden Designs, wo man es einfach übergossen und dann nach unten ziehen kann. So super nett. Und wir fangen einfach an einer dieser Spalten, bringen den Platz richtig, und verschieben die Master-Komponente aus und wir sind fertig. 12. Preisrichtlinien – 1 Komponente zur Erstellung einer schnellen 3-Säulen-Preisbestimmungstabelle: auf diesem letzten Stück, werden wir Preismodell Preisstruktur zu tun, so dass die Komponenten verschoben und bearbeitet werden können . Und es ist einfach schön Zehe Preisstruktur haben, aber mit ihnen in Komponenten sein. Also machen wir das weiß und haben nur ein bisschen Spaß. Ähm, in diesem Hintergrund, also was ich tun werde, ist ein Foto heranziehen, oder? Irgendwie großer Hass? Ok. Und was wir tun werden, ist, wir gehen Teoh einfach duplizieren Sie das für Dimensionierungszwecke und gehen Sie zu solide, und dann können wir das hinter uns bewegen, also sagen wir, das ist zurück und bewegen Sie es, wenn Sie ganz unten links schauen können, können Sie siehe hier ist die Rückseite und wir werden dunkel auf diesem zu gehen, und wir werden das Bild zu ändern Lassen Sie uns versuchen Software. Ja, also macht das irgendwie Spaß, und du kannst es sogar verwischen und allerlei Sachen damit machen. Also oben drauf, Also ich mag es, diese zu gruppieren und sagen zurück und dann sperren Sie es. Manchmal, wenn ich an der Spitze ihrer arbeiten, aber wir werden in unserem Gitter werfen und wird eine Reihe von 33 und drei tun . Also machen Sie das aufgereiht, Ordnung? Und nur einen Zagat erfinden. Also gebar mit mir. Also, was wir tun werden, ist, dass wir Licht haben wie ein Profi. Und, ähm, , , naja, vielleicht leicht, regelmäßig und professionell. Also, was wir tun werden, ist herauszufinden, die Farben einfach wirklich schnell darüber nachzudenken, was könnte die stärkste und mittlere sein. Und tatsächlich, oft haben sie, wie, wie, das Licht und Regular, und dann ist der Profi in der Mitte mit dem ist ein bisschen größer. Also könnten wir es einfach tun, um dieses grüne Grau. Ja, nur zum Teufel. Wir werden das ausprobieren, also stellen wir das hier rein. Und wir wollten die ganze Sache ausgeben, weil wir Ah, einen Schlagschatten wollen . Also habe ich es schon zu weit fallen lassen. Also hier ist die Preisgestaltung zurück. Ok? Wir werden die Effekte machen. Wer kann nicht knöpfen, und wir werden das brechen. Wir werden ein bisschen größer werden. Also mach wie eine 14. Und machen Sie das wirklich dunkel, damit Sie es viel zu dunkel sehen können. Dann werden wir das auf 50 zurückgeben. Okay, also sagen wir leichte Hand. Wir halten diese Pausen und machen ihn ein wenig anders. Will wird größer, aber dünner. Also wollen wir den Text zentrieren und darüber nachdenken, Stretching und und Abstand. Also wollen wir Bücher so viel Abstand wie möglich für den anderen haben. Die anderen Teile. Und ich denke, was ich tun will, ist klein zu gehen , und, äh, die 24 nicht zu 24 24 und dann die Preise genau hier zu machen. So gut, haben Sie den Preis. Und dann sagen wir, es sind 29 im Monat. Eigentlich sind das eine Menge ST neun im Monat. Und wir wollen, dass das groß ist und dieses leicht und klein ist. Und so eine Sache, die wir tun können, ist an der Ausrichtung damit zu arbeiten, ist es, wo es hochgestellt arbeiten wird , die Position davon höher zu sein. Ich glaube nicht, dass wir den Schrägstrich brauchen. Ich will das noch größer. 56 64 hier. Okay, du hast ein Licht, und wir beschreiben diese Linie und wieder, es warf sie da hoch und dann wieder runter. Ja. Ok. Was bringt uns den ganzen Weg durch? Nicht sicher, was es nicht funktioniert damit. Ok. Ich werde das wirklich subtil machen. Sagen Sie, 20%. Willst du dich begleichen? Oh, das sind 100 da, aber Pastoren 20. Okay, okay, also das sind $9 Monate. Aber was jetzt Spaß macht, ist eigentlich, wir können das zurückziehen, herunterfallen und das durch ein paar Stücke gehen lassen. Sie können den Hintergrund sehen. Jemand tut es. 75%. Okay, jetzt haben wir wie eine Liste wieeine verschraubte Liste. Aber lassen Sie es uns einfach zentrieren und sagen, wie, eigentlich, ich habe ein paar Latein hier drüben, Gramps darauf zentriert. Lass uns 30 vier verletzen. Wir sind bei einem Spacey um 24 Uhr. In Ordnung. Und sehen, wie Sie schwanger werden. Das ist zentriert, und das ist in Ordnung. Eigentlich lassen wir es so. Sieht gut aus, Obwohl wir es jetzt kaufen wollen. Taste so gut, Platz ein wenig besser. In Ordnung. Und so können wir jetzt auf unsere Schaltfläche zurückkommen. Kopieren Sie es. Mittlerweile kannst du das etwas verkleinern, wenn wir wollen. Okay, das ist super einfach, dass du die Idee bekommst. Jetzt werden wir das Diktieren zu einer Komponente machen. Also brauchen wir diese Rückpreisung mit all dem anderen Zeug zurück. Ich habe so viel Zeug vor sich und er würde es aufräumen. Bestelltaste, um zu gehen. Da gehen wir. Eines der Dinge, die Sie tun können, ist, alle Elemente auszuwählen, die Probleme in der Gruppe hatten, rufen Sie die Preise an, und dann gehen wir zum Optionsbefehl K und machen es, äh, Komponente, äh, Ich dupliziere das Ausgenommen. Nun, es sind ziemlich verrückte Tropfen. Also haben wir unsere Preise in unserem Meister. Also, was wir jetzt tun werden, ist, an den Säulen zu schnappen und sie herauszunehmen. Und was ist irgendwie cool ist, dass wir die Option halten und das ein bisschen größer machen können. Danke dann. Und wir sagen 80 19 und 14. Also sagen wir Pro und Business. Nur zum Teufel. Das ist also, was an Komponenten so schön ist, ist, dass Sie die Elemente einfach schnell ändern können. Sehen Sie? Sehen Sie, was Farben funktioniert hier. Ein bisschen verrückt. Entschuldigung. Und Sie können sogar Ihre Buttons im laufenden Betrieb ändern. Ich hoffe, dass es hilfreich war und Sie verstehen, wie leistungsstarke Komponenten sind. Und ich freue mich, Teoh, zu sehen, was ihr schafft, denkt, dass einige dieser Preisbereiche, die ich in einem Bild hinzugefügt habe aber ich mag es nicht, also werde ich es löschen. Löscht sie durchgängig. Einige dieser Elemente werden haben. Dies ist der beste Wert oder eine Art von Band, das zeigt Hey, schauen Sie es. Sieh mich an. Was wir natürlich auf diesem Pro machen würden, dass, ähm und ich normalerweise ist es irgendwie wie die billigere Version. Es ist wie die mittlere Version. Also, Dio, wir tauschen das aus und sagen Pro und Business. Okay, wie fügen wir hier etwas hinzu, das wir auf der anderen nicht wollen, zum selben Ding? Wir gehen einfach zurück zur Master-Komponente und dies ist der Header-Bereich. Also einige von diesem Design vielleicht nicht das Beste sein, aber es ist mehr nur, um Ihnen zu zeigen, Hey, das ist, was wir tun können. Also, was ich tun werde, ist ein Band zu machen und ich werde es maskieren, so dass wir einfach dieses Band anrufen und es weiß machen, und dann bringen wir es in diesen Header-Bereich, und was wir tun werden, ist auch als Maske für diesen Abschnitt hier zu verwenden. Also werden wir den Header duplizieren und diese Maske aufrufen. Ich bin in einer Gruppe, die zusammen. Dann nenne ich diese Messe Tuas. Nun, dann werde ich sagen, verwenden Sie als Mast und dann schlägt das und damit Sie sehen, dass Sie wissen, dass es aussehen wird, ähm, ähm, dieses Band kann sich innerhalb dieses Maskenbereichs zu dem bewegen, was Sie wollen, damit wir werfen können, wie in einem dieser Effekte auf hier. Also, der Knopf Drop, der ziemlich geklärt ist und lasst uns fallen lassen, gehen wir weiter. Und wir wollen das maskieren, da es seinen Text gibt, zu dem wir, äh, du siehst nicht, dass das Wert ist. Okay, wir machen kondensiert und regelmäßig und machen es rosa. Also haben wir den Winkel von ihm übereinstimmen. Und das ist, was an Vektoren cool ist, dass Sie es einfach dehnen können. Und da du deine Masse bereits eingerichtet hast, musst du dich nur bewegen. Verschieben Sie es dorthin, wo es funktioniert, und wir geben ihm einfach ein bisschen mehr Platz. Und ich habe schon das heiße Symbol geschnappt, also schneide ich es aus, gehe zurück zur Bandpaste, und jetzt siehst du, dass es hier drin ist. Es ist nicht gerade eine 45, aber es ist okay. Also sagen wir einfach, dass das ist. Und ich denke, mein du kannst es wie ein direktes gehen, indem du die Schicht hältst. Gehe zu einer 45. Ich wollte nur einen etwas anderen Blickwinkel. Ich glaube, das ist 30. Vielleicht so etwas. Also okay, jetzt haben wir den besten Wert, aber wir wissen, dass alle drei nicht der beste Wert sind. Alles, was du tun musst, ist hierher zu kommen und die Maske zu verstecken und die Maske zu verstecken. Also, was ist hier passiert? Das ist eine Verschiebung für Komponenten. Was wir also tun müssen, ist in unsere Maske zu gehen. Und eine Sache, die wir tun können, die helfen könnte, ist, nur zu sagen, dass das richtig ist und dann oben, und so können Sie sehen, wie es gesprungen ist. Das ist also der beste Weg, es zu tun, ist es, es zu testen, wenn Sie müssen. Manchmal müssen Sie dies zu einer Komponente machen. Sie können dies nicht innerhalb von Komponenten tun, also können Sie es nach außen ziehen, eine Komponente duplizieren lassen und sie dann in Ihre Preisgestaltung ziehen. Das mussten wir diesmal nicht machen. Es gibt einige komplexere Strukturen, die ich, damit ich es nicht reinstelle, wenn wir es nicht brauchen. Also, äh, das ist der Komponentenabschnitt. Kurz gesagt, Sie können in die Paginierung gelangen, das heißt, Sie wissen, mit dem Dreieck und der eingestellten Zahl und dem aktiven Zustand alles in einer Komponente. Jetzt, wo ihr die Werkzeuge habt, hoffe ich zu sehen, was ihr baut. Danke. Ja, du bist fertig. Ich hoffe, dass diese Klassen Ihnen geholfen haben, zu zeigen, wie Sie mit Komponenten arbeiten können, wie einfach sie zu bearbeiten sind und schöne Schichten. Wenn der Kunde etwas hasst, können Sie einige Dinge gleichzeitig verschieben. Also würde ich gerne einige der Projekte sehen, die Sie mit mehr als nur Projekten, sondern Komponenten und vielleicht sogar einige Seiten, die Sie mit diesem Klassenformat erstellt haben. Vielen Dank Hoffnung, in der nächsten Klasse zu sehen.