UI/UX Design mit Figma : 5+ Real World Projekte(2022) | Chetan Pujari | Skillshare
Suchen

Playback-Geschwindigkeit


1.0x


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

UI/UX Design mit Figma : 5+ Real World Projekte(2022)

teacher avatar Chetan Pujari

Schau dir diesen Kurs und Tausende anderer Kurse an

Erhalte unbegrenzten Zugang zu allen Kursen
Lerne von Branchenführern, Ikonen und erfahrenen Experten
Wähle aus einer Vielzahl von Themen, wie Illustration, Design, Fotografie, Animation und mehr

Schau dir diesen Kurs und Tausende anderer Kurse an

Erhalte unbegrenzten Zugang zu allen Kursen
Lerne von Branchenführern, Ikonen und erfahrenen Experten
Wähle aus einer Vielzahl von Themen, wie Illustration, Design, Fotografie, Animation und mehr

Einheiten dieses Kurses

    • 1.

      Einführung (UI/UX-Design mit Figma)

      1:42

    • 2.

      Der Unterschied zwischen UX und UI

      5:33

    • 3.

      Einführung in Figma und Herunterladen und Installieren von Figma

      4:00

    • 4.

      Figma InterfaceDashboard

      5:21

    • 5.

      Figma-Dateien in Figma importieren

      4:14

    • 6.

      Tools in Figma

      9:30

    • 7.

      Figma-Ebenen-Bedienfeld

      2:26

    • 8.

      Figma-Komponenten

      5:40

    • 9.

      Registerkarte/Bedienfeld „Design“

      14:35

    • 10.

      Textwerkzeug und Schriftarten

      8:00

    • 11.

      Bilder in Figma

      4:35

    • 12.

      Boolesche Operationen in Figma

      2:25

    • 13.

      Ausrichtung und Verteilung Figma

      1:26

    • 14.

      Figma-Teambibliotheken

      1:57

    • 15.

      Das Code-Panel in Figma

      2:26

    • 16.

      Prototyping in Figma

      6:57

    • 17.

      Horizontales und vertikales Scrollen

      4:35

    • 18.

      Masken in Figma

      2:35

    • 19.

      Figma exportiert | . JPG . PNG . SVG . PDF | Projekt in .fig speichern

      3:09

    • 20.

      Mockup in Photoshop

      4:06

    • 21.

      Plugins in Figma

      3:44

    • 22.

      5 MUSSTE Plugins für Figma-Designer haben!

      6:52

    • 23.

      Was ist Wireframing?

      2:21

    • 24.

      Wireframing mit Figma

      7:28

    • 25.

      So erstellst du Wireframe in wireframe.cc

      5:54

    • 26.

      Teamaufbau und Erstellung eines Teamprojekts

      3:39

    • 27.

      In Echtzeit zusammenarbeiten(Teams)

      3:06

    • 28.

      Wireframing für LattoFatto

      17:14

    • 29.

      Markennamenseite für LattoFatto

      3:36

    • 30.

      Seite für LattoFatto anmelden

      10:12

    • 31.

      Registrierungsseite für LattoFatto

      3:30

    • 32.

      Menüseite für LattoFatto

      13:35

    • 33.

      Prototyping für Lattofatto

      8:20

    • 34.

      Wireframing für die OTT-Streaming-Plattform

      7:15

    • 35.

      OTT-Streaming-Plattform

      19:08

    • 36.

      Prototyping für eine OTT-Streaming-Plattform

      2:45

    • 37.

      Gestalte deine Musik-App

      0:59

    • 38.

      Musify-App-Benutzeroberfläche

      11:22

    • 39.

      Musify-App Prototyping

      2:13

    • 40.

      Wireframing für Social-Media-Webseite

      3:38

    • 41.

      Entwurf der Social-Media-Website

      22:36

    • 42.

      Projekt 5 (Teste deine UIUX-Kenntnisse)

      1:11

    • 43.

      Grid-Systeme im Web- und UI-Design

      3:29

    • 44.

      15 Dinge, die dein UI-Design verständlich machen!!

      8:03

    • 45.

      5 WEBSITES, DIE DU SEHEN MUSST! Webdesign-Inspiration

      6:10

    • 46.

      Über 50 kostenlose Tools und Ressourcen zur Erstellung von tollen Benutzeroberflächen

      5:03

  • --
  • Anfänger-Niveau
  • Fortgeschrittenes Niveau
  • Fortgeschrittenes Niveau
  • Jedes Niveau

Von der Community generiert

Das Niveau wird anhand der mehrheitlichen Meinung der Teilnehmer:innen bestimmt, die diesen Kurs bewertet haben. Bis das Feedback von mindestens 5 Teilnehmer:innen eingegangen ist, wird die Empfehlung der Kursleiter:innen angezeigt.

548

Teilnehmer:innen

1

Projekt

Über diesen Kurs

Figma ist eine führende Designsoftware, die Teams und Einzelpersonen hilft, Designs schneller und effizienter zu erstellen. Figma ist kostenlos und du kannst es direkt in deinem Webbrowser, auf dem Mac und unter Windows verwenden.

Der Kurs hat eine praktische Komponente, die dich Schritt für Schritt durch den Workflow eines professionellen App-Designers führt. Von Benutzerflussdiagrammen über Wireframing bis hin zu Mockups und Prototypen.

Die Kursteilnehmer:innen haben das Wissen, um schöne und liebenswerte Apps zu erstellen, die Menschen mit einem Lächeln auf den Gesichtern hinterlassen.

Der UI/UX-Design mit Figma ist ideal für Leute ohne Designerfahrung oder erfahrene Designer, die schnell mit dem Thema mobiles App-Design und Webdesign einarbeiten möchten. Wir werden die wichtigsten UI- und UX-Konzepte untersuchen, die für die Entwicklung von gut aussehenden und einfach zu bedienenden Apps wichtig sind, die von den Nutzern geliebt werden.

Die einzigen Apps, die gut funktionieren, sind diejenigen, die sowohl in Bezug auf die Benutzeroberfläche als auch auf die Benutzererfahrung gut gestaltet sind. Deshalb ist es so wichtig, die Designfähigkeiten zu erlernen, die deine App in der Masse hervorheben.

Dieser Kurs nutzt die neuesten Best Practices in Webdesign und Mobildesign sowie User Interface und User Experience Design (UI/UX) und konzentriert sich darauf, dich effizient von Null auf einen Punkt zu bringen, an dem du eingestellt oder freiberufliche Verträge gewinnen kannst. Wir verwenden gefragte Tools wie Figma, um dir einen vollständigen Workflow von Anfang bis Ende zu zeigen.

Triff deine:n Kursleiter:in

Teacher Profile Image

Chetan Pujari

Kursleiter:in

Chetan is the instructor of some of the highest-rated Video editing and technical courses online.

Having been a self-taught video editor and programmer, he understands that there is an overwhelming number of online courses, tutorials, and books that are overly verbose and inadequate at teaching proper skills. Most people feel paralyzed and don't know where to start when learning a complex subject matter, or even worse, most people don't have $1000+ to spend on video editing and programming institute. Any skills should be affordable and open to all. An education material should teach real-life skills that are current and they should not waste a student's valuable time.

He is now dedicating 100% of his time to teaching others valuable content creation and software ... Vollständiges Profil ansehen

Skills dieses Kurses

Adobe XD Design UX/UI-Design Prototyping
Level: All Levels

Kursbewertung

Erwartungen erfüllt?
    Voll und ganz!
  • 0%
  • Ja
  • 0%
  • Teils teils
  • 0%
  • Eher nicht
  • 0%

Warum lohnt sich eine Mitgliedschaft bei Skillshare?

Nimm an prämierten Skillshare Original-Kursen teil

Jeder Kurs setzt sich aus kurzen Einheiten und praktischen Übungsprojekten zusammen

Mit deiner Mitgliedschaft unterstützt du die Kursleiter:innen auf Skillshare

Lerne von überall aus

Ob auf dem Weg zur Arbeit, zur Uni oder im Flieger - streame oder lade Kurse herunter mit der Skillshare-App und lerne, wo auch immer du möchtest.

Transkripte

1. Einführung (UI/UX-Design mit Figma): Willkommen beim UI UX Design mit Figma. Dies ist eines der besten Tutorials der Welt. Limitiert als ich bin UI UX Designer, YouTuber, Freelancer, Content-Ersteller und Programmierer. Bis heute entweder gelehrt oder Tonnen Turin persönlich und online. Und ich freue mich sehr, Ihr Kursleiter zu sein. Als Student in diesem Kurs erhalten Sie Zugriff auf alle vier Stunden HD-Videoinhalte. Welcher Inhalt? Schritt-für-Schritt-Tutorials, interaktive Projekte, Übungen und Modus. Ich werde Sie Schritt für Schritt durch den gesamten Prozess während Sie mit mir diesen Kurs verfolgen. In diesem Kurs werden wir über Prinzipien und Grundlagen des grafischen Designs sprechen , bis hin zur Erstellung von Auszahlungsprodukten. Erfahren Sie mehr über UX, UI und Interaktion und Erstellung eines vollständigen Designprozesses, den Sie mit all Ihren zukünftigen Projekten und Kunden nutzen können. Wir werden alle modernen Werkzeuge und Weichteile von Top-Unternehmen lernen , um wie Figma zu liegen. Jetzt ist Design die wertvolle Fähigkeit , die nicht so einfach veraltet wird, wie die meisten technischen Fähigkeiten da draußen. Ich benutze Figma seit vier Jahren und ich weiß, dass jedes Häkchen und Tipps für diesen Kurs jeden Ausgang des Y, wenn X von Anfang an bis vorangehen, abdecken wird . Nachdem ich durch die Benutzeroberfläche gegangen bin, werde ich Sie Schritt für Schritt durch die Erstellung von PHI coolen realen Projekten führen , wie das Erstellen von Apps, Social-Media-Apps , für die Hörplattform, die Musikplayer-App. Und der letzte ist überrascht. Ich habe diesen Kurs für alle neuen Designer entworfen, egal ob Sie nur ein Anfänger in der Gestaltung von begeistertem Publikum und Design sind , ich möchte dieses neue Feld lernen, Martin. Warum warten wir immer noch darauf dieser Kurs alles hat, was Sie brauchen, um in Figma zu meistern. Treten Sie also der Klasse bei und fangen wir an zu entwerfen. 2. Der Unterschied zwischen UX und UI: Welche Art von wirklich strengem Willkommen zurück mit einem anderen Video. In diesem Video werden wir also erfahren , was ist das Y-Design, das UX-Design und was ist der Unterschied zwischen UI und UX? UI-Design und UX-Design sind zwei der am häufigsten verwirrten, widersprüchlichen Begriffe im Web- und App-Design und verständlicherweise sind sie in einem einzigen Begriff wie UI UX Design starr zusammengestellt . Und die Wunde aus dem Dienst dort scheint dasselbe zu beschreiben. Und es ist oft schwierig, das solide Ermessen der beiden, die zu weit in den Jargon abweichen , zu weit zu finden. Aber fürchten Sie sich nicht am Ende dieses Videos, Sie werden ein gutes Verständnis dafür haben, was sie unterscheiden und wie sie miteinander in Beziehung stehen. Also lasst uns eintauchen. Das erste, was wir besprechen möchten, ist, dass das Weiß im Urin ist, ich habe nicht für die Benutzeroberfläche gestanden. Die Benutzeroberfläche ist das grafische Layout einer Anwendung. Es besteht aus der Schaltfläche, die Benutzer auf den Text klicken, sie lesen das Bild, Schiebertext in Feld und dem Rest des Elements, den Sie in x verwandeln, den wir erhalten. Dies beinhaltet das Bildschirmlayout, Animation der Übergangsoberfläche und jede einzelne Mikro-Indirection, die alle entworfen werden. Dieser Job war der UI-Designer, entschied, wie die Anwendung aussehen wird. Sie müssen ein Farbschema wählen, aber dann die Breite der Linien und die für Texte verwendeten Schriftarten formen . Sie sind Designer erstellen das Aussehen und den Philip und Anwendungen, Benutzeroberfläche, UI-Design-Asset-Grafikdesigner. Sie sind gleichzeitig mit Ästhetik. Es liegt an ihnen, sicherzustellen, dass die Anwendungsschnittstellen visuell anregend sind und angemessen versucht sind, dem Zweck gerecht zu werden. Und sie müssen sicherstellen, dass jedes einzelne visuelle Element füllt, sowohl saure als auch Eingaben vereint. Das nächste ist also, was ist UX Design? Sie erweitern die Benutzererfahrung oder die Benutzererfahrung der App hängt davon ab, wie sie mit Ihnen interagieren. Es ist die erfahrene, glatte, Notaufnahme, Entität oder klobig oder verwirrend. Erzählen wir die App philologisch oder fühlt sie sich verwirrend an? Erfüllt die Interaktion mit Menschen sehr effizient, um die Aufgabe sie erreichen wollten? Oder fühlt es sich an wie ein Kampf? Die Benutzererfahrung hängt davon ab, wie einfach oder schwierig es ist, mit dem Benutzeroberflächenelement zu interagieren mit dem Benutzeroberflächenelement , das der UI-Designer erstellt hat. USD ist also ein weiteres, das auch mit der Anwendungsbenutzerschnittstelle übereinstimmt. Und deswegen werden die Leute verwirrt. Unser Unterschied zwischen den beiden. Aber während wir, wenn ich unsere Aufgabe erledigt habe, entscheiden wir, wie die Benutzeroberfläche aussehen wird. Enorme Schulden und sind verantwortlich für die Bestimmung der Funktionsweise der Benutzeroberfläche. Die bestimmte die Struktur der Schnittstelle und die Funktionalität, wie sie organisiert ist und wie alle Teile miteinander in Beziehung stehen. Kurz gesagt, sie gestalten, wie das Interface funktioniert. Wenn es gut und vollkommen nahtlos funktioniert, wird der Benutzer gute Erfahrungen haben. Aber wenn die Navigation kompliziert ist, dann erlebt ein lausiger Benutzer wahrscheinlich, dass US-Designer an unserem zweiten Szenario arbeiten. Es gibt auch bestimmte Homeodomain-Datenanalysen im UX-Design, Designer erstellen Wireframe-Rendering der Schnittstelle in Richtung und erhalten Benutzerfeedback. Sie werden dies in ihrem Design interagieren. Es ist wichtig für uns, ein ganzheitliches Verständnis der Pauser-Preppers zu haben ein ganzheitliches Verständnis der , um mit der Anwendung zu interagieren. Also wie sie zusammenarbeiten. Sie haben also entworfen, entscheiden, wie die Benutzeroberfläche funktioniert während der UI-Designer entscheidet, wie die Benutzeroberfläche aussieht. Dies ist ein sehr kollaborativer Prozess, und die beiden Designteams arbeiten tendenziell eng zusammen, da das UX-Team den Ablauf der App ausarbeitet. Wie alle Schaltflächen Sie nie durch Ihre Aufgabe bringen und wie die Schnittstelle effizient Bedürfnissen der Benutzer von Informationen entspricht. Das UI-Team arbeitet daran, wie all dieses Interface-Element auf dem Bildschirm angezeigt wird. Nehmen wir an, dass irgendwann im Entwurfsprozess entschieden wurde, dass zusätzliche Schaltflächen zum Bildschirm hinzugefügt oder gegeben werden müssen. Dies ändert die Art und Weise, wie die Schaltflächen organisiert werden müssen und möglicherweise ihre Form und Größe ändern müssen. Um das UX-Team bestimmt, wie Sie die Schaltfläche am besten auslegen können, während sich die UI-Teams summieren, sie sind so konzipiert, dass sie dem neuen Layout entsprechen. Die ständige Kommunikation und Zusammenarbeit zwischen der Benutzeroberfläche, UX entwirft eine Hilfe, um sicherzustellen, dass die endgültige Benutzeroberfläche so gut wie möglich aussieht. Während er auch effizient und intuitiv arbeitet. Es gibt einige Riskant, wie zum Beispiel die Erforschung von entscheidender Bedeutung für UI- und UX-Designer. Es ist wichtig, dass beide Disziplin so viele Informationen wie möglich sammeln , um sie bei der Erstellung eines angemessenen Designs zu unterstützen . Und beide folgen einem ähnlichen Ansatz. Was wird recherchieren, was der Benutzer will, was der Experte aus der Anwendung der Art von Entwicklung hat. Die Bürger sind oft interaktive Interface-Usability-Sitzung, bei der reale Benutzer mit einer skalierten Version bestimmter Funktionen oder dem strukturierten visuellen Design interagieren skalierten Version bestimmter Funktionen oder und bestimmen , ob das Design bewegt sich auf dem richtigen Weg nach unten. Denn die Tasche ist mit jeder Interaktion integriert. Dieser Prozess beinhaltet die Streuung von Prototypen mit niedriger Wiedergabetreue wie Wireframes und die Eingabe des Interface-Elements, um die Reaktion des Benutzers schnell auf die getestete Funktionalität zu messen . Dies kann auch visuelle Prototypen unterschiedlicher möglicher Herkunft des Aussehens fördern visuelle Prototypen unterschiedlicher möglicher Herkunft und die Schnittstelle ausfüllen, um festzustellen, welchen Benutzer bevorzugt. In allen Fällen hilft die Forschung dabei, den staatlichen Designer zu ticken, während sie ihren Beitrag aufbauen. Die Informationsschnittstelle und die UX-Schulden und R suchen, sind jedoch sehr unterschiedlich. Hier geht es also darum warum Designer UX den Unterschied zwischen ihnen entwerfen und bemerken. Und wir haben auch einige Forschungsschlüssel besprochen. Das war's also für das heutige Video. Und wir sehen uns bei der nächsten. 3. Einführung in Figma und Download und Install: Was auch immer es ist, wenn Sie jemals wieder darauf zurückkommen . In diesem Video erfahren wir mehr über Weber General Figma und auch, wie Sie Figma für Ihren PC herunterladen können. Wie Sie sehen können, habe ich die Figma-Browserversion geöffnet. Gehe einfach zu deinem Browser und tippe figma.com so ein. Und nachdem Sie die Eingabetaste geklickt haben, wird diese Seite geöffnet. Wie Sie sehen können, sieht der Raum wirklich cool aus. Es hat bereits eine Animation auf dieser Titelseite. Auch einige, ich denke, das sind die Wiederverwendung. Lasst uns eins nach dem anderen sehen. Oben haben wir dieses Logo. Danach haben wir ein Produkt. In Produkten haben wir Design, Prototyping, Designsystem und Downloads von hier aus, wir werden unsere Software herunterladen. Wir werden es auf meinen Brief herunterladen. Mal sehen, was im Unternehmen ist. Im Unternehmen Wir haben alle Ihre Kunden und wenden uns an den Vertrieb. Wenn Sie auf die Preisgestaltung klicken, gibt es drei Optionen. Wir werden die kostenlose Version verwenden. Und wenn Sie die Herkunftsbereitstellung oder alle NIOSH kaufen möchten , können Sie das tun, aber ich schlage Ihnen vor, die kostenlose Version zu verwenden. Nehmen wir an, die Registerkarte „Community“ in der Community, wir haben Vorlagen und Plugins eingereicht. Und wir haben auch einige Optionen wie Event und Livestream, Best Privacy Practices und Ernährungsprogramm und Benutzergruppen. Wir interessieren uns also für Datei und 10 Bits in einer Datei und Tenbrunsel, wir haben 1000 plus Vorlagen. Wir können es in unserem Projekt verwenden. Wir haben auch Plugins. Also zeige ich Ihnen, wie Sie Plugins in unserem Projekt in zukünftigen Videos verwenden können. In Gesellschaft denke ich, dass sie Blogs, Karriere, unsere Geschichte und das Hilfecenter hatten . Bei Bedarf können Sie sich von hier aus an wenden. Ich weiß, dass du neu hier bist. Klicken Sie also auf die Schaltfläche „Registrieren“ und Sie können Ihr Google-Konto verbinden. Und Sie können auch E-Mail und Passwort verwenden , um das Konto bei Figma zu erstellen. Ich schlage Ihnen jedoch vor, das Google-Konto zu verwenden , denn wenn Sie Ihre E-Mail und Ihr Passwort hinzufügen, müssen Sie sich an das Passwort erinnern. Wenn Sie sich also mit Ihrem Google-Konto verbinden, müssen Sie sich nicht an den Teil von Figma erinnern. Und wenn Sie auf die Schaltfläche „Registrieren“ klicken, wird Ihnen Ihr Google-Konto angezeigt und Sie können es eingeben und sich einfach damit verbinden. Also werde ich das nicht machen, weil ich bereits das Figma-Konto habe. Also sperre ich einfach mein Google-Konto, weil es wirklich einfach ist. Okay, das ist mein Konto. Nachdem Sie sich bei unserer Anmeldung bei Figma angemeldet haben, ist dies das Dashboard, das Sie sehen werden. In diesem Dashboard haben wir also einen Grund, Hundegemeinschaft und Ihr Projekt und Ihr Team, Ihr Profil. Und Sie können die Optionen auch von hier aus sehen. Also werden wir uns diese Dinge im nächsten Video ansehen. Also muss ich, ich glaube, ich hatte zwei Logos dir zu zeigen, wie man Figma herunterlädt. Gehen wir also ins Produkt und laden Sie es einfach herunter. Okay, nachdem Sie auf Download geklickt haben, erscheint diese Seite. Sie können sehen, dass Sie Figma für macOS oder Windows herunterladen können. Sie können Ihr Apple- oder Android-Gerät für die Vorschau verwenden. Und wir haben auch einen Torus gefunden, aber wir sind an Desktop-Apps interessiert. Also verwende ich derzeit Windows, also klicke ich auf Windows. Wenn Sie Mac verwenden, klicken Sie auf das macOS. Also habe ich schon optimal installiert, also muss ich es nicht noch einmal herunterladen. Sie müssen also einfach auf die Schaltfläche Speichern klicken. Es wird, es wird für dich dominieren. Das war's also für das heutige Video. Und ich werde dir im nächsten Video mehr Dinge zeigen. Also bleib dran darüber. Das bin ich abmelde. Danke fürs Zuschauen und wir sehen uns im nächsten. 4. Figma InterfaceDashboard: Willkommen zurück. In diesem Video werden wir unser Dashboard auf Figma lernen . Wenn Sie die Software installieren, können Sie sehen, dass die Schnittstelle so aussehen wird. Wenn du dich bei Figma einloggst, sind wir auf Reisen. Und dann ist auch die Schnittstelle gleich. Nach der Installation, wenn Sie sich bei Figma anmelden , sehen die Schnittstellen so aus. Jetzt sind wir in letzter Zeit, in jüngster EP, haben wir einige Dateien von figma, Prototyping in Figma von Fettleibigkeit Wireframing und einige Farben. Sie können für Ihr Team wählen. Aber du arbeitest für dich selbst, dann musst du kein Team gründen. Wie Sie sehen können, habe ich ein Projekt erstellt. In diesem Projekt geht es um Webdesign. Die nächste Option sind also Entwürfe, Interrupts. Wir haben keine Projektdateien. Wenn Sie es einfach sagen, klicken wir auf dieses Projekt. Und wenn Sie diese Datei in ein Projekt verschieben möchten , können Sie das tun. Okay, das Projekt ist jetzt geöffnet. Was müssen Sie also tun, ist einfach auf diese Schaltfläche mit dem Pfeil nach unten zu klicken und dieses Menü erscheint. Und von hier aus können Sie diese Datei ins Projekt verschieben. Und Sie können Ihr Projekt auch von hier aus durchsuchen. Oder wenn Sie ein neues Projekt erstellen möchten, klicken Sie auch auf Neues Projekt und MOOC. Es zeigt also, dass Ihr Projekt verschoben wird. Das ist jetzt eine Projektdatei. Wenn wir jetzt nach Home gehen und Sie sehen können, dass die Datei jetzt nicht in D fällt. Die Datei befindet sich im ersten Projekt. Du siehst hier. Die nächste Option ist also die Community. Community ist eines der größten Merkmale von Figma. Von hier aus können Sie Plug-Ins, festes Juwel, Designsystem, Wireframes, Illustration, Icon und vieles mehr herunterladen Designsystem, Wireframes, Illustration, . Wie Sie sehen können, haben wir bereits Vorlagen erstellt. Sie können diese Vorlagen in unserem Projekt verwenden. Nehmen wir das also. So können Sie diese Webseite sehen. Dies ist also die Webseite für die E-Learning-Plattform. Und wenn Sie mehr über diese Webseite erfahren möchten , können Sie darauf klicken. Und es wird dir noch ein paar Dinge zeigen, unsere Webseite. Und du kannst auch wissen, wer der Schöpfer ist. Opioide können ihnen auch von hier aus folgen. Wenn du ankommen willst, kannst du das auch von hier aus machen. Also im Moment werden wir es durchsickern. Und wir können es auch von hier aus mögen und klicken Sie einfach darauf, um Rechtsstreitigkeiten zu führen. Nach dem Duplizieren der Datei können Sie sehen, dass das Projekt in den Entwürfen geöffnet ist. Wenn Sie dieses Projekt jedoch in Ihr Projekt verschieben möchten, klicken Sie einfach auf MOOC-Projekt und wählen Sie Ihr Projekt aus. Als ob ich hier kein Projekt erstellt habe, aber wenn ich auf Standard klicke, wird es in das erste Projekt übergehen, wenn du willst. Sie können diese Seite auch lesen, aber im Moment werden wir unsere Sachen lernen. Also schließe ich diesen Tab. Also lasst uns wieder nach Hause gehen. Wenn Sie also neu hier sind und ein neues Projekt erstellen möchten, gehen Sie zum ersten Projekt, klicken Sie auf diese Plus-Button und klicken Sie einfach auf die Designdatei. Sagen wir sogar, es ist ohne Titel, aber wenn wir es umbenennen möchten, können Sie es auch von hier aus umbenennen. Sagen wir, es ist eine App. Also werde ich es tun, ich tippe Enter. Also lasst uns den Rahmen löschen und einfach jemanden wie das iPhone auswählen. Und wir können Elemente von dir hinzufügen, wie eine Zeile. Oder wenn Sie eine andere Form wie ein Dreieck oder ein Ellipsenpolygon hinzufügen möchten. Okay, du kannst alle Arten von Tokio machen, aber schauen wir uns das Interface an. Und du kannst das Pelagische sehen, das du geschaffen hast. Es ist, es ist in der Tat keine Tropfen. Und wenn Sie diese Datei löschen möchten, einfach mit der rechten Maustaste darauf und löschen Sie sie einfach. Und wenn Sie mit Ihrem Team zusammenarbeiten, klicken Sie einfach auf Neues Team und den Teamnamen erstellen und einfach auf Team erstellen klicken. Aber derzeit arbeiten wir nur solo, also werden wir kein neues Team gründen. Schließen wir diese Seite. Es gibt also mehr Optionen wie es diese Benachrichtigungsschaltfläche gibt. Sie erhalten hier eine Benachrichtigung. Und das ist das Profil. Von hier aus können Sie auf wie Plugins zugreifen. Momentan habe ich dieses Foto-Plug-In in Schwung gebracht. Und wenn du willst und wenn ich es deinstallieren möchte, kann ich einfach auf diesen Button klicken und er wird sich für mich entfalten. Und Sie können auch so viele Beschwerden von der Community herunterladen . Und in der Community habe ich meinen Namen, Molaritätsprofil Beecher Stowe, in meinem eigenen Stil. Also habe ich sofort denselben Namen. Bibliotheken und Verbindungs-Apps und all das. Wenn Sie weitere hinzufügen möchten, um sie zu begleiten, können Sie diese auch von Ihnen hinzufügen. Und wenn Sie sich nach Abschluss eines Projekts abmelden möchten , können Sie sich auch hier anmelden. Und ich denke, in diesem Anzug dreht sich alles um das Figma-Dashboard oder das Interface. Im nächsten Video werden wir also etwas über Figma-Tools und vieles mehr erfahren. Also danke fürs Anschauen dieses Videos und ich sehe euch im nächsten. 5. Figma in Figma importieren: Willkommen zurück. In diesem Video erfahren wir, wie man Dateien wie Figma-Dateien, Skizzierdateien und Vorlagen importiert . Wie Sie sehen können, habe ich dieses Team. Lasst uns darauf eingehen. Und ich habe ein paar Akten drin. Also gehe ich nicht zu Newton, also werde ich das für den Import tun, gut. Gehe zu Neu. Und Sie können sehen, dass wir den Import-Button haben, also klicken Sie darauf. Und ich habe ein Figma-Projekt. Und Sie können sehen, dass die Erweiterung gefüllt ist. Also klicke darauf und klicke auf „Öffnen“. Es wird also einige Zeit dauern. Unsere letzten Leads in der Grenze erfolgreich gemacht. Also wenn ich ins Projekt gehe. Sie können also sehen, dass dieses Projekt jetzt geöffnet ist, also kann ich Änderungen vornehmen, wenn ich möchte. Und auf Seite 1 haben wir vier Frames. Und für zwei Frames sind Webseiten und diese beiden Frames für die App. Und das ist auch eine Webseite. Wenn Sie einige Änderungen vornehmen möchten, können Sie es auch von hier aus vornehmen. So importiert man ein Projekt aus einer lokalen Datei. Nehmen wir an, wenn Sie wie unsere Vorlagen herunterladen möchten, damit Sie einfach in Google tippen können , laden Sie Figma-Vorlagen herunter. Also fand ich diese Website sehr hilfreich, figma.com. Auf dieser Website haben wir also viele Projekte. Sie können also einfach darauf klicken und es aus der Ansicht herunterladen. Und die nächste Schrittgröße ist wie, sagen wir, das ist die Figma template.com. In diesem Bild hatten wir wie viele Vorlagen und alle diese Vorlagen sind kostenlos zu tun, damit wir behalten können, Sie können Änderungen vornehmen. Und Sie können sich auch von diesem Projekt inspirieren lassen , wenn Sie keine Ahnung haben, wie Sie Ihr nächstes Projekt erstellen können. Also habe ich dieses Projekt von dir heruntergeladen. Nehmen wir an, wenn Sie eine Skizzendatei importieren möchten, können Sie das auch tun. Und für Ressourcen für diese Skizzendatei können Sie diese Website namens Sketchfab dot verwenden, heißt es. Auf dieser Website haben wir also eine große Soap-Ressourcen wie kostenlose Vorlagen und Sie können Wireframe sagen. Ich behalte auch für das Android Icon und all das. Also laden sie dieses herunter. Und du hast schon in der Datei gearbeitet, ich habe diese schon heruntergeladen. Du kannst dich also sehen. Also höre ich nicht nur zu. Und Sie können diese Übungsdatei sehen wir heruntergeladen und extrahiert haben. Klicke drauf. Sie können die Skizzendatei sehen. Gehe zu Figma, klicke auf Neu und importiere. Derzeit also das gleiche DEM-Dateilimit wie g. Also muss ich etwas tun. Also will ich das hier machen. Klicken Sie erneut auf Neuer Import. Und das ist eine Skizzendatei. Und klicke auf „Öffnen“. Unsere Datei importiert also. Sie können den Namen sehen und die Datei wurde erfolgreich importiert. Fertig. Also klick drauf. Nachdem Sie eine Datei angeboten haben, sehen Sie sogar, dass die App so aussieht. Also sagen wir mir nur, dass fallende Telefone nicht verfügbar sind damit wir sie durch andere Formulare ersetzen können. Es gibt also ein Problem mit der Sketch-Datei, also müssen wir diese Formulare verdienen. Schon wieder. Lass uns nach Hause gehen und das holen , weil ich dir etwas zeigen muss. Und gerade als ich diese einzige vollständige Bestellung, eine große Benutzeroberfläche, erstellt habe, möchte ich dieses Projekt so verschieben, dass es meinem neuen Projekt gefällt. Sie können also sehen, dass wir Optionen wie mehrere haben. Wenn ich also auf diese und in V8-Optionen wie Entwürfe klicke, ist das mein Team. Und wenn Sie ein neues Team erstellen möchten, können Sie es auch von hier aus tun. Momentan möchte ich einziehen. Ich gehe zu imaginären Programmen Team. Also klicke ich auf dieses und bewege mich, ich denke, es ist Mono 2 erstes Projekt. Und wir können sehen, dass unser Projekt 0 ist. So können Sie also aus einer Datei importieren, eine Datei skizzieren und diese Vorlagen herunterladen. Das ist also wichtig. wir sehen uns im nächsten. 6. Tools in Figma: Wir sind also sehr streng. Wir kommen noch ein Video darauf zurück. In diesem Video werden wir mehr über Tools lernen. Lassen Sie uns ein neues Projekt erstellen. Klicken wir auf Neu und Sie können die Optionen wie Designdatei, Figma, Sprungdatei, Import und Durchsuchen von Vorlagen sehen . Sie können von hier aus sehen, dass Sie Templer wie für iPhone 11 Pro Max wählen können, oder Sie können wie ein anderes Smartphone wählen. Oder wenn wir unsere Webseite erstellen möchten, können Sie auch einen Desktop auswählen oder Sie können auch 16 Jahre bis neun Folien wählen. Und wenn Sie möchten, können Sie hier auch diese vorgefertigten Vorlagen auswählen . Wir haben auch die Präsentation des Designsystems und des Drahtgitters erhalten . Und wenn Sie auf die CMO-Community klicken, werden Sie in den Community-Bereich weitergeleitet. Und es hat auch eine Fig Manager-Vorlagen. Derzeit ist es eine Beta-Version. Wir sind also an der Leerstelle interessiert. Und Sie können hier sehen, dass es sich derzeit imaginäre Programmierteams und erstes Projekt handelt. Und Sie können sehen, dass es das erste Projekt ist. Also brauchen wir einen leeren Bildschirm. Also gehe ich mit der Designdatei. Nach dem Erstellen einer neuen Datei wird die Schnittstelle so aussehen. Und wenn Sie es umbenennen möchten, klicken Sie einfach auf dieses Dropdown-Menü und Sie können es einfach von hier aus umbenennen. Sie können auch zum Projekt wechseln, löschen, schmieren und exportieren, und Sie können auch die Ursprungszeichenfolge anzeigen. Im Moment benenne ich es einfach um. Benennen wir es in Tools um. Und wie Sie sehen können, gibt es auf der linken Seite ein Figma-Logos. Und wenn ich auf dieses Meno klicke, sehen Sie die Optionen. Von dieser Schnellabschnittsoption aus können Sie alles suchen, wie ich nach einem Polygon suchen möchte . Ich kann es direkt benutzen. Und du kannst das Polygon einfach so zeichnen. Vogel. Schauen wir uns die weiteren Optionen an. Und von hier aus können Sie auch zu Dateibearbeitung, Ansicht, Objektvektor Ahrens-Plugins gehen . Derzeit habe ich das einzige Plug-In installiert , das Fotos ist. Und Sie können, wir können auch hinzufügen, dass es mehr Optionen wie Integrations- und Leistungsbibliotheken gibt. Und Sie können auch das Haarnadelkonto für die Verwendung der Webversion von Figma sehen für die Verwendung der Webversion von Figma dann könnte die Option anders sein. Nicht alle Optionen, einige Optionen wie in diesem Abschnitt erhalten Sie Desktop-App. Okay? Okay, das ist der Schritt. Von hier aus. Sie können Ihre Vektoren, Objekte, Bilder und all das verschieben . Und es gibt auch Skalierungsoptionen. Okay, der nächste ist Frame. Wie Sie aus der Verknüpfung sehen können, ist F. Wenn Sie auf der Tastatur F drücken, gibt es einige Vorlagen wie Telefon, Tablet, Desktop, Präsentation, soziale Medien von Personen und Figma-Community. Wenn Sie jedoch wie webbasiert erstellen möchten, können Sie diese Optionen wie Desktop, MacBook, MacBook Pro und iMac auswählen. Die meiste Zeit wähle ich MacBook Pro. Also lasst uns drauf klicken. Dann ist die Vorlage auf dem Bildschirm und Frame wir haben auch eine Slice-Option. Ich denke, das Slice-Tool wird nicht so oft benutzt, also überspringe ich das. Okay, im nächsten Abschnitt haben wir Formen wie ein Rechteck, Linienpfeile, Ellipse, Polygon, Stern. Und wenn Sie ein Bild von Ihren lokalen Medien platzieren möchten , können Sie dies auch tun. Und lasst uns ein Rechteck wählen. Sie können es einfach auf den Rahmen ziehen. Und Sie können sehen, dass in diesem Rechteck hier erstellt wird. Aber wenn Sie das Quadrat zeichnen möchten, das perfekte Quadrat, müssen Sie die Umschalttaste auf der Tastatur so halten. Und Sie können sehen, dass das Quadrat gezeichnet wird, der Rahmen so gezeichnet wird. Aber wenn ich meinen Finger vom Schiff entferne, kannst du sehen, dass sich die Form jetzt verändert hat. Und es ist mit all den Formen passiert. Als ob ich einen Kreis erstellen möchte. Dann siehst du, dass ich die Ellipse auswähle und das ziehe. Und ich sterbe den Kreis auf dem Bildschirm, aber es ist nicht die Umfragen sind das ol. Also möchte ich den Kreis erstellen. Also halte ich die Umschalttaste auf der Tastatur gedrückt. Wie Sie sehen können, ist es jetzt ein Kreis wie dieser. Und hier ist wie ein echt cooler Baum. Man sieht, dass es vier Punkte auf der Ostseite gibt. Und wenn ich es hineinziehe, kannst du einen Kreis wie diesen erstellen. Und wenn ich ein Symbol erstellen möchte, können Sie diese Option verwenden, um schärfere Kanten in eine abgerundete Ecke zu bringen. Ich denke, ich zeige Ihnen bereits im vorherigen Video, wie man diese Dinge benutzt, aber ich denke, ich zeige Ihnen nicht, wie man den Gegenstand Likud macht. Wenn Sie diesen Kreis duplizieren würden, klicken Sie einfach darauf und halten Sie Alt auf Ihrer Tastatur gedrückt und ziehen Sie ihn einfach. Wann immer du willst und lass es. Und Sie können es auch in eine andere Form verwandeln, die bereits gefunden wurde, um diesen Kreis klein zu machen. Sie können einfach die Umschalttaste gedrückt halten und so nach unten ziehen. Machen Sie es hier kleiner und weniger Platten explizit. Es könnte unser Logo sein, so. Okay, Die nächste Option ist Spin von Schmerz. Sie können Formen und zufällige Formen wie diese erstellen. Daraus können wir auch Räder machen. Sagen wir so. Wie mach dich zusammen. So. Sie können sehen, ob Sie möchten, Sie können auch eine Farbe hinzufügen. Klicken Sie einfach auf die Schaltfläche Ausfüllen und diesen Plus-Button. Und du kannst sehen und die Farbe, und die Farbe ist grau. Und wenn Sie einige Änderungen vornehmen möchten , können Sie wählen, oder Sie können einfach V auf Ihrer Tastatur drücken und einfach mit diesem roten Punkt fortfahren. Du kannst es einfach so ziehen. Die Form wird sich ändern. So. Wenn Sie diese graue Farbe in eine andere Farbe ändern möchten, müssen Sie einfach dieses Symbol drücken und es einfach in diesen Farbbereich ziehen. Sie können auch den Farbverlauf verwenden, wenn Sie möchten. Sie können die Farbänderung jetzt auf dem Rahmen sehen, so. Okay, Die nächste Option ist Bleistift. Von hier aus kannst du einfach so zeichnen. Und die nächste Option ist Text. Fügen wir so etwas Text auf dem Bildschirm hinzu. Alles wie Zufall. Die Größe der Schrift ist sehr klein. Wenn wir es also vergrößern möchten, wählen Sie einfach die Schriftart mit Control a aus. Und Sie können zu diesem Textabschnitt gehen und die Schriftgröße in P2 ändern. Ich halte dich auf 48 Jahren. So können wir sehen, dass die Schriftgrößen jetzt gestiegen sind. Und Sie können den Schriftartyp auch so ändern. Meine Lieblingsschrift ist Videorekorder. Also werde ich mich für dieses entscheiden. Und du kannst die Schriftart so sehen. Wenn du willst. Sie können auch Striche, Effekte und all das hinzufügen . Und das nächste Werkzeug ist Handwerkzeug. Nehmen wir an, wenn Sie mehr als einen Frame haben, lassen Sie uns diesen Frame duplizieren. Drücken Sie Alt und bewegen Sie es so. Und derzeit, wenn Sie wie der erste Frame arbeiten und einen Frame in ein anderes verschieben möchten. Sie können diesen Schieberegler verwenden, um zu einem anderen Frame zu wechseln. Aber das ist es nicht. Aber wenn Sie viel Rahmen haben, wie drei oder vier Rahmen, können wir einfach Hand benutzen. Und die Abkürzung für das Handwerkzeug ist Kante. Und du kannst sehen, dass die Hand am Rahmen ist. Und ja, du kannst es einfach so ziehen. Zweiter Rahmen. Der erste Frame. Und das nächste Tool ist Befehl. Angenommen, Sie arbeiten an dem Projekt und auf Ihre eigene Weise empfehle ich auf dem Rahmen wie das Logo. Du kannst mir also sagen, was dir gefällt. Dies ist die Änderung. So. Okay. Ich habe viele Rechtschreibfehler gemacht. Dann mussten Sie sich damit beschäftigen, dass dies das Logo ist , damit wir keine Änderungen vornehmen müssen. Sie sind also ein anderer Partner oder ein Teamkollege kann auf diese Nachricht antworten, okay? Und klicke einfach auf die Antwort. Okay? Aber du kannst sehen, wenn ich ins Move Tool gehe, dann wird es unsichtbar sein. Aber wenn ich noch einmal auf einen Kommentar gehe, ist es jetzt sichtbar. Und wieder können Sie sehen, dass sich das Logo nicht ändern kann. Und Ihr Teamkollege, Sir. Okay. Das sind alle Tools in der Figma, mit denen Sie jedes Projekt wie dieses machen können jedes Projekt wie dieses wäre Mary mag wirklich seltsames Projekt auf dem Bildschirm. Das war's also für heute. wir sehen uns im nächsten. 7. Figma: Willkommen, willkommen, willkommen. Und hier erfahren Sie, wie Sie Ebenen, Seiten und Komponenten erstellen können. Dies ist also ein Projekt aus dem vorherigen Video. Wie Sie sehen können, haben wir zwei Listen, die MacBook Pro sind, um mein MacBook Pro V1 zu beenden. Und darin hat es wie Vektoren, Ellipsen, Kreise und alles führt zum Text. Und wenn wir eine neue Seite erstellen möchten, eine leere Seite, klicke ich einfach auf diesen Plus-Button. Und wenn Sie es umbenennen möchten, können Sie es einfach umbenennen, was Sie wollen. Im Moment wähle ich Paare aus, um die Eingabetaste zu drücken. Und Sie können sehen, dass der Raum jetzt komplett leer ist. Aber wenn ich diesen Frame möchte, gehe von Seite 1 auf Seite 2 oder ich möchte einfach nur kopieren. Sie können einfach Strg C drücken und einfach zu Seite zwei gehen und die Strg V drücken Und Sie können unseren Frame von Seite eins sehen. Es ist jetzt in Frame und wir kopieren es einfach in einem Frame. Nehmen wir an, wenn Sie alle Dinge von Seite 1 auf Seite kopieren möchten , um zur ersten Seite zu gehen und alle schlanken Freunde auszuwählen , indem Sie Control oder Command D auf dem Mac verwenden. Und Steuere C zum Kopieren. Gehe nun zu Seite zwei und drücke Strg V. Und du kannst alle Dinge von Seite eins sehen. Es ist jetzt auf Seite zwei. Es sind also unsere D-Seiten. Und Sie können sehen, dass dies die Liste ist, das MacBook Pro 21. Das sind also die Schichten. Und sagen wir, ich habe diesen Kreis, aber es ist Logo, und ich möchte ihn immer wieder verwenden. Ich kann dieses Logo in Komponenten wie wählen Sie diesen Kreis aus, gehen Sie zur DOE-Abteilung. Und du siehst dieses mittlere Icon. Das heißt, erstellen Sie eine Komponente und die Verknüpfung ist Alt steuern, und klicken Sie darauf. Und wenn wir auf Assets eingehen, können Sie das MacBook Pro V1 sehen und die Komponente ist Ellipse-Tool wie dieses. Und wenn wir das benutzen wollen und ziehen Sie es einfach so auf den Bildschirm. Und wir möchten Ihnen helfen, wenn Sie mit vielen Freunden zusammenarbeiten . Alles große Projekt. Das sind also alles über Ebenen, Seiten und SSRS. Das ist also dein Foto. Und wir sehen uns bei der nächsten. 8. Figma: Nun, also muss es wirklich ein Willkommen zu einem anderen Video sein . In diesem Video werden wir etwas über Komponenten lernen. In früheren Videos erfahren wir, wie man Komponenten erstellt und wie man sie benutzt. Aber in diesem Video werden wir mehr über Komponenten erfahren, z. B. welche Dinge Sie mit den Komponenten machen können. Angenommen, Sie entwerfen eine App, die Hub-Browser-App. Und du hast mehrere Seiten wie diese. Und du hast solche Icons. Und Sie müssen diese Icons auf dieser Bootsoberseite verwenden. Nehmen wir an, ich möchte dieses YouTube-Symbol hinzufügen. Also wähle ich es einfach aus. Und lasst uns diesen Rahmen verschieben. Wie ich schon sagte, die meisten dieser Icons. Und wir wollen diese Semikolons auch auf der nächsten Seite. Dies dupliziert mit Warnung auf dem Mac, es ist die Wahltaste, wie folgt. Aber ich möchte die Farbe dieses Symbols wie das YouTube-Symbol ändern . Also werde ich in die Füllung gehen und es in Handel umwandeln. Okay? Die Farben ändern sich. Jetzt. Man kann die echte Farbe sehen. Aber gleichzeitig möchte ich auch die Geschlechterfarbe dieses Symbols mögen, aber ich muss es noch einmal machen. In diesem Fall werden uns die Komponenten also helfen. Lasst uns diesen Hype am Sonntag verschieben. Dieses Leerzeichen ist auch dieses. Und wähle das Icon aus. Und ich habe früher darauf angespielt, wie man eine Komponente erstellt. Gehen Sie also auf den oberen Balken Amino, wählen Sie diesen Diamant-Button und klicken Sie darauf. Und du hast jetzt eine Komponente. Woher wissen Sie, dass dies eine Komponente ist oder nicht? Wenn Sie also darauf zoomen, können Sie das kleine Diamantsymbol auf sich sehen. Und es gibt auch eine Komponente. Und dies wird auch als Nach-Komponente oder Musterkomponente bezeichnet . Wenn wir also auf Asset Pentland gehen und Sie unser YouTube-Logo sehen können , ist es jetzt Bestandteil. Sie können es einfach so ziehen und es sehr gut funktionieren lassen. Du willst so. Machen wir dieses Instagram also auch zu einer Komponente und diesem PayPal-Symbol. Dies ist also auch der Component Plus-Button. Das sind also die Komponenten. Jetzt können wir es einfach so ziehen und dort platzieren, wo immer Sie wollen, so. Was ich tun möchte, ist, dass dieses Symbol auch im nächsten Frame angezeigt wird . Drücken Sie Alt und ziehen Sie es auf das nächste Frame wie folgt. Dies ist die Master-Komponente und dies sind die untergeordnete Komponente. Und was ich tun möchte, ist, dass ich die Farbe von diesem und diesem ändern möchte . Was ich also tun werde, ist, dass ich klicke, ich werde diese Master-Komponente auswählen und wir gehen zum Design-Panel und klicken auf diese Auswahlfarbe. Also momentan diese schwarze Farbe und ich möchte ändern, wirst du gerne lesen. Also ziehe ich es einfach auf die Belastung des Roten. Und Sie können sehen, dass die Master-Komponente und auch die Farbe der untergeordneten Komponente auch im Rahmen eines und auch auf anderen geändert wird . Aus diesem Grund müssen Sie die Farbe an den verschiedenen Frames nicht immer wieder ändern . Machen wir das Navigationsfeld. Und wir können einfach alle Elemente hinzufügen. Und wir werden dieses Navigationsfeld in Komponenten erstellen , damit wir es nicht immer wieder auf das zweite Stiftfeld ziehen müssen . Erstellen wir also ein Navigationsfeld. Lass uns ein Rechteck wählen. Sie drücken R für die Verknüpfung um ein einfaches Navigationsfeld wie dieses zu erstellen. Also haben wir diese Navigationsleiste erstellt. So können Sie im späteren Abschnitt im ersten Frame, iPhone 11 Pro Max, sehen , das Rechteck oben befindet. Also v will, wenn v, wenn ich dieses YouTube, YouTube-Symbol auf ausgeschlossen ziehe , dann wird es nicht angezeigt. Du kannst es sehen. Also wenn ich dieses Rechteck nach unten verschiebe, so am Ende des Rahmens. Und wenn ich dieses YouTube-Symbol erneut im Navigationsbereich ziehe , können Sie sehen, dass das Logo jetzt sichtbar ist. Ziehen wir dieses Symbol also nacheinander. Okay, das Navigationsfeld ist Schöpfer. Wählen wir dies aus und Sie können auf die Schaltfläche Komponente drücken, um eine Komponente zu erstellen. Jetzt ist dies eine Komponente und Sie können die Komponente im Asset-Panel innerhalb des iPhone 11 Pro Max 1 sehen . Sagen wir, wenn ich das außerhalb dieses Rahmens verschiebe. Es ist also keine universelle Komponente. Und du kannst es einfach so auf den Rahmen ziehen. Okay? Diese Komponenten und diese Komponenten sind also völlig unterschiedlich. Wir haben dies dann im Navigationsbereich gemacht , nachdem wir eine Komponente erstellt hatten. Das sind also die anderen. Wenn ich diese lösche, können Sie sehen, dass die Master-Komponente aus dem Asset-Bedienfeld jetzt nicht gelöscht wird, aber nicht aus diesem Navigationsbereich. Also diese Art von Sachen können Sie mit einer Komponente machen. Das ist also 24. Und wir sehen uns im nächsten. 9. Design: Willkommen zurück. In diesem Video lernen wir unsere wichtigste Strafe kennen, die Panel entworfen wurde. Lasst uns dieses Projekt öffnen. Wenn ich also auf dieses obere klicke, kannst du das Design-Panel sehen und du kannst die X- und Y-Position sehen. Wir sind müde Blickwinkel. Und wenn Sie die Kolonisten rund machen wollen, können Sie sie von hier aus nicht ausgeben. Wenn Sie ein automatisches Layout hinzufügen möchten, tun Sie das von hier aus. Aber wenn ich darauf klicke, kannst du sehen, ob es durcheinander ist. Also mache ich das nicht. Drücken Sie also Strg Z, um Dinge rückgängig zu machen. Okay, es ist jetzt normal. Und wenn ich eine Spalte hinzufügen möchte, kannst du es von hier aus tun. Derzeit ist es Zutat. Wählen wir also die Farbe und Sie können festlegen, wie viel Spalte Sie möchten, wie derzeit, fünf. Vor allem in der Industrie verwendeten sie scheitern. Also werden wir uns daran halten. Sie können also sehen, dass wir diese Texte so gemäß diesen Spalten anpassen können . Es wird also besser aussehen. Ok. Und wir haben Optionen wie Layer, siliziumfarbener Strich, Effekte und Export. Also lasst uns eins nach dem anderen schauen. Also lasst uns das entfernen. Okay? Wenn ich also auf dieses Logo klicke, siehst du die X- und Y-Position. Wenn ich also wie ein Junge will , kann ich von hier aus generieren, wie es derzeit 100 Ohm sind, also kann ich es gut machen, es ist wie ein 100. Sie können also sehen, dass es jetzt J ist. Und wenn Sie möchten, können Sie dies manuell so verschieben. Sie können auch die Breite und Höhe ändern. Wie derzeit ist das Opiat wie 1906. Und Sie können sehen dass es irgendwie das Wort Distrikt ist. Und lasst uns die Hydrolyse verfolgen. Wir können also sehen, dass es wirklich komisch aussieht. Mach es normal. Okay. Aus dieser Option können wir also Proportionen beschränken. Sagen wir also, wenn ich das in 200 ändere, wird es automatisch nur EPR in die Höhe bringen. Schauen wir uns ein anderes Beispiel an. Sagen wir, ich mache es, ich schaffe es bis zu 250. So können Sie die Spannungsänderung je nach Höhe sehen. Also mache ich es normal. Wenn Sie also den Winkel dieses Logos ändern möchten, können Sie dies von hier aus tun. Sagen wir 45. Du kannst jetzt baumelnde Kette sehen. Wenn ich also mein Bestes in Richtung Logo bewege und du meinen Cursor sehen kannst, änderst du dich. Also kann ich mich einfach wie manuell bewegen. Oder du gehst einfach hierher und tippst 0 ein. Und wenn du es gerne machen willst, ist es ein, es ist schon rund, also werde ich das nicht machen. Nehmen wir an, wenn Sie ein Quadrat wie dieses haben ein Quadrat wie dieses und die scharfen Ecken wie rund umwandeln möchten. Von hier aus kannst du das also ermöglichen. Sagen wir, lassen Sie uns Wert geben. Und Sie können sehen, dass scharfe Ecken in die Stadt wechseln. Von Constraint aus können wir unsere Logos und Navigationsschaltflächen beginnen . Zum Beispiel, wenn ich auf mein Logo klicke und gehe zu Constraint. Einschränkungen. Okay? Derzeit ist es also nicht links und oben. Wenn ich also wie ein Recht und Morton werde und wenn ich mich entscheide, sagen wir diesen Rahmen, können Sie das Logo sehen, es ist aus diesem Rahmen herausgezogen. Was ich tun möchte, ist, dass wenn ich die Größe dieser Phase ändere, das Logo hier bleiben muss. Also möchte ich dieses Logo an dieser Position anheften. Was ich also tun werde, ist, dass ich zur Intervention und Position 4 gehe , das ist gelebt und es muss auf Buch sein. Also sagen wir, wenn ich diesen Frame noch einmal auswähle, habe es entschieden, kannst du sehen, dass er sich jetzt dreht. Und Sie können das Gleiche mit diesem Heimkontakt machen. Sagen wir, ich möchte einen Heimkontakt anheften aber ich möchte es gleichzeitig machen. Nicht immer wieder. Also was ich will, also werde ich tun dass ich auf Home klicke und die Umschalttaste halte, auf Kontakt klicke und auf unsere eigene klicke. Dieser Heimkontakt über ist also ausgewählt. Also möchte ich an dieser Position anheften. Also gehe ich auf Einschränkungen ein. Und derzeit ist es nicht die richtige Seite, also werde ich mich für klug entscheiden und Polizeiarbeit sollte gelehrt werden. Und wenn ich auf diesen Rahmen klicke und die Größe weniger ändere. Du kannst also sehen, dass es so war. So kannst du das Gewissen benutzen. Das nächste Ding sind also Schichten. Daraus kannst du also verschiedene Mischmodi wie Dolch Modibo, Schlüsselbein wählen. Also garantiere ich, dass ich den Platz ausgewählt habe. Nehmen wir an, ich möchte es ändern, um zu multiplizieren. Also klicke ich auf Multiplikation. So können Sie den Effekt sehen. Es ist transparent geworden. Und es hat auch die Farbe Grau. Wenn Sie also die Farbe ändern möchten, können Sie sie auch von hier aus ändern. Aber momentan lasse ich es so wie es ist. Mein Favorit ist also dieser Ausschluss. Du kannst die Magie sehen. Das wird also ein Negativfilm. Im Moment multiplizieren wir uns einfach. Wenn Sie andere Optionen wie das Ausweichen von Großbildschirmen verwenden möchten , können Sie es verwenden. Spiel einfach damit. Okay? Wenn Sie möchten, können Sie auch die Fettleibigkeit im Netz verringern oder erhöhen. Derzeit sind es also 100 Prozent, also gehe ich bis zu 60 Grad. Sie können also sehen, dass es zu einer gebildeten Transplantation geworden ist. Zu mieten. Sie können einfach auf diesen Button klicken. Es wird automatisch. Machen wir es also normal auf 100 Prozent wie dieses. Also lasst uns die Farbe ändern. Sie können sehen, wir können die Farbe so ändern. Also lasst uns dieses wählen. Okay? Von hier aus können Sie also auch, wenn Sie möchten, den Hex-Code hinzufügen und hier einfügen. Und wir können auch eine in Warteschlange gestellte Deckkraft um 50 Prozent verringern . Oder wenn du dich verstecken willst, kannst du dich so verstecken. Angenommen, Sie wollen keine Farbe, Sie können einfach auf diese Taste drücken und sie wird entfernt. Machen wir das rückgängig. Der nächste ist also Schlaganfall. Strich können Sie also einen Strich hinzufügen. Sie können also sehen, wenn ich auf den Strich klicke , der bereits den schwarzen Strich hinzugefügt hat. Also möchte ich zu einer anderen Farbe wechseln. Also kann ich einfach auf dieses Feld klicken, das Farbe ist. Und ich kann es einfach auf die Farbpalette ziehen , wann immer ich will. Also lasst uns diese Lektion wählen, diese rote. Okay, du siehst, dass die Grenze rot ist. Und wenn Sie wie Verlaufsfarbe hinzufügen möchten. Du kannst also einfach zu dieser Box gehen. Und von hier aus können Sie linear wählen. Sie können also zwei Säulen hinzufügen. Derzeit regnet es also. Also füge ich die zweite Farbe hinzu, wie graue. So können Sie sehen, dass der Hub rot wird und der Hub zu Kernen wird. Also lasst es uns vorerst solide machen. Okay? Sie können auch das Gegenteil erhöhen oder verringern. Sie können auch den Hex-Code hinzufügen. Und Sie können auch verschiedene Pelletsformate wie RGB, CSS wählen verschiedene Pelletsformate wie RGB, , da SSL SB ist. Wenn Sie also den Hub erhöhen möchten, können Sie einfach die Zahl wie weniger Luft in Ordnung bringen. Und Sie können sehen, dass der Schlaganfall um fünf erhöht wird. Und sagen wir, wenn Sie möchten, sollte der Strich zentriert sein, Sie können Mitte wählen. Und du kannst es auch für draußen so machen. Von diesen drei Tasten erhalten Sie also mehr Optionen. Als ob ich keine Striche mache, wie ein Strichstil solide oder Strich sein sollte. Derzeit also zwingend der Solide. Also wähle ich Dash. So können Sie sehen, dass es sich löst. Wenn Sie also hinzufügen möchten, wie viel Schulden und wie viel Gabby wollen, können Sie sich schon vertraut machen. Standardmäßig denke ich, dass es 10 ist, also machen wir es auf 15. Okay? Und was sollen wir Desk App? Standardmäßig ist es also wie Satan zu keinem. Wenn du willst, kannst du so quadratisch oder rund machen. So werden Desktop-Computer herum. Sie können also den Join so einstellen, als wäre dies eine Millimeter-Abschrägung und ich denke, dieser ist es da. Sie können diesen Delta-Winkel also auch von hier aus hinzufügen. Also lasse ich es so wie es ist. Es sieht echt gut aus. Aber nur diese Quadratwurzel sieht gut aus. So können Sie einen Strich in Formen und Objekten hinzufügen. Also lasst uns den Effekt wählen. Aus dem Effekt, den Sie hinzufügen können, fügen wir den Effekt auf diesen neuen Programmierertext hinzu. Also habe ich diesen Text und das Spielplatzblut derzeit ausgewählt. Lassen Sie uns diesen entfernen und einen neuen Effekt hinzufügen. Das ist Schlagschatten. Und Sie können sehen, dass dieser Text irgendwie wie Drehen ist. Also wenn ich will, füge ich auch genau den Schatten hinzu, den ich will. Derzeit ist es so, warum voll ist und Blut 4 ist. Wenn also x zunimmt, y. Lasst uns zu viel erhöhen. So kannst du den Schatten sehen. Also lass uns die nächsten 40 ausgeben. So bekommst du diesen coolen Schlagschatteneffekt. Das ist also zu viel, also werde ich es wieder gut machen, um Listen zu mögen, gut. Und sollte 0 sein. Jetzt sieht es echt cool aus. Wenn Sie möchten, können Sie die Farben wie effektiv allein ändern. Im Moment gehe ich so wie es ist, denn es sieht echt cool aus. Also gefällt mir einfach, wie viel entgegengesetzt du von dir willst. Wenn Sie möchten, können Sie auch verschiedene Mischmodi wie mehrteilige dunkelbraune Farbmischungen, Soft, Light und Outlet wählen. Verwenden wir multiplizieren. Okay, schauen wir uns an. Normalerweise habe ich das nicht getan. Nehmen wir an, wenn ich auf ein anderes Element wie eine Liste klicke , klicke ich auf diesen Rahmen. Dann werden die einzigen Designoptionen wie Frame-Layer für dieses Element unterschiedlich sein. Gleich für dieses Element, dieses Element für alle Dinge. Ich glaube, ich habe vergessen, Ihnen mehr über Auswirkungen zu erzählen. Also werde ich es tun und lass uns ein weiteres Quadrat hinzufügen. Okay, so. Wenn ich also auf Effekte gehe, bekomme ich derzeit optional und Schlagschatten. Wenn Sie möchten, können Sie auch ähnliche Optionen wie Innerer Schatten, Ebenenunschärfe auswählen . Also lasst uns eins nach dem anderen sehen. Lass uns inneren Schatten benutzen. So können wir sehen, dass der innere Schatten hinzugefügt wird. Du siehst hier. Wenn du willst, kannst du auch das Blut einbeziehen. Lasst uns die 20 und 20 hinzufügen. Jetzt kannst du den inneren Kurzschluss davon sehen. Also lasst es uns noch einmal wählen. Und lass es uns schaffen. So können Sie sehen, dass der Ebenenunschärfeeffekt hinzugefügt wird. Wir können auch Mikronblut darauf hinzufügen. Das sind also alles Dinge, die Sie mit Effekten machen können. Nehmen wir an, ich habe diesen Frame, Desktop drei, und ich möchte wie ein Bild auf dem gegenüberliegenden Hintergrund hinzufügen . Lass uns dieses Pizzabild hinzufügen. Ziehen Sie es und lassen Sie es so auf den Rahmen fallen. Okay? Ich denke, es ist irgendwie verkorkst. Wählen wir also den Desktop-Bildschirm und Sie können das Bild auf den Bildern oben sehen. Was ich tun möchte, ist, dass ich alle Optionen wie die Formen sehen möchte , Text auf all dem. Also werde ich das ganz unten bewegen. So können Sie sehen, wir können alle Optionen sehen. Verringern wir also die Deckkraft davon. Sie können auf dem Design Pendelbild sehen und im Gegenteil, es ist derzeit ein 100, also werden wir bis zu 20 Prozent wählen. Dann werden unsere Navigationsschaltflächen und alle Dinge diesem Rahmen sichtbar. Wenn du willst. Sie können auch die verschiedenen Mischmodi wie Montag nach Schlüsselbein, Ausschluss, Unterschied, Unterschied und all das auswählen. Also werde ich gehen, wie es gerade passiert ist. Und wenn Sie auf dieses Bild klicken, erhalten Sie dieses Mineral. Wie Belichtungsbeschränkungen, Sättigung, Temperatur- und Tönungslichter und Schatten. Und du kannst es so ansprechen, welches Bild von dir. Also hängt einfach total von dir ab. Also mache ich mich einfach damit an. Wenn Sie also an einem wirklich coolen Projekt arbeiten, also stellen wir sicher, dass Sie ein bestimmtes perfekt sein sollte. Es gibt also etwas, du kannst es mit dem Design-Panel machen. Das ist also bedauerlich. wir sehen uns im nächsten. 10. Text-Tool und Schriftarten: Willkommen zurück. In diesem Video werden wir etwas darüber erfahren. Wie Sie sehen können, habe ich diesen Frame namens Desktop One. Und um auf den Text zuzugreifen, können wir P für Kurzcode platzieren. Ich werde echtes 2k Plus-Symbol in Betracht ziehen. Und wenn ich auf den Rahmen klicke und Text eintippe, wie folgt, können Sie Ihren Text auch kopieren, können Sie Ihren Text auch kopieren indem Sie Steuerelement C verwenden und V steuern. Dies ist also die erste Methode, die im Text ausgewählt ist und klicke auf den Bildschirm. Und Sie werden besprochen und Sie können tippen was Sie wollen. Und die zweite Methode ist, dass Sie Text auswählen können und die Dimension entsprechend Ihrem Projekt so zeichnen können . Sie können in dieses Feld eingeben, was Sie wollen. Ich möchte einfach Paste so kopieren. Wenn Sie diesen Text erneut adressieren möchten, können Sie darauf zugreifen, indem Sie darauf klicken. Und es hat dies nach Ihrem Projekt hinzugefügt , so. Nehmen wir an, wenn Sie die Schriftgröße dieses Textes vergrößern möchten , können Sie ihn auswählen und dann zum Designfenster wechseln. Und Sie können das Textmenü sehen. Und von hier aus kannst du die Schriftart anpassen. Wie, welche Art von Telefon möchten Sie derzeit in Roboto? Wenn wir also eine andere Schrift ändern wollen, sagen wir mal Särge. Und du kannst es einfach eintippen und darauf klicken. Es will sich für dich nicht ändern. Wenn ich vier verschiedene Formulare sagen möchte, kannst du darin suchen. Also bin ich jetzt nur in den Poppins. Lassen Sie uns also die Größe der Schrift auf 50 erhöhen. Nehmen wir an, wenn Sie Ihre Schriftart ändern möchten, regulär auf fett, können Sie sie von hier aus ändern. Derzeit ist es regelmäßig. Wir können in dieses Menü gehen und ich kann einfach Fett auswählen. Und Sie können Ihren Text auf jeder echten Tafel sehen. Wenn Sie möchten, können Sie auch die Verknüpfung Control und B verwenden um Ihre normale Rotation auch an Bord so fett zu ändern . Wir erhalten auch andere Optionen wie zusätzliche Linie, dünn, leicht, normal, mittel, halbfett, extra fett und schwarz. Und Sie können diese Option auch wählen, wenn Sie möchten. Der Text ist jetzt geboren. Wie Sie sehen können, habe ich dieses Paradoxon und lassen Sie uns das Gegenteil erhöhen. Wählen Sie also diesen Absatz aus und kanonisch ist die Schriftgröße wie verweilen. Also lasst es uns auf 30 wieder gut machen. Okay? Die Schriftgröße wird erhöht. Also lasst uns nur dieses hinzufügen. So. Nehmen wir an, ich möchte diesen Text in der Mitte ausrichten damit ich zu diesem Menü gehen kann. Von hier aus kann ich meine Textwerkzeuge links, mittig und rechts ausrichten . Derzeit ist es also live in diesem Avene-Zentrum. So können Sie sehen, dass unser Test Alanin zu zentrieren ist. Und wir können unsere Notation auch zum Schreiben ausrichten. Indem wir das tun, sind wir fertig. Also gefällt mir das, das Nephron, also lasse ich es so. Angenommen, wir möchten einen Buchstabenabstand hinzufügen. Das kannst du von hier aus machen. Und das Land hat 0% gemacht. Also werde ich auf Phi steigen. Und sehen Sie noch einmal, wie ein Buchstabenabstand in diesem Text enthalten ist. Und wenn Sie wie eine Bedrängnis hinzufügen möchten, können Sie es derzeit von Ihnen zu 0 hinzufügen. Lassen Sie uns den Flex-Grantee addieren. Und Sie können sehen, wie parallele Abstände hinzugefügt werden oder hier. Sie können diesen Text auch an Ihren Rahmen anpassen. Derzeit ist dies an der Spitze. Ich möchte diesen Text in der Mitte bearbeiten, damit ich diese Option namens „Align Middle“ auswählen kann. Also wird mein Text ausgerichtet auf diesem Text verankert. Und derzeit ist es in Mailand. Und wir werden auch Oberlin-Tasche und auch die Waffe wie diese Schüler diese ausrichten . In diesem Add-ons-Menü können Sie verschiedene Optionen wie Elementabteilung, Absatz, Einzug, Listenstil auswählen. Spätere Fälle, wie wenn Sie Ihre Vermutungen hoch oder größer machen möchten , können Sie das auch von hier aus tun. Und Sie können auch die Vorschau Ihres Textes sehen. Nehmen wir an, ich wähle dieses Zentrum aus, damit Sie den Beweis dafür sehen können. Und das anscheinend ist es links. Also lasst uns sie wählen. der Mitte. Und das ist die richtige, und das ist die gerechtfertigte und vordere Rekursion. Wenn Sie nach Ihrem Geschmack unterstreichen möchten, können Sie es tun, Sie können es von hier aus hinzufügen. Sie können sehen, dass die Unterstreichung Ihrem Text hinzugefügt wird. Sie können auch einen Durchgestrichen hinzufügen. Wählen Sie diese Schriftdeklaration Minimum. Und Sie können sehen, dass der Text jetzt durchgestrichen wird. Und wir können auch die Parallelvenation hinzufügen. Also verbunden bei 0, addieren wir uns zu 20. Und Sie können sehen, dass die Einrückung in unserer Prävalenz hinzugefügt wird. Und wir können auch die Aufzählungspunkte wie Punkte hinzufügen und die Liste wie diese, die Sie sehen können, dass der Punkt hier hinzugefügt wird. Und wenn ich die Nummer eins wähle, kannst du sehen, dass hier 12 hinzugefügt wird. Nehmen wir an, Sie kopieren, haben etwas Text aus dem Internet eingefügt. Und der Alt-Text ist wie ein Kleinbuchstaben. Und wenn Sie den gesamten Text in Großbuchstaben vergrößern möchten , können wir ihn von Ihnen ändern , indem wir später Meno abrufen und diese Großbuchstabe drücken. Sie können also sehen, dass sich unser Text jetzt in Großbuchstaben befindet, und Sie können ihn auch wieder in Kleinbuchstaben umwandeln. Und wenn Sie in Titel und Titelfall wechseln möchten, können Sie es auch von hier aus tun, viel mit diesem Titel erhält Meno. Und aus diesem Abschnitt können Sie dies auch die Zahlen hinzufügen. Und wir haben von hier aus viele Optionen, aber wir interessieren uns nur für diese Optionen wie Ausrichtung, Deklaration, Elternorganisation, Listenstil , kleiner Fall, Fall n. Fügen wir etwas Farbe hinzu. Derzeit ist es also solide. Wir haben also festgestellt, dass Sie sie auch brillant machen können , indem Sie dieses Linear verwenden. Die erste Farbe ist Rot. Und lassen Sie uns diese Farbe wie ein Buch wie dieses machen. Und lassen Sie uns die Deckkraft auf voll erhöhen , es sei denn, ich mache diesen Balken. So können Sie sehen, dass der Farbverlauf zu unserem Geschmack hinzugefügt wird. Dieser Text wird also ein Verlaufseffekt hinzugefügt. Wenn Sie also das Gegenteil erhöhen oder verringern möchten, können Sie es von hier aus anpassen. Nehmen wir an, ich möchte das Gegenteil von Liquidität verringern, war es nicht. So können Sie sehen, dass das Gegenteil verringert ist, machen Sie es 100. Und wenn Sie den Text ausblenden möchten, können Sie hier wie folgt ein Hybrid-Formular mögen. Und wenn Sie entfernen möchten, kann der Effekt auf Minus-Knopf klicken. Der Text ist also weg. Drücken wir nun Control Z, um dieses Ding rückgängig zu machen. Und du kannst auch einen Strich hinzufügen. Wenn ich also auf den Strich klicke, siehst du, dass der Strich in diesem Text hinzugefügt wird. Wenn ich darauf zoome, siehst du den Strich. Und wir können auch die Farbe von Destiel ändern. Und Sie können auch die Deckkraft erhöhen oder verringern und Sie können auch die Hommage erhöhen. Wir wollen standardmäßig, dass es eins ist. Also lasst uns entscheiden zu finden. Und Sie können sehen, dass der Schlaganfall jetzt Phi ist, und Sie können auch die Position Ihres Schlaganfalls ändern, als er gerade draußen ist, damit Sie innen wählen können. Unser zentraler hygienischer Nachteil sieht cool aus, also entscheide ich mich für draußen. Lassen Sie uns also einen Effekt hinzufügen. Wenn ich also auf diesen Effekt klicke, siehst du standardmäßig, Schlagschatteneffekt darauf angewendet wird. Sie können sehen, dass er Schlagschatten in diesem Text unterrichtet hat. Wenn Sie einige Änderungen vornehmen möchten, können Sie dies von hier aus tun. Wie derzeit ist y vier. Wenn du nur diese Explosion dieses Schlagschattens hinzufügen willst , kannst du es von hier aus tun. Derzeit ist y also 4, also lasst uns ein Lektin wählen. Der Schlagschatten ist unser Bezirk entsprechend der Y-Position, also zehn. Und Sie können auch genau das Gegenteil hinzufügen, die Formel. Standardmäßig sind es 25. Und ich denke, es sieht cool aus. Also gehe ich so wie es ist. Und wir können auch andere Effekte wie Inner Shadow, Ebenenunschärfe und Gemüse hinzufügen. Momentan wähle ich Schlagschatten. ist also alles die Option, die wir mit dem Text bekommen. Das ist also erschwinglich, Julia, und ich sehe euch im nächsten. 11. Bilder in Figma: Willkommen zurück. Auf diese Weise werden wir etwas über das Image lernen. Erstellen wir also ein Rechteck. Ein einfaches Rechteck wie dieses. Und derzeit ist es mit grauer Farbe gefüllt. Also ist es jetzt solide. Aber ich möchte dieses solide Vetobild ersetzen. Also klicke ich auf das Dropdown-Menü. Und ich gehe zu diesem Bild. Und Sie können sehen, dass wir dieses Muster wie Schachbrett bekommen. Von hier aus kannst du also ein Bild auswählen. Wenn ich also darauf klicke, wird es direkt in meinen Ordner gelangen. Von hier aus kann ich also ein anderes Bild auswählen. Sagen wir also, ich entscheide mich für diesen. Das ist also das Bild von uns Koreanisch. Derzeit ist es auf der ganzen Welt sehr beliebt. Wenn Sie sich diese Serie ansehen möchten, können Sie das Netflix überprüfen. Sie können also sehen, dass es sich standardmäßig um eine Füllung handelt. Was ist also gefüllt? Nehmen wir an, ich habe diese Form und wenn ich sie skaliere, können Sie sehen, wie sich Bilder an diese Form anpassen. Der nächste ist die Füße. Also was es tut, ist, sagen wir mal Wenn ich die Größe meines Containers ändere, dann kannst du sehen, dass sich die Form des Bildes nicht ändert. Die einzige Scheppach-Kontinuität ändert sich. So kannst du es also benutzen. Der nächste ist die Ernte. Von der Zuschneidung aus können Sie Ihr Bild wie andere Motive wie Photoshop und all das so zuschneiden wie andere Motive wie . Und wenn ich das schließe, kannst du die Bilder jetzt zuschneiden sehen. Und wenn ich noch einmal auf diese Füllung gehe, kann ich dieses Bild wieder so beschneiden. Und der nächste ist Titel. Was macht also ordentlich, dass es das Bild entsprechend der Form wiederholt. Du siehst es. Nehmen wir an, ich habe die Größe meines Containers so geändert. Und Sie können sehen, dass sich das Bild entsprechend der Größe dieses Containers wiederholt . So. Es sieht irgendwie cool aus. Sie können das Infrarotmuster hier sehen. Okay? Das ist also eine Option, mit der Sie damit spielen können. Also nächste Option, derzeit weniger Subjekt ins Feld. Du fühlst dich einfach taub. Und wenn Sie dieses Bild drehen möchten, können Sie es von hier aus tun. Von gestörter Schaltfläche. Wenn ich auf klicke wird dieses Bild mit Stickstoff geleitet. Und denk dran, nur das Bild wird sich drehen, nicht das Schiff. Wenn ich eine Form wie diese mache, wenn ich sie erneut drehe, können Sie nur die Bilder sehen, die sich drehen, nicht die Form. Wenn Sie Ihr Bild anpassen möchten. Wir erhalten Optionen wie Belichtung, Kontrast, Sättigung können Alarmierung, Highlights und flach predigen. Wenn Sie den Adobe Lightroom verwenden, kennen Sie möglicherweise alle Listen. Es gibt also drei Möglichkeiten, Ihre Bilder in Ihr Projekt zu importieren . Lassen Sie uns einen Ein-Frame erstellen, einen Datenrahmen wie diesen. Und wenn ich mein Bild auf den Desktop verschiebe, kannst du die Bilder sehen. Außerdem muss ich es jetzt manuell anpassen. Lassen Sie uns also einige Formen wie Ellipsenprofil löschen. Nehmen wir an, Sie müssen dazu ein Bild hinzufügen. Sie können das also mit weniger Bild tun. Es kann in Form kommen. Und Sie können die Option „Bild platzieren“ wählen. Und Sie können auch einen kurzen Kurs wie schlüssig verwenden. Also wähle ich das aus. Lasst uns das Bild machen. Klicken Sie auf „Öffnen“. Und du siehst Bilder auf meinem Cursor. Und wenn ich auf den Kreis klicke, steigt das Bild. Also werden Bilder auf diesem Kreis platziert. Und das Gleiche mit diesem Polygon. Und wenn Sie Änderungen energisch vornehmen möchten, wählen Sie diesen Kreis aus und gehen Sie zu füllen. Und Sie können alle Optionen wie Zuschneiden für Reihe, Feed und all das ändern . Nehmen wir an, dieses Bildprofil ist eine Art Porträtmalerei etwas nach oben, also können wir es so machen. Und die nächste Methode besteht darin, Ihre Bilder zu importieren, die einfach per Drag & Drop ziehen, unser Bild auswählen und es einfach so auf Ihre Figma-Software ziehen, und Sie können es libertär ansprechen , wo immer Sie möchten, wie das. Das sind also alles Dinge, die Sie mit Bildern machen können. Das ist also dein Portfolio und 0 im nächsten. 12. Boolean Operationen in Figma: Willkommen zurück. In diesem Video werden wir mehr über boolesche Operationen erfahren. Was sind die Operationen von boolescher Operation? Sie können eine benutzerdefinierte Form erstellen. Wenn Sie ein Logo entwerfen möchten, können Sie dies mit booleschen Operationen tun. Lass uns ein paar Chips wie eine Ellipse machen. Nehmen wir eine weitere Ellipse wie diese und wählen beide mit Umschalt aus. So können Sie in der oberen Leiste sehen, die wir mit einer Operation haben. Der erste ist also die Gewerkschaft. Angenommen, Sie möchten zwei Formen miteinander kombinieren damit Sie diese Vereinigungsauswahl auswählen können. Und es ist jetzt kombiniert. Und nur ich mache dieses Steuerelement rückgängig. D oder wieder normal. Lassen Sie uns abziehen, dass ich es schaffen kann. Von hier aus. Ich habe versucht, beide Formen auszuwählen und zu booleschen Operationen zu wechseln und die Auswahl zu subtrahieren. Und Sie können die Subtrahierungsoperation sehen. Okay, machen wir das rückgängig. Okay? Der nächste ist also der Einführungsabschnitt. So können Sie in Ihrer Gerichtsbarkeit sehen, nur der mittlere Teil übrig ist, n Alle Dinge sind weg. Jetzt können Sie sehen, dass dieser Interaktionsabschnitt nur noch übrig ist. Der nächste ist also der akute Abschnitt. Bei der Untersuchung wird nur der Einführungsbereich abgeschnitten. Und all die Dinge werden so bleiben, wie es ist. Klicken wir also auf den Abschnitt. Man kann sehen, dass nur anders ausgeschnitten ist. Du musst also nur damit spielen. Sie können Modusformen bearbeiten, sagen wir mal Rechteck, wie folgt. Und lasst uns alle von ihnen. Und lasst uns den Abschnitt „Entschuldigung“ wählen. Und Sie können sehen, dass die Boolesche Option diese drei Formen ausgeführt wird. Einfach begrenzt. Sie können die Form anpassen. Wenn Sie ein Logo erstellen möchten, können Sie es auch von hier aus tun. Es ist irgendwie Level. Sie können es also einfach so oben platzieren. So können Sie ein benutzerdefiniertes Schiff mit booleschen Operationen erstellen , also Dezi weiter. Und wir sehen uns im nächsten. 13. Ausrichtung und Alignment: Willkommen zurück. In diesem Video lernen wir, wie man Dinge in Figma ausrichtet. Wie Sie sehen können, habe ich dieses Projekt offen, nennen wir später Hürde. Wie Sie sehen können, habe ich diese Anmeldeseite. Nehmen wir an, diese Icons sind ziemlich math.pi wie folgt. Und du willst sie so aneinander ausrichten. Auf diese Weise verwenden wir diese Ausrichtungsschaltflächen, um mehrere Dinge auszuwählen. In Figma musst du die Umschalttaste gedrückt halten. Klicken Sie also auf den Twitter-Button und halten Sie die Umschalttaste gedrückt und klicken Sie dann auf Facebook und dann auf Google. So können Sie sehen, dass die verschiedenen Dinge jetzt ausgewählt sind. Also geh jetzt ins Design-Panel. Derzeit sind diese drei Logos also nicht vertikal ausgerichtet, daher werden wir sie zu Hause auf vertikal ausrichten. Also haben wir einen speziellen Knopf dafür. Sie können also sehen, dass dies die vertikale Schaltfläche „Ausrichten“ ist. Wenn ich also darauf klicke, sehen Sie, dass unser Logo vertikal ausgerichtet ist, aber es gibt ein Problem. Und das Problem ist, dass Sie sehen können der Abstand hier nicht übereinstimmt. Also müssen wir diese Leerzeichen hinzufügen. So können wir Räume mit diesem Heldinnen mindestens hinzufügen. Wir haben also Optionen wie in der Option Mehr wie vertikale Abstände der Verteilung gebunden und horizontale Abstände verteilen. Wir wählen also einen verteilten horizontalen Abstand aus. Und Sie können sehen, dass unsere Logos aneinander ausgerichtet sind und die Art dazwischen auch gleich ist. So können Sie die Dinge in Figma ausrichten. Das ist also wichtig für dich und ich sehe euch im nächsten. 14. Figma: Willkommen zurück. In diesem Video werden wir etwas über die Team-Bibliothek erfahren. Was gilt also als Bibliothek? Wenn Sie wie eine Ihrer Dateien eingehen und wenn wir Asset wünschen, können Sie die Optionen sehen. Sie können dieses Buchsymbol sehen. Und wenn wir darauf klicken, öffnet sich dieses Menü. So können Sie sehen und wir repräsentieren in Bibliotheken. Und die aktuelle Datei ist ohne Titel. Sie können sehen, dass dies der Unbenannte ist. Zum Beispiel wenn Sie diese Komponenten im Mini-Projekt verwenden möchten , können Sie sie verwenden, aber derzeit verwende ich die kostenlose Version. Und wenn ich darauf klicke, siehst du es. Es sagt mir, dass es nur für das professionelle Konto ist. Es ist nicht für das kostenlose Konto. Es gibt also viele andere Optionen wie ich dieses Filtersymbol nicht wirklich brauche, unsere Datei aus der Figma-Community. Also nochmal, benutze das. Also lasst uns das einschalten. Und Sie können die Icons so sehen. Und ich kann es einfach ziehen. Also kann ich diese Icons in meinen Projekten verwenden. Und es zeigt mir auch mein kreatives Team, das imaginärer Programmierer ist. Und wenn ich das öffne, wird es mir nur sagen , welche Farben sie in diesem verbleibenden Programmierteam verwendet werden . Also lasst uns nach Hause gehen und wir gehen in die Community. Und in diesem Icon-Bereich haben wir diese Lünettensymbole. Klicke drauf. Und wenn Sie dies verwenden möchten, alle Symbole, können Sie einfach auf diese doppelte Schaltfläche klicken und es wird für Sie dupliziert. Und dann können Sie dies verwenden, alle Icons aus dieser Teambibliothek. Und wir müssen diese Option einfach umschalten. Und wir können es einfach auf das Projekt oder den Frame wie folgt ziehen . Und es zeigt Ihnen auch, welche Arten von Icons wir in diesem Projekt verwenden. Wir benutzen diese ehrliche Sprecherin und auch dieses Warnzeichen. So etwas kannst du also mit einer Teambibliothek machen. Das war's also für das heutige Video. Und wir sehen uns im nächsten. 15. Das Code in Figma: Willkommen zurück. In diesem Video werden wir mehr über das Inspect Panel erfahren. Wenn ich also auf dieses Inspektionsfeld klicke, sehen Sie Optionen wie Kohle. Sie können auch das CSS sehen. Und wenn ich darauf klicke, siehst du die Optionen wie iOS oder Android. Und das ist der Code. Und wenn ich darauf klicke, ist dies der Tisch. Von hier aus können Sie dies die Hintergrundfarbe sehen, mein Projekt, das grün ist , und derzeit bin ich nicht Bearbeitung ausgewählt, es befindet sich im Hintergrund. Wenn ich dies auswähle, mein erster Frame als Desktop-Frame. Und Sie können Optionen sehen, wie zum Beispiel Ich bin für Desktop One Frame ausgewählt und alle Eigenschaften wie seltsame Höhe, Oberlippe und Mischung. Die Farbe. Derzeit sind wir total weiß, also lautet die Farbe, der Hex-Code ist FFA für 16. Und Sie können den Kernteil auch sehen. Nehmen wir an, Sie sind Teamkollege ist ein Webentwickler, ein Front-End-Webentwickler, und er arbeitet mit CSV zusammen. Es kann also einfach diese Eigenschaften kopieren und Sie können sie einfach in seinen Anruf einfügen. Sie müssen also keine Emittierungen wie nur diese Eigenschaften wie Höhe oder Höhenposition und Hintergrundfarbe schreiben nur diese Eigenschaften wie Höhe . Und wenn ich auf diesen imaginären Programmmodelltext klicke, wird es mir sagen. Sie können alle Eigenschaften sehen, wie wir verstecken, links, verschmelzen und nur den Text. Und alles ist der Inhalt, den Sie in Photoshop sehen können, es wird sagen, welche Art von Schriftart ich verwendet habe, eine Hybridgröße, Länge davon oder welche Farben ich verwendet habe, als ob ich eine Verlaufsfarbe verwendet habe und dergleichen. Wenn es lila ist und man wie eine Lavendelfarbe ist. Und in diesem Kurs können Sie die CSS-, iOS- und Android-Option sehen . Und wenn ich auf diesen IS Button klicke. Und Sie können sehen, dass wir iOS-Code haben, sodass wir ihn einfach kopieren und in unseren Entwicklungskern für iOS-Anwendungen einfügen können. Und es ist auch dasselbe für unter Android. Sie können einfach so kopieren und in Entwicklungscode eingefügt werden. Sie können sie auch ansehen. Was ist das Inhaltsverzeichnis dafür? Wie Farben und Art der deformierten Größe, Höhe und all das. Oder ist der Ausschluss oder macht die y-Position. Du kannst also sehen, dass ich dieses Monster benutze, es wechselt von Form zu einem anderen wobei der 700-Stil normal ist. Wenn ich das fett in fett ändere, wird es mir zeigen, dass dies der Bolzen ist. Es wird mir auch erzählen, wie groß das Pixel ist , derzeit 60 Pixel. Wie hoch ist die Zeilenhöhe und das alles? Es gibt also eine Art Option, die Sie in das Inspektionsfeld bekommen. Das ist also dein Ordner. Und wir sehen uns bei der nächsten. 16. Prototyping in Figma: Willkommen zurück. In diesem Video werden wir etwas über den Prototyp erfahren. Also lasst uns einen Rahmen erstellen. Und lasst uns noch eine erstellen. Okay, wir haben jetzt zwei Frames. Und Sie können es für das Verschiebewerkzeug umbenennen, was Sie wollen. Und benenne es auch wie heute Morgen um. Okay, lass uns ein Quadrat auf diesem Rahmen erstellen. Und die Abkürzung ist, und du wirst ein Quadrat erstellen. Und Sie können sehen, dass sich das Quadrat auf dem ersten Bildschirm befindet. Kopieren wir dieses Quadrat auf den zweiten Frame so. Und lassen Sie uns dieses Quadrat mit diesen Punkten in einen Kreis verwandeln . Okay? Also geh jetzt in den Prototyp. Im Produktbereich haben Sie Optionen wie Hintergrundmodell. Dies ist das Zielmodell des iPhone 11 Pro Max, und dies ist der Gerätename und Sie können diese keine Violine zwei horizontale, vertikale Position wechseln . Lassen Sie uns also den Hintergrund auf Weiß ändern. Siehe im Hintergrund zu Weiß. Was ich tun möchte, ist, dass wenn ich, wenn ich auf dieses Quadrat klicke, es in diesen Kreis wechseln muss. Wenn ich auf das Quadrat klicke, sieht man, dass sich auf der rechten Seite des Quadrats ein weißer Punkt befindet. Und wenn ich darauf klicke, siehst du, dass es einen Draht wie diesen gibt. Und wenn ich das auf dem zweiten Frame und Künstler bewege, dann kannst du sehen, dass dieses Einführungspanel auftaucht. Von hier aus können Sie also pünktlich Optionen hinzufügen, Sie müssen diese Aktion ausführen. Wie wenn ich darauf tippe, ändert sich diese Quadratwurzel in diesen Kreis. So kannst du von hier aus alle Dinge einstellen. Also wähle ich vorerst auf Hahn. Und jetzt kommen wir zum Kreis. Wir navigieren von dieser Seite aus. Um dies zu tun, wählen wir navigieren und navigieren von Quadrat zu Kreis. Vom ersten Frame wird das Quadrat und die zweite Prämisse Kreise. Deshalb heißt es den Kreis. Die meiste Zeit ist die Option „Mission beenden “ in der Instanz. Also müssen wir den Smart und die Emission wählen , um diesen coolen Effekt zu erzielen. Und Sie können auch die Uhrzeit einstellen. Derzeit sind keine 300 Millisekunde. Wenn du willst, kannst du es von hier aus ändern. Aber im Moment gehe ich so wie es ist. Und jetzt klicken wir auf diesen Play-Button oder den Present-Button. Und Sie können sehen, dass das neue Fenster aufgetaucht ist. Und Sie können auch sehen, dass der Hintergrund weiß ist. Wenn ich auf dieses Smartphone klicke, siehst du, dass das mir sagt, dass dies der Hotkey ist. Und wenn ich auf dieses Quadrat klicke, siehst du, dass es sich in Kreis ändert. Aber wenn ich erneut auf den Kreis klicke, möchte er ihn nicht in Quadrat ändern. Also können wir das schaffen. Gehen wir noch einmal ins Projekt und klicken Sie einfach auf diesen Kreis. Und du siehst diesen Punkt. Und du kannst diese 2 ersten Frame so verschieben. Sie können das Interaktionspanel sehen. Im Moment werde ich gehen, da es wie alle Optionen wie Smart und Emission und pünktliche Steckdose ist. Lasst uns also noch einmal ins Projekt gehen. Und Sie können sehen, dass es sich derzeit in einem Kreis befindet. Und wenn ich noch einmal darauf klicke und du siehst, dass sich der Kreis jetzt zur Pflege ändert. Und wenn ich das noch einmal auf das Quadrat klicke, siehst du die Tangente, die jetzt umkreist werden soll. Also habe ich ein Projekt, wie ich dieses zufällige Projekt für den Demo-Zweck gemacht habe . Sie können diese Navigationsschaltflächen wie Heimkontakt sehen . Was ich tun möchte, ist, dass ich diesen beiden Connect-Buttons zu dieser Seite und über unsere Navigation zur letzten Seite beitreten möchte diesen beiden Connect-Buttons zu dieser Seite und über unsere Navigation zur letzten Seite beitreten . Sie wissen also wirklich, was zu tun ist. Du kannst das Video anhalten und darüber nachdenken, wie wir das machen werden. Also lasst uns dieses Verhalten machen. Derzeit bin ich im Prototyp-Panel, also kannst du in dieser Plus-Button sehen und diese weniger in dieses zweite Panel, den zweiten Frame und die Listen ziehen . Klicken Sie darauf, es sei denn, dass Sie diesen Tools beitreten. Drittes Panel, wie dieses. Und wenn ich das spiele, wenn ich auf diesen Rahmen klicke, dann kannst du sehen, dass die Hospiz Kinder Kontakt haben und wenn ich auf diesen Kontakt klicke, dann kannst du den Frameaustausch in Kontakt sehen. Und lass es uns nochmal machen. Derzeit haben wir auf dieser Seite keine Host-Portschlüssel, daher müssen wir diese Dinge löschen. Schon wieder. Wir schließen uns nur dieser ersten Seite an, also müssen wir es für die zweite, dritte Seite tun. Also lasst es uns für die zweite Seite machen. Von zu Hause aus müssen wir auf die Homepage gehen und von hier aus ist dies die Kontaktseite, damit wir nichts damit anfangen müssen. Und klicken wir auf das About und ziehen es auf den dritten Frame wie folgt. Und das Gleiche für unseren Pitch from Home-Button. Es muss auf die Homepage gehen und, äh, von Kontakt. Es muss so auf die Kontaktseite gehen. Und wenn ich darauf klicke, einer dieser Drähte und Sie können sehen, dass es eine Einführung gibt, wie pünktlich. Es muss weitergehen, hat kein Desktop-Tool wie dieses. Im Moment interagieren wir nur mit diesen Seiten, sodass wir keine anderen Optionen wie Smart Dimension und all das auswählen müssen. Aber wenn du willst, kannst du das so machen, als könntest du einfach ausziehen. Sie können diese kleine Animation oder hier sehen. Zeigen Sie es also noch einmal an. Wie Sie derzeit auf der Kontaktseite und den Hotkeys Alto home and about sehen können derzeit auf der Kontaktseite und den Hotkeys und wenn ich auf dieses Zuhause klicke, können Sie sehen, dass wir uns derzeit auf der Homepage und den Listen befinden. Lasst uns in Kontakt kommen. Also derzeit im Kontext. Lasst uns also auf den Rahmen gehen. Und wenn ich auf diesen Kontakt klicke, siehst du in diesem Umzug. So können wir Ihr Projekt prototypisieren. Für dieses Projekt wähle ich dieses Hyperprotokoll 0.9. Du kannst wählen, was du willst. Ipad Pro-Elemente sind Profi. Sie können auch Apollodorus wählen. Aber das ist die Webseiten-Seele, und deshalb wähle ich das. Man kann das iPad Pro sagen, weil es eine größere Auflösung hat. Also denke ich, dass es das ist. Das ist also für ein Video gewährt und ich sehe euch im nächsten. 17. Horizontales und vertikales Scrollen: Willkommen zurück. In diesem Video erfahren wir, wie Sie die tiefste Berufung und das horizontale Scrollen hinzufügen können. Also lasst uns einen Rahmen wählen. Lass uns das iPhone 12 Pro Max wählen. Nehmen wir an, wir entwerfen Apps wie Instagram. Und in dieser App haben wir Geschichten. Okay, wählen wir sie alle aus. Und weniger. Oranger Strich. Der Schlaganfall wird weiß sein. Machen wir es zu einem Baum. Okay? jetzt mit der rechten Maustaste darauf. Gehe zu Plugins. Und, und ich habe dir schon gesagt, wie man Plugins in Figma hinzufügt. Also denke ich, dass wir Plugin Photos genannt haben. Also klick drauf. Okay, also von hier aus können Sie verschiedene Optionen wählen , wie Tiermenschen argumentiert werden, sich in Ihre Stadt hinein und alarmieren. Aber derzeit werden wir hinzufügen, Derzeit werden wir zufällig wählen. Nehmen wir an, es wird eine gewohnheitsmäßige Person geben. Also wähle ich Leute aus. Und es wird automatisch Kreis machen und sie alle zählen. Und ich füge all diese Bilder im Kreis hinzu. Du siehst so. Also lasst uns das schließen. Okay, also wurden Bilder hinzugefügt. Lasst uns jetzt, gruppieren wir sie. Klicken Sie also mit der rechten Maustaste darauf und machen Sie es gruppieren. Mit können Sie sie auch Control G gruppieren. Sie können mit der rechten Maustaste darauf klicken. Wählen Sie diese Gruppenauswahl aus. Okay, ich lagere jetzt in dieser Gruppe. Klicken Sie also erneut mit der rechten Maustaste darauf und wählen Sie die Rahmenauswahl. Und jetzt ziehe es einfach auf den iPhone-Rahmen. So. Manchmal wird es schwierig sein, die Geschichte in diesem Rahmen zu verdienen. Also bin ich danach endlich hochgehoben. Die Geschichten werden also im iPhone 12 Pro Max hinzugefügt. Also klicke jetzt auf den Clip-Inhalt. Jetzt haben wir Clip-Inhalte ausgewählt. Lassen Sie uns die Größe dieses Algorithmus so auf diesen Rahmen ändern. Okay, jetzt erstellen wir ein Feld kopieren. Ich werde dafür eine zufällige Dimension verwenden. Also weil es nur Demonstrationszwecken zu dieser Entschließung dient. Okay, ich glaube, ich habe sechs ausgewählt. Wählen Sie alle aus, klicken Sie mit der rechten Maustaste darauf. Gehe zu Plugins, klicke auf Fotos. Und auf Fotos sehen Sie dass wir eine Option namens random haben. Klicken Sie darauf und wählen Sie zufällig aus. Wenn Sie möchten, können Sie die Option Bild platzieren verwenden, wenn Sie manuell hinzufügen möchten können Sie die Option Bild platzieren verwenden, wenn Sie , und Sie können Bilder aus Ihren lokalen Dateien hinzufügen. Okay, jetzt werden alle Bilder in diesem ersten Abschnitt hinzugefügt. Schließe jetzt diese Fotos. Klicken Sie nun mit der rechten Maustaste darauf, erstellen Sie eine Gruppe. Sie können jetzt auch die Verknüpfung Control G. So Distinguished group verwenden . erneut mit der rechten Maustaste darauf und wählen Sie die Rahmenauswahl. Okay? Also nach Frame Selection und ziehe dieses Feld so in unseren Frame. Okay, klicke jetzt auf den Clip-Inhalt. Okay, passen wir diesen ersten Abschnitt so an. Gehe jetzt zum Prototyp. Und Sie können sehen, dass der erste Abschnitt ausgewählt ist. Und derzeit gibt es kein Scrollen. Lassen Sie uns einen Scheitelpunkt wählen, der bereit ist und weiter Touristen wählen horizontales Scrollen. Und lassen Sie uns diesen Rahmen dunkler machen , weil sie heutzutage ziemlich berühmt sind. Und ich benutze auch gerne den Dunkelmodus. Also lasst uns das vorstellen. Sie können also sehen, dass die App so aussieht. Also denke ich, dass ich ein Publikum mit Internetproblemen habe. Deshalb wird das Bild nicht geladen. Also wenn ich meine Maus auf die linke Seite ziehe und sehe, wie das Scrollen passiert oder auf dem Smartphone. Und auch in diesem ersten Abschnitt, Scrollen, diese Art von glatt. Wenn Sie scrollen, können Sie sehen, dass es so aussieht. So können Sie also vertikale Punktzahl und ein horizontales Scrollen in Ihrer App oder Ihren Webseiten hinzufügen . Das war's also für das heutige Video. Und wir sehen uns im nächsten. 18. Masken in Figma: Willkommen zurück In diesem Rebellen und erfahren Sie, wie man Masse benutzt. Wie Sie auf meinem Bildschirm sehen können, habe ich verschiedene Arten von Blop auf meinem Bildschirm. Auf dem Desktop ist ein Ion Farbe. Aber was ich tun möchte, ist, dass ich das Bild in diesem Globus platzieren möchte , damit ich das tun kann. Der traditionelle Weg, dies zu tun, besteht darin, sich zu dekondensieren. Und Sie können zu Formen gehen und Bild oder hier platzieren. Oder Sie können füllen und Solar zu Bild wählen , als es ist. Für mich. Sie können auch ein Bild auswählen, aber Sie können auch Masse verwenden, um dasselbe zu tun. Nehmen wir also ein zufälliges Bild aus. Nehmen wir dieses Bild implizit oder hier, das zu den Ebenen oder Ihnen passt, Okay, Auf dem zweiten Vektor, der unser aufgeblasen ist, möchte ich dieses Bild platzieren. Lassen Sie mich also Multi-Attribut auf der rechten Seite mögen und überprüfen Sie es einfach noch einmal auf der linken Seite. Okay, also kann ich jetzt plus 0 Bildpublikum. Setzen Sie sich dazu an den Vektor v. Wir möchten Ihr Bild platzieren und Ihr Bild auswählen. Und jetzt gruppiere sie mit der Steuerung. Es ist also jetzt Gruppe. Was wir also tun müssen, ist eine DAG, diese Gruppe B zu gruppieren, Gruppe zwei Dinge, Krieger. Das erste ist dieses Bild und sekundär ist unser Block. Wählen Sie also den Blog aus, klicken Sie mit der rechten Maustaste darauf, klicken Sie auf verwendet eine Maske und Sie können sehen , dass sich das Bild in diesem blauen Bereich befindet. Und du wirst auch diesen Blog ansprechen. Wie beim Zuschneiden ist dieses Bild-Attribut wie folgt nach oben. So kannst du also Maske benutzen. Ich weiß, dass Sie vielleicht denken, dass das Unterrichtsbild einfacher sein kann, wie das Auswählen der Form und zum Bild zu gehen und ähnliches Bild von Ihrer lokalen Festplatte zu verwenden und bereits hier zu verschieben. Ich weiß es sehr einfach, aber ich benutze auch nicht so viel Maskierung. Es hängt also völlig von dir ab. Bei Bedarf einige Anpassungen können Sie diese Maskierungstechnik verwenden. Also lasst uns dieses Bild darauf legen. Platzieren wir dieses Bild in diesen Block. Platzieren von Bildern eine Art von Maskierung. Aber es ist wie ein sehr einfacher Prozess. So können Sie die Maskierung verwenden. Das ist also die vierte Ableitung. Und wir sehen uns im nächsten. 19. Figma | JPG PNG. SVG. PDF | Projekt in .fig: Willkommen zurück. In dieser Einheit erfahren wir, wie Sie Ihr Projekt exportieren können. Und die PNG-Datei JPEG wird n ist Region haben. Wie Sie sehen können, habe ich diesen Klon auf Instagram und möchte diesen Frame exportieren. Es gibt viele Möglichkeiten, in Figma zu exportieren. Schauen wir uns also eins nach dem anderen an. Der erste ist die Figma-Datei zu gehen. Und Sie können sehen, dass wir den Export-Button haben. Und derzeit haben wir das iPhone 12 Pro Max 2 ausgewählt. Dies ist der Rahmen und es ist im PNG-Format. Und Sie können die Entschließung auch hier sehen. Klicken Sie nun auf Exportieren. Und es wird Sie fragen , wo wir Ihr Projekt speichern möchten. Erstellen wir also einen Ordner hier drüben. Und sagen wir dieses Projekt in diesen Ordner. Klicken Sie auf das Speichern. Diese Gruppe wird im Exportordner heruntergeladen und Sie können sehen, dass unser Projekt exportiert wird. Die zweite Methode ist das Selektiv von Frame. Gehe zum Design-Panel und geh am Ende. Und Sie können sehen, dass wir hier die Möglichkeit haben zu exportieren. Und momentan dieses ein x und lass so wie es ist. Und wenn Sie in verschiedenen Formaten wie JPEG, SVG exportieren möchten , oder Sie können diese Optionen wählen. Nehmen wir an, wir wollen das wie ein JPEG exportieren. Klicken Sie auf dieses EPEC und klicken Sie auf Exportieren, iPhone 13 stimmt auch überein. Und Sie können auch die Vorschau dieser App sehen. Klicken Sie also auf Exportieren und Sie werden gefragt, wo Sie speichern möchten. Derzeit möchten wir dies also speichern, um den Ordner herunterzuladen und zu exportieren. Also klicke auf den Verkauf. Und lass uns zum Download gehen. Und Sie können sehen, dass es tatsächlich im JPEG-Format vorliegt. Dieser ist im PNG-Format. Und das Gleiche gilt für diese SVG und PDF. Derzeit mögen wir die Exposition bei der Auflistung. Angenommen, wenn Sie mehrere Frames exportieren möchten, können Sie zu Datei gehen und Frames für die Polizei exportieren auswählen. Und Ihr Projekt wird ins PDF-Format exportiert. Also klicke auf diesen Pfeil. Und lasst uns das öffnen. Und Sie können sehen, dass unsere Datei in Chrome geöffnet ist. Und das sind unsere Frames, vier Frames unserer Musik-App. So können Sie also mehrere Dateien im Parlament exportieren . Angenommen, Sie möchten dieses Projekt mit jemandem teilen und möchten es in eine Figma-Datei exportieren. Gehen Sie also erneut zu Dateien und klicken Sie auf diese lokale C1-Kopie. Und es wird dich fragen, wo du lagern möchtest. Also wollen wir in den Exportordner fallen, klicken Sie auf den Verkauf. Und das ist unsere Figma-Akte. Und wenn Sie mit jemandem mit Gmail teilen möchten oder diese Datei direkt freigeben und diese Datei in ihrer Figma-Software öffnen können. Das sind also alle Metalle, um unsere Projekte zu exportieren. Also dieser importierte religiöse Wert, und wir sehen uns im nächsten. 20. Mockup in Photoshop: Willkommen zurück In dieser Rebellion und erfahren Sie , wie Sie Mock-ups in Photoshop erstellen können. Also erstelle ich ein Modell dieses Rahmens. Es ist ein Instagram-Klon, aber Sie können den Host einer Person teilen oder mögen, den Rahmen auswählen und zum Design-Panel wechseln. So für den Export. Sie können sehen sich der Export am Ende des Entwurfsbereichs befindet. Was wir also tun wollen, ist, dass ich diesen Rahmen in ein Bild exportieren möchte , das ist in das PNG-Format. Sie können verschiedene Formate wie JPEG, SVG, PDF auswählen , aber ich möchte das in PNG. Also wähle ich ein PNG aus. Und wenn du ein Blau sehen willst, können wir von hier aus auch ein Blau sehen, dieses. Und jetzt klicke auf „Exportieren“. Es wird also den neueren lokalen Datenträger exportieren. Derzeit habe ich diese spezifischen Downloads ausgewählt, also wird sie in diesem Ordner gespeichert. Also lasst uns auf den Verkauf klicken. Also lasst uns zu Downloads gehen. Sie können also sehen, dass das Bild in diesem Ordner ausgenutzt wird. Öffnen wir Ihren Lieblingsbrowser und suchen Sie nach kostenlosen Mockups. Oder Sie können auf diese Website namens Free Peak gehen. In diesem werden tatsächlich viele Modelle kostenlos erhalten, um nach iPhone-Mockups zu suchen und Enter zu drücken. Und wir möchten, dass dies ein GIF-Format ist, das Photoshop-Format ist. Sie können also sehen, dass wir in dieser Kategorie herausfiltern können. Wir haben also nur einen Rahmen. Wählen wir also einen Ein-Frame aus. Das hier. Ich denke, das sieht gut aus. Also lasst uns das herunterladen. Richten Sie den Rahmen ein, klicken Sie auf den Download und klicken Sie auf Free Download. Nach dem Herunterladen wird derzeit tatsächlich formatiert. Sie müssen diesen Ordner also extrahieren. Sie können einen Überschuss wie 7 Zip verwenden oder reiben Zip-Ordner zu extrahieren, in den die Datei heruntergeladen wird. Extrahiere diese Datei und klicke mit der rechten Maustaste darauf Ich habe 7-Zip. Also benutze ich 7-Zip. Sie können die Photoshop-Datei und das Bild dieses Mockups sehen. Also geh zu Photoshop. Klicken Sie also auf „Öffnen“. Das ist unser Ordner. Wir haben die Datei extrahiert und ausgewählt. Die Datei ist jetzt geöffnet. Also geh zu Ebenen. Und das ist das intelligente Image. So sehen Sie das kleine Bildsymbol hier drüben. Doppelklicken Sie also darauf. Und ich denke, wir mussten diesen Ordner löschen, also mache ich diesen. Wählen Sie nun Ihr Bild aus, das wir Kate exportieren. Ziehen Sie dieses Bild also in Photoshop und fügen Sie es auf diesem leeren Bildschirm ein. Und du siehst die Bilder bestial hier drüben. Speichern Sie dieses Bild nun mit Control S und es fragt vor dem Speichern das Finale an Ort und Stelle. Also klicke auf den Ort. Okay, das Bild ist platziert. Gehen wir jetzt zu unserer Originaldatei. Und du kannst sehen, dass wir unser Modell haben , aber es gibt ein Problem. Sie können sehen, dass es einen Text gibt und ich möchte diesen Text entfernen. Der Text löscht diesen also und er ist fleißig. Jetzt. Jetzt exportieren wir dieses Bild. Gehe zu Datei und gehe zu Exportieren. Und Sie können Exportieren als wählen oder auf Als PNG exportieren klicken. Ich klicke auf Quick Export als PNG. Und speichern wir es in Downloads. Und klicke auf Speichern. Gehen wir zum Download-Ordner. Sie können unser Motto sehen. Lasst uns das aufmachen. Und Sie können sehen, wie unser Mock-up so aussieht. So können Sie in Photoshop ein Mock-up erstellen. Und du kannst auf diese Website gehen. Und Sie können, wenn Sie möchten, ein Tischmodell verwenden und einfach danach suchen und einfach das Desktop-Mockup herunterladen und in Photoshop importieren. Und alle Prozesse gleich. So können Sie in Photoshop Mockups erstellen. Das war's also für die ursprüngliche Ebene. Und wir sehen uns im nächsten. 21. Plugins in Figma: Willkommen zurück. In diesem Video erfahren wir mehr über Plugins. Du siehst, dass ich einen Frame oder Backstop habe. Also klicke ich drauf. Sie können sehen, dass wir die Option Plugins genannt haben. So kannst du deine Plugins von hier aus verwalten. Wenn Sie bereits einige Plugins installieren. Und wenn Sie italienische Plugins verwenden möchten, können Sie auf die Browser-Plugin-Community klicken. Gehe jetzt zur Registerkarte „Plug-In“. Von hier aus bekommst du jede Menge Plug-In. Sie können dieses Plug-In-Seniorprojekt verwenden. Nehmen wir an, Sie möchten dieses Plugin namens Blobs installieren. Klicken Sie also einfach auf diesen Button Installieren. Sie werden also auch wissen, was die Funktion davon ist. Es zeigt Ihnen auch, wer der Ersteller dieses Plugins ist und wann es erstellt wurde und wie viele Leute dieses Plugin nicht in Beziehung setzen. Also werden wir es installieren. Lasst uns ablehnen. Klicken Sie also mit der rechten Maustaste darauf, gehen Sie erneut zu Plug-Ins und Sie können sehen, dass das Plugin installiert ist, also klicken Sie darauf. Was Blut tut, ist, dass es einige zufällige Aktien für dich erzeugt. Der Wert des Komplizen-10-Kontrakts ist in Ordnung. Klicken wir also auf die MEG-Blöcke. Sie können also sehen, dass es eine zufällige Verschiebung geschaffen hat , die wir in unserem Projekt verwenden können. Wenn Sie möchten, können Sie einen anderen Wert angeben, sagen wir 31. Unsere neue Form ist also da. Also diese Art von Team kannst du mit diesem Plugin machen. Nun schauen wir uns ein Plugin an aktuelle Fotos. Es gibt einen meiner bevorzugten Plug-In-Anrufe. Ich zeige dir warum. Sie können sehen, dass dies das Plugin ist. Und dieses Plugin bekommen wir viele Websites mit Stockbildern und Julio, aber wir hatten kein Plugin. So können Sie sehen, dass das Plugin installiert ist, also klicken Sie mit der rechten Maustaste darauf Plugins und Sie können auf den Fotos sehen. Das Foto-Bloggen ist also geöffnet. Jetzt können Sie nach einem Foto suchen, wenn Sie nach einem bestimmten suchen möchten , aber Sie können den Bereich suchen. Wir bekommen auch Album-Give-Dateien und taub und Bibliothek. Und Sie können auch verschiedene Arten von Kategorien wie Technologien, Hafenstadt und all das auswählen. Aber ich mag diese zufällige Option. Nehmen wir an, ich habe diese beiden Formen und möchte das Bild auf diese beiden Formen platzieren . Also gehe ich ins Tandem. Und ich kann verschiedene Optionen wählen wie Tiere, Stadt, Strand, Menschen. Aber es gibt auch eine Option, die als Zufall bezeichnet wird. Also wählt es automatisch zwei beliebige Prognosen aus und gewann einen Platz in diesen Formen. Wenn ich also auf diesen Zufall klicke, kannst du sehen, dass die beiden Fotos in diese Form eingefügt sind. Und es sieht irgendwie cool aus. Es wird Ihnen helfen, wenn Sie eine Social-Media-App und diese App erstellen, eine Lernsitzung haben und alle Bilder gleichzeitig platzieren möchten. Sie können diese Funktion also zufällig verwenden und Sie können Personen auswählen. In dieser Geschichte und letztendlich einem der Gesichter von Menschen wissen wir jetzt, wie man Plug-In installiert und wie man sie benutzt. Schauen wir uns also an, wie die Plugins deinstalliert werden. Klicken Sie also mit der rechten Maustaste darauf und gehen Sie erneut zu den Plug-Ins und klicken Sie auf Plugin verwalten. Und Sie können sehen, dass wir diese beiden Plug-Ins derzeit infiziert haben, wenn Sie das erste sind , ist Lappen und Segmente fokussiert. Also klicke einfach auf diese Drei.me. Und es wird Ihnen Optionen wie Engpässe und Deinstallation geben . Klicken wir also auf die Deinstallation. Und unser Plugin wird es deinstalliert. Und von hier aus können Sie auch die verschiedenen Plugins durchsuchen. Im nächsten Jahr werde ich Ihnen die fünf besten Plugins sagen , die Sie in Ihren Projekten verwenden können. Das ist also dein Wasser. Und wir sehen uns im nächsten. 22. 5 MUST für For: Willkommen zurück. In diesem Video erzähle ich Ihnen die fünf besten Plugins, um Ihre Zeit zu sparen. Im Prinzip lernen wir also, wie man das Plug-In installiert, das Plug-In deinstalliert und wie man es verwendet. Also lerne ich jetzt, wie man auf das Plug-In zugreift, klicke mit der rechten Maustaste auf deinen Frame und gehe zu Plugins. Und Sie können in den Infrarot-Plug-Ins hier sehen, eines meiner Lieblings-Plug-Ins Fotos , die ich vor Tagen oft verwende Einer meiner Freunde hat dieses Unsplash-Plugin empfohlen , ist auch großartig und es ist irgendwie, das Interface ist irgendwie gleich. Wir bekommen alle Kategorien wie technologisch oder abstrakt und alle lernen. In diesem Editorial bekommen wir viele Fotos, Konserven. Und wenn Sie in einem bestimmten Ordner suchen möchten, können Sie hier suchen. Angekündigter Ort. Wir bekommen auch diese zufällige Option, wie Fotos. Nehmen wir an, sagen wir, Sie machen ein Feld Instagram frei. Und darin musst du mehrere Fotos hinzufügen. Sie können es also einfach lokal hinzufügen, aber es wird lange dauern. So können Sie alle auswählen, all dieses Rechteck und klicken Sie einfach auf den Zufallsprinzip einfügen. Und letztendlich wird es all diese Fotos in diesen Formen hinzufügen . So können Sie sehen, dass das 34 Plus einmal in unserer Form hinzugefügt wird . Sprechen wir über das nächste Plugin. Das ist Rouge. Angenommen, Ihr Kunde möchte Institution in seine Projekte aufnehmen. Sie können also dieses Plug-In namens Blush verwenden. Und von weniger kann man sehen, bekommen wir viele Illustrationen. Wir lernen auch unsere Schöpfer kennen und welche Art von Illustration wir haben. Ich mag dieses Eindringen, das Open Doodles genannt wird. Was wir also tun müssen, ist, dass Sie eine Meditations-App erstellen möchten. Also klicken wir einfach auf diese Meditations-Illustration. Und es wird dieses Bild automatisch zu Ihrem Frame hinzufügen. Sie können die Größe so ändern, und Sie können hier etwas Text hinzufügen. In dieser Abbildung haben wir keine Option, die Farbe zu ändern da Sie sehen können, ob ich auf dieses Farbsymbol klicke, wir brauchen einen Pro-Agenten. Es hängt also völlig davon ab dass Sie einen Kaufansatz kaufen möchten und Sie können es kaufen. Aber es gibt andere Administration, sie sind völlig kostenlos und Sie können die Farbe auch ein wenig ändern. Ich glaube, diese eine Macht bewegt sich. Lass es uns machen, das hier. Und sagen wir, ich habe ein Bild davon. Sie können sehen, dass wir Optionen wie Hautfarbe bekommen. Enthalten Sie das Skin-Farbrad von hier aus können Sie Pipettenwerkzeug für die andere Farbe wählen. Du kannst den engeren Krieger auch ändern wie unteres, oberes Kopfgesicht und all das. Irgendwie Bitmoji, Snapchat. Wir bekommen, wir haben viele Möglichkeiten, unsere Kleidung zu wechseln angesichts der Absenderphase und der Verkaufsstelle. Nehmen wir an, wir wollen 10 tiefer in diese Blume ist kürzer. Wenn ich darauf klicke, siehst du jetzt die enge Seitenkette. Sie können das Geschlecht des Muskeltonus so erkennen. So kannst du das Rouge benutzen. Sprechen wir über das dritte Plug-In, das Mock-Ups Studio ist. Und es ist auch einer von dergleichen. Mein Plug-In. Es ist gepaart, aber Sie können eine kostenlose Vorlage verwenden. So können Sie dieses iPhone und iPad sehen. Lasst uns, verwenden wir diesen Frame ist Frame. Und klicke einfach auf dieses Modell. Und Sie können sehen, dass unsere Schnittstelle so auf dem Bildschirm ist. Wenn Sie also exportieren möchten, klicken Sie einfach auf Als Datei exportieren oder als Dokument. Also aktuelles Sprachdokument. Und es speichert Sie in Ihren lokalen Dateien wie auf dem Desktop oder in Ihrem C-Laufwerk. Sie können es speichern, wo immer Sie wollen. Sie können also sehen, dass ein Modell unsere Geschichte in meiner lokalen Datei im Download-Ordner ist. Also kann ich es von diesem Follow aus öffnen. Das Modell sieht also irgendwie so aus. Sie können es mit Ihren Freunden oder Ihren Kollegen teilen , damit wir wissen, wie Ihre App aussieht. Das letzte Plugin ist, dass ich eine Menge verwende, die Wireframe genannt wird. In diesem Plugin erhalten Sie viele Optionen, z. B. wenn Sie eine Website erstellen, Sie können Wireframe für das Web auswählen, Oliver erstellen und eine App erstellen. Sie können eine mobile Membran wählen oder wir haben hier viele Optionen, wie verschiedene Kinder, wie 360-Grad-Wireframe-Kit für Web und Mobile. Wenn ich auf dieses 360-Grad-Wireframe-Kit für Mobilgeräte klicke, würde ich hier verschiedene Optionen bekommen. Sagen wir, ich möchte das benutzen. Ich ziehe es einfach auf meinen Rahmen. Also wird es wirklich meinen Rahmen hinzufügen. Ich kann einfach so schießen. Du kannst es auch ausstrecken. Vor diesem Plug-In ist es unser Leben , dass ich alle Elemente für Drahtgitter manuell mithilfe von Formen erstelle . Und nachdem ich diese Form gemacht habe, möchte ich sie gruppieren und in Komponenten einsteigen. Ich verwende diese Komponente in Drahtgitter. Aber wenn wir dieses Plugin verwalten, können wir immer noch viel Zeit wie eine Liste, sagen wir, ich möchte eine Musikplayer-App erstellen. Also kann ich einfach hier suchen, oder ich scrolle einfach durch dieses Fenster und du kannst sie in ein oder ich scrolle einfach durch dieses Fenster Drahtrahmenelement sehen. Ich kann es einfach hier drüben platzieren. Und wir können so hinzufügen. Und lasst uns nur ein bisschen hinzufügen. So können Sie innerhalb einer Minute sehen, dass wir ein Drahtgitter für unsere Musikplayer-App erstellt haben . Dieses Bild ist also eine Art schwarze Liste und macht es darauf hingewiesen. Ich möchte, weil wir im Drahtrahmen nur solche Fahrräder benutzen. Dies ist also das Drahtgitter für unsere Musik-App-Layer. Auf diese Weise können Sie viel Zeit sparen. Ich glaube, ich habe vergessen zu sagen, dass unser Plugin nach den Icons aufgerufen hat. In unseren Forschungs- und Entwicklungsprojekten. Ich benutze dieses Icon-Paket, aber auf andere Weise. Ich bin früher in Säure gegangen, in die Tim-Bibliothek. Und davon habe ich für die Icons benutzt. Und davon benutze ich Icons. Aber indem ich dieses Plugin verwende, kann ich einfach auf klicken, sagen wir, ich möchte diesen Button in meiner App verwenden. Ich kann einfach darauf klicken und dann hier nur eine Dimension hinzufügen . Und das hier drüben. Mit diesem Plugin sparen Sie viel Zeit. Du siehst hier drüben. Das sind also unser Fünf-Plugin, in einem Projekt verwendet werden kann, um viel Zeit zu sagen. Also das ist es für die Relativitätstheorie. Und wir sehen uns im nächsten. 23. Was ist Wireframing?: Willkommen zurück zu einem anderen Video. In diesem Video werden wir erfahren, was Wireframe-Typen von Wireframe und der beste Spektrum-Spot bei Frauen sind. Wo auch immer Sie wissen, die Website ist die vereinfachte Auflösung der Grundstruktur, oder vielleicht nennen wir sie das Skelett AAP, Website oder App. Wireframes der Andacht. Etwas, das ein klares Bild in Bezug auf die Benutzerfreundlichkeit gibt . Styling ist sehr wichtig, aber zu Beginn des Designs kann es etwas ablenken. So kann es den Fokus von Funktionalität auf etwas Fantastisches wie Farbe oder Pitcher verlagern. Da Wireframes so einfach sind, konzentriert es sich weiterhin auf das wichtige Thema wie Website-Funktionalität Benutzerfreundlichkeit und Benutzererfahrung. Es gibt beträchtlich zwei Wireframing-Schichten. Das Glück ist Low-Fidelity-Wireframing, und das zweite ist High-Fidelity-Wireframing. Im Low-Fidelity-Wireframing werden Entwicklungen mit grauen Formen wie Rechteck und Kreis oder einfach nur Linien dargestellt . Und in einem High-Fidelity-Level rät die Benutzeroberfläche ein bisschen mehr Details, wie Markenlogo, tatsächliche Texttextur oder Schatten. Und so versuchen Sie im Fall von Textur und Schulden immer, echter Inhalt zu sein , der schließlich auf der Hauptwebsite statt der Mai-Person sein wird . Könnte dies sein, können Sie eine echte Perspektive des Designs bekommen. Sprechen wir nun über die Best Practice von vorn. Die erste Regel hier geht es um Ästhetik. Und das soll es einfach halten. Ich meine, ganz einfach. Ausgegeben verwendet keine Farbe anstelle von Weiß, Schwarz und Grau verwendet höchstens zwei Formen im gesamten Design. Und natürlich benutze eine einfache Schrift wie Roboto oder Plateau. Nichts Ausgefallenes. Sie repräsentierten Grafiken und Bildboxen. Wireframe ist die Phase, in der Sie Bildschirme alle Versionen des Designs für verschiedene Arten von Geräten betrachten alle Versionen des , entweder für Desktop oder Handy oder Tablet. Außerdem müssen Sie die Ausrichtung dieses Modells berücksichtigen. Geräte wie Telefone oder Tablets. Sie müssen auch den Kontext des Benutzers des jeweiligen Geräts im Auge behalten . Am Ende gibt es, egal welche Technologie oder Software Sie verwenden, viel besser als ein einfacher Stift und Papier. Wenn Sie ursprünglich ein UI-Modal entwerfen möchten, beginne ich mit einem Bleistift mit dem guten alten Papier. Also los gehst du. Das dreht sich also alles um Wireframing. Wie was ist Wireframing Pi. Also Wireframing und Best Practice für Gesundheit. Das ist also ein Fotowiderstand, und ich sehe euch im nächsten. 24. Wireframing mit Figma: Willkommen zurück. In diesem Video werden wir lernen, wie man Wireframes macht. Aber lasst uns eine neue Datei öffnen. Sie können auf diesen Plus-Button klicken und auf Design klicken. Gut. Okay, benennen wir diese Datei um. Also lasst uns einen Rahmen wählen. Ich werde buchstäblich was ist das Drahtgitter? In diesem Video werden wir also eine niedrige Einrichtung schaffen, indem es als Unterstützung als Low-Hone-Wireframe umgestalten. Nehmen wir an, wir erstellen eine einfache Portfolio-Website. Und wir möchten nur einige Informationen hinzufügen, wie Navigation, Schaltflächen, Bilder, Text und das Logo. Fangen wir also mit dem Logo an. Für Logos. Es gibt einen Kreis zeichnen. Okay, machen wir ein paar Navigationsschaltflächen wie Heimkontakt und darüber. Schieben Sie also das Textmenü und klicken Sie auf den Bildschirm. Der erste ist zu Hause. Lassen Sie uns die Größe der Schrift auf 24 erhöhen. Okay? Lehrplan, halten Sie Alt gedrückt und klicken Sie auf. Okay? Und der letzte für ungefähr so, das wäre Kontakt. Und das letzte geht darum, also haben wir einen vernünftigen Zweifel gemacht. Richten wir sie also zusammen. Halten Sie die Umschalttaste gedrückt, wählen Sie Kontakt und wählen Sie unten über zufällige Gesamtstrukturen aus. Danach Alan sie zusammen vertikal und weniger Alan sie, um den horizontalen Abstand zu verteilen. Okay, also ist diese Navigationsschaltfläche jetzt aneinander ausgerichtet. Und lass uns ein paar Krüge hinzufügen. Nicht gerade Krüge. Also wird es dir sagen, dass ich es getan habe, wir müssen ein Bild hier platzieren. Und dafür können wir ein paar Zeilen hinzufügen. Du bist haltbar, du wirst es wissen. Dieser Raum ist also für das Bild. Okay? So. Und lasst uns ein paar Felder für Text erstellen. Wählen Sie zuerst das Rechteck aus. Und das könnte unser Haupttitelfeld sein, also könnte es dein Name sein. Und dann wähle ein anderes Rechteck. Und in diesem kleineren Rechteck können wir diese Informationen über Sie abrufen. Wie was machst du, welche Art von Arbeit machst du? Und ich lasse es, und sagen wir mal, du willst einen Link hinzufügen. Und nennen wir sie eins nach dem anderen. Das könnte also betitelt werden. Das ist also der Absatz. Dies ist die Schaltfläche „Beitreten“. Nachdem Sie also Wireframe erstellt haben, können Sie gerne ein Projekt wie dieses erstellen, das ich hier gemacht habe. Sie können dieses Projekt sehen. So kannst du diese erste Seite sehen. Es ist genau wie unser Drahtgitter. Dies ist für das Logo, ist für die Navigationsschaltflächen mit niedrigerer Summe. Und dieser Raum ist für ein Bild. Du kannst sehen, dass dies das Bild ist und es verzweifeln. Und der letzte ist „Jetzt beitreten“ -Button. So können Sie ein Drahtgitter in fema erstellen. Lassen Sie uns ein einfaches Drahtgitter über die Schaltfläche „Einloggen“ erstellen. Lass uns ein Telefon wählen. Es gibt einen Draw-Kreis. Machen wir ein Rechteck. Login-Eingabe oder eine Texteingabe. Lassen Sie uns ein anderes Rechteck erstellen oder wählen Sie einfach dieses Feld und diese Alt aus und ziehen Sie es nach unten. Und lasst uns die Farbe ändern. Der Benutzer wird es also nicht tun. Also müssen wir in diesem Feld unser Inventar ausfüllen und uns loggen, und lassen Sie uns einen Text-Benutzernamen eingeben. Lassen Sie uns also die Schriftgröße verringern, um Dienstprogramme zu sein. Lass es uns wieder gut machen wie 14 O K. So. Wissenschaftler, so. Dies ist der Login-Button, also fügen wir hier Text hinzu. Vergrößern wir die Größe der Schriftart. Wählen Sie die aktuellen ist 14 Listen aus, damit das Reflektieren in Miller verschoben wird. Und wir können hier wie ein Passwort-Button weitermachen. Lasst uns das also ein bisschen klein machen. Wie zehn. Okay, so. Und wir können ein paar Kisten machen. Oder hier, Angenommen, der Nutzer möchte sich über Google, Facebook, auf Twitter einloggen . Also kann er das tun. Wählen wir ein Rechteck wie dieses aus. Ziehen, ziehen. Und in diesem Feld, fügen wir hinzu, das ist für das Facebook. Dies schließt die Formulare ein. Und das ist für Google. Momentan richte ich sie manuell aus, aber Sie können diese Belastung verwenden, wie man sie benutzt. Das nächste letzte ist Twitter. Ich werde so sein. Also richten wir sie aus. Diese Schaltflächen sind jetzt aneinander ausgerichtet. Und Sie können sehen, wie unsere Login-Seiten so erstellt werden. Und Sie können hier eine weitere Option wie den Anmelde-Button hinzufügen . Wählen wir also ein anderes Dreieck oder wählen Sie einfach dieses Feld aus. Und diese Berechnung wie diese. Text könnte angemeldet sein. Das ist also der Login für Wireframe-Telefone. Dies ist also das Drahtgitter für unsere Anmeldeseite für die Anmeldeseite. Sie können also sehen, dass ich ein Projekt erstellt habe , dass ich diesen Biofilm als Referenz verwende , um ein Projekt zu erstellen. Sie können also sehen, dass dies unsere Anmeldeseite ist. Sie können also sehen, dass dies die Anmeldeseite ist und dies ist die Anmeldeseite. Aber mit diesem Drahtgitter habe ich zwei Dinge an einem Ort gemacht, wie Login, bayessche Anmeldeseite auf einer Seite. Wenn Sie möchten, können Sie dies tun oder Anmeldeseiten wie diese erstellen, getrennt für die Anmeldeseite und separate Anmeldeseite für Organisationen und Auditing wie Google, Facebook-Schaltfläche. Hier unten. Sie können im Logo-Wireframe wie Facebook, Google und Twitter sehen , dann ist dies unser Logo. Also in diesem Projekt, was ich löschen möchte, habe ich dieses Logo vergrößert und auch im Hintergrund ein Bild hinzugefügt. Einige Effekte und alle lernen. Dies ist also das Low-Hone-Wireframe. In diesem Drahtgitter, also auf diese Weise von Wien aus, wichtige Dinge wie virtuell unser Logo, das unsere Login-Box-Version unserer Anmeldung und der Benutzername, das Passwort und all das sein wird unserer Anmeldung und der Benutzername, das . So können Sie Wireframe in Figma machen. Also hat V hier eine einfache Webseite erstellt, und damit auch das Smartphone. Okay, du kannst dich im nächsten Video sehen. Ich zeige Ihnen, wie man Wireframe macht , in dem ich Wireframe dot cc aufgerufen habe. Also bleib dran darüber. Das ist also welche Religion. wir sehen uns bei der nächsten. 25. So erstellst du Wireframe in wireframe.cc: Willkommen zurück. In diesem Video werden wir erfahren, wie man Wireframe, Wireframe Dot cc macht. Vorläufig lernen wir also, wie man Wireframe in Figma herstellt. Und daraus habe ich auch einige Projekte erstellt. Sie können diese Webseite und diese Anmeldeseite und die Anmeldeseite sehen. Lassen Sie uns also ein Drahtgitter auf dieser Website namens Wireframe CC erstellen. Dies ist eine der einfachsten Möglichkeiten Wireframe für Ihre Projekte zu erstellen. Gehen Sie also auf diese Website, sehen Sie den Link oder hier. Wenn Sie möchten, gehen Sie auf diese Website, es wird nach einer ähnlichen Anmeldung gefragt. Wenn Sie möchten, können Sie sich anmelden, aber ich schlage Ihnen vor, diesen Prozess zu überspringen. Und nachdem das besessene übersprungen wurde, wird die Schnittstelle so aussehen. So können Sie auf der linken Seite sehen, wir erhalten Optionen wie von hier aus können wir verschiedene Geräte auswählen, z. B. für den Desktop oder die Software. Wir können diese Vorlage oder V verwenden, wenn Sie möchten, erstellen Sie einige Apps für Ihr Tablet, Sie können dieses Format wählen. Und das ist auch für das Smartphone. Sie können diesen wählen, aber ich wähle gerne diesen, den vierten. Lassen Sie uns also eine einfache Anmeldeseite für unser Smartphone erstellen. Nachdem Sie die Maus losgelassen haben, können Sie sehen, dass ich diese Option bekomme. Also möchte ich, dass diese Portion eine Schachtel sein sollte. Also wähle ich jetzt diese Box und die Box aus. Du kannst also, wenn du willst, kannst du dir ansehen, als würde ich das einfach nicht mögen. Lassen Sie uns also sagen, dass ich in diesem Abschnitt hinzufügen möchte. Und Sie können diesen Bild-Button sehen. Ab dieser Stunde ist dies der Bildbereich. Wir müssen ein Bild hier rüberbringen. Und wir können hier so ein einfaches Logo-Symbol erstellen. Wenn Sie möchten, können Sie dies in die mittlere Ebene oder links oder rechts setzen. Im Moment legen wir 0 hier ein. Lassen Sie uns Boxen für unsere Anmeldeseite erstellen. Stroh. So eine einfache Schachtel. Dies ist also die Box für unseren UserInput. Zeichnen Sie ein weiteres Feld und wir können einfach dieses Feld auswählen und Einfügen wie Figma kopieren , indem Sie das Kästchen auswählen und Alt gedrückt halten und Donald so ziehen. Und wenn Sie darauf doppelklicken, erhalten wir eine Farbpalette. Von hier aus. Sie können verschiedene Farben wählen. Dies ist also für Login-Schaltflächen, also wählen wir diese Farbe aus. Fügen wir also Text hinzu. Das ist also die Textschaltfläche. Also und das ist der Login-Button, weniger Adresse 200 hier. Und dann ändern wir die Farbe op-Eds. Oder Sie können diesen Login fett oder kursiv machen. Und wenn Sie möchten, können Sie diesen Text so unterstreichen. Und je weniger die Textfarbe hier ändern. Derzeit ist es also grün, also machen wir es so weiß und lassen Sie uns die Schriftgröße vergrößern. Dies ist unser Login-Button, und dies ist das Textfeld für Benutzernamen. Lassen Sie uns eine andere Textur oder Vorwärts ermöglichen. Halten Sie es gedrückt und ziehen Sie es nach unten. Lassen Sie uns diese Farbe in Schwarz ändern und bei der Schriftgröße fett und unterstreichen bleiben, benennen Sie sie in Forward-Passwort um. Und wir können uns wie andere Optionen wie Facebook, Google und Twitter einloggen . Also können wir diese Boxen auch hier hinzufügen. Also lasst uns sie hinzufügen. Und wenn du sie miteinander vermischen willst , kannst du das auch tun. Markieren Sie das Kästchen oder erreicht. Setup. Die zweite, die dritte Box. Und Sie können sehen, dass wir haben, wir haben diesen Element-Button. Klicke drauf. Und Sie können sich entsprechend Ihrer Anforderung anpassen. Also möchte ich sie unten aneinander ausrichten. Also klicke ich unten. Es ist also ausgerichtet. Jetzt fügen wir Text hinzu. Das ist also der Facebook- oder Google-Button. Und wir können Macos mögen, einfachen Text. Hier drüben. Wählen Sie diesen Text aus, halten Sie die Alt-Taste gedrückt und ziehen Sie diese Werkzeuge nach unten. Und wir können Textbreite wie Login hinzufügen. Der Nutzer wird wissen, dass wir uns so mit Facebook, Google und Twitter einloggen können . Das ist also das einfache Drahtgitter mit Katelyn, dieses Kabel von Ihrer FCC. Und wenn Sie auf die Schaltfläche Speichern klicken, wird es für Sie gespeichert. Und du kannst einfach, wenn du mit deinem Projekt arbeitest, so. Sie können also eine Referenz daraus nehmen. Wie wo sollte Logo sein, wo es sein soll Bild, Box, wo sollten wir uns anmelden Button und Forward Postural Button und all das. So können Sie Wireframes oder CC-Website verwenden, um einfache und schöne Wireframes zu erstellen. Ich denke, es ist einfacher als Figma. Oder Sie sehen, dass wir in Figma einige Wireframes erstellt haben. Aber ich denke, es ist ganz wie wir, ähnliche Erfahrungen, aber ich benutze diese Website namens Y aus North Jersey gerne namens Y aus North Jersey weil sie wirklich einfach zu bedienen ist. Deshalb verwende ich diese Website lieber. Es hängt also völlig von dir ab. Wenn Sie es nicht verwenden, verwenden Sie möglicherweise sogar Figma oder wenn Sie diese Website nutzen. So können Sie Drahtgitter-Türsystem erstellen . Das war's also für das heutige Video und wir sehen uns im nächsten. 26. Team und Erstellung eines Teamprojekts: Willkommen zurück. In diesem Video lernen wir, wie man ein neues Team erstellt. Wie Sie sehen können, haben wir hier eine Option namens Neues Grab erstellen. Also klick drauf. Und du kannst es nennen, wie du willst. Nennen wir es also Test und klicken Sie auf Team erstellen. Okay, jetzt kannst du deine Teammitglieder hinzufügen und sie mithilfe der E-Mail-ID hinzufügen. Momentan arbeite ich solo, also füge ich keine Bild-ID hinzu. Also überspringe ich vorerst. Also werde ich es so lassen, wie es kommt, wähle einen Plan aus. Wir haben also Optionen wie eine professionelle Organisation von Startup. Also arbeite ich alleine, also wähle ich das kostenlose aus. Wie Sie sehen können, fallen seltsame Alignment-Dateien in den Figma-Dateien im Team, ultimative feste Edelsteindatei und das One-Team-Projekt. Also lasst uns das kostenlose wählen. So können Sie sehen, dass unser Team erstellt wurde, das heißt Test. Lassen Sie uns also ein Projekt erstellen. Sie können auf diesen Plus-Button klicken und Dateien wie diese M-Datei hinzufügen. Wenn Sie eine Edelsteindatei repariert haben, können Sie diese auch importieren, wenn Sie eine Datei haben. Sie können auch die Vorlage durchsuchen und zu Ihrem Projekt hinzufügen. Bisher wähle ich jetzt die Designdatei. Benennen wir es zuerst um. Apk. Okay, wenn ich wieder in ein ähnliches Projekt gehe, kann man im Teamprojekt sehen, wie Geschmacksepos entsteht. In Teams können wir also so viele Dateien hinzufügen, wie wir möchten. Nehmen wir an, ich möchte ein einfaches Objekt erstellen, aber im Website-Formular. Also klicke ich auf diese Neue und Designdatei. Und benennen wir es in Taste um. Entschuldigung, dass ich falsch geschrieben habe. Das. Geh nach Hause. Und Sie können sehen, dass wir Test Web und Test haben. Es gibt also den Vorteil, Teams zu verwenden. Okay, lass uns in dieses Team gehen. Und von hier aus können Sie auch hinzufügen, worum es bei dem Projekt geht wenn Sie wie Lebensmittel bauen, die m liefern, können Sie eine Beschreibung dafür hinzufügen. Und wenn Sie ein Mitglied einladen möchten, können Sie auch von hier aus einladen. Und von hier aus sehen Sie , wer die Achse dieses Projekts hat. Wie momentan arbeite ich. Ich bin der Einzige, der Zugang zu diesem Projekt hat. Und Sie können dies auch einige Einstellungen haben , wie wir den Namen ändern möchten. Sie können es auch von hier aus ändern, Icon, Profil-Handle. Und wenn du es diesmal machen willst , kannst du es auch löschen. Und wenn Sie einige Bibliotheken aktivieren möchten, können Sie dies auch von hier aus tun. Das ist also Plan und die Abrechnung ist für Profi. Sie können es von hier kaufen. Also lasst uns jetzt ins Projekt gehen. Wenn Sie möchten, können Sie dieses Projekt auch als Lieblingsprojekt markieren , indem Sie auf Start klicken. Und Sie können Ihr Projekt auch teilen indem Sie die Molarität verwenden. Sie können von hier aus mehrere E-Mail-IDs hinzufügen. Oder du kopierst einfach diesen Link und füge ihn deine WhatsApp-Gruppe oder in Gmail ein. Angenommen, Sie möchten dieses Team löschen, Sie können einfach zu diesem Team gehen , das geschmackvoll ist und mit der rechten Maustaste darauf klicken. Und wir haben Optionen wie Umbenennen, Ändern, Icon und Löschen. Also werden wir löschen. Und wir müssen diesen Teamnamen hinzufügen. Das sind Tests. Und klicke auf Team löschen. So können Sie Teams verwenden, um mehrere Dateien, Apps, Websites und all das zu erstellen , zu projizieren . Das ist also wichtig für Julia und ich werde euch im nächsten sehen. 27. Arbeiten in der Realzeit zusammen (Teams): Willkommen zurück, verbessert die Sorge. Wir werden lernen, wie man ein Team erstellt. Auf diese Weise können wir die Macht des Teams nutzen. Was ich also mit Power meine, ist, dass fema eine Plattform ist, auf der Team gemeinsam entwirft. Es vereint jeden in Ihrem Abfrageprozess. Es erweckt Ihre Idee zum Leben. Nehmen wir an, Ihre Teamkollegen auf der anderen Seite der Welt. Er oder sie kann gleichzeitig mit Ihnen am selben Projekt arbeiten . Also gibt es das Pulver-Team in Figma. Ich zeige dir, wie das geht. Klicken Sie also auf Ihren Teamnamen. Nehmen wir an, dass ich mich gerade für dieses imaginäre Programmierteam entscheiden werde . Und Sie können sehen, dass wir eine Option haben, die Mitglieder genannt wird und weniger einige unserer Teamkollegen einladen. Und von hier aus kannst du auch einen Link von der Gmane mit ihnen teilen oder ihn in der WhatsApp-Gruppe teilen. Und Sie können einige Einstellungen für sie festlegen. Nehmen wir an, wenn Sie dieses Projekt für den Kunden freigeben möchten und die Einstellung so einstellen können , wie er es einfach so anzeigen kann und Sie können den Link freigeben. Und Sie möchten diesen Link mit DVR-Bedarf teilen als Sie wählen können, bearbeiten können. Und wenn Sie eine Melodie hinzufügen möchten, können Sie sie auch von hier aus hinzufügen. Fügen wir eine einmalige Image-ID für meine Teamkollegen hinzu. Sie können die Eingabetaste drücken oder Komma drücken. Komma und Sie können sehen, dass Sie von hier aus eine weitere E-Mail-ID hinzufügen können . Und Sie können auch einige Einstellungen für sie festlegen, wie Sie sie festlegen können, dass sie standardmäßig bearbeitet werden können. Und wenn Sie diesen Einzelhandelstrend teilen möchten , können Sie wählen, kann weniger die Zulassung des Fliegers aufgeben und den nach innen schicken. Sie können sehen, dass das Geräusch gesendet wird. Schließen Sie diesen auf seinem Laptop oder PC, er wird eine Benachrichtigung für die Einladung erhalten. Von dort aus kann er unsere Einladung annehmen. So können Sie bei seiner Beschäftigung sehen, dass er unser Team hat. Er kann alle Projekte sehen. Angenommen, wir möchten dieses Projekt gemeinsam bearbeiten. Sie können also sehen, dass es auf dem Bildschirm nach oben geht. Und du kannst auch sehen, ist unser totaler Krieger. Wenn ich auf dieses Äußere klicke und du siehst, was er macht und was ist aktuell welchem Panel er gerade arbeitet? Angenommen, Sie haben 20 oder 30 Frames und wissen nicht, mit wo er interagiert, indem Sie auf seinen Ausreißer klicken. Wir werden wissen, an welchem Zimmer er arbeitet. Also müssen wir dieses Projekt wie disjoint now reparieren. Und ich möchte auch ein Bild hinzufügen. Also füge ich die Ähnlichkeit hinzu. Also reparieren wir dieses Projekt. So kannst du mit deinen Teamkollegen zusammenarbeiten. So können Sie Ihre Teamkollegen zusammenarbeiten , ist eine der besten Funktionen von Figma. Er kann auf Ihr Projekt zugreifen. Kannst du bekommen, du kannst dich sehen , wenn er eine andere Seite der Welt verliert. Er kann zehn Tage , um gleichzeitig an Projekten zu arbeiten. Das ist also die Vorkenntnissicht, und ich sehe euch in der nächsten. 28. Wireframing für LattoFatto: Willkommen zurück. In diesem Video werden wir Wireframe für unser Projekt erstellen, das bei der Online-Vollbestellungsantrag ausgeht. Sie können also sehen, dass die Anwendung so aussieht. Ist es das letzte Projekt? Erstellen wir also ein Drahtgitter dafür. Dadurch wird eine neue Seite erstellt. Klicken Sie auf das Plus-Symbol. Entwerfen Sie eine Datei. Also benennen wir es um. Zuallererst brauchen wir Frame. Sie können F drücken oder in diesen Abschnitt gehen und Frame auswählen. Und lasst uns das iPhone 11 Pro Max-Rahmen auswählen. Im ersten Frame wollen wir also nur den Markennamen zeigen , der über zwei geführt wird. Lassen Sie uns also einige Komponenten dafür erstellen. Lassen Sie uns zuerst noch ein paar Frames erstellen. Okay, unsere fünf Frames werden jetzt erstellt. erste Frame wird also unsere Markennamenseite sein. Und das zweite ist Anmeldeseite LAN, dritte ist die Anmeldeseite. Und in vollem Rahmen wollen wir wie Narren hinzufügen, wir können über diese App wie Burger-Pizza und gebratenes Hühnchen bestellen und all das. Also denke ich, dass wir den fünften Rand nicht brauchen, also lasst uns das machen. Drehen Sie den Rahmen M auf Ihrer Tastatur um. Der Rahmen ist jetzt digital. Also haben wir jetzt vier Frames, lasst uns ein paar Komponenten erstellen. Wählen Sie das Rechteck aus, zeichnen das Rechteck wie folgt und fügen Sie unseren Text hinzu. Es wird also unser Markenname sein. Die Schrift ist zu klein. Schrift. Gehe zu diesem Endfeld und erhöhe die Schrift auf 36. Okay, lass uns nur die Schrift und das Zentrum haben. Dies ist also unsere erste Komponente. Wählen Sie also sowohl das Rechteck den Text aus, um mehrere Dinge auszuwählen. Sie wissen, dass wir die Umschalttaste gedrückt halten und den Text und das Rechteck drücken müssen, und Sie müssen Strg G drücken, um eine Gruppe zu erstellen. Wenn ich mich also so bewege, dann bewegen sich beide Dinge zusammen. Nehmen wir an, Sie bilden zunächst keine Gruppe, ich muss die Gruppierung aufheben. Okay? Wenn ich das also verschiebe, kannst du sehen, dass der Markenname nicht mit diesem Rechteck kommt. Lasst uns fünf V gruppieren. Bisher gruppieren Sie die Rechteckform, wählen Sie die Rechteckform, halten Sie die Umschalttaste gedrückt , wählen Sie den Text aus und drücken Sie Strg G. Und das ist jetzt eine Gruppe. Wenn ich mich also auf dem Bildschirm so bewege, kannst du sehen, dass sich beide Dinge bewegen, um sie weniger Kurven zu machen. Also habe ich dir schon gesagt, wie man Komponenten herstellt. Wählen Sie Ihr Element aus und gehen Sie zum Menü der oberen Leiste und wählen Sie diese Diamant-Schaltfläche. Und jetzt ist dies Ihre Komponente, also können Sie sie mehrmals in Ihrem Projekt verwenden. Und Sie können auch über dieses Asset-Panel zugreifen. Sie können den Markennamen sehen. Lasst uns einen zweiten Gouverneur abgeben. Das wird unser Image sein. Lass uns ein Rechteck wählen. Die Abkürzung ist r. Und lasst uns ein perfektes Quadrat machen. Halte die Umschalttaste so. Und lasst uns etwas hinzufügen. Bist du am Rande? Sie können das Farbpolygon sehen und das Quadrat ist ein Baum, also müssen wir die Farbe des Polygons ändern. dazu das Wählen Sie dazu das Polygon aus, gehen Sie in das Entwurfsfenster, klicken Sie auf die Füllung und bewegen wir diese Cursorwerkzeuge so weiß. Der kleinste wie dieser. Okay, lass uns das duplizieren. Okay. Lass uns etwas machen, hat die Berge und lass uns eine kleine Summe wie diese machen . Wir müssen, wenn wir die Farbe dieser Sonne auf Weiß ändern , so. Okay? Das ist also unser Image. Und wähle alle Dinge aus und drücke Strg G. Also dieses Ding ist jetzt Gruppe. Und lassen Sie uns dieses Element in eine Komponente verwandeln. Dies ist also unsere zweite Komponente. Lassen Sie uns also eine Profilbild-Komponente erstellen. Wir werden Kreise benutzen. So können Sie o drücken oder wir können diese Ellipsentaste wählen. Fügen wir dieses Bild hinzu. Zuallererst müssen wir es klein machen. Jetzt fügen wir dieses Bild in den Kreis ein. Sie können jedoch sehen, dass das Bild nicht sichtbar ist , da es sich im ausgewählten Bild befindet. Klicken Sie mit der rechten Maustaste darauf. Und Sie können die Option „Bring to Front“ sehen. Und Sie können die Bilder jetzt so vorne sehen. Wählen Sie alle Dinge aus und drücken Sie Strg G, um sie zu gruppieren. Es ist jetzt gruppiert und lassen Sie uns eine Komponente erstellen. Okay, dieser ist jetzt eine Komponente. Dieses Element ist also für das Profil gedacht, das heißt, Lassen Sie uns anmelden und registrieren, Navigationsleiste. Dafür brauchen wir ein Rechteck. Stellen wir sicher, dass es nur mit unserem Rahmen passt, damit es perfekt zu unserem Bildschirm passt. Ich glaube, wir mussten ein bisschen sinken. Jetzt fügen wir ein Textbild hinzu. Als Erstes ist die Anmeldung. Und die zweite ist die Anmeldung. Richten wir sie also zusammen. Stellen Sie alle Dinge ein. Erstens, die Anmeldung, also das Rechteck jetzt die Schaltfläche „Registrieren“. Gehe jetzt zum Design-Panel und weniger Schuld Alan sie unten. Richten wir sie nun vertikal aus. Okay, es ist jetzt online. Das nächste, was wir machen müssen, ist Login-Button und die Anmeldeschaltfläche. Also notwendigerweise diskretisiert, dupliziere es durch Drücken von Alt. Und Photon wird unser Login sein. Ich habe vergessen, diese Navigationsleiste in eine Komponente zu verwandeln. Wählen Sie alle Dinge aus, Control G, und wählen Sie auf dieser LeBron-Schaltfläche aus. Also dieses Ding ist jetzt Bestandteil. Lassen Sie uns diese Seite auch zur Komponente machen. Dupliziere diese Belastung. Und benennen wir es um, um uns anzumelden. Dies ist also unsere letzte Komponente, und wir werden einige Menüschaltflächen wie Hamburger, einige Symbole wie Facebook, Google und Twitter benötigen einige Menüschaltflächen wie Hamburger, . Im Tim-Bibliotheksvideo habe ich es dir wirklich gezeigt. Wir haben einige Icon-Pakete gestartet, damit wir dies verwenden können sie in diesem Projekt verwenden können. Um auf diese Dinge zuzugreifen, gehen Sie zu Asset und klicken Sie auf dieses Buchsymbol. Sie können das Symbol plus extra sehen, klicken Sie auf diese Umschaltfläche. Sie können sehen, dass wir diese Icons verwenden können. Also brauchen wir diese bescheidene Aminoikone. Also lasst uns das bewegen. Und Sie können auch wie das erste, zweite, dritte 1 Google suchen , aber es ist nicht verfügbar. Also können wir andere Icons wie okay benutzen, diesen Globus, Okay, wir haben jetzt diese vier Icons. Machen wir unser Drahtgitter. Also haben wir alle Komponenten erstellt, also werden wir sie in unserem Biofilm verwenden. Also auf der Titelseite UP wie man einen Markennamen hinzufügt. Also schreibe ich das so. Und lasst uns das vertikal ansprechen. Okay, es ist, ich bin gerade jetzt, benennen wir es in eine Marke um. Und das zweite Reframing wird die Unterzeichnung sein. Und die dritte ist unsere Anmeldeseite. Und der letzte ist ein Minimum. Okay, also haben wir jetzt vier Seiten, die erste ist fertig. Im zweiten Prim möchte ich also , dass ich oben ein Bild hinzufügen möchte . Also strecken wir es so aus. Und ich möchte auch einen Markennamen nennen, dieses Image. Ziehen wir das also und fügen wir einen zufälligen Namen hinzu. Unser UI-Entwickler wird es also wissen. Das ist also abgebildet und dies ist der Markenname. Ich denke, die Farbe ist gleich, also müssen wir die Farbe des Markennamens ändern. Wählen wir also die Master-Komponente aus. Machen wir es so dunkler. Und lasst uns eine Anmeldeseite erstellen. Also benötigen wir diese Navigationsschaltfläche. Als nächstes möchten wir den Benutzernamen mögen. Lasst uns also eine Linie ziehen. Also brauchen wir zwei Zeilen. Der erste ist für den Benutzernamen und der zweite ist für das Passwort. Und wir müssen einen Login-Button hinzufügen. Halte so zum zweiten Frame. Und fügen wir unseren Login mit Buttons hinzu. Das sind Facebook, Google und Twitter. Richten wir sie also so aus, dass sie zuerst aufstehen. Lasst uns sie also größer machen. Viertens ist einer über Facebook. Zweitens wird Google sein. Richten wir sie also zusammen. Wähle Facebook, halte die Umschalttaste gedrückt, wähle aus und wähle Twitter aus. Zuerst müssen wir den Boden ansprechen und sie weniger vertikal ansprechen. Okay? Und fügen wir einen horizontalen Abstand hinzu. Okay? Diese Dinger sind also Alana. In diesem Fall haben wir also ein Problem. Also unser Ich weiß nicht, dass dies die Anmeldeseite ist , weil alle Dinge gleich sind. Was wir also tun können, ist, dass wir die Unterzeichnung ein bisschen verarschen können. Konnektivität ist also regelmäßig. Machen wir es kühn. Okay, jetzt unsere Daten pro gehören, das ist die Anmeldeseite. Also auf der nächsten Seite müssen wir ein paar Dinge machen. Das ist wie dieser Markenname. Wir müssen diese Bilder auch verwenden. Also kopiere ich das, beides. Wir sind fast fertig. Das einzige, was bleibt. Benutzer melden sich also jetzt an. Es ist also das Profilsymbol. Fügen Sie einen Hamburger hinzu ist einer so. Wählen wir also den Plus-Button und rufen wir an. Dies macht einige Kategorien aus. Also lass uns ein Bild für dich hinzufügen. Lass es uns kleiner machen. Und richten wir sie zusammen. Halten Sie die Umschalttaste gedrückt wählen Sie die zweite und die dritte aus. Fügen wir hinzu, ist unten und dann vertikal. Und fügen wir einen horizontalen Abstand hinzu. Okay? Also lasst uns Kanten wie diese haben, okay? Und lasst uns etwas Textur hinzufügen. Wählen Sie Kategorien aus, halten Sie Alt. Und sagen wir ein Bild in gefälscht. Verringern wir die Schriftgröße. Halten Sie Alt gedrückt und ziehen Sie in Richtung der zweiten Kategorie. Und benennen wir es in Pizza und Endstation um. Richten wir also die Schriftart zusammen. Jetzt ist es aneinander ausgerichtet. Glätte sie nach oben, also okay, das ist perfekt. Und so sind wir momentan dran wie sagen wir, derzeit sind wir auf Bugger Minow. Lassen Sie uns dieses Bild ein bisschen blau machen. Derzeit in Bogle befinden wir uns derzeit in einem großen Teil eines Abschnitts. Und sagen wir, wir haben nur zwei Möglichkeiten für den Falsch auf der ersten Seite. Mach einfach noch einen wie diesen. Und lassen Sie uns dieses Bild vergrößern. Da der Benutzer mit einem bekannten, haben wir derzeit diesen Bullen ausgewählt. Und wir können diesen Text auch zu einer Schüssel machen. Unser Entwickler wird also wissen, dass der Kunde derzeit in der gefälschten Rubrik befindet. Und wir können dafür ein paar Preise hinzufügen. Nehmen wir an, dieser Burger ist für 15 Dollar. Hör zu, gib den Schriftseiten. Für die 15,1 Dollar. Lass es uns auf 244 Sekunden ausgleichen. Lass es uns wieder gut machen, ich weiß, dass diese ziemlich teuer sind. Das, machen wir es normal. Weil er der erste Burger war oder ausgewählt wurde. Und das geht so in den Text nach oben ein. Okay, also lasst uns einen Abschnittskreis hinzufügen. Unser Benutzer wird also wissen, dass wir mehr Möglichkeiten haben. Und wähle den ersten Kreis aus. Lasst uns die Farbe dafür ändern. Unsere Daten können wir also wissen, dass unser Kunde derzeit dazu gehören wird , dass er oder sie auf der Vorderseite ist. Wenn er also wischt, wird er auf der zweiten Seite wie in diesem Abschnitt sein. Dies ist also der Drahtgitter für unser erstes Projekt. Das ist ein leichteres Fotoprojekt. Sie können unser Abschlussprojekt sehen. Dies ist unser Markenname. Sie können den Markennamen plus Bild, Login, Anmeldung , Benutzernamen, Passwort-Login und Login mit Schaltflächen wie Facebook und Google anzeigen. Gleiche gilt für hier. Sie können sehen, dass wir diesen Login auch wie rosa Farbe gemacht haben, da unser Benutzer weiß, dass er sich derzeit auf der Anmeldeseite befindet. Und auf dieser Seite erfahren Sie, dass er auf der Anmeldeseite ist. Und wir können sehen, wie die Kategorien Bogle the Huhn“ ausstellen. Und Sie können sehen, dass wir diesen Burger hervorgehoben haben. Benutzer mit Long ist derzeit in der Bubble-Kategorie und er hat dieses Logo ausgewählt. Der erste ist Pre-Print hörbar. Und du siehst, dass ich auch die Karte hinzugefügt habe, damit er sich das Profilbild und die Hamburger Amino ansehen kann . Und wir können auch die Suchleiste hinzufügen. Dies ist also der Drahtgitter für unser erstes Projekt. Im nächsten Video werden wir dieses Drahtgitter in dieses Projekt integrieren. Ich weiß, dass dies das sehr niedrige Ende des Videos ist, aber wir müssen nur Dinge per Drag & Drop ziehen. Und ich habe die Summenposition des Elements so gemacht. Sobald Sie Ihr Drahtmodell erstellt haben, können Sie Ihr Projekt schneller gestalten. Also werde ich jedes Video im separaten Teil teilen, wie im ersten Video, ich werde diese plus 2 und n Anmeldeseite in der ersten Zeile hinzufügen. Und das zweite Video füge ich ein Video zur Anmeldeseite hinzu. Und im Gegenzug werde ich hinzufügen, dass die Lesbarkeit der Meno-Seite kürzer wird. Und es wird auch leicht zu verstehen sein , damit du es buchstäblich musst, und ich werde euch im nächsten sehen. 29. Brand für LattoFatto: Willkommen zurück. Früher hätten wir dieses Drahtgitter angefertigt. Lassen Sie uns jetzt eine Benutzeroberfläche für unsere App erstellen. Also geh zu Home, erstelle ein neues Team. Nennen wir es. Du kannst es nennen, wie immer du willst. Momentan nenne ich, dass es dazu geführt hat, dass sie ein App-Projekt eins hat, ein Team erstellen. Also arbeite ich gerade, also überspringe ich jetzt weiter. Momentan verwende ich eine kostenlose Version. Deshalb werde ich wählen, Daten auswählen. Wenn Sie das Verbot von Pflanzen haben , können Sie sie wählen. Also klicken wir auf, um zu starten. So können Sie unseren Teamnamen und die Farbe unseres Teams sehen. Lass uns zum Wireframe gehen. Und lassen Sie uns dieses Drahtgitter zu unserem Team verlagern. Sie können in der Farbe unseres Teams und des Teamprojekts sehen. Okay, unsere Akte ist ein Klick auf Teamprojekte. Sie können unser Drahtgitter sehen. Ich denke, wir haben das Löschen dieses gesehen und auf Teamprojekt geklickt und auf Plus-Button geklickt und eine Designdatei erstellt. Sie werden also nicht denken, dass das Drahtgitter anders aussieht , weil ich diesen vorherigen Biofilm versehentlich gelöscht habe. Deshalb habe ich dieses Drahtgitter wieder erstellt. Deswegen sieht es also anders aus. Also benennen wir es um. Lass uns einen Rahmen wählen. Drücken Sie F, wählen Sie iPhone 11 Pro Max. So können Sie im Drahtrahmen sehen die erste Seite für unseren Markennamen steht. Das führt also zu fetten. Erstellen wir also den ersten Frame und benennen wir ihn um. Okay, du kannst es nennen, wie wir wollen. Wählen wir also einen Text aus. Okay, lassen Sie uns die Schriftgröße dieses Textes auf vier erhöhen . Okay? Und wählen wir die Schriftart , um sie explizit in der Mitte zu sensibilisieren. Okay, richten wir diese Schriftart vertikal und dann horizontal aus. Okay, es ist jetzt in der Mitte ausgerichtet. Wählen Sie den Rahmen aus und ändern wir die Farbe davon. Derzeit ist die Farbe also weiß. Also werde ich das Rot wählen, also momentan den Feststoff. Also lasst es uns einen Farbverlauf machen. Wählen Sie also eine lineare zweite Farbe in Poeple. Oder wir wählen eine beliebige Farbe aus. Erhöhen wir die Deckkraft der zweiten Säule. Okay, jetzt sieht es cool aus. Wenn du willst, kannst du nur deinen Farbverlauf so hinzufügen. Okay, das sieht cool aus. Okay, ich glaube, ich wähle eine andere Schriftart aus. Also speichere die Schrift. Und das ist das, was wir für dieses Projekt benötigen. Okay? Also muss ich sie vertikal und horizontal in der Mitte geben . Okay? Jetzt lass es uns weiß machen. So sieht es also nicht besser aus. Okay, unser erster Frame wird jetzt erstellt, das ist Markennamenseite. So können Sie im Drahtgitter sehen, dies ist der Markenname und dies ist die Seite. Im nächsten Video erstellen wir diese Anmeldeseite. Und wir sehen uns im nächsten. 30. Anmelde dich: Willkommen zurück Früher hätte diese zufällige Seite gemacht. In diesem Video werden wir die Anmeldeseite erstellen. Also lasst uns einen Rahmen wählen. Iphone 11 Pro Max. So. Benennen wir es in wie signieren um. Wie Sie in Wireframe sehen können, platzieren wir das Bild so, dass wir das Bild ersetzen, aber in einem anderen Format. Machen wir also einen Kreis und die Abkürzung ist 0. Und der Schwerpunkt auf dem Rahmen so, machen wir es bis zu 450. Ich glaube, ich muss es größer machen. Lass es uns auf 70 wieder gut machen, okay? Okay, lass uns das hinzufügen, die Kanten, damit du sehen kannst, dass es eine Lücke gibt. Bewegen Sie sich so nach rechts. Ok, wähle den Kreis aus. Lasst uns die Farbe ändern. Lassen Sie uns den Gradienten zum Linearen machen. Und die erste Farbe wird unsere rote Farbe sein. Und die zweite Farbe wird so sein. Schließen wir diesen Tab. Okay, jetzt haben wir sogenannte, also duplizieren wir den Kreis, wählen Sie den Kreis aus und halten Sie ihn und ziehen Sie ihn. So. Wählen Sie den Kreis aus, gehen Sie zu unserem Formwerkzeug und wählen Sie Bild aus. Und lasst uns dieses Bild öffnen und lassen Sie es uns auf die Ellipse legen. Sie nach dem Segen des Bildes Wählen Sie nach dem Segen des Bildes den Kreis aus, diesen. Und lass uns auf den Rahmen gehen. So wie dieser Solenoid zusammen. Okay? Und das Zentrum des Kreises. Verringern wir also die Deckkraft auf 70 bis 80 Prozent. Weniger Zecken, 70%. Okay, das sieht gut aus. Und Sie können in Wireframe sehen, dass wir den Markennamen segnen. Das ist also ein leichterer Tarif, um den Markennamen auszuwählen. Halte Alt im zweiten Frame so. Okay? Okay, lassen Sie uns die Schriftgröße auf 15 reduzieren. Nachhilfezentrum. So. Das sieht cool aus. Okay, jetzt machen wir diese Anmelde-Navigationsleiste. Also werde ich die andere Methode dafür verwenden. Fügen wir ein Rechteck wie dieses hinzu. Ich glaube, ich muss ein bisschen vorstellen. Okay, und weniger Alanin und Decenter. Es ist im Zentrum. Versuchen wir es jetzt mit einem Brett. Drehen wir also die Kanten auf 35 um. Und jetzt ändern wir die Farbe in Weiß. Es hat also einen Effekt wie Schlagschatten. Fügen wir das ein paar Einstellungen hinzu. Lasst uns zwei verwischen. Geist von zwei, um gut zu sein. Okay, das sieht jetzt cool aus. Machen wir also einen Login- und Anmelde-Button. Lass uns ein Rechteck wählen. Ich habe etwas Dimension gelesen, man sieht, dass die Breite 264 und die Höhe 45 ist. Und die X- und Y-Position, die Sie hier sehen können. Also lasst es uns scharf machen, Ecke in Runde. Bringen wir es bis zu 13 aus. Lassen Sie uns diese Form duplizieren. Machen Sie es wieder gut zu hüpfen. Und lasst uns die Farbe ändern. Lass es uns so machen, lass uns diesen Knochen wählen und weniger oben drauf. Okay. So. Okay. Lasst uns die Farbe ändern. Machen wir es weiß, gräulich, so. Okay, lass uns einen Effekt hinzufügen. Klicken Sie auf „Effekt“. Sie können also sehen, dass der Schlagschatten hinzugefügt wird. Ich denke, es sieht okay aus, also gehe ich so wie es ist. Machen wir also eine SMS. Der erste wird Login sein. Okay, derzeit ist die Schriftart sensibel, also lasst uns sie in vier Pins umwandeln. Und lasst uns festigen, fügen wir nur eine Schriftart hinzu, entsprechend dieser Hüfte ist jetzt in der Mitte. Also lasst uns diesen Text duplizieren. Machen Sie es sich anzumelden. Also werden wir einfach total weiß. Deshalb ist es nicht sichtbar. Wählen Sie die Schriftart aus. Lass es uns schwarz machen. Oder wenn Sie möchten, können Sie diese Farbe wählen. Wir sehen auch cool aus und richten es uns aus. Lassen Sie uns das manuell ansprechen. Im Zentrum. Auf diese Weise ist dies unter Berufung auf OK. Jetzt sieht das cool aus. Verkleinern, Sie können die Benutzeroberfläche der Anmeldeseite sehen. Es sieht so aus. Machen wir also das Passwort für den Benutzernamen. Also gehe ich zu Shapes, wähle die Linie aus, es sei denn, schaffe sie hier. Und fügen wir einfach hinzu, drehen wir den Winkel in 0. Fügen wir das also in die Mitte hinzu. Okay, es ist in der Mitte. Und lasst uns dieselbe Zeile duplizieren. Halte Alt gedrückt, zieh es nach unten. Fügen wir etwas Text hinzu, wie E-Mail. Okay, lassen Sie uns die Schriftgröße auf 10 reduzieren. Und je weniger Kanten der Text. Lassen Sie uns die Farbe dieses Textes und auch des Farbenblindes ändern . Mach es einfach so. Und lassen Sie uns auch die Farbe dieser Linie ändern . Gehe zu Schlaganfall. Und wählen wir Select tool. Lass es uns so machen. Wählen Sie E-Mail und Benutzerordner aus, ziehen Sie sie nach unten und lassen Sie uns Sie ins Passwort senden und auch die Farbe dieser Zeile ändern. Lassen Sie uns nun das Passwort weiterleiten, diese Kennworttext-Warnung. Platzieren Sie es hier. Okay, lass uns einfach so hinzufügen. Machen wir den Login-Button. Lassen Sie uns diese Form kopieren. Ich glaube, das wird gut werden. Okay, drehen wir das Farbobjekt. Derzeit ist es irgendwie grau. Machen wir es wie diese violette Farbe. Und ich wähle diese Schriftart aus, die du aneinander ausrichtest. Sake, aber die Dinge halten mit Shift, horizontal, okay, es ist jetzt in der Mitte. Lassen Sie uns also den Typ der Schriftart überprüfen. Der aktuelle Kurs ist regelmäßig, also machen wir es halb fett. Also wird es cooler aussehen, okay, so. Okay, was passiert sonst noch? So können Sie sehen, dass es in Drahtgittergebühr alles gemacht hat. Also nur das Sedimenting wie dieses, loggen Sie sich mit Schaltflächen ein, okay, fügen Sie sie weniger aus den lokalen Dateien hinzu. Okay, lasst uns diese SVG-Dateien importieren, okay, unbedingt der Tutor für diese Gruppe sie zusammen. Warum gruppieren wir sie also? Weil dies die SVG-Dateien sind. Sagen wir, ich wollte irgendwohin ziehen. Sie können also sehen, dass Sie, wenn ich auf diesem Symbol auswähle, den wir ausgewählt haben, sehen können. Es wird also ein Missverhältnis mit unserem Projekt geben. Deshalb gruppieren wir uns damit. Wenn ich sage, ob das Ganze und gruppiere sie mit Control G zusammen, um jetzt zu gruppieren. Und wenn ich darauf klicke, kannst du sehen, dass ich es überall hin bewegen kann. Also lasst uns das machen. Eine weniger adressieren die Höhe aller Logos auf Twitter und Facebook. Wünschen Sie 15 Höhe und das Gewicht. Auch für Facebook und auch für Google. Wir passen also die Breite und Höhe an, also sind es Kanten. Nun, einer meiner, die eine Sache bleibt, ist, dass wir hinzufügen oder Text hinzufügen müssen, das ist R. Lassen Sie uns diesen Text wählen und Alt halten und ihn in die Mitte verschieben. Und lassen Sie es uns weniger an die Mitte richten. Die Figma ist echt klug. Es wird dir automatisch sagen, wo der Mittelpunkt ist und auch der Abstand dazwischen. Denken Sie, lassen Sie uns die Schriftgröße auf 12 erhöhen. Okay, unsere Anmeldeseite ist jetzt fertig. Im nächsten Video werden wir also eine Anmeldeseite erstellen. Das ist also dein Portfolio und ich sehe euch im nächsten. 31. Anmeldeseite für LattoFatto: In früheren Videos haben wir die Anmeldeseite erstellt. In diesem Video werden wir also eine Anmeldeseite erstellen. Wählen wir also diese Frame-Anmeldeseite aus und beginnen, so zu sprechen. Und benennen wir es in Unterzeichner um. Auf der Anmeldeseite müssen wir also ein paar Dinge ändern. Sie können jedoch im Drahtgitter sehen, wie wir die Anmeldeschaltfläche ändern müssen. Wir werden einige zusätzliche Zeilen wie das Passwort bestätigen hinzufügen , und wir müssen auch die Anmeldung ändern. Nehmen wir diese Änderungen also vor. Okay, lasst uns zuerst die Farbe dieser Schriftart ändern. Derzeit ist es eine Art Zitronennebel. Also lass es uns weiß machen. Und lassen Sie uns dieses Rechteck auf die rechte Seite verschieben. Okay? Jetzt drehen wir also die Farbe des Logins. Derzeit ist es also weiß. Der Gelehrte. Okay? Okay, was wir jetzt tun müssen , ist , dass wir noch eine Zeile hinzufügen müssen. Das wird unser Bestätigungspasswort sein. Lassen Sie uns also dieses vorwärtsliegende Passwort verschieben , das so nach unten wäre. Und lasst uns diese Zeile kopieren. Kopieren wir dieses Passwort und diese Zeile. Halten Sie Alt gedrückt, ziehen Sie es nach unten. Okay, ich bestätige, dass das Passwort jetzt größer ist. Okay, richten wir sie zusammen. Wähle ihn aus und halte Umschalt gedrückt. Wählen Sie alle Dinge aus, die Passwort, Passwort und die geschrägte Zeile enthalten sind, gehen Sie zur Einstellung Ausrichten klicken Sie auf Weitere Optionen und wählen Sie. Sie sollten einen vertikalen Abstand haben. Okay, es ist jetzt ausgerichtet. Du siehst hier. Lassen Sie uns also dieses Vorwärts-Passwort verschieben, um so nach oben zu sein. Derzeit befinden wir uns also auf einer Anmeldeseite. Wechseln wir in die Anmeldung. Richten wir es waagerecht aus. Wir können sehen, dass es jetzt in der Mitte ausgerichtet ist. Eine Sache ist also, dass einige Symbole, wie Sie einige Apps sehen könnten , in denen Sie den Augensymbolbereich haben. Okay, lass uns die hinzufügen. Eisenberg. Gehe zu S8, klicke auf diese Teambibliothek und schalte diese Federsymbole um und suche nach I. Ok, du kannst das Augensymbol sehen. Also lasst uns das benutzen. Lassen Sie uns also die Größe so reduzieren. F: Ändern wir also die Farbe davon. Derzeit ist es schwarz. Also werden wir diese Farbe nach oben wählen. Gleiche Pflege dieses Passworts. Und wählen Sie Alt halten aus, ziehen Sie es auf die Anmeldeseite. Bestätigen Sie nur das Passwort. Das einzige, was noch übrig ist, das ist die Hauptseite. Sie können das Drahtgitter davon sehen. Im nächsten Video werden wir diese Menüseite erstellen. Das ist also dein Foto. Und wir sehen uns im nächsten. 32. Menüseite für LattoFatto: Willkommen zurück. Im Vorjahr haben wir die Anmeldeseite erstellt. In diesem Video werden wir diese Hauptseite erstellen , damit Sie das Drahtgitter dafür sehen können. Lass uns einen Rahmen wählen. Iphone 11 Pro Max. Okay, lass uns diese Seite machen. Weil wir einige Elemente wie Suchleiste und älter hinzufügen werden. Die Seitenleiste wird also weiß sein, also wird sie im Hintergrund nicht so sichtbar . Unsere Meno-Seite wird also sichtbarer sein. Für diesen Mindestlohn können Sie im Drahtgitter sehen, dass wir dieses Hamburger-Menüsymbol, das Profilsymbol und den Text sowie einige Bilder benötigen . Also lasst uns diese Dinge machen. In meinem Ordner habe ich alle Ressourcen. Lasst uns sie also in eine Wirbelfigma versetzen. Okay, die Bilder werden gerne gehalten, um sie zu beantworten. Wir haben also alle Ressourcen wie dieses Hamburger-Menüsymbol, die eigentliche Bescheidenheit, das Profilbild und einige Elemente wie dieses machbar. Also werden wir eins nach dem anderen benutzen. Also lass uns reden. Also außer Frage. Und das zweite ist die Bereitstellung von Renditen. Also lasst uns dieses Profil erstellen. Dafür brauchen wir Ellipsen und halten die Umschalttaste gedrückt und gehen zum Shape-Werkzeug und dieses können Sie auch Ihr eigenes Bild auswählen. Und ich füge es in diesen Kreis ein. Sie können sehen, dass es platziert ist. Aber Sie können sehen, dass das Foto irgendwie auf der rechten Seite ist und zum Design-Panel gehen. Und Sie können in der Feldoption sehen, wir haben dieses Bild, klicken Sie darauf. Und lasst uns die Ernte wählen. Das Bild wie dieses. Okay? Lassen Sie uns also einen Strich hinzufügen. Klicken Sie auf den Strich. Lass es uns auf zwei ausgleichen. Und ändern wir die Farbe des Strichs in Weiß. Und lasst uns die Größe ändern. Wie Okay, also fügen wir einen Text hinzu, der C und Control V ist, damit du sehen kannst, dass ist C und Control V ich Poppins-Schrift benutzt habe. Dafür. Ich benutze das reguläre Ende von N Für dieses kühle Gelb habe ich das halbfett benutzt. Lassen Sie uns es also nach diesem Hamburger-Symbol wie folgt ansprechen . Was ist das Nächste, was wir tun müssen? So können wir Kategorien wie diese hinzufügen. Du kannst diese Arbeit machen. Fügen wir eine Suchleiste hinzu, in der der Benutzer seine Artikel finden kann. Wählen Sie also das Rechteck aus. Wir können diese Form einfach kopieren. Die Form, halten Sie Alt gedrückt und ziehen Sie sie im Frühling. Okay, also lasst uns die Farbe ändern. Und du siehst, dass wir schon einen Schlagschatten haben. Also können wir es sehen. Ich gehe so wie es ist. Fügen wir also einen Text hinzu. Wählen wir also diesen Text und die Bilder aus, die gesucht werden sollen. Ein Suchsymbol. Aktuell ist es schwarz. Also werde ich mich entscheiden. Also Text wie diesen und verringern Sie einfach die Größe , von der er jetzt ausgerichtet ist. Und lassen Sie uns die Suchleiste ein bisschen größer machen. Schaffen wir es in die Mitte. Und der Wissenschaftler ist Suche und die Ikone. Okay, das nächste ist, Kategorien hinzuzufügen. Fügen wir also einige Kategorien hinzu. Okay, lass uns ein paar Kategorien hinzufügen. Wähle also ein Rechteck und zeichne es so. Machen wir es mit bis zu 110, 1, 1, 0 und einer Höhe von 70 wieder gut. Ein paar Kanten. Lass es uns wieder gut machen, diesen hier noch einmal zu kodifizieren. Richten wir sie also zusammen. Also lass es uns weiß machen. Wenn du willst. Sie können auch Schlagschatten hinzufügen. Drehen wir die Farbe dieses Hintergrunds um. Derzeit ist das Weiß sichtbar, LACMA, diese Icons. Okay, das sind die SVG-Datei, also lasst uns G steuern. Der zweite wird außer Kontrolle geraten. Und kontrolliere G. Wenn wir also mit der Nichtübereinstimmung arbeiten, okay, der erste wird Bogle sein, füge den Burger hinzu. Und der erste Abschnitt ist die Geschlechterdimension davon. Bis zu 45 und das Zentrum. Okay. Das ist okay. Was ist sein verbleibender Rest? Also müssen wir es wie Logo-Design nennen. Also lasst uns sie ausstellen. Nennen wir es also den ersten. Also kopiere ich diesen Text. Also klicke auf den Burger. Und Pizza. Lassen Sie sie so vertikal ausrichten. Wir müssen also die Farbe dieser Blase ändern da wir derzeit Debuggerabschnitt sind. So können wir die Farbe ein wenig ändern. Entweder wir wissen, dass es in der Sektion ist. Also lassen Sie uns diese Kategorien verschieben. Dieser Abschnitt, der natürlich sein wird, befinden wir uns derzeit im Boulder-Sektion, also werden wir Bolus hinzufügen. Wählen wir also ein Rechteck aus und zeichnen ein Rechteck wie dieses. Geben wir die Dimension des Beines und die Höhe von 2, 1, 0 an. Fügen wir ein paar abgerundete Kanten hinzu. Lassen Sie uns bis zu 35 addieren. Okay? Dieses wird also unser erstes Logo sein. Das hier. Also werde ich die Höhe erhöhen, da der ausgewählte Benutzer derzeit Bogle ist. Machen wir es also zu einem 199. So und ändern wir die Farbe. Machen wir es für die zweite Farbe. Und Sie können es je nach Anforderung platzieren , wo wir wollen. Also lege ich alles auf, was dir gefällt. Okay, jetzt fügen wir das Bild dieses Buches hinzu. Derzeit ist dies also das erste Logo und nenne sie. Also der erste, ich weiß nicht, wie der Embolus heißt, also können wir ihn benennen, wie Sie wollen, oder Sie können auf Google suchen ich sie hier drüben bewältigen kann. Ändern wir also die Farbe dieser Schriftart. Es ist schwarz, machen wir es weiß. Es wird also besser aussehen. Seiten. Machen wir es zu einem Symbol. Und lassen Sie uns den Preis eines Dollarzeichens beenden. Lass es uns bis 20 wieder gut machen. Wenn du willst, kannst du es auch hinzufügen. Also wenn diese Bewertung nicht denke ich, dass ich eingeführt habe. Lass mich nachsehen. Okay. Ich habe dieses Projekt. Okay, du siehst die Farbe davon. So. Der frühere Kunde hatte gute Erfahrungen mit diesem Logo und verkaufte sie zusammen. Lassen Sie uns dieses Logo nennen, das derzeit im Distrikt breit ist, also ist Kampf nicht sichtbar, also machen wir es schwarz. Oder verringern Sie die Schriftgröße. Lassen Sie uns das kopieren. Und lasst uns den Wert von jedem ändern. Was bleibt also übrig? Alles ist erledigt. Also denke ich deutliches Sedimentieren. Also lasst uns diese Dinge hinzufügen. Wählen Sie Ellipsenkreise aus. Machen wir es wie Speichern Sie den ersten Punkt. Und lass es uns schaffen. Oder wir wählen diese Farbe. Lass es uns ein bisschen größer machen. Der Benutzer wird also so stempeln. Ich denke, wir müssen es aneinander ausrichten. Und ich denke, eine Sache ist, eine Karte hinzuzufügen. Also lasst uns die Ellipse auswählen und kurz in Säure aus Liebe laufen wir haben das. Du siehst es. Also lasst uns diese Einkaufstasche und das Zentrum hinzufügen. Also lasst uns es in die weiße Mitte machen, okay, also ist alles erledigt. Unsere Meno-Sitzung ist jetzt fertig. Das einzige, was in diesem Projekt übrig bleibt , ist dann das Prototyping. Im nächsten Video werden wir also Prototyping machen. Und wir sehen uns im nächsten. 33. Prototyping für Lattofatto: Willkommen zurück Im Privileg oder ein Film hat dieses Menü Haustier gemacht. Eine Sache ist also, dass das verbleibende für dieses Projekt für das Prototyping erledigt wird. Also habe ich dir schon gezeigt, wie man Prototyping macht. Sie können also das Video anhalten und alleine machen oder wenn Sie nicht wissen, wie es geht, damit Sie das Video fortsetzen können. Also nehme ich an, dass du diesen Teil gemacht hast. Lasst uns also das Vorherrschende für dieses Projekt tun. Gehen wir zum Prototyp-Panel. Und du siehst diesen weißen Punkt. Und wenn ich den Mauszeiger darüber fahre, wird es zu einem Plus-Symbol. Klicken Sie darauf und ziehen Sie es auf die Anmeldeseite. Sie können also sehen, dass dieses Menü auftaucht. Dies ist also das Interaktions-Detail-Panel. Sie können also sehen, dass wir Optionen wie R-Typ haben. Stellen Sie es derzeit weniger auf tippen und navigieren Sie zur Anmeldeseite. Also navigieren wir von der Fanpage zur Anmeldeseite. Also ist es, es ist okay. Wenn Sie möchten, können Sie unsere Animation darin hinzufügen. Also lasst uns momentan mit sofortiger Wüste gehen und uns verstecken. Klicken Sie nun auf die Anmeldeseite. So können Sie sehen, dass wir Optionen wie Login und Anmeldung haben. Angenommen, der Benutzer wird diese App zum ersten Mal installiert. Er wollte also zur Anmeldeseite gehen , damit Sie auf die Schaltfläche Anmelden klicken können. Also lasst uns die Interaktion machen. So können wir in den Integrationsdetails auf der Registerkarte sehen , navigieren Sie zur Anmeldeseite. Und die Animation ist fertig. Angenommen, der Benutzer ist wie ein schwerer, wenn Sie versehentlich auf die Schaltfläche „Registrieren“ tippen. Also wollte er wieder auf die Anmeldeseite oder die Anmeldeseite gehen. Damit er mit diesem Login-Button zurückgehen kann. Lassen Sie uns also eine Einführung geben und zur Anmeldeseite navigieren. Alle Dinge werden dafür gleich sein, also müssen wir nichts ändern oder hier. Angenommen, der Benutzer hat seine E-Mail-ID und das Passwort angegeben und er wollte zur Hauptmenüseite gehen. Lassen Sie uns also die Einführung in diesen Button geben. Okay, von Logan wird BIG auf die Hauptseite gehen. Und auch das Gleiche, die Anmeldeschaltfläche von der Anmeldung und wird auf der Menüseite angezeigt, die alle legitimen wie einen Benutzernamen, Passwort und ein Passwort bestätigen. Ich glaube, wir sind hier fertig. Wenn ich auf dieses Leerzeichen klicke erhalten wir diese Optionen. Also von hier aus, wenn Sie das Gerätekontingent von hier aus ändern möchten. Momentan wähle ich dieses iPhone 11 Pro Max. Also wähle dieses aus. Und wenn Sie das Modell trainieren möchten, oder Sie können es von Ihrem aktuellen Ziel aus tun. Sie können Silber Space, Grau, Mitternachtsgrün wählen. Und es wird die Vorschau zeigen. Und wenn Sie die Eigenschaft Hintergrundfarbe ändern möchten, können wir dies von hier aus tun. Derzeit dieses Schwarz können wir ihm jede gewünschte Farbe geben. Also lass uns mit Weiß gehen. Es spielt also keine Rolle. Sie können eine beliebige Farbe wählen. So können Sie hier sehen, dass wir eine horizontale oder vertikale Ausrichtung haben , wenn Sie sie in ein horizontales Kontingent wie dieses, unser Porträt, ändern möchten sie in ein horizontales Kontingent wie dieses, unser Porträt, ändern . Gehen wir also mit einem Portrait und klicken wir auf diesen Present Button. Sie können sehen, dass unsere App präsentiert wird und das aktuelle Symbol hier in der oberen Leiste. Okay, Sie können die erste Markennamenseite sehen. Wenn ich darauf klicke, gelangen wir auf die Anmeldeseite. Danach. Wenn ich auf dieses Leerzeichen klicke, sehen Sie, dass wir zu Hotkeys kommen. Das sind wie Anmeldeseite und Anmeldeseite. Angenommen, ich bin ein neuer Benutzer und möchte mich anmelden. Also tippe ich den Anmelde-Button und kann meine Daten wie Benutzernamen, Passwort und Passwort bestätigen. Und danach kann ich mich anmelden. Also kann ich auch wieder auf die Anmeldeseite zurückgehen, wenn ich so möchte. Und klicken wir auf Login. Also sind wir auf der Meno-Seite. Also kann ich diese Bugs von hier aus bestellen, wenn du willst. Sie können diesen Seiten Animationen hinzufügen. Wenn wir auf die Anmeldung klicken, möchten Sie Animationen wie Einziehen oder Aussteigen oder Push geben . Also können wir es von hier aus machen. Lass uns einen Film wählen. Und du wirst die kleine Indirection hier sehen. Und Sie können auch geschlechtsspezifische Dysphorie. Derzeit sind diese 300 Millisekunden und die Animation exakt. Okay, lass uns das vorstellen. Sie können die R bis zum Start drücken, diese Anwendung von Anfang an. Also drücke ich R auf der Tastatur. So können Sie unsere Markennamenseite sehen. Okay, also klicken wir auf „Registrieren“. Sie können diesen Bewegungseffekt-Audio sehen. Lass mich dir eine coole Sache zeigen. Gehen wir also zur Markenseite, zufällige Seite. Klicken Sie auf diesen Pfeil, Prototyp-Pfeil. Und derzeit sind wir auf dem Tab. Lassen Sie uns also hier eine intelligente Animation geben. Und lasst uns Gender Millisekunden gerecht werden. Und wir können es wie Streit und Adduktion wie auf Taiwan ändern und beim Halten ziehen und all das. Lassen Sie uns wie eine Weile wählen, indem Sie mit der Maus Enter schweben. Und lassen Sie es uns in die Taste R drücken, um neu zu starten. Und wenn ich mit der Maus über diese App fahre, kannst du diese Animation sehen. Lass es mich nochmal machen. Sie können diese Animation sehen. Also lasst uns ein bisschen ändern wie unsere Tiefe. Lassen Sie uns den Namen bis zu 50 Millisekunden angeben. Es sei denn noch einmal vorgestellt. Um neu zu starten. Und auf der Registerkarte können Sie sehen, dass die Animation langsam wird. So. Aufgrund dieser Art Smart und Messung erhalten wir diesen coolen Effekt. Also werde ich dich gerne mögen, während ich schwebe. Und machen wir es auf 100 aus. Sieht echt cool aus. Und lasst uns zur Präsentation gehen. Wenn ich NDA mag, meine Maus auf der Liste markenbasiert, können Sie die Indirection sehen. Der Markenname steht ganz oben. Und wenn ich diese App lebe, kannst du sehen, dass dies wieder auf die Markennamenseite kommt. Und ich kann hier drüben in Richtung tun, wie mich anmelden. Sie können diesen Bewegungseffekt sehen und auf deren Anmeldeseite gehen. Wenn Sie möchten, können Sie die Animation dieser Hauptseite und das Imaging im Mini-Batch hinzufügen . Klicken Sie also auf die Anmeldeseite und wählen Sie diesen Pfeil aus. Und sagen wir meine Animation. Also lasst uns diese Unordnung und den Geist und diese versuchen. Lasst uns auf unseren Login klicken. Okay. Sodium traf unsere Anmeldeseite und von der Anmeldeseite v, angesichts dieses Effekts. Okay. Es sieht echt cool aus. Es fühlt sich ängstlich an. Ich denke, es ist ziemlich in Kraft, gibt Ihnen diese Animation zu den Anmelde-Buttons. Lasst uns also an unseren langen Strand gehen. Sie können sehen, dass sich das aufgelöst hat, wenn Sie nur andere Animationen wie Smart und Emission verwenden würden. Wählen wir also eine intelligente Animation und präsentieren wir den Bildschirm. Treffen Sie unsere Protokollierung. Sie können diese coole Animation, Audio, intelligente Animation sehen. Lass uns in die Schule schauen. Sie können also gerne jede beliebige Animation sagen. Es hängt also von Ihnen ab und es hängt auch von Ihrem Projekt ab. Hier schließen wir unser Projekt ab, sagen wir, wenn Sie mit diesem Projekt zu kämpfen haben, wenn Sie immer wieder ein Video ansehen müssen, um dieses Projekt zu machen. Wenn Sie also dieses Projekt erstellt haben, können wir dieses Projekt auf Instagram oder Twitter teilen , und Sie können mich oder dort auch markieren. Im nächsten Projekt werden wir also eine Filmwebsite erstellen. Oder Sie können sagen wie Streaming-Dienstanwendung wie Netflix, Amazon Prime. Das heißt also, dass ich OFF wusste. Danke fürs Zuschauen und wir sehen uns im nächsten. 34. Wireframing für die Wireframing: Um auf ein anderes Video in diesem Gerät zurückkehren zu können, werden wir ebenfalls ein anderes Video in diesem Gerät zurückkehren zu können, ein Wireframe für die OTT-Plattform wie Netflix und Amazon Prime erstellen . Lasst uns also ein neues Team erstellen und nennen wir es. Größeres Team, überspringen Sie vorerst, um zu beginnen. Okay, unser Team ist größer. Sie können die Farboptimisten L0 und die diskrete Designdatei sehen. Okay, benennen wir es um. Also zeige ich dir schon ein Follow-up von dem wir einige Komponenten löschen müssen. Lassen Sie uns also Komponenten erstellen oder einfach Einfügekomponenten aus Ihren vorherigen Projekten kopieren , die zu einer fruchtbaren App geführt werden. Sie können diese Verbindungen wie dieses Bild kopieren, dieses Login und Zeichen und Veteranen und die Markennummer, den Hamburger Meno drehen und all das. Bisher, dieses Drahtgitter, werde ich dieses Bild benötigen, also werde ich es tun, also werde ich das auswählen. Klicken Sie also mit der rechten Maustaste darauf und Sie können hier sehen, also sind wir optional kopiert. Sie können also auch die Verknüpfung Control C verwenden. Also kopiere ich diese und lass uns tun, um ihm bei der MCU zu helfen. Okay, drücken Sie jetzt Strg V, um dieses Bild in unser Drahtgitter einzufügen . Also lassen wir Audrey auftreten. Also werden wir noch eine erstellen. Und das Bildschirmbild. Du kannst es nennen, wie immer du willst. Und 31 ist eine der Fernsehsendungen. Okay, lass uns einen Markennamen hinzufügen. Und lasst uns etwas Text hinzufügen. Vergrößern wir die Textgröße. Gruppe, kontrolliere G, um sie zu gruppieren. Im Filmrahmen brauchen wir dieses Bild hier drüben. Und lass es uns größer machen. In diesem Teil sind wir also auf einem Display, dem Filmbild. Und lasst uns ein paar Schaltflächen wie Pinup erstellen. Angeführt verringern Sie den Text auf Like, sagen wir 24. Und lasst uns das ansprechen oder melden Sie sich an. Und lasst uns etwas Text für den Film erstellen. Martin. Und der letzte ist für TV-Shootings. Derzeit sind wir in Bewegung, also werden wir diese Filme dazu bringen, zwei in Bolt aufzunehmen. So wird der Benutzer wissen, oder unser UI-Entwickler ohne, er sich derzeit in dieser Filme-Action befindet. Und wenn Sie möchten, können Sie diesem Text Underlain hinzufügen. Also lasst uns ein Filmnim hinzufügen. Zuallererst befinden wir uns auf einem erforderlichen Rechteck. Also plus r. Wählen Sie also Text aus, und fügen wir hier Text hinzu. Ist es größer zu machen. Sagen wir bis zu Lycos 48-Tutorial. Und danach müssen wir eine Beschreibung für unseren Film erstellen. Erstellen wir also noch einmal ein Rechteck. Jetzt wird hier unsere Beschreibung für unseren Mond sein. Fügen wir also Text hier hinzu. Okay, und danach erstellen wir einen Play-Button. Und davor werden wir hinzufügen, ich glaube, ich habe diese weitere Beschreibung gemacht. Ich gehe in die Industrie. Lasst uns diesen Maulwurf bewegen, Dinge wie Film Jetzt abspielen Antilog-Button. Okay, lasst uns eine Bar erstellen, in der der gesamte Film geändert wird, die Farbe Gegensätze. Also werden wir mehr Rechteck hinzufügen. Die Farbe dieser Rechteckigen wird also gleich sein. Also müssen wir die Farbe dieses Rechtecks ändern. Also lasst uns ein Rechteck wählen. Dieses Abendessen, damit unsere Breiten größer sind, halten wir Alt und ziehen es. Zieh es. Ich denke, vier werden ausreichen. Also richten wir sie jetzt zusammen. Halten Sie die Umschalttaste gedrückt und wählen Sie alle Und Mörtel bewegt sich senkrecht. Also wo es hier etwas Abstand gibt. Nehmen wir an, der Benutzer ist derzeit im zweiten Film, also wird er wissen, dass er gerade in einem zweiten Film ist, also müssen wir einige Änderungen vornehmen. Lassen Sie uns diese rechteckige Region also so etwas größer machen . Und lasst uns einen Schlaganfall hinzufügen. Mach es Ripple-Effekt. Nur diese beiden Dinge sind noch übrig, ist die Anzeige, die wir erstellen mussten. Also müssen wir eine Suchschaltfläche und einen Glocken-Symbol hinzufügen. Gehen Sie also zur Team-Bibliothek und verdoppeln Sie diesen Feder-Symbol. Und lasst uns nach einer Operation suchen. Und ziehen wir es auf diese Seite. Und das Gleiche für Glockensymbol. Wir werden das machen. Ziehen wir es also so. Okay? Richten wir sie also zusammen. Wählen Sie alle Dinge aus, die ausgerichtet und unten ausgerichtet sind, und richten Sie sie vertikal aus. Okay, sie sind jetzt ausgerichtet. Und Zufall wird überbeansprucht. Fügen wir also einen Markennamen hinzu und wählen Sie ein Rechteck aus. Es könnte also Branding sein oder es könnten Logos sein. So wie das. In die Mitte, geht es nicht so. Dies ist also das Drahtgittermodell für den Stunden-Filmbereich. Und das wird für unsere TV-Show-Sektion genau das Gleiche sein . Also müssen wir Änderungen vornehmen, wie wir dies regelmäßig machen und Fernsehsendungen zu Bolt machen müssen. Und benennen wir diesen Frame in TV-Show um. Und all die Dinge werden gleich sein. Wie dieser Filmname und alles , worauf wir uns einlassen können, wie TV-Show. Also lassen Sie uns das kopieren und benennen wir es um TV-Show. Und hier machen Sie auch eine visuelle Beschreibung. Dies ist also das Drahtgitter, also werden wir darauf verweisen und wir werden unser endgültiges Projekt erstellen. Unser Abschlussprojekt wird also so aussehen. Sie können die Markennamenseite, Filmbereich und den TV-Bereich sehen. Also Name der Filmbeschreibung dafür, die Schaltfläche „Jetzt“, die Schaltfläche „Trailer“. Und ich habe diese Bewertungen auch hier hinzugefügt. So kannst du diese Filmfiktion sehen. Von hier aus wird der Benutzer entscheiden, was er sehen soll. Gleiche gilt für den Bereich der TV-Show. Und wir sehen uns im nächsten. 35. OTT: Willkommen zurück. Früher, als wir dieses Drahtgitter für unsere MCU oder für das Projekt erstellt haben. In diesem Video werden wir also das eigentliche Projekt erstellen. Gehen wir also zum Team, das MCO 2D ist und erstellen Sie eine neue Datei, die Designdatei. Das ist also ein Bild. Sie können es umbenennen, was Sie wollen. Also benenne ich es vorerst um. Okay, also lasst uns einen Rahmen erstellen. Desktop-eins. Sie wissen bereits, dass der Desktop unsere zufällige Seite sein wird. Wählen Sie nun den Rahmen aus und ändern wir die Farbe der Taube, um so zu lesen. Und das fügte Text in der Mitte hinzu. Das wird zu klein sein. Machen wir es also größer, etwa bis zu 60. Lassen Sie uns die Entscheidung zum Zentrum hinzufügen. Und lasst uns die Schriftart ändern. Geben Sie ein. Eine Suche auf der Google-Schrift Typ 48 ist wie Effect Pro etwas, aber ich kann sie nicht herunterladen. Also verwende ich die Schriftart namens Impact. Es ist also ähnlich wie diese Schriftart. Die Schriftgröße ist zu klein, also lasst uns 96 dauern, oder machen wir es auf 120 aus. Okay? So. Lasst uns das in die Mitte bringen. Ein weiterer Text, der unser filmisches Universum sein wird. Bisher verwende ich diese Babas neue Schrift. Und das ist regulär und die Schriftgröße ist 45. Das und treffe einfach so nach unten. Wenn Sie möchten, können Sie an der Außenseite dieses Textes ein Rechteck hinzufügen . Aber im Moment lasse ich es so, wie es ist, weil es cool aussieht. Unsere zweite Seite wird also verschoben. Lassen Sie uns also das Bild der Filmseite in Filme streamen. Schauen wir uns also unser Drahtgitter an. Für pH. Also der Bereich MouseX und Jüdisch, der Markenname, das Suchsymbol, das Glockensymbol, die n Anmeldeschaltfläche. Also müssen wir diese Dinge erschaffen. Erstellen wir also zuerst ein Rechteck. Denn wenn wir dieses Bild hinzufügen, wird der Test nicht sichtbar sein. Also werden wir unseren Text auf dieses Rechteck platzieren. Und lassen Sie uns den Geschlechtertyp dieses Rechtecks ändern , den Strom einfärben, es ist solide, also werde ich es bis linear machen, so. Also ist unser Team für dieses Projekt irgendwie verrückt. Also mache ich es wie ein Rot. Und eine sekundäre Farbe wird so aussehen. Und diese Kante ist die Länge des Rechtecks. So. Ich denke, die zweite Farbe ist wie zu dunkel geworden. Also lasst es uns so machen. Okay, jetzt lass uns hier etwas Textur hinzufügen. Zuerst werden es also Filme sein. Also derzeit das beste Neue. Also werde ich es so umwandeln, wie wir, die das gewachsen sind. Ich denke also, dass diese Schriftart bei den fünftmeisten Operatoren nicht verfügbar ist . So könnten Sie diese Schriftart von außen herunterladen , von Google. Sie können diese Schriftarten herunterladen und auf Ihrem PC installieren. Das Problem mit dieser Schriftart ist also , dass wir sie nicht fett machen können. Also habe ich einen Trick dafür. Was Sie also tun können, ist, dass Sie einen Strich hinzufügen können und es wird zu einem solchen Bolzen. Verkleinern wir also die Schriftgröße. Derzeit sind es 45. Bringen wir es bis zu 30 aus. Okay, so. Und zweitens wird unsere TV-Show sein. Und das wird also normal sein. Also lasst uns diesen Schock wie diesen entfernen und einfach den Markennamen hinzugefügt. Also kopiere ich diesen und ziehe es auf diese Seite. Lassen Sie uns also die Schriftgröße auf etwa reduzieren, sagen wir mal um 80 Grad die Schriftgröße auf 30 Grad. Wenn du also die Farbe davon enthalten willst, lass es uns rot machen. So oder sogar so können Sie eine beliebige Farbe wählen. Also werde ich das in die roten Zahlen machen. Als nächstes müssen wir hinzufügen, dass das Suchsymbol und das Klingelbenachrichtigungssymbol. Also geh zu S8. So gut heute im Februar. Und schalte dieses weitere Icon um. Und lasst uns nach dem Suchsymbol suchen und es einfach hier rüber ziehen. Und wir brauchen auch ein Glockensymbol. Und der letzte wird unsere Anmeldung sein. Richten wir sie also zuerst zusammen und dann unten und vertikal. Also sind sie jetzt ausgerichtet. Also können wir noch eine Sache hinzufügen. Wir können diesem Film eine Unterstreichung hinzufügen. So können wir diesem Filmtext eine Unterstreichung hinzufügen. Also wird der Benutzer jetzt lange Abschnitt sein. Wählen wir also ein Rechteck aus. Erstellen wir eine einfache Leiste wie diese. So und ändern wir die Farbe der Gruben. Du kannst es gerne weiß oder rot machen. Also denke ich, dass Weiß besser aussehen wird. Also wähle ich einen Weißen wie diesen aus. Ziehen wir es also ein bisschen nach oben. Nehmen wir an, wenn Sie etwas nach oben bewegen möchten , damit Sie es von hier aus ändern können, oder Sie können die Aufwärtstaste in Ihrer Tastatur so drücken . Okay? Also okay, unsere Fertigung wird erstellt, also fügen wir dieser Seite oder in diesen Rahmen ein Bild hinzu. Ich habe dieses Bild von Avengers Endgame. Ziehen wir es also in Figma und fügen es hier ein. Also lasst uns das so ansprechen. Und klicken Sie mit der rechten Maustaste auf dieses Bild und senden Sie dieses Bild in Schwarz. Und ein bisschen besser, das Problem mit Bildern, die Sie sehen können, führt dazu etwas Text. So können wir Zoom einfach so mögen. Und lasst uns das so ansprechen. Jetzt sehen Sie einfach perfekt aus. Okay, jetzt fügen wir einige Texte wie Filmname, Filmbeschreibung, Arbeit erledigt und alles, was Sie im Drahtgitter sehen können, hinzu. Also müssen wir den Namen oder die Beschreibung des Films hinzufügen, Schaltfläche „Jetzt abspielen“ und diesen Film. Also denke ich, dass es so ist, ich möchte diese Filmleiste erstellen. Erstellen wir also einen Film Parts. Wählen Sie Rechteck. Lassen Sie uns dieses Rechteck also transparent machen. Wählen Sie also linear. Sie können also sehen, dass es so transparent transparent wird. Unsere neue Abschnittsleiste ist also größer. Also lasst uns Filme hinzufügen. Lass uns ein Rechteck wählen und einfach ein Rechteck wie dieses erstellen. Richten wir sie also zusammen. Ich wähle alle Frames und auch das Rechteck L und M unten aus und leihe sie politisch aus. Okay, lass uns das hinzufügen, den Abstand dazwischen. Nehmen wir an, der Benutzer ist gerade in diesem Film. Lasst es uns also größer machen. Fügen wir also einen Pfeil hinzu. Also werden wir den Pfeil mit einem solchen Quadrat erstellen . Wählen Sie also dieses Rechteck aus und drehen wir uns etwa minus 45. So. Doppelklicken Sie darauf und Sie können die Punkte hier sehen. Klicken Sie also darauf und drücken Sie die Eingabetaste auf Ihrer Tastatur. Wir haben also nur zwei Teile dieses Quadrats. Fügen wir also einen Strich hinzu. Es summiert sich auf acht. So können wir es ein bisschen größer machen , damit es natürlicher aussieht. Also lasst uns 10 hinzufügen. Die 10, die Farbe zu Weiß. Klicken Sie nun auf Fertig. Also lasst es uns in diesen Rahmen verschieben. Und wenn wir keine Kurve an diesen Kanten verteilen, müssen Sie mehr Streicheln hinzufügen. Derzeit ist es 10. Lass uns addieren wie Flippen. Okay, und lass es uns kleiner machen oder 50 sammeln. Okay, fügen wir diesen Agenten zur Mitte hinzu. Unsere erste von gerade erschaffen. Also lassen Sie uns diese Seite für die TV-Show duplizieren. Und benennen wir das Imaging in Fernsehsendungen um. Und glätten Sie diese zugrunde liegenden Tools, TV-Show. Und lasst uns den Schlag davon entfernen. Und lasst uns den Schlaganfall in das Gewebe einbringen. Und wir müssen auch das Bild davon ändern. Speichern Sie diesen Rahmen und doppelklicken Sie auf Bedarf. Also müssen wir das Bild ändern. Sie erhalten also dieses Bildmenü und klicken auf diesen Button. Und mit Luft gefüllt. Gehe dann zu Shape-Werkzeug und platziere das Bild. Und lass uns dieses Bild hinzufügen. Sagen wir zwei hier drüben, so. Und lass uns dieses Bild hinzufügen. Okay, und jetzt fügen wir das Bild auf diesen Kacheln hinzu. Halten Sie die Umschalttaste gedrückt und wählen Sie alle Bereiche aus. Gehe zu Shape Tool plus Bild. Das sind also auch die Filme. Ich lege dieses Bild auf diese Kacheln. Das erste Bild wird also Endgame sein. Und zweitens wird es sein, sagen wir mal, danke. Und Black Widow und Spiderman. Kein Weg nach Hause. Wählen Sie „Öffnen“. Also werde ich das Endgame-Bild auf diese Kachel legen. Zweitens wird, glaube ich, Krieger und inspirieren sie und wird im vierten Stil sein. Und die schwarze Witwe wird beim Lebensstil sein. Fügen wir diesem Bild also einen Strich hinzu, damit es cooler aussieht. Nehmen wir an, dass ein bisschen digital weiß sein kann. Oder Sie können einen Change Agent lesen. Dies, machen Sie einen Schlag bis zu fünf. Oder du kannst es ein bisschen größer machen wie ein Protein. Es hängt also völlig von einem Komma Strich ab, den Sie wollen. Fügen wir diesem TV-Bereich also ein Bild hinzu. Wählen Sie den Stil aus, halten Sie die Umschalttaste gedrückt wählen Sie alle aus. Gehe zu Shape-Werkzeug. Lasst uns das Bild machen. Also werde ich dieses Bild zuerst vom Motiv platzieren. Und die zweite wird Hoffnung sein. Dritter wird Glück haben. Und der letzte stammt aus einer Division. Also für das Schreiben ist das Photon durcheinander, also füge ich Loci oder hier in die erste dritte Division ein. Fügen wir also den Namen und die Beschreibung des Films hinzu. Also lasst uns das duplizieren. Und lass es uns um 90 Grad drehen. Und passe es einfach für hier an. Und lass es uns so größer machen. Und gehe zu Effekte. Füge ihre Gruppe hinzu. Und lassen Sie uns diese Ebene bis zu 80 verwischen. Es hängt also völlig davon ab, wie viel Unschärfe Sie hinzufügen möchten. In diesem Fall wird es perfekt für mich sein, also füge ich das hinzu. Fügen wir also den Filmnamen hinzu. Wählen Sie also den Text aus. Der Filmname „Es ist“ arrangiert Endgame. Und Sie können sehen, dass die Schrift Oswald ist, und es ist regelmäßig. Und die Schriftgröße beträgt 11 Pi. Also lasst uns hier vorausschauend sein. So. Lass uns eine weitere Textur hinzufügen. Und es wird jedes Spiel werden. Und lass uns eine Filmbeschreibung hinzufügen. So können Sie die Formelbeschreibung zu MDB wechseln und diese MO-Beschreibung und den Text einfügen . Erstellen wir ein Rechteck. Und es ist bei Text-to-Speech Control V, so. Dafür wähle ich eine Schriftart namens Sofia pro und die Schriftgröße beträgt 22. Also lasst uns den Play-Button löschen. Gehe zu Rechteck. Erstelle ein Rechteck wie dieses. Und lasst uns hinzufügen. Lassen Sie uns dieses Rechteck also so oder hier in eine Runde verwandeln . Drehen wir also die Farbe ein bisschen blau in Rot. Und lasst uns den Text hinzufügen. Das Objekt wird jetzt gespielt. Derzeit ist die Schriftart Sofia pro. Die Schriftfarbe wird also weiß sein. Und fügen wir einen Strich und eine Geschlechterfarbe des Strichs in Weiß hinzu. So. Lassen Sie uns die Schriftgröße auf 40 erhöhen. Wie dieser endlose NTC hier drüben. Und wir müssen diesen Play-Button erstellen. Wechseln Sie zu Shape-Werkzeug und wählen Sie dieses Polygon aus. Truong ein perfektes Dreieck mit Shift. Und drehen wir das in minus 92. Okay, und lasst uns ein paar abgerundete Ecken hinzufügen. Also denke ich, wir können das ein bisschen größer machen und es wie 15 ausdenken. Also denke ich, dass weniger glatte Anzeige für sie funktioniert hat. Ok, und lass uns dieses Display jetzt hinzufügen. Okay, das sieht cool aus. Lassen Sie uns die Farbe des Spiels jetzt in Weiß ändern. Lassen Sie uns es also gruppieren, damit wir es auf der TV-Show-Seite verwenden können. Alle Dinge verwenden die Umschalttaste und drücken Sie Strg G, um sie zu gruppieren. Wählen Sie nun das Flugzeug, unsere Taste, halten Sie Alt gedrückt und ziehen Sie es in Richtung TV-Show. Okay, lass uns den Trailer-Button erstellen. Also lasst uns das duplizieren. Wählen Sie also Anzeigen aus. Jetzt halt diesen Trailer fest. Und lasst uns unterstreichen, Tweet unterstreichen, wie diesen Film-Button hinzufügen . Okay, lassen Sie uns die Farbe der rot unterstrichenen hier drüben drehen. Diese Schaltflächen werden also erstellt. Also lasst uns die Lesung hier hinzufügen. Also müssen wir das zuerst nach unten mögen, so. Gehe also zu Shape Tool und halte die Umschalttaste gedrückt, um einen perfekten Stern Lassen Sie uns diese Aufgabe zu phi mal duplizieren. Richten wir sie aus. Wir halten Umschalttaste gedrückt und wählen sie alle aus. Erst Allen, unten, dann vertikal. Und horizontaler Verteilungsabstand. Okay, ich wechsle den Farbwähler. Sagen wir, sehen so aus. Wählen Sie den letzten Stern aus und entfernen Sie die Füllung und fügen Sie einen Strich wie diesen hinzu. Wenn du willst, kannst du die Farbe ändern. Du kannst es so weiß machen. Und eine Sache bleibt übrig, ist die AD-Kurve darin. Fügen wir einen Eckenradius bis zu 200 hinzu. Lassen Sie uns sie also zusammenfassen, damit wir in einem anderen Frame verwenden, alle auswählen und G steuern können, um sie zu gruppieren. So können Sie die Filme, die Fernsehsendung, die Anmeldung, das Suchsymbol und das Glockensymbol sehen , die Farbe ist schwarz und das verliert sie nicht. Großartig. Also lass es uns weiß machen. Ändern Sie auch die Strichfarbe so in Weiß. Gleiches 40-Symbol für visuelle Suche. Und der letzte ist die Anmeldung. Wir sind also fertig mit unseren Projekten. Eine Sache bleibt also übrig, dass Prototyping hinzugefügt werden muss. Also werden wir das anfangs tun. Das war's also für das heutige Video, und wir sehen uns im nächsten. 36. Prototyping für die for: Willkommen, willkommen, willkommen. In diesem Video werden wir diesem Projekt einen Rollentyp hinzufügen. Wählen Sie also die erste Seite aus und gehen Sie zum Prototyp. Sie können sehen, warum diese weißen Punkte sind. Klicken Sie darauf und ziehen Sie es auf die Filmseite. Und derzeit ist es zu Filmen navigieren. Es ist also ein Onclick- und dann Imaging-Instrument. Im vorherigen Projekt wählen wir diese intelligente Animation kleinere Schule mit intelligenter Dynamik und offenlegen diese. Zweitens wird es unsere TV-Show sein. Wenn der Benutzer also auf die TV-Sendung klickt, wird er auf diese TV-Show-Seite umleiten. So können Sie alle Dinge wie onclick sehen. Und wir sagten die Animation in intelligente Animation. Und von der TV-Show-Seite möchte der Benutzer auf die Filmseite gehen, damit wir auf die Moodle-Seite gehen können. Dinge werden also gleich sein wie onclick, navigieren Sie zu Filmen und intelligenten Animationen. Okay, jetzt lasst es uns vorstellen. Klicken Sie auf diesen Button, um sie zu präsentieren. Okay, also kannst du sehen, dass unsere Basen so aussehen, aber momentan passt das nach meinem Display. Also muss ich es tun, das siehst du trotz voller Größe. Also entscheide ich mich für „verkleinert“, um zu passen. So können wir all die Dinge sehen. Drücken Sie R, um neu zu starten. Und ich möchte das hier anklicken. Sie können diese coole Animation sehen, intelligente Animation. Wenn ich also auf diese Filmseite klicke, kannst du sehen, dass die Hotkeys TV-Show sind. Also lasst uns drauf klicken. Und Sie können den Animationseffekt hier sehen. So können Sie diesen intelligenten Animationseffekt in diesem Film sehen. Wenn ich also noch einmal auf die TV-Show klicke, kannst du den wechselnden Effekt so sehen. Und auch der gleiche intelligente Defekt in dieser TV-Show. So können Sie Ihr Projekt prototypisieren. Und das ist unser Abschlussprojekt. Also bin ich ein großer Fan von Macht. Deshalb schätze ich diese Seite aus unserem, sagen wir, wenn Sie ein DC-Fan von Tau of n, einem Star Trek-Fan, sind , können Sie diese Art von Projekt für sie so erstellen . Nachdem Sie dieses Projekt erstellt haben, können Sie dieses Projekt auf Instagram hochladen. Und du kannst mich alles markieren damit du meine Instrumenten-ID hier sehen kannst. Also werde ich es wissen oder du bist ein Fan von Marihuana oder DC oder Star Trek oder Star Wars. Das ist also die Federal Reserve. Und wir sehen uns bei der nächsten. 37. Gestalte deine Musik-App: Willkommen zurück mit einem anderen Video. Bis jetzt haben wir solche Projekte erstellt oder haben Sie für Malware gearbeitet? Und das erste ist unser Wort, die App für die Lieferung von Lebensmitteln. Für dieses Projekt habe ich also eine Aufgabe für Sie gehört oder Sie können sagen oder probieren. also in diesem Test Was musst du also in diesem Test tun, also habe ich dieses Drahtgitter. Dies ist also das Drahtgitter für einen Musikplayer. Damit sie es transformieren und Ihren eigenen Musik-Player mit diesen Wireframes erstellen können , können Sie ihn benennen, wie Sie möchten. Sie können Ihre dritten Songs über Hügel platzieren und sich von Spotify oder der YT-Musik inspirieren lassen. Und Sie können jede gewünschte Farbe verwenden, oder wenn Sie einen Klon von Spotify erstellen möchten , können Sie das auch tun. Es hängt also total von dir ab. Wenn wir davon ausgehen, dass wir dies nicht tun können, werde ich dieses Projekt auch nach diesem Video erstellen. Also bleib dran darüber. Wenn Sie also zuversichtlich sind, dann machen Sie es und machen Sie dieses Projekt. Das ist es, was Religion und ich tun werden wie in der nächsten. 38. Musify UI: Im vorherigen Video habe ich dir dieses Drahtgitter gegeben. Ich weiß, dass einige Offshore dieses Projekt erledigen könnten. Wenn Sie also dieses Projekt erstellt haben, können Sie dieses Projekt in Ihrer Geschichte auf Instagram teilen und Sie können mich markieren, oh je, Sie können auch meine Instagram-ID sehen. Und Sie können ihre Projekte auch auf unserem Discord-Server teilen . Dann kann sich Aldosteron von Ihrem Projekt inspirieren lassen. Diese werden keine geführten Projekte sein, also lasst uns ein Projekt für sie erstellen. Lassen Sie uns also eine neue Datei erstellen. Also werde ich lesen, dass es sich so anhört Spotify. Ich weiß, dass es sich nach Spotify anhört, weil ich für 45 für Inspiration bezahle. Ich habe dir bereits gesagt, dass es sich von Spotify, Auto ID-Musik oder irgendeinem Öl oder anderen, deinem Lieblingsmusik-Player, inspirieren lassen Auto ID-Musik oder irgendeinem Öl oder anderen, deinem Lieblingsmusik-Player, kann. Also lasst uns einen Rahmen wählen. Derzeit haben wir das iPhone 13 max, also werden wir uns für dieses entscheiden. Schauen wir uns unser Drahtgitter an. Wir haben also Dinge wie Profil, Bild, Logo, Hamburger-Minimum und etwas Picchu-Schlaflosigkeit. Wird das also diese Dinge erschaffen? Okay, jetzt erstellen wir ein Logo für unseren Musikplayer. Was wir jetzt tun müssen, ist ziehen, um diesen Abschnitt für unser Bild und auch für unseren Liednamen zu erstellen . Wählen wir also ein Rechteck aus. Als Nächstes müssen wir das verwenden, um diese Symbole wie ein Herzsymbol, ein Abneigensymbol, eine Schaltfläche für Arbeit und Pause sowie Vorwärts - und Rückwärtsschaltfläche hinzuzufügen Abneigensymbol, eine Schaltfläche für Arbeit und Pause sowie . Also lasst uns diese Schaltflächen erstellen. Nun, was ist der dunkle Modus ist wirklich berühmt und viele Leute benutzen sie. Ich bin auch einer von ihnen. Lassen Sie uns also diesen dunklen Modus erstellen, bevor wir den obersten Knoten erstellen. Ändern wir also die Farbe dieser Schaltflächen. Wie wenn ich den dunklen Modus auf den Prim anwende, wird alles schwarz sein. Unser Buch mag also Les Paul Bourdon Hot-Button und Dyslipidämie wird nicht sichtbar sein. Listen nehmen also hier einige Änderungen vor. Wenn Sie möchten, können Sie einfach diese drei Dinge wie Play, Pause Button und Vorwärts- und Zurück-Taste auswählen diese drei Dinge wie Play, . Und du kannst die Farbe des Herzknopfes und dieses Dislike Buttons ändern . Du kannst sie weiß machen und diese drei Dinge werden blau sein. Es hängt also völlig davon ab, dass Sie die Farbe des Hamburgers und auch die Farbe dieser sehen . Low sagt es mir. Jetzt können wir unser Logo auf der Hamburger-Ikone sehen der Hamburger-Ikone Hamburger-Ikone und die Spanier waren fertig. Und das. Also lasst uns diese Dinge machen. Also V Das ist Musik. Musik. Also lasst uns die Songs erstellen . Das hier. Also der nächste. Das sieht also aus wie der nächste. 39. Prototyping von Musify: Willkommen zurück. In diesem Video werden wir für unsere Musik-App tun. Lasst uns also mit dem Prototypenbau beginnen. Wie Sie sehen können, habe ich vier Frames auf meinem Bildschirm. Fangen wir mit dem ersten Stream an. Wählen Sie also den Rahmen aus, der zum Prototyp-Panel geht. Also werde ich dem zweiten Frame des ersten Prinzips beitreten. Und fügen wir intelligentes Animations-Audio hinzu. Navigieren Sie zu unserem Tab navigieren Sie zu iPhone 12 Pro Max 1. Und eine Emission ist ein Instrument. Wählen wir also Smart Dimension. Okay, jetzt zum zweiten Frame, sagen wir mal, der Benutzer möchte das Lied ändern. Wenn Sie also auf diesen Button klicken, um sich zu belasten , wird sich das Lied ändern und die Firma wird dieser dritte Rand sein. Also lasst uns Normal wählen. Und ab dem dritten Frame kann der Benutzer so auf den zweiten Frame gehen. Und dafür werden alle Einstellungen gleich sein. Und von hier aus öffnet sich die Playlist. Entscheiden wir uns für die Martin-Mission hier. Ich denke, wir sind fertig mit unserem Produktmix, also lasst uns hineinatmen. Also lasst uns diese App benutzen. Bei der Tech-Smart-Zulassung können Sie sehen, dass das Logo jetzt oben steht. Und ich tue nicht so, als ob das Lied. Also klicke ich auf das Verbotene. Dies ist das zweite Lied. Und von hier aus kann ich zu meinem ersten Song zurückkehren. Von dieser Playlist-Schaltfläche aus. Ich kann so auf die Playlist zugreifen. Du kannst diese coole Animation sehen, aber ich kann nicht zurückgehen, weil ich für diese Playlist kein Prototyping gesagt habe. Also lasst uns das zuerst machen. Daraus muss es also auf den zweiten Rahmen gehen und weniger intelligent und emission. Jetzt lasst es uns nochmal spielen. Wenn ich auf diesen Button klicke und du siehst, dass die Playlist nach unten geht und sie wieder öffne, schließe. Und Sie können auch den Animationseffekt, Oreo, sehen. Das sieht echt cool aus. Das ist also das Protein für unsere Musikplayer-App. Das ist also deine Ableitung. Und wir sehen uns im nächsten Video oder nächste Woche. 40. Wireframing für die Social-Media-Website: Willkommen. Also in British würde Aufgabe argumentieren, eine Social-Media-App zu erstellen. Also kenne ich einige meiner Konkurrenten mit dieser Aufgabe. In diesem Video erstelle ich mein Wort dafür. Lassen Sie uns eine neue Designdatei erstellen. Okay, benennen wir es um. Also, in Bruce, wirklich auf früher anspielen, kannst du wie iPhone-Rahmen verwenden. Oder wenn Sie eine Webanwendung erstellen möchten, können Sie das tun. Für dieses Projekt werde ich es also verschieben. Erstellen wir also zuerst ein Drahtgitter dafür. In diesem Abschnitt werden wir also eine Gruppe wie diese haben wie . Angenommen, der Benutzer befindet sich derzeit im Diagrammbereich. Der Benutzer wird also aus dieser Flasche wissen, der Benutzer weiß, dass er verantwortlich ist. Okay? Das werden also unsere Gruppen sein. Also lasst uns etwas Textur hinzufügen. Okay, in diesem Abschnitt werden wir eine Gruppe hinzufügen. Also lasst uns Text hier bearbeiten. Und in diesem Abschnitt werden wir eine Nachricht von Personnels erhalten. Und hier drüben werden wir wie eine Nachricht von einer Gruppe oder von persönlich haben . Fügen Sie hier einen Anruf-Button hinzu. Fügen wir auch eine Schaltfläche für Videoanrufe hinzu. Und lasst uns diese Chat-Box erstellen. Hier fügen wir ein Mikrofon hinzu. Und in diesem Abschnitt werden wir ein paar Chats führen. Okay, also leichtgewichtiges Eisen in Berkeley zu beseitigen. In Gruppen fahren wir also in die Hölle, wie einige Gruppen, Gruppen, Schulklassen von Freunden. Und auch in der persönlichen Nachricht der Person von Ihren Freunden oder Ihrem Lehrer oder Ihren Kollegen so. Das wird also unser Drahtgitter für dieses Projekt sein. So wird meine Version also aussehen. Ich weiß also, dass du vielleicht anders fertig bist. Also ließ ich mich von der schlimmsten scheinbaren Zwietracht inspirieren. Im nächsten Video entwerfe ich also eine Benutzeroberfläche für unsere Social-Media-App. also, dass ich mich abmelde. Danke fürs Zuschauen und wir sehen uns im nächsten. 41. Social-Media-Website UI-Design: Willkommen zurück. Also haben wir in Bruce dieses Wireframe für unsere Social-Media-App erstellt. In diesem Video werden wir die eigentliche Benutzeroberfläche dafür erstellen. Ich glaube, ich muss mich in diesem Drahtgitter erinnern. Drahtgitter, Wählen wir ein Framerechteck aus. Und nur um in die Mitte zu gehen. Und das macht Spaß. Okay? Sie können also sehen, dass die Kolonisten scharf sind, also lassen wir sie die Verschiebung halten und sie alle auswählen. Lasst uns bis zu 20 nachholen. Verwenden Sie diese Beziehung versehentlich, um den Eckenradius also die Hintergrundfarbe von Grau verwenden zu müssen . Machen wir eine weiße Farbe wie diese und fügen wir einen Schlagschatten hinzu. Es hängt also wirklich von dir ab, welche Farbe du verwenden möchtest. Nehmen wir an, dass Sie an einer App arbeiten und nicht wissen, welche Farbe Sie verwenden sollen, dann können Sie diese Website namens Color Hunt verwenden. Und auf dieser Website finden Sie viele Farbpaletten wie diese. Für dieses Projekt verwende ich diese Farbpalette. Also habe ich es bereits heruntergeladen, also ziehe ich es einfach auf mein Figma-Projekt. Dieser oder dieser. Für diesen Abschnitt wähle ich mal diese Farbe aus. Du magst, Discord Wipe. Und fügen wir hier ein Logo hinzu. Okay, jetzt ist es an der Zeit, unsere Icons hinzuzufügen, wie in unserem weiteren Icon, wir bekommen wie zwei davon, wie dieses zufällige normale D-Quadrat für dieses Projekt, dieses. Es hängt also völlig davon ab, dass er eingestellt wird. Im Moment bin ich diese Icons wichtig, also fügen wir sie einzeln hinzu. Lassen Sie uns sie zunächst ein bisschen größer machen. Also benutze ich etwa 35. Also lasst uns 40 machen. So wird es mehr Metall oder cool aussehen. Ich glaube, ich mache es weiß. Mach sie warum? Dies ist nicht ausgewählt. Okay, lass uns sie eins nach dem anderen betreten. Cloud wird hier drüben sein. Wird sich einstellen. Okay, lass uns sie betreten. Halten Sie die Umschalttaste gedrückt und wählen Sie alle Und die Mitte richtet den horizontalen Abstand aus. Also habe ich den Abstand auch gelesen. Okay, lass uns jetzt ein Profil hinzufügen. Klicke drauf. Gehe zu Shape-Werkzeug. Legen wir es also auf dieses Logo. Du kannst es jetzt an diesem Ort sehen. Und sieht auch perfekt aus. Schlaganfall. Es hängt also völlig davon ab, ob Sie einen Strich hinzufügen möchten, den Sie hinzufügen können. Du kannst so gehen, wie es so ist. Also sind wir derzeit im Stuhl Abschnitt, also Rechteck. Ich benutze das. Sieh dir das an. Das hier. Bringen wir das nach vorne. Oder klicken Sie darauf und bringen Sie es nach vorne oder verwenden Sie sogar die rechte eckige Klammer, um nach oben zu drücken. Gut. Du kannst sehen, wie es aussieht. Okay, also ist es derzeit so. Okay, also lass uns eine Gruppe machen . Ich will es machen. Ändern wir also die Schriftart und die Schriftfarbe. Machen wir es noch mehr so. Edge-Gruppen. Okay, lass uns eine Gruppe von deinen Kollegen hinzufügen. Machen wir es zu einer regulären Zeile. So. 1909 wird mir irgendwie gut gefallen, so. Nehmen wir an, jemand hat eine Nachricht oder ähnliches, die Unternehmensgröße, wie diese fallen oder ähnliches, die lassen. Okay, es sei denn, eine Zeit. Der Benutzer weiß also, wann diese Nachricht zugestellt wird. King Zitat von jemandem, sagen wir 38, 130, notieren Sie eine Nachricht von dieser Gruppe. Okay, lass uns eine 10 machen. Ich glaube, ich habe mir zehn ausgedacht. Okay, lass uns es zu einer Gruppe machen. Weil wir dieses Ding mehrmals benutzen werden. Drücken Sie STRG, um sie zu einer Gruppe zu machen. Und lasst uns einen Satz wie diesen kopieren . Wählen Sie alle von ihnen nach oben aus, wie folgt. Und du kannst diese Zeit drehen OB. Und auch der Name dieser Gruppe ist bis zu 21 Jahren. Lassen Sie uns also genau das Gleiche in unseren ersten Klassenbereich kopieren , so. Okay, also zuerst weniger als der Gruppenname. Nehmen wir an, Sie haben K-Mers in dieser Gruppe. Fügen wir also ein Bild zu diesem Gruppenabschnitt hinzu. Okay, das erste ist also, das erste Bild ist unsere Konsole. Also füge ich hinzu, dass diese zweite Schüler sind. Nehmen wir an, die imaginären Studenten sind Programmierer. Also füge ich hier ein Wort hinzu. Es macht keinen Sinn für dieses Bild, also wähle ich ein anderes Bild aus. Sagen wir unsere Gerüchte aus der Akte. Also füge ich das Bild wie Loci hinzu. Fügen wir also das leukämische Chorion hinzu. Okay, so. Angenommen, Sie bearbeiten das Bild, aber das Bild ist sehr gut, also können Sie darauf doppelklicken, zu Füllen gehen und das Bild auswählen. Und Sie können eine Beschneidung wählen, dieses Bild. Oder du kannst Moody's mögen und das, storniere diesen. Jetzt füge ich ein paar Bilder hinzu. Ich denke, in Windows ist die Verknüpfung für Windows plus R-Punkttaste. So öffnet es das Emoji-Panel-Panel-Publikum. Sie können also Bilder wie dieses hinzufügen. Okay, diese Summe sagt, danke dem. Hier drüben so. Es hängt also völlig davon ab, wen Sie hinzufügen können, was Sie wollen. Also sind wir fertig mit unserer Gruppe. Sagen wir also, der Name dieses Mädchens ist ein Ritual. Als wäre ich ein großer Fan von ähnlichen Freunden. Also ist Nemo geschrieben. Sie können also hinzufügen, was Sie wollen. Sogar Arity Run GF Name, Audio nimmt Namen, Befreiung auf dich. Und der letzte wird Chandler sein. Danke. Fügen wir etwas zufällige Diktion hinzu. Okay, also habe ich hier drüben einen zufälligen Text gehört. Ich habe diese Zeit beibehalten. Auch die Botschaft von Rachel, Schauspieler 46. Also lasst uns jetzt ein Bild oder Bilder hinzufügen . In diesem Abschnitt werden wir das hier kopieren. Okay, im Testbereich. So können Sie das Problem hier sehen. Also habe ich diese Gruppe kopiert, aber die Gruppe ist nicht sichtbar, also muss ich einen Text hinzufügen. Schon wieder. Fügen wir ein einfaches Rechteck hinzu. Hier drüben wird es 20 sein. Machen wir es also ein bisschen größer. Also lasst uns hinzufügen, wenn ich es hierher ziehe, wird es wieder hinzugefügt. Also müssen wir dies voranbringen oder darauf klicken und nach vorne bringen wählen. Und jetzt lassen Sie es uns so hier platzieren, also müssen wir einige Änderungen vornehmen oder einen Strich hinzufügen. Lass es uns weiß machen. Wird weiß sein und auch die Schriftgröße erhöhen. Und derzeit ist sie online. Und das müssen wir entfernen. Wir haben also ein paar Icons Publikum, das die unterste Ebene sein wird, ziehen Sie es hier rüber. Und die Farbe dieses Hintergrunds ist weiß und auch die Farbe dieses Taiwans ist weiß. Es ist also nicht sichtbar. Bringen wir es also nach vorne. Bringen Sie nach vorne oder 40. Und explizit hier. Also track, Video-Symbol. Okay, bring nach vorne. Richten wir diesen Anruf und diesen Anruf aus. Also ist es Lambda. Sie scheinen das dreie.me-Symbol zu sein, wir haben dieses Minnesota nicht, wir müssen es manuell erstellen, indem wir drei Ellipsen verwenden. Eine Ellipse wie diese. Ich denke, wir müssen es ein bisschen kleiner machen. Also vielleicht wie okay, also ist es fertig. Lasst uns das hier verschieben. Sei einfacher, von einem Ort zum anderen zu wechseln. Also chats. Also lasst uns das kopieren. Auf der Farbpalette. Es gibt keine Farbe auf der Farbpalette. Lass es uns kleiner machen. Also lasst uns so kreieren. Importieren wir das mein Proton hier drüben. Die Kamera. Okay? Lassen Sie es uns zuerst größer machen. Sagen wir mal, lasst es uns so machen. In diesem Kapitel wird dies hier sein. Ich glaube, ist der Grund, warum dieser Film hier ist. Okay. Lasst uns diese Dinge ausrichten. Diese Dinge sind jetzt ausgerichtet. Geben Sie wie Ihre Nachricht ein. Ich glaube, es ist 14, wird gut werden. So. Also passiert die Dinge, dass nur der Chat oder so etwas? Also füge ich dir eine zufällige Chance hinzu. Sagen wir, ich habe Rachel ein Spiel empfohlen. Geben wir der Ecke 20 Polygon. Okay? Also lasst uns irgendwie so aussehen. Machen wir also eine Gruppe von ihnen, damit wir sie mehrmals verwenden können , oder Umschalttaste um diesen Pfeil hier auszuwählen, diesen Bearbeitungstext. Also lasst es uns schaffen. Und du kannst deine Lieblingsschrift so verwenden. Machen wir es also kleiner. Seiten, etwas kleiner, wie diese. Und wir werden pünktlich enden. Also kopiere ich das ziehe es hier rüber. Lassen Sie uns also einen weiteren Abschnitt erstellen. Ich kann diesen kopieren, aber ich möchte dieses Polygon auf die linke Seite bringen. Also muss ich das neue erstellen. Deshalb muss ich ein neues erstellen. Oder du kannst das gleiche benutzen. Also werde ich dieses Polygon beschreiben. Hier beende ich mein Social-Media-App-Projekt. Ich weiß also, dass Sie es auf andere Weise verwenden könnten oder Sie haben sich von verschiedenen Anwendungen wie Facebook oder Instagram inspirieren lassen . Es hängt also total von dir ab. Sieht vielleicht anders oder besser aus als ich. Dies ist also die einseitige Anwendung, daher werden wir den Prototyp nicht verwenden. Wenn wir also mehrere Seiten wie Musik-App hätten, also auf diesen Fotoseiten. Deshalb haben wir diese Projekte miteinander verbunden. Das ist also die einzelne Seite. So sieht meine Social-Media-App aus. Also und wir sehen uns im nächsten Projekt. 42. Projekt 5(Teste deine 5(Test: Willkommen, willkommen, willkommen. In diesem werde ich Ihnen etwas über die Projektdatei erzählen. Für dieses Projekt mache ich kein Drahtgitter oder irgendeine Idee. Du musst es alleine machen. Es ist irgendwie dein Test. Vielleicht denken Sie darüber nach, was wir bauen oder entwerfen müssen. Der Beginn ist alles, was Sie entwerfen können, App oder Webseite. Es hängt vollkommen von dir ab. Angenommen, Sie müssen unseren Pitch für einige Marken wie Nike, Puma aufbauen . Dann kannst du dich von Nike oder Puma inspirieren lassen. Oder Sie können einfach auf Google suchen, oder Sie können auch auf Dribbble suchen und versuchen, dieses Projekt zu erstellen. Und erinnere dich an eins, es sollte einzigartig sein. Und du musst kreativ sein. Und etwas von deiner eigenen Kreativität. Es gibt einige Schritte, die Sie befolgen müssen. Als würde der erste Schritt inspiriert werden. Der zweite ist das Erstellen eines Drahtgitters. Der dritte Schritt ist die Design-App oder Webseite. Der Schritt vorwärts wird bei dieser dreiseitigen App auf einer Webseite und einem Prototyp für steife Bußgelder geklärt . Und der letzte Schritt ist, dein Projekt mit mir und auch mit deinen Freunden zu teilen . sind also die Schritte, die Sie befolgen müssen, um dieses Projekt zu erstellen. Ich weiß, dass du es schaffst. also, dass ich mich abmelde. Danke fürs Zuschauen und wir sehen uns im nächsten. 43. Rastersysteme in Web- und UI-Design: Willkommen zurück. In dieser Einheit werden wir erfahren , was Grid ist. Raster sind das Skelett der designdeklarierten Ausrichtung, die Ihnen hilft, den Content-Top zu erstellen, zu ordnen und zu organisieren, den Sie entwerfen. ob Sie ein Layout für einen Druck wie ein Magazin erstellen oder Bilder und Texte kombinieren, um eine Landingpage zu entwerfen, Sie verwenden Raster, um Designentscheidungen zu treffen und ein gutes Erlebnis für die benutzer. Verwendung eines Gitterelements, zufällige Entscheidungsfindung. Anstatt Elemente an zufälligen Stellen zu platzieren. richtig richtig verwenden, wissen Sie genau, wo Sie Elemente wie Logo, Menüelemente, Überschriften, Körperkopie, Bild und Modus platzieren müssen . Es wird dazu beitragen, Ihren Designprozess zu beschleunigen. Warum sind Griffe im digitalen Design wichtig? Grills helfen dabei, digitales Design zu gestalten und zu erbe. Ohne sie haben Sie keine Ahnung, wo Sie Elemente platzieren sollen. Wir brauchen sie, um eine gute Benutzererfahrung zu schaffen. So weiß der Benutzer, wie man durch eine Website navigiert und herausfindet, was er benötigt. Gitter helfen auch, was es um reaktionsschnelles Design geht. Während das Desktop-Erlebnis der Landing Page möglicherweise mehrere Spalten verwendet , um Text und Bild auszugeben. Das Design muss flexibel genug sein , um auf zwei bis drei Spalten auf dem Tisch und eine Spalte auf dem Mobilgerät zu kondensieren zwei bis drei Spalten auf dem Tisch und eine Spalte auf . Beachten Sie, wie der mobile Greer im Beispiel zu einem Stapel wie einer Spalte oder einem kleinen Raster wird . Es gibt fünf Haupttypen von Rastern. Einige sind besser als andere für Webdesign. Aber haben Sie wahrscheinlich alle Phi bei 1 in Ihrer Designkarriere verwendet ? Das erste ist das Baseline-Raster, Das zweite ist Manuskriptraster. Spalte, dritte ist das Spaltenraster. Photon ist modulares Gitter und zum letzten ist ketzerisch. Erstellen Sie diese fünf Gruppen sind wirklich wichtig, aber ich denke, dass das Säulenraster für uns wirklich wichtig ist. Columbia hilft dabei, den Text für Beiträge und Illustrationen aufzuteilen . Für Websites können Sie überall von Goodwill oder sogar 16 Spalten haben . Lass uns den Wirbel ausgeben, die Leihseite. Sie können Text und Bild in nur einer Spalte oder sie können sich über mehrere Spalten erstrecken. Der Abstand zwischen der Säule wird Träger genannt. Sie sollten alle gleich groß sein, nicht alle Säulen Gitterhaare, um symmetrisch zu sein. Sie können beispielsweise ein Assimilator-Säulenraster verwenden ein Assimilator-Säulenraster bei dem einige dünner sind, während andere breiter sind, was je nach Erbin Ihres Designs nützlich sein kann . Ein Friedhofssäulenraster wird häufig in Blogs verwendet, Websites, auf denen Sie den Hauptinhalt vergrößern haben , führen dritte Container des Layouts aus. Während der kleinere Begriff die Seitenleiste sein kann, die Informationen über den Blog und den Autor interessiert. Nachdem Sie Ihre Recherchen durchgeführt haben, möchten Sie vielleicht ein Wireframe mit geringer Wiedergabetreue auf Papier erforschen . Erstellen Sie einen Greer für Ihre Landing Page ist einer der einfachsten Schritte. Sobald Sie es erstellt haben, müssen Sie nicht mehr über alle nachfolgenden Zielseiten nachdenken . Bevor wir beginnen, erledigt zuerst alles, was das Raster abgedeckt hat, anstatt es bis zum Ende zu belassen und zu versuchen, Ihr Design in ein Raster zu passen. neue Designer fühlt sich möglicherweise durch die Idee, eine Gruppe zu verwenden, beschränkt , aber das sollten Sie nicht. Nachdem Sie ein Raster erstellt haben, ist es in Ordnung, es zu brechen. Aber zumindest machst du es absichtlich und sie sind zur Designentscheidung geschrieben. Je mehr Sie Raster verwenden, desto mehr erkennen Sie, wie es sich um einen Leitfaden handelt, und es wird Ihnen helfen, besser und schneller zu gestalten. Das sind also alles Dinge, die unsere Gruppen haben. Das heißt also, sich abzumelden. Danke fürs Zuschauen, und wir sehen uns im nächsten. 44. 15 Dinge, die dein UI-Design anstellen!!: Und Jurys werden alle von dichterer Fruchtbildung oder App-Bildschirm angetrieben . Einige von ihnen sind einfach, einige von ihnen sind es nur, aber einige von ihnen sind beleuchtet. Könnte Lead vergeben. Ich meine, dass die Benutzeroberfläche, die attraktiv aussieht, wie der Benutzer möchte, und die Benutzeroberfläche, die auf seinen Benutzer hört. Danach macht das Drucken, das dich zum Leben bringt. Wenn Sie all diese Dinge lernen, werden Sie erfolgreich gelernt, eine Benutzeroberfläche zu erstellen, die sie hört. Der Benutzer sieht attraktiv und entzückend für den Benutzer aus. Lasst uns also eins nach dem anderen etwas über diese Dinge lernen , beginnend mit Typografie. Jede Benutzeroberfläche mit Puffer WTP leuchtet, da mehr als 60 Prozent der Anwendung entweder Text sind oder vollständig von Texten abhängen. Zum Beispiel hat eine Artikelanwendung genau wie Medium mehr als 60 Prozent der Anwendung für sie mit Detektion. Auf der anderen Seite in einer Anwendung, die über das Kontrollkästchen der Schaltfläche verfügt kann Dropbox in einer Anwendung, die über das Kontrollkästchen der Schaltfläche verfügt, ohne Text nicht wirksam sein, da der Benutzer möglicherweise nicht versteht, welche Schaltfläche für die Anmeldung für die Anmeldung als wichtige Rolle im Anwendungs-UI-Design. Daher ist es wichtig, es richtig zu verwenden und Text richtig zu verwenden. Es muss genau gestylt werden. Farben. Farben sind der wichtigste und sehr entzückendste Teil des Designs. Genau wie der Künstler, nichts ohne Farben, ist die Benutzeroberfläche nichts ohne Farben. Daher ist es wichtig, Farben in das UI-Design zu legen . Farben im UI-Design sorgen für Anziehungskraft und verwenden ein Revers. Durch die Verwendung von Farben kann der Designer als Tatsache Leben in sein Design einbringen , aber auch als psychologischer Auslöser für den Menschen arbeiten. Für eine bessere Erfahrung und das Entwerfen von App-Interfaces sollten Sie daher und das Entwerfen von App-Interfaces Farbe in Ihrem Design verwenden. Aber manchmal, wenn wir einen Fehler gemacht hätten , während wir Farben verwendet , damit unsere Symbole eines der am häufigsten verwendeten Elemente herausfinden. Nun, was ein Designer mit dem niedrig ist, weil der Benutzer es schnell versteht, anstatt den Text zu lesen. Da Menschen visuell leicht verstehen oder den besten Weg, sie zu Ihrem Vorteil zu nutzen , wenn Sie ein UI-Design entwerfen, kann ich die neuen Dinge als unsere Vorfahren beginnen, um sie zu verwenden, um ihr Königreich und ihre Bereiche zu definieren. Das Königreich, in dem Sie Flaggenlinie mit Liniensymbol finden. Illustration. Illustrationen sind eine der besten Möglichkeiten, ein attraktives Bild hinzuzufügen , das Sie auch entsprechend anpassen können. Normalerweise ist die Illustration viel besser als die Verwendung von einfachen Illustrationen, die klein sind und in einer App-Bildschirmgröße nie verschwommen aussehen. Wenn Sie eine SVG-Illustration verwenden, machen Sie eine Illustration, um den Inhalt für den Benutzer verständlicher zu machen. Das Bild ist eines der beliebtesten und alten visuellen im weißen Design. Die Bilder sind alle, aber sie werden wie gewohnt als Mieter bezeichnet, aber dann der Nur-Text. Da Menschen visuelle Kreaturen sind, die Last, Bilder zu sehen. Bilder zeigen Emotionen bei den angegriffenen Gefühlen des Nutzers. Und es hat wirklich geholfen, den Benutzer anzugreifen und zu Kunden zu machen. Was, wenn es nicht richtig verwendet wird, kann Ihnen große Probleme bereiten. Und Emission, Emission ist das am häufigsten verwendete Ding im Weiß, das entwickelt wurde, um die Benutzerinteraktion zu fördern , da der Benutzer sich einige der coolen Animationen ansieht, sich gut fühlt und gerne mit dem Anwendungssoftware oder Website. Und Emission wird auch verwendet, um Feedback zu geben wenn Benutzer auf etwas klicken oder etwas erreichen. Zum Beispiel als eine erfolgreiche Behandlung Nachricht, wenn Sie Ihr Geld auf ein anderes Konto überweisen. Migrantenrichtung zeigt eine einfache Animation mit der App , die die normale Funktion anscheinend von Anna angegriffen zu werden scheint, z. B. doppeltippen Sie auf das Bild, um Migrantenschutz in zu mögen Instagram. Diese einfache Animation, wie man perfekte Listen als Bestellanimation verwendet, lässt den Benutzer von Ihrer Animation gelangweilt sein perfekte Listen als Bestellanimation . Personalisierung. Personalisierung bedeutet, den Inhalt zu empfehlen, der sich auf die Benutzerauswahl bezieht , die sie zuvor mit der Anwendung getroffen haben. Indem Sie die Daten speichern und sein Team der Erlaubnis des Benutzers entspricht, können Sie Ihre Bewerbung ganz einfach personalisieren. Der Benutzer liebt es, etwas Personalisierteres zu sehen, da sich wichtig fühlt und die App interaktiver macht. Wenn der Benutzer beispielsweise Videos zum Wagen lädt, würde er gerne Ihr anderes CAD sehen. Warum werden wir in dieser YouTube-Empfehlung anstelle einer Vorführung verwenden , Video wischen, Navigation, nahrhaft. Und eine der wichtigen Funktionen der Anwendung , ohne die der Benutzer die Anwendung nicht verwenden kann. Daher ist es besser, den Navigationsherd intelligenter zu machen. Flex 45, YouTube, Amazon verwenden Navigationsleisten, Menüs und andere Schaltflächen, um den Benutzer einfach durch den Startbildschirm der Anwendung zu navigieren. Dies ist Eunice, Benutzeroberflächen zu erstellen, ist eine der wichtigsten Aufgaben und Interface-Designer, die 2021 erledigen sollten. Und wegen der Reaktionsfähigkeit kann Ihr UI-Design grundsätzlich in so vielen Bildschirmen wie möglich fixiert werden. Weil wir uns jetzt im Zeitalter von Messgeräten befinden, in denen 70% der Menschen noch mehr als einen Mann haben oder benutzt haben. Welche Anfrage warum entwerfen? Minimalismus? Das Lead-UI-Design konzentrierte sich auf Minimalismus. Die Verwendung von Minimalismus subtrahiert im Grunde weniger verwendete Elemente von Benutzeroberfläche und bringt das wichtigste Element auf den Bildschirm. Minimieren bedeutet nicht, nützliche Schaltflächen zu entfernen , nur um den App-Bildschirm sauber zu machen. Es dreht sich alles um Styling und Abstand. Parität. Sie warum entsteht mit der Erbin des Elements, was bedeutet, dass die wichtigsten Dinge oben auf dem UI-Design stehen müssen und der Rest der Dinge entsprechend angeordnet ist. Heterotrophie ist im UI-Design sehr wichtig, da sie sich auf wichtige und weniger wichtige Abteilung konzentrierte und Designern hilft, sie auf eine bestimmte Weise anzuordnen , die Ihnen hilft, einfach in der App zu navigieren. Konsistenz, die Aufrechterhaltung der Konsistenz ist am wichtigsten. Es bedeutet, das gleiche Styling des Elements in der gesamten Anwendung zu verwenden . Wenn Sie verschiedene Elemente- oder Dilemmastile verwenden, Ihre Arbeit Lord High und die App-Qualität niedrig. Die Verwendung des Wahlkreises etwas einfach, aber entscheidend. Einige Elemente der App mögen der Funktion gleich sein, unterscheiden sich jedoch in den Farben, dem Schema und dem Test, identifizierten sie und ändern sie von Ihrem APTT ihn als Exponat a. Verteilt im Grunde genommen bedeutet das Entwerfen des Designs für Menschen anders als normal. Sie können Linkshänder einschließen, behinderte Menschen sind behinderte Menschen. Weiter zurück. Das Kritischste, was sich vom Leck unterscheidet, ist ziemlich schlimm. Die Designerin, die weiß, wie man ihren Rücken benutzt ist die Designerin, die unser Design kennt. Eine tatsächliche Benutzeroberfläche. Für Mängel sind die kritischsten Dinge, da einige Benutzer für Sie zurück mit guten Bewertungen und andere mit der Bank, nur versucht haben, ihre Probleme zu verstehen und sie dann zu lösen. Und Ressourcen. Je besser Tools und Ressourcen Sie haben, desto besser wird Ihre Anwendung. Als ob Sie bessere Ressourcen für Symbole haben, sieht diese MCU-Benutzeroberfläche attraktiver aus Entwerfen von Tools ist auch in gewissem Maße wichtig. Werkzeug zum Entwerfen von u1 muss eine hohe Leistung aufweisen. Have Plugin Support unterstützt auch die Anforderungen von Unternehmen und wie alle grundlegenden Dinge, die für Sie erforderlich sind Ich entwerfe Widerstände die Sammlung der Dinge sind, die Designer für eine bessere UI-Erstellung verwenden, wie Icon-Erfolg, Illustrationsressourcen, Bildressourcen und Stimmung. Hier kommen wir also zum Ende meiner Liste und filtern Dinge, die die Benutzeroberfläche zum Leben bringen. Aber weil du mit mir zusammen geblieben bist, ein Bonus für dich. Die Boni folgen dem Trend. Ihr Stränge seid ein Teil davon. Wenn Sie Wert auf Ihren Benutzer übertragen oder einfach die Qualität Ihres UI-Designs verbessern. Lead Designer wissen, wo sie sind, wie man angespannt benutzt und wir sind es nicht. Und Sie könnten darüber erfahren , indem Sie die Trends lesen und verstehen. Manchmal wie Nudelmorphismus ist einzigartig und kann nicht verwendet werden , aber manchmal kann ein Stein in irgendeinem Teil des Weges mit grundlegender Funktionalität verwendet werden . Das sind also alles Dinge, die Sie als UX-Entwickler der Benutzeroberfläche wissen müssen. Das war's also für heute. Und wir sehen uns im nächsten. 45. 5 WEBSEITE, DIE DU SEHEN MUSS! Web: Willkommen zurück. In diesem Video erzähle ich Ihnen die fünf besten Websites, von denen Sie sich inspirieren lassen können. Der erste ist, und auch mein Favorit, dass der Drupal von gribble, man kann sich viel inspirieren lassen. Sie können sehen, wie viele Leute ihre Arbeit im Inspirationstyp hochladen , wie viele Leute ihre Arbeit im Inspirationstyp Wir erhalten alle Optionen wie Webseiten-Animation, Branding, Illustration, Handy, Druck, Webseite, Topographie, Produktdesign und all das. Wählen wir also das Webdesign damit Sie alle Webseiten sehen können. Angenommen, Ihr Kunde möchte eine Website für Kryptowährung erstellen eine Website für Kryptowährung , dann können Sie sich diese Websites ansehen. Sie können all die Dinge wie Weizenfarbe sehen , die er verwendet hat, auf dieser Website. Sie können ihnen auch von hier aus folgen. Sie können diese Seiten auch kommentieren. Ich kann sie auch mögen. Und Sie können auch die ähnlichen Webseiten für Kryptowährungen sehen . Und wenn Sie eine bestimmte Webseite oder App herausfiltern möchten , können Sie auf diese Filterschaltfläche klicken. Und Sie können auch Tags hinzufügen. Angenommen, Sie möchten eine ähnliche Health SMS App erstellen. Sie können hier ein Head Tracking eingeben. Sie können auch eine Farbe auswählen. Und es wird Ihnen alle Websites empfehlen , die diese Farbe hat, ist rosa Farbe. Und Sie können die Option sehen, wir bekommen Optionen wie Figma oder eine Basis di, die auf Fleisch und unser Bein entkommen ist. Und vom Download können Sie für unsere verschiedenen Softwares wie Figma oder eine Großstadt für ein Geschäft herunterladen, das ich kenne, leg. Und Sie können von hier aus auch Ihr eigenes Design hochladen. Wir müssen uns zuerst dafür anmelden. Okay, also die nächste Website ist Behance. Es ist also irgendwie ähnlich. Von hier aus erhalten Sie aus dem kreativen Bereich alle Optionen. Oder wenn Sie Ihnen klar machen möchten welche Sprache Sie lesen, bestellen, Posterdesign, dann wird Ihnen diese Website sehr helfen. Sie können sehen, sind wir gute Optionen wie Art Director, Branding, Illustration und Alarm? Und auch. Wir sind also an Benutzeroberflächenwellen interessiert, die jemals entworfen wurden. Also kriege ich diese Dinger. Sie können auch auf diese Webseite klicken, um weitere Details zu sehen. Als würde es Fettleibigkeit aufbauen. Du kannst dem Schöpfer folgen. Sie können sehen, wie die Beschreibung dafür ist. Wenn du etwas herausfiltern willst , kannst du das auch tun. Nehmen wir an, wenn Sie nur nach Figma suchen möchten, können Sie es auch bei mir auswählen oder hier ersetzen. Es werden also nur die Figma-Dateien angezeigt. Als ob diese eine Figma-Datei ist. Sie können darauf klicken und Sie können die gesamte Beschreibung für diese App sehen . Wie Dribble können Sie auch eine Farbe wählen. Und es wird Ihnen die ganze Website zeigen, die diese Farbe hat. Sie können auch nach Ihrem Standort als cool und all das herausfiltern . Und Sie können in der Seitenleiste sehen , dass wir Optionen wie eine Gruppe, Projektbilder, Prototypen, Personen und Moodboards haben. Nehmen wir an, Sie möchten schießen, sagen wir, Sie möchten einige Produkte sehen, Sie können darauf klicken. Und es wird alle Prototypen zeigen. Und ich lasse Sie auch Ihre eigene Webseite oder App auf dieser Website hochladen , aber Sie müssen sich dafür anmelden. Der dritte ist Grönland. Von dieser Website erhalten Sie alles wie Sie die Kategorien wie E-Commerce sehen können , und ich lasse Sie auch auf Mehr anzeigen klicken , um Auditing wie Fitness, Musiknotation und all das zu sehen . Es ist also nicht für die App. Sie können sehen Werden wir Optionen wie Landing Pages und Benutzerflows erhalten. Wenn wir, wenn ich darauf klicke, werde ich zum Webseitenbereich weiterleiten. Sie können also sehen, dass wir alle Webseiten von hier aus bekommen. Sie können auch von hier aus herausfiltern. Gefällt mir, welche Art von Website willst du? Angenommen, Sie möchten eine Website für den E-Commerce erstellen, Sie können diese Option namens E-Commerce auswählen, ist auch eine sehr gute Website, von der Sie sich inspirieren lassen können. Die vierte ist Seite c. Dies ist auch dieselbe Website wie Dribble Behance. Wenn Sie also etwas suchen möchten, können Sie es von hier aus suchen. Und Sie können den Knoten auch von hier aus filtern. Wie, welche Art von Farbe willst du? Nehmen wir an, Sie möchten eine Website im Lehrplan besuchen. Und wir können Grau wählen. Und es wird dir zeigen, wie schief das eine Lehrplaneinheit hat. Und Sie können auch einige herausfiltern wie wenn Sie einen Blog erstellen möchten, können Sie auch einen Blog, einen E-Commerce und eine Warnung auswählen. Es gibt also einige ehrenwerte Erwähnungen wie Zettel , die Stunden pro Woche genannt werden. Drei Ws. In diesem Kapitel haben wir unseren gesamten Siegerkomplex wie diesen. Drei sind ich denke, unser Siegervorlagen-Krieger. Sie können auch Ihr eigenes Webdesign-Audio einreichen. Und in diesem Hamburgermenü sehen Sie die Fenster, Nominierten und die Sammlung. Dies ist auch großartig zu beobachten, von dem man sich inspirieren lässt. Die nächste ehrenwerte Website ist also vom Anblick inspiriert. Das absurde wird vor allem zur Inspiration dienen. Von hier aus kannst du auch wie jubelnde Behance herausfiltern, wie Titeltypen, wie etwa welche Arten von Typen du willst. Angenommen, Sie möchten eine Website für Agentur und Beratung erstellen , Sie können diese Option wählen. Sie können auch alle Optionen von hier aus sehen. Wir bekommen auch die Option namens Subjekt. Von hier aus können wir verschiedene Themen wählen. Auch die Plattform und auch der Überspannungskörper. der Suchleiste können Sie eine bestimmte Website wie E-Commerce durchsuchen . Und die letzte ehrenvolle Erwähnung braucht eine Seite. Nehmen wir an, Sie sind ein Kunde. Gewiss. Wir müssen so etwas wie eine einseitige Anwendung erstellen. Und Sie können sich diese Website ansehen , die als einseitig niedrig bezeichnet wird. Auf dieser Website erhalten wir also nur eine einzelne Seite, eine Webseite wie diese. Du siehst, das sieht echt cool aus. Krieger. Ich weiß, dass du die einseitige Anwendung bist. Ich habe es auch von einem meiner Freunde erfahren. Er ist auch UX-Designer. Also erzählte er mir, dass YouTube eine einseitige Anwendung ist. Das sind also alle Websites, von denen Sie sich inspirieren lassen können. Nehmen wir an, du wolltest etwas bauen, aber du bekommst keine Idee, wie man es baut. Sie können sich all diese Website ansehen von der Sie sich inspirieren lassen können. Das ist also ein Portrait. Und ich werde es im nächsten machen. 46. 50+ kostenlose Tools und Ressourcen zum Erstellen fantastischer Benutzeroberflächen: Willkommen zurück. In diesem Video erzähle ich Ihnen kostenlose Ressourcen , die Sie für Ihre Projekte verwenden können. Dieser Artikel ist auf der Nummer 2 verfügbar. Diese Website ist sehr hilfreich wenn Sie Programmierer oder Webentwickler sind. Aber er würde Dinge wie unsere technologischen Dinge tun , dann wird diese Website sehr helfen. Also habe ich auf dieser Website den Artikel gekauft. In diesem Artikel erhalten wir 50 kostenlose Tools oder Ressourcen, die wir für unsere Projekte verwenden können, wie Fotos und Videos, Elektrikerpalette, Topographie und Emissionseffekt, Ikonographie in Musterformen und Verstümmelung. Sie könnten also sehen, dass ich die DOE-Website namens Pixel für meine Projekte verwende . Es ist also eine sehr hilfreiche Website , um Stockvideos und Fotos zu verwenden. Ich benutze diese Website auch oft, um meine Videos zu erstellen. Und Sie können andere Optionen wie Kohle und für das Theater und all das sehen. Von hier aus können Sie sich auch andere Websites ansehen. Und wenn Sie möchten, aber wenn Sie eine ähnliche Seite oder ein Bild von einer Person haben und den Hintergrund daraus entfernen möchten. Sie können diese Website, die auf dem Bildschirm genannt wird, und auch diese absurde Karte, Remote-Grand-Runde, verwenden. Manchmal stellen Kunden Bilder zur Verfügung aber wir brauchen nur das Image dieser Person. Ich benutze dieses absurde Remove BG. Es hilft mir also sehr. Das Absurde ist also auch richtig cool. Dies ist die EHR-basierte Website. Welche Website es tut, ist, dass sie zufällige Gesichter von Personen erzeugt. Wenn Sie also verwenden möchten, bauen wir an, Sie erstellen eine Social-Media-App. Und diese App, du hast einen Story-Bereich. Und du willst Bilder von Menschen machen, dann kannst du diese absurden geschlechtsspezifischen Menschen benutzen. Also lass mich dir eins sagen. Das sind nicht die echten Menschen. Diese Bilder werden von AI erstellt. Es ist also sehr hilfreich, diese Bilder zu verwenden. Die nächste kostenlose Ressource, es ist Illustration. Also benutze ich das Illustrationslos nicht. Ich habe nur Illustration in meinem, denke ich an, lass mich dir mein Projekt zeigen. Also verwende ich die Illustration nur auf dieser Website. Sie können die Illustration hier auf der zweiten Seite und sonst auf dieser dritten Seite sehen. Dafür können Sie sich diese absurde Karte ansehen, Papier öffnen, Illustration der Illustration zerschlagen können. Wir werden Optionen wie SVG, SVG und PNG bekommen. Sie können in diesem Format herunterladen. Und auch die Kontrollnahrung. Ich habe diese Bilder von dieser Website aus dieser Kontrollillustration verwendet. Wir bekommen auch andere Websites wie autsch und die automatisch generierte. Also das nächste Free versus sagt, sind Pellets, diese. Wenn Sie also eine Website erstellen möchten und Ihr Kunde keine Farbpalette erstellt. Sie können also auf diese Website gehen, um eine Farbe auszuwählen. Sie können Ihre eigene Farbe erstellen. Und ich mag eine Website namens Color Hunt, also habe ich Ihnen unsere Website gesagt, damit Sie sich auch dafür entscheiden können. Ich verwende diese genau gleiche Farbpalette in unserem Social-Media-App-Projekt. Sie können sich alle Websites wie Farbraum, gültige App, Colorable und Outlet und am nächsten Tag ansehen. Also diese Tomographie, sagen wir, Ihr Kunde sagt, ich will nur die spezifische Schriftart. Dann kannst du auf diese Seite gehen und nach dieser Schriftart suchen. Und du kannst es herunterladen und du kannst es in deinen Projekten verwenden. Und wir können andere Optionen wie Fonda, Arianna, Schriftarten-Mädchen , genießen, Zeitskala und wie LED bekommen. Also als nächstes Ressourcen für Anwendungen, Ikonographie. Von diesen Websites können Sie also ein bestimmtes Symbol für Ihr Projekt herunterladen. Angenommen, Sie bauen eine Social-Media-App auf. Dann können Sie auf diese Website gehen und Sie können alle Icons von hier herunterladen. Und diese Symbole können kostenlos verwendet werden, dann können Sie sie in Ihrem Projekt verwenden. So erhalten wir Optionen wie Icon Stola, CSS, Icon, Icon, Übersetzungsgenerator, müdes Symbol. Sie können hier Adoptionen sehen. Nächste Mittel sind also Patente auf Schiffen. Sie bewerben sich also auf 12 wie bestimmte Schaltfläche auf Ihrer Webseite oder App Sie können zu diesen Websites wie CSS Baton, Gateway von Disruption gehen . Oder Sie können ein anpassbares erstellen. Sie können sehen, dass ich von Wellen wie dieser Webseite und BS1 benutzt habe. Aber ich habe das mit Figma erstellt. Wenn Sie jedoch einen Kunden erstellen möchten, können Sie auf diese Website namens Ghettos gehen. Und wenn Sie einen maßgeschneiderten ihn erstellen möchten, können Sie auch diese Website namens vol Mekka verwenden. Okay, das ist eine wirklich coole Website namens Red Lines. Sie können die wirklich cool aussehenden Patente von dieser Website löschen . Das sind also alles kostenlose Ressourcen, die verwendet werden können. Also gebe ich Ihnen den Link dieser Website in den Ressourcen, Sie können ihn von dort aus überprüfen. sind also alle kostenlosen Ressourcen, die Sie für Ihre Projekte verwenden können. Das war's also für das heutige Video, und wir sehen uns im nächsten.