Figma für Benutzeroberfläche und Benutzererfahrung UIUX

1. Figma-Intro: Hallo zusammen und willkommen zu unserer Klasse von Figma for Learning Wenn Sie planen, Benutzeroberfläche und Benutzererfahrung von Anfang an zu lernen , sind Sie hier genau richtig Weil wir in diesem Kurs die Bedienung dieser speziellen Anwendung von der Grundstufe bis hin zu den Fortgeschrittenen behandeln Grundstufe bis hin zu den Fortgeschrittenen werden. Dies ist ein Kurs für Anfänger. Wenn Sie noch keine Erfahrung haben, können Sie einfach an diesem Kurs teilnehmen und wir können gemeinsam lernen. Schauen wir uns zunächst an, was Sie in diesem Kurs alles lernen werden. Zuerst werde ich euch die Einführung erzählen, zum Beispiel, was diese Anwendung Figma macht und warum sie besser ist als jede andere Anwendung , die UI UX designt Danach werde ich euch vom Arbeitsbereich und auch von der Benutzeroberfläche erzählen , okay? in jeder Anwendung oder in jeder Software Wenn Sie in jeder Anwendung oder in jeder Software mit dem Arbeitsbereich an der Benutzeroberfläche vertraut sind, wird es für uns recht einfach sein, in demselben Bereich zu arbeiten. Als Nächstes werde ich euch von allen grundlegenden Tools in Figma erzählen , was ihr alles verwenden könnt Okay, ich werde euch sagen, wie ihr euer Objekt bewegen könnt oder wie ihr einen Rahmen erstellen, einen bestimmten Rahmen auswählen und ihn nach euren Wünschen skalieren könnt einen bestimmten Rahmen auswählen und ihn nach euren Wünschen skalieren Und ich zeige dir auch, wie du Bilder, Videos und verschiedene Arten von Formen importieren kannst . Okay, danach werde ich euch sagen, wie ihr Seiten verwenden könnt. Manchmal müssen wir mehr als zwei Seiten erstellen . In diesem Fall geht es darum, wie Sie Seiten und alle Funktionen im Zusammenhang mit Seiten verwalten werden. Ich werde Ihnen alles danach erzählen, Sie werden Prototyping in Figma lernen, was Ihnen helfen wird, Ihre eigene mobile Design-App oder Ihre Webseite zu erstellen Design-App oder Ihre Webseite Okay, Sie können also Ihre eigene Webseite oder Ihre mobile Anwendung entwerfen , sodass Sie all diese miteinander verbinden und ein gutes Ergebnis erzielen können all diese miteinander verbinden und ein gutes Ergebnis erzielen Danach werde ich euch von einigen der Lockerungsoptionen erzählen , die ihr verwenden könnt Und einige der Prototyp-Animationen wie man beim Prototyping Animationen machen kann Danach erzähle ich dir, wie du Bilder importieren und sie in deinem UX-Design verwenden kannst , okay? Sie können diese und viele mehr zuschneiden. Okay, darum geht es im nächsten Kurs. Nur über das Maskieren, darüber, wie man Bilder von allen Seiten zuschneiden kann und wie man das auf verschiedene Arten macht, okay? Ich werde euch auch von verschiedenen Bild-Plug-ins erzählen, alle verwendet werden können Okay. Danach gibt es eine Option namens Komponente und Effekte. Ich werde euch sagen, wie man die Komponente benutzt und wie man verschiedene Arten von Effekten in seine Figma-Datei einfügen kann verschiedene Arten von Effekten in seine Figma-Datei einfügen Okay, zum Schluss werde ich euch sagen, wie ihr eure Bilder exportiert, die ihr in eure Datei importiert habt Also werde ich euch sagen, wie ihr eure Bilder aus der Figma-Anwendung exportieren könnt eure Bilder aus der Figma-Anwendung Okay, nach Abschluss dieses Kurses können Sie Ihre eigene mobile App und Webseite erstellen Und du wirst auch deine eigene Farbe, Balette und Farbverläufe haben Balette und Farbverläufe Sie werden in der Lage sein, sich gute Farbkenntnisse im Webdesign anzueignen und auch in der Lage sein, gute Prototypen zu erstellen , sodass Sie mit dieser Anwendung ein fortgeschrittenes Niveau erreichen mit dieser Anwendung ein fortgeschrittenes Niveau Danach können Sie auch Bilder für Schaltflächen auswählen und die Schriftart der Webseite festlegen Im Grunde genommen werden Sie in der Lage sein, eine Webseite kurz zu gestalten, da dieses Projekt wie eine projektbasierte Klasse ist. Während des Lernens werden Sie Klassenprojekte haben. Was Sie also lernen, können Sie am Unterricht teilnehmen. Du kannst üben, während du lernst. In diesem Kurs stehen Ihnen unterstützende Ressourcen zur Verfügung. Es wird für Sie einfacher sein, während des Lernens zu lernen. Wenn Sie auf ein Problem stoßen oder Fragen haben, können Sie mich gerne fragen. Ich bin immer für dich da, um dir zu helfen. Lass uns anfangen, gemeinsam Figma für IU zu lernen. 2. Was ist Figma: Hallo zusammen und willkommen Tutorial auf Figma Hier werden wir lernen, was Figma ist. Und das erste Kapitel wird Einführung in Figma sein, dem ich euch erzählen werde, worum dieser Anwendung im Grunde geht, wie wir diese Software grundsätzlich verwenden können und vieles mehr Okay, wenn Sie ein Anfänger sind und ersten Mal versuchen, UI UX-Design zu lernen, ist dies der beste Kurs für Sie, in dem Sie das lernen können Danach werde ich euch erzählen, wie diese Figma tatsächlich funktioniert Fima hat also den Designprozess revolutioniert. Bietet eine kollaborative, cloudbasierte Plattform mit leistungsstarken Funktionen, die sich sowohl an Anfänger als auch an Experten richtet ob Sie ein aufstrebender UX-Designer für Benutzeroberflächen, ein Produktmanager oder ein kreativer Enthusiast sind , dieses Tutorial vermittelt Ihnen die Fähigkeiten, sich in der Figma-Welt zurechtzufinden und außergewöhnliche Designs zu Figma-Welt Verschwenden wir keine Zeit und beginnen wir hier mit diesem Kurs und dem ersten Kapitel über Wie Sie sehen können, habe ich Figma in Micro durchsucht . Diese Anwendung Dies ist die erste, und das ist die Datei, in der wir arbeiten werden Diese Datei funktioniert tatsächlich in beiden. Wenn Sie ein Apple-Produkt oder sogar Windows verwenden, können Sie diese Datei auch dort verwenden. Auch auf unserem Smartphone können wir diese spezielle Anwendung für mich verwenden. Zuerst werde ich zu diesem gehen. Okay, sobald ihr hergekommen seid, könnt ihr das Interface hier sehen. Okay, hier haben wir zwei Arten von Dingen, eine mit Figma und eine mit Figma-Marmelade Hier, alles, was Sie hier tun können, können Sie online an einem Board erledigen, Sie bekommen Tipps zur strategischen Planung Sie können auch verschiedene Arten von Diagrammen erstellen. Hier. Sie können auch Entwicklungsarbeiten, Design, Prototyping durchführen. Okay, wenn ich diese spezielle Anwendung herunterladen möchte , kann ich sie von hier herunterladen Aber zuerst wollen wir sehen, was wir hier alles bekommen können. Von hier aus kann ich die Übersichten sehen, ich kann auch Kundenrezensionen und auch verschiedene Arten von Ressourcen zu diesem speziellen UX-Design-Tool für die Benutzeroberfläche einsehen und auch verschiedene Arten von Ressourcen zu diesem speziellen UX-Design-Tool für die Benutzeroberfläche Okay, das ist bei einem XD ähnlich. Ich benutze diese Feedback-Anwendung schon seit geraumer Zeit. Was ich unterscheiden kann, ist, dass dieses Tool sehr benutzerfreundlich ist. Mit dieser Anwendung oder mit diesem Tool können wir normalerweise etwas besser arbeiten, wenn es neue Updates gibt. Sie haben von hier aus ziemlich gute Updates. Okay, hier sehe ich verschiedene Arten von Vorlagen, Plug-ins und die Ressourcenbibliothek für alle Praktiken. Wenn ich bei irgendetwas Hilfe brauche, kann ich zum Gesundheitszentrum gehen und um Hilfe bitten. Wie ich will, kann ich mein Problem schildern. Und hier sind die Community-Ressourcen. Okay, hier habe ich auch viele Community-Gründer, von denen aus ich auf ihre Arbeit verweisen und verschiedene Dinge lernen kann . Wie bei diesem UU-Design müssen wir grundsätzlich verstehen, müssen wir grundsätzlich wie wir unsere gestalten wollen Wenn wir diese Leute weiterempfehlen und uns ihre Arbeit ansehen, bekommen wir im Grunde eine bessere Vorstellung von UU-Design Und hier haben wir verschiedene Benutzergruppen und auch ein paar Schulungsprogramme, wie man sich an diese spezielle Anwendung gewöhnen Ich kann mir auch verschiedene Arten von Veranstaltungen und Livestreams ansehen , die ebenfalls von Figma durchgeführt werden Da ich mich bereits angemeldet habe, gibt es die Option Logout. Wenn ich mich abmelden möchte, kann ich mich von hier aus abmelden. Okay, wenn ich hier runtergehe, haben sie einen kurzen Überblick darüber, wie das ist So viele Leute können in dieser Anwendung oder in einem Ordner zusammen arbeiten . Wir können immer an der neuesten Version arbeiten. Und wir können unsere Arbeit auch in Cloud-Teambibliotheken speichern, was ich euch später und auch ausführlich erklären werde . Okay, hier habe ich das alles. Sie können sehen, welche Marken Partner sind. Okay, hier ist die ganze Seite. Und lass mich Figma von hier herunterladen. Okay, also klicke ich auf Herunterladen. Und sobald ich auf Herunterladen klicke, gibt es bei dieser Figma im Grunde zwei Versionen, okay Es gibt sowohl eine kostenlose als auch eine kostenpflichtige Version. Wenn Sie mit Grafikdesign beginnen oder zum ersten Mal mit der Benutzeroberfläche beginnen , dann schlage ich Ihnen vor, mit der kostenlosen Version zu beginnen und danach langsam kostenpflichtigen Version überzugehen. Weil es eine kostenpflichtige Version ist. Sie haben einige Premium-Funktionen, die sehr nützlich sind, wenn Sie regelmäßig an dieser Anwendung arbeiten. Aber wenn Sie zeitweise oder für ein bestimmtes Projekt ein oder zwei Projekte verwenden zeitweise oder für ein bestimmtes Projekt und danach, werden Sie das nicht zum Üben verwenden. Und alle kostenlosen Versionen sind auch gut, weil sie auch viele verschiedene Funktionen haben. Wie Sie hier sehen können, habe ich die Option für ein Betriebssystem und auch für Windows, wenn ich es auf einen Desktop herunterladen möchte . Wenn ich es auf mein iPhone oder iPad herunterladen möchte, kann ich hier klicken, und hier ist die iPad-Option hier. Ich habe für Android, wenn ich verschiedene Arten von Telefonen verwenden möchte, ist der Telefon-Installer im Grunde so, dass er mir verschiedene Arten von Telefonen gibt, die ich in Figma verwenden kann Wir können dieses also auch für OS herunterladen und für Windows ist es dieses Was ich tun werde, ich habe einen Windows-Laptop , den ich gerade benutze. Ich klicke einfach hier, Dest für Windows. Sobald ich hier klicke, kannst du sehen, dass es hier oben heruntergeladen wird. Es kann einige Zeit dauern, was ungefähr 100 B sind, und ich brauche ungefähr eine Minute, um heruntergeladen zu werden. Hier erfährst du also, ob ich all diese Ressourcen sehen möchte, ob ich sie mit anderen Apps vergleichen möchte. Okay, das sind also einige Konkurrenz-Apps, nämlich Sketch, wie ich Ihnen bereits gesagt habe, Obex D und Framer Design unter Windows Miro Invasion Studio. sind also einige der Apps , die dasselbe tun, bei denen es sich nur um UI- und UX-Designer-Apps handelt Ich kann sie also von hier aus verwenden oder sie vergleichen und sehen was der Unterschied zwischen diesen Apps und dieser Figur ist , wenn Sie sie vergleichen möchten Okay, wenn ich herausfinden möchte, was ich tun kann, kann ich es von hier aus sehen Und wenn ich die kostenpflichtige Version verwenden möchte, lassen Sie uns sehen, was der Preis ist. Okay hier. Wenn ich herkomme, könnt ihr sehen, ob ich die kostenlose Version verwende Ich werde drei Figma - und drei Fija-Dateien bekommen, denen ich bei der Arbeit mit anderen zusammenarbeiten kann Und ich werde unbegrenzt viele persönliche Dateien haben, unbegrenzt viele Mitwirkende, Plug-ins, Vorlagen und ich kann auch die mobile App herunterladen Es beginnt bei 12$ pro Monat, wenn ich die professionelle Version verwende Okay, hier erhalten Sie unbegrenzt viele Figma-Dateien, unbegrenzten Versionsverlauf, Teambibliothek, erweitertes Prototyping und den Ve-Modus, der sich in der Beta-Phase befindet Ich kann es hier in dieser Version herunterladen , wenn ich mich für die professionelle Version Ich kann auch einen Rabatt bekommen, wenn ich nachweisen kann , ob ich Student oder Pädagoge bin. Wenn Sie Student sind, können Sie danach einfach Ihren Personalausweis oder ein anderes Dokument von Ihrer Hochschule, Universität oder Schule hochladen Ihren Personalausweis oder ein anderes Dokument von Ihrer Hochschule, danach einfach Ihren Personalausweis oder ein anderes Dokument von Ihrer Hochschule, Universität oder Schule Wenn ich herkomme, zahlen wir 45$ pro Monat dafür von der Figma-Organisation Okay? Also hier bekommst du diese Bibliotheken, zentrale Dateiverwaltung, Single Sign-On und all das, okay? Und das ist die Premium-Version, die 75$ pro Redakteur Pro Monat erhalten Sie einen eigenen Wortbeitrag, fortschrittliche Designsysteme, Gastzugang, Netzwerkzugriffsbeschränkungen und ablaufende öffentliche Links Sie werden das alles hier bekommen, es geht darum, Figma ist der Anfang Du wirst dasselbe bekommen können. Musikplayer, wenn ich den kostenlosen für Figma Professional verwende , kostet Fija Organization 5 $, und das Unternehmen kostet 5$ pro Redakteur und Monat, je nach Ihr könnt sehen, welches gut für euch ist, was für euch von Vorteil ist Ich habe diese heruntergeladen, jetzt gehe ich zu meiner Datei, ich werde versuchen, diese spezielle App auf meinem PC zu installieren. Nachdem ich diese bestimmte Anwendung installiert habe, wurde ich direkt zu dieser App weitergeleitet. Okay, also hier gehe ich nach Hause, und wie Sie hier sehen können, habe ich all diese Arbeit, okay? Ich werde euch all das zeigen, was ich hier gemacht habe. Ihr könnt sehen, dass ich das alles gemacht habe. Ich werde euch von hier aus zeigen, wie es geht. Wie Sie sehen können, ist dies die Benachrichtigungsglocke. Ich kann hier klicken und nachsehen, ob ich hier eine Benachrichtigung habe. Dies ist die aktuelle Datei. An der du gearbeitet hast. Es wird hier gespeichert. Das Team ist in dieser Figma ziemlich wichtig. Okay? Nehmen wir also an, ich mache eine bestimmte Lektion oder ein bestimmtes Projekt, okay? Da kann ich verschiedene Personen nehmen oder ich kann so viele von ihnen einbeziehen, und wir können an einer einzigen Datei arbeiten, so viele von uns zusammen, okay? Das ist also eines der besten Dinge, was sehr hilfreich ist , wenn ich so etwas habe dauert es etwa 20 bis 30 Stunden und ich möchte die Arbeit in drei Tagen, vier Tagen beenden . Vielleicht kann ich zwei oder drei Leute mitnehmen und zusammen können wir dort arbeiten, unsere Ideen teilen, uns an diese spezielle App gewöhnen und unsere Arbeit beenden. Hier kannst du also sehen, ob ich ein Team habe oder nicht. Und hier ist der Entwurf, in dem all meine Arbeit gespeichert wird. Okay. Und hier ist die aktuelle App. Hier bekommst du, du bist für die FEMA-Ausbildung verifiziert Und hier siehst du, dass ein Team bereit ist, kostenlos zu upgraden. Okay. Also, ich habe mich für eine Ausbildung bei der Fema beworben Ich kann das jetzt hier tun, da ich diese Teams bereits erstellt habe Wie Sie sehen können, habe ich hier verschiedene Teams. Sobald ich das hier aufgelistet habe, können Sie sehen, dass ich bereits einige Teamprojekte durchgeführt habe. Lassen Sie mich das also von hier löschen. Lass mich löschen, ich werde BC schreiben. So können Sie ein Team löschen. Okay? Und genauso werde ich auch diesen löschen. Ich habe diesen Robert genannt. Ich werde das Team hier wieder löschen. Dieses werde ich auch löschen, nur um euch zu zeigen , wie wir tatsächlich ein Team bilden können. Dies ist der Prozess, wie wir ein Team tatsächlich löschen können. Lass mich löschen. Ja, dieses Team wird ebenfalls gelöscht. Jetzt kann ich von hier aus tatsächlich ein kostenloses Team erstellen. Von hier aus. Sobald ich zuerst ein Team erstellen möchte, muss ich hierher kommen, auf Team erstellen klicken und es einfach benennen. Ich nehme an, ich nenne es Mark. Okay, und ich klicke auf Team erstellen. Hier können Sie eine weitere Seite sehen, die hier erschienen ist. Hier können Sie Ihre Mitarbeiter hinzufügen und deren E-Mail-Adresse ich hier in diese Felder eingeben kann Wie ich Ihnen gesagt habe, kann ich in dieser Version nur drei von ihnen zu meinem Team hinzufügen Wenn ich die andere Version verwende, die kostenpflichtige Version, kann ich weitere hinzufügen Dafür werde ich hier keine E-Mail hinterlegen. Ich werde diesen Teil vorerst behalten. Hier könnt ihr sehen, dass ich diese Option fertig eingerichtet habe und ich klicke einfach darauf. Ich stimme dem Figs Term Oil Service und klicke auf die vollständige Upgrade-Option. Hier könnt ihr sehen, dass das Team erstellt wird. Dieses ist das Team-Projekt, das ich hier habe. Ich kann es tatsächlich so in einem Mindestformat oder auch in einem Rasterformat anzeigen . Ich werde diesen stornieren. Jetzt können Sie hier auf meiner Homepage sehen , dass ich ein bestimmtes Team habe. Hier ist eine weitere Option. Wenn ich ein neues Projekt erstellen möchte, kann ich ein neues Projekt hinzufügen oder es auch konsolidieren. Okay, ich kann es einfach so trösten. Okay, also wenn ich hierher komme und jetzt zeige ich euch der Arbeitsbereich aussehen wird , wenn ich hier auf diesen klicke. Ihr könnt sehen, dass das der Hauptraum ist, in dem ihr in Figma arbeiten werdet , von hier an über euch Wenn ich von hier aus auf diese Datei doppelklicke, können Sie diese spezielle Projektdatei tatsächlich ändern oder umbenennen Okay, lassen Sie mich dieses Projekt einfach als Projekt eins benennen. Und ich werde hier auf meiner Tastatur auf Enter klicken. Sie können sehen, dass dieses Projekt gespeichert oder als Project One umbenannt wurde. Hier könnt ihr sehen, dass ich das Hauptmenü habe. Von hier aus habe ich die Dateioption und so viele Dinge , die ich euch in späteren Phasen des Kurses erklären werde . Das ist das Auswahlwerkzeug, das ist der Rahmen, ist das Formwerkzeug, das ist das Gestaltungswerkzeug das Sünde und das Bleistiftwerkzeug beinhaltet. Hier habe ich das Textwerkzeug und hier die Ressourcen, das Handwerkzeug. Wenn ich einen Kommentar hinzufügen möchte, kann ich über dieses Feld einen Kommentar hinzufügen. All das werde ich euch in den späteren Phasen des Kurses erzählen . Alles hier, jedes Werkzeug und seine Einsatzmöglichkeiten. Ich werde euch sagen, dass dies das Bedienfeld ist , von dem aus ich das Design auswählen und auch meine Medien exportieren kann . Nach der Arbeit habe ich einige der Prototypen, von denen ich euch zeigen werde , wie es gemacht wird. macht Danach werde ich euch auch sagen, wie man Prototypen Sie können auch sehen, dass ich lokale Stile habe , da ich bereits erklärt habe, wie wir exportieren können Wir haben verschiedene Formate, PG, JPG, SVG und PDF. Das kann ich mir auch vorstellen. Hier habe ich die Vorschau-Option. Das ist die Hauptsache, was wir uns ansehen werden, nämlich die Ebene. Okay, also während der Arbeit in Figma sollten wir Layer verwenden und das Legen ist die Hauptsache Also werde ich euch vom Legen erzählen, wie wir von hier aus verschiedene Seiten hinzufügen können Nimm zwei oder drei Seiten und finde heraus, wie man einen Rahmen erstellt. Also all das werden wir im nächsten Tutorial lernen. Also bis ich hoffe, ihr habt verstanden, wie wir die Figma-Anwendung tatsächlich herunterladen und installieren können die Figma-Anwendung tatsächlich herunterladen und installieren Und wenn Sie nicht auch herunterladen möchten, können Sie auch vom Browser aus arbeiten Da ich Ihnen gezeigt habe, wie wir hinzufügen können, ist dies die Option Assets. Also werde ich euch auch zeigen, wie man das benutzt. Ich hoffe, wir sehen uns alle im nächsten Tutorial auf Figma. Pass auf dich auf. Und auf Wiedersehen alle. 3. Arbeitsbereich und Schnittstelle: Hallo zusammen und willkommen mich alle zu einem weiteren Tutorial auf Figma In der letzten Klasse haben wir gelernt, was Figma ist. Und ich habe euch auch den Arbeitsbereich gezeigt , von dem aus ihr arbeiten könnt In der letzten Klasse habe ich euch kurz erklärt, wie es ist, aber in diesem Kurs werde ich euch den Arbeitsbereich an der Schnittstelle im Detail zeigen der Schnittstelle im Detail , damit ihr verstehen könnt, wenn ihr die Arbeit erledigt habt, wie er tatsächlich aussehen wird oder wie er tatsächlich funktioniert. Sobald ihr den Arbeitsbereich an der Benutzeroberfläche verstanden habt, wird es für euch leicht sein, in dieser speziellen Anwendung zu arbeiten. Lasst uns hier keine Zeit verschwenden und lasst uns hier mit dieser speziellen Klasse beginnen. Wie ihr auf der Homepage meiner Figma-Anwendung sehen könnt , habe ich euch das alles erklärt Ich werde ein fertiges Figma-Projekt durchführen, um euch zu zeigen, wie es tatsächlich aussieht und was alles dort getan werden kann Dafür gehe ich einfach in die Community, die Figma-Community, die Figma-Community, ich euch gesagt habe, was ihr alles tun könnt Lasst mich euch zeigen, wie es hier in der Figma-Community tatsächlich aussieht Sie werden hier so viele Dinge haben wie Aspiration Team Sings Design Systems Wenn Sie sich die Entwicklung einer Webseite oder einer mobilen Seite ansehen möchten , können Sie sie von hier aus sehen Sie haben uns auch das Framing gezeigt. Von hier aus können Sie verschiedene Icons herunterladen , die hier kostenlos sind Okay, um es in deiner Arbeit zu verwenden. Es gibt so viele Dinge, die man von dieser Figma-Community lernen von dieser Figma-Community kann. Alle fortgeschrittenen Lernenden oder Fortgeschrittenen, die mit der Figma arbeiten, laden manchmal ihre Arbeit hier hoch, um zu zeigen, wie nützlich diese Anwendung ist Lassen Sie mich runtergehen und nachsehen, da ich hier verschiedene Dateien habe Ich gehe einfach zu dieser und lassen Sie uns sehen, was ich alles mache, sie hier haben Von hier aus, was ich tun werde, werde ich hierher kommen und versuchen zu sehen, welche Komponenten ich alle habe. Okay, lass mich einfach einfache App nehmen, um es euch hier zu zeigen. Okay. Ich werde das in meiner Bewerbung öffnen. Wie Sie sehen können, ist das hier geladen. Dies ist im Grunde eine mobile App zur Terminbuchung von Dr.. Okay. Mal sehen, welche Optionen ich hier habe. Okay, ich öffne diesen einfach in Figma. Ich werde hier eines meiner Konten verwenden. Wenn ich die Datei bearbeiten möchte, kann ich sie bearbeiten, aber ich würde sie nicht nur bearbeiten, um euch die Oberfläche zu zeigen, wie sie tatsächlich aussieht, wenn diese Datei tatsächlich ziemlich groß ist. Okay, mit meinem Handwerkzeug werde ich das bewegen. Lassen Sie mich von Anfang an hier beginnen und ich zoome hier einfach rein. Okay, ich hoffe ihr könnt jetzt sehen, wie er das Schritt für Schritt geschafft hat. Wie Sie hier sehen können, ist dies der erste Bildschirm Sobald Sie hier klicken, werden Sie zu dieser Seite weitergeleitet. Diese Option könnte hier etwas anderes haben. Sie haben die Schritte, wenn Sie auf Los geht's und vieles mehr klicken. Okay, ich habe euch die Grundlagen von all dem erzählt, wenn ihr mit der Arbeit fertig seid oder wenn ihr die Arbeit gemacht habt, wird es tatsächlich so aussehen. Wie ihr hier schon sehen könnt. So wird es aussehen, okay, von hier aus. Wenn ich etwas mitnehmen möchte, nehmen wir an, ich möchte diese bestimmte Seite hierher bringen und ich möchte umziehen. Sie können hier sehen, diese Seite automatisch ausgewählt wird , weil sie sich unter diesem speziellen Frame als befindet. Und wenn ich ein anderes Bild ausgewählt habe, kann ich beim Verkleinern sehen, welches ich ausgewählt habe. So funktioniert es tatsächlich. Es wäre besser, wenn ich euch ein Projekt zeige, in dem ich all diese Dinge in einem auf meinem Bildschirm unterbringen kann. Weil dieses Projekt ziemlich umfangreich ist, wie Sie sehen können. Aber es ist ein ziemlich gutes Projekt , das hier durchgeführt wird, und ein Gesamtprojekt. Was ich tun werde, ist entweder ich kann es einfach von hier wegbewegen, okay? Um es euch zu zeigen. Sonst kann ich das einfach hier unten lassen. Wie du siehst, kannst du die Positionierung ändern und es werden dir auch die Ausrichtungen angezeigt, okay? So kannst du dich bewegen. Es hängt alles von dir ab, okay? Zum Beispiel, wie es für dich geeignet ist. Sie können es tatsächlich nebeneinander oder vertikal oder auch horizontal ausrichten . Es hängt völlig von Großbritannien ab. Das sind die Schichten. Wie ihr sehen könnt, werden diese Frames genannt, die ich mit dieser Schaltfläche hier und den Tastenkombinationen erstellen kann . Ich werde euch von all dem erzählen, wie wir einen Rahmen erstellen können und wie wir eure Arbeit darauf anwenden können, wie wir sie tatsächlich einrichten können. Ich werde es euch jetzt erzählen. Lassen Sie mich zu einer anderen Datei aus der Figma-Community gehen , wo ich Ihnen zeigen kann, wie , sobald Sie ein Projekt in einer Ebene erstellt haben das hier im Grunde aussieht Ich habe eine Designdatei gefunden, die ich auswählen werde, um euch kurz zu zeigen , was hier alles gemacht werden kann Ich werde diese einfach in Pigma öffnen, wie die letzte, ich werde es einfach mit meiner E-Mail hier fortsetzen Ihr könnt sehen, dass das die Seite ist, so könnt ihr anfangen, eure Webseite zu erstellen , im Grunde von hier aus. Wie ihr bereits wisst, könnt ihr mit der Erstellung eurer Seite beginnen. Wie Sie sehen können, wird standardmäßig Seite Nummer fünf direkt nach der ersten Seite angezeigt. Was ich tun werde, ich werde keine Seiten erstellen, aber um euch zu zeigen, wie wir tatsächlich eine Seite erstellen können, klicke ich hier. Diese Seite. Wie Sie sehen können, habe ich Ihnen bereits gesagt , dass dies nur verschiedene Ebenen sind. Jetzt bin ich auf meiner zweiten Seite. Dies ist die dritte Seite, und diese ist meine vierte Seite hier. Derjenige, der diesen erstellt hat, hat diesem speziellen Frame einen Namen gegeben, damit er nicht verwirrt wird, oder bestimmte Seiten entsprechend. Dies sind verschiedene Ebenen unter jeder Ebene. Sie haben hier unterschiedliche Optionen. Angenommen, ich möchte dieses spezielle Ding darin auswählen. Lassen Sie mich einfach mit meiner Steuerung und meiner Maus heranzoomen. Ich ziehe einfach mit meinem Handwerkzeug rein. Ich komme einfach her. Okay, um euch eine bessere Sicht auf den Bildschirm zu geben, nehmen wir an, ich habe diesen speziellen Rahmen ausgewählt. Jetzt möchte ich diesen Rahmen hier nach rechts bewegen. Sie können sehen, dass ich hier die Option habe, Das X, Y mit Umarmung Okay? Der Drehwinkel, die Kurven, alles, was ich von hier aus ändern kann, und auch die Einschränkungen beim automatischen Layout. Ich habe die Option Ebenenraster, mit der ich verschiedene Rasterstile auswählen kann, und ich kann sie auch in verschiedene Rasterstile auswählen kann, und ich kann den Browse-Bibliotheken durchsuchen. Sobald ich mit meinem WLAN oder meiner Internetverbindung verbunden bin , kann ich auch auf diese zugreifen, die dort kostenlos verfügbar sind. Ansonsten kann ich von hier aus auch meinen eigenen Rasterstil erstellen. Wie Sie sehen können, klicke ich einfach auf diesen, wenn ich löschen möchte . Ich habe auch die Ebene, was für eine Ebene will ich hier haben ? Ich habe eine andere Ebene. Wie Sie sehen können, gibt mir das nur eine Vorschau. Alles, was ich habe, nehme an, ich habe hier zwei oder drei Schichten. Sobald ich eine Schicht über die andere gelegt habe, so wie es aussehen soll, werde ich euch das alles zeigen. Nun, ich kann auch die Füllung wählen, also die Farbe. Okay? Angenommen, ich habe eine rote Farbe ausgewählt, dann erhalte ich ab jetzt diese Art von Farben. Okay, ich nehme das nur als weiß an. Ich will das nicht von hier aus ruinieren. Ich kann die Opazität ändern. Wenn ich 50 nehme und auf klicke, okay, ich kann die Deckkraft ändern Und ich kann sie auch verringern, wenn ich sie weiter verringern möchte. Wenn ich das sehen und den Unterschied hier sehen will, könnt ihr den Unterschied genau hier sehen. Nehmen wir an, ich gebe hier einen Text ein oder ein bestimmtes Feld oder eine bestimmte Farbe darauf. Wenn ich den Strich dieses bestimmten Textes ändern möchte, kann ich nur die Strichfarbe von hier aus ändern. Ich kann den Strich auch vergrößern, wenn ich zum Beispiel den Strich von innen, von außen oder von der Mitte aus erhöhen möchte , ich kann das auch von hier aus tun. Ich habe auch die Möglichkeit, Effekte zu verwenden. Von hier aus habe ich unterschiedliche Effekte. Schlagschatten, innerer Schatten, Ebenenunschärfe, Hintergrundunschärfe Hier sieht man eine Seite in der Ebene Unschärfe, sie erscheint wie der innere Schatten und das ist der Nach der Arbeit kann ich auch exportieren, wie ich euch bereits in der letzten Klasse gesagt habe, hier ist die Option der Ausrichtungen. Das kann ich machen zeige euch das X und Y. Nehmen wir an, ich erhöhe es, es geht einfach weiter nach rechts die gleiche Weise, wenn ich es auf den Kopf stellen will, kann ich es auch von hier aus tun Wie Sie sehen können, kann ich von hier aus auch die Ecken ändern Wenn ich das drehen möchte, kann ich es auch entsprechend drehen, wie ich will. Ich kann das alles machen. Ich setze es einfach auf Null. Ja. Sobald wir diese Arbeit gemacht haben, werden die vielen weiteren Textfelder dafür sorgen, dass das Baby mehr Text einfügt oder die Rahmen. Wir werden das hier tun können, ihr werdet auch von hier aus eine Vorschau bekommen können . Wie Sie sehen können, habe ich nach jeder Option auch die Tastenkombination dafür. Ich erhalte die Vorschau, wenn ich auf die Schaltfläche Seite nach oben und auch auf das Leerzeichen klicke . Gleichzeitig erhalte ich die Vorschau. Nur für meine Tastatur muss ich den Bogen nicht verwenden, aber ich finde, dass die Verwendung von Bow recht bequem ist. Ich benutze das. Ich kann auch meine spezielle Arbeit teilen. Ich kann sie tatsächlich mit jeder E-Mail einladen , an wen auch immer ich senden möchte Ich kann das auch auswählen. Können sie meine spezielle Arbeit bearbeiten oder können sie sie nur ansehen? Okay, wenn ich danach den Link kopiere und ihn in beliebigen Medien teilen kann, indem ich die E-Mail oder auch eine andere Social-Media-Plattform wie den Whatsapp Messenger verwende andere Social-Media-Plattform , kann ich ihnen den Link einfach geben, indem ich sie kopiere und hier auf ihrer Seite einfüge Das ist die Schichtung. Wie Sie sehen können , habe ich nach dem Erstellen eines Rahmens all diese Optionen, sodass ich tatsächlich verschiedene Komponenten darunter platzieren kann Da ich Bilder mit Rahmen habe, habe ich auch diesen Rahmen. Ihr seht, ich hoffe, ihr habt die Grundlagen verstanden, wofür eine Ebene verwendet wird. Außerdem werden wir uns hier die Assets-Option ansehen. Wenn ich komme, kann ich tatsächlich verschiedene Arten von Assets durchsuchen, oder ich kann einfach die Teambibliothek öffnen oder mir die lokalen Komponenten ansehen. Was alles hier in dieser speziellen Datei oder in diesem Projekt verwendet wird . Ich kann sie mir einfach von hier aus ansehen. Wie Sie sehen können, ist dieses spezielle Projekt sehr ordentlich und gut gemacht Ich kann mir das vorstellen. Wenn ich von hier aus etwas ändern möchte, kann ich es nach Belieben modifizieren, okay? Während ich hier auswähle, könnt ihr auch auf meinem Bildschirm sehen , dass ein bestimmtes Symbol ausgewählt wird. Okay, wenn ich darauf klicke, könnt ihr sehen, dass alles ausgewählt wird. Auf diese Weise können wir tatsächlich versuchen, alle Symbole, die ich in diesem Projekt verwendet habe, zu entwerfen oder einfach nur eine Ebene beizubehalten und den Überblick zu behalten. Und hier habe ich wieder die Komponenten. Okay, das ist die dritte Seite. Das ist die letzte Seite hier. Okay? Hier, wenn ich etwas ändern möchte, kann ich dieses auswählen. Ich kann es auswählen, es hat mich gerade auf diese Seite umgeleitet. Das will ich nicht. Ich lösche das. Ich werde diesen hier einfach schließen. Wenn ich etwas auswählen möchte, kann ich Beispiel über meine Schaltfläche auswählen. Wenn ich das löschen möchte, kann ich das löschen und es wieder rückgängig machen. habe ich hier auch diese Optionen, wie ihr sehen könnt. Wenn ich ein Objekt bearbeiten möchte, wenn ich eine Komponente erstellen möchte und wenn ich diese bestimmte Ebene hier als Maske verwenden möchte. Wenn ich einen Link erstellen möchte, kann ich auf diese Option klicken und versuchen, einen Link wie diesen zu erstellen. Okay, wie ich Ihnen bereits gesagt habe, bei jedem Text kann ich bei jedem Text die Textgröße von hier aus ändern. Also werde ich diesen einfach schließen. Ich kann den tatsächlich ausgegebenen Text auswählen oder den Text nach meinen Bedürfnissen ändern oder bearbeiten. Auch Füllfarbe und Füllstrichexport. Dies ist die Prototyping-Option. Von dieser Prototyping-Option kann ich zu dieser gehen und ich werde euch kurz zeigen, wie ihr Prototypen erstellen könnt Ich hoffe, ihr habt diese Klasse von Workspace und die Benutzeroberfläche verstanden diese Klasse von Workspace und die Benutzeroberfläche Jetzt glaube ich, dass ihr mit dieser Anwendung vertraut seid. der nächsten Klasse werden wir all diese grundlegenden Tools kennenlernen , die ich in meiner Werkzeugleiste habe. Wir werden mehr darüber erfahren, all das nutzen können, was wir mit diesen speziellen Tools machen können . Letzteres wird, glaube ich, interessant. Und ihr werdet auch etwas über das UI UX-Design und insbesondere über diese Anwendung lernen UI UX-Design und insbesondere über , von sehr einfachen Kenntnissen bis hin zu fortgeschrittenen Kenntnissen Nach Abschluss dieses Tutorials werdet ihr also eine gute Vorstellung von UI UX-Design haben. Und wir können auch Ihr eigenes Webdesign und Ihr eigenes Design für mobile Apps erstellen . Ich hoffe, wir sehen uns alle im nächsten Tutorial. Kümmere dich um alle und auf Wiedersehen. 4. Grundlegende Tools in Figma: Hallo zusammen und willkommen zu einem weiteren Tutorial in Figma In diesem Kapitel befinden wir uns in unserem dritten Kapitel und lernen die grundlegenden Tools in Figma Wir werden etwas über das Move-la-Scale-Tool lernen. Auch über das Formwerkzeug, mit dem Sie verschiedene Tippfehler erstellen können einschließlich eines Rechtecks Wie wir mit all diesen Formen herumspielen und entsprechend am Text ändern Wie wir einen Text ändern, einen Text erstellen und ihn in Ihren Rahmen einfügen können. Ich habe euch auch gezeigt, wie ihr eure Frames überlagern oder umbenennen könnt und dort eure Arbeit über das Schneiden und Hinzufügen von Befehlen und auch die Ressourcen, Plug-ins und Widgets veröffentlicht Verschwenden wir also keine Zeit und beginnen wir mit dieser speziellen Klasse auf Figma Wie ihr hier sehen könnt, habe ich einen leeren Arbeitsbereich mit diesem leeren Arbeitsbereich Was ich jetzt tun werde, ist euch all diese Tools zu erklären. Zuerst nehme ich dieses Frame-Tool mit meinem zweiten Frame, ich erstelle einfach einen Frame. Okay, nehmen wir an, ich möchte keinen Rahmen meiner Größe erstellen. Ich habe eine bestimmte Größe für meine Bearbeitung. Hier kannst du sehen, dass ich verschiedene Presets habe. Okay. Hier habe ich ein Preset für meinen Desktop, nämlich Bankbook Air Hier kann man auch die Größe sehen. Es gibt eine andere Website, auf der Sie verschiedene Größen finden können , die für Sie oder Ihr Gerät geeignet sind. Dort können Sie einfach Ihren Gerätenamen eingeben und es wird Ihnen die Größe des jeweiligen Bildschirms angezeigt. Unter der Telefonoption habe ich ein großes und ein kleines Android. All diese iPhone-Optionen, wenn ich ein Tablet habe, habe ich all das. Das iPad D 8.3 das Surface Pro Eight. Wenn ich eine Anwendung für Watch erstelle, habe ich auch diese Bildschirmgröße. Da ich diesen bereits ausgewählt habe, werde ich hier einen Rahmen erstellen. Nachdem Sie den Rahmen hier erstellt haben, können Sie im Bedienfeld sehen, dass ich alle Optionen habe, um diesen zu ändern. Okay. Vielleicht nehme ich diese Farbe, da du eine siehst. Ich wähle diesen aus. Ich habe die Möglichkeit, all das zu tun. Nein, wenn ich es abdunkeln will, will ich das Normale schaffen Ich kann die Schichtung von hier aus vornehmen und ich kann sie auch von hier aus ändern Wenn ich hier klicke, kannst du sehen, wie es um 50% heller wird. Wenn ich das nicht sehen möchte, kann ich von hier aus einfach hier auf diese Augentaste klicken Und ich habe auch diesen Augenknopf hier. Gleich daneben habe ich den Log-Button. Jetzt kann ich das auch nicht mehr mit meinem Auswahlwerkzeug verschieben. Oder nehmen Sie Änderungen vor , wenn sich alles in diesem speziellen Feld befindet. Aber sobald ich das entsperrt habe, kann ich diesen bestimmten Rahmen tatsächlich verschieben und entsprechend positionieren. Und von hier aus werde ich euch auch zeigen, ob ich das auf der X-Achse oder auf der Y-Achse bewegen möchte , das kann ich tun. Ich kann das auch auswählen, wenn ich es im Hochformat oder im Querformat aufnehmen möchte. So erstellen Sie einen Rahmen. Ich habe auch diese Option für Striche. Wenn ich den Strich hier ändern möchte, können Sie sehen, dass ich in der Lage bin, den Strich zu ändern, die Farbe des Strichs zu ändern. Wenn ich diesen nicht sehen möchte, kann ich ihn einfach erneut anklicken. Dieser. Wenn ich den Schlaganfall nicht sehen will. Das nochmal. Dieser. Wenn ich von hier aus sehen will, kann ich die Deckkraft um 50 ändern So wird es aussehen. Wenn ich möchte, dass mein Schlag drinnen oder draußen ist, kann ich darauf klicken. Wenn ich es in der Mitte haben möchte, kann ich hier klicken. Bei dieser Option habe ich auch die Möglichkeit, Effekte zu verwenden. Wenn ich einen Unschärfeeffekt, einen Schlagschatten oder einen inneren Schatten erzeugen möchte, habe ich all das hier. Okay? Das ist das Skalierungswerkzeug und die Tastenkombination dafür ist K. Wenn ich von hier aus auf dieses Bild klicke, kann ich diesen bestimmten Frame von hier aus einfach vergrößern oder verkleinern. Das ist ziemlich einfach und ich sage euch, nehmt an, ich möchte einen weiteren Frame machen, okay? Ich werde von hier aus einen weiteren Rahmen machen. Wie du siehst, kann ich den Rahmen so gestalten , wie ich will, okay? Aber wenn ich diese Rahmenoption von hier aus auswähle und auf Strg+Shift klicke und dann versuche, einen Rahmen zu erstellen, wird mein Rahmen proportional sein, okay? Also kann ich von hier aus einen Rahmen proportional erstellen , wenn ich versuche, nicht proportional zu erstellen , dann könnt ihr sehen, dass es in die andere Richtung geht Aber es gibt mir hier eine proportionale Rahmung. So können Sie einen proportionalen Rahmen erstellen. Von meiner Klicksteuerung aus plus Shift und Halten oder Ziehen mit der Maus Ich lösche diesen. Dieser auch. Nimm diesen Rahmen hier. Ich kann den Rahmen von hier aus umbenennen indem ich hier doppelklicke. Andernfalls kann ich über diesem speziellen Rahmen auch hier klicken. Ich hoffe ihr habt verstanden, wie das funktioniert und ich werde euch hier weitere Optionen zeigen. Die Rahmung habt ihr schon verstanden. Das glaube ich schon, okay? Ich habe die Tastenkombination dafür, dass das Verschiebewerkzeug und das Skalierungswerkzeug auch von euch verstanden wurden. Und jetzt gehen wir zum Abschnitt über, okay, hier kann ich damit einen bestimmten Abschnitt erstellen. Nehmen wir an, ich erstelle diesen Abschnitt hier und ich kann diesen bestimmten Abschnitt einfach hierher innerhalb meines Rahmens verschieben , okay? Also habe ich diesen Abschnitt jetzt in meinem Rahmen. Okay? Wenn ich diesen auswähle, oder wenn ich das auswähle, nehme ich an, ich bleibe hier eine Farbe. Angenommen, ich habe diese Farbe gewählt, sie sieht nicht gut aus. Ja, nicht schlecht. Ja, wenn ich jetzt hierher komme, klicken Sie erneut auf diese Option, um den Clip-Inhalt zu schließen. So wird es mir tatsächlich eine Vorschau geben. Aber wenn ich noch einmal auf den Inhalt des Clips zurückkomme, gibt es eine Änderung , die ihr nur in diesem Abschnitt mit dem Clip-Inhalt sehen könnt . Und das ist ohne, so wird es tatsächlich aussehen, wie ihr hier jetzt schon sehen könnt. Okay, das ist genau über diesem. Gehen wir nun zum Slice-Tool über. Und die Tastenkombination dafür ist, dass im Grunde nur Frame oder ein bestimmter Bereich, Sie importieren oder exportieren möchten, aufgeteilt wird. Okay, wenn ich diesen bestimmten Abschnitt hier auswähle, habe ich auch das Segment ausgewählt. Wie Sie sehen können, ist dies der Ort, der gerade belegt ist, nachdem Sie diesen ausgewählt haben. Wenn ich zu dieser Exportoption komme, wie Sie hier sehen können, steht geschrieben, wenn ich dieses erste Segment hier exportieren möchte, okay, wenn ich das erste Segment hier exportiere, werde ich Ihnen zeigen, überprüfen, was auf meinem Bildschirm gespeichert wird, nur ein Ausschnitt von dem, wo ich die Folie habe. Es wird diesen Teil einfach die gleiche Weise auswählen, wenn ich das zweite Segment Es gibt mir eine Vorschau davon, da nichts da ist. Ich schneide auch einfach einen. Okay, verstanden. Dieser Teil auch hier. Ich habe alle Formen hier. Wenn ich eine Linie, ein Rechteck, erstellen möchte, okay, ich erstelle ein Rechteck, denke einfach, dass ich dieses von hier aus erstelle. Ich kann verschiedene Symbole erstellen. Wenn ich das auswähle, fülle es hier mit einer anderen Farbe. Okay, hier kannst du sehen, dass ich das mit Alt habe. Ich kann das auch einfach duplizieren. Wie Sie sehen können, habe ich hier ein Symbol in derselben Größe dupliziert hier ein Symbol in derselben Größe Danach kann ich auch Buttons mit diesen Formen machen. In dieser Zeile hier kann ich eine Linie so erstellen, wie ich es möchte. Das Gute an Figma ist, dass es Ihnen Ausrichtungen zeigt Wie Sie sehen können, gibt es hier eine orange, rötliche Linie, die mir die Ausrichtung hier zeigt Von der Linie aus kann ich tatsächlich setzen, wenn ich irgendeinen Pfeil setzen möchte, kann ich das oder die ganze Vorschau machen, ich hole es mir hier. Und auch dieser. Dieser. Und ich kann von hier aus auch die Breite oder die Strichstärke ändern . Okay, ich kann das alles auch machen. Ich habe hier auch das Ding mit den Pfeilen. Ich kann von hier aus einfach klicken oder einen Pfeil erstellen. Wenn ich das hier auswähle, siehst du, dass ich auch die Deckkraft ändern kann Ich kann es auch so machen, umgekehrtes Dreieck im Kreis, Pfeil, Diamantpfeil, rund, quadratisch Ich habe diese Optionen hier. Wenn ich einen Kreis bilden möchte, kann ich mit dieser bestimmten Schaltung auf die gleiche Weise einen Kreis bilden . Ich kann herumspielen, wie ihr sehen könnt. Aber wenn ich auf Control-Shift klicke während ich diesen ausgewählt habe, also nicht Control-Shift, wird er in einem bestimmten Verhältnis erzeugt. Okay? Sie werden für mich proportional einen Kreis bilden. Danach gehen wir zu Polygon. Auf die gleiche Weise kann ich ein Polygon wie dieses erstellen. Wenn ich es in einen beliebigen Frame verschieben möchte, kann ich diesen auch verschieben. Okay? Hier kannst du sehen, wenn ich das gemacht habe, sind diese Dinge Rahmen, okay? All diese Dinge befinden sich unter Rahmen eins. Da dieser drin ist, kann ich die Einstellung von hier aus ändern. Wenn ich eine Einstellung für diesen speziellen Rahmen ändern möchte , kann ich das von hier aus tun Angenommen, ich möchte die Rotation von hier aus ändern und alles wird darin enthalten sein Da sich das hier unter Frame 1 befindet, habe ich das verstanden. Lass uns zum Star gehen. Von hier aus kann ich einen Stern erschaffen, wenn ich will. Hier kannst du sehen, dass ich diese Optionen habe, mit denen ich das erweitern oder mit all dem herumspielen kann Wenn ich die Anzahl hier erhöhen möchte , können Sie sehen dass ich die Anzahl auch erhöhen kann Hier kann ich auch mit diesem spielen. Und wenn ich ein Bild oder Video platzieren möchte, kann ich einfach auf diese spezielle Option klicken. Oder ich kann danach von meiner Tastatur aus auf Control Shift klicken . Schauen wir uns hier die Creation Tools an. Unter Creation Tools habe ich das Stiftwerkzeug und das Bleistiftwerkzeug. Wenn ich das Stiftwerkzeug nehme, werdet ihr sehen können, ich von hier aus verschiedene Formen erstellen kann. Wie ihr entsprechend sehen könnt. So wie ich es hier will , habe ich es geschaffen, ich kann es auch biegen. Wenn ich will, wie du hier sehen kannst, kann ich von hier aus verschiedene Dinge machen. Okay, wenn ich damit fertig bin, klicke ich auf. Oder wenn ich etwas biegen möchte, ist dies das Biegewerkzeug. Ich kann das auch benutzen. Okay. Wenn ich damit fertig bin, kann ich hier klicken. Lass mich euch das Bleistiftwerkzeug zeigen. Bleistiftwerkzeug, es ist nur eine menschliche Schrift. Wenn ich nur Igm schreibe, tut es mir leid, meine Handschrift ist zu schlecht. Ich werde das alles von hier löschen. Klicken Sie hier auf die Schaltfläche Löschen, und das ist gelöscht. Dieser auch. Falls ihr die Verwendung von Stift und Bleistiftwerkzeug verstanden habt , gibt es die Tastenkombination nur für Bleistift zu Umschalt-Plus P. Ihr müsst nur eine Umschalt-Taste mit P verbinden, um euer Bleistiftwerkzeug auszuwählen. Lassen Sie mich danach zu diesem Textwerkzeug kommen. Nachdem ich das Textwerkzeug ausgewählt habe, muss ich hier eine bestimmte Box erstellen. Von hier aus kann ich einfach alles eingeben, wie ich Ma Basic Tool Tutorial eingeben werde Ma Basic Tool Tutorial wie ich dieses geschrieben habe. Wenn ich dieses spezielle Ding von hier aus auswähle, kann ich tatsächlich die Schriftart auswählen. Okay, ich kann die Schriftart und auch eine bestimmte Größe auswählen. Okay? Welche Größe will ich hier haben? Ich habe diesen. Ich kann auch die Ausrichtung ändern, und es gibt noch viele weitere Dinge, die wir hier lernen werden. Ich habe zwei Zeilen. Ich kann von hier aus auch die Zeilengröße erhöhen oder verringern. Wie Sie sehen können, okay, ich kann auch die Breite von hier aus ändern. Ich kann die Schriftart von hier aus auswählen. Wie Sie sehen können, kann ich das alles hier tun Sobald ich meinen Text ausgewählt habe, verwende ich diese spezielle Textoption. Und ich kann auch Füllfarben Kontureneffekte hinzufügen, was wir später noch lernen werden. Damit werde ich es hier platzieren. Okay. Ich habe auch gelernt, wie Sie das Textwerkzeug verwenden können. Für das Textwerkzeug kommt die Tastenkombination von Ihrer Tastatur. Danach gehen wir zu den Ressourcen über. Wenn ich auf Ressourcen klicke, kann ich eine andere Art von Plug-In bekommen, eine andere Art von Widgets. Von hier aus sind Plug-ins sehr hilfreich. Ich werde euch einige der Plug-ins zeigen , die sehr hilfreich und praktisch zu bedienen sind. Okay, hier mit dem Handwerkzeug habe ich euch bereits gezeigt, wie wir uns hier bewegen können, wie auf dieser Seite, wie mit diesem Auswahlwerkzeug, ihr könnt euch einfach bewegen. Okay. Aber hier mit dem Handwerkzeug, angenommen, du hast eine ganze Seite voll Arbeit und es ist so viel okay, so viele Frames hast du erstellt und so viele Dinge, die du hier gemacht hast. Jetzt müssen Sie sich nur noch mit Ihrem Handwerkzeug bewegen Das ist ein ziemlich praktisches Werkzeug. Das letzte Tool in der Werkzeugleiste ist ein Kommentarbereich. Wenn ich diesen auswähle, und hier siehst du, dass dort ein Kommentarfeld ist. Angenommen, ich möchte hier einen Kommentar hinterlassen. Okay, hier kann ich klicken und ich schreibe Ändern, Schriftgröße und Farbe ändern. Wenn ich jemanden erwähnen möchte, füge ich danach seinen Namen hinzu, diejenigen, die in meiner Gruppe sind, mit denen ich zusammenarbeiten werde, ich kann sie tatsächlich erwähnen. Wenn ich alle nach der Rate erwähnen möchte, kann ich hier auch alle in Ordnung setzen. Ich habe auch verschiedene Emoji. Wie du hier sehen kannst, habe ich verschiedene Mogi, die ich entsprechend verwenden kann So viele verschiedene Bilder, nicht nur Emojis mit dem Gesicht, sondern auch Tiere, Fruchtsnacks und vieles Hier habe ich auch ein paar Worte. Okay. Welches ich benutzen kann. Ich kann sogar suchen, also kann ich das alles von hier aus erledigen. Das ist auch ein sehr praktisches Tool, wenn ich auf Enter klicke oder wenn ich hier klicke. Ihr könnt sehen, dass ich hier einen Kommentar hochgeladen habe. Wenn ich jemanden erwähnt habe, erhalten sie eine Benachrichtigung, dass ich sie in meinem Projekt erwähnt habe , dass sie etwas tun müssen oder dass ich ihnen einen Rat gegeben habe oder so etwas Ähnliches. Es wird sowohl in diesem Feld als auch in ihrer Box erscheinen , sodass es für sie sichtbar sein kann , wo auch immer ich das mache. Okay, von hier aus kann ich das auch einfach bearbeiten. Nun, ich kann diesen auch sogar löschen. Ich werde diesen einfach löschen. Ich hoffe, ihr seid jetzt mit allen Tools in der Werkzeugleiste gut vertraut. Jetzt können Sie mit dieser Figma-Anwendung tatsächlich eine Basisdatei erstellen mit dieser Figma-Anwendung tatsächlich eine Basisdatei Ich hoffe ihr habt es alle verstanden. Wir sehen uns alle in der nächsten Klasse oder im nächsten Tutorial. In diesem Kapitel werden wir viele weitere interessante Dinge über diese spezielle UX-Designanwendung für Benutzeroberflächen erfahren . Bis dahin, pass auf dich auf. Auf Wiedersehen. 5. Wie du Seiten in Figma verwenden kannst: Hallo zusammen und willkommen zu einem weiteren Tutorial in Figma Jetzt sind wir in unserem vierten Kapitel und ich werde euch zeigen, wie ihr Seiten in Figma verwenden könnt Seiten in Figma verwenden könnt In der letzten Lektion habe ich euch von all den Tools erzählt oder euch eine grundlegende Vorstellung davon gegeben Was sind dann ihre Verwendungszwecke in dieser speziellen Anwendung In diesem Kurs werde ich euch etwas über Seiten erzählen. Sie können eine Seite hinzufügen. Wie Sie mithilfe der Copy-Paste-Methode einen bestimmten Inhalt von einem Projekt in ein anderes kopieren können. Und wie Sie tatsächlich so viele Frames oder so viele Komponenten, so viele Vektoren auf einer bestimmten Seite platzieren so viele Frames oder so viele Komponenten, so viele können. Und wie ihr tatsächlich arbeiten könnt, indem ihr euch einige Beispiele aus der Figma-Community zeigt ihr euch einige Beispiele aus der Figma-Community Lasst uns hier keine Zeit verschwenden. Lass uns mit diesem Kurs beginnen. Jetzt bin ich auf der Homepage von Figma. Wie Sie hier sehen können, habe ich die Explore Community Und ich habe zwei der Projekte übernommen, zum Beispiel Designs. Ich habe zwei dieser Designs genommen, um euch zu zeigen , wie es tatsächlich funktioniert, zum Beispiel, wofür Seiten verwendet werden oder wie ihr Seiten tatsächlich in eurer Arbeit verwenden könnt . Wie ihr sehen könnt, habe ich dieses erste Design hier genommen. Sie können sehen, dass er hier unten vier Seiten hat. Okay. Hier hat er vier Seiten. Wenn Sie von hier aus weitere Seiten hinzufügen möchten, können Sie einfach hierher kommen und von hier aus auf diese Seite klicken. Wie Sie sehen können, musste ich, sobald ich auf eine neue Seite geklickt habe, eine neue Seite erstellen Hier bin ich es entsprechend. Okay. Nehmen wir an , ich sage das einfach als Pages Class. Jetzt möchte ich einen Rahmen erstellen. Von hier aus habe ich euch gezeigt, wie wir einen Rahmen erstellen können , da ihr hier auch Voreinstellungen habt Ich nehme für einen Desktop, ich nehme 12, 18 bis 832 Hier habe ich diese spezielle Seite. Wie Sie sehen können, ist mein Rahmen da, sobald ich diese Seite erstellt habe , aber unter meinem Rahmen habe ich nichts, weil ich keine Boxen oder Takes hineingelegt habe. Lassen Sie mich jetzt eine Box erstellen. Wie Sie sehen können, wo ich diese Box oder diese Form in meinem Rahmenrahmen erstellt habe. Die rechteckige Box kommt gerade nach dem anderen. Okay? Mein rechteckiges Kästchen befindet sich direkt unter dem Rahmen. Und jetzt kann ich das im Grunde so benennen, wie ich will. Okay? Ich schreibe einfach Decks Stopp. Ich werde das hier speichern. Du siehst, ich kann ihm tatsächlich etwas Farbe geben , wie ich will. Gib diesem auch eine andere Farbe. Okay, lass mich diese Farbe nehmen. Wie Sie sehen können, habe ich diese Seite. Okay? So können Sie eine Seite tatsächlich verwenden. Und wir können auch verschiedene Seiten oder verschiedene Frames auf derselben Seite erstellen . Okay? Wenn ich einfach mit der Steuerung herauszoome, Maus hier unten, kannst du sehen, dass ich hier ein Bild habe. Wenn ich dieselbe Seite mit derselben Größe replizieren möchte, klicke ich zuerst auf Alt Ich werde diesen Rahmen wählen. Ich klicke auf Alt. Sobald ich dort auf Alt geklickt habe, können Sie mit meiner Maus sehen, dass ich zwei Mäuse habe. Auf diese Weise kann ich denselben Frame replizieren. Auch hier werde ich diesen auswählen und diesen mit meinem Handwerkzeug bewegen Ich verschiebe einfach den Bildschirm, ich euch in der Mitte zeigen kann. Was hast du hier verstanden? Wie hier haben wir verstanden, dass wir innerhalb einer Seite so viele Frames, so viele Vektoren erstellen können . Wir können auch so viele Textanimationen und Symbole einfügen. Okay, ich habe euch auch gezeigt, wie wir eine Seite erstellen können. Lasst mich euch zeigen, ob ich den gleichen Namen habe, wie ich das tatsächlich ändern kann. Okay, von hier aus. Ich klicke hier auf das Bild als drei. Dass ich hier nicht verwirrt werde. Okay? Angenommen, mir hat irgendwas von dem Ding gefallen. Okay? Angenommen, mir gefällt dieses besondere Logo. Oder lassen Sie mich zu dieser Seite zurückkehren und ich möchte dieses bestimmte Bild auf meiner eigenen Seite aufnehmen. Dafür kann ich entweder auf Steuerung C klicken, was Kopieren bedeutet. Andernfalls kann ich einfach hierher kommen, auf Von hier kopieren klicken und mit meinem Auswahlwerkzeug zu dieser Seite zurückkehren, dieses spezielle Feld auswählen und es hier einfügen. Okay, wie Sie sehen können, ist es, sobald ich es eingefügt habe, auch auf meine Seite gekommen Dementsprechend kann ich auch so viele der anderen Projekte aus der Community-Option übernehmen oder weiterempfehlen viele der anderen Projekte aus der Community-Option Wenn ich hierher gehe, nehme ich an, ich lasse mich zuerst mit meinem Kopf heranzoomen mit meinem Kopf heranzoomen , damit ich dieses Bild von hier und hier bewegen kann. Sie können sehen, wie es tatsächlich verwendet wird. Hier hat er zunächst ausgewählt , welche Farben er verwenden soll. Okay? Das sind die Farben , die er verwenden wird. Dies ist die Schriftart, die er für die Überschrift verwenden wird. Und das wird der Schrifttyp oder die Schriftgröße für den Hauptteil sein. Und wenn Sie einen Kleinbuchstaben verwenden möchten, wird er diese Schrift verwenden. Dies sind verschiedene Arten von Komponenten, die er verwenden wird. Dies sind das Navigationstool, das verwendet wird, das Trennsystem und verschiedene Arten von Textfeldern, wenn Sie auch einen speziellen Textbereich und Schaltflächen nach oben einfügen möchten auch einen speziellen Textbereich und Schaltflächen nach oben Er hat einfach einen schönen Entwurf für sich selbst gemacht , bevor er eine mobile Anwendung oder irgendeine Art von Sobald Sie damit fertig sind, wenn Sie das alles gemacht haben, wird es für Sie ganz einfach, daran zu arbeiten, dass wir die Größe nicht von anderen Orten verbannen müssen , damit sie gleich bleibt Siehst du hier, er hat so perfekt aufgelistet, welche Schalter er benutzen wird. Hier seht ihr, dass er zwei Schalter von hier ausgewählt hat, die Funkgruppe Atoms, was alles benötigt wird. Er hat sie tatsächlich in die richtige Reihenfolge gebracht , damit er nicht verwirrt wird. Hier können Sie Diagramme sehen und hier wird er ein Säulendiagramm einfügen. Aber hier steht bald geschrieben , dass er später daran arbeiten wird. So sollten wir eigentlich arbeiten. Bevor wir mit einem Projekt beginnen, sollten wir uns im Grunde genommen einen Plan erstellen , auf den wir uns auf diese bestimmte Sache beziehen und entsprechend arbeiten können diese bestimmte Sache beziehen und entsprechend arbeiten Hier können Sie das Logo von hier aus sehen, das ist eine andere Seite. Das ist nicht die erste Seite, okay. Hier ist eine weitere Seite , die er genommen hat und versucht hat, von hier aus die Demo-Arbeit zu machen. Nehmen wir an, ich nehme diese Seite hierher, dann kann ich sie von hier nach unten verschieben. Außerdem habe ich verschiedene Titel. Angenommen, ich möchte etwas auf dieser bestimmten Seite verschieben oder kopieren und einfügen. Was ich tun kann, ist , hier einfach auf Optionen einfügen zu klicken und die Option Kopieren ist auch hier. Es hängt davon ab, was ich hier machen möchte. Lassen Sie mich hier zu diesem anderen Webdesign kommen. Wenn ich komme, wenn ich von hier aus zu dieser Assets-Option gehe, wie Sie sehen können, hat er all diese Ressourcen hier verwendet. Wenn ich dieses spezielle Asset verwenden möchte, kann ich einfach hier klicken oder dieses C auswählen. Lassen Sie mich stattdessen einfach dieses von hier nehmen. Okay, weil das so aussehen wird, nehme ich es hier mit. Geh zurück zu meinem Ebenenseiten-Kurs. Hier drücke ich einfach Strg V , du kannst die Schrift sehen. Ich habe es hier. Ich kann die Größe erhöhen, wenn ich will. Dafür muss ich die Ansicht vergrößern und die Größe entsprechend meinen Bedürfnissen vergrößern. Mit meinem Verschiebewerkzeug kann ich einfach hier nach oben gehen. Ich kann auch die Farbe ändern, wenn ich will. Lass mich eine schwarze Farbe nehmen. Lass mich das drauflegen. Okay, hier. Jetzt habe ich Stück für Stück eins geschrieben. Ich kann es irgendwo dazwischen platzieren. Ja, das sieht ziemlich gut aus. Ich kann es tatsächlich auch mit anderen Anrufen machen. Okay, hier nennen sie diesen Rahmen als Platzhalter. Ich kann diesen grundsätzlich löschen. Ich kann alles setzen, wie ich will. Okay, nehme das vollständige Drehbuch an. Von hier aus kann ich auf Steuerung klicken, zurück gehen und hier auf Steuerung klicken. Sie können sehen, dass ich hier die ganze Seite oder das vollständige Bild habe. Ich kann die Größe tatsächlich von hier aus überprüfen. Okay, ich kann die Größe nach Belieben verringern. Das ist die Seitengröße. Wenn ich den Radius verringern möchte, kann ich auch den Radius verringern. So können wir mit der Seite arbeiten und tatsächlich unser eigenes Design erstellen. Und wir können auch alles aufstellen, wie wir wollen. Ich hoffe, ihr habt verstanden, wie Seiten verwendet werden und wie wir Seiten kopieren und einfügen können, wie wir verschiedene Seiten nehmen und Inhalte in unsere Seite einfügen können. Im Grunde haben wir innerhalb von Seiten Frames und unter Frames haben wir alle anderen Komponenten. Wir werden etwas über Komponenten und maskierende Vektoren lernen. Ich habe dir bereits gesagt, wie du die Formen verwenden kannst. Wir werden über all das lernen. Es geht nur um eine Sequenz und darum , wie wir tatsächlich daran arbeiten. alles erfahren Sie in der nächsten Lektion, in der wir lernen werden , wie wir in dieser Anwendung Prototypen erstellen können. Figur. Wir sehen uns alle in der nächsten Klasse Passen Sie auf sich auf. Auf Wiedersehen. 6. Wie du Prototyping in Figma durchführen kannst: Hallo zusammen und willkommen zu einem weiteren Tutorial in Jetzt sind wir in unserem fünften Kapitel und erfahren, wie Sie mit dem Prototyping in dieser Anwendung beginnen können mit dem Prototyping in dieser Prototyping ist wie das Erstellen einer App, bei der Sie einfach scrollen und zur nächsten Seite gelangen Ich werde das machen und wir werden zeigen, wie wir eine Vorschau Ihrer Arbeit anzeigen können, wie wir Ihre Arbeit präsentieren können und wie Sie Ihre Arbeit auch bearbeiten können, und wie Sie Ihre Arbeit auch bearbeiten können während Sie das Prototyping durchführen Verschwenden wir keine Zeit, fangen wir hier mit diesem Kurs Wie ihr sehen könnt, habe ich drei Frap hier. Dies ist nur eine Seite, auf der ich euch zeigen werde, wie ihr zwischen diesen Seiten Prototypen erstellen könnt Als Erstes wähle ich diesen speziellen Rahmen aus. Nachdem Sie hier ausgewählt haben, sehen Sie die Designoption Direkt neben der Designoption habe ich die Prototyp-Option. Hier können Sie sehen, dass ich die Prototyp-Option habe. Wenn ich hier unten klicke, kannst du das Flussdiagramm, die Interaktionen und alles andere sehen . Aber was ich tun werde, ich werde auf diese positive Seite klicken und mich dieser anschließen. Ich habe diese positiven Seiten hier, ich kann diese vier Seiten miteinander verbinden. Okay, der Prototyp ist im Grunde ziemlich umfangreich, aber ich fange einfach mit dem Prototyp an , nur um euch zu zeigen, wie das tatsächlich funktioniert. wie Sie anfangen können, Ihre eigene Anwendung oder eine beliebige Webseite zu erstellen . Sie fragen mich, wohin ich navigieren möchte. Ich möchte weitermachen wollen. Ich werde auf diese Trainings-App klicken. Gut, stattdessen ist es auch in Ordnung. Dies sind einige der Animationen, die es gibt. Darüber werde ich einen kurzen Kurs nehmen. Hier ist es auf Klick. Ich verlinke das hier genauso wie ich diese Seite mit dieser Seite mache, ich werde dieser Seite hier beitreten. Okay, den habe ich auch. Wie ihr gesehen habt, habe ich das. Jetzt möchte ich sehen, wie es von einer Seite zur nächsten geht. Okay, dafür kannst du sehen, dass ich hier ein Symbol habe. Okay, hier gibt es im Grunde zwei Symbole. Der erste ist vorhanden und der andere ist Vorschau. Es gibt einen großen Unterschied zwischen Gegenwart und Vorschau. Wenn ich auf Geschenk klicke, wird hier ein anderes Feld angezeigt, ein anderes Fenster, wenn ich auf Geschenk klicke. Mal sehen, wie es aussehen wird. Danach werde ich euch zeigen, eine Vorschau aussieht und wie sie sich unterscheidet. Hier kannst du sehen, dass ich diesen habe. Wenn ich darauf klicke, kann ich es einfach ändern. Okay. Wie Sie auch manuell sehen können, kann ich hier klicken und sehen, wie meine Seite aussieht. Okay, hier, nehmen wir an, ich habe diese Symbole hier. Wenn ich nur tippe, gehe ich einfach auf die andere Seite. Ich hoffe ihr habt verstanden wie ihr das manuell machen könnt Wir können auch zurückgehen, aber ich nehme an, ich möchte dieses spezielle Schreiben von hier aus ändern. In diesem Fall sollte ich nicht jedes Mal zurückgehen oder diese bestimmte Seite einfach streichen. Was ich einfach tun kann, ich kann einfach herkommen. Angenommen, ich möchte das auswählen, oder ich möchte dieses Feld auswählen. Und ich möchte die Größe dieses Felds verringern. Okay? Verkleinern Sie die Größe. So etwas in der Art. Also möchte ich diese Box einfach löschen. Okay, nur um euch ein Beispiel zu zeigen, ich klicke einfach auf Löschen. Jetzt können Sie sehen, wie meine Seite von hier aus beginnt. Okay? In diesem Fall werde ich, wenn ich hier auf diese Seite komme, sehen Sie, dass meine erste Seite so aussieht. Ich musste diese erste Seite nicht löschen oder diese erste Seite stornieren , um die Änderungen zu sehen. Im gleichen Fall kann ich, wenn ich eine Farbe oder etwas Ähnliches ändern möchte , einfach zur Designoption diese Feldoption wechseln. Von hier aus kann ich hier jede Farbe wählen, die mir gefällt. Sie können hier sehen, dass ich diese spezielle Farbe habe. Ich kann das einfach auswählen , da ich diese Farbe habe. Ich kann diese Farbe auch in all diesen Bildern verwenden. Okay, ich werde hier eine Farbe wie diese nehmen. Sie können sehen, dass ich die Farbe habe und ich kann das Muster von hier aus ändern. Hier, wenn ich eine andere Farbe für den Film nehmen möchte, kann ich das auch von hier aus tun. Okay, alle Boxen auch, ich kann von hier aus verschiedene Farben verwenden. Okay, ich hoffe ihr habt verstanden, wie ihr den Prototyp machen könnt und wie ihr diese Seite sehen könnt, okay, hier, wie ihr sehen könnt. Sobald ich hier einige Änderungen vorgenommen habe, wurde sie auch geändert. So funktioniert es tatsächlich. So kannst du dir ein Geschenk besorgen oder dir unsere Arbeit in einem neuen Tab ansehen. Aber wenn ich eine Vorschau sehen möchte, schauen wir uns an, was sie bewirkt. Wenn ich auf Vorschau klicke, habe ich hier ein Fenster direkt neben meiner Arbeit. Es wird kein anderes Fenster erstellt, aber stattdessen wird mir nur eine Vorschau angezeigt. Auf jedem Korridor, den ich hier platzieren werde, könnt ihr mein Vorschaufeld sehen, das gerade geladen wird. Ihr werdet sehen können, dass es mir ein Live-Update meiner Vorschau gibt. Von hier aus kann ich dieses in der Präsentationsansicht öffnen, was ich nicht tun muss, da ich dieses hier bereits geöffnet habe. Ich kann das auch auf das Bildseitenverhältnis übertragen. Ich kann von hier aus manuell hierher kommen. Wenn ich einfach darauf tippe, geht es von ersten Seite zur zweiten. Zweiter bis dritter. 7. Erleichterungsoptionen und Prototyp-Animation: Hallo zusammen und willkommen zu einem weiteren Tutorial in Figma Dies ist das sechste Kapitel und wir werden etwas über die einfachen Optionen und die Prototyp-Animation lernen die einfachen Optionen und die . Wie in der letzten Klasse habe ich euch gezeigt, wie ihr mit dem Prototyping beginnen und Frames mit Frames verbinden könnt Prototyping beginnen und Frames mit Frames verbinden Hier in diesem Kurs werden wir lernen, wie Sie diese Frames tatsächlich animieren können , wenn sie auf dem Bildschirm erscheinen Und eine bestimmte Schaltfläche kann Sie zu einer anderen Seite führen. Ich werde euch zeigen, wie ihr das machen könnt. Unter diesem Punkt werde ich euch viele weitere Optionen zeigen. Was kann in dieser speziellen Anwendung verwendet werden , um eine mobile App oder eine Web-App zu erstellen? Lass uns nicht nass schreiben und lass uns mit dieser speziellen Klasse beginnen. Auch hier bin ich wieder auf meiner Homepage von Figma und werde es euch von hier aus zeigen Okay, wie ihr sehen könnt, habe ich jetzt diese Frames, ich werde von hier aus Prototypen erstellen, aber es wird ganz anders sein, denn ich habe euch gesagt, dass ich, wenn ich klicke, auf diese bestimmte Seite führen kann, die überall sein kann Okay, nehmen wir an, ich möchte direkt auf diese Seite gehen. Was habe ich auf diese spezielle Schaltfläche geklickt, lassen Sie mich diese Schaltfläche einfach vergrößern. Ich habe diesen ausgewählt. Ich habe den Rechtschreibfehler. Ich füge hier einfach hinzu. Da ich diese spezielle Schaltfläche hier habe, werde ich zuerst die Ansicht verkleinern, wenn ich auf diese klicke. Wenn ich zu meinem Prototyping übergehe, habe ich hier, wie Sie sehen können, die positive Seite. Was ich tun werde, ist, wenn ich hier auf diese spezielle Schaltfläche klicke , werde ich auf diese Seite zurückkehren Das will ich. Okay, hier kannst du sehen, dass ich viele Möglichkeiten habe. Beispiel, ob ich durch zwei navigieren möchte, ob ich zurückgehen möchte und was für eine Animation auf welcher Seite ich gehen möchte. Auf dieser Seite möchte ich hier mal die letzten drei Seiten sehen. Außerdem habe ich es hier. Ich klicke hier. Ich werde diese Option auch von hier aus wählen. Okay, hier könnt ihr tatsächlich die Vorschau sehen , wie es tatsächlich aussehen wird , wie ihr von hier aus sehen könnt. Ich kann auch ändern, ob es draußen ist. Lass es mich euch zeigen, indem ich mir nur eine Vorschau hole. Okay, ich klicke einfach hier. Nimm die Vorschau. Wie Sie sehen können, wird es geladen. Aber es wird mir jetzt dieses Ding hier geben. Wenn ich hier auf das Atmen klicke, kannst du dich einfach entspannen Wenn ich noch einmal zurückgehe und diese spezielle Sache auf Instant ändere Wenn ich jetzt noch einmal zurückgehe und auf dieses Bild klicke, ändert sich das sofort. Das ist die Animation oder die Art und Weise, wie wir das mit einem Klick animieren können Manchmal wollen wir einfach D, okay? In diesem Fall kann ich auf diesen klicken, besonders bei Popups. Wenn ich etwas ziehen oder zur nächsten Seite gehen möchte, dann kann ich das tun. Okay, hier habe ich diese Optionen. Lass es uns eins nach dem anderen sehen, okay? Wenn ich hier auf Auflösen klicke, siehst du in der Vorschau, wie es sich langsam auflöst. Okay, lass mich zurück auf diese Seite gehen. Wenn ich hier auf das Atmen klicke, siehst du, dass es sich gerade auflöst Okay, ich werde euch später die Smart-Animate-Option erklären, weil das ein bisschen knifflig ist Wir behalten es einfach für die nächste Phase des Kurses. Hier ist eine weitere Option namens Verschieben. So wird es kommen, wenn ich hier auf meine Seite klicke, lass mich zurückgehen. Klick hier. Es wird also so kommen, wie Sie von hier aus sehen können. Außerdem kann ich das Timing tatsächlich ändern. Okay, zum Beispiel, wie viele Sekunden oder Millisekunden wird es kommen Ich gebe 450 Millisekunden. Ich habe diesen gesagt. Gehen wir jetzt wieder zurück. Klicken Sie hier. Wie Sie sehen können, erschien es etwas langsam. Es hängt alles von Ihrer Anwendung ab oder davon, welche Art von mobiler App Sie erstellen, worauf sie basiert und all dem. Hier kann ich all diese Optionen sehen. Wenn ich die Grenzen wähle, wenn ich jetzt zurückgehe Okay, wenn ich hier klicke, siehst du, dass es die Kämpfe hier auf meinem Bildschirm gibt, ich kann aus all dem wählen Wenn ich will, dass es langsam geht, wird es so kommen. Von hier aus wird es langsam gehen. Und plötzlich wird es einfach auf meinem Bildschirm auftauchen. Ich zeige euch nur alle Optionen, die wir hier haben. Ich möchte auch, dass es schnell erscheint. Wenn ich auf diesen klicke, wird er so angezeigt. Und wenn ich möchte, dass es sanft hierher kommt, wird es okay erscheinen. Auf welcher Seite soll es erscheinen? Nehmen wir an, ich habe es von hier aus gegeben. Jetzt werdet ihr sehen können, dass diese Seite von rechts erscheint, nicht von links, sondern von rechts. Und in diesem Fall, wenn ich es oben angegeben habe, wird es von oben angezeigt. Oder es wird von unten erscheinen und es wird nach oben gehen. Okay, lass mich auf Ja klicken. Und dieser ist das totale Gegenteil von dem. So können hier alle Anwendungen bearbeitet werden. Okay, ich hoffe ihr habt es verstanden. Und wenn ihr etwas ändern wollt , nehmt an, dieses spezielle Ding, das ich von hier aus sehen kann, kann ich nach Belieben einteilen. Es ist raus, wenn ich dieses wähle, wenn ich die Vorschau sehen will, so wird es kommen. Ihr könnt die Vorschau auch hier in dieser Box sehen. Okay. Wenn ich zurück navigieren möchte, kann ich hier klicken. Okay. Und jetzt versuchen wir, die ganzen vier Seiten, die ich hier habe, zu prototypisieren. Okay, also mit meinem Handwerkzeug werde ich diese Kiste ein bisschen bewegen. Okay, geht zurück zu meiner ersten Seite und wie ich euch bereits gesagt habe, müsst ihr weder noch euer Geschenk schließen eure Vorschau noch euer Geschenk schließen, während ihr Änderungen vornehmt. Wenn ich mit dem Prototyp hierher komme und mein Auswahlwerkzeug erneut auswähle, kannst du hier sehen, dass dies die Schaltfläche für die gesamte Seite ist. Okay, ich werde es euch zeigen , ob ich diesen einfach wieder mit dieser Seite verbinde. Und ich werde hier alle Verbindungen angeben. Da ich die Entspannungsoption habe, wähle ich diese und ich kann auch den Text auswählen, wenn ich möchte, aber ich wähle einfach das Feld da sich mein Text in dem Feld befindet. Ich nehme diesen. Ich bringe es her. Von hier aus kann ich animieren, wie ich will, wie es aussehen soll Okay, auf dieser Seite möchte ich, dass es sich auflöst. Ich setze das Timing auf 400. Es werden 400 Scheine benötigt, um das Atmen aufzulösen. Ich habe es schon für Yoga hergebracht, da ich hier diese Option habe, Yoga. Klicke darauf und ich komme zur Yoga-Seite. Wie ich diesen tatsächlich löschen kann, ist zunächst, lass mich das Feld hier in diesem Feld auswählen. Jetzt kann ich diese Seite hier auswählen. Okay. Hier kannst du sehen, dass ich das alles hier in all diesen Boxen hier habe. Sie können sehen, dass ich auch die Home-Taste habe. Ich werde sicherstellen, dass ich, sobald ich auf diese bestimmte Home-Schaltfläche oder Home-Registerkarte geklickt habe, einfach darauf eingehen kann. Home-Tab hier. Verschiebe das zusammen mit dem hier her. Wie du siehst, will ich das für uns haben. Gehe zu dieser Seite oder verbinde dich mit dieser Seite. Wie Sie sehen können, die Plus-Option hier, ich werde einfach hier auf dieser Seite eine Verbindung herstellen , wie Sie von hier aus sehen können. Außerdem kann ich das ändern, ich lasse das einfach draußen und setze es als Umzug von hier aus. Außerdem nehme ich diesen Knopf, ich nehme diesen hier. Bisher kann ich das nicht auswählen. Da ich diesen ausgewählt habe, werde ich ihn hierher bringen. Nur von hier aus kann ich wählen, wie ich animieren möchte, da ich das alles auf meine Startseite geleitet habe Lassen Sie mich eine Vorschau davon bekommen. Okay, so wird es nachlassen. Y hier, du kannst anhand der Navigation alles sehen, was ich will. Schauen wir uns die Rezension an oder ich schneide einfach die Vorschau. Ich werde es hier einfach in einem anderen Panel präsentieren. Ihr könnt sehen, dass es jetzt hier geladen wird, wie ihr sehen könnt, ich habe das. Wenn ich auf diese Entspannung klicke, kannst du sehen, dass ich auf die Entspannungsseite gegangen bin. Wenn ich runterkomme, wenn ich hier auf diese hier klicke, siehst du, dass ich wieder auf meiner Startseite bin. Wenn ich auf diese Atemoption klicke, lande ich einfach hier oben auf der Atemseite. Okay, von hier aus, wenn ich zurückkomme und auf diesen Home-Button klicke, könnt ihr wieder zurück zur Startseite sehen . Wenn ich auf diesen Yoga-Button klicke, bin ich auch hier wieder auf dieser Seite. Wenn ich wieder zu meiner Startseite zurückkehren möchte , klicke ich hier. Ich kann wieder zu dieser speziellen Seite zurückkehren. Dafür gibt es so viele andere Möglichkeiten. Wir müssen mehr Rahmen erstellen, um euch ein Beispiel zu zeigen , wie dieses Prototyping tatsächlich funktioniert Ich habe gezeigt, ich hoffe ihr habt es verstanden, um euch ein Grundwissen über Prototyping und über diese Animation, die ich gezeigt habe Gehen wir noch einmal zu dieser Hauptdatei hier. Wenn ich von hier aus etwas ändern möchte, kann ich es ändern. Gehen Sie einfach zur Designoption. Jetzt können Sie die Links zwischen all diesen vier Seiten hier nicht sehen . Ich schlage immer vor, dass Sie Ihre Seite richtig benennen , damit Sie nicht verwirrt werden. Denn wenn Sie eine kleine App oder eine größere App erstellen , müssen Sie immer sicherstellen, dass Sie nicht zwischen Ihren Charakteren oder zwischen Ihren Frames verwirrt werden. Dass dadurch ein Durcheinander entsteht und ihr nicht herausfinden könnt , wo ihr hingehört. Was in dem Fall als vielleicht im dritten Kapitel dort gezeigt wurde, habe ich euch Jungs gezeigt , die ich aus der Community in Figma mitgenommen habe Ich habe ein Projekt genommen und euch gezeigt , wie er seine Arbeit eigentlich bestellt hat Er hat eine bestimmte Farbe ausgewählt, die er verwenden wird, die Bänder, die Symbole, alle Designs haben diese in einer Spalte. In jedem Bild hat er einfach gesagt, welche Schriften er verwenden wird, Größen, alles. Wir sollten alles einstellen, bevor wir eine Anwendung erstellen. Wenn ich diesen löschen möchte, wie die Links dafür, muss ich im Prototyp wieder hierher kommen. An diesem Prototyp hier könnt ihr sehen, dass ich all diese Links hier habe. Okay, hier könnt ihr sehen, dass ich all diese Links habe. Wenn ich einen Link von hier löschen möchte, kann ich einfach hier klicken und ich kann hier auf diesen Minus-Button klicken , wenn ich das nicht tun möchte. In diesem Fall kann ich einfach die Zeile auswählen , an der ich die Frames verbunden habe. Ich kann einfach auf diese Zeile und dann auf Löschen klicken. Okay, so kann ich löschen. Ich mache das einfach wieder rückgängig. Hier können Sie sehen, dass wir auf diese Weise mithilfe von Prototypen eine einfache mobile Anwendung sein können mithilfe von Prototypen eine einfache mobile Anwendung Ich hoffe, dieser Kurs war klar und jetzt könnt ihr eure eigene mobile Anwendung erstellen Ich sage euch einfach, ihr sollt mit etwas Einfachem beginnen. Versuche einfach, eine einfache Anwendung zu erstellen. Versuche das danach. Sobald Sie sich sehr an diese Anwendung gewöhnt haben, entscheiden Sie sich für etwas Komplexes, damit Sie sich an diese Anwendung gewöhnen, damit es bei der Herstellung des Endprodukts keine Probleme gibt . Ich hoffe, wir sehen uns alle im nächsten Tutorial, in dem wir mehr über Verzögerungen und intelligente Animationen erfahren werden. Was ich mit intelligenter Animation meine, ist anzunehmen, dass ich dieses bestimmte Symbol oder irgendein Bild auf meiner Seite hier in diesem Käfig habe. Wenn ich darauf klicke, wird es animiert angezeigt. Ich werde euch in der nächsten Klasse auch zeigen, wie wir das in unserer speziellen Anwendung tatsächlich machen können. alle auf euch auf. Auf Wiedersehen. 8. Intelligente Animation: Hallo zusammen und willkommen euch alle zu einem weiteren Tutorial-Figma hier. Dies ist das siebte Kapitel und wir werden etwas über intelligente Animationen lernen wie Sie sich im Grunde um ein bestimmtes Werkzeug oder ein bestimmtes Objekt in Ihrem Rahmen bewegen bestimmtes Objekt in Ihrem Rahmen und animieren können, dass es richtig abfällt Und auf nette Weise werden wir all das in diesem speziellen Kurs lernen Verschwenden wir keine Zeit und beginnen wir hier mit dieser speziellen Lektion. Wieder zurück auf der Homepage von Figma. Nun, in der letzten Klasse, habe ich euch bereits erzählt wie wir tatsächlich von einer Seite zur anderen wechseln können Nun, falls ihr euch erinnert habt, ich habe es euch in diesem Kurs gezeigt. Wie ihr sehen könnt, habe ich auch das Prototyping bis jetzt in der letzten Klasse gemacht, wenn ich hier klicke, habe ich diese Option ausgenommen In diesem Kurs geht es im Grunde um diese intelligente Animation. Ich werde euch auch zeigen, wie man verzögert, was das im Grunde ist Angenommen, ich habe dieses Bild oder diesen Rahmen hier auf meiner Hauptseite Okay, also was ich tun werde, ist, dass ich mir dafür einfach eine Animation einfallen lassen wollte . Wir werden sehen, wie wir das machen können. Okay, für den Anfang wollen wir eine weitere Ebene dieses speziellen Frames hier duplizieren . Okay, zum Duplizieren. Ich habe dir bereits gesagt, dass wir nur auf Alt klicken müssen Wie ich hier angeklickt habe, können Sie sehen, dass ich zwei Mäuse habe Okay, lassen Sie mich den gesamten Rahmen auswählen. Klicken Sie hier auf die Alt-Option, Sie können sehen, dass ich eine habe. Okay, ich habe das Duplikat dieser Ebene. Lass mich einfach diese Seite bewegen. Lassen Sie mich auch diesen speziellen Rahmen auf diese Seite verschieben , damit ich nicht verwirrt werde. Okay, bring diesen hier her. Wie Sie sehen können, habe ich diese beiden getrennt. Dieser ist benannt, wie ihr auch seht Beide sind Entspannung auf diesem Bild. Kopie meines ersten Frames hier. Jetzt muss ich das Objekt auswählen, das ich animieren möchte Okay, jetzt komme ich einfach her. Ich möchte dieses Bild oder diesen speziellen Rahmen animieren. In diesem Fall werde ich vorher diesen auswählen Ich werde das mit diesem Entspannungs-Tab hier verbinden. Okay, jetzt kannst du sehen, dass ich diesen habe. Ich komme hierher und wähle die Option Smart Animate Und hier werde ich die Option Is is out verwenden. Wie Sie sehen können, habe ich hier 400 ausgewählt. Ich mache einfach 450. Und ich klicke auf Okay. Von hier aus. Wie Sie sehen können, habe ich diesen. Da ich nun möchte, dass diese Ebene langsam erscheint , ziehe ich einfach diese bestimmte Ebene aus dieser Ebene heraus. Okay? Nun, dieser ist nicht in diesem Rahmen. Was passiert hier, wenn ich das alles hier runterziehe? Sie können sehen, dass ich mich entspannen muss. Also nenne ich es Entspannung eins und dieses als Entspannung zwei, okay? Also werde ich das speichern und wie du jetzt sehen kannst, habe ich Entspannung zwei Seiten und auch die Seite Entspannung, okay? Einer sollte oben sein und zwei sollten hier sein. Und ich werde diesen Rahmen über diesem behalten, okay? Ich zeige euch einfach ein Beispiel, wenn ich diesen speziellen Rahmen einfach von hier ziehe, okay, nehmen wir an, ich möchte ihn ziehen. Jetzt komme ich einfach zum Entwerfen. Nimm dieses Bild so wie ich es getan habe, bewege dich in diesem Bild, okay? Es geht einfach in diesen rein, okay? Wie du jetzt sehen kannst, ist dieser da drin. Aber sobald ich anfange , das rauszuholen, kannst du sehen, dass es aus der Entspannung herauskommt , aber ich will es drinnen haben. Wie ich euch hier schon gezeigt habe, habe ich die Prototyp-Dinge. Siehst du, ich habe diesen auch angeschlossen. Lassen Sie uns nun versuchen, eine Vorschau zu sehen , wie das tatsächlich aussehen wird. Wenn ich auf Präsentieren klicke , habe ich von hier aus eine bessere Ansicht. Ich werde von hier aus auf Entspannung klicken. Wenn ich noch einmal hier klicke, sieht es so aus. Ja, ihr habt verstanden, wie wir das im Grunde machen können. Aber was ich will, ist, dass ich nicht hier klicken muss, da ich geklickt habe, wie ihr sehen könnt Lass es mich euch noch einmal zeigen. Sobald ich hier reingeklickt habe, ist diese Seite wieder aufgetaucht. Als ich hier geklickt habe, ist nur dieses spezielle Bild erschienen Aber ich möchte, dass jedes Mal, wenn ich diese bestimmte Seite oder den Entspannungs-Tab öffne, sie langsam angezeigt werden In diesem Fall werde ich eine Verzögerung einlegen und hier die Einstellungen ändern. Okay, lassen Sie mich hier zur Originaldatei zurückkehren. Eine andere Möglichkeit besteht darin, diesen bestimmten Rahmen auszuwählen und anzunehmen, dass ich ihn hierher bringen möchte, okay? Ich bringe das her. Aber in diesem Fall werde ich einfach die Deckkraft ändern, okay? Also lass mich einfach die Opazität von diesem ändern, okay? Lass mich gehen, diesen speziellen Rahmen hier korrigieren, Null, okay? Ich sehe das überhaupt nicht. In dem Fall mache ich einfach zehn. Wenn ich auch zehn mache, kann ich nicht viel sehen. Okay? Vielleicht kann ich sehen, dass so etwas wie 25 hier ist. Du kannst sehen, ich habe hier eine verschwommene Stelle. Wenn ich jetzt versuche, eine Vorschau davon zu bekommen , gehen wir zurück hierher. Wenn ich hier darauf klicke, siehst du, dass es erscheint. Aber wie Sie jetzt wieder sehen können , muss ich darauf tippen, um eine Ansicht zu erhalten. Okay, hier habe ich schon die Deckkraft geändert. Ich möchte mehr tun. Lass mich 50% machen Okay, jetzt schauen wir uns die Vorschau an. Von hier aus klicke ich darauf, so wird es aussehen. Oder wenn ich nur die Deckkraft ändern und sie an diese Stelle bringen möchte , kann ich das auch tun Komm her, wähle den ganzen Rahmen aus. Platzieren Sie nach der Auswahl einfach den gesamten Rahmen hier und sehen Sie sich jetzt die Vorschau an. Okay, lass mich zurückgehen. Klicken Sie auf Entspannung, dann klicken Sie hier und dann erhalten Sie eine Seite. Aber wie ich dir schon gesagt habe, ich möchte hier nicht doppelt klicken. Ich möchte, dass es von selbst erscheint. Okay, dafür werde ich herkommen. Wie Sie sehen können, habe ich diesen Button hier ausgewählt. Gehe zur Prototyp-Option. Ich wähle hier einfach diese Option aus. Sie können sehen, dass ich die Option zum Auflösen habe, aber statt Auflösen werde ich danach die Sofortoption wählen. Wie Sie sehen können, wird es mich auf einer Seite zur Entspannung führen einer Seite zur Entspannung und dies ist die zweite Seite zur Entspannung. Ich möchte, dass es hier erscheint, da ich hier bereits die Option „ Nach der Verzögerung“ ausgewählt habe. Wenn ich zum Prototyp gehe, verbinde ich ihn hier und klicke auf Ja. Jetzt habe ich diese Option auch hier. Okay, ich kann einfach einen von hier löschen. Ich habe diese Option hier. Wie Sie sehen können, habe ich hier jetzt eine Beleuchtung. Ich werde einfach hierher gehen. Gehe zur Hauptseite und klicke darauf. Hier kannst du sehen, dass es wie eine Folie aussehen wird . Ich hoffe ihr habt dieses Tutorial auch verstanden. Okay, wie man intelligent animieren kann. Ich habe euch die Option gezeigt, wie ihr euer Ding tatsächlich intelligent animieren könnt Wie du deinen Frame duplizieren kannst. Und das alles hier in diesem Tutorial. Im nächsten Kurs werden wir lernen, wie wir teilen können und wie Sie mitmachen können. Sie können es mit Ihrem Kunden oder mit Ihren Teammitgliedern teilen und gleichzeitig in einer Live-Oberfläche arbeiten. Ich hoffe, wir sehen uns alle im nächsten Tutorial. Kümmere dich um jeden Wunsch. Auf Wiedersehen. 9. Nützlichkeit des Teilens und Hinzufügens von Kommentaren: Hallo zusammen und willkommen zu einem weiteren Tutorial in Figma Also hier sind wir jetzt in unserem Kapitel Nummer acht. Und unser Kapitelname ist nützlich, wenn es darum geht, Kommentare zu teilen und hinzuzufügen Hier in diesem Kurs werden wir also lernen, wie wir grundsätzlich teilen können Ich weiß, dass ihr die Grundlagen des Teilens bereits kennt, aber hier geht es in diesem Kurs ausführlich um das Teilen und darum, wie hilfreich es ist , einen Kommentar für andere Teammitglieder hinzuzufügen , während ihr an einem Lebensprojekt arbeitet. So wie ihr gleichzeitig zusammenarbeiten könnt, könnt ihr sehen, was euer anderes Teammitglied macht. Ihr könnt einen Kommentar hinzufügen. Lade sie ein. Ich werde Ihnen allen hier in diesem speziellen Kurs ausführlich zeigen diesem speziellen Kurs ausführlich Kommentare teilen und hinzufügen können. Verschwenden wir also keine Zeit und beginnen wir mit dieser speziellen Klasse. Also nochmal, wir sind auf der Homepage von Figma, wie Sie sehen können Und jetzt hier, da ich dir bereits gesagt habe , was wir lernen werden Ich werde in diesem speziellen Projekt wieder hierher kommen. Okay, und nehmen wir an, ich möchte es jetzt mit meinem Kunden oder meinen Teamkollegen teilen es jetzt mit meinem Kunden oder meinen Teamkollegen Okay, in diesem Fall habe ich euch die Grundlagen dessen gegeben, was getan werden kann Also hier klicke ich einfach auf Teilen. Dann nehmen wir an, ich möchte hier eine E-Mail-Adresse angeben. Ich gebe einfach eine E-Mail-Adresse an. Ich klicke auf diesen. Hier siehst du, wie ich eine E-Mail-Adresse ausgewählt habe, was sie damit machen können, können sie sich diese ansehen oder sie auch von hier aus bearbeiten? Okay, wer wird alle Zugriff auf diese spezielle Sache hier haben? Okay. Hier kann ich nur Personen sagen, die zu dieser Datei eingeladen wurden, was ich von hier aus tun muss. Ansonsten kann ich einfach hier klicken. Jeder mit dem Link. Wenn es sich bei dieser Datei um eine geheime Datei handelt, kann ich in diesem Fall nur diese auswählen, also nur Personen, die zu dieser Datei eingeladen wurden Aber wenn es sich um diese Datei handelt, möchte ich diesen speziellen Link auswählen und diesen kopieren und an ihr Wort, Sap oder Messenger senden ihr Wort, Sap oder Messenger Ich kann es von hier aus machen, okay. Und ob sie bearbeiten können oder nur ansehen können, nehmen wir an, ich möchte meinem Kunden nur den Link schicken , über den er nur ansehen kann. Okay, in diesem Fall kann ich für meine Teamkollegen, die ich einladen werde , auf diese Option klicken für meine Teamkollegen, die ich einladen werde , auf diese Option Das werde ich, sie können auch bearbeiten. Also kann ich diese beiden Dinge hier haben. Ich kann auch eine kurze Nachricht für sie hinzufügen, für diejenigen, die ich alle einlade. Also schreibe ich, dass du mir am Ende helfen musst dieses Projekt zu beenden. Also habe ich ihnen einfach eine Nachricht gegeben. Mit wem ich alles teile. So kann ich ihnen einfach eine Nachricht geben und ich kann ihnen eine Einladung schicken. Okay, hier, wenn ich drei oder vier Teammitglieder hier habe, kann ich wählen, wer nur sehen kann, wer der Besitzer ist und wer bearbeiten kann. Okay, in dem Fall kann ich von hier auswählen, ich kann einfach den Link kopieren. Wie Sie sehen können, wird dies in meine Zwischenablage kopiert , da ich diese Seite hier habe und ich bereits eine E-Mail ausgewählt Also schicke ich ihnen einfach eine Einladung. Okay, von hier aus kann ich sie einladen. Sie können sehen, dass ich sie gerade hierher eingeladen habe. Wenn ich meine spezielle Arbeit, die ich gemacht habe, veröffentlichen möchte , kann ich hier auf Veröffentlichen klicken und ich kann dieser Arbeit einfach einen Namen geben und eine Beschreibung geben. Wenn ich verschiedene Arten von Tags verwenden möchte, kann ich verschiedene Arten von Tags verwenden. Wenn ich einen Prototyp daraus machen möchte, kann ich einen Prototyp daraus machen. Oder wenn ich es zu einer Datei machen möchte, kann ich es auch zu einer Datei machen. Welche Vorschau werden sie bekommen. Okay, wenn ich Prototyp wähle, kann ich den Bildschirm, die tatsächliche Größe oder 100% ausfüllen . Ich kann auch ein Vorschaubild für meine Prototyp-Klasse hochladen, und hier sind einige erweiterte Optionen Wer ist der Ersteller, die Lizenz und auch die E-Mail-Adresse Okay, ich werde kein sein, also werde ich das einfach stornieren. Kommt her und lasst mich euch zeigen , wie ihr tatsächlich arbeiten könnt. So viele von Ihnen können auf derselben Registerkarte arbeiten. Ihr könnt gemeinsam bearbeiten oder live gestalten. Okay, ich gehe einfach wieder her. Ich gehe einfach zu dieser E-Mail. Ich gehe zu. E-Mail von hier, ich nehme hier einfach eine weitere E-Mail entgegen. Sie können sehen, dass ich eine Einladung habe. Sobald ich auf diese klicke, werde ich weitergeleitet. Okay? Wie Sie sehen können, funktioniert diese spezielle Datei auf Figma Ich werde das einfach schließen, da ich schon hier bin. Wie Sie sehen, habe ich diesen auch. Okay, ich bin hier, um es euch besser zu zeigen. Hier kannst du in dieser Datei sehen, wenn ich komme, minimiere das. Also hier kannst du sehen, sobald ich mich auf diesem Bildschirm bewege, die Maus hier, kannst du sehen, was der Editor macht. Und nehmen wir an, ich möchte die Farbe von all dem hier ändern . Was ich tun kann, ist, dass ich herkomme und bearbeite. Und ich suche mir einfach eine Farbe aus. Und jetzt möchte ich diese Farbe hier einfügen, okay. Oder ich möchte die gesamte Seitenfarbe auf Schwarz ändern. Wie Sie sehen können, hat sich das geändert, als ich diese spezielle Sache hier auf dieser Seite gemacht habe, auch auf meiner anderen Seite , da ich ihm auch die Erlaubnis zur Bearbeitung gegeben habe . Er kann es gleichzeitig tun. Das ist ziemlich interessant. Damit kann ich auch alle Einstellungen ändern. Angenommen, ich will es in 50 haben. Ich klicke hier auf Enter, Sie können sehen, dass beide Seiten gleich aussehen. Okay? Da ich von hier aus alles machen kann. Okay, aus diesem Design wähle ich hier eine bestimmte Box aus. Angenommen, ich wähle dieses spezielle Feld aus. Jetzt möchte ich den Strich ändern. Okay, ich möchte den Strich auswählen und ich werde den Strich dieser Box hier ändern. Sie können sehen, dass sich die Änderung in meinem Feld befindet. Und ich kann wieder hierher kommen und die Strichfarbe in etwa so ändern . Okay, etwas in dieser Farbe. Behalte den hier. Und klicken Sie auf Okay. Hier können Sie sehen, wie sich beides hier geändert hat. Wenn ich nur im Vollbildmodus heranzoomen würde, diesen mit Y bewegen müsste, musste ich hierher. Ihr könnt sehen, dass ich auch hier arbeite. Und ich kann auch sehen, was mein Partner arbeitet. Okay, ich nehme an, ich möchte einen Kommentar hinzufügen. Okay, wenn ich hier einen Kommentar hinzufüge, nehme an, Teil hier. Was ich dann tun werde, ist, diesen Rahmen zu nehmen und ihn direkt neben diesen zu legen. Mit meinem Handwerkzeug kann ich mich bewegen und sehen, was es ist. Okay. Da ich hier mit demselben Laptop bin, beide, dann ist es ziemlich schwierig, das zu tun. Aber ich hoffe, ihr versteht, was ich versuche euch verständlich zu machen, zum Beispiel, wie ihr zusammenarbeiten könnt, wie ihr auch arbeiten könnt. Angenommen, ich möchte einen Kommentar hinzufügen und ich möchte sagen, ich ändere die Form der Box Rechteck, ohne den Eckenradius zu ändern in ein Rechteck, ohne den Eckenradius zu ändern. Von hier aus kann ich tatsächlich sagen, ich kann sie erwähnen, wenn ich sie richtig finde, oder ich kann sie entsprechend erwähnen. Okay, wenn ich sie erwähnen möchte, kann ich sie so erwähnen, wie ich ihn erwähnen möchte, ich gebe einfach auch ein Emoji Wenn ich das hier einreiche, werden sie darüber informiert, dass ich eine Nachricht gesendet habe Okay, schauen wir uns das mal an. Wie Sie hier sehen können, habe ich meine Nachricht bereits. Welche Botschaft ist das hier? Die Nachricht oder das Kommentarfeld Außerdem werde ich benachrichtigt, dass ich eine Nachricht für mich habe. Okay. Hier. Sobald ich diesen öffne und die Nachricht sehe, dass er mir sagt, ich solle die Form der Box ändern, ohne den Eckradius zu ändern, mache ich das von hier aus. Und wir können so zusammenarbeiten. Wenn ich diese bestimmte Sache oder dieses spezielle Problem, das mir gesagt wurde, bereits gelöst diese bestimmte Sache oder dieses spezielle Problem, habe, kann ich auf Auflösen klicken. Aber hier möchte ich nichts ändern. Nur um euch die Verwendung der Option zum Teilen und auch der Kommentaroption zu zeigen , zum Beispiel, wie wichtig das ist, wenn wir in einer Gruppe arbeiten. Nehmen wir an, ich habe so viele Seiten für einen bestimmten Frame oder eine bestimmte Seite, dass ich die Arbeit auch für sie aufteilen kann. Nehmen wir an, ich klicke einfach auf diesen bestimmten Rahmen hier in diesem Feld. Jetzt möchte ich das teilen und ich möchte ihm sagen, dass Sie an dieser speziellen Datei arbeiten nur an dieser speziellen Datei arbeiten, weil ich sie einfach anklicken kann. Wie Sie sehen können, ist das jetzt mit der Auswahl verknüpft, und ich werde einfach hier ein Häkchen setzen. Von hier aus kann ich sie tatsächlich wieder einladen und sie können anfangen, daran zu arbeiten. Dies ist eine weitere Funktion, die von Figma als benutzerfreundlichere Option angeboten wird benutzerfreundlichere Option Jetzt hoffe ich, dass ihr verstanden habt, wie ihr eure Datei teilen und einen Kommentar hinzufügen könnt ihr eure Datei teilen und einen Kommentar hinzufügen und wie hilfreich das für uns ist Ich hoffe, wir sehen uns alle im nächsten Tutorial, in dem wir lernen, wie Sie Spalten und Noten in Ihrer Figma-Datei verwenden können Ich hoffe, wir sehen uns alle im nächsten Tutorial. Das nächste Tutorial ist hilfreich. Ich hoffe, ihr könnt euch am Ende dieses Tutorials selbst bewerben. Kümmere dich um alle und wir sehen uns in der nächsten Klasse. 10. Säulen und Raster: Hallo zusammen und willkommen zu einem weiteren Tutorial in Figma hier Dies ist das neunte Kapitel und wir werden etwas über die Spalten und Gitter lernen In diesem Kurs lernen wir, wie Sie die Spalten und das Raster verwenden können Wie Sie die Farbe, die Intensität und die Spaltenrinne ändern können Intensität und die Spaltenrinne Ich werde euch auch sagen, was das ist. Auch, wie Sie dies verwenden und eine Größe ermitteln oder sich ein Bild davon machen können , wie Sie Ihre Webseite gestalten können. Verschwenden wir keine Zeit, fangen wir mit diesem Tutorial an. Jetzt bin ich hier an meinem Arbeitsplatz oder an dem Ort, an den ich im Grunde jetzt gehen werde. Zuerst erstelle ich einen Rahmen. Hier könnt ihr sehen , wie man einen Rahmen erstellt Ich werde im Grunde Ebenen oder zwei Seiten erstellen, eine davon für den Desktop. Dafür habe ich eine Standard-Desktop-Größe, aber ihr könnt auch recherchieren und herausfinden , welche Desktop-Größe am häufigsten verwendet wird. Desktop, für den Sie diese Datei im Grunde verwenden. Ich nehme einfach eine bestimmte Größe, nämlich 1.440 im Jahr 2024. Ich nehme das Und hier kannst du sehen, dass ich diesen Rahmen habe , den ich gerade aus dem Bezirk ausgewählt Okay. Ich habe den Text von einem hier. Jetzt werde ich auf die gleiche Weise einen weiteren Frame erstellen, aber auf einer anderen Seite. Okay. Ich füge einfach eine weitere Seite hinzu. Ich nenne das, ****, diese oberste Seite. Ich nenne das als mobile Seite. Ich habe diesen hier. Auch hier werde ich versuchen, einen Rahmen zu erstellen. Und ich werde es aus meinem Gebot übernehmen. Auf welcher Seite sollte ich stehen? Ich nehme es für Telefon 14 Pro Max. Ich werde hier auf diesen klicken. Ihr könnt sehen, dass ich meinen Rahmen hier habe. Okay. Was ich hier tun möchte, ist, ein paar Kolumnen einzufügen. Okay, hier direkt unter dem automatischen Layout sehen Sie eine Option namens Layoutraster. Was ich tun werde, ist, hier auf diese Plus-Seite zu klicken . Wie Sie hier sehen können, habe ich zwar ein Raster, aber für mich möchte ich kein Raster, ich möchte hier ein paar Spalten haben. Ich habe die Layer-Grid-Einstellungen direkt auf der linken Seite und ich klicke hier. Anstelle des Rasters wähle ich hier Spalten aus. Nachdem ich hier die Spalte ausgewählt habe, können Sie sehen, dass die Anzahl 12 beträgt. Aber für mich ist es fünf. Aber ich möchte 12 12, weil dies die Standardgröße oder die Spaltengröße, Spaltenanzahl für die meisten Grafikdesigns ist. Ich möchte nur die Standardeinstellung verwenden. Wenn ich einige Farben ändern möchte, kann ich diese Farben auch von hier aus ändern Okay, ich kann das alles von hier aus tatsächlich vergrößern oder verkleinern das alles von hier aus wenn ich die Breite und die Höhe ändern möchte. Und hier kannst du die Dachrinne sehen. Dachrinne, im Grunde der Abstand zwischen den beiden Spalten. Okay, hier, dieser männliche Teil , der weiß ist, wird hier Dachrinne genannt Wenn ich die Größe erhöhe, nehmen wir an, ich würde 40 angeben, dann können Sie von hier aus sehen, wie sich das geändert hat die gleiche Weise, wenn ich sie einfach auf zehn reduziere, können Sie sehen, dass sie sich geändert hat. Von hier an hat es abgenommen. Ich kann auch wählen, wie meine Kolumne aussehen soll. Möchte ich sie links, rechts in der Mitte haben oder möchte ich, dass sie sich über meine gesamte Seite erstreckt. Das ist das beste Format. So wie ich auf der mobilen Seite hierher komme, komme ich zu meinem Layer-Grade. Wenn ich auf diese Plus-Option klicke, wähle ich die Spalten von hier aus. Auch hier nehme ich 12. Diese zehn. Bei diesem werde ich es einfach auf Trab halten. Okay. Von hier aus kann ich auch die Intensität der Farbe ändern, wenn ich nehme. 50 hier, du kannst sehen, wie tief meine Farbe wird. Ich möchte nur, dass die Farbe verblasst. Und es wird gut aussehen, wenn ich auch irgendeine Art von Animation oder so einfüge Jetzt werde ich mehr Frames erstellen. Nehmen wir an, ich werde zum einen hier einen Frame erstellen. Ich habe hier einen Rahmen. Okay. Ich nehme auch noch einen von hier. Okay? Ich fülle das einfach mit einer tiefen Farbe. Ich nehme etwas Dunkles. Okay, ab hier. Dieser wird die Kolumne hier sein. Ich werde einen weiteren Rahmen erstellen. Von hier aus werde ich den Hauptteil übernehmen. Von hier aus werde ich mich einfach so weit bewegen. Okay. Ich habe meinen Rahmen auch hier. Ich nehme hier noch ein kleines Bild. Okay, wähle das aus. Ich wähle diesen aus. Ich werde diese Ebene hier duplizieren. Ich nehme das einfach auch hierher. Auch hier. Jetzt habe ich diese vier Spalten. Ich kann auch einige Farben hinzufügen, wenn ich möchte. Nehmen wir an, ich möchte hier eine andere Farbe verwenden. Nehmen wir an, ich will es dunkelschwarz haben. Ich möchte diesen hier auch in einer anderen Farbe verwenden. In dem Fall nehme ich vielleicht etwas in Grün. Ich werde auch hier sein. Eine andere Farbe. Ich wähle einfach meine Farbe entsprechend aus. Rot hier, in Blau. Hier, irgendwas drin, ja, das ist in Ordnung. Hier wird das Layout genauso sein. Ich komme zur nächsten Seite. Von hier aus werde ich ein Bild machen. Von hier aus wähle ich Schwan. Danach werde ich hier eine Hauptseite erstellen. Das wird die Leiche sein. Angenommen, ich möchte eine Broschüre oder einen Flyer erstellen. Ich kann von hier aus so beginnen. Okay. Jetzt werde ich von hier aus vier weitere Boxen erstellen. Erstelle von hier bis da eine Box mit meiner alten. Ich werde das einfach kopieren. Welches alte Exemplar hier? Ich habe hier vier Boxen. Alle vier Boxen. Wenn ich versuche, auf einmal auszuwählen, nehme ich an, ich möchte nur diese bestimmten Frames auswählen. Von hier aus kann ich auf das, das und das klicken. Jetzt werde ich ihre Farbe entsprechend ändern , wie ich es möchte. Okay, nehmen wir an, ich gebe ihnen diese Farbe, aber ich ändere hier die Deckkraft der Farbe. Ihr könnt es sehen, ich kann es auch so ausrichten, wie ich will Jetzt sind die vier Frames verbündet. Ich werde auch hier eine Farbe hinzufügen, diese Ebene hier. Ich werde hier eine andere Farbe für diese spezielle Ebene hinzufügen. Sie können sehen, dass ich das mit dem Grün erstellt habe. Sie werden wissen , ob die Idee im Mittelpunkt steht oder nicht. Ich habe diese Ebene von hier aus für diese mobile Seite erstellt . Außerdem habe ich eine bestimmte Größe, die ich bevorzuge oder bevorzuge. Ich kann die Arbeit auch von hier aus erledigen, von hier aus. Lassen Sie mich Ihnen noch einmal zeigen , wenn ich hierher komme, wählen Sie diesen Rahmen hier aus. Ich habe 12 Spalten. Okay, was ich jetzt tun möchte, ist, Ränder hinzuzufügen. Okay? Nebenbei. Ich möchte auch Ränder hinzufügen. Und warum wir Seitenränder hinzufügen, liegt im Grunde daran, dass wir, wenn wir eine Webseite oder eine App-Seite für Mobilgeräte erstellen, manchmal nicht möchten die wichtigsten Dinge oder das Hauptthema an den Seiten stehen. Okay, im Grunde genommen, um sie in die Mitte zu bringen, wir haben bei der Verwendung dieser Spalte eine gute Idee , wo wir das bestimmte Ding platzieren sollen. Im Grunde verwenden wir dafür all und lassen uns die Marge von hier aus erhöhen. Okay, lass mich zehn nehmen. Und wenn ich auf Okay klicke, gibt es keinen großen Unterschied , den ich euch zeigen könnte. Ich nehme hier etwa 19. Sie können sehen, das sind die Ränder hier an den Seiten, das weiße ****** Das ist der Rand und das ist der Hauptarbeitsbereich für das Telefon Nehmen wir an, ich arbeite hier nur an diesem speziellen Teil und bearbeite ihn, oder ich übernehme das Design hier in diesem speziellen Teil. Wenn ich danach denke, okay, ich muss nur diese Seiten abschneiden, dann kann ich auch die abschneiden. Dies ist auch eine Vorsichtsmaßnahme, die sehr hilfreich ist und bei der Arbeit sehr praktisch sein kann Lassen Sie mich noch einmal zurückgehen, zurück zu unseren 12. Nimm das nochmal her. Ich hoffe ihr habt das verstanden. Ich habe euch von der Dehnung erzählt und ihr wisst bereits über die Färbung Bescheid. Okay. Wenn ich auf diese Textseite gehe, habe ich hier jetzt 12 Spalten, genauso. Ich wähle einfach all diese von hier aus. Dieser. Jetzt kann ich einfach darauf klicken und diesen auf zehn ändern. Klicken Sie auf Enter. Wenn Sie mich fragen, was die perfekte Größe für eine Dachrinne ist? Es gibt grundsätzlich keine Größe , die Sie angeben möchten, oder eine beliebige Zahl, aber dafür können Sie etwa 50 bis 20 angeben Das ist ziemlich normal und kann hier verwendet werden. Wenn ich euch den Rand zeige, okay, wenn ich 60 hier drauflege, könnt ihr an den Seiten sehen, ich habe auch die Ränder, okay? Also kann ich meine Arbeit auf dieser Seite ausschließen und alleine an diesem Ding arbeiten. Lass mich einfach zurückgehen und das machen, da ich hier 12 habe. Wenn ich es hier auf sechs reduzieren will, habe ich sechs. Okay. Ich kann auch hier arbeiten. Ich muss nur sicherstellen, dass ich alle meine Sachen richtig ausrichte alle meine Sachen richtig Okay. Wenn ich das hier auf diese Seite lege, müsste das hier irgendwo sein. Dieser weiße hier auf der Website. Das kann ich hinstellen. Ja. Das sieht im Grunde gut aus. Dies ist eine der Möglichkeiten, wie wir eine Webseite tatsächlich so gut ausrichten können . So können wir. Lass mich eine weitere Seite erstellen, auf der ich euch zeige, dass ich es nur als Raster mache. Ich erstelle einen Rahmen oder ich nehme einfach ein Preset von hier. Lassen Sie mich einen Desktop oder ja, eine Desktop-Voreinstellung nehmen. Wenn ich hier auf diese Layoutgrad-Option klicke, kannst du hier sehen, dass ich den Layoutgrad habe. Von hier aus kann ich die Standardeinstellung ändern . Im Grunde genommen sind es acht bis zehn. Bei den Android- und Apple-Telefonentwicklern, Anwendungsentwicklern, machen sie normalerweise diese Größe, okay? Aber wenn Sie für ein Unternehmen arbeiten, arbeiten Sie daran, Ihre eigene Anwendung zu erstellen. Es basiert im Grunde auf Ihren Bedürfnissen, okay? So wie Sie möchten, können Sie sich tatsächlich an so viele UX-Designer für Benutzeroberflächen wenden . Es ist nicht so, dass Sie ein Programmierer sein müssen , um ein UX-Designer zu werden Sie können mit Basic beginnen, es lernen und dann Ihre Arbeit auf fortgeschrittenem Niveau anwenden Oder Sie können auf einer höheren Ebene arbeiten , wo Sie Ihre Arbeit an Ihren Kunden weiterleiten. Sobald Sie beim Entwerfen gute Arbeit geleistet haben, können Sie von hier aus gutes Geld verdienen. Wie Sie sehen können, kann ich auch die Farbe ändern. Hier gilt dasselbe die Rose, so wie ich es dir gezeigt habe. Kolumnen. Die Reihen auch, es wird so kommen. Das Gleiche gilt für die Spalten. Ich werde euch das nicht im Detail erklären, aber hier könnt ihr einfach so arbeiten und verschiedene Formen entsprechend anpassen. Okay? Siehst du, wie du siehst, wenn ich zur Seite gehe, sehe ich ein rotes Licht, das anzeigt, wenn ich nach draußen gehe. Okay, das sollte ich auch im Hinterkopf behalten. Hier kannst du das sehen. Außerdem kann ich verschiedene Größen erstellen. Wenn ich nur rauszoome, kann ich euch meine Arbeit hier zeigen. Ich hoffe ihr habt diesen Kurs über Spalte Grün und Rose verstanden , da er mit der Verwendung von Spalte ziemlich ähnlich ist. Ich hoffe, ihr wisst, wie nützlich Spalten und Grün wie es euch beim Design hilft Ich hoffe, wir sehen uns alle. Im nächsten Tutorial erfahren Sie, wie Sie grundsätzlich auf Ihrer Webseite oder in Ihrem Design erstellen oder verwenden Farben grundsätzlich auf Ihrer Webseite oder in Ihrem Design erstellen oder verwenden können. Was sind zum Beispiel die verschiedenen Möglichkeiten, deine Farbe zu verwenden? Je mehr Farbe oder Balance wir bekommen, desto besser. Unsere Webseite wird dort suchen. Wir werden etwas über die Inspiration, die Pipette und darüber erfahren, wie Sie im Grunde auch eine Farbpalette erstellen können Danach erfahren wir auch, wie Sie Farbverläufe erstellen können Abschließend erkläre ich euch, wie ihr Farbstile erstellen und verwenden könnt Insbesondere die Anwendung, damit Ihre Webseite so attraktiv aussieht , und ich hoffe, Sie alle in der nächsten Klasse zu sehen. Kümmere dich um alle. Auf Wiedersehen. 11. Farbinspiration, Farbpalette und Pipette-Tool: Hallo zusammen und willkommen mich alle zu einem weiteren Tutorial In diesem Kurs werden wir lernen, woher Sie sich all Ihre Farbinspirationen holen können Ich zeige euch zum Beispiel die Websites denen ihr passende Farben finden könnt. Was für Ihre Webseite- oder App-Entwicklung verwendet werden soll. Okay, danach werde ich euch zeigen , wie ihr eure eigene Farbpalette erstellen könnt. Und auch über das Eyedropper-Tool. Angenommen, Sie haben ein Bild oder ein anderes Bild und möchten von dort aus die Farben entfernen, die für Ihre Webseite oder Ihr UI-Design verwendet werden Ihre Webseite oder Ihr UI-Design Ich werde euch zeigen, wie ihr diese speziellen Farben von dort übernehmen könnt , und auch einige der Websites vorstellen. Lasst uns keine Zeit verschwenden und lasst uns mit diesem Kurs beginnen . Hier könnt ihr sehen, dass ich wieder auf meiner Homepage bin. In der letzten Klasse habe ich euch gezeigt, wie ihr das Raster und die Spalte hier verwenden könnt das Raster und die Spalte hier verwenden Ich werde dasselbe verwenden, nur diese Farben. Ich werde euch sagen, ob ihr Farben in eurer Arbeit oder in eurem Projekt kombinieren möchtet eurer Arbeit oder in eurem Projekt woher ihr euch diese Inspiration holen werdet. Ich werde euch auch sagen, wie ihr es tatsächlich verwenden könnt. Ich lasse es fallen, um zum Beispiel, wie wir Farbe von einem bestimmten Bildschirm oder einem Objekt extrahieren und sie dort ablegen können Farbe von einem bestimmten Bildschirm oder einem , wo immer ihr wollt. All das werden wir in diesem Kurs lernen. Ich werde euch auch zeigen, wie wir Vorlagen erstellen können , wie ich es euch bereits gesagt habe. Lass uns hier anfangen. Ich habe die letzte Klassenfolie. Ich ziehe einfach ein bisschen nach hinten aus. Ich werde euch jetzt ein paar Websites zeigen, von denen ihr eure Farbe bekommen könnt. Dies ist der erste, der Autobl. Der andere ist Color.com okay? Hier können Sie von hier aus viele Farbkombinationen sehen. Welche Farbe du auch magst, du kannst sie einfach nehmen. Und von hier aus können Sie auch sehen, dass wir wissen, wie man einen Code eingibt Wenn ich von hier komme, kann ich einfach diesen speziellen Code eingeben. Angenommen, ich mag diese Farbe von hier. Okay, dieser. Okay, dafür habe ich gerade darauf geklickt und es wurde kopiert Ich komme einfach auf meine Fima-Seite und wähle. Ich werde einfach Enter einfügen. Ihr könnt auf dieser Seite sehen , dass ich diese Farbe habe. Ebenso möchte ich die Farbe ändern, wenn ich diese hier auswähle . Ich kann es genauso machen, aber im Moment möchte ich die Hintergrundfarbe nicht verwenden. Es sieht ziemlich hässlich aus. Ich gehe einfach zurück, hier bin ich wieder mit meinem weißen Hintergrund hier. Dies sind einige der Websites, auf denen ich diese Farbfarben auswählen kann, und auch das Ganze von hier aus. Angenommen, ich möchte das Ganze einfügen. Ich kann auch diese nehmen, um mir ein gutes Bild zu machen. Das können wir gebrauchen. Okay, hier können Sie einige der beliebtesten Farben sehen , die verwendet werden. Hier können wir Farben für unser Projekt auswählen. Hier können Sie die beliebte Farbe des Monats des Jahres und auch die beliebtesten Farben aller Zeiten sehen. Okay, hier habe ich eine zufällige Farbsammlung. Okay? Es gibt keine Paletten in der Sammlung, da ich welche hinzugefügt habe, aber ich kann sie von hier aus hinzufügen Okay, wenn ich hier nur eine Farbe haben möchte, kann ich dieses spezielle Bild herunterladen Und hier kannst du sehen, dass es heruntergeladen wurde. Okay. Jetzt kann ich diese spezielle Farbe von hier aus nehmen und sie einfach in meiner Arbeit verwenden. Okay. Die nächste Website, die Color.com hier, ist eine weitergehende Farbinspiration dazu Okay, von hier aus können wir das Farbrad sehen. Hier habe ich all diese Farben. Ich kann es nach meinen Bedürfnissen neu einstellen. Wenn mir etwas daran gefällt, zeigen sie mir die Farbverläufe, welcher passt gut zu welcher Farbe Hier kann ich diese speziellen Dinge rausbringen , wie du siehst Und ich kann auch auswählen, welche Farben ich haben möchte. Wenn ich die Primärfarben erforschen möchte, kann ich auch die Primärfarben erkunden. Angenommen, ich möchte das mitnehmen oder zu meiner Bibliothek hinzufügen. Ich kann einfach hier klicken. Dieser wurde meiner Bibliothek hinzugefügt. Wenn ich ein JPEG herunterladen möchte, kann ich das JPEG auch von hier herunterladen. Nur um diese Farben zu sehen. Dies sind einige der Dinge. Warum geht diese Farbe weiter? Nun, hier siehst du ein Bild hier oben, okay, da haben sie die Farbkombination gezeigt , wie es in deiner Arbeit aussehen wird. Das Gleiche gilt hier, da Sie das Bild sehen und sehen können , wie es zusammenpasst. Wenn ich danach auch hier zur Option Trends gehe, könnt ihr sehen, welche Farben gerade im Trend sind Für das Grafikdesign sind diese Farben für die Mode sehr hilfreich Diese Farben sind eine hilfreiche Veranschaulichung für das UX-Design von Benutzeroberflächen. Welche Farben sie hauptsächlich für architektonische Dinge verwenden, für das Spieledesign, für den Geschmack der Wildnis, wir können sie hier auswählen. Es ist nicht so, dass, wenn diese Farben nur für das Design der Benutzeroberfläche verwendet werden, das heißt nicht, dass ich auch aus dieser Farbe wählen muss . Angenommen, ich mag etwas aus diesen Farben. Ich kann all diese Farben auch einfach herunterladen. Okay. Wenn ich etwas in meiner Bibliothek speichere, kann ich es mir von hier aus ansehen. Dieses ist ein ziemlich nettes Farbthema in meiner Bibliothek. Ich habe diese beiden Farbthemen. Okay, wenn ich wieder hierher komme, wenn ich versuche, das zu entfernen, könnt ihr sehen, dass ich die Farbe haben werde, lasst mich sie sehen, in einem moto-chromatischen Raum Hier seht ihr die Farbpalette. Wenn ich diese Farbe speichere, wird diese Farbe hier erfolgreich zu meiner Bibliothek hinzugefügt. Du kannst sehen, okay, wenn ich das sehen will, probiere es aus, wie es aussehen wird. Komplementär, aufgeteilt. Komplementär. Die doppelte Aufteilung. Ich mag diesen Optionen-Vorteil nicht, aber ihr könnt ihn auch benutzen. Das sind verschiedene Farbnuancen. Mal sehen, wie wir diese Farbe hier verwenden können. Angenommen, ich komme hierher und möchte ein Bild von hier platzieren. Wie Sie bereits sehen können, habe ich hier auch ein Farbrad. Lass mich einfach dieses Farbrad hier oben anbringen, bring es rein. Also hier habe ich das Farbrad. Und nehmen wir an, ich habe meine spezielle Arbeit hier. Okay, ich wähle diesen, behalte ihn in einer Ecke. Ich werde dieses Farbrad und meine verschiedenen Themen hier behalten . Gleich nebenan komme ich zu den Downloads und wähle diese drei aus. Und ich werde hier eröffnen. Sie können sehen, dass ich einen hier habe und noch einen hier. Okay. Und ich werde die Größe hier eins nach dem anderen verringern. Ich habe eine Reihe von Farben, die ich verwenden kann. Ich zoome einfach ein bisschen heraus, da das hier ist. Ich habe auch diese Farben. Ich habe das auch. Ich nehme an, ich möchte hier die Farbe meiner Boxen ändern , okay? Und stellen Sie immer sicher, dass Sie Ihre Farben auf einer Seite haben , damit Sie bei der Arbeit an Ihrem endgültigen Projekt nicht durcheinander geraten . Okay, ich habe das alles hier, okay? Ich möchte diese Dinge von hier aus animieren. Was ich tun werde, ist, wenn ich diese auswähle, komme ich gleich hier unten zu dieser Farboption Ich werde einfach hier klicken. Dies ist das Eye Dropper Tool. Okay, nehmen wir an, ich möchte die Farbe von hier aus ändern und habe das Pipette-Werkzeug ausgewählt. Hier können Sie eine bestimmte Farbe sehen. Ich habe diese spezielle Kiste. Sobald ich hier eine Farbe ausgewählt habe , wird diese bestimmte Boxfarbe geändert. Lassen Sie mich diese Farbe nehmen und dieses Feld hier auswählen. Jetzt möchte ich auch diese Boxfarbe auswählen. Dafür doppelklicke ich oder klicke einfach hier mit meiner Farbe oder dem Pipette-Werkzeug. Ich werde diese spezielle Farbe für die Boxen auswählen. Ich werde von hier aus eine Farbe auswählen. Dafür, nochmal, das, davor wähle ich dieses Kästchen aus. Ich lasse ihr Tool Select fallen. Etwas im Dunkeln. Nochmal, ich falle auch um. So können Sie tatsächlich die gewünschte Farbe auftragen. So können wir hier auf dieser Seite etwas arbeiten. Das ist ein einfacher Weg, wie du deine Website fertigstellen kannst und du wirst nicht verwirrt sein, dass du eine gute Vorstellung davon hast , welche Farben du hast und was alles hier in deinem speziellen Projekt verwendet werden kann , okay? Vorher müssen wir nur sicherstellen, dass die Webseite so aussieht, wie meine Bewerbung aussehen wird. Dementsprechend könnt ihr diese Farben verwenden. Angenommen, Sie haben eine Reihe von Farben, möchten diese aber nur ändern. In diesem Fall können Sie hier sehen, Sie können die Deckkraft von hier aus wählen Außerdem habe ich diese Option direkt oben hier. Von hier aus können Sie sich diese Farben tatsächlich so ansehen , wie Sie möchten. Ich gehe einfach zurück. Ich werde euch auch zeigen, wie wir tatsächlich eine Farbpalette erstellen können . Okay, ich nehme an, ich habe die Farbsets hier. Okay, was ich tun werde, ist ein paar rechteckige Boxen zu nehmen. Zuerst nehme ich dieses kleine rechteckige Feld, kopiere dieses, kopiere dieses andere, kopiere das auch. Ich habe hier vier Boxen mit meiner Pipette. Ich komme her und nehme diese besondere Farbe. Ich möchte, ich habe diese Farbe jetzt hier in meiner Box. Ich möchte verschiedene Farbtöne dieser bestimmten Farbe kreieren . Ja, ich glaube, ich werde einfach auch diesen löschen, und das auch. Jetzt werde ich dieses spezielle Feld von hier kopieren. Wie Sie sehen können, habe ich nach dem Duplizieren diese Farbe auch hier Von hier aus sehe ich den Farbton, den ich haben möchte. Ebenso kann ich eine weitere Box erstellen. Jetzt wird diese Farbe hier in meine Filmbox kopiert. Außerdem habe ich dieselbe Farbe. Jetzt kann ich von hier aus einen anderen Farbton wählen. Auch hier werde ich einfach den Vorgang fortsetzen wie viele Farbtöne dieser bestimmten Farbe Sie möchten. Jetzt gehe ich hier einfach zu einer leichteren Version über. Ich habe eine bestimmte Farbpalette, wie Sie sehen können. Okay. Genauso, wenn ich eine bestimmte Palette für dieses Braun erstellen möchte. Okay, es ist braun. Ja, ist es, aber etwas Hellbraunes und nicht wirklich Dunkles. Es ist irgendwo in der Mitte. Genauso nehme ich meine rechteckige Schachtel. Ich werde hier eine rechteckige Box erstellen. Füge mit diesem eine beliebige Farbe hinzu. Oder nehmen wir an, ich nehme etwas in Blau. Okay, nehmen wir Grün. Okay, ich habe dieses Grün hier. Jetzt komm her und kopiere die Box noch einmal. Von hier aus kann ich einen anderen Farbton dieses Grüns wählen. Kopiere diesen und ändere auch den Farbton von hier aus. Okay, jetzt habe ich ein bisschen heller und klicke bei A erneut auf Shift. Okay, ich komme her und nehme jetzt eine weitere hellere Version dieser Farbe. Hier habe ich euch gezeigt, wie ihr eine Farbpalette erstellen könnt. Wenn ihr diese bestimmte Farbe speichern wollt, könnt ihr das speichern. Angenommen, ich möchte das speichern oder auf eine andere Seite kopieren. Ich werde hier auf diese Seite kommen, ich werde das hier einfügen. Von hier aus kann ich die Größe dieses Artikels tatsächlich verringern. Aber auch hier kannst du sehen, dass ich die Farben auch habe. Ich hoffe ihr habt verstanden, wie ihr euch von allen Websites Farbinspirationen holen könnt . Und wie Sie eine Farbpalette erstellen können. Und auch die Verwendung von Augentropfen, zwei wie Augentropfen unterschiedliche Farben von einem sekundären Objekt bis hin zu Ihrem endgültigen Objekt oder Ihrem endgültigen Projekt. Wie ich euch schon gesagt habe, dass das ob, kommen wir mal her zur Farbdoo.com Das ist ein ziemlich fortgeschrittenes Level des Farbrads, oder aus dem wir Farbe wählen können Angenommen, ihr habt ein bestimmtes Bild dabei, okay, in diesem Bild gefällt euch der Farbkontrast dieses bestimmten Bildes Was Sie einfach tun können, ist, diese bestimmte Datei oder dieses bestimmte Bild in dieses Dokument einzufügen diese bestimmte Datei oder dieses bestimmte und es von hier aus hochzuladen. Es extrahiert die Farbe aus diesem bestimmten Bild und speichert sie diesem bestimmten Bild und als Farbpalette für Sie. Okay, wenn Sie diese bestimmte Farbe verwenden möchten, lassen Sie mich hier eine Datei auswählen. Okay, hier kannst du sehen, dass ich dieses Fib-Logo habe. Okay, ich klicke auf dieses Bild. Ich öffne das Und hier kannst du sehen, dass ich diese Farbpalette hier habe. Ich kann diese Farbe tatsächlich speichern. Okay, hier siehst du. Wenn ich eine neue Bibliothek erstellen und diese speichern möchte , kann ich das tun. Aber wenn ich es von hier aus speichern möchte, kann ich das auch speichern. Okay, das ist der farbenfrohe . Ich werde das speichern. Wenn ich das helle hier nehmen will, kannst du sehen, wie es aussieht, das gedämpfte Es gibt verschiedene Möglichkeiten, wie wir das tatsächlich auswählen können Wenn Sie das Bild ersetzen möchten, können Sie auch das Bild ersetzen. Lassen Sie mich auf dieses Bild von diesem Bild zurückkommen. Und wenn ihr Farbverläufe extrahieren wollt, was unser nächster Kurs ist, werde ich euch zeigen, wie wir Farbverläufe und verschiedene Optionen darunter erstellen können . Okay? Von hier aus kannst du auch die verschiedenen Farbverläufe sehen, okay? Nehmen wir an, ich komme zu diesem und wähle von hier aus die Gradientenstufe aus. Okay? Wenn ich das kopieren möchte, kann ich es von hier aus kopieren. Wie ihr sehen könnt, habe ich auch diese Option. Wenn ich diesen Farbverlauf speichern möchte, kann ich diesen Farbverlauf auch speichern. Von hier aus könnt ihr das Kontrastverhältnis zwischen dieser Farbe, der Textfarbe und der Hintergrundfarbe sehen . Es zeigt, . Es zeigt dass diese bestimmte Farbe zu diesem bestimmten Hintergrund passt , wenn ihr das alles verwenden wollt und ihr könnt von hier aus auch verschiedene Farben ausprobieren. Dies ist ein sehr hilfreiches Tool, mit dem wir unsere Arbeit besser aussehen lassen und eine bessere Vorstellung von Farbkontrast und Farbgebung bekommen können unsere Arbeit besser aussehen lassen und eine bessere Vorstellung von Farbkontrast und Farbgebung bekommen . Okay, hier könnt ihr es sehen. Und es hat mir auch gezeigt, dass, ja, diese Farbkombination zwischen einem Text und einem Hintergrund verwendet werden kann . So können wir das tatsächlich nutzen. Wenn ich Farbe importieren möchte, habe ich euch bereits gezeigt, was zu tun ist. Ich möchte diesen speichern. Ich kann das von hier aus speichern. Okay, von wo ich es mir ansehen kann, werde ich in meine Bibliotheken gehen. Aus meiner Bibliothek werde ich die Farben von hier haben. Jetzt, wo ich diese bestimmte Farbe ausgewählt habe, kann ich einfach diese JPEG-Version herunterladen, zu meiner Fib-Anwendung gehen und von hier aus das bestimmte Bild platzieren. Okay? Wenn ich darauf klicke, öffne ich diese spezielle Datei. Wenn ich das hier oben drauf legen möchte, kann ich das von hier aus hinzufügen. Wie Sie sehen können, habe ich diese Farbkombination. Okay. Wenn ich die Größe ändern möchte, kann ich auch diese Größe ändern. Okay. Wie du siehst, habe ich das. Okay, von hier aus. Das ist eine Möglichkeit, wie wir Farben addieren können. Nehmen wir an, ich nehme den hier mit. Strg die Shift-Taste, bewege meine Farbe. Okay, hier hole ich mir die Farben. Auch ihr könnt diese speziellen Themen von hier aus machen. Wenn ich wieder zur Option Erkunden gehe, wähle von hier aus die Option Erstellen. Ich kann diesen Farbcode auch von hier übernehmen. Ich kann diese einfach kopieren und in meine Feedback-Anwendung einfügen. Ich hoffe, ihr habt verstanden, wie ihr Farben in eurer speziellen Arbeit verwenden sollt. Ich hoffe, wir sehen uns alle in der nächsten Klasse. Hier in dieser Lektion haben wir tatsächlich drei Dinge gelernt. Die erste ist der Ort, an dem Sie sich Ihre Farbinspiration holen können . Ich habe euch die Website gezeigt. Und das nächste, was wir über das Eye Pipette Tool gelernt haben, war, wie wir deine Farbe fallen lassen können Okay, und wir haben auch gelernt, wie Sie Ihre eigene Farbpalette erstellen können In der nächsten Lektion werden wir lernen, wie Sie grundsätzlich mit Ihrem Farbverlauf arbeiten können . wie Sie Ihren eigenen Farbverlauf erstellen können und welche verschiedenen Möglichkeiten es gibt, diesen zu erstellen. Okay, bis dahin pass auf dich auf und hoffe, wir sehen uns alle im nächsten Tutorial. 12. Kursprojekt 1: Hallo alle zusammen. Jetzt ist es der Zeit, Ihre eigene Farbpalette zu erstellen. Und das ist das Klassenprojekt Nummer eins , bei dem ich mir deine Farbpalette ansehen werde. Um zu verstehen, wie Ihr Sinn für Farben ist , werden wir das tun. Lass uns mit dem Unterricht beginnen. Ich zeige euch allen Schritten , die ihr befolgen müsst. Und falls du verwirrt bist, mein Tutorial ist schon da. Sie können sich auf diese Tutorials beziehen. Lassen Sie uns sehen, was Sie alles tun müssen. Als Erstes müssen Sie mit dem Formwerkzeug eine rechteckige Form erstellen . Sobald Sie diese bestimmte rechteckige Form erstellt haben , können Sie aus dem Farbfeld, das ich Ihnen gezeigt habe, eine beliebige Farbe auswählen . Über die Fülloption können Sie Ihr Farbfeld abrufen und es mit einer beliebigen Farbe füllen Danach duplizieren Sie das gefüllte Farbfeld und ändern ständig die Intensität der Farbe, um eine Palette zu erstellen Ansonsten können Sie auch verschiedene Farben wählen , die gut zueinander passen Setzen Sie diesen speziellen Vorgang fort. Und du musst mindestens vier Farben nehmen, okay? Oder vier rechteckige Boxen. Das ist das Minimum , wenn ihr mehr, viel glücklicher machen könnt . Wenn ihr das zeigen könnt. Wählen Sie danach all diese Ebenen und machen Sie daraus eine Gruppe. Der letzte Schritt besteht darin , diese bestimmte Gruppe in Ihr System zu exportieren und sie in unserem Projektbereich einzureichen , damit ich Ihr Projekt sehen und versuchen kann, Ihren Kenntnisstand im Bereich Färbung zu verstehen. Okay, ich werde euch zeigen , wie ihr das auch machen könnt. Hier habe ich meine Figur. Ich nehme diese rechteckige Schachtel und mache hier eine Schachtel. Okay? Wie Sie in dieser Ecke sehen können , habe ich nach dem Erstellen einer Box meine Farbbox. Dies ist der zweite Schritt. Lass mich herkommen. Okay, ich wähle diesen und lasse mich etwas Dunkles nehmen. Okay, jetzt klicke ich auf Alt dupliziere diese Ebene einfach erneut. Was ich tun werde, ist, hierher zu kommen wieder etwas Leichteres zu nehmen. Alles in allem werde ich dieses Farbfeld einfach noch einmal duplizieren. Jetzt werde ich herkommen. Ich werde denselben Prozess immer wieder fortsetzen. Okay, als nächstes werde ich hier fünf erstellen , diesen. Und wähle diese Farbe, oder ich nehme sie hier. Okay. Also hier habe ich mein eigenes Farbpanel erstellt. Hier könnt ihr sehen, dass ich vier rechteckige Boxen habe und diese Dinge sind individuell. Von hier aus werde ich diese Dinge einfach gruppieren und hier auf diese Exportoption klicken, darauf klicken. Von hier aus könnt ihr sehen, zuerst komme ich einfach her und wähle eine Gruppe aus. Okay, ich kann diese Gruppe als Farbpalette bezeichnen. Speichere das, gehe jetzt zum Exportieren. Wenn Sie jetzt hier zum Exportieren kommen, können Sie die Vorschau sehen. Okay, ich möchte diesen im JPA-Format nehmen. Ich werde diesen erhöhen. Jetzt exportiere ich diese Farbpalette und speichere hier in meinen Downloads. Okay, jetzt habe ich die Palette schon gespeichert. Lass mich hierher gehen und schauen, wo ist meine Farbpalette? Jetzt könnt ihr sehen, dass ich die Farbpalette hier im J-Pac-Format habe. Das ist alles, was ihr hier in diesem Kurs tun müsst . In diesem Klassenprojekt hoffe ich, dass ihr eure Arbeit schickt. Ich bin wirklich daran interessiert, Ideen zu sehen oder Ihr Wissen über Färben und das Erstellen eigener Farbpaletten Ich hoffe, Arbeit zu sehen. Also passt alle auf euch auf. 13. Farbverläufe: Hallo zusammen und willkommen zu einem weiteren Tutorial in Figma Jetzt sind wir bei unserem Kapitel Nummer 11 und werden etwas über die Farbverläufe lernen So können wir mit all Ihren Farben herumspielen, wie Sie Ihre eigenen Farbverläufe erstellen können Außerdem werde ich euch eine Website zeigen, von der aus ihr die DID-Farbverläufe abrufen könnt Und von dort aus könnt ihr diese Farbcodes tatsächlich kopieren und in eure Anwendung einfügen Verschwenden wir hier keine Zeit. Wie ihr alle sehen könnt, bin ich jetzt in einem der Arbeitsbereiche hier. Ich zeige euch, wie ihr damit beginnen könnt , Farbverläufe zu erstellen Ich werde einfach nach oben gehen. Ich erstelle einfach einen Rahmen. Ich nehme einen Proof mit Handygröße 14, behalte das auf dieser Seite und dupliziere diese Ebene. Ja, jetzt habe ich vier der Frames hier, wie ihr alle hier sehen könnt, da ich jetzt vier Seiten erstellt habe. Jetzt nehme ich dieses Rechteckwerkzeug von hier und erstelle ein rechteckiges Feld, mit dem ich einen Farbverlauf erstellen werde. Okay. Vorher möchte ich euch eine Website zeigen, von der aus ihr jede Art von Farbverlauf abrufen könnt , die ihr in eurer Arbeit verwenden könnt. Okay, das ist die Website, gradient.com Von hier aus bekommst du im Grunde verschiedene Arten von Farbverläufen und wie du sie Sie können einfach hierher kommen, auf diese bestimmte Farbe klicken, Sie können diesen speziellen Code einfach kopieren und in Ihre Anwendung einfügen Oder wenn Sie es zu Ihrer Bibliothek hinzufügen möchten, können Sie es hinzufügen, indem Sie einfach hier klicken. Okay, ich habe dieses, aber ich werde euch zeigen, wie ihr es selbst machen könnt. Ich gehe wieder zu meiner Gesichtsanwendung. Jetzt, wo ich diesen habe und dieser ausgewählt ist, werde ich in der Fülloption hierher kommen und unter Phil könnt ihr sehen, dass eine Farbverlaufsoption da ist. Und sobald ich hier auf diese Verlaufsoption klicke, siehst du, dass ich eine lineare, eine radiale habe, okay? Und Angulo, sobald ich die Farbe eingegeben habe, werdet ihr erkennen können, was der Unterschied ist Und dieser hat die Form eines Diamanten, okay? Angenommen, ich verwende hauptsächlich das Lineare und das Radiale. Okay? Lass mich die erste Farbe von hier nehmen. Lass mich Blau abnehmen. Okay, lassen Sie mich ab jetzt versuchen, alles in Rosa zu nehmen, wie Sie hier sehen können. Und ich kann die Positionierung anpassen , wenn ich sie von hier aus einfach hierher verschiebe. Sie können sehen, dass ich die Farbe tatsächlich beibehalten kann, oder ich kann festlegen , wo die Farbe sein soll. Dies ist eine Möglichkeit, wie wir hier unseren eigenen Farbverlauf erstellen können. Von hier aus können wir tatsächlich mehr als zwei Farben hinzufügen. Okay, wenn ich hier klicke, habe ich auch hier nicht ganz Unrecht. Okay, nehme an, ich möchte hier einen hinzufügen. Jetzt wähle ich vielleicht eine andere Farbe. Ich kann so wählen. Das hier, ich werde es hier etwas tiefer machen. Du kannst sehen, dass ich meinen Gradienten habe. Ihr könnt das hinzufügen, so viel ihr wollt. Okay, du kannst von hier aus mehr hinzufügen. Angenommen, ich habe jetzt diesen. Ich ändere die Farbe davon. Ich werde das nach oben verschieben. Ich behalte diesen in der Mitte. Jetzt kann ich die Farbe von hier aus ändern. Wie ihr seht, gibt es ein, wenn ich einmal herkomme, nehme ich vielleicht etwas Ähnliches von hier. Wenn ich es verdunkeln will, kann ich es verdunkeln. Wenn ich es einfach hell machen will, kann ich es hell machen Es hängt alles von mir ab. Lass mich ein bisschen auf die hellere Seite gehen. Das hier nehme ich auf diese Seite. Ja, mein Gradient ist jetzt fertig. Wie Sie hier sehen können, habe ich Gradient. Wenn ich auf Enter klicke, könnt ihr sehen, dass ich meinen Gradient bereit habe. Wenn ich diesen kopieren möchte, kopiere ich einfach. Erstens, bring es auf eine andere Seite, füge diese hier ein. Sie können sehen, dass ich die Gradientengröße hier habe. Auf diese Weise können wir unseren eigenen Farbverlauf erstellen. Lassen Sie mich Ihnen hier auch alle anderen drei Optionen zeigen . Ich gehe einfach wieder auf dieselbe Seite zurück. Und ich werde hierher kommen und von hier aus eine weitere rechteckige Box erstellen. Oder lass mich einfach eine andere Form annehmen. Okay, lass mich Circle ausschalten. Okay, ich werde von hier aus einen Kreis erstellen. Wie Sie sehen können, habe ich meinen Kreis hier. Ja, ich behalte diesen einfach in der Mitte. Nun, was ich tun werde, ist, in diese Feldoption zu kommen, hier in meine Bibliothek zu gehen, mich für das Radial zu entscheiden. Und jetzt wähle ich eine andere Farbe. Okay, lass mich hier Rot nehmen. Ich möchte hier etwas gelbliches Färbemittel auftragen. Okay, von hier aus habe ich diesen ausgewählt. Jetzt geh ins Gelbe. Und hier siehst du gleich hinter dem Rot, ich habe meine gelbliche Verfärbung Ich bringe es einfach irgendwo in der Mitte hin. Ja, ich bringe es einfach her. Und ich kann auch verschiedene Farben hinzufügen. Wenn ich zum Beispiel einfach hier draufklicke und vielleicht ein Grün haben möchte, dann kann ich hier Grün auswählen. Okay, ich kann hier irgendwo Grün auswählen. Ja, ich kann. Wenn ich jetzt expandieren möchte, kann ich auch expandieren. Okay. Ich kann diese grüne Farbe von hier nehmen. Ich mache es dunkel. Ich werde auch diesen erhöhen. Okay, hier, ich behalte das hier. Ja, du kannst hier auch Radial machen, wie du willst. Du kannst von hier aus sehen, ob ich die Größe auch erhöhe. So kannst du von hier aus mit allen Farben herumspielen . Okay, das ist eine Möglichkeit, wie du herumspielen kannst. Ebenso kann ich auch andere Farben hinzufügen. Erhöhen Sie auch die Größe. Vielleicht möchte ich die Größe auch von hier aus erhöhen. Okay, wenn ich einen Bogen machen will, kann ich auch einen Bogen wie diesen machen, wenn ich hier will. Ich habe gerade einen radialen Farbverlauf gemacht. Wie ihr sehen könnt, hoffe ich, dass ihr versteht was ich euch hier zeigen will. Lassen Sie mich hier ein Polygon nehmen, lassen Sie mich ein Polygon darüber erstellen Lass es mich in die Mitte bringen. Danach wähle ich das aus. Jetzt zeige ich euch etwas über den eckigen, okay? Zuerst wähle ich die Farbe von hier aus. Jetzt wähle ich vielleicht tatsächlich diese Farbe aus. Wo soll diese Farbe sein? Wie Sie sehen können, habe ich diese Farbe hier ausgewählt. Vielleicht füge ich an dieser Ecke noch eine Box hinzu. Ich werde diesen erhöhen. Ich kann jede Farbe wählen, die ich will. Oder nehmen wir an, ich habe bereits eine bestimmte Farbe, die ich hier ablegen möchte. Mit dieser Farbe kann ich hierher kommen, ich kann diese Farbe auswählen. Meine Pipette hier, Sie können sehen, dass sich etwas geändert Okay? Ebenso kann ich hier eine andere Farbe hinzufügen. Okay, lass mich jetzt diese Farbe hinzufügen. Lass mich das auch etwas lockerer machen. Vielleicht ist die Farbkombination nicht so toll, aber um euch das zu zeigen, was ist der Unterschied zwischen der von hier Ich habe auch einige Optionen wie X und auch RGBs, wenn ich hier eine weitere Box erstelle oder wenn ich eine andere Form erstelle Okay, lassen Sie mich nur ein rechteckiges Feld nehmen, ich werde von hier aus erstellen Such dir diesen aus. Lass mich das mit meinem Handwerkzeug ein bisschen bewegen , damit ihr das richtig sehen könnt. Okay? Ich habe das jetzt. Ich lege das hier runter. Okay? Ich nehme hier den eckigen. Sie können sehen, wie wir im Grunde damit arbeiten können. Okay? Von hier. Oder ändere hier die Farbe, ihr könnt es sehen. Ich kann hier eine andere Farbe hinzufügen. Angenommen, ich möchte hier eine grüne Farbe nehmen, Sie können eine grünliche Färbung sehen Okay, lassen Sie mich dieses spezielle Feld hier vergrößern. Hier können Sie sehen, dass ich, wenn ich hier eine andere Farbe hinzufüge, Belieben eine andere Farbe auswählen kann. Okay, lassen Sie mich das an diesem Ende nehmen, grüne Farbe. diese Weise können wir tatsächlich an dieser Anwendung arbeiten. Okay, genauso könnt ihr Gradient besitzen. Sobald Sie damit fertig sind, können Sie einfach auf Enter klicken sobald Sie mit Ihrem Farbverlauf fertig sind. Ich habe euch auch gezeigt, wie ihr das im Grunde auf eine andere Ebene übertragen könnt . Wenn ich kopieren möchte, gehe ich zu dieser Ebene. Ich füge diesen hier einfach ein. Wie Sie sehen können, möchte ich, dass es die gleiche Größe wie dieses hat. Dafür klicke ich hier, Scale. Ich möchte eins skalieren. Jetzt, wieder mit dem Verschieben-Werkzeug, wähle ich das aus und vergrößere es. So wie das. Ja, jetzt habe ich fast die gleiche Größe, aber ich kann auch die Breite und Höhe von hier aus sehen, 270-93-2022 Ja. Jetzt haben beide die gleiche Größe. Wie Sie sehen können, schließe ich mich beiden an. Dies sind die beiden Farbverläufe , die ich hier erstellt habe. Gehen Sie erneut zu dieser speziellen Seite. Lassen Sie mich Ihnen von hier aus die letzte Option zeigen , nämlich die Diamantform. Okay, hier, wie die Diamantform aussehen wird. Aber eckig war nur in Ordnung. Lassen Sie mich von hier aus eine andere Gestalt annehmen. Lass mich einen Stern nehmen. Lass mich hier einen Stern kreieren. Behalte das in der Mitte. Setze jetzt einen ausgewählten Stern und wähle das Feld aus. Lass mich hier einfach etwas braune Farbe nehmen. Lassen Sie mich in diesem Punkt eine gelbe Farbe nehmen. Okay. Ja, gelbe Farbe von hier. Und genauso kann ich von hier aus auch andere Farben hinzufügen , wenn ich möchte. Okay? Genau in der Mitte, wenn ich etwas Rot hinzufügen möchte oder es einfach die ganze Farbe annimmt, so können wir die Färbung grundsätzlich anpassen. Sie können sehen, dass es langsam verblasst , da es die Form eines Diamanten annehmen wird Okay. Hier, wenn ich nur die Größe dieses Sterns, die Größe des Sterns, wenn ich ihn skalieren will, kann ich ihn auch skalieren, wie ich will. Lassen Sie mich das einfach verkleinern. Ja, jetzt ist dieser in der Mitte. Wählen Sie das erneut von hier aus. Auswahl- oder Verschiebewerkzeug, linearer Diamant. Und klickt hier, ihr könnt sehen, wie es tatsächlich aussieht. Okay, hier seht ihr einen kleinen Punkt. Damit kann ich die Leitung einfach verlängern. Oder ich kann diesen auch hier hinstellen. Hier auf dieser Folie möchte ich eine Farbe hinzufügen. Okay, lass mich das nehmen und hier könnt ihr die Färbung meines Sterns sehen. Klicken Sie auf Enter und hier haben Sie Ihren Sternverlauf. Okay, ich möchte das auch auswählen oder hier auf meine Desktop-Seite kopieren, einfügen. Ja, ich habe auch diesen Farbverlauf. Verkleinern Sie die Größe. Ja, ich habe auch diesen Gradienten. Ich hoffe ihr habt verstanden, wie ihr euren eigenen Farbverlauf und verschiedene Arten von Farbverläufen erstellen könnt . Und ich habe euch auch gezeigt, wie ihr mit eurem Verlaufsstil herumspielen könnt . Das sind die vier Optionen ihr verwenden könnt, aber für mich verwende ich die lineare und die radiale, meistens von hier aus. Ich kann auch die Schwäche bestimmen, wie viel ich will, wie tief, mild, ich will diese Farben. Okay. Ich kann auch von hier aus wählen. Okay. Hoffe also, dieser Kurs war klar. In der nächsten Klasse werde ich euch erklären , wie ihr im Grunde eure eigenen Farbstile erstellen oder diese erstellen und in eurer Datei verwenden könnt eure eigenen Farbstile erstellen oder . Okay, ich werde euch das zeigen, also bleibt dran mit diesem Kurs und hoffe, euch alle im nächsten Tutorial zu sehen. Also jetzt gehen wir zu unserer letzten Malstunde. Kümmere dich um alle und wir sehen uns alle. 14. Farbstile: Hallo zusammen und willkommen zu einem weiteren Tutorial in Figma Jetzt sind wir bei unserem Kapitel Nummer 12 und werden etwas über Farbstile lernen, zum Beispiel, wie Sie verschiedene Farbstile erstellen und diese speichern können, damit Sie sie in Ihrem Projekt verwenden können Okay, wir werden sehen, wie Sie das alle machen können, und diesen bestimmten Stil benennen , damit Sie nicht verwirrt werden. Ich werde Ihnen zeigen, wie Sie Ihre Farbe speichern, wie Sie sie anwenden können, und sobald Sie auch diese gespeicherten Farben bearbeiten können, zeige ich Ihnen, wie Sie sie bearbeiten können, und sobald Sie diese bestimmte Farbe im Bearbeitungsfenster geändert haben, wie sich dadurch alle Stellen ändern, an denen Sie diese Farbe angewendet haben. Wir werden uns all diese Dinge hier in diesem speziellen Kurs ansehen. Verschwenden wir nicht Typ L. Lassen Sie uns jetzt mit dieser speziellen Klasse beginnen. Nochmals, im vorherigen Projekt oder auf der Seite hier, okay, ich werde euch hier zeigen, wie ihr eine Farbe erstellen und wie ihr diesen bestimmten Stil speichern könnt, sodass es für euch einfach sein wird , dieselbe Farbe auch im nächsten Projekt zu verwenden . Lassen Sie uns hier einen weiteren Rahmen erstellen. Okay, ich werde mit der Frame-Option hierher kommen, ich nehme den gleichen, den ich schon hier habe. Okay? Ich werde es irgendwo hier mit meinem Handwerkzeug aufbewahren. Ich werde das hier hinstellen, damit ihr es richtig sehen könnt. Okay. Jetzt komme ich zum Formwerkzeug erstelle hier ein rechteckiges Feld. Noch einer hier. Ich werde diesen kopieren, hier platzieren, den und den Abstand beibehalten. Ja, jetzt ist dieser in der Mitte. Jetzt werde ich diese Art von Farben hier haben, wie Sie sehen können. Lassen Sie mich diese Datei auch irgendwo neben mir hinbringen . Das sind meine Farbstile, die ich habe, sodass ich diese Farben im Grunde speichern und überall anwenden kann , wo ich will. Ich werde euch zeigen, dass, sobald ich Farbe von hier aus ändere, wenn ich sie nach dem Speichern und Anwenden des Stils bearbeiten möchte , diese bestimmte Farbe auf meinen ganzen Seiten geändert wird , auf denen ich alles angewendet habe. Lasst mich euch ein Beispiel zeigen, wie okay, ich habe diese spezielle Farbe hier. Wie Sie in der Feldbox sehen können, habe ich diese Farbe bereits, okay, oder diesen Farbverlauf. Was ich tun werde, ist auf diese vier Punkte in der Feldoption zu klicken. Komm her, klicke auf diese neue Variable und du kannst sehen, dass ich hier einen Stil habe, der mir sagt, dass ich dieser bestimmten Farbe einen Namen geben soll, okay? Ich speichere das einfach als Gradient, okay? Und wenn ich irgendeine Art von Beschreibung hinzufügen möchte, kann ich auch hinzufügen. Das ist so, als ob so viele von uns im selben Tab arbeiten, ich möchte, dass sie wissen oder wissen , dass ich für welche Sache oder welchen Teil des Designs ich diese Farbe verwenden möchte. Angenommen, ich möchte diese Farbe für Schaltflächen verwenden. Tabs, ich kann einfach hier klicken, ich kann hier klicken. Und hier kannst du sehen, dass ich hier die Verlaufsfarbe habe. Okay. Also, jetzt habe ich diese Verlaufsfarbe hier, und jetzt ist sie ausgewählt. Was ich tun möchte, ist, dass ich diese Farbe auch in all diesen Boxen anwenden möchte. Okay, ich klicke einfach hier, komm her, komme zu dieser Feel-Option, ich muss hierher kommen. Und hier können Sie sehen diese bestimmte Farbe hier gespeichert wird. Okay? Wenn ich jetzt hier draufklicke, kannst du sehen, warum diese Farbe hier rübergeklebt ist Ebenso kann ich das auch mit all diesen Farben machen. In der Bibliothek habe ich nur eine Farbe und ich kann diese Farbe als Primärfarbe auswählen und einen Stil erstellen. Dann nimm diese Farbe. Ich werde diese Farbe als Sekundärfarbe speichern. Ich werde wieder hier sein und das als zweite Farbe bezeichnen. Wenn ich nun zu dieser speziellen Kiste komme, wähle diese oder diese. Jetzt setze ich hier meine Grundfarbe ein. Ich füge hier die Sekundärfarbe ein. Jetzt habe ich das. Komm her und trage hier die Grundfarbe ein. Ich werde die Sekundärfarbe verwenden. Ich werde es auch hier machen, lassen Sie mich nur diesen als Farbverlauf beibehalten. Klicken Sie auf Enter. Komm schon wieder zu diesem Kuchen, ich mache immer wieder den gleichen Fehler. Hier setze ich die Sekundärfarbe ein, okay? Nun, da ich diese speziellen Farben von hier ausgewählt habe, wie Sie sehen können, ist mit diesen drei Farben von hier gefüllt. Wenn ich nun diese Farbe ändern möchte, nehme ich an, dass ich diese habe. Ich kann sie tatsächlich umbenennen. Und hier ist die Option zur Farbbearbeitung. Okay? Von hier aus kann ich die Farbe bearbeiten. Wenn ich jetzt hierher komme und diese Farbe dort ändere, können Sie sehen, wo immer ich diese bestimmte Farbe aufgetragen habe , sie geändert wird. Und jetzt kann ich hier klicken. Wie Sie sehen können, wird es geändert. Das Gleiche gilt für diesen hier. In der sekundären Farboption möchte ich alle Farben ändern. Ich möchte die Schattierung hier ändern. Sie können sehen, dass ich sie von hier aus ändern kann Hier seht ihr , wo ich die Farben aufgetragen habe , die sich bis zur Grundfarbe ändern können Ich möchte auch diese Farbe ändern. Ich nehme einfach etwas in Rosa oder möchte einfach einen Farbverlauf hinzufügen oder diese Farbe wählen. Ja, ich hoffe ihr habt verstanden, wie wir diese Farben tatsächlich verwenden und eure Farbstile speichern können, wie wir im Grunde mit all dem weiterarbeiten können. Sobald ich das Ding hier geändert habe, siehst du auch hier auf dieser speziellen Box, du kannst sehen, dass sich die Farbe geändert hat, weil es auch ein rechteckiges Feld ist und ich diese Farbe tatsächlich von hier übernommen habe. Jetzt können Sie sehen, dass die Primärfarbe diese ist, Sekundärfarbe diese ist und der Farbverlauf diese ist. Okay? Ebenso können wir verschiedene Farbtypen hinzufügen. Benennen Sie sie und geben Sie dem System eine Beschreibung. Sie können es auch auf anderen Seiten verwenden. Nehmen wir an, ich bin jetzt auf dieser Seite, habe aber trotzdem meine speziellen Farbstile hier. Wie Sie sehen können, habe ich die Farbstile auch hier. Jetzt könnt ihr auch manuell hierher kommen, um Stil zu erstellen. Okay, lassen Sie mich einen Farbstil erstellen, oder ich habe diese Option. Ich werde direkt dazu übergehen, wie man einen neuen Farbstil erstellt. Ich kann die Farbe von hier aus auswählen. Angenommen, ich möchte das speichern. Ich möchte das als Hintergrundfarbe bezeichnen. Ich kann diesen speziellen Stil auch von hier aus speichern. Ich kann auch die Hintergrundfarbe von hier aus ändern. Wenn ich komme, kann ich einfach diesen auswählen. Klicken Sie auf Enter. Angenommen, ich bin hier, wähle diese Farbe aus. Dadurch kann ich auch meine Hintergrundfarbe ändern, aber ich möchte vorerst keine Hintergrundfarbe verwenden , da sie auf dieser Seite nicht gut aussieht. Ich hoffe, ihr habt diese Klasse verstanden, in der es darum geht, wie ihr euren Stil speichern und auch eure eigene Farbe kreieren könnt. Ändere es an einer Stelle und es wird geändert in aller Hoffnung, dass diese Klasse klar war. Jetzt könnt ihr das in eurer speziellen Datei oder auf eurer Bewerbungswebseite anwenden eurer speziellen Datei oder auf eurer , wo immer ihr wollt. Ich hoffe, wir sehen uns alle in der nächsten Klasse, in der wir etwas über Bilder lernen werden , zum Beispiel über das Maskieren und wie wir unsere Bilder tatsächlich zuschneiden können Außerdem, wie wir im Grunde ein Bild hier in unserem Arbeitsbereich aufstellen Ich hoffe, wir sehen uns alle im nächsten Tutorial. Bis dahin pass auf dich auf und auf Wiedersehen. 15. Wie man Bilder in Figma verwendet: Hallo zusammen und willkommen zu einem weiteren Tutorial auf Figma Das ist also das Kapitel Nummer 30, und ich werde euch zeigen, wie ihr Bilder in dieser speziellen Anwendung verwenden könnt , zum Beispiel, wie ihr Bilder importieren könnt, welche Optionen gibt und wie wir das alles machen können Ich werde euch auch zeigen, wie ihr tatsächlich einige grundlegende Bearbeitungen an eurem Bild vornehmen könnt . Ich werde euch das zeigen. Und wir werden auch herausfinden, ob ich eine bestimmte Form oder eine bestimmte Stelle auf meiner bereits erstellten Seite habe. Also statt Farbe, wie kann ich diese Stelle mit einem Bild füllen? Also werde ich euch das alles hier in diesem speziellen Kurs zeigen . Also lass uns anfangen. Also, wie Sie sehen können, bin ich wieder auf der Seite, auf der ich hier einen Rahmen habe. Was ich jetzt tun werde, ist Strg+Shift Plus zu klicken . Okay. Und nachdem Sie darauf geklickt haben, können Sie hier sehen, dass dies die Tastenkombination ist , mit der Sie Ihr Bild auf dem Bildschirm öffnen können, sodass Sie ein Bild in Ihre spezielle Arbeit hochladen oder importieren Also klicke ich auf diesen und öffne ihn von hier aus. Und wie Sie sehen können, habe ich mein Bild auf meiner Maus. Also hier kann ich die Größe des Bildes wählen. Von hier aus kann ich diese bestimmte Größe wählen, wie ich meine Seite platzieren möchte. Also hier, wie Sie sehen können, habe ich hier nach Seiten sortiert. Und es gibt noch eine andere Möglichkeit, Shift K zu kontrollieren. Und von hier aus kann ich dieses spezielle Ding einfach per Drag-and-Drop verschieben. Aber wenn ich das mache, die Größe des Bildes kann ich die Größe des Bildes von hier aus nicht beibehalten. Aber wenn ich die Größe des Bildes beibehalten will , gehe ich einfach zurück. So können wir das Bild einfügen. Wir können auch hier in die Option Form zu klicken und von der Option Form zu Option gehen wir zum Platzieren von Bild und Video. Und wenn ich einmal hier bin und ein Bild auswählen möchte, kann ich das tun. Und nehmen wir an, ich möchte mehr als ein Bild gleichzeitig importieren, also wähle ich so aus. Wie du siehst, werde ich einfach so lange hinlegen. Und jetzt kann ich das öffnen, und hier kannst du sehen, dass ich jetzt 11 Bilder auf meiner Maus habe. Also werde ich die Größe so erstellen, wie ich will. Also hier werde ich noch einen hinzufügen. Auf diese Weise kann ich tatsächlich so viele verschiedene Bilder gleichzeitig ändern oder einfügen. Und wenn ich auf Control Shift klicke, werdet ihr hier sehen können , dass es proportional wächst Okay? Aber das brauche ich nicht. Ich nehme das, das und das hier. Okay, es ist erledigt. Also zeige ich euch die ganze Seite. Und hier kannst du sehen, dass ich meine Bilder hier habe. Und da das so viele Dateien sind, lege ich sie einfach in den Rahmen, wähle aus und ich wähle die Rahmenauswahl. Jetzt können Sie hier sehen, dass sich das unter einem Rahmen befindet, okay? Also das ist ein weiterer Rahmen. Ich behalte das einfach auf einer Seite. Also das ist die Shortcut-Methode oder der beste Weg, wie du dein Bild platzieren kannst. Oder wenn Sie ein Video haben, können Sie auch ein Video importieren. Also lass mich wieder hier rauf. Also werde ich nur auf diese spezielle Seite hier eingehen, ein bisschen raus. Klicken Sie auf diesen. Und bring es hierher ins Bett. Okay. Also jetzt habe ich das. Und hier, was wir im Grunde tun können , ist, wenn ich diese bestimmte Ebene auswähle , nehmen wir an, ich möchte diese ganze Ebene auswählen, diese beiden Ebenen hier. Das ist ein Frame. Lass mich sehen, was die anderen gemacht haben. Okay. Ich habe diesen Rahmen, also ja, was ich jetzt tun werde, ist, dieses spezielle Bild von hier herauszunehmen , dieses spezielle Bild von hier herauszunehmen und ein eigenes Bild anzubringen. Also, was ich tun werde ist, sobald ich dieses Bild ausgewählt habe, komme ich zu dieser Fülloption klicke auf dieses Bild. Und hier können Sie sehen, dass ich die Option Bild habe. Also hier kannst du sehen, dass ich diese Option Bild ausgewählt habe. Und jetzt, wenn ich einfach zurückgehe oder auf Enter klicke. Jetzt habe ich diesen. Wenn ich jetzt zu dieser Fülloption gehe. Hier siehst du, dass ich ein Bild auswählen kann. Angenommen, ich möchte dieses Bild dort platzieren. Ich klicke einfach auf Öffnen. Hier kannst du sehen, dass ich das Bild direkt darunter habe. Ich habe mein Bild hier. Wie Sie sehen können, habe ich es. Und auch hier werde ich versuchen, eine Form zu finden. Angenommen, ich nehme einfach einen Kreis, mache hier einen Kreis, klicke auf diese Fülloption, Bild, wer ist ein Bild von hier. Und vielleicht nehme ich das, ich öffne dieses. Hier kannst du sehen, dass ich mein Bild auch hier in der Mitte habe. So können Sie Ihr Bild also grundsätzlich auch in einem bestimmten Symbol platzieren . Also werde ich diesen einfach löschen. Also so kannst du das machen. Und jetzt, wenn noch einmal, komme ich hier zu dieser Fülloption. Da ich hier ein Bild habe, wähle ich Also, da ich dieses habe, kann ich auch die Belichtung ändern , auch den Kontrast. Ich kann es tatsächlich so machen, wie ich will. Das ist kein Photoshop, aber wir können einige der grundlegenden Bearbeitungen Ihres Bildes von hier aus vornehmen. Wenn ich die Temperatur erhöhen möchte, kann ich das tun, und ich werde diesen Stint einfach ein bisschen nutzen Okay. Du kannst sehen oder. Glanzlichter und Schatten. Das ist in Ordnung. Damit bin ich zufrieden. Und hier kann ich das Bild von hier aus auch um 90 Grad drehen , wie Sie sehen können, ich kann das drehen, also werde ich es so belassen. Ich hoffe, ihr habt diese Klasse verstanden der es darum geht, wie ihr ein Bild nach euren Wünschen gestalten könnt. Hier kannst du also auch den Text animieren oder ob du irgendein Textfeld irgendwo hier platzieren möchtest, zum Beispiel, wenn du es einfügen und schreiben möchtest wie es in Figma beschrieben wird Und ich klicke einfach raus. Nimm das oben drauf. Ja. Ja, so kann ich es machen. Und hier kannst du sehen, dass ich dieses Feld einfach auswählen kann. Und ich kann tatsächlich auch die Größe der Box ändern. Jetzt wissen Sie also, wie Sie mit dieser speziellen Anwendung in der Bildoption herumspielen können . Okay? In der nächsten Lektion werden wir lernen, wie man ein Bild maskieren kann und wie man es auch speziell anpassen kann. Ich hoffe also, euch alle im nächsten Tutorial zu sehen und auf Wiedersehen. 16. Maskierung, Cropping und Bild-Plugins: Hallo zusammen und willkommen zu einem weiteren Tutorial in Jetzt sind wir bei unserem Kapitel Nummer 14 und wir werden lernen, wie Sie Maskieren, Zuschneiden und einige der Bild-Plug-ins verwenden können , Zuschneiden und einige der Bild-Plug-ins Ich werde euch zeigen, wo kostenlose Bilder für kommerzielle Zwecke bekommen könnt oder einfach nur, um daran zu arbeiten, um zu üben, wo ihr kostenlose Bilder in hoher Qualität bekommen könnt kostenlose Bilder in hoher Qualität Ich werde euch das zeigen. Ich zeige Ihnen, wie Sie ein Bild grundsätzlich auf verschiedene Arten zuschneiden können und wie wir die grundlegende Maskierung in dieser speziellen Anwendung durchführen können die grundlegende Maskierung in dieser speziellen Anwendung Lass uns mit diesem Kurs beginnen , jetzt bin ich hier auf meiner Seite. Das erste, was ich tun werde, ist, das Bild so zu exportieren , wie ich es in der letzten Klasse von hier aus getan habe. Das kann ich auch hier tun. Sie können anhand der rechteckigen Option sehen, ich kann kommen und hier klicken und ich werde ein Bild auswählen, okay? Im Grunde genommen können wir das Bild von hier aus zuschneiden können wir das , wenn Sie möchten, dass das Bild proportional wächst In diesem Fall kann ich einfach auf Strg+Shift klicken und so können wir das tun, und ich kann auch wieder hierher zurückkehren Nehmen Sie dasselbe Bild auf und nehmen Sie an, dass ich jetzt die Bildgröße vergrößere. Dies ist im Grunde eine Möglichkeit, wie Sie zuschneiden können. Nun, so viel ist genug, wenn Sie jetzt proportional zuschneiden möchten In diesem Fall klicke ich entweder auf Control oder hier auf Shift. Sie können sehen, dass ich das Bild tatsächlich proportional bewegen kann , okay? Ich wähle dieses hier aus. Jetzt kann ich es auch von hier aus herunterschneiden. Hier sieht man, dass das Gefühl gut genug ist und das Futter auch in Ordnung ist. Aber wenn ich hier zuschneide, siehst du die Option zum Zuschneiden, zum Beispiel, wie ich dieses Bild zuschneiden kann , wenn ich hier das Bild von hier aus öffnen wähle Bild von hier aus öffnen Wie Sie sehen können, kann ich das verkleinern. Lassen Sie mich einfach dieses Bild darüber machen. Lassen Sie uns das andernfalls verschieben. Vielleicht hier, Sinus oder ich habe gerade den Schatten genommen. Jetzt komme ich wieder her und habe den Arbeitsbereich angepasst. Jetzt komm zu diesem Bild. Nun, hier können Sie in dieser Zuschneideoption sehen, dass ich im Grunde genommen von einem Ende aus zuschneiden kann oder ich kann es auch von den Enden aus tun, wenn ich proportional möchte In diesem Fall kann ich das so machen. Hier können Sie sehen, dass es proportional zu allen blauen Punktsymbolen Ich kann dieses Bild grundsätzlich zuschneiden. Ich kann auch die Kontrastbelichtung ändern und das ist der Kontrast, die Sättigung der Bildtemperatur, ich möchte keine Farbakzente setzen , das sieht besser aus und der Schatten wird so stark sein Okay. Jetzt weißt du, wie du das machen kannst. Wenn ich hier auf Enter klicke, kannst du sehen, dass ich mein Bild hier mache, das ich gerade zugeschnitten habe. Sie können das Maskieren auch von hier aus durchführen. Lassen Sie mich dafür noch ein Bild machen. Ich nehme einfach dieses spezielle Bild von hier. Wie Sie sehen können, habe ich es auf meinem. Ich behalte dieses Bild bis so lange. Ich kann jetzt annehmen, dass ich ein Rechteck mache. Okay? Und ich habe gerade dieses spezielle Rechteck gemacht und ich möchte es darauf legen. Okay, dann maskiere ich es einfach, oder ich behalte das hier. Wählen Sie nun beide Ebenen aus. Jetzt habe ich beide wieder ausgewählt, ich werde das nur maskieren. Was ich tun werde, ist, die Deckkraft auf Null zu setzen. Ich trete hier ein. Hast du das Bild, oder was ist das Problem hier? Von hier aus kann ich die Deckkraft ändern. Ich gehe zurück Ich will nicht maskieren, die Deckkraft von hier aus ändern Null. Jetzt werde ich sehen können, das ist die Bildseite , die ich hier habe. Wie Sie sehen können, ist dies das Bild, so kann ich es maskieren. Und ich zeige euch den anderen Weg wie wir das machen können. Ich lösche das Bild von hier. Ich habe ein hier. Ich lösche das auch. Ich mache noch ein Bild. Jetzt komme ich wieder zu der Option oder ich klicke einfach auf Control-Shift. Von hier aus werde ich ein weiteres Bild machen. Ich werde dieses öffnen. Jetzt habe ich dieses Bild. Ich werde es einfach so ausdrücken. Dieser Gin was? Dieses Bild mache ich von hier aus, ich werde hier Gestalt annehmen. Ich habe meine rechteckige Kiste hier. Ich habe diese Dinge hier. Oder zuerst lösche ich dieses Bild. Nimm das von hier. Lass mich hier einfach die Größe bestimmen. Jetzt komme ich von hier her. Ich möchte hier ein Bild platzieren. Sie können sehen, wählen Sie ein Bild aus. Ich werde das hier tatsächlich öffnen. Jetzt werde ich in der Lage sein, die Größe zu erhöhen. Nehmen wir an, ich nehme stattdessen Ellipse. Okay? Und ich behalte es hier. Platziere das Bild von hier. Von hier aus, öffne. Ich habe das Bild von hier aus platziert und werde hierher kommen und die Option „Zuschneiden“ von hier aus verwenden. Im Grunde kann ich mir all diese Dinge aussuchen , wie wir hier tatsächlich arbeiten können. Also ich kann das tatsächlich noch ein bisschen mehr anpassen , wenn ich als Option zum Zuschneiden schon etwas herkomme. Dieser ist in Ordnung. Ich kann einfach hier klicken und wie Sie im Inneren des Symbols sehen können, habe ich auch das Bild. Okay, das war eine andere Art, das zu tun. Das Zuschneiden Ihres Bildes und des Originals oder die Art und Weise, wie Sie diese Option verwenden , ist zuerst, ich muss nur eine Form auswählen Lassen Sie mich von hier aus ein Dreieck nehmen. Jetzt bringe ich das her. Ich möchte das einfach unter das Bild legen. Okay, hier. Ich nehme das mal unter das Bild. Okay, ich habe dieses Polygon. Ja, hier kannst du das Bild oben sehen. Und ich habe die Form direkt draußen. Ich bringe es in die Zentrale. Ich werde auch nur die Höhe hinzufügen, okay. Ja, das ist Kampf. Nun, was ich tun werde, ist, sobald ich diese beiden Ebenen hier ausgewählt habe, wie Sie sehen können, kann ich auf diese Option klicken, okay? Aber wenn ich hier nur auf diese hier klicke, okay, ich werde hier etwas anderes haben. Okay. Ich klicke auf beide. Ich werde das hier als Maske verwenden. Sie können sehen, dass es sich um eine Maske handelt. Jetzt kann ich die Einstellung auch von hier aus ändern, komm her, so. Ich kann das Bild im Grunde so zuschneiden, wie ich es möchte. Okay, das ist eine Möglichkeit, das zu tun. Wenn ich auf Enter klicke, könnt ihr sehen das Bild oder das ist die Form, in der ich das Bild habe , wo ich diese Option als Maskierung hier in meiner Ebene verwendet als Maskierung hier in meiner Ebene Ihr könnt auch sehen, dass ich eine Maskengruppe habe. Ich kann es auch umbenennen, wie ich will. Ich schreibe Masking One. Ich werde hier auf Enter klicken. Sie können sehen, sobald ich diesen ausgewählt habe, wird das Ganze ausgewählt. Aber wenn ich von hier aus einfach auf dieses Bild klicke , kann ich es auch anpassen, wie ihr sehen könnt, ich kann es so anpassen , wenn ich das Polygon anpassen möchte Ich kann es so anpassen. Okay? Also können wir es auch von hier aus nach unten anpassen, wie wir wollen. Welche Formen haben wir alle angenommen? Okay, es hängt von all dem ab. Das Gleiche können wir auch in vielen Preset-Frames tun. Okay? Aber um all diese Icons auf meiner Webseite zu platzieren, machen wir im Grunde Formen statt eines ganzen Rahmens. Okay, hier habe ich euch gezeigt, wie man Maskieren Zuschneiden auf verschiedene Arten machen kann Nehmen wir an, ich nehme einen Text von hier, okay, ich möchte zuerst in diesen Text schreiben Ich werde herkommen. Oder auch mit meiner Hand. Mal sehen, welche anderen Bilder wir hier haben. Okay, ich werde dieses Bild auswählen. Bring es irgendwo her. Jetzt erhöhe ich einfach die Größe. Ich werde die Größe einfach so weit erhöhen , wie ihr hier sehen könnt. Ich musste die Seite bewegen. Jetzt kann ich auch mit meinem Typ tippen, okay, lass mich die weiße Farbe von hier nehmen. Tippwerkzeug, wähle aus, richtig? Okay, vielleicht schreibe ich einfach so, das ist die Adobe After Effect-Seite. Also werde ich einfach Adobe After Effect schreiben. Okay, was ich jetzt tun werde, ist einfach den ganzen Text von hier aus auszuwählen. Ich wähle einfach das Ganze aus. Ich werde jetzt zuerst kommen und die Farbe ändern. Ich mache es weiß. Ich werde nur die Größe dieses speziellen Textes erhöhen . Okay, dafür muss ich auch beide Schalttastenkombinationen wählen. Dann diese Taste genau hier, die Full-Stop Taste. Okay, ich werde darauf klicken, dann hier auf die Schaltfläche „Vollständiger Stopp“. Sie können sehen, dass dies eine der Abkürzungen ist , wie Sie hier tatsächlich arbeiten können. Okay? Oder erhöhen Sie einfach die Schriftgröße. Das sieht gut aus, nicht schlecht. Was ich jetzt tun kann, ist , hierher zu kommen, ich kann mir einfach diesen Text ansehen. Okay? Wenn ich hier oben auf diese blaue Seite klicke, ändere die Farbe oder ändere die Deckkraft Zoomen Sie ein bisschen hinein. Ich werd einfach mal rein, dass die Bildqualität nicht so toll ist. Aber euch ein Beispiel zu zeigen, wäre in Ordnung. Ich werde diesen Text einfach unter diesen Rahmen legen. Jetzt möchte ich diesen nehmen. Wo ist das Bild im Grunde? Lass uns dieses Bild sehen. Ich möchte es unter dieses bringen. Jetzt kannst du nicht sehen. Jetzt werde ich diese eine Änderung auf Null vornehmen. Wenn ich nun beide auswähle, verwende hier die Maskierung. Jetzt diesen Text, ich bringe ihn hier nach oben, bring ihn an diese Ecke Ich werde die Größe ein wenig anpassen. Vielleicht ist 48 in Ordnung. Ja, ich werde versuchen, das anzupassen, um es hierher zu bringen. Ja, hier ist es in Ordnung. Jetzt wähle ich beide aus und klicke hier oben auf diese Option . Okay. Ja, eins habe ich vergessen, ich muss das noch oben drauf haben. Okay, das Bild oben auf meinem Text. Wenn ich jetzt einfach auf diese Maskierung hier klicke, werdet ihr das sehen können Jetzt habe ich diese Maskierungsoption hier. Okay, ich kann also darunter sehen, okay, wenn ich von der Maskierung So wird es aussehen, wenn mir die Maskierung gehört. Diesen Effekt wird es mir hier geben. So funktioniert es tatsächlich. Ich hoffe ihr habt diesen Kurs über Maskieren und Zuschneiden verstanden diesen Kurs über Maskieren und Zuschneiden Ich hoffe, wir sehen uns alle im nächsten Tutorial, in dem wir etwas über Einschränkungen und Effekte lernen werden , bevor wir diesen Kurs beenden Lassen Sie mich Ihnen auch zeigen, wie wir tatsächlich kostenlose Bilder herunterladen können und wie wir diese Bilder tatsächlich in Ihre Plug-ins integrieren können. Dafür gehe ich von hier aus zu meinem Chrome. Ich werde hier auf Splash suchen. Ich habe eine Website, auf der ich kostenlose Bilder bekommen kann, aber wenn du für ein Unternehmen oder etwas Ähnliches arbeitest, kannst du ihnen einfach sagen, dass sie sich ihr Profil ansehen sollen und auch kannst du ihnen einfach sagen, dass sie sich ihr Profil ansehen sollen und auch sehen können, was verwendet werden kann und was nicht. Okay? Wenn du dich mit ihnen verbinden willst, kannst du dich grundsätzlich mit ihnen verbinden. Und wenn du ihnen folgen möchtest, kannst du ihnen auch von hier aus folgen Du kannst all diese Bilder hier sehen. Sie können sehen, okay, nehmen wir an, ich mache das, lassen Sie mich einfach ein Foto machen. Nachdem Sie hier auf das Bild geklickt haben, können Sie alle grundlegenden Informationen sehen z. B. wie sie aufgerufen wurden und wie viele Downloads sie erhalten haben. Wenn Sie dies zufällig melden möchten, können Sie dies von hier aus tun. Sie können auch sehen, wann es veröffentlicht wird, auf welcher Kamera und alles verwendet wird. Eine andere Website, die Sie verwenden können, ist Pixels. Wenn ich von hier aus zu Pixeln gehe, können Sie von hier aus sehen, Sie können die Bilder hier durchsuchen. Und Sie können auch die Lizenz sehen. Zum Beispiel das, was alle benutzen dürfen . Für welche Zwecke? Hier können alle Fotos und Videos sowie Pixel kostenlos verwendet werden. Eine Namensnennung ist nicht erforderlich. Du musst also nicht den Namen der Person oder der Personen nennen, die das geschaffen haben, während du Person oder der Personen nennen, die das es in deiner Arbeit zeigst, aber wir müssen nur einen Fotografen erwähnen oder Pixel angeben , das ist nicht notwendig, aber immer willkommen Es ist nicht notwendig, dass du das tun musst, aber wenn du das willst, ist das eine gute Geste von hier. Sie können diese Fotos und Videos auch anhand von Pixeln ändern , versuchen, kreativ zu sein und sie nach Belieben bearbeiten. Wenn Sie etwas Identifizierbares tun, dürfen Personen nicht bei schlechtem Licht oder auf diese Weise anstößig erscheinen , als ob Sie einfach ihr Bild einfügen und schlechte Bearbeitungen vornehmen können. Nehmen wir an, Sie können es nicht einfach für irgendwelche falschen Zwecke verwenden , wie das alles sagt. Wenn ich jetzt zu meinem Fagin zurückkehre, lösche ich das alles Lösche auch diesen. Jetzt bin ich in meiner Figma-Community hierher gekommen. Ich werde zurückgehen und drei Bilder durchsuchen. Ich nehme einfach die Plug-ins von hier. Ihr könnt sehen, dass ich all diese Dinge hier und hier habe. Ich habe auch die Option für Unsplash. Okay? Wenn ich nur diesen speziellen ausprobieren möchte, kann ich diesen speziellen ausprobieren. Wie kannst du benutzen, wenn ich diesen starte. Mal sehen, was hier erscheinen wird. Komm zu diesen Plugins, und jetzt habe ich auch meinen Splash hier. Wie ihr alle sehen könnt, öffnen sie jetzt die Datei. So wird es auch hier aussehen. Von hier aus können Sie im Grunde verschiedene Voreinstellungen sehen. Sie können einige der redaktionellen Dateien durchsuchen. Wenn ich hier auf dieses Bild klicke, kannst du sehen, dass dieses Bild automatisch heruntergeladen wird. Okay, ich habe ein Bild eingefügt, wie Sie sehen können. Jetzt kann ich das einfach zur Seite legen. Geh zurück und ich passe einfach rein. Ich behalte diesen einfach. Geh zurück und ich kann die Größe nach meinem Bedarf füttern. Okay, Shift und ich kann die Größe dieses Bildes verringern. Zoomen Sie dann wieder hinein. So wird mein Bild aussehen. Wenn ich das einstecke. Das ist einer der einfacheren Wege, wie wir das machen können. die gleiche Weise, wenn ich hier wieder in die Community komme , können Sie sehen, dass ich auch andere Apps habe, von denen ich einfach Bilder herunterladen kann. Okay. Also hier habe ich den Ebay-Generator von Free Pick. kannst du auch benutzen . Okay, von hier aus kann ich den Stecker hinzufügen. Ich hoffe, ihr habt diesen Kurs darüber verstanden , wie man maskiert und wie man fallen kann. Außerdem erfahren Sie, wie Sie einige der besten Bilder und frei verwendbare Bilder hinzufügen können. Ich habe euch die Website gezeigt und jetzt könnt ihr sie auch in eurem Plug-In herunterladen. Ich hoffe, wir sehen uns alle im nächsten Kurs. 17. Komponente und Effekte: Hallo zusammen und heiße euch alle zu einem weiteren Kurs über Figma willkommen zu einem weiteren Kurs über Figma Hier in diesem Kurs werde ich euch beibringen, wie man eine Komposition erstellen kann und wie man verschiedene Arten von Effekten in dieser speziellen Software verwenden kann Effekten in dieser speziellen Software Also hier werde ich euch zeigen, wie man einen Button erstellen kann und wie man ihn anschließend in demselben Projekt verwenden kann , auf einer anderen Seite. Ich werde euch auch zeigen, wie ihr einen Effekt speichern und verschiedene Effekte für verschiedene Ansichten verwenden könnt einen Effekt speichern und verschiedene Effekte für verschiedene Ansichten verwenden . Okay, lass uns mit diesem Kurs beginnen. Jetzt bin ich wieder hier im Arbeitsbereich. Und von hier aus werde ich euch die Komponente dafür zeigen . Zuerst komme ich her, mache einen Kreis und wie Sie sehen können, habe ich diesen Kreis. Mit dieser Komponente kann ich tatsächlich Knöpfe erstellen. Okay. Ich tippe, ich erhöhe die Zahl 226. Wählen Sie diesen aus. Ich lösche das. Nimm es wieder zurück. Von hier aus werde ich die Größe 40, 45 erhöhen. Jetzt tippe ich einfach, vielleicht brauche ich es etwas größer. Ich werde ein Plädoyer schreiben. Ich kann mir aussuchen, was ich will. Ich habe die Umschalttaste gedrückt und diese Taste gedrückt. Klicken Sie einfach darauf bis die gewünschte Größe erreicht ist. Und das ist in Ordnung. Kühn. Wählen Sie das erneut aus. Ich lege diesen zwischen den Kreis. Jetzt kann ich diesem Kreis auch jede Farbe hinzufügen. Angenommen, ich möchte eine rote Farbe oder vielleicht eine grüne Farbe hinzufügen . Ich kann das von hier aus machen. Okay, was ich jetzt tun kann, ist, da ich hier zwei Komponenten habe, kann ich beide von hier aus auswählen. Wie Sie sehen können, habe ich die Möglichkeit Komponente zu erstellen, und die Tastenkombination dafür ist Strg plus A plus K. Ich kann darauf klicken oder hier auf diese Option klicken. Wie Sie sehen können, wird diese Komponente gespeichert, sobald ich sie habe. Lassen Sie mich jetzt eine weitere Seite erstellen. Okay, ich werde eine neue Designdatei erstellen nachdem ich hier eine neue Designdatei erstellt habe. Wenn ich hier zur Option „ Erwartet“ gehe, wenn ich komme und hierher komme, wenn ich versuche, nachzuschauen, okay, wenn ich die Bibliothek erkunde, ja, ich habe hier einen Fehler gemacht. In einer neuen Datei wird es nicht funktionieren, okay. Es wird in einer neuen Datei nicht funktionieren, aber diese Komponente wird im selben Projekt angezeigt . Aber wenn ich versuche, ein neues Projekt zu erstellen, vermutlich von hier aus, wenn ich versuche, eine neue Designdatei zu erstellen, hätte ich diese Komponente. Aber im selben Projekt, auf verschiedenen Seiten, wirst du das sehen können. Lass mich es euch hier zeigen. Ich habe dieses und ich habe eine Seite Nummer zwei erstellt. Wenn ich auf Seite zwei zu den Assets komme, habe ich die lokale Komponente mit Shift. Ich kann das sogar runterschalten. Control-Shift, ich kann die Größe dieses Prints im Grunde verringern. Nochmals, erhöhe das so. Okay. Steuerschicht. Ja, das ist in Ordnung. So kann ich das machen. Wenn ich die Größe verringern möchte, kann ich die Größe hier auch so verringern, wie ich es möchte. Ich habe das, nehme an, ich möchte es verkleinern. Von hier aus kann ich es verringern. Okay. Ich hoffe, du hast diesen Kurs hier verstanden. Lassen Sie uns nun etwas über Effekte lernen. Okay, zum Beispiel, wie wir dafür verschiedene Effekte erzeugen können. Nochmals, ich nehme von hier aus eine andere Form an. Lassen Sie mich ein Polygon nehmen. Jetzt habe ich von hier aus ein Polygon genommen. Ich habe das ausgewählt. Was ich jetzt tun werde, ist , auf die Option Effekte einzugehen. Hier können Sie die Option Schlagschatten sehen. Von hier aus kann ich den Schatten grundsätzlich ändern. Die X-Achse ist geändert, jetzt die Y-Achse. Hier kannst du sehen. Wie du das machen kannst. Trage verschiedene Farben auf. Okay? Von hier aus kannst du auch eine andere Farbe wählen. Sie können auch die Tiefe der Farbe wählen. Okay? Hier, wenn ich das oder X nehme, kann ich auch mit all denen umgehen. Okay? Das ist eine Möglichkeit, wie du das in derselben machen kannst. Lass mich euch etwas über den inneren Schatten zeigen. Das ist der innere Schatten. Auf die gleiche Weise, wie Sie sehen können, können Sie die X- und die Y-Achse tatsächlich ändern. Beide sind sich ziemlich ähnlich. Hier kannst du die Unschärfe sehen. Nun, wenn du die Farbe ändern willst, kannst du die Farbe ändern Von hier aus. Es wird einen inneren Schatten geben, bevor er überstrahlt wurde, aber der Schatten ist in meinem Objekt Okay. Sehen wir uns nun diese dritte Option als Ebenenunschärfe Okay? Wenn ich diese bestimmte Ebene verwischen möchte, wie sehr ich sie verwischen möchte, mache ich es tatsächlich so, okay Dort kannst du den Unschärfeeffekt hier sehen. Sie können den Unschärfeeffekt erneut sehen Wenn ich diesen auswähle und zur letzten Option gehe , der Hintergrundunschärfe, okay, ich kann diesen auch Okay? Ich kann das auch von hier aus machen. Okay? Aber lass mich ein Foto machen , nur um es euch von hier aus zu zeigen. Vielleicht mache ich das gleiche Bild hier. Nun, ich werde dieses Bild einfach irgendwo hier behalten, da ich dieses Bild habe. Lassen Sie mich stattdessen ein Rechteck nehmen. Was jetzt passieren wird, ist, wenn ich einfach ein Rechteck darüber mache, komm her und gehe zur Effekt-Option, mit der ich den Hintergrund verwischen kann Nun, im Grunde nicht das. Gehe zu Drop Shadow. Gehe zu dieser Füllung, ändere einfach die Deckkraft auf zehn. Okay, hier könnt ihr sehen, dass ich mein Bild hier habe, lasst mich diese Komponente irgendwo hin verschieben. Nun, was Sie tun können, es hat einen eigenen Rahmen. Jetzt, wenn ich einmal hier bin, kann ich die Rahmung grundsätzlich ändern Die Farbe des Bildes wird sich ebenfalls ändern, aber das passiert einfach von hier unten Wähle das aus, ich füge hier nur einen kleinen Effekt hinzu. Ich kann auch verschiedene Farben nehmen. Okay? Vielleicht erhöhe ich das ein bisschen. Ich hoffe, ihr könnt die Rahmung nur auf meinem Bild sehen nur auf meinem Bild Manchmal mag es gut aussehen, aber es hängt von dir selbst welches Projekt du im Grunde machst Das ist eine Möglichkeit, wie wir hier mit Effekten spielen können. Ich hoffe ihr habt es verstanden. Und wenn ich hier zwei oder drei Effekte habe und ich den Effekt nicht sehen möchte, kann ich einfach auf diesen klicken. Und ich lasse mir meinen Effekt bei diesem speziellen Effekt nicht zeigen. Wenn ich einen Effekt hinzufügen möchte, kann ich einfach darauf klicken. Sobald ich darauf klicke, wird diese spezielle Einstellung dort gespeichert. Okay, ich hoffe, ihr habt von dieser speziellen Klasse verstanden. nächste Klasse wird die letzte Klasse dieses Tutorials sein, in der ich euch beibringen werde, wie ihr euer Bild aus dieser Feedback-Anwendung exportieren könnt. alle auf euch auf. Hoffe euch alle im nächsten zu sehen. 18. Export von Bildern: Hallo zusammen und willkommen zum Tutorial auf Figma Dies wird also die letzte Klasse des Figma-Tutorials sein die letzte Klasse des Figma-Tutorials Und wenn ihr es bis hierher geschafft habt, hoffe ich, dass euch der Kurs gefallen hat und danke, dass ihr an diesem Kurs teilgenommen habt Und im letzten Kapitel geht es darum, wie Sie diese Bilder aus der jeweiligen Anwendung exportieren können und auf verschiedene Arten und Formate exportieren können. Wenn Sie den gesamten Rahmen exportieren möchten, können Sie dies tun, wenn Sie ein bestimmtes Element exportieren möchten . Im Grunde werde ich euch hier Bilder zeigen, ich werde euch das alles zeigen. Lass uns hier mit dieser letzten Klasse von Figma beginnen. Ich habe meinen Arbeitsplatz. Ich möchte dieses bestimmte Bild von hier auswählen, nur dieses möchte ich exportieren. In diesem Fall werde ich auf die Exportoption zurückgreifen. Klickt hier runter, ihr könnt sehen, in welchem Format ich es nehmen werde, dieses hier. Ich habe das PNG-Format, JPG, SVG und das PDF-Format. Wenn ich eine Vorschau davon haben möchte was ich exportiere, kann ich das hier sehen , was ich exportiere, kann ich das hier sehen. Okay, ich verkleinere nur die Größe dieses. Das exportiere ich auf mein System. Ich exportiere einfach dieses spezielle Ding von hier aus. Komm zur Exportoption. Jetzt werde ich die beiden X auswählen. Okay, das ist nur die Auflösung. Wenn ich auf einem Computer oder PC mit hohem RAM oder mit hoher Geschwindigkeit schaue, dann kann ich diesen auswählen, damit ich eine hohe Auflösung des Bildes erhalte. Statt PNG nehme ich ein JPG und exportiere diesen speziellen Frame. Ich kann wählen, welchen Namen ich geben möchte. Ich schreibe das als Figma-Datei. Jetzt kann ich auswählen, wo ich das platzieren möchte Speichere das hier. Wenn ich jetzt hier zu diesem gehe, meinem Datei-Explorer, gehe ich von hier aus zu meinen Downloads. Sie können sehen, dass ich diese Datei habe. Lass mich sehen, wie es tatsächlich aussieht. Dies ist der, den ich gerade aus der Bildoption habe . Das Gleiche. Lass es mich einfach von hier aus machen. Okay. Angenommen, ich möchte es ein x nehmen, okay? Oder 0,75 x. Exportiere den Frame, speichere diesen, komm und sieh ihn dir auch Da ich das hier heruntergeladen habe, können Sie sehen, dass die Größe hier geringer ist, aber dort waren es zwei x, jetzt sind es hier 0,75 Wenn ich einfach auch auf mein, dieses Bild zoome , ist die Bildqualität deutlich besser Aber hier, auf die gleiche Weise, wenn ich zu dieser Datei komme, wenn ich sie heranzoome, kannst du sehen, dass die Qualität im Vergleich zu der anderen nicht so gut ist , okay? Das ist eine Möglichkeit, wie wir das tun können. Für meinen PC nehme ich grundsätzlich zwei x eins, okay? Du kannst auch drei Eier machen, vier Eier. Wenn Sie hier die Breite ändern möchten, können Sie auch die Breite ändern Das können Sie auf verschiedene Arten verwenden. Wenn Sie diese Exporteinstellung speichern möchten, können Sie einfach hier klicken und von hier aus einfach ein beliebiges Suffix hinzufügen, z. B. wenn Sie 512 verwenden möchten Okay, ich werde diese Datei 512 exportieren und beide Frames hier Komm zu den Downloads und speichere das. Lassen Sie mich hier noch einmal zu dieser Datei zurückkehren, wir sehen, dass Downloads ersetzt werden. Ja, die werde ich hier haben . Okay. Da ich das habe, werde ich hier klicken. Sie können dieses Bild sehen, oder vielleicht ist es dieses. Okay, hier kannst du sehen, dass die Breite dieses Bildes geändert wurde. In diesem Bild hier haben sie die Höhe des Bildes geändert. Ich hoffe, ihr habt verstanden, wie wir euer Bild grundsätzlich verwenden oder aus dieser speziellen Anwendung exportieren können, dann könnt ihr es auch an anderen Stellen verwenden. Das war das letzte Mal. Ich hoffe, ihr habt all die Dinge, die ich erklärt habe, genossen und gelernt , und jetzt seid ihr mit dieser speziellen Option oder dieser speziellen Anwendung vertraut . Übe weiter mit deinem Design, dass je mehr du verwendest, je mehr du daran arbeitest, desto mehr lernst du über alles. Ich habe euch auch einige der Projekte der Projektklasse gegeben , die ihr im Projektpanel einreichen werdet. Ich bin wirklich gespannt, was ihr machen werdet. Bitte schicken Sie mir Ihre Arbeit und lassen Sie mich sehen wie viel Sie aus diesem Tutorial gelernt haben. Macht's gut und auf Wiedersehen alle. 19. Kursprojekt 2: Hallo Leute. Dies ist die Zeit für Klassenprojekt und wir sind in unserem Klassenprojekt Nummer zwei, wo ihr euer eigenes Design machen werdet. Ob es sich um ein Design für eine mobile App oder ein Webseitendesign handelt, es hängt ganz von Ihnen ab. Danach müsst ihr Prototypen erstellen. Ich habe euch bereits im Tutorial gezeigt, wie ihr die paar Schritte machen könnt die paar Schritte machen könnt Ich werde es euch zeigen und euch auch eine Demo geben Lass uns in diesen springen. Als Erstes müssen Sie Ihr eigenes Design erstellen. Und wie ich Ihnen gesagt habe, kann ein Webdesign oder sogar um ein Design für mobile Apps handeln. Stellen Sie sicher, dass Sie mindestens vier Frames verwenden . Aber wenn ihr etwas Größeres macht oder etwas, das aus zehn oder mehr Frames besteht , seid ihr immer willkommen. Ich würde mir wirklich gerne deine Werke ansehen. Okay, danach müsst ihr zur Prototyping-Option gehen, die sich direkt neben der Designoption befindet Und verbinde die Frames mit dem Icon-Symbol mit den Frames Danach schalten Sie den aktuellen Modus Wie ich weiß, gibt es zwei Modi, den Präsenzmodus und den Vorschaumodus. Präsentieren Sie einfach den Modus, da er in einem neuen Fenster geöffnet wird. Teilen Sie danach einfach den Link Ihres Projekts in unserem Projektfenster und ich werde sie mir ansehen. Seht, wie viel Fortschritt ihr gemacht habt was ihr dann alles aus dem Tutorial gelernt habt. Lass mich euch hier eine Demo zeigen. Hier habe ich schon Design gemacht. Okay, dieses Design habe ich euch auch im Tutorial gezeigt. Ich werde euch nur das Prototyping zeigen euch nur das Prototyping da ich das Design bereits gemacht habe Aber ihr macht euer eigenes Design, versucht, diese Dinge zu machen Sie können auch Hilfe von der Figma-Community erhalten. Nimm ihre Schriften, Icons da, bezahlter Stil Ihr könnt die nehmen und eure eigenen machen. Okay, was ich jetzt tun werde , ist zur Prototyp-Option überzugehen. Nachdem ihr hier zur Prototyp-Option gegangen seid, könnt ihr sehen, dass ich die hier auswählen kann, wie ihr sehen könnt. Und ich werde diesen Schwan mit dieser Seite verlinken. Und das kann ich auch ändern. Es sollte sofort oder aufgelöst sein. Lass mich das einfach aufgelöst geben. Ich wähle einfach diesen Button hier aus. Nimm diesen Schwan und verbinde dich damit. Okay? Komm rein, dann das, das Letzte, okay? Und tritt ein. Und ich möchte zu meiner Startseite zurückkehren, wenn ich auf diese spezielle Home-Schaltfläche klicke. Also werde ich einfach alle Home-Buttons mit der ersten Seite verbinden . Treten Sie ein. Okay, dieser. Treten Sie ein. Wählen Sie diesen erneut aus. Ich werde mich damit verbinden und dann auf Enter drücken. Ich habe mein Prototyping gemacht. Wenn ich das Prototyping hier sehen will, könnt ihr sehen, dass ich Icons mit Frames verbunden habe, Frames mit Was ihr jetzt tun werdet, ist, dass ihr hierher kommt und diese aktuelle Option auswählt Okay, nicht die Vorschau auf die Gegenwart. Hier werdet ihr sehen können, dass es auf einer neuen Seite oder einem neuen Fenster geladen wird. Okay, was ich jetzt tun kann, ist, wenn ich auf diese Entspannungsseite hier klicke auf diese Entspannungsseite , du kannst sehen, dass ich dorthin zurückkehren kann. Klick auf diese Seite, hier bin ich. Zurück zu diesem. Wieder auf die gleiche Weise, wie ich es tun kann. Wenn ich auch manuell hierher zurückkehren kann, kann ich auf diesen klicken, er wird direkt zu dieser Seite weitergeleitet. Alles, was ihr tun könnt, ist eure Arbeit mit mir zu teilen. Kommen Sie in der Option „Gemeinsamer Prototyp“ hierher, klicken Sie einfach hier. Okay, jeder mit dem Link. Und stelle es einfach so hin, wie ich es mir ansehen kann , weil ich deinen nicht bearbeiten werde. Okay, wählen Sie einfach diesen aus und Sie können den Link einfach von hier kopieren. Und füge einfach diesen speziellen Link in unsere Projektbox ein. So einfach ist das. Ich hoffe, all deine Arbeiten zu sehen und zu sehen, wie du deine Seite gestaltest. Ich werde sehen, ob Sie nach der Teilnahme an diesem Kurs in der Lage sind, Ihre eigene Webseite zu entwerfen und entsprechend Prototypen zu erstellen. Passt auf euch auf, ich hoffe, eure Arbeit so zu sehen. 20. Kursprojekt 3: Hallo Leute, und jetzt ist es Zeit für Klassenprojekte. Jetzt werdet ihr das Klassenprojekt Nummer drei beim letzten Klassenprojekt machen , wo ihr euren eigenen Gradienten erstellen werdet. Okay? Um einen Farbverlauf zu erstellen, habe ich dir das schon im Tutorial gezeigt. Wenn ihr Probleme habt, könnt ihr euch jederzeit an das Tutorial wenden. Okay, ich zeige euch die Schritte, was alles getan werden muss. Lassen Sie uns dazu kommen. Zuerst müssen Sie eine beliebige Form erstellen, die Form verwenden, damit es sich um einen Stern, ein rechteckiges Feld, ein Quadrat oder ein Polygon handeln kann ein rechteckiges Feld, ein Quadrat oder ein Polygon Okay? Und dann kannst du zur Fülloption gehen. Und von der Fülloption aus können Sie zum Farbverlauf wechseln. Wählen Sie danach einen beliebigen Verlaufsstil, da es grundsätzlich vier Verlaufsstile gibt linearen Radiomodus und den Angulo Okay, ihr könnt von dort irgendeinen wählen. Danach müssen Sie Ihrem Farbverlauf weitere Farben hinzufügen . Mach weiter so. Und mindestens fünf Farben müssen Sie wählen. Danach. Der letzte Schritt besteht darin , diese bestimmte Verlaufsbox oder eine Verlaufsform in Ihr System zu exportieren , diese bestimmte Verlaufsbox oder , und Sie können sie in unseren Projektbereich hochladen. Okay, lass uns sehen, wie ihr das für mich machen werdet . Ich werde einfach eine rechteckige Schachtel nehmen, erst wenn ich zu dieser rechteckigen Schachtel hier gekommen bin. Sie können sehen, dass ich hier die Option zum Ausfüllen habe. Okay? Unter der Pille werde ich zu dieser Option mit Farbverlauf kommen, die von hier aus direkt neben der festen Variante steht. Jetzt habe ich diese Option, linear, radial, eckig und rautenförmig unter dem Farbverlauf. Aber was ich tun werde, ist, das Lineare auszuwählen. Und wie ich euch schon im Tutorial gesagt , verwende ich gerne das Lineare und das Radiale möchte mehr. Ich werde von hier aus eine bestimmte Farbe auswählen. Ich nehme an, ich nehme etwas Dunkles. Okay, ich nehme diese Farbe und füge hier weitere Farben hinzu. Also, welche Farbe werde ich wählen? Lass mich diesen nehmen und dann hier eine weitere Box hinzufügen. Lass mich jetzt etwas Leichteres nehmen. Okay? Wie ihr seht, kann ich es nach meinen Bedürfnissen gestalten und ich kann es so machen, wie ich will. Jetzt habe ich drei und bin wieder rot, oder geh einfach zurück, nimm noch einen und ich nehme einfach eine rote Farbe an. Ich nehme eine rote. Die letzte, die ich hier nehmen werde, ist diese Farbe, und ich nehme eine gelbe. Okay. Und bei all diesen Farben kann ich grundsätzlich einfarbig wählen, wenn ich will, wenn ich das ausblenden will, kann ich das machen. Ich kann dieses Futter hier immer beibehalten, diese fünf Farben hier, wie Sie hier sehen können. Ich kann die Dunkelheit hier ändern. Hier habe ich den Farbverlauf, den ich ausgewählt habe. Und ihr könnt von hier aus auch die Opazität ändern. Wenn du es dunkel haben willst, kannst du auf diese Seite gehen. Ich habe das alles im Tutorial erklärt. Als Nächstes möchte ich diesen exportieren. Wählen Sie dies aus und klicken Sie auf Exportieren. Hier kannst du sehen, ich kann die Vorschau sehen, wie es aussehen wird , wenn es sich um ein PNG handelt. Und hier habe ich die Vorschau eines JP. Ihr könnt herunterladen, was ihr wollt. Drei X Exportrechteck. Ja, das sage ich jetzt einfach. Sehen wir uns das hier an. Ihr könnt hier sehen, dass ich meinen Farbverlauf mache , bei dem ich fünf verschiedene Farben oder fünf verschiedene Farbtöne verwendet habe . Ich werde darauf warten zu sehen, wie ihr euren eigenen Farbverlauf erstellt und möchte sehen, wie ihr Farben erfinden und auch die Gestaltung eurer Farbe verstehen könnt . Ich bin sehr daran interessiert, das alles zu sehen. Passt alle auf euch auf. Ich hoffe nur, von euch allen gute Arbeit zu sehen .