UI Kit Erstellung In Adobe Xd | Aleksandar Cucukovic | Skillshare
Suchen

Playback-Geschwindigkeit


1.0x


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

Schau dir diesen Kurs und Tausende anderer Kurse an

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

Schau dir diesen Kurs und Tausende anderer Kurse an

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

Einheiten dieses Kurses

    • 1.

      Kurs-Einführung

      1:31

    • 2.

      Was sind UI Kits und warum sind sie nützlich

      2:39

    • 3.

      Arten von UI Kits

      7:13

    • 4.

      Welche Komponenten sind wichtig

      6:23

    • 5.

      UI Kit Struktur in Adobe Xd

      7:57

    • 6.

      Erstellung von UI Kit in Adobe Xd

      14:35

    • 7.

      UI Kit VS Designsysteme

      3:43

    • 8.

      Premium VS Kostenlose UI Kits

      3:19

    • 9.

      Erstellen und Verkauf deines UI Kit

      12:05

    • 10.

      Dein Kursprojekt

      0:46

    • 11.

      Fazit Und Ressourcen

      1:57

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

Von der Community generiert

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

171

Teilnehmer:innen

--

Projekte

Über diesen Kurs

UI Kits sind wirklich nützlich, ob du an einem großen oder kleinen Projekt arbeitest, weil sie dir Zeit für sich wiederholende Aufgaben sparen, dich produktiver machen und deinen Kunden oder Entwicklern viel schneller liefern werden.

Hey Designer, mein Name ist Alex und herzlich willkommen in diesem Skillshare Kurs über die Erstellung von UI Kit in Adobe Xd.

In diesem Kurs werden wir uns erkundigen:

  • Was sind UI Kits und wofür können sie verwendet werden
  • Wofür sind die 3 Haupttypen auf den UI-Kits und warum jeder von ihnen gut ist
  • Worin besteht der Unterschied zwischen UI Kits und Designsystemen
  • So wählen Sie wichtige Komponenten für deine eigenen UI Kits
  • So strukturieren, erstellen und speichern Sie dein UI-Kit in Adobe Xd
  • Was ist der Unterschied zwischen kostenlosen und premium und wie du deine eigenen verkaufen kannst, wenn du willst und vieles mehr

Ich freue mich darauf, dich in einem Kurs zu sehen und zeige dir, wie UI deine Produktivität und Geschwindigkeit bei der Arbeit an jedem productivity verbessern können.

Viel Spaß beim kreativen Tag!

Alex

Triff deine:n Kursleiter:in

Teacher Profile Image

Aleksandar Cucukovic

Improving lives, one pixel at a time.

Kursleiter:in

For the last 10 years i have designed websites, products and apps for different companies, big and small.

With my wife i have started 3 startup companies and through the process met some amazing people from all over the world.

For the last five years i have created over 500 design products, improved the lives and workflows of over 100.000 designers from around the world.

Now my mission is to improve the lives of others, and to pass on my knowledge back to the community and to all those who want to learn about the amazing worlds of design and business.

Thank you for reading and have a creative day!

Alex

Vollständiges Profil ansehen

Skills dieses Kurses

Design UX/UI-Design
Level: All Levels

Kursbewertung

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

Warum lohnt sich eine Mitgliedschaft bei Skillshare?

Nimm an prämierten Skillshare Original-Kursen teil

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

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

Lerne von überall aus

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

Transkripte

1. Kurs-Einführung: UI-Kits sind wirklich nützlich, ob Sie an einem kleinen oder großen Projekten arbeiten , weil sie gehen, um Ihnen eine Menge Zeit mit diesen sich wiederholenden Aufgaben zu sparen . Sie werden Ihnen dabei helfen, es Ihren Kunden und Entwicklern viel schneller zu liefern. Und sie werden dich mit mehr Freizeit für dich selbst lassen. Kinder geben ein, mein Name ist Alex, ich bin der Schöpfer eines Produkts und bisher habe ich vier oder 500 Design-Produkte und auch unseren Kursentwickler kreiert . Und bis jetzt habe ich mehr als 20 Kurse erstellt. In dieser Skillshare Klasse werden wir über UI Kits sprechen und warum sie nützlich sind. Wir werden abdecken, was unsere UI-Kits und wofür sie verwendet werden können. Was sind die drei Haupttypen von UI-Kit und warum jeder von ihnen ist gut für. Was ist der Unterschied zwischen UI-Kits und Designsystemen? So wählen Sie wichtige Komponenten für Ihre eigenen UI Kits aus, wie Sie Ihr UI Kit in Adobe XD strukturieren, erstellen und speichern. Und schließlich, was ist der Unterschied zwischen kostenlosen und Premium-UI-Kits und wie Sie Ihre eigenen verkaufen können, wenn Sie wollen, und vieles mehr. Ihr Klassenprojekt für diese Klasse besteht darin, Ihr eigenes UI-Kit zu erstellen. Sie können Adobe XD oder jede andere Software für eine Angelegenheit verwenden, Sie können einfach ein paar Elemente auswählen, sie als JPEG speichern und in Ihre Klassenprojekte hochladen. Und ich bin wirklich aufgeregt zu sehen, was ihr euch einfallen könnt und was sind einige Entwürfe, die ihr für dieses Klassenprojekt erstellen könnt. Also freue ich mich darauf, Sie am Ende der Klasse zu sehen, um Ihnen zu zeigen, wie Sie Kinder sind, verwendet werden können , um Ihre Produktivität zu verbessern, unabhängig davon, an welcher Art von UI-Projekten Sie arbeiten. Also sehe ich dich in der Klasse. 2. Was sind UI-Kits und warum sind sie: Ui-Kits sind im Grunde nur eine Sammlung von verschiedenen Elementen, die Sie für Ihre UI-Design-Projekte verwenden können. Diese Projekte können von mobilen Designprojekten über Website-Design-Projekte bis hin zu Produktdesign-Projekten wie Dashboards und Web-Apps und Projekten dieser Art variieren . Sie können in verschiedenen Dateitypen vorkommen. Zum Beispiel Photoshop, Sketch, Illustrator, Figma, Adobe XD. Und in dieser Klasse werden wir uns auf Adobe XD konzentrieren. Sie können auch Breitenbilder und ohne Bilder sein. Und wir werden einige Unterschiede zwischen diesen beiden Typen untersuchen. Warum ist das eine besser als das andere und umgekehrt? Und in erster Linie werden Sie diese UI-Kits verwenden, um Ihren Workflow zu beschleunigen , da Sie diese sich wiederholende Aufgabe ausführen werden, insbesondere im UI-Design. Beispielsweise erstellen Sie Navigationen für alle Ihre Projekte. Anstatt diese Navigation per se für jedes bestimmte Projekt neu zu erstellen, werden Sie nur einen Navigationstyp erstellen und dann einfach Ihre Idee von diesem einen Navigationstyp erweitern , den ich Ihnen auch später in diese Klasse. Also im Grunde gehen, um Ihren Workflow beim nächsten Mal zu beschleunigen , wenn Sie ein Design-Projekt starten, weil Sie alle diese verschiedenen Dateitypen auf Ihrem Computer gespeichert haben. Und dann werden im Grunde in der Lage sein, alle diese verschiedenen Elemente für alle Ihre verschiedenen Projekte zu verwenden und wiederzuverwenden . Da wir nun in Adobe XD arbeiten werden, arbeiten wir mit Komponenten und Sie werden in der Lage sein , diese Komponenten wiederzuverwenden, um die Farben zu ändern, die Dateitypen zu ändern, die Struktur zu ändern, um den Hintergrundschatten zu ändern, zum Beispiel, um die Farben zu ändern und vieles, vieles mehr. Mit Ihren Kindern werden Sie in der Lage sein, sich für verschiedene Projekte anzupassen. Also, zum Beispiel, wenn Sie in Adobe XD per se erstellen, können Sie Komponenten für zum Beispiel Website-Design im Vollbildmodus erstellen, Nehmen wir an, 1920 x 1080, dann können Sie nach unten gehen und erstellen Responsive skaliert die Größe für Ihre Responsive Design-Projekte. Dasselbe gilt für mobile Designs. Beispielsweise erstellen Sie Ihr UI-Kit für iOS-Apps. Dann möchten Sie dasselbe UI-Kit erstellen, um auf Android zu arbeiten. Es wird viel einfacher, wenn Sie tatsächlich die Dateitypen und Dateien bereits vorbereitet haben, dann, um das von Grund auf neu zu tun. Und das wird es Ihnen ermöglichen, mehr für Ihre Projekte zu berechnen weil Sie in der Lage sein werden, schneller zu liefern. Denn Sie kommen vorbereitet mit diesen Kindern und Sie bereiten es alle diese Elemente für Ihre zukünftigen Projekte vor. Im nächsten Video werden wir diese Unterschiede zwischen UI-Kits mit Bildern und ohne Bilder untersuchen . Was sind einige Vorteile und Nachteile von jedem von ihnen? Und wir sehen uns im nächsten Video. 3. Arten von UI-Kits: In diesem Video werden wir einige Hauptunterschiede von UI-Kits mit Bildern und ohne Bilder untersuchen . Was sind einige Hauptnachteile und Verkaufsargumente für jeden von ihnen? Also lasst uns anfangen. Also hier habe ich UI 8 geöffnet, die eine Website ist, auf der Sie diese UI-Kits tatsächlich kaufen können. Und wir werden ein Dokument über diese Websites ein wenig später in diesem speziellen Video nennen , ich möchte nur auf Unterschiede zwischen UI-Kits mit Bildern und ohne Bilder konzentrieren. Wofür kann jede von ihnen verwendet werden? N, was Sie über das Erstellen dieser UI-Kits für Ihre verschiedenen Arten von Projekten lernen können. Also, was wir hier haben, ist diese Quanten-UIKit, die, wie sie sagen, eine riesige Bibliothek Ihrer Karten für Webdienste ist . Und was sie tatsächlich hier erstellt haben, wie Sie sehen können, sind all diese verschiedenen Komponenten, die im Grunde eine Website suchen Vorlagen die Sie verwenden und für Ihre zukünftigen Projekte wiederverwenden können. Also, warum ist dies nützlich für, wenn ich mit der rechten Maustaste und öffne in der neuen Registerkarte und zoomen, so dass Sie ein bisschen von diesen Details sehen können. Sie können sehen, dass genau hier haben wir, zum Beispiel, diese Sony Dual Schock für schwarzen Controller. Wir haben den Preis, wir haben dieses Symbol. Also im Grunde, was Sie mit diesem Design tun können, ist dass Sie ganz einfach mit diesem exakten Design arbeiten können. Erstellen Sie einfach eine Komponente, zum Beispiel für diesen Dual-Show-Controller. Und sagen wir, dass Sie dies innerhalb der Komponente ersetzen möchten, zum Beispiel, um ein anderes Produkt hinzuzufügen. Nehmen wir an, vielleicht möchten Sie das iPhone verkaufen, dann können Sie Schuldenkomponente dieser speziellen Karte erstellen. Sie können Ihr iPhone-Bild einfach per Drag & Drop ablegen. Sie können die Informationen von diesem iPhone, das Sie zum Verkauf haben, per Drag & Drop ablegen. Und Dario, du musst die Karte nicht noch einmal erstellen, du musst den Schlagschatten nicht hinzufügen. Sie müssen die bestimmte Schriftart nicht auswählen. Sie müssen nicht das Typografie-Layout auswählen, Sie müssen die Hierarchie nicht auswählen. All das wird für Sie im vorherigen Projekt selbst erledigt. Und jetzt können Sie diese exakt gleiche Komponente einfach in Ihren zukünftigen Projekten verwenden und wiederverwenden. Ich werde erklären, dass ein wenig später in der Lektion speziell über Adobe XD, wie Sie diese Komponenten skalieren können, wie sie sie ändern, verwenden und wiederverwenden können usw. Aber in diesem Beispiel, wie gesagt, wollen wir uns auf UI-Kits mit Bildern und ohne Bilder konzentrieren und was Sie jedes dieser vier verwenden können. also zu diesem Beispiel zurückkehren, können Sie sehen, wie viele davon sie haben. Sie haben diesen Verkauf Auto, zum Beispiel, sie haben diese Last mehr Komponenten. Im Grunde sind alle diese Komponenten äußerst wichtig, um in einem UI-Kit zu erstellen , da Sie sie für jedes Projekt verwenden und wiederverwenden werden. Also in den Negationen, Fußzeilen, Blogkarten, sind scharfe Gegenstände und so weiter. All diese werden also wirklich nützlich sein, um für Ihre zukünftigen Projekte zu haben. Wenn wir uns diese ansehen, die Plattform unser Wireframe-Kit genannt wird. Also, was ist der Unterschied zwischen dem hier und dem hier? Grundsätzlich Wire-Frame Kinder sind diese UI-Kits ohne Bilder und Sie können sie online finden, wo Sie suchen. Und ich empfehle Ihnen wirklich, diese Wireframe-Typen oder UI-Kits zu erstellen. Warum? Da Sie Bilder immer per Drag & Drop an die Stellen dieser Wireframing-Kits ziehen können und Sie sich nicht mit diesen riesigen Dateitypen anmelden müssen , da offensichtlich eine Software, die Sie verwenden, wenn Sie keine Bilder in Ihren Designs enthalten haben, Ihre Dateitypen werden viel kleiner sein. Es wird viel einfacher sein, mit diesen Dateien zu arbeiten. Dann, wenn Sie sie mit Bildern haben, wird es auch viel einfacher sein. Um diese Wireframe-Kinder Ihren Kunden zu zeigen und ihnen einfach zu sagen, stellen Sie sich vor, Bilder in Seite des Bildplatzhalters einzufügen, zum Beispiel können Sie die Farbe ändern. Nehmen wir an, Sie können mit Ihrem Kunden sprechen, es kann diese Idee kommunizieren. Zum Beispiel wird das Bild blau sein, wie in diesem Fall hier, damit sie wissen können, okay, also wird dieser Hintergrund nur Bild sein. Es wird also viel einfacher für sie sein zu verstehen und in ihrem Kopf zu visualisieren, dass das Bild dorthin gehen wird. Was für Sie drin ist, wird viel einfacher zu ändern und Änderungen an diesen Wireframeing-Kits als an den UI-Kits vornehmen , weil Sie mit Bildern bekommen werden viel schwieriger zu ändern weil Sie werden immer eine Art von Bildstruktur folgen. Sie werden immer eine Art von Bild einbeziehen, vielleicht werden Sie nicht Ihre Farben aus Ihren Bildern probieren. Daher ist es gut, viel einfacher zu sein, Farben zu verwenden , um alle diese Elemente von Wireframe-Kindern zu verwenden, da Sie später keine Bilder an Ort und Stelle haben, wenn Sie die Struktur mit Ihrem Kunden während Ihrer Arbeit an diesem -Projekt können Sie Bilder einfach per Drag & Drop hineinziehen und dann einfach das Design ein wenig anpassen. Zum Beispiel, fügen Sie den Schlagschatten hier und da, nur um die Schaltfläche zu machen, zum Beispiel, auffällig oder Navigation oder Heldenbild oder den Text. Vielleicht sollten Sie die Textfarbe je nach Bild Ihrer Wahl von dunkel zu hell und umgekehrt ändern . Daher sind Wireframe-Kinder meiner Meinung nach viel nützlicher. Und dann UI-Kits, weil Sie Kinder sind, wie gesagt, folgen Sie der Struktur der Bilder und passen sich daher an diese Struktur und diese Bilder an, während Wireframe-Kinder einfach die Struktur selbst verwenden und sich an nichts anpassen. Sie können Bilder einfach per Drag & Drop später hinein ziehen. Nun endlich gibt es noch eine Sache, die ich erwähnen wollte, und das sind Flussdiagramme. Und im Grunde für Flussdiagramme kommen in verschiedenen Arten von Dateigrößen, verschiedenen Arten von Elementen. Und das ist etwas, das Schema mobile Flussdiagramm genannt wird. Und ich kann Ihnen ein wenig später eines meiner Flussdiagrammprodukte zeigen, weil ich es muss, und ich werde Ihnen zeigen, wie ich sie erstellt habe und wie Sie sie nutzen können , um Ideen mit Ihren Kunden zu kommunizieren, indem Sie zu diesem zurückkehren, weil Sie kann es nicht sehen. Hier. Ich öffne es in einem neuen Tab, und hier können Sie sehen, dass sie keine echten Texte verwenden, sie verwenden keine echten Bilder. Sie verwenden nur diese Platzhalter. Zum Beispiel wird dies Absatz sein, wird Titel Untertitel sein. Dies ist das Bild, das ist die Schaltfläche, das ist die Paginierung ist Sie sehen können, dass sie Symbole für die Navigation und für die Suche verwenden. Verwenden Sie diese sozialen Symbole für Facebook und Twitter. Und was Sie damit tun können, ist, dass Sie Ihre Ideen und viel schneller mit Ihrem Kunden kommunizieren können. Denn wieder einmal, wie bei Wireframing-Kits und neuen KI-Kindern, verschwenden Sie Ihre Zeit nicht, indem Sie diese Bilder auswählen, indem Sie diese Farben auswählen. Sie erstellen einfach Layouts, die Sie kommunizieren und mit Ihrem Kunden teilen können. Sobald diese Layouts genehmigt wurden, können Sie an den Details arbeiten. Deshalb sind diese Wireframing-Kits, UI-Kits und diese Flussdiagramme so wichtig für Sie zu erstellen. Sie können sich also vorstellen, dass Sie mit der Arbeit an einem Flussdiagramm beginnen können , zum Beispiel für Ihren Kunden. Dann, nachdem dieses Projekt abgeschlossen ist, können Sie dieses Flussdiagramm einfach in Bezug auf eine UIKit-Erstellung für Ihr nächstes Projekt wiederverwenden Sie können einfach Komponenten für Formen, für Farben, für Schriftarten, für Bilder, für Schaltflächen, und so weiter. Und Sie können diese Komponenten einfach in Ihren zukünftigen Projekten verwenden und wiederverwenden, was wiederum wird Ihnen viel Zeit sparen und er wird Ihnen helfen, mit Ihren Projekten schneller weiterzumachen , wird es Ihnen ermöglichen, viel mehr da Sie viel weniger Zeit in jedem Projekt verbringen werden, da Sie bereits alle diese Komponenten erstellt haben. 4. Welche Komponenten sind wichtiges: Wenn es um die Struktur geht, sind diese Komponenten wirklich wichtig und weniger wichtig. Es liegt also wirklich an Ihnen, welche Arten von Komponenten Sie verwenden möchten. Nehmen wir an, dass Sie die ganze Zeit an Blog-Projekten arbeiten. Werfen Sie einen Blick auf Ihre bisherigen Arbeiten und verstehen Sie, welche Arten von Komponenten Sie in der Vergangenheit verwendet haben. Offensichtlich sind eine Art Suchleiste, eine Art Navigationsfußzeile, vielleicht sogar Schieberegler, eine Art Navigationsfußzeile, vielleicht sogar Schieberegler, Heldenbilder, Türen wirklich obligatorisch, weil dies Arten von Elementen sind , die Sie die ganze Zeit in Ihren Projekten verwenden werden. Aber abhängig von der Nische sind Sie unabhängig von den Projekten, für die Sie zuvor arbeiten werden, und Sie sind derjenige, der bestimmen wird, welche Arten dieser Elemente Sie in Ihren UI-Kits verwenden werden. Also werde ich Ihnen mit den vorherigen Beispielen zeigen, die ich Ihnen gezeigt habe. Und Sie können bestimmen, welche Arten von Elementen Sie wählen können. Und in den nächsten Videos in dieser Klasse werde ich Ihnen zeigen, welche Arten von Elementen in der Vergangenheit verwendet werden und was Sie daraus lernen können. also auf diese Beispiele zurückgehen, die ich zuvor gezeigt habe, können Sie sehen, dass sie E-Commerce genau hier haben. Und wenn ich hier den ganzen Weg scrollen, damit wir E-Commerce sehen können. Und wenn ich den ganzen Weg nach unten scrolle, können Sie Dashboard sehen. Wenn Sie also an Projekten arbeiten, die all diese Elemente erfordern, können Sie sich vorstellen, wie zeitraubend das Ziel dieser Elemente ist. So können Sie sie einmal erstellen und dann einfach wiederverwenden, indem Sie Farben ändern, zum Beispiel die Position dieser verschiedenen Texte ändern und so weiter. Wenn wir den ganzen Weg nach unten scrollen, haben wir Firmenkarten. So können diese, zum Beispiel, Team-Portfolio Über uns, Referenzen, Funktionen, Preise und solche Dinge sein. Wenn wir den ganzen Weg nach unten scrollen, können wir Musik und Grafikkarten sehen. Diese sind vielleicht nicht so wichtig wie diese vorherigen, und sie können von Projekt zu Projekt variieren. Nachrichten und Zeitschriftenkarten. Wieder einmal, wenn Sie ständig an Blogprojekten arbeiten, sind diese wirklich entscheidend. Wenn Sie also eine erstellen, wird es viel einfacher sein , sie wiederzuverwenden und sie für zukünftige Projekte neu zu verwenden. Und Sie können hier sehen, also haben wir verschiedene Arten von Navigation. Wir haben diese Social Cards, die je nach Projekt, an dem Sie arbeiten,wieder je nach Projekt, an dem Sie arbeiten, wichtig oder weniger wichtig sein können. Wir haben Basiselemente und Style-Karten. So haben wir Basiselemente wie diese Navigation, Fußzeilen, Krümel. Wir haben diese verschiedenen Symbole, Lader, Schieberegler, Schaltflächen, Farben. Und schließlich haben Sie diese Beispielseiten in diesem speziellen Quanten-UIKit. Und Sie können sich diese Seiten für Inspiration ansehen und sehen, wo sie all diese verschiedenen Elemente verwendet haben. Wenn wir einen Blick auf Jump'n'Run werfen, haben wir Header, wir haben Inhalte. Also noch einmal, Blöcke von Inhalten, Schieberegler, einfache Gitter. Also im Grunde Bilder in einem Raster links und rechts. Wir haben dieses Master-Gitter. Wir haben Futures-Linke Funktionen, richtig. Zum Beispiel mit Handy-Mockup, mit Website-Mockup, sorry, Laptop-Mockup mit Tablet-Mockup. Wir haben wieder unterschiedliche Portfolios, je nachdem, wo Sie arbeiten, in welcher Natur, wann Sie das eine oder andere verwenden. Wir haben E-Commerce, besonders wichtig, wenn Sie mit E-Commerce-Websites arbeiten. Wir haben Blog-Karten. Und natürlich können Sie diese verschiedenen Komponenten verwenden und wiederverwenden. Zum Beispiel diese Blockkarten. Sie müssen sie nicht für Blog-Websites verwenden. Sie können sie zum Beispiel für E-Commerce-Websites verwenden. Das ist die Schönheit dieser UI-Kits. Sie können diese Karten einfach in Ihren zukünftigen Projekten neu verwenden und sie einfach anpassen, um für das jeweilige Projekt zu arbeiten. So können wir Team-Testimonials, Preisställe, Call to Action haben. Diese Preistabellen sind besonders langweilig zu erstellen, weil Sie im Grunde sind sagen wir, Sie haben, zum Beispiel, 20 verschiedene Beispiele dieser Preistabellen online. Und all diese anderen Beispiele sind nur Variationen dieser Beispiele. Warum sollten Sie Zeit verschwenden, die ganze Zeit neu zu erstellen? Alle diese Elemente einfach erstellen, zum Beispiel, fünf oder sechs Preistabellen auf einmal dort, einfach neu verwenden Sie sie für Ihre zukünftigen Projekte wird Ihnen eine Menge Zeit sparen, vor allem mit diesen langweiligen Details, wo Sie haben eine Mehrheit dieser verschiedenen Möglichkeiten, vor allem mit der Preistabelle. So haben Sie Optionen, Sie haben Preise, einen monatlichen Plan, Jahresplan. All diese Details werden Sie viel Zeit brauchen , um für jedes bestimmte Projekt zu erstellen. Also, sie in einem UI-Kit zu haben, wird Ihnen viel Zeit sparen. Wenn wir hier einen Blick werfen, rufen Sie zum Handeln, besonders wichtig bei all diesen Promo-Karten, haben wir Formulare und Kontakte. Wieder einmal, mit diesen Formen, wie viele dieser Variationen können Sie tatsächlich haben? Nehmen wir an, Sie können zum Beispiel 1520 Kontaktformulare erstellen . Da gehst du. Sie können sie entweder für alle Ihre zukünftigen Projekte verwenden. Und Kopf- und Fußzeilen, vor allem langweilig für mich, wegen der Wiederholungsfähigkeit zu erstellen , und sie verwenden all diese verschiedenen Elemente. Zum Beispiel, Client-Logo wird links, rechts, Mitte unten, und das ist es im Grunde. So können Sie sehen, wenn Sie mit der Erstellung dieser UI-Kits beginnen, können Sie ein Bild davon bekommen, welche Arten von Elementen Sie benötigen, um mehr zu erstellen, welche Arten von Elementen Sie weniger offensichtlich für jede Art von Nische erstellen müssen , in der Sie sich befinden, irgendeine Art von einem Kontaktformular wird gut sein, um einzuschließen. Aber im Grunde, wenn Sie beginnen zu erstellen, können Sie Kontaktformular für dieses, aus diesem Projekt verwenden. Nutzen Sie das Kontaktformular aus diesem Projekt und passen Sie sich einfach an Ihre zukünftigen Projekte an. Das ist die ganze Sicht, die ich Kind, und das ist, warum ich denke, sie sind extrem nützlich zu haben und zu schaffen. Und offensichtlich wird diese UIKit Schöpfung nicht einfach kommen, wird nicht schnell kommen. Dies ist der Prozess, den Sie während Ihrer Karriere verwenden und wiederverwenden werden. So können Sie im Grunde einige Elemente verschrotten , die in Bezug auf Stil, in Bezug auf die Funktion nicht mehr relevant sind. Vielleicht werden einige Elemente nicht mehr in der Industrie oder in mehr verwendet, so dass Sie sie einfach verschrotten können. Verwenden Sie Elemente, die Ende sind, passen Sie sich einfach an das UI-Kit an, das Sie verwenden. Das ist also die Schönheit der UI-Kits und deshalb liebe ich sie so sehr. Und ich denke, Sie sollten auch anfangen, sie zu erkunden. 5. UI in Adobe Xd: In diesem Video zeige ich Ihnen einige Strukturideen für Ihre UI-Kits in Adobe XD. Ich werde Ihnen meine Beispiele zeigen, weil ich diese UI- und UX-Kinder seit Jahren erstelle. Und ich habe über 500 Design-Produkte in meinem Shop Web Dawn bei dotnet, ich werde die Links zu allem, worüber ich spreche, im PDF hinterlassen. Sie können einfach auf diese Links klicken und besuchen und erkunden, wenn Sie interessiert sind, auch Burgess, all diese verschiedenen Produkte, die ich erwähnt n, die ich in der Zukunft erwähnen werde. Sobald Sie tatsächlich zu diesen Verkaufstypen und diesen Profilen auf diesen Websites gelangen, können Sie Ihre Designs verkaufen. Lassen Sie uns jedoch vorerst die Struktur dieser Kinder untersuchen, wie sie in Adobe XD arbeiten können und wie Sie daraus lernen und Ihre eigenen erstellen können. Also, was ich hier habe, ist der Convert Landing Page Builder, das ist das Produkt, das wir vor einer Weile erstellt haben. Und das ist das Wireframe-Kit, offensichtlich, wie Sie sehen können. Und wenn ich ein wenig näher zoomen, aber Sie können sehen, genau hier haben wir die Navigation, wir haben die Kopfzeilen, Geschichte, Funktionen, Vorteile, Promo, Testimonials, Team, Preisgestaltung, andere. Und für all diese haben wir mehrere Optionen, offensichtlich, weil dies der Landing Page-Builder ist. Dies sind die Elemente, die für die Mehrheit der Landingpages verwendet werden. Und das ist für jemanden gedacht, der diese Landing Pages ständig erstellt , weil die meisten dieser Unternehmen dort sind, diese Landing Pages die ganze Zeit erstellen, zum Beispiel für ihre Kick-Starting-Kampagnen, für ihre Produkteinführungen, für ihr Produkt zu einem Promos für alle diese Kampagnen, für Facebook-Anzeigen, für Instagram-Anzeigen, YouTube-Anzeigen und so weiter. So sind Landingpages dafür extrem wichtig. Dieses spezielle Produkt ist für die Arbeit mit Landing Pages gedacht. Also wieder, wir gehen zurück in die Nische. Was ist Ihre Nische und was ist Ihre Art von Projekt, an dem Sie arbeiten? Sie werden Komponenten erstellen, die in dieser Nische funktionieren werden. Wenn wir zum Beispiel hier zurück springen, kann ich sehen, dass das 1400 ist. Und ich kann hier reinspringen, um eine neue Zeichenfläche zu erstellen. Und ich kann direkt hier springen, das hier erschaffen. Klicken Sie hier und passen Sie einfach auf 1400 an. Damit alle unsere Elemente funktionieren. Und ich werde es weiter ausbauen. Also, was ich tun kann, ist, kann ich, zum Beispiel, klicken Sie auf diese Navigation Control C, klicken Sie rechts hier, steuern Sie V. Und ich kann, zum Beispiel, klicken Sie rechts hier, steuern Sie C, steuern V, und passen Sie dies an. Ich kann sie sogar innerhalb des Stapels legen, und dann kann ich einfach Drag & Drop innerhalb eines Stapels, aber wir können das auch später tun. Zum Beispiel möchte ich diese verschiedenen Funktionen zeigen. Also lassen Sie uns sehen, wo die Funktionen sind. Hier sind sie. So kann ich zum Beispiel dieses eine Steuerelement C verwenden, Kontrolle V. Und Sie können sehen, wie einfach die Erstellung dieser Websites ist. Sagen wir das hier, Positionen genau hier. Vielleicht möchte ich das jetzt benutzen. Positionieren Sie sich genau hier. Vielleicht möchte ich das hier benutzen. So wie so. Und sagen wir, jetzt kommt die Zeit für die Preisgestaltung, setzen Sie es hier. Und vielleicht so etwas. Ich möchte die Leute hier noch mehr Fußzeile überzeugen. Und Position spielt keine Rolle. Leisten Sie sich einen Moment und Sie werden sehen, warum in nur einer Sekunde. Also legen Sie sie hier hin. Und sagen wir, jetzt, wo Ihre Zielseite abgeschlossen ist, können Sie alle auswählen, Control G drücken, um sie in eine Gruppe zu setzen und sie dann in einen Stapel zu legen. Dies ist der vertikale Stapel und ich kann zum Beispiel den Abstand von 150 zwischen ihnen und drücken Sie die Eingabetaste oder Return. Und jetzt haben wir einen gleichmäßigen Abstand zwischen all unseren Elementen. Ich kann sie alle so an den Anfang der Seite setzen. Und zum Beispiel, ich will nicht, dass es 150 dafür sind. So kann ich einfach nur dieses auf 0 einstellen. Und all diese anderen werden 150 für den Abstand haben. So können Sie sehen, wie einfach es ist, Ihre Zielseite zu erstellen. Sie können hier doppelklicken, um es hier zu schließen. Und zum Beispiel, nehmen wir an, dass die Kopie fertig ist und Sie einige Änderungen an den Bildern vornehmen möchten. Sie können Ihre Bilder einfach per Drag & Drop innerhalb von hier, platzieren Sie ihn und dann einfach Änderungen vornehmen. Zum Beispiel haben wir dieses Bild-Icon direkt hier. Ich kann einfach auf Löschen klicken, um es zu entfernen. Und ich kann zum Beispiel die Deckkraft meines Bildes senken, um es ein bisschen mehr hervorzuheben. Zum Beispiel möchte ich hier ein zusätzliches Bild hinzufügen. Vielleicht dieses Bild, Ich möchte etwas für das Video hinzufügen. Vielleicht. Vielleicht wird dieses Bild funktionieren, so dass Sie sehen können , wie einfach es ist, mit diesen verschiedenen Bildern zu arbeiten. Also kann ich es für vielleicht treffen, für 40 Prozent Fettleibigkeit. Vielleicht kann ich hier ein anderes Augensymbol verwenden. Und vielleicht möchte ich das sagen, ich weiß nicht, etwas runder zu sein . Also kann ich gleich hier springen, 2004 eingeben, den Eckenradius. Wenn ich das tun möchte, können Sie dies so anpassen, dass Sie das Bild bekommen, wie einfach es ist, diese Elemente zu erstellen. Das ist also im Grunde meine Struktur und wie mein Team und ich jahrelang an diesen Strukturen arbeiten. Und ich werde Ihnen eine andere Struktur für mobile Kinder zeigen. Und das ist gesprächig UIKit. Und Sie können sehen, dass wir Bilder hier haben. Offensichtlich wird ganz einfach sein, alle diese Bilder zu ersetzen. Sie werden nur genau die gleiche Struktur verwenden. Also, wenn ich hier einen Blick schaue, möchte ich vielleicht diese Bilder so anpassen, dass ich es und dieses auswählen kann, und vielleicht kann ich zwei verschiedene Bilder auswählen, Drag & Drop sie hinein. Und ich möchte dieses zum Beispiel verwenden, damit Sie die Idee bekommen, wie schnell es ist. Aber was Sie auch tun können, ist hier klicken, und hier haben wir alle diese verschiedenen Elemente. Jetzt sind Elemente wirklich nützlich. Wir haben dieses Hauptblau und ich möchte mit der rechten Maustaste klicken, auf Bearbeiten klicken, und vielleicht möchte ich es zu rot ändern. Also beachten Sie, wie es in all unseren verschiedenen Änderungen gilt und einfach angepasst, um zu lesen. Ich kann auch Control Z gehen, um das rückgängig zu machen. Wir können auch die Schriftgröße und Schriftauswahl ändern. Wir können die Schriftgewichte ändern. Wir können all diese verschiedenen Elemente ändern. Also, was ich tun kann, ist auf Bearbeiten klicken. Zum Beispiel möchte ich einige andere Formulare wie Open Sans auswählen, zum Beispiel drücken Sie die Eingabetaste, und es wird diese Änderung in unserem gesamten Design anwenden. So können Sie sehen, wie einfach und einfach das ist. Außerdem können wir alle diese verschiedenen Komponenten haben. Wir können uns selbständig ändern. So können Sie zum Beispiel sehen, dass wir diese Punkte haben, die schwarz sind, genau hier, hier, genau hier, genau hier. Während unseres Designs und alles andere, was schwarz ist, wollen wir es in etwas Wildes verwandeln, wie zum Beispiel noch einmal lesen. So können Sie sehen, wo immer wir diese Farbe hatten, es wird in der gesamten Kunst Design gelten. Und es wird überall dort gelten, wo wir es hatten. Deshalb sind alle diese Komponenten äußerst nützlich. Und im nächsten Beispiel und im nächsten Video werde ich Ihnen zeigen, wie Sie Ihr bestehendes Design in UIKit verwandeln können , weil Sie diese UI-Kits nicht kaufen werden, wo jedes einzelne Projekt, und ich denke, es ist viel besser Ansatz, obwohl ich diese UAC-Kinder verkaufe, ist es viel, viel besserer Ansatz, entweder mit einem Premium-UIKit nur für Ihre Struktur zu beginnen, nur für dieses Element, nur für einige langweilige Elemente, die Sie dann für Ihre eigenen Projekte und dann erstellen Sie Ihre eigene UIKit mit diesen Elementen, mit diesen Taktiken und Techniken, die für Ihren speziellen Anwendungsfall funktionieren wird. Weil ich noch einmal in die Nische gehe. Da Sie sich zum Beispiel in einer Reisennische befinden, funktionieren Elemente, die für Sie in Ihrem Projekt funktionierten , möglicherweise nicht für jemanden, der sich in einer Blognische befindet , z. B. weil sie unterschiedliche Elemente benötigen. Im nächsten Video werde ich Ihnen zeigen, wie Sie Ihr bestehendes Projekt in UI-Kits umwandeln können . 6. UI-Kit Erstellen in Adobe Xd: In diesem Video zeige ich Ihnen, wie Sie Ihr bestehendes Projekt in UIKit umwandeln und es dann für Ihre zukünftigen Projekte neu verwenden können. Dieser Ansatz kann für verschiedene Projekte verwendet werden, die so groß und klein sind. Und Sie können bestimmte Elemente verwenden oder Sie können alle Elemente verwenden und dann einfach von dort weiter gehen. Sie können einen Elementtyp verwenden, z. B. Wenn dies etwas ist, das sich die ganze Zeit in Ihrem Projekt wiederholt, oder Sie können verschiedene Arten von Elementen verwenden. Zum Beispiel sowohl Navigationen, Heldenbilder, Fußzeilen, Blog-Herzen und all diese Arten von Elementen. Also werde ich Ihnen in diesem Beispiel oder für das vorhandene Projekt zeigen , wie Sie es in ein UI-Kit verwandeln können. Dies ist also das Projekt, das ich für einen meiner vorherigen Kurse erstellt habe. Ich werde es verlassen, lassen Sie den Link dazu in der PDF-Datei, damit Sie einen Blick darauf werfen können, wenn Sie interessiert sind. Also alle diese Elemente werden in dieser Klasse erstellt. So ist es schon 20 Stunden lang n wieder, ich werde den Link in der PDF verlassen, so dass Sie schnell darauf zugreifen können. Und was wir hier haben, sind verschiedene Komponenten für die Farben, Charakterstile, all diese Komponenten für all diese verschiedenen Karten, wir haben verschiedene Symbole, wir haben verschiedene Strukturen genau hier. Wir haben das Logo, wir haben die Pfeilkarten und vieles mehr. Also, was Sie tun können, ist, wenn ich hier klicken, wieder, wir sind 1920 statt 1400, wie wir es letztes Mal getan haben. Ich kann also auf meine Zeichenfläche klicken, um einen neuen Flughafen zu erstellen. Oder ich kann einfach das vorhandene duplizieren. Was noch besser ist, was ich tun kann, ist hier zur Datei zu gehen. Und dann Neu, tut mir leid, wenn es ein wenig hinkt weil ich alle diese Elemente in meinem Computer ausführe. Und diese Datei ist ziemlich riesig. Also werde ich eine neue Datei erstellen, und ich werde einfach einige dieser verschiedenen Elemente in meinem Projekt wiederverwenden. Oder es ist ein hinzugefügtes, wir hatten dieses Projekt erstellt. Was ich tun werde, ist hier zu diesem Website-Design zu springen. Und ich werde den ganzen Weg nach hier springen, Control C drücken und dann werde ich zu dem Projekt wechseln, das wir gerade erstellt haben, drücken Sie Control V, also kann ich dort einfach in dieses Design einfügen. Und was ich auch tun kann, ist zurück zu hier zu springen. Und vielleicht kann ich einander gebrauchen. Lasst uns diese eine Kontrolle C benutzen und ich werde in dieses Projekt springen, Kontrolle V treffen und dann, wenn wir gehen, nur um uns ein bisschen Zeit zu sparen, was ich tun werde, ist, dass ich das wirklich ausschalten werde. So skillet, und wie Sie sehen können, sind einige Elemente bereits in unserem vorherigen Projekt eingefügt, wie all diese verschiedenen Symbole. Aber wir haben keine Farben und Zeichenstile und wir können sie separat bearbeiten. Was ich Ihnen zeigen wollte, ist das. Also werde ich das vergrößern. Und lassen Sie uns sagen, dass ich diese Navigation verwenden möchte, aber zuerst verwenden wir das gleiche Raster. Also, wenn ich es einschalte, haben wir, mal sehen, 12 Spalten. Also 60, 82, und ich werde dasselbe dafür tun. Also haben wir 60, 82. Da gehen wir. Es ist also dasselbe wie dieses. Und ich werde Ihre Grundhaftigkeit dieser Gitterlinien so senken. Also lassen Sie uns sagen, dass ich diesen Navigationskreis verwenden möchte, drücken Sie Control C, fügen Sie ihn hier ein. Und was ich tun kann, ist es hier zu positionieren. Und sagen wir, dass dies unsere erste Navigation ist. Gehen wir zu unseren Schichten. So können wir zum Beispiel Nav 1 verwenden. Und was ich auch tun kann, ist es aufzuheben. Also lasst uns mit der rechten Maustaste. Lass mich sehen, wo es ist. Nur Komponente. Da gehen wir. Das ist also das eine Ende. Wir können es erstellen, um lokale Komponente zu sein. So können wir Control K drücken, wenn wir wollen, und wir können verschiedene Zustände daraus erstellen. Also kann ich hier klicken und zum Beispiel einen großen Button, big btn eingeben . Und was ich hier tun möchte, ist, dass ich einfach innen doppelklicken und diese Schaltfläche erweitern möchte , um unsere Navigationselemente mehr zu hören und vielleicht zu verschieben. Nehmen wir an, ich möchte sie hier ausrichten, oder vielleicht sogar noch besser in der Mitte so. Wenn wir also einen Blick auf diesen Standardzustand und diesen Zustand werfen, haben wir diese beiden getrennten Zustände. Was Sie mit diesem tun können, ist einfach Alt in Ihrem Standardzustand zu halten. Position auch hier. Ich weiß nicht, sagen wir 60, dann benutze diesen Zustand. Und schon haben Sie zwei Arten von verschiedenen Navigationen. Also sagen wir, ich möchte eine andere erstellen. So können wir zurück zum Standardzustand, der dieser ist, einen neuen Zustand erstellen. Und zum Beispiel kann ich so etwas ohne Text, so etwas. Also, in diesem Zustand, was wir tun werden, ist im Grunde gehen und entfernen Sie unsere Texte. Öffnen Sie also, wählen Sie unseren Text, klicken Sie auf Löschen. Jetzt sind wir nur noch mit unserem Knopf übrig. Und wir können diese Schaltfläche entweder erweitern, lassen Sie sie so. Es liegt alles wirklich an dir. Also, was ich tun werde, ist wählen Sie dieses, verschieben Sie es auf 60, und klicken Sie ohne Text. Also gehen wir hin. Wir haben unsere drei verschiedenen Elemente und drei verschiedene Navigationselemente bereits erstellt. Aber Sie können auch tun, ist diese organisieren. Und das mache ich wirklich gerne. Also das ist jetzt eins, das ist jetzt zwei. Und das wird nav drei sein. Und lassen Sie mich Ihnen nur ein weiteres Beispiel geben, damit wir zu diesem Standardbeispiel zurückkehren können und eines ohne Schaltfläche oder ohne BTN erstellen können. Was wir also tun werden, ist im Grunde einen ausgewählten Punkt zu machen. Also von hier sind wir 40 und ich werde eine Schaltfläche gelöscht und wählen Sie alle unsere Navigationselemente. So wie so. Positionieren Sie sie auf die Kantenverschiebung 1234. Also sind wir 40 von diesem Rand entfernt, genauso wie wir mit dieser Welle sind. Und im Grunde werde ich das noch einmal machen. Also werde ich meine ältere Option halten, wählen Sie wissen BTM und Terry gehen, ich kann zurück zum Standardzustand und Sie können sehen, wie schnell das ist, wie schnell das ist. Und es wird Ihnen ein Haufen Zeit sparen. Ich werde das auf einen großen Knopf so umschalten. So wird es Ihnen später eine Menge Zeit für Ihre zukünftigen Projekte sparen. Und Sie haben bereits gesehen, wie einfach das ist, einfach in vorheriges Video zu kopieren und einzufügen. Aber Sie können auch für diese Heldenbilder tun, zum Beispiel. Also lassen Sie uns Control C drücken. Ich gehe zu V. Und was ich Ihnen empfehle, ist, dies in Navigation umzubenennen und einen separaten Flughafen für diese Heldenbilder zum Beispiel zu erstellen. wir in diesem Fall, dass wir diese Leute auf dieser Seite haben. Und lassen Sie es uns duplizieren. Kontrollieren Sie J, sorry, Control D, so und positionieren Sie es auf 60. Also noch einmal, dies wird in separaten Zeichenflächen sein, also lassen Sie uns das tatsächlich erstellen. Also werde ich diese beiden entfernen. Und Sie können Fußzeilen innerhalb Ihrer Navigation positionieren, wenn Sie möchten. Es liegt bereits an Ihnen, wie Sie sie erstellen möchten. Und ich werde diesen Helden nennen, zum Beispiel. Denn diese Heldenbilder sind etwas, das Sie den Großteil Ihrer Zeit verbringen werden. Sagen wir also, dass für dieses zweite Beispiel, das Hero 2 sein wird. Also dieser Held eins. Beachten Sie, dass ich aus diesen Komponenten keine Komponenten erstelle. Ich möchte Ihnen diesen zweiten Ansatz zeigen. Wie ich Ihnen bereits mit diesen gezeigt habe, sind Komponenten offensichtlich extrem einfach zu erstellen, aber Sie können auch ohne Komponenten gehen und Sie können diese separaten Elemente einfach für sich selbst erstellen. Also lassen Sie uns sagen, dass ich diesen Text nach rechts positionieren möchte. Was wir mit diesen tun können, ist, dass wir diese beiden in einer Gruppe positionieren,sie in einen Stapel legen und einfach die Reihenfolge umkehren können sie in einen Stapel legen . Und jetzt ist der Text auf dieser Seite, die Menschen sind auf dieser Seite. Und was wir auch tun können, ist diese Hintergrundelemente zu verwenden. Also diese Heldenform, vielleicht möchte ich sie so umdrehen, und ich möchte sie so positionieren. Und all diese verschiedenen Elemente. Also Hero Elements, ich werde sie hier positionieren. Du bekommst also das Bild, wie einfach das ist. Und ich habe hier auch eine Maske mit meinem Heldenkreis. Also werde ich es hier positionieren. Also gehen wir hin. Wir sind nur ein paar Klicks. Wir haben zwei verschiedene Möglichkeiten, die wir unseren Kunden zeigen können. Was das noch einmal für Sie tun wird, ist, dass wir Ihnen erlauben, viel schneller an diesen Projekten zu arbeiten, vor allem mit diesen sich wiederholenden Aufgaben, wie ich erwähnt habe. Also Navigation, Fußzeilenbilder, und all diese verschiedenen Elemente, die die ganze Zeit wiederholen werden, wie zum Beispiel Preistabellen. Es ist also viel einfacher für Sie als Designer, all diese Variationen in Ihrem Stil zu erstellen , indem Sie Ihre Komponenten verwenden, Ihre Designsprache verwenden, Ihre bevorzugte Schriftart verwenden und Ihre bevorzugten Farben verwenden, und verwenden Sie diese Komponenten dann einfach für Ihre zukünftigen Projekte. Ist das Betrug für Ihre Kunden? Wissen Sie, denn Ihre Kunden wollen nur das Endergebnis. Es ist ihnen egal, wie man zu diesem Endergebnis kommt. Ist das etwas, das Sie umgenutzt haben? Offensichtlich ist es, aber stellen Sie sicher, dass Sie keine Logos verwenden , die Sie zuvor in Ihrem Projekt verwendet haben, und kein Branding verwenden. Zum Beispiel bestimmte Farben in Ihren Markenbüchern, die Sie mit Ihren Kunden erhalten. Zum Beispiel sind einige Farben Warenzeichen, einige Schriftarten sind Marken. Stellen Sie also sicher, dass Sie zum Beispiel kostenlose Google-Schriftarten verwenden, wenn Sie diese erstellen, und passen Sie diese dann einfach an Ihre Kundenspezifikationen an. Zum Beispiel für Farben und Schriftarten. Lassen Sie mich Ihnen noch eine Sache zeigen. Mit der Kraft von x D haben wir all diese verschiedenen Elemente. Stellen Sie sich also vor, dass wir dieses Bild verwenden wollen. Also Control-C, Control-V genau hier. Und sagen wir, dass dies unsere erste Karte ist. Also nennen wir es Karte eins. Lambda. Und hier haben wir den Stapel, wie Sie sehen können. Also werde ich Alt schlagen. Was noch besser? Ich kann es als Komponente erstellen. Also Control K, wir haben diesen Standardzustand ist mit dem Bild auf der linken Seite. So neuer Zustand, rechtes Bild. Und dann einfach an hier angepasst. So wie so. Und was ich für diesen hier tun werde, ist, dass ich sie im Grunde einfach umdrehen werde. Also gehen wir hin. Und ich werde diese Karte anpassen, ich werde sicherstellen, dass mein Bild hier ist, und da gehen wir. Das ist also unser Standardzustand. Das ist unser richtiges Bild. Und noch einmal werde ich noch einen erschaffen. So zentrieren Sie das Bild so. Und ich werde so etwas ändern. Also 123, also sind wir bei 60 so. Und natürlich für diesen, werde ich mit dem Center Bild gehen. Also, was ich tun werde, ist genau hier zu springen. Und ich werde die Position meines Stapels ändern. Also, was ich tun werde, ist, sie in eine Gruppe zu stecken. Ich werde einen zweiten vertikalen Stapel wie diesen verwenden. Und im Grunde nur erweitern Sie das Bild bis zu den Rändern so. Doppelklicken Sie zum Beispiel auf innen positioniert, direkt hier. Da gehen wir. Text wird in nur einem Moment in der Mitte sein. Gehen wir also für den Standardzustand, und lassen Sie uns hier an dem zentralen Bild arbeiten. Weil das unsere Komponente ist. Was ich tun möchte, ist im Grunde diesen Text angepasst. Also lassen Sie uns mit gehen, lassen Sie uns die automatische Breite sehen. Also, was ich tun werde, ist Doppelklick innen und passen Sie diesen Text Bingo-Bit außerhalb. Aber Sie können auch tun, ist erstellen oder Höhe und Sie können es so anpassen. Und bringen Sie einfach das, was Sie hier nicht brauchen, so ein. Also sind wir nur ein paar Klicks. Wir werden in der Lage sein, es anzupassen. Und Sie können das tun, sollte warten. Sie können Auto Höhe tun, was immer Sie wollen. Und ich werde sicherstellen, dass das Zentrum so ausgerichtet ist. Und ich werde das vielleicht in der Mitte positionieren und meinen Knopf auch in der Mitte positionieren. Und stellen Sie sicher, dass wir 40 von all diesen sind. Und stellen Sie sicher, dass wir es sind, weil wir in einem Stapel sind, zum Beispiel 64 Dezimalstellen. Und Sie können es auch hier eingeben. Wenn ich also meine Gruppe hier auswähle, wähle 60 aus, und sie ist ausgewählt. So gehen Sie mit nur ein paar Klicks. Sie haben drei verschiedene Karten, die Sie verwenden können. Also im Grunde haben wir Standard-Bild, rechtes Bild, Zentrum Bild. Damit du mit denen tun kannst, was du willst. So können Sie sehen, wie einfach es ist, diese Elemente in Adobe XD zu erstellen. Und noch einmal fordere ich Sie auf, über Ihr Projekt nachzudenken, beginnen, über Ihre Nische nachzudenken, die einige Elemente sind, die bereits die ganze Zeit schlagen. Unsere SWOT-Elemente, die extrem langweilig sind. Können Sie etwas kaufen oder kostenlos etwas herunterladen , das Ihren Workflow verbessern wird, was Ihren Workflow beschleunigen wird? Oder müssen Sie je nach Designstil alles von Grund auf neu erstellen . Wenn das der Fall ist, dann erstellen Sie einfach alle diese regulären Elemente, wie ich Ihnen in diesem Beispiel gezeigt habe. Zum Beispiel, Navigation, Fußzeile, all diese verschiedenen Autos, die sich in der ganzen Zeit wiederholen und dann einfach von dort im Laufe der Zeit erweitern. Schließlich möchte ich Ihnen zeigen, wenn wir zurück zu Adobe XD gehen, können Sie sehen, dass es diese Datei in der Cloud gespeichert. Dies ist äußerst wichtig, vor allem, wenn Sie dies mit Ihren Designkollegen, mit Ihren Kunden teilen oder wenn Sie per Fernzugriff Formulare arbeiten , haben Sie beispielsweise das Büro und arbeiten auch an einem Laptop. Aber was ich auch empfehle, ist das Speichern auf Ihrem Desktop. Um dies zu tun, können Sie einfach hier in Datei schreiben, Speichern unter, und Sie können so sicher wie lokales Dokument auf Ihrem Desktop wählen. Was Sie damit tun können, ist, dass Sie diese Datei einfach haben können. Zum Beispiel, wenn der Strom weg ist, können Sie ihn auf Ihren Laptop nehmen und Sie können Ihren Laptop überall hin mitnehmen. Wenn Sie anpassen und einige schnelle Änderungen vornehmen müssen, wenn das Internet verschwunden ist, was wirklich der Hauptvorteil lokaler Dokumente ist, können Sie es einfach lokal speichern und einfach arbeiten oder nicht. Wenn Sie keine Internetverbindung haben. 7. UI Kit VS Design-Systeme: Es gibt auch eine weitere Art von Vorlage, die online verfügbar ist, die Design-System genannt wird. Und das Designsystem ist im Grunde tot. Es beinhaltet verschiedene Arten von Schriftarten, verschiedene Arten von Regeln, verschiedene Arten von Rastern in vielen anderen Projekten, besonders wenn Sie mit Code arbeiten. Sie werden also einen anderen Code-Snippets zuweisen. Sie werden verschiedene Token für Farben, Schriftarten und vieles mehr zuweisen . Das Designsystem ist also viel komplexer als das UIKit. Je nach den Projekten, an denen Sie arbeiten, können Sie Designsystem erstellen, das kleiner ist, wenn Sie an kleinen Projekten arbeiten oder wenn Sie mit größeren Projekten arbeiten, empfehle ich definitiv, mit Designsystem zu arbeiten. Aber der Hauptunterschied zwischen UIKit und Designsystem ist, dass UIKit bereits diese vorgefertigten Komponenten erstellt hat. Wie Sie im vorherigen Video gesehen haben, haben wir diese Navigation bereits erstellt. Also ist es fertig. Es hat das Logo, in dem Sie mit Ihrem nächsten Kundenprojekt austauschen können. Es hat den Typ im Inneren, also ist alles bereits positioniert. Sie können einige dieser Typen einfach umbenennen. Sie können die Schriftart ändern, Sie können die Stile ändern, Sie können die Größe und alles andere auswählen. Und es hatte bereits diesen Knopf an Ort und Stelle. So können Sie einfach die Breite, die Höhe, die Farbe der Schaltfläche, den Hintergrundschatten und alle diese Elemente anpassen die Farbe der Schaltfläche, . Und das ist das UIKit auf den Punkt gebracht. Während Sie mit dem Designsystem, müssten Sie diese Navigation von Grund auf neu erstellen. Und weil innerhalb des Designsystems haben Sie viel kohärente Struktur. Ich gehe wieder zum größeren Projekt zurück, vor allem zu dem riesigen Projekt, wo die Mehrheit der Designer an demselben Projekt arbeiten. Dann ist das Designsystem wirklich entscheidend, da Sie ein zentrales Repository von Elementen benötigen , um für all diese verschiedenen Designer innerhalb Ihres Teams verwendet werden zu können. Wenn Sie alleine arbeiten oder mit nur einem anderen Designer arbeiten oder direkt mit Kunden arbeiten, bekomme ich meiner Meinung nach eine viel bessere Lösung, denn wieder wird es Ihren Workflow beschleunigen massiv, weil Sie alle diese Elemente bereits erstellt haben. Sie müssen sie nicht die ganze Zeit von Grund auf neu erstellen. Während das Entwerfen von Systemen für diese kleineren Projekteäußerst wichtig, äußerst wertvoll und äußerst nützlichsind äußerst wichtig, äußerst wertvoll und äußerst nützlich , müssen Sie diese Konstruktionssysteme nicht wirklich erstellen, da Sie die Komponenten haben. So können Sie einfach die Komponenten anpassen. Sie können einfach die Schriftgröße anpassen. Sie können einfach die Schriftfamilie anpassen. Sie können die Farbe anpassen. Sie können alle diese verschiedenen Elemente anpassen, zum Beispiel Symbole. Nehmen wir an, Sie verwenden diese Bild-Symbol während Ihres Designs und Sie wollen es nur wirklich schnell austauschen. Nun, Sie können eine Komponente erstellen und das nächste Mal auf dem nächsten Projekt, wenn Sie das ändern möchten, können Sie einfach per Drag & Drop ein anderes Symbol innerhalb wird, um diese Komponenten zu tauschen. Und da gehst du hin. Für all diese kleinen Projekte benötigen Sie kein Designsystem. einmal hängt es von Ihnen ab, an welchen Projekten Sie arbeiten, in welcher Art von Nische Sie sich befinden, vor allem für diese kleinen Nischen, diese Designsysteme sind nicht wirklich so nützlich. Noch einmal, es liegt alles an Ihnen und ich werde die Links zu einigen der bekanntesten Designsysteme in einem PDF lassen , Sie können die XD-Version herunterladen. Sie können sie in Adobe XD öffnen, und Sie können einfach herausfinden, was diese Designsysteme sind und was Sie daraus lernen können. Weil all diese von großen Unternehmen geschaffen werden. Und wieder einmal haben diese großen Unternehmen diese Designsysteme geschaffen weil sie mehrere Designer haben, die gleichzeitig in einem Team arbeiten. Sie brauchen also das zentrale Repository von Elementen, das von all diesen verschiedenen Designern verwendet werden soll. Andernfalls, wenn Sie nur eine Mann-Band sind, wenn Sie mit kleineren Projekten arbeiten, können Sie einfach UI-Kits verwenden und es wird gut sein. 8. Premium VS kostenlose UI-Kits: Es ist alles gut und gut, diese UI-Kits für sich selbst zu erstellen. Aber es ist manchmal einfacher, einfach voran zu gehen und einfach diese verschiedenen UI-Kits herunterzuladen oder zu kaufen, die Sie für Ihre zukünftigen Projekte verwendet werden, vielleicht für diese langweiligen Elemente, wie wir zuvor gesprochen haben, wie die Navigation, wie die Fußzeile, wie die Preistabellen und so weiter. Also, wo Sie diese UI-Kits finden, werde ich Ihnen in der nächsten Lektion zeigen, wo wir tatsächlich besprochen werden, Ihre eigenen persönlichen UI-Kits auf diesen Websites zu verkaufen. Aber im Grunde, was ich in dieser Lektion teilen wollte, ist diese Premium-UI-Kits sind mit nur dummen Marke im Kopf gemacht. Ich meine damit ist, dass es keinen bestimmten Zusammenhang zwischen Schulden UIKit und einer bestimmten Marke gibt. Sie können sich vorstellen, dass, wenn iOS ihre UIKit veröffentlichen wird spezifisch für diese Branding Richtlinien, diese großen Richtlinien, diese Topographie-Richtlinien und all diese verschiedenen Elemente, die dass bestimmte UIKit und dieses bestimmten Betriebssystems in diesem Fall. Also ist es das Gleiche. Wenn Facebook zum Beispiel ihre eigene UIKit starten, wird es durch diese blaue Farbe, durch Schuldenschrift und all diese Elemente erkannt werden . Während mit diesen Premium und kostenlosen UI Kits, die Sie online finden können, gibt es keine bestimmte Marke im Kopf. Warum ist das so? Weil es von anderen Designern verwendet werden soll. Es wird ganz einfach für Sie sein, die Farben zu ändern, die Schriftarten und all diese Elemente zu ändern, über die Sie zuvor gesprochen haben. Das ist also der ganze Sinn des Premium- oder kostenlosen UI-Kits. Was ist nun der Unterschied zwischen gratis und Premium UIKit? Offensichtlich ist die Nummer 1 im Preis. Kostenlose UI-Kits können kostenlos heruntergeladen werden, offensichtlich, und die Prämie kann erworben werden. Und der Hauptunterschied, meiner Meinung nach ist die Anzahl der Elemente. Normalerweise kommen diese Autobahnkinder nur mit zehn oder 20 verschiedenen Elementen. Während Premium-UI-Kits wie das Quantum UIKit, vor allem, dass ich dir vorher gezeigt habe, kommt zum Beispiel mit 11000 verschiedenen Elementen. Außerdem gibt es Unterschiede in den Dateitypen. Zum Beispiel kommt es bei kostenlosen UI-Kits in der Regel nur mit einem Dateityp. Zum Beispiel gibt es XD oder Adobe Photoshop oder Sketch oder Figma oder was auch immer. Während mit Premium-Wünsche sind in der Regel bestrebt, alle diese verschiedenen Dateitypen einzubeziehen. Egal, was Sie verwenden, Sie werden abgedeckt sein. Außerdem gibt es einen Unterschied in der Differenzierung von Elementen. Also in freien Sie, ich denke, Sie werden einfach nur, zum Beispiel, 23 Kategorien. Während mit Premium-UI-Kits, Sie gehen, um in der Regel bekommt 10, 20, 50 verschiedene Kategorien. Und schließlich möchte ich die Unterstützung erwähnen. Wenn etwas kaputt ist, wenn etwas nicht funktioniert. Woche drei, UI Kits, im Grunde, wen interessiert, Es ist kostenlos und Sie werden keine Unterstützung vom Designer bekommen. Während mit Premium-Märkten, vor allem, wenn Sie sie direkt auf ihrer Website kaufen, werden Sie grundsätzlich Anspruch auf den Support haben. Und Sie werden zuerst in der Reihe sein, um Hilfe von diesen Designern zu erhalten , die diese UI-Kits erstellt haben. Also im nächsten Video werde ich über den Verkauf Ihrer eigenen UI-Kits sprechen. Und wir werden im Grunde durch diese verschiedenen Websites blättern. Und ich werde Ihnen zeigen, wo Sie die Premium-UI-Kits für sich selbst bekommen können. Und Sie können auch Ihre eigenen UI-Kits auf diesen Websites verkaufen. 9. Erstelle und verkaufe dein UI-Kit: Wenn es darum geht, Premium-UI Kits online zu kaufen, oder wenn es darum geht, Ihre eigenen UI Kits online zu verkaufen. Es gibt nur eine Handvoll Websites, auf denen Sie es erfolgreich tun können. Es gibt viele verschiedene Websites da draußen. Und mein Rat als jemand, der seit sechs Jahren dabei ist, versucht nicht, überall zu verkaufen, weil du dich einfach selbst Blech lassen wirst. Sie werden zu viel Zeit verschwendet auf diesen Websites, die nicht gehen, um Ihre Verkäufe zu generieren. Diesen Rat folgte. Folgen Sie diesem Video von jemandem, der es seit sechs Jahren getan hat, und ich habe oder 100 Tausend Verkäufe auf all meine verschiedenen Produkte. Also sollte ich ein oder zwei Dinge darüber wissen, wo Sie verkaufen sollten und wo es profitabel ist oder nicht. In diesem Video zeige ich Ihnen, wie ich in einem vorherigen Video sagte, diese Websites, auf denen Sie Premium-UI-Kits kaufen können und wo Sie Ihre eigenen UI-Kits verkaufen können. Jetzt vor allem, warum Sie Ihre eigenen UI-Kits überhaupt verkaufen sollten. Eigentlich ist es nur ein guter Sinn, dies zu tun, und es ist nur eine gute Quelle für zusätzliches Einkommen für sich selbst. Wenn Sie beispielsweise ein gut aussehendes UI-Kit für eines Ihrer vorherigen Projekte erstellt haben . Sie können es einfach mit den Tipps und Techniken, über die wir früher gesprochen haben, erweitern und einfach vorbereiten und verkaufen Sie es auf einer dieser verschiedenen Websites. Sie können es zum Verkauf für den Preis, von dem auf all diesen verschiedenen Websites vertreten ist. Sie können einfach auf den Marktpreis einstellen. Sie können erkunden, was andere tun, und passen Sie sich einfach für sich selbst an. Wenn Sie beispielsweise 100 Elemente in Ihren UI-Kits haben und nur einen Dateityp anbieten, der Adobe XD ist, stellen Sie sicher, dass Sie nicht zu viel berechnen, weil Sie gegen jemanden anderen konkurrieren , der es in Adobe XD-Skizze erstellt. Figma für den Laden. Also vielleicht, dass Ihr Kind wird viel besser als Ihre UIKit verkaufen , weil sie alle diese verschiedenen Dateitypen anbieten. Also lassen Sie uns hineinspringen und ich werde Ihnen alle diese verschiedenen Websites zeigen und wo Sie Ihre Produkte verkaufen können. Und vor allem, Zell-Hosting. Also im Grunde ist Self-Hosting, wo Sie die Produkte hosten und Sie sind verantwortlich für die Einbringung Ihrer Kunden. So sind Sie verantwortlich für die Förderung, Sie sind verantwortlich für den Verkauf, Sie sind verantwortlich für die Lieferung von allem anderen. Und es sind auch Marktplätze, auf denen Sie auf all diesen verschiedenen Marketplace-Sites verkaufen können und die ganze Arbeit für Sie erledigen. Also lassen Sie uns mit selbst in der Website starten, die ich seit Jahren verwende, ist gum road. Sie können anpassen, können Sie alle diese verschiedenen Produkte hochladen. Sie können benutzerdefinierte Links, benutzerdefinierte Rabatte, benutzerdefinierte Farben erstellen. Sie können diese verschiedenen Call-to-Action-Schaltflächen erstellen, wie es hier steht, beginnen Sie jetzt zu wie es hier steht, verkaufen oder zu kaufen, oder kaufen Sie jetzt, was immer Sie wollen. Und Sie können dies im Grunde mit Beacons Präsentation binden, mit Dribble Präsentation, Sie können einfach Ihre Zuschauer hier nehmen und sie können in Ihrem Kamera-Shop kaufen. Oder Sie können tun, was ich mit meinem Team gemacht habe, ist eine Website zu erstellen. Und auf dieser Website können Sie zum Beispiel UIKit erstellen. Und lassen Sie uns sagen, dass Sie UIKit hier sehen können, Ihre Kinder hier. Also haben wir einen Haufen von ihnen. Und lassen Sie uns sagen, dass Benutzer diesen kaufen möchten, zum Beispiel können sie einfach klicken. Es wird sie auf die spezifische Seite für ihr Produkt zu bringen, die haben wird. Die Beschreibung hier, was ist im Lieferumfang enthalten? Es funktioniert in welcher Software und wenn ich auf Jetzt kaufen klicke, wird es sie auf die Kaugummi-Straßenseite bringen. Sie können einfach klicken, ich möchte dies und sie können dieses Produkt kaufen. Und wie Sie sehen können, ist es ziemlich einfacher, von der Website zu hören. Was Sie auch tun können, ist der integrierte Verkauf. Was das bedeutet, ist, wenn sie auf Jetzt kaufen klicken, wird sich ein Fenster hier öffnen und sie können direkt von dort kaufen. Aber stellen Sie sicher, zu verstehen, wenn Sie Gmail verwenden, vor allem, und Sie verwenden etwas wie Google Analytics zum Beispiel, diese beiden werden abstürzen. Also im Grunde nur sicherstellen, und das ist, warum ich sage, es leitet Sie auf eine sichere Kaufseite. Also werde ich gleich hier gehen. Wie Sie sehen können, ist gum road wirklich sicher, da es meine Website ist, aber ich möchte nur, dass zusätzliche Sicherheitsschicht haben, weil die Leute ihre Kreditkartennummern verlassen, sie sind PayPal-E-Mail-Adressen. Also will ich nicht, dass irgendetwas zustößt. Also, im Grunde ist das meine Meinung. Sie haben auch eine Website namens Sulfid, die im Grunde ziemlich ähnlich wie Gummi Straße ist, aber meiner Meinung nach, Gummi Straße ist da von Anfang dieses Online-Spiels und Sie können, wie gesagt, angepasst werden, um zu passen, was Sie tun, was auch immer Ihr Produkt aussieht, in diesem Fall UIKit, aber Sie können alle Arten von verschiedenen Dingen verkaufen. Nun gehen wir zu Marktplätzen über. Und ich werde Ihnen zeigen, welche der wichtigsten Marktplätze da draußen sind. Und wie gesagt, Sie können alle diese anderen Marketplace-Sites erkunden, besonders wenn Sie anfangen zu verkaufen, wenn Sie anfangen, Traktion zu bekommen. All diese verschiedenen Marktplätze Leute werden sich Ihnen nähern und sagen, dass sie diese revolutionäre neue Website haben , die Ihnen so viel Geld bringen wird. Sie werden nicht wissen, was Sie damit machen sollen, aber hören Sie einfach nicht auf sie. Stellen Sie sicher, dass Sie mit dem Verkauf auf diesen großen Websites beginnen und dann auf die kleinen Websites erweitern. Aber nur mit einem Produkt nach dem anderen. Wenn Sie 500 Produkte wie ich haben, ist es buchstäblich unmöglich, all diese Produkte auf all diese verschiedenen Websites hochzuladen . Und warum sollten Sie das auch tun wollen, wenn sie zum Beispiel nicht über eine Million verschiedene Verkäufer verfügen oder wenn sie Ihnen nicht genug Umsatz bringen. Also, um loszulegen, was wir haben, ist Envato Markt und diese Website ist Graphic River. Innerhalb davon haben Sie Web-Elemente und Sie haben Benutzeroberflächen. Du kannst da drinnen springen. Und Sie können sehen, wie einige dieser verschiedenen Produkte aussehen. Wie ich bereits sagte, müssen Sie keine UI-Kits verkaufen. Du kannst verkaufen, was du willst. Aber in dieser Klasse dreht sich alles um UI-Kits. Als nächstes haben wir Modell entworfen und diese Jungs sind furchtlos selektiv über das, was in der Lage ist, auf ihrer Website zu gehen. Und Sie können sehen, dass alle diese Elemente sind wirklich hochwertig, wirklich erstklassig, vor allem für diese UI Kits n, Zum Beispiel, wenn ich hier klicken, nur um Ihnen diese verschiedenen Präsentationen zu zeigen , weil Sie arbeiten mit ihnen, um diese Präsentationen zu erstellen. Sie können sehen, dass sie wirklich im Vollbildmodus sind. Der echte Look poliert, die wirklich professionell aussehen. Sie sehen wirklich High-End aus, und das ist das Wichtigste an ihnen. Und ich denke, dass Sie auch eine andere Animationen hinzufügen können, wenn Sie mit ihnen erstellen. Als nächstes haben wir Creative Market und im Grunde Graphic River und Creative Market, oder sind da seit Beginn der Zeit. Und Sie können durch all diese verschiedenen Vorlagen blättern. Also lassen Sie uns zum Beispiel mit Webvorlagen gehen. Sie können sehen, wie viele davon es gibt. Aber wenn wir mit Vorlagen gehen und ich gehe mit Lassen Sie mich mich daran erinnern, wo all diese sind. So Grafiken Web-Elemente. Und wenn ich dort anklicke, können wir durchfiltern. Lassen Sie uns also mit Adobe XD gehen. Und Sie können all diese verschiedenen Elemente für Adobe XD sehen. Und wir können sogar für gefiltert dies weiter, indem wir Social-Media-Websites Vorlage gehen. Und wir haben zum Beispiel Wireframe-Kinder. Ich kann das auswählen. Und Sie können Wireframe-Kinder sehen, wie sie aussehen, wie viel gibt es? Hier sind meins. Und Sie können sie durchstöbern, wenn Sie interessiert sind. Und das ist es im Grunde. Sie gehen einfach hier und sehen, was diese anderen Designer tun C, welche ihrer Kategorien sie verwenden, C in welcher Software sie diese Wireframe-Kinder erstellen, Ihre Kinder und so weiter. Und im Grunde beginnen Sie von dort und erkunden, was für Sie funktioniert. Schließlich haben wir auch UI 8, die in der Branche bekannt ist. Sie sind auch hohen Standard, qualitativ hochwertig, und sie sind wirklich sparsam, wenn es darum geht, die in der Lage, auf ihrer Website zu verkaufen, so dass Sie sie überprüfen. Ich empfehle sie wirklich. Schließlich haben wir Envato Elemente und wir haben Bundles entworfen und Wasserelemente ist nur der Teil des Envato Marktes. Sie müssen sich also separat bewerben, um auf Envato Elemente zu verkaufen. Aber sobald Sie dies tun, werden Sie grundsätzlich von der Menge bezahlt , die jemand Ihr Produkt herunterlädt. Wenn ich zum Beispiel UI Kit suche, können Sie alle diese verschiedenen Elemente sehen. Und im Grunde ist der Unterschied zwischen dieser Marketplace-Site und all diesen anderen Marketplace-Sites mit Ausnahme von UA, weil sie alle Access Pass haben, aber sie haben Einschränkungen, wie viele Artikel Sie pro Woche, pro Monat, pro Tag, und so weiter. Während Envato Elemente keine Einschränkung haben, können Sie jetzt laden, was Sie wollen, wo immer Sie wollen, und Sie zahlen ein Jahresabonnement statt drei Monate, sechs Monate, einen Monat, was auch immer. All diese anderen sind im Grunde nur zahlen, wie Sie gehen. Also, wenn Sie sich entscheiden, dieses Produkt zu kaufen, zum Beispiel, Sie kaufen es einfach. Oder wenn Sie sich entscheiden, meine Produkte zu kaufen, können Sie sie einfach kaufen. Und die gleiche Geschichte mit all diesen anderen, und die gleiche Geschichte mit Gummi Straße, aber Vidkun Straße, können Sie wählen, um separate Bündel zu erstellen. Also, wenn wir zurück zu hier gehen, scrollen ich nach unten, zum Beispiel kann ich UIKit Bundle aus all meinen Produkten erstellen. Und ich kann wählen, ein massives iframe-Bundle zu erstellen, wie ein halbes getan. Und Sie können das ganz einfach innerhalb der Zahnfleischstraße tun, während Sie das nicht in all diesen verschiedenen Websites tun können. Jetzt zurück zu Envato Elemente, wie gesagt, Sie verdienen kein Geld für eine separate Produkte, die jemand anderes kaufen, aber Sie verdienen Geld. Aber wie viele Ihrer Produkte hat jemand heruntergeladen und wie viele Downloads haben Sie in dieser Kategorie für Ihren Beitragsbonus? So zum Beispiel, wie viele dieser verschiedenen Produkte , die Sie in der Mehrheit dieser anderen Dinge haben. Und wieder einmal, wenn Sie interessiert sind, können Sie einfach ihre Website durchsuchen. Und noch einmal, hier ist mein Produkt und Austria UI Kit. Und schließlich möchte ich Design-Bundles mit Ihnen teilen, die eine der neueren Websites in der Branche ist, aber es lohnt sich zu verfolgen, denn hier können Sie auch all diese verkaufen. Hey Kinder, wie wir erwähnt, aber sie haben auch verschiedene Bündel, die sie von Zeit zu Zeit laufen. Und im Grunde ist Bundle so etwas wie ein Paket und Sie können ein Bundle kaufen. Zum Beispiel haben 10 verschiedene Designer 10 verschiedene UI-Kits. Sie verwenden alle, die Sie Kinder setzen sie in einem Paket namens das Bundle Slash den Preis nach unten wirklich hart und dann einfach vermarktet wie verrückt. Und im Grunde, dass Mundell wird einige tausend Verkäufe bringen und dann Disziplin teilen, dass Geld von diesem bestimmten Bündel durch diese Designer, in der Regel, was passiert, ist, dass es zwei verschiedene Modelle. Entweder 50, 50, 50 gehen an die Designpakete. In diesem Fall geht in 50 an alle anderen Designer. Und es gibt auch ein Modell 50 und der Rest, 50 Prozent geht an die Design-Bundles, und der Rest geht an wer die größte UIKEs bekommt das meiste Geld, wer hat die kleinste Freude Kinder bekommt die kleinste Menge an Geld. Also im Grunde abhängig von der Website, je nach Deal, je nach Bundle werden Sie je nach Bundleeinen bestimmten Prozentsatz des Geldes zu bekommen. Ich werde in Zukunft einen separaten Kurs erstellen, erklären, erklären, wie Sie Präsentationen vorbereiten, Tags vorbereiten, Beschreibungen vorbereiten, wie Sie Ihr Targeting auswählen, wie Sie Ihr Produkt am besten beschreiben, wie Sie diese Shot-Listen erstellen, wie Sie diese Coverbilder und alle diese Elemente erstellen können. Vor allem werde ich über Unterstützung sprechen, warum Unterstützung wichtig ist, wie Sie Unterstützung durch eine gute Beschreibung und durch die Bereitstellung eines guten Produkts in erster Linie, was macht eine große Produkt und vieles mehr. Wenn Sie also an diesem Kurs für die Zukunft interessiert sind, folgen Sie mir einfach in den sozialen Medien oder lassen Sie mir eine Nachricht hinterlassen. Sie können mir hier folgen, wo immer Sie diese Klasse beobachten und im Grunde bleiben Sie dran für die Zukunft. Und du kannst auch meinem YouTube-Kanal folgen. Ich werde auch einen Link dazu hinterlassen. In der PDF-Datei. Ich stelle alle Arten von Adobe XD-Inhalten da draußen. Wenn Sie also interessiert sind, folgen Sie mir dort und ich werde diese Klasse in Zukunft ankündigen. 10. Dein Kursprojekt: Ihr Klassenprojekt für diese Klasse besteht darin, Ihr eigenes UI-Kit zu erstellen. Sie müssen die meisten dieser Elemente nicht erstellen, so dass Sie nicht 50 verschiedene Elemente erstellen müssen. Sie können einfach ein, zwei oder drei, vielleicht fünf Elemente erstellen. So können Sie zum Beispiel mit der Navigation beginnen, mit Heldenbild, und dann können Sie von dort weiter gehen und Sie können es einfach als JPEG-Bild speichern und es in die Klassenprojekte hochladen. Ich würde wirklich gerne sehen, was ihr euch einfallen könnt und nur Üben, UI-Kits für die Zukunft zu erstellen. Denn wie ich schon sagte, sobald Sie damit beginnen, werden Sie es mehr und mehr schätzen, weil es Ihnen in Zukunft eine Menge Zeit für all Ihre zukünftigen Projekte in wird es Ihnen ermöglichen , an Ihre Projekte viel schneller. Wie gesagt, ich freue mich auf unsere Klassenprojekte und freue mich sehr darauf, zu sehen, was ihr euch einfallen könnt. 11. Schluß-: Danke, dass Sie diese Klasse angesehen haben und ich hoffe wirklich, dass Sie einen Wert darin gefunden haben, und ich hoffe wirklich, Sie haben verstanden, wie Sie sind. Kinder können wirklich helfen, Ihre Zeit für diese Projekte zu erhöhen. Wie sie Ihren Workflow verbessern können, wie sie die Zeit, die Sie mit Ihrer Familie, mit Ihren Freunden verbracht haben, erhöhen und die Zeit, die Sie in diesen Projekten verbringen, verkürzen können. Beginnen Sie erneut mit der Erstellung von UI-Kits. Kleiner Stil, fing an, sie eine Breite zu schaffen. All diese Elemente, die Sie in all Ihren Projekten verwenden werden. Zum Beispiel, Navigation Fußzeile, Preis-Tabellen, wie wir zuvor gesprochen. Und dann können Sie einfach eine Anpassung hinzufügen und verschiedene Elemente einschließen. Und deshalb gibt es Adobe so großartig. Und ich habe Ihnen im vorherigen Video gezeigt, wie Sie ganz einfach Ihr eigenes UI-Kit erstellen und sicherstellen können , dass Sie es anpassen und es ändern können, während Sie weitergehen. Und was am wichtigsten ist, ist, Ihren Stil zu finden. Einige Designer möchten keine Komponenten erstellen. Andere schwören auf Komponenten. Also im Grunde, was du willst, was auch immer du willst, was auch immer es dir am angenehmsten anfühlt. Verwenden Sie diese Technik, verwenden Sie diesen Ansatz, um Ihr eigenes UI-Kit zu erstellen. Achten Sie auch darauf, Ihre Nische auszuwählen und stellen Sie sicher, Ihre Nische zu erkunden und zu sehen, welche Arten von Elementen Ihre Nische am meisten benötigt, wie ich in einem der vorherigen Video erklärt habe, wird es nicht für alles gleich sein. Einige Blog-Websites werden keine Elemente von Shop-Websites verwenden und umgekehrt. Natürlich wird es Elemente geben, die mit all diesen verschiedenen Nischen übereinander kompatibel sind. Aber in den meisten Fällen werden Sie für eine bestimmte Nische erstellen. Stellen Sie also sicher, dass Sie dies tun, sobald Sie mit der Erstellung Ihres UI-Kits beginnen. Eine weitere Sache zu erwähnen ist, Ressourcen werden in einem PDF sein, wie ich in den vorherigen Videos erklärt, klicken Sie einfach auf den Link, der Sie interessiert. Es wird dich dorthin bringen. Es ist in dieser PDF-Datei. Und ich wünsche Ihnen viel Glück bei der Erstellung Ihrer UI-Kits. Und ich hoffe wirklich, dass sie dir eine Menge Zeit ersparen werden, wie sie es bei all deinen zukünftigen Projekten für mich getan haben. Kümmere dich um.