Transkripte
1. Einführung in den Kurs in den Adobe XD: Willkommen zu meinem Kurs darüber. Über 60 und in den Schulen wirst du all das grundlegende Zeug lernen und all das Zeug über 60
angeboten wird, wir werden Prototypen erstellen, wurden Zehe gehen, alles über Papier-Prototyping
lernen und all die verschiedene interaktive Prototypen, Live-Prototypen. Und wir werden mit Ihren Entwicklern zusammenarbeiten. Was Zusammenarbeit bedeutet, ist, dass wir unser Design an Entwickler weitergeben, die
Zeppelin und Advil kalt verwenden . Also mach dir keine Sorgen, wenn du nicht über dieses fortgeschrittene Zeug weißt, weil du wirst lernen, dass ich in diesem Kurs alle Grundlagen abdecken werde. Tastenkombinationen? Was sind die verschiedenen Werkzeuge, die Sie verwenden können, um Ihr Design zu erstellen? Und dann gehen wir auf die Prototyping-Phase, wo wir gehen, um
die Grippe aus App und verschiedene Skins zu generieren . Wir werden die verschiedenen Bildschirme miteinander verbinden. Und am Ende werden
wir unser Design nutzen, um mit anderen Entwicklern zusammenzuarbeiten. Wir werden entwerfen, wir gehen Zehe, geben ihnen Design-Spezifikationen und unterscheiden die Abstände zwischen verschiedenen Elementen und den zitierten Styleguides, die Ihre Entwickler sofort dort verwenden können App-Design oder iPhone App-Design Jetzt werden wir eine Menge über die Eingabe von Grenzen abdecken. Sie werden sehen, wie ich verschiedene Papierprototypen erstellen würde, um das Skizzierteil
oder das Block-Level-Design abzudecken , das die erste Fläche von jedem Design ist. Dieser Kurs ist also eine Mischung aus User Experience Techniken, nur wenige davon. Ich habe in einer Menge von TD wie Prototyping und auch über Adobe X T diskutiert Wie Sie Instant-Prototypen verwenden und erstellen können Instant-Prototypen mit Adobe X'd . Jetzt eine Menge von Designern, Ich habe gesehen, dass sie nie über Designrichtlinien sprechen, I US Designrichtlinien oder die Richtlinien. Jeder Designer und Entwickler sollte wissen, dass die Navigationsleiste oder dass sie nur außerhalb der U. S. App 49 Punkte betragen sollte oder die Belastung 44 Punkte betragen sollte. All diese Spezifikationen werde ich in diesem Kurs behandeln. Und wenn Sie ein Problem haben oder Probleme haben,können
Sie mich leicht kontaktieren. wenn Sie ein Problem haben oder Probleme haben, Warum sind Fragenantworten und Sie können mich auch direkt fragen, indem Sie mir eine Nachricht schicken. Wir werden eine Menge Dinge zusammen machen, also sehen wir uns bald in diesem Kurs, und ich werde Ihr Lehrer sein
2. Was ist Adobe Xd?: Hallo, alle. Heute werden wir das neue Tool von Adobe treffen, das ist ein Job x d und ich war für eine lange Zeit für einige Features die gerade
jetzt in X t eingeführt gelesen . Und jetzt werde ich Ihnen zeigen einige von den großen Features aus es. Und sie sind ah, Robur Team. Sie arbeiten monatlich an diesen und veröffentlichen jede Funktion monatlich auf der Grundlage der
Verleihung von verschiedenen Sie A-Designern und User Experience Designern aus der ganzen Welt. Okay, das ist
also bei über 60. Ich bin gerade auf Windows. Es gibt nur wenige kleinere Unterschiede innerhalb der Makroversion und Windows-Version, aber sie sind fast ähnlich. OK, jetzt werde ich Ihnen einige von den großartigen und coolen Features von X'd zeigen und warum Sie es als
verwenden sollten , ah Design über Rahmen und Prototyp-Tool in Ihrer Benutzererfahrung, Design, Workflow oder Sie ein Design-Arbeit. Okay,
jetzt, warum diese drei Werkzeuge für Shop Skizze und vor Rücken D Sie sind ideal für Ihr Design oder User Experience Design, weil Apple U S Führer Version sind, sie produzieren ihre Grafiken in diesen drei für Max Okay, so im Moment sind sie sportlich für den Shop Skizze und Aerobic T. Und wenn Sie sich die Dateigrößen der Adobe X t Datei Größen der kleinsten achtziger Jahre, 18,9 MB so können Sie sehen, es ist sehr nah an Skizzendatei Größe, so dass es fünf Größe ist sehr klein. Okay, das ist
also ein sehr großer Pluspunkt,
weil man
Hunderte von verschiedenen Kunstbrettern darin erstellen kann das ist
also ein sehr großer Pluspunkt,
weil man
Hunderte von verschiedenen Kunstbrettern darin erstellen kann. Okay, also verschiedene Bildschirme, vielleicht Hunderte sind 20 oder 30 verschiedene Bildschirme, und Ihre Dateigröße wird immer noch klein sein. Okay, so ist es einfacher, eine aus dem Gitter-Features von einem Job zu teilen X t ist. Es ist Wiederholung. Gut. Weißt du was? Wiederholen Sie Gier ist, dass Sie Ihr Design-Element einmal erstellen, und Sie werden es wiederholen, indem Sie eine große UK Sie können in diesem Design-Beispiel sehen , das wir ein Ende von den Partituren erstellen werden. Sie können sehen, dies ist unsere Wiederholung schafft. Wenn ich also kurz darauf versuche, kannst
du sehen, dass es all die anderen,
äh,
diese, ähm,
Inhaltsvorlagen hier drüben entfernt äh,
diese, ähm, diese, ähm, , . Okay, also bewegt es diese. Okay, Sie können
also Ihr Raster in Zerstörung und in vertikaler Richtung erweitern, sowohl aus diesen Richtungen, und es wird Ihren einzelnen Inhalt multiplizieren und Sie können es
ändern. kannst du. Ich hab's getan. Und du kannst tun, was du willst. Und ah, es wird eine Gruppe bedeuten. Okay, das ist
also sehr großartige Funktion, um Ursprung zu schaffen. Lesen Sie Inhalte sofort. Ok. Sie müssen also nicht immer wieder alles generieren. Sie können hier drüben sehen. Das sind Duplikate. Ok. Mein Kinderschutz. Kinderproduktion, Kinderschutztraining Dann haben wir eine andere Funktion, die Prototyping genannt wird. Sie können alle Bildschirme verknüpfen, die Sie sehen oder hören können. Hier ist ein Abschnitt Prototyp, und Sie können den Prototyp auf Ihrem Desktop anzeigen. Du kannst deine Haare sehen. Hier ist ein Prototyp. Dies ist eine großartige Funktion, da
Sie im User Experience Design Ihre Prototypen mit Ihren Benutzern testen müssen. Sie müssen sehen, wie Benutzer das wirklich nutzen werden. Ob dieser Knopf für ihren Tom genug ist oder ob er dort fehlt, Tom. OK, also alle möglichen Dinge, ob der Abstand zwischen diesen beiden Elementen gut genug ist, dass der Benutzer nicht auf dieses
klopft und dieses öffnet. Okay, sind
also einige tolle Funktionen von Adobe X'd, und ah, wir werden eine Menge Dinge darin abdecken. Ok? Außerdem können
Sie sich bewegen. Ich werde eine Vorschau auf Ihre, äh, diese Prototypen. Sie können sie direkt auf Ihrem Handy anzeigen. Das Handy Ihres Benutzers. Außerdem können
Sie die Konstruktionsspezifikationen freigeben. Okay, lassen Sie mich Ihnen die Design-Spezifikationen zeigen. Hier haben wir die Design-Spezifikationen aus dem gleichen Projekt, und Sie können sehen, ob ich zu einem dieser gehe. Es zeigt mir, dass dieses Grün mit diesem verbunden ist. Also, wenn ich zu diesem hier gehe, Okay, so zeigt es alle Farben auf diesem Kunstboard zusammen mit all den richtigen er Stilen verwendet . Also, wenn ich auf einen off thes Artikel klicke, wird
es die Details zeigen, dass Was ist das Dorf in der Höhe von diesem Artikel? Was ist der Abstand zwischen diesen beiden Elementen von eso? 16 Punkte. Also all diese Dinge Farben, Rundheit. Das ist die Rundheit dieses Knopfes. Ok, abgerundete Ecken. Und es zeigt auch andere Fakten, wie Schatten und dieses Zeug. Okay, das ist
also sehr praktisch. Es ist jetzt in bitteren Design-Spezifikationen, Peter. Sie versuchen, es für die zu verbessern, und ich hoffe, es wird ein großartiges Feature in naher Zukunft sein. Ok. Ok. Jetzt hintere Zehe, Adobe X'd wenige weitere Funktionen, die ich wirklich liebe, ist diese Symbol-Bibliothek. Sie können Assets sehen. Ich kann alle Farben hinzufügen, die ich alle verschiedenen Textilien verwendet habe,
und, äh, Stile, die ich in den Symbolen verwendet habe, ist eigentlich das wiederverwendbare Element. Sie können ein Symbol erstellen und es multiplizieren oder auf jedem Bildschirm verwenden. Und wenn ich irgendwelche von den Symbolen gemacht habe, können
Sie Overhead sehen. Ich weiß, wir sind im Prototyp mehr. Also hier haben wir ein Symbol. Okay, das ist
also ein Symbol. Und wenn ich versuche, die Farbe aus dem Symbol zu ändern, können Sie sehen, dass es sich überall geändert hat. Verschiedene Kunstbohrungen im gesamten Design. Wo immer ich dieses Symbol benutzt habe, wird
es geändert werden. Das ist also ein tolles Feature. Sie können sofort alles auf Ihrem Kunstboard ändern. Wenn es ein Symbol ist, wird
es auf allen Kunsttafeln aktualisiert werden. Diese Seite ist also im Grunde in den Styleguides, die wir normalerweise verwendet haben, um in einer anderen
Software oder irgendetwas in Zeppelin zu erstellen . Oder wenn Sie meine anderen Kurse gewaschen haben, wissen
Sie, was Styleguides sind? Sie sind im Grunde die Styling-, Farb- und Typografieanleitungen für die Verwendung
verschiedener vier Größen, verschiedenen Farben und wie sie in unserem Design verwendet werden. Okay, das sind
also all die tollen Features von X t, und ich werde Ihnen eine Menge off deal zeigen und wie wir diese Designs
schnell
inX t generieren können. in wirklich notwendig. Sie möchten Ihren Prototyp zeigen oder Sie arbeiten ab Demo. Tun Sie Ihren Kunden oder Ihren Benutzer und Sie wollten es sofort innerhalb von zwei Stunden oder zwei Yards
oder vielleicht vier Stunden tun . Ich denke, diese Art von Entwürfen mit diesen vielen Bildschirmen, wie eine Tür neun Bildschirme. Ich denke, du kannst es nur bei uns tun. Und auch Sie können Ihre Prototypen teilen. Sie können sehen, wie ihre Haare Prototypen veröffentlichen. Okay, Sie können Ihren Prototyp Link Toe jeden von Ihrem Kunden oder Kunden im Handumdrehen teilen, und sie können es auf ihren Geräten tun. Okay, jetzt, in der nächsten Lektion, werde
ich Ihnen zeigen, wie Sie es herunterladen und wie Sie diese Software kaufen, wenn Sie es wirklich kaufen
möchten. Aber im Moment, wenn Sie lernen, müssen
Sie nur den Download der Testversion. Okay, also fahren wir mit der nächsten Lektion fort.
3. Adobe Xd herunterladen: Okay, jetzt geht es weiter. Wir werden bei Obey X'd Testversion herunterladen. So gehen Sie zu diesem Juwel Adobe dot com Produkte slash x Tat Künstler TML gehen oder ich
werde diese Welt mit Ihnen teilen. Okay, das ist
also die kostenlose Testversion. Sie können die Testversion für einen Monat herunterladen, und Sie können sie auch kaufen. Also, wenn Sie auf diese jetzt klicken, ist
es Schmutz billig jetzt, und es ist für $10 Wohnung. Okay, so das ist erst vor kurzem, ich denke, es gibt andere APS gibt für $20 pro Monat, aber tatsächlich ist für $10 Wohnung. Okay, wenn du es wirklich kaufen willst. Ok. Jetzt kommen zu den Systemanforderungen. Ok. Also, bevor Sie es auf Ihrem PC sind Mac installieren, das ist sehr große coole Sache über diese App, dass es für beide
Betriebssysteme zur Verfügung steht . Okay, wenn Ihr Benutzer oder Ihr Client sie auf einem PC oder einem Mac arbeiten, können
sie ihr Design sehen, und sie können damit spielen. Okay, hier haben wir die Systemanforderungen für Mac OS, das ist Mac OS 10.11 und neuer. Okay, das
sind die Speicher für G B, 1,4 Gigahertz bekannt. Bereit? Nicht anzeigen. Retina empfohlen. Ok. Und dann haben wir Windows 10. Irgendjemand? Drei Update. OK,
also, wenn Sie einfache Fenster haben, dann und Norden und Gnade Update oder etwas unter dieser Version 16 07 es geht toe. Geben Sie Ihnen ein Problem. Sie können es nicht viel von Schülern installieren. Sie fragten mich, wie man es unter Windows 10 installiert. Stellen Sie sicher, dass Sie ein Gnadenupdate oder die neueste Version von Windows 10 haben. Ok. Und das sind die Anforderungen CPU, zwei Gigahertz-Speicher für G B A, G B, aus Installationsraum und Display. Und steigen Sie dort hinab. Ok. Ich ziehe es wirklich vor, dass du eine gute Grafikkarte bei Leeds hast. Zumindest mit Koji bi oder einem GB aus RAM auf Ihrer Grafikkarte. Ok? Weil es für die meisten von ihnen Design-intensive Anwendungen notwendig ist. Okay, das
sind die Anforderungen, also stellen Sie sicher, dass Sie voran gehen. Wenn Sie überhaupt Baxter noch nicht installiert haben. Versuchen Sie, die kostenlose Testversion zu installieren und laden Sie sie herunter und installieren Sie sie, und ich werde Sie in der nächsten Lektion sehen.
4. Warum Adobe Adobe Xd so großartig ist.: drei und werde euch vorstellen. Verdrahtet wird ausgestorben ist so beliebt bei User-Interface-Designern. Sie sind Designer und User Experience Designer. Es gibt mehrere Dinge oder Sie können sagen,
Funktionen, die in jeder Art von Design-Tool vorhanden sein sollte, um es perfekt für die
Benutzererfahrung zu machen . Designer genießen Designer. Jetzt. Die erste Funktion ist, dass es Prototyp erzeugen sollte Sind Sie? Ich entwerfe oder schirme jede App schnell ab, so dass wir schnell darin bauen können. Wir können entwerfen. Gewiss. Es sollte nicht wie den ganzen Tag dauern, um fünf oder sechs Dinge zu erstellen, oft App. Okay, das ist
also eine Sache. Zweitens ist, dass wir es leicht teilen können und wir können eine fantastische mit den Benutzern, das ist auch Sie bauen einen schnellen Prototyp dammit, Prototyp aus Ihrem Produkt X Testen Sie es mit Ihren Benutzern schnell. Also, wenn Sie mit dem Benutzer testen und ihm oder Herz Ihre erste Idee aus Ihrer App zeigen und hey etwas nicht mag oder er sagt, dass dies nicht das ist, was ich will. Sie können sofort sofort ändern Sie es in Adobe X T und generieren Sie einen anderen Prototyp weg weg und zeigte, dass Sie wirklich wollen, dieses ein. Okay, das ist
also ein weiteres Feature. Dritte Features, die sie jetzt wirklich eingeführt haben, sind für Entwickler. Was Entwickler brauchen, ist, dass sie tatsächlich Spezifikationen benötigen, färbt die Schnüre Farben in zugänglichen Werten oder RGB-Werten oder manchmal
einen anderen Wert rgl für Wert. Okay, also sind sie mehr daran interessiert, die Spezifikationen, welche Farben wir brauchen, um in unserem Team von
dieser App oder Website zu verwenden . Und was sind verschiedene Spezifikationen, die begeistert sind? Okay, diese sind vor kurzem in Adobe eingeführt, eigentlich, das ist, dass Sie Ihre generieren Ihre Elemente,
Ihre Design-Spezifikationen, extrahieren können , dass dieses Element so weit entfernt von diesem -Taste gedrückt. Okay, Sie können darin in Inspect-Element generieren, das heißt, ich denke, sie sind jetzt Feature Adobes Funktion in B-Division. Außerdem haben
sie vor kurzem eingeführt, dass Sie Ihre Adobe Extra-Designs in Tow Zeppelin exportieren können , was ein weiteres Werkzeug zum Erstellen von Konstruktionsspezifikationen ist und jede Erwähnung von
Ihrem Design aufgezeichnet hat . Und dann haben sie auch eingeführt, dass Sie Ihre Ebenen in immer cool exportieren können. Ok. Und auch gibt es noch einen. Ich denke, Proto durch, um irgendwelche Missionen von Ihrem Prototyp zu erstellen. Weitere Details und Emissionen sind Mikroanimationen. Okay, also geht es hier nur um diese Lektion. Ich hoffe, Sie haben meine diese Einführung operative txt genossen und was Sie damit tun können und warum es unter anderen Tools populär wird. Weil es noch einen Grund mehr gibt, dass die Dateigröße wirklich klein ist. Ich denke, es ist sogar kleiner als Skizze. Wenn Sie eine Skizzenkarte kennen, ist
sie kleiner als skizzenhaft. So entwickelt es sich schnell und friedlich und viele Funktionen werden jeden Monat hinzugefügt. Also rate ich wirklich, dass, wenn Sie Designer sind in einige UX-Design fühlen, sollten Sie wirklich lernen, wie man, wissen
Sie, mischen sich mit diesem Hand weg überschüssiges Angebot. Ok. Es ist wirklich cool. Leichtgewichtig, und ich hoffe, Sie werden es lieben. Okay, wir sehen uns bald. In einem anderen geringeren
5. Welcome wurde aktualisiert: Ich hoffe, dass
Sie bis jetzt Adobe XD bereits auf Ihrem Rechner installiert haben. Jetzt werden wir sehen, was dieser Willkommensbildschirm hier. Wenn Sie also Adobe X D ausführen, ist
dies der erste Bildschirm, den Sie sehen werden. Also hier unten können Sie sehen, das sind meine letzten Akten. Das sind meine letzten Projekte oder Dateien, die ich geöffnet habe. Ich kann sie erneut öffnen, indem ich auf eine dieser Optionen klicke. Auf der linken Seite haben wir verschiedene Bereiche wie zu Hause lernen. Hier erfahren Sie, ob Sie einige Videos von Adobe-Unternehmen zur Verwendung dieses Adobe XD sehen möchten. Dann haben wir Cloud-Dokumente. Adobe XD wurde kürzlich in die Cloud verlagert. Wenn Sie also eine Datei öffnen oder speichern, wird
sie auch in der Cloud gespeichert. Es bringt Ihnen also die Änderungen und die geänderte Historie Ihres Dokuments. Was auch immer Sie entwerfen, zum Beispiel, wie eine Stunde, um zu unserem vor zu gehen, wenn Sie es gespeichert haben, wird
es alle Änderungen widerspiegeln, die Sie mit der Zeit vorgenommen haben. So wird es automatisch in der Cloud aktualisieren. Das sind also Cloud-Dokumente. Wenn ich hier drüben klicke, können Sie sehen, dies sind alle Dokumente, die ich in meine Cloud hochgeladen habe. Sie können hier drüben sehen, sind einige Dokumente. Wenn Sie sie löschen möchten, können
Sie hier klicken. Sie können sie wie folgt löschen. Sie können sie auch sortieren. Dies sind verschiedene Optionen. Und dann haben wir mit dir getupft. Das sind also die Dateien, wenn jemand anderes
seine Projekte mit mir geteilt hat und ich mit ihnen an den Cloud-Dokumenten arbeite. Das wird hier drüben sein. Dies sind alle gelöschten Dateien. Also löschte ich es kürzlich, hob diese Datei auf. Also, das ist alles hier. Nun, wenn Sie auf Links verwalten klicken, wird
es in Ihre Cloud gehen hier können
Sie diesen Macleod sehen und sobald Sie auf die Verwaltung klicken, aber dann sind die alle veröffentlichten Prototypen oder Design-Spezifikationen oder Projekte, die ich haben mit denen geteilt. So können Sie sehen, ob Sie genau auf hier unten sehen, es sagt Prototyp, Prototyp, Prototyp, Prototyp Design Spezifikationen, Design Specs Prototyp. Das sind also verschiedene Dateien, die ich mit anderen geteilt habe. Sie können hier sehen, dies sind veröffentlichte Links, also sind diese alle, die ich mit anderen geteilt habe. Sie können sie hier drüben verwalten. Sie können hier klicken, Sie können diesen Link kopieren und mit anderen teilen. Sie können diese freigegebenen oder veröffentlichten Links endgültig löschen. Nun gehen wir zurück zu unserem Adobe XD-Bildschirm und Sie können sehen, ob wir zurück nach Hause gehen,
das ist alles, was wir haben, sind hier, unsere Cloud-Dokumente mit mir geteilt, gelöschte Dateien, verwaltete LINCS, verwaltete Links für die Dateien, die ich mit anderen geteilt habe. Also, das ist alles über diesen Willkommensbildschirm. Ich hoffe, Sie haben diese Lektion genossen. Lassen Sie uns weiter gehen und die Schnittstelle in der nächsten Lektion besprechen.
6. Einführung in die Benutzeroberfläche XD NEW: Jetzt werden wir eine neue Datei dafür öffnen. Wir haben hier verschiedene Vorlagen. Hier haben wir iPhone, verschiedene wenige wollen eine iPhone-App oder Google App oder Android-App zu entwerfen, Sie gehen und hier, wenn Sie für Web-Design gehen wollen, werden
Sie einige der Vorlagen hier über. Wenn Sie etwas für soziale Medien,
Instagram-Posts, Twitter-Posts,
Twitter-Header Fade,Facebook-Beiträge entwerfen Instagram-Posts, Twitter-Posts,
Twitter-Header Fade, möchten, schießen Sie Ihr Video. Du wirst hier rüber gehen. Sofort. Ich werde etwas von hier auswählen. Wie, lassen Sie uns dieses Google Pixel für, für Excel. Das ist unser Kunstbrett hier drüben. Also lasst uns dieses maximieren. Und Sie können oben sehen, es steht unbetitelt und hier ist ein kleiner Cloud-Login und es zeigt mir die Zeit hier drüben. Also lassen Sie uns hier klicken und ändern Sie den Namen in unsere, sagen
wir zuerst Besuch in XD speichern. So, jetzt können Sie sehen, ich habe bereits einige Plug-Ins und Stern, so zeigt es mir, dass ein Plug-in braucht Update wir
jetzt habe ich werde dieses zu schließen. Und das ist unsere einfache Schnittstelle oder Adobe X auf der rechten Seite können Sie sehen, wir haben einige Optionen hier drüben, wie dies ist Zoom-Level. Wir können auf 100% zoomen. Dies ist ein 100% dieses Designs. Dies ist unsere Desktop-Vorschau für den Prototyp. Dies ist unsere Mobile Preview. Wenn wir die mobile App installiert haben und wir diesen Bildschirm auf unserem Handy sehen möchten. Das wird hier sein. Wenn ich jemanden einladen möchte,
jemand anderen, einen anderen Designer, kann
ich hier klicken. Dies ist noch in der Beta, so dass ich die Bearbeitung aktivieren kann. So kann ein anderer Designer mein Design zwei bearbeiten. Auf der linken Seite hier haben
wir drei Registerkarten, Design, Prototyp und Scher. Design ist, wo wir die Gestaltung rühmen unserer Bildschirme werden, werden
wir setzen anders. Aber da wir hier drüben andere Sachen machen werden. Zum Beispiel, diese Schaltfläche hier drüben. Und im Prototypenbereich werden
wir zwei oder drei Bildschirme verknüpfen. Zum Beispiel, wenn ich einen anderen Bildschirm habe, wo wir jede Verknüpfung und alles lernen, versuche
ich nur zu erklären. So, jetzt können Sie sehen, wir haben zwei Bildschirme. Eins ist diese 11 ist diese zweite. Ich kann sie so miteinander verknüpfen. Und das wird in unserem Prototyp sein. So werden unsere interaktiven Prototypen Overhead sein. Unsere Designdateien werden Overhead sein. Teilen wird sein, wenn wir unsere Entwürfe mit jemandem teilen möchten. So können Sie sehen, haben wir verschiedene Optionen, wo Design Review Feedback zu Ihrem Design oder Prototyp zu erhalten. Dann haben wir Entwicklung, wo wir unser Dokument mit
Entwicklern teilen werden , um ihnen den Code zu zeigen, den wir für all diese Elemente hier haben. Dann zur Präsentation, vielleicht wollen wir es unseren Kunden zeigen. Und dann für Benutzertests und dann für benutzerdefinierte benutzerdefinierte Einstellungen. Dies sind also verschiedene Einstellungen für die Freigabe Ihres Dokuments. Nein, ich gehe zurück nach Hause. Und wenn ich auf Startseite klicke, können Sie sehen, dass wir zurück zu
diesem Home-Bildschirm gehen können, wo wir jedes andere aktuelle Dokument öffnen können. Wieder haben wir einige Menü hier drüben, Sie können auf der linken Seite in Adobe XD sehen ist Mac-Version, wir haben das gleiche Menü oben auf MAC hier drüben. So kann ich hier klicken, Sie können sehen, wir haben neue offene Dokument. Dann haben wir verschiedene UI-Gates. Dann haben wir kürzlich Dokument, benennen Sie dieses Dokument um, speichern Sie als lokales Dokument. So können Sie dieses Dokument auch als lokales Dokument speichern. Jetzt wird das Problem sein, wenn Sie versuchen, es als Ihr lokales Dokument zu speichern, Ihre Änderungen sind Verlauf wird hier nicht gespeichert werden. So können Sie sehen, das sind die beiden Änderungen, die ich um 302 PM und 03:04 PM vorgenommen habe. Drei unsere 15:00 und vierte Minute, Ich habe tatsächlich diesen zweiten Bildschirm hinzugefügt. Also speichert es tatsächlich alle meine Änderungen in der Cloud. Also, wann immer ich darauf zugreifen möchte, kann
ich zum Beispiel zu diesem zurückkehren. Ich kann zurückkehren. Sie können öffnen in einem neuen Fenster sehen. Wenn ich also versuche, dies in einem neuen Fenster zu öffnen, können
Sie sehen, dass es nur einen Bildschirm hat. So können Sie sehen, dass wir dieses Mal Kreditnehmer hier haben. Und es ist der erste Bildschirm, den ich denke, mit dem ich angefangen habe. Das ist der Spaß. Wir begannen mit leerem Bildschirm. Es wird also den gesamten Verlauf
aller Änderungen speichern , die Sie nach vier oder fünf Minuten vornehmen oder vielleicht speichern werden. Ich bin mir sowieso nicht sicher. Also auf der linken Seite haben wir alle Werkzeuge. Dies sind die Werkzeuge, die wir in den nächsten Lektionen verwenden werden. Ich werde jeden von ihnen erklären. Dann unten haben wir hier Assets,
wir haben Ebenen Panel, wir haben unsere Plug-Ins hier drüben. Also, was auch immer Plugins Sie installieren werden, sind kostenlose Plugins. Einige von ihnen werden bezahlt. Sie können sie hier installieren und Sie können sie so verwenden. Also, wenn Sie hier klicken, können
Sie sehen, dass es einen Fehler sagt. Farbskala zu breit. Lassen Sie uns erstellen, Sie können sehen, dass dies eine Farbskala hier ist. Dies sind also die Plug-Ins, die Sie automatisieren und Ihre Adobe XD-Funktionen
verbessern werden. Das sind also die Werkzeuge. Das sind die drei, die wir uns vor allem
dieses Kunstboard hier an Bord von Arbor, Pelham ansehen werden. Das sind Kunsttafeln, eigentlich werden
diese Kunsttafeln genannt. Und das ist alles über die Oberfläche von Adobe XD. Wir haben drei wichtigsten Registerkarten hier drüben, Design, Prototyp und Teilen. Und das ist die Zoomstufe. Wir werden es viel benutzen. Dies ist der Play-Button, um unsere perfekte Zeit zu sehen. Sie können in diesem Fenster sehen, dies wird auch viel verwendet werden. Das ist also die ganze Einführung über die Schnittstelle. nächsten Lektion werden wir mehr über Adobe-Sexting eingehen. Springen wir zum nächsten S und jetzt.
7. Eigenschaften Paneel Adoe: Also, wenn ich wieder zu diesem Design gehe, können
Sie hier sehen, wir haben ein anderes Panel, das unsere Eigenschaften Panel ist. Okay,
also, wenn ich auf dieser Kunsttafel klicke Also diese Kunsttafel ausgewählt ist, und diese blaue Linie zeigt, dass diese Kunsttafel aktiv ist, Ich werde eine sehen alle Optionen angeblich zeigen. Tun Sie diese Art Board, wie mit auf der Position dieser Art Board Höhe von Steuerbord. Was ist, wird das Scrollen und Viewboard Höhe sein. Wie viel Höhe sichtbar ist, dann haben wir Aussehen, die Füllfarbe. Ich kann auch die Farbe ändern, wenn ich will. Oh, und ich meine, ich muss hier klicken. Okay, also kann ich auch Gitter erstellen und Leo ist drauf. Wir reden später über Gretchen-Layouts. Ich zeige Ihnen nur, dass dies das Eigenschaftenfenster ist. Okay, wenn ich
also auf dieses abgerundete Rechteck klicke, okay, wenn ich
also auf diesen runden Ablehnungswinkel klicke, kannst
du später alle Optionen sehen,
wie die Ausrichtung. Eine Wiederholungsnote. Diese Passform und diese Verärgerungsbeziehung Alles Okay, also ist das alles hier. Ok. Auf der oberen Leiste befinden sich Achsen. als wir es getan haben. Die Wiederholung hat unsere Vereinigung geschaffen. Sind diese Optionen? Ich will es jetzt nicht erklären. Sie müssen nur wissen, dass dieser Bereich für die Steuerung Ihrer Designobjekte dient. Okay, wenn Sie
also ein Kunstbrett haben, können
Sie dessen Höhe und andere Funktionen steuern. Wenn Sie ah, Rechtecke, Sie können verschiedene Effekte und verschiedene Größen und verschiedene Rundheit und unterschiedliche
Kapazität erstellen , wie die Eigenschaften Panels verwenden. Okay, also alles, die
meisten Dinge über jedes Objekt werden auf dieser Seite sein. Sie können sehen, was hier. Nun habe ich diesen Text und den Text ausgewählt. Ähm, Optionen sind hier drüben. Sie können sehen. Und wenn Sie die Kunst an Bord auswählen, werden
Eigenschaften im Zusammenhang mit Kunstbrett hier drüben sein. So verwenden wir also einen Job. A x t. OK,
Nun, Nun, es gibt zwei weitere Symbole auf der linken Seite. Unten können
Sie Layer und Assets sehen oder hören. Okay, jetzt, diese Vermögenswerte werden es alle Farben geben. Charakterstile sind Symbole, die ich während meines gesamten Designs oder aller Kunstbretter verwenden werde. Okay,
Also, wenn ich versuche, dies wie Tante Corrector Stil hinzuzufügen, können
Sie sehen, es hat einen R Traktor Stil in diesen Assets Bereich hinzugefügt. Okay, also verwechseln Sie dieses Design und den Prototyp nicht mit diesen beiden. Ok? Diese werden Ihnen alle Ebenen zeigen, und dies wird Ihnen alle Elemente zeigen, die Sie in Ihrem Design verwendet
haben. Okay, das ist
also die Einführung in die Benutzeroberfläche von Adobe X'd. Ich hoffe, Sie haben diese Lektion genossen. Fahren wir mit der nächsten Übung fort.
8. Adobe Xd und Unterschiede gewinnen: Okay, jetzt in diesem hören, wir sehen, was sind die Unterschiede zwischen Max Version aus. Nein, B, x d und B. Cs Version aus, also sei extra. Okay, das erste, was Sie bemerken werden, ist diese Stoppleiste, die Shortcut-Leiste hier drüben ist, die nicht in Fenstern vorhanden ist. Und obwohl die Verknüpfungen sehr leicht zu merken sind, aber es wird immer noch viel helfen. Okay, Sie können sehen, dass Sie wissen, was Sie mit diesen Objekten machen können. Sie können sie hinzufügen. kannst du. Es gibt Textoptionen, als wir einen Bereich haben und alles andere umhängen. Dann haben wir das ein Datum und eine Akte. Okay, das ist
also der erste große Unterschied. Dann haben wir noch ein paar Unterschiede. Wie Sie die kürzlich Adobe X t sehen können. Sie haben mindestens einige,
ähm, Plug Ins, die unterstützt werden, oder die Drittanbieter-Tools, die von Adobe X'd auf unterstützt werden. Und wenn ich zu diesem Export gehe, siehst du hier drüben Zeppelin. Jetzt ist
Zeppelin ein Werkzeug, und ein anderes Werkzeug wird jemals genannt und zwei, oder sehen Sie diese Art off Werkzeuge, die verwendet werden, um Kabel zu erzeugen und Spezifikationen
und Dokumente Spezifikationen zu erzeugen. Wenn Sie nichts über Zeppelin wissen, sollten
Sie meinen Workflow mehr als den Kurs darstellen, wo wir alle
Style-Guides,
Farben,
Teams,
alles innerhalb von Zeppelins generieren Style-Guides,
Farben, Teams, Teams, , die für den Shop verwenden. Ok. Nein, wir sind alle bereit. Ich habe einen erstellt, einen Absatz eine Überschrift in einer Schaltfläche, und wir werden ihn exportieren. Zehe Zeppelin. Mal sehen, was es hier passieren wird. Okay, also wählen wir dieses Kunstbrett und wir werden es nach Siplin exportieren. Okay, das ist
also wichtig. Also habe ich es in einem X erstellt. Also werde ich es in einem nächsten importieren, und es lädt das Design gerade jetzt hoch. Okay, also ist alles erledigt. Sehen wir uns das an. Okay, das ist
also sehr cool. Ich mag es wirklich. Okay, das ist
also unsere Überschrift, und das ist alles, was Sie in den Punkten sehen können, die für die mobile Entwicklung sind. Sie können hier drüben sehen. Dann haben wir das auch, die Farbe kommt auch in RGB. Ich glaube, es ist für uns. So können Sie hier sehen, wie wir es in Zeppelin exportieren können. Okay, also werden wir das später sehen. Wir gehen auf die Zehe. Sehen Sie sich dies später im Detail an. In den letzten Lektionen
gerade wollte ich Ihnen nur zeigen, dass Sie mit Adobe XY eine Menge Dinge tun können. Also, was Adobe Extra tun ist, dass sie normalerweise ihre neuen Funktionen zuerst für meine Frage veröffentlicht haben, und nach ein oder zwei Monaten wird
es im Schlepptau enthalten sein. Die Frage nach dem Fenster. OK, also mach dir keine Sorgen, wenn du Fenster hast, die dir fehlen. Okay, das ist
also kein großer Unterschied. Okay, also gibt es noch einen Unterschied, den ich vergessen habe, dir zu sagen, wenn du
hier einen Prototyp erstellst , also werde ich diese Unterdrückung meiner Kunstoptionstaste duplizieren. Und ich werde die Zehe gehen. Erstellen Sie einfach einen einfachen Prototyp. Ich würde diese beiden Bildschirme verknüpfen, erscheinen so aufgelöst, und ändern Sie einfach die Farbe von dieser Schaltfläche. Wir wissen also, dass wir drinnen sind. Ein anderer ist hier rüber gegangen. Okay, also alles erledigt. Jetzt spielen wir das, und Sie können hier drüben sehen. Äh, was Sie hier sehen können, ist ein kleiner Knopf, der Aufzeichnung ist. Ok. Also kann ich das drücken und ich kann ein Video von meiner Vorschau aufnehmen. Ok? Und dann kann ich es so exportieren. Es wird ein Video sein. Es wird ein Video zu speichern erneuern, brutal Typ. Und Sie können dieses Video mit jedem teilen. Okay, Moment ist
dieser Beamte nicht in Windows verfügbar. Ich hoffe, es wird bald in ihnen kommen. Die nächsten paar Upgrades, vielleicht nächsten Monat oder vielleicht von März oder Apple. Ich weiß es nicht. Dies ist auch eine nette Funktion, die nur in Adobe X'd Mex Version vorhanden ist. Und ich hoffe, Sie haben diese Lektion für die Mac-Benutzer genossen. Ich denke, das ist ein Schöpfer, Will und Sie können eine Menge Dinge damit tun. Ich hoffe, Sie haben diese Lektion genossen. Wenn Sie Fragen haben, um mich zu stellen, es sei denn, gehen Sie mit der nächsten Lektion.
9. Updates und kommende Funktionen Xd: eines der besten Dinge über Aerobic T ist, dass es regelmäßig aktualisiert wird. So Adobe ein Unternehmen und sie arbeiten daran Tag für Tag und Nacht für Nacht und die fast geben Ihnen ein Update jeden Monat. Okay, damit Sie das letzte Update sehen können. WAAS 11. Dezember 2017 und die neueste ist in der Regel 22. 2018. OK, also haben sie eine bessere Zonenleistung. Dropbox-Vorschau für zusätzliche Datei wechseln zwischen Farbmorse drei verschiedenen farbigen Morse sie bieten jetzt und neue gierige INs. Wirklich Zutaten verbessern mental Design Spezifikationen Anzeige sind umrandet 100% und neue Funktion, die Batch-Export genannt wird. Außerdem beginnen
sie mit der Arbeit von Drittanbietern durch Integrationen wie Zeppelin. Niemals vor Gericht. Legen Sie einfach einen Kuchen und Führer zusammengesetzt. Okay, also ah, Sie können hier sehen, dass sie gezeigt haben, dass für Mac auf Lee. Es gibt also einige Features, die ich Ihnen in der nächsten Lektion zeigen werde. Ein paar von den Unterschieden, die Sie auf meiner Frage sehen werden. Mac-Version ist etwa 10%. Oder vielleicht kann ich sagen, 5% Kopf aus Fenster Vision. Okay, sie haben
also mehr Funktionen auf dem Mac. Zuerst starteten sie sie zuerst auf Mac, und dann starten sie unter Windows. Okay, also hier geht es um die Updates. Lassen Sie mich Ihnen noch eine Sache zeigen, dass sie an vielen Feature-Anfragen arbeiten. Okay, das ist
also Adobe Extra-Feature-Anfrageformular, und Sie können hier sehen, Leute stimmen für verschiedene neue Funktionen, wie Text für die Paarung. Und dann haben wir das statische fixierte Objekt zwischen Traditionen. So können Sie sehen, dass dies die Rezension aus einer Debatte ist? Sie sagen, Funktion, die überprüft wird. Okay, so dass sie diese Funktion überprüfen, als sie Funktion haben, benötigt mehr Informationen als sie im Rückstand angezeigt
haben. Okay, es gibt
also wenige Funktionen, die sie bereits gearbeitet haben, begonnen haben, an denen zu arbeiten, wie Sie sehen oder hören können, was Flüchtlinge Sport Funktionen begonnen hat, also hoffentlich werden sie es verlieren in im nächsten Monat, oder vielleicht zwei Monate danach. Fangen Sie an, daran zu arbeiten. So können Sie sagen, das ist sehr cool Feature. Sie können auf dem Laufenden bleiben, was als nächstes in einer Tür kommt. X'd. Okay, fahren
wir mit der nächsten Lektion fort, wo wir sehenwerden, wie man
anfangen,X d zu verwenden. , werden, wie man
anfangen,X d zu verwenden
10. Übung – Erste Aufgabe: Nein. Wir werden einige praktische Dinge mit Adobe Extra bekommen. Okay, wir haben viel darüber geredet, und jetzt werde ich Ihnen zeigen, wie Sie ein paar einfache Sachen darin erstellen können. Okay, also machen wir diesen ersten Auftrag. Das wird Ihre Aufgabe sein. Ich werde einen einfachen Bildschirm erstellen. Lassen Sie mich es Ihnen zeigen. Also habe ich dieses Kunstboard geöffnet, das iPhone 678 ist, und ich werde Zehe drücken Sie die Kontrolle Null Befehl Null, zoomen Sie hinein. Oder Sie können auch hier rüber gehen und 200% zoomen. Okay. Nun, was ich möchte, dass Sie einfach auf diesen Ellipsenhocker klicken und einfach die
Umschalttaste ziehen und halten , damit Sie einen proportionalen Kreislauf machen können. Wir sind hier, und jetzt drücken wir das, wählen wir aus und wir werden es in der Mitte schaffen. Okay, wenn es einmal in der Mitte ist, können
Sie sehen, dass es eine rosa Linie oder einen intelligenten Führer gibt
, der uns zeigt, dass es in der Mitte ist. Dann gehen wir hier rüber, und das ist unsere Grenzgröße. Wir können die Randgröße auf vier erhöhen. Und ich werde mein Bild Jewel voranzutreiben, und ich werde es ziehen und es so in diesen Kreis fallen lassen. Okay, also möchte ich, dass du so etwas machst. Sie können Ihr eigenes Bild verwenden. Sie können auch die Rahmenfarbe ändern. Klicken Sie hier, und ich kann den Grenzkiller-Zehe auf 7 zu 7 ändern. So etwas. Und dann möchte ich, dass du hier drüben einen Text schreibst. Zum Beispiel ist
dies mein Titel. Ähm, wie Mohammed und CES. So etwas. Und ich möchte, dass du hier drüben deinen Lieblingsplatz gibst. Okay, also vielleicht okay, also wenn dein Text ein bisschen länger ist, also gehe ich zu Fuß, ist dieser Angriffsgröße hier drüben. Mach dir keine Sorgen darüber, dass ich das bin. Ich werde im nächsten Abschnitt eine Menge Details eingehen, also tun Sie es jetzt nicht sehr. nur die Textgröße auf so etwas wie 16 sehen, können
Sie Nein sehen, wenn ich versuche, mich zu bewegen, zeigt
es mir die Entfernungen zwischen verschiedenen Elementen. Außerdem kann
ich das hier auswählen und ich kann von hier aus auf etwas Brett gehen, okay? Und ich kann sie auch in der Mitte so ausrichten. Das ist schon in der Mitte. Okay? Und dann will ich, dass du den Zeh hast. Habe einen Knopf hier drüben. Also werden wir eine Schaltfläche mit Bezirks-Winkel-Tool erstellen. Klicken Sie auf den Sektenwinkel. Dies ist eine sehr einfache Übung. Mach dir keine Sorgen, dass du Nein bist. Sie werden in ein Problem geraten. Entfernen Sie den Rahmen und für das Feld. Ich will die Farbe. Und ich werde mein Steuerwerkzeug verwenden, um etwas darauf zu erstellen. Wie mich einstellen. Okay, also habe ich eine Brust-Flucht oder V zwei ausgewählt. Und dann werde ich woanders auswählen. Ja. Bewegen Sie es in der Mitte so. Und ich werde sein Gefühl ändern. Die Farbe ist da drüben auf der rechten Seite. Ich werde es für nichtig machen. Okay? Sie können auch beide auswählen, wie dieser Drachenschlaff, und Sie können sie in der Mitte so ausrichten. Aber normalerweise mag ich das. Ich sollte es nach oben schieben. Und ich habe ausgewählt, sie wieder so abgekauft und sie so nach oben zu bewegen. Es ist sehr einfach Werkzeuge, Zehendesign und Arbeit hier drüben. K Auch, wenn Sie möchten, können
Sie hier auch etwas so eingeben. Also, wenn ich einen Absatz von Text wollen sind eine Menge Text, Ich werde klicken und ziehen Sie so und bla bla, bla,
bla, bla, bla, bla, bla, bla, bla, bla, bla, bla. Okay, das ist eine schöne Poesie. Und ich werde die Füllfarbe ändern. Okay, also muss ich zuerst diesen Text auswählen und die Filmfarbe zu so etwas ansehen. Okay, also will ich nicht, dass du bla schreibst,
bla . Hey, also werde ich mit regulären gehen und ich werde die Zehe gehen. Hast du es kapiert? 18 Ausgänge aus der Größe. Okay, also lasst uns hier etwas schreiben. Ich werde es überspringen. Okay, also habe ich etwas über mich geschrieben. Okay, also werde ich das entfernen, und ich werde das hier drüben so benutzen. Und das kannst du in der Mitte benutzen. So etwas? Ja, weil es eine sehr liegend in der Mitte ist, und ich kann so etwas benutzen. Und jetzt können Sie hier sehen wir haben Lassen Sie uns die Füllfarbe Zehe dunklere Farbe wie diese ändern. Okay, das wird
also Ihre erste Aufgabe sein. Nur dein Name, was du liebst und was du tust und was du magst und was du in nur zwei Zeilen gesehen hast und Abberton. Okay, also wenn Sie den Radius von der Last wollen Zehe ändern wollen, machen Sie die abgerundeten Ecken, die Sie hier tun können, wie ich es wollte. Acht Pixel gerundet. Sie können Ihre Haare sehen Wenn ich etwas Schatten hinzufügen möchte, Sie können auf diesen Schatten nichts ändern klicken, Spielen Sie nicht viel mit diesen Werten wurden Ah decken, viel im Detail. Dies wird also Ihre erste Aufgabe sein, die Sie so etwas wie
dieses erstellen möchten . Erstellen Sie einfach eine Ellipse. Ziehen Sie Ihr Bild in es Ihren Namen, was Sie mögen. Sie können es auch ändern Zehe ein bisschen Gnade Farbe. Es gibt also einen Kontrast zwischen diesen beiden und einer schönen Bürde und etwas Schatten um sie herum. Sie können auch die Ecken runden, wenn Sie möchten, und Sie können auch etwas Spooks verwenden. Also werde ich vier für die abgerundeten Ecken verwenden. Lassen Sie uns Kapazität 100% machen. Okay. Also kannst du so etwas tun. Lassen Sie mich diese Farbe in so etwas ändern. Das ist also professioneller. Okay, also möchte ich, dass du so etwas erstellst und ah, im nächsten Auftrag
gepostet. Und wir sehen uns bald im nächsten Abschnitt.
11. Zeichenflächen und Raster in XD: Nun, das erste, worüber ich sprechen werde, sind Kunstboards, denn dies ist das erste, was Sie in Adobe X'd begegnen werden. Okay, also bin ich für dieses Beispiel. Ich gehe Zehe wählen Sie dieses Web, und ich werde dieses 12 80 Yard Board wählen und lassen Sie uns in Befehl oder Steuerung plus zoomen oder einfach Befehl drücken oder Null Zehen steuern. Umit Zehe die Passform und innerhalb dieser Leinwand. Also hier haben wir über unser Board. Dies ist der Name des Kunstbretts. Wenn Sie möchten, können Sie doppelklicken, und Sie können wie Website-Design oder so etwas bearbeiten. Okay, jetzt, wann immer Sie ein Kunstboard auswählen möchten, müssen
Sie auf seinen Namen klicken, also klicken Sie einmal und es wird ausgewählt und Sie können verschiedene Optionen sehen und später toe diese Art Board über hier. Dies ist die Breite und die Höhe. Wenn Sie Medaillon wollen, können
Sie, wenn Sie wollen. Schau, es wird das Seitenverhältnis sperren. Und wenn Sie dies erhöhen, wird auch
der zweite Wert erhöht werden, was wir normalerweise nicht wollen. Okay, Dann haben wir dieses Porträt und Landschaft mehr, was nicht uh, macht Sinn im Web-Design, aber in der mobilen App, also macht es Sinn. Okay, dann haben wir dieses Scrollen. Okay, Scrollen ist, dass, wenn Sie einen Prototyp aus diesem Design erstellen, ob Sie eine Bildlaufleiste hier drüben wollen, um ihr Design zu scrollen und okay, also so etwas wie dieses. Also Vieux Port Height wird entscheiden, wo der Scrollkörper. Also, wenn ich das habe, äh, Vieux Port Heights sagte zu 600, können Sie hier sehen, ist mein Schulbiss. Okay, das ist meine Seite voll gesso im Webdesign. Zeitfalte ist der Bereich, der beim ersten Mal sichtbar wird, und jemand besucht. Okay, also bis zu diesem Bereich, wird
die Website als nächstes sichtbar sein, wir Rollerball verquirlen. Okay, jetzt gehen Sie zu dieser Erscheinung. Aussehen ist im Grunde die Hintergrundfarbe Ihres gesamten Designs. Sie können es auf alles einstellen, was Sie wollen, aber ich denke, es Zeh weiß zu halten, ist die beste Option. Oder hier. Okay, lasst uns nochmals darauf klicken. Okay, jetzt haben wir die Gitter. Dies sind sehr wichtige Konzepte, und dies wird in erster Linie im Webdesign verwendet. Eine Menge. Okay, Also, selbst im Grafikdesign gibt es zwei Arten von Rasterlayouts. Eines ist dieses Layout, das säulenbasiert ist, und die 2. 1 ist quadratisch am besten. Okay, so quadratische Größe ist normalerweise für mobile Bauchmuskeln gedacht. Es ist nicht gut für ich denke, Web-Design, aber es kann schnell Objekte platzieren, wenn Sie möchten. Oh, so wie das. Okay, das ist
also sehr, weißt
du, es wird jede Schachtel in die Zehe stecken. Okay, also ist es einfacher, deine so zu Fuß zu gehen. Okay, Aber es macht mehr Sinn im mobilen Design kam und Sie entwerfen für mobile Labore. Es macht mehr Sinn. Lassen Sie es uns noch einmal löschen. Gehen Sie zum Quadrat und das ist die Größe von der Fliese. Sie wollen, wenn Sie wollen, wie 24 Schweine, Analphabeten, harte Angst, quadratische Größe. Sie können es auf 24 einstellen. Sie können es auf 64 setzen. Es hängt alles von Ihrer eigenen Wahl ab. Dann gehen wir auf die Zehe. Diskutieren Sie dieses andere Layout, das spaltenbasiert ist. Wir verwenden normalerweise im Webdesign. Ein 12-Säulen-Layout und das Wohl davon hängt von Ihrer eigenen Wahl ab. Aber normalerweise, wenn Sie die Bootstrap-Einstellungen verwenden, wird es 30 Pixel sein. Dann gehen wir zu diesem Rand. Ränder sind im Grunde dies der ganze Raum auf der rechten Seite, dieser weiße Raum oder und auf der linken Seite. Also werde ich es auf 30 so etwas anpassen. Okay, also zeigt es mir das. Möchten Sie unterschiedliche Ränder auf jeder Seite oder gleiche Ränder? Also, wenn ich auf den gleichen Rand klicke wird es 31 Pixel setzen, so ein Pixel spielt keine Rolle, also werde ich damit leben. Okay, das ist
also unsere fast Bootstrap-Stil Gier. Und wenn du willst, dass du in der Größe Zehe 12 unter 11 70 so etwas kongierst. Ok. Und wenn Sie unterschiedliche Ränder auf jeder Seite wollen, ist
dies die Option, die Sie verwenden werden Stop, Schritt unteren und linken Rand. Ok. Sie können es auch später zur Standardspalte „Einstellungen“ machen. Okay, so, und es wird auf Standard gesetzt. Also, wenn Sie beginnen, einige Spalten zu verwenden, wird
es zu diesen Defar-Einstellungen gesagt werden. Das sind also die Grundlagen. Grundlegende Eigenschaften von jedem Kunstboard. Wenn du noch ein Artboard willst,will ich
vielleicht noch eine Dartscheibe. Wenn du noch ein Artboard willst, Klicken Sie also auf dieses Art Board Tool und ich werde auf eins klicken. Also was? Hier? Und sie wird jetzt eine andere Kunst erzeugen. Die zweite Option ist, dass, wenn ich die Spitze will, klicken Sie
einfach zuerst auf V. D. D.
Ausgewählt und klicken Sie erneut auf das Kunstboard und Sie können verschiedene Art Boot-Optionen sehen . Also, wenn ich will und iPhone sechs klingen eine Vorlage hier drüben, kann
ich darauf klicken, und es wird parallel zu meinem Web-Design sein. Okay, wenn ich dich
also sah, klickte
ich noch einmal. Also lassen Sie uns die Zehe wieder bewegen, alle
bewegt und ich werde ein wenig verkleinern, damit wir sehen können, gekauft die Kunst langweilig. Und jetzt, wenn ich es verschieben will, habe ich es ausgewählt und dann kann ich es bewegen, okay. Also kann ich es hier drüben platzieren, oder ich kann es hier drüben platzieren, wann immer ich will. OK, so ist das, wie Sie verschiedene Ansichten von der gleichen Website Norgay erstellen und ich werde außerhalb
klicken und wählen Sie die Art Board-Tool durch Drücken eines und ich kann auch auf
Android-Tablet klicken . Okay, also, nein, ich habe drei Ansichten. Einer ist eine Website oder Desktop Sie als wir haben Vorlage, Ansicht, und dann haben wir iPhone-Ansicht. Wenn ich hier klicke, kann
ich sein Layout durch vier Spalten ändern, die wir normalerweise auf Mobile APS verwenden und überstanden haben. Es wird 16 sein und ich möchte, dass die Ränder auf der rechten und linken Seite 24 s sind. Also werde ich Zehe wählen 24 oder hier. Ok. Also okay, so ist es um es auf 25, was gut ist. Okay, also hier ist meine Einrichtung für Web-Version von der gleichen Website ein Spiel. Also werde ich hier vier Spalten verwenden,
und dann werde ich hier acht Spalten verwenden,
so dass Sie sehen können, dass es ziemlich weit auf acht Spalten gesetzt ist, was sehr erstellt ist. Ich liebe diese Software wirklich. Sie haben sehr gute Standardwerte, also lassen Sie es auf 32. Okay, das sieht toll aus. So richte ich meine Kunstbohrungen ein, wenn ich verschiedene Ansichten von meiner Website aus entwerfe . Ok. So mobile Ansicht, Andhra Tablet-Ansicht und Desktop-Ansicht. Ok. Also werde ich nicht ins Detail gehen und ein Website-Design in diesem erstellen, aber so werden Sie Ihre Rohde einrichten. Nun, wenn Sie eine Kunsttafel löschen möchten, können
Sie auswählen und drücken Sie Löschen, und es wird diese Kunsttafel löschen. Okay, also ist es so einfach. Außerdem können
Sie von hier aus auswählen und löschen. Und auch können Sie kopieren und verschiedene Befehle duplizieren, die Sie hier sehen können. Okay, so benutzt man diese Kunstbücher. Ich hoffe, Sie haben diese Lektion genossen. Gehen wir zur nächsten Lektion und sehen uns bald.
12. 8 Tools in XD: in dieser Lektion. Wir werden über diese Symbolleiste erfahren, die wir in Adobe X'd haben. Also gehe ich schnell durch all diese Objekte und die Hocker Bar. OK, also werden wir mit diesem iPhone beginnen 678 Lassen Sie uns hineinzoomen. Befehl Null auf Kontroll-Null. Und hier haben wir unseren Hardball. OK, also ist das V reichste Auswahlwerkzeug, das ist, äh, das Sie alles mit ihm auswählen können. Okay, dann haben wir das Sektenwinkelwerkzeug, das unser r ist und Sie können erstellen, aber endet damit. Drücken Sie einfach, und hier haben wir nur Drag & Drop in der Mitte. Und das ist Grenze. Dies sind verschiedene Eigenschaften von ihm. Wir werden später in diesen Bereich kommen. OK, das sind Ausrichtungen. Wiederholen Sie Gradhöhen mit Aussehen und unterscheiden Sie diesen Radius Eckenradius Feeling Rand. Wir werden uns diese jetzt in einer anderen Lektion ansehen. Ich werde Ihnen alle Werkzeuge vorstellen, die hier drüben verfügbar sind. Ok? Wir haben sehr begrenzte Werkzeuge und das ist die Straße Sache über diese Adobe extra. Okay, dann haben wir diese Sonnenfinsternis und Sie können halten Shift Toe teilen, wissen
Sie, haben Sie es in einem proportionalen Verhältnis und Sie können Kunst mit ihm drücken sind Option Key Toe machen und wachsen es in Zerstörung. Okay, also wird es von der Mitte so wachsen. Also liegt es an dir. Ich werde es in die Mitte legen. Okay, dann haben wir dieses Zeilenwerkzeug. Sie können dieses Linienwerkzeug überall verwenden, wo Sie möchten. Okay, also hier haben wir diese Linie. Dann haben wir den abgebrannten Brennstoff und diese Abkürzungen sind sehr einfach. Und ah, was wir in der Benutzererfahrung nennen. Design, Mapping, Mapping Es ist einfacher sich zu merken. Okay, also Ps Pentti ist Text unsere Grenzen a Exumas e also sind diese selbsterklärend. Du brauchst dich nicht an sie zu erinnern. Okay, dann haben wir dieses Textwerkzeug, als wir dieses Stift-Werkzeug haben. Mit mentaler, können
Sie verschiedene Formen wie diese erstellen. Flickern Sie einfach weiter. Und dann können wir auch klicken und ziehen. Klicken Sie auf und lassen Sie es einfach so. Klicken Sie dann und ziehen Sie, so dass wir viele verschiedene Formen erstellen können. Es ist fast ähnlich wie für ein Geschäft. Okay, wir werden später in die Tiefe kommen. Okay, das ist
also Textil. Sie können einfach die 30 auswählen oder und Sie können hier etwas wie etwas schreiben. Was haben Presse Flucht und das war's. Drücken Sie V, und Sie können es auswählen und verschieben. Nun, die Ausrichtungsoptionen. Oder Sie können sagen, intelligente Ausrichtung ist sehr anspruchsvoll für das neue kommende. Ihre Design-Software ist wie Skizze, und es wird extra UK sein. Sobald Sie etwas bewegen, wird
es die Entfernung mit allen verschiedenen Elementen Elemente hier in
Bezug auf sie zeigen . Okay, also sagt es mir, dass es jetzt auf diese ausgerichtet ist. Und der Abstand zwischen diesen beiden beträgt 15 Pixel. Okay, dann haben wir diese Kunstbrettwerkzeuge. Ich denke, wir haben das bereits besprochen. Sie haben gerade eine andere Kunsttafel ausgewählt und erstellt. Dies ist das Kunstboard für iPhone X. Und dann ist dies das Zoom-Tool, das Sie auf jedes Element zoomen können. Sind das wieder da? Ich habe Control Null-Befehl Null gedrückt, und Sie können auf den gesamten Kunstport so zoomen. Okay, das ist
also sehr einfach. Sie können die Zonenebene auch von hier an in festlegen. Verkleinern. Dies sind Sie verschiedene Tastenkombinationen sehen können. Kontrollieren Sie eine Steuerung Zehen-Steuerung plus und Kontrolle plus Minor. Zoomen Sie heraus und ah, zoomen Sie auf Auswahl, Control oder Befehl drei. Also, wenn er Mac verwendet, wird
es durch Befehl ersetzt werden. Okay, so sehr einfach. Sehr einfach. Tastenkombinationen. Ich gehe auf die Zehe. Erstellen Sie eine separate Lektion für alle verwendbaren Tastenkombinationen. Okay, wir können Adobe X'd schnell verwenden und verwenden. Das sind also alle Werkzeuge. 3456 und acht Werkzeuge, die du über ihn hast. Und die meisten von ihnen sind Gerechtigkeit. 123456 Also sechs Werkzeuge ein ist Art Board und ein Zoom, die Art off ein Dienstprogramm zu verwenden ist auf. Vergrößern Sie Ihre Kunsttafeln und verkleinern Sie sie. Das ist alles über die Symbolleiste. Hier drüben haben wir. Wenn Sie Fragen haben, die Sie mir stellen müssen, fahren
wir mit der nächsten Lektion fort.
13. Rechteckige Tools zum Erstellen von Tasten: in der Ferne. Und ich werde über dieses Rechteck-Werkzeug sprechen und wie wir es verwenden können und wie es
verschiedene Eigenschaften gibt . Lassen Sie es warten und wie wir einen schön aussehenden Button mit Regie erstellen können. Okay, also werde ich einfach unsere Presse auswählen und wir werden hierher ziehen und ein
Rechteck wie dieses erstellen . Und Sie können auf der rechten Seite sehen wir die Breite und die Höhe haben. Lassen Sie uns auf 75 in der Höhe von 60. Picks ist hier. Also haben wir es auf 60 gesetzt und Hiatus auf 75. Jetzt können Sie sehen, hier haben wir die erste Kontrolle, das ist diese Deckkraft, die ist, wie sind zurück. Das wird es sein. Und ich werde es 200% verlassen. Dann ist der nächste Eckradius. Wenn ich also in der Nähe sein wollte, gehe
ich zu Fuß. Benutze hier einen Eckenradius wie sechs. Sie können sehen, jetzt ist es 100. Also, wenn ich d ausgewählt habe, um OK zuzugeben, wenn Sie aus verschiedenen Gründen für jede Ecke unterschiedliche wollen, werden
Sie diese auswählen. Okay, also wenn ich hier drüben Null drücke und auch Null für diesen hier. Okay, Sie können sehen, jetzt haben wir zwei Ecken aufgeladen noch gekürzt. Okay, also kannst du es so machen. Also, wenn ich 32 hier drüben will, kann
ich so etwas haben. Okay, also gehe ich auf die Zehe drücken. Also, wenn Sie eine Pillenform wollen, können
Sie es auf,
wie,
39 oder so etwas erhöhen wie, . Soja diese 39 und Sie können das verschifft bekommen. Aber dann haben wir diese beiden Eigenschaften, die eins ist Phil, das ist die Farbe. Also werde ich es mit einer schönen blauen Farbe füllen. Vielleicht ist dieser Laden Buchler hier drüben so. Okay, dann haben wir diese Grenze. Ich denke, wir werden es jetzt entfernen. Und wenn Sie sich die Rahmeneigenschaften ansehen, können
Sie hier sehen, wie viel Sie die Grenze um sie herum wollen und füllen Sie den Rahmen wird Es
sollte in einem Strich sein. Der Bader sollte drinnen sein. Diese sind außerhalb unserer in der Mitte. Okay, s. Also werde ich draußen benutzen und die Größe Zehe 10 Pixel ändern. Okay, jetzt können Sie hier sehen. Wir haben die Auswahl und die Grenze ist außerhalb dieser. Okay, also werde ich einen Rand von dieser Farbe verwenden, nur um dir zu zeigen, was wir
damit machen können . Okay, dann haben wir dieses Schatten- und Hintergrundblut. Ich werde nicht über das Hintergrundblut reden. Wir werden jetzt in der nächsten Lektion darüber reden, wir werden diesem Knopf etwas Schattenspitze hinzufügen,
und Sie können sehen, dass wir diese vie-Position und dieses Blut haben. Das ist also im Grunde der Radius des Blutes. Wie weit es geht, um den Radius Blut zu verwischen. Dieser Schatten. Okay, wenn ich es
also auf 20 setze, kannst du sehen, dass der Schatten in diesem Bereich mehr verschwommen ist. Wenn du genau hinsiehst, okay, warum ist die Position dieser beiden Axt? Und warum ist die Position von deinem Schatten? Okay, also wenn ich Zeh will, mache es ein bisschen mehr unter meiner Form, ich werde mehr von mir hinzufügen und du siehst Nein, es ist in diesem Bereich. Das ist es. Ich weiß es nicht. Okay, also kann
ich es auch horizontal in die Richtung bewegen. Also, wenn ich 50 hinzufügen, können Sie sehen, jetzt ist es auf der rechten Seite. X ist also der Moment der Zerstörung. Sie können auch negative Werte hier minus 10 setzen und es wird in diesem Bereich sein, so dass Sie auch minus neun verwenden können. Wenn Sie wollen, wird
es an der Spitze zu bewegen. So wirst du deinen Schatten setzen? Nein. Wenn Sie die Farbe aus Ihrem Schatten wollen, können
Sie auf diesen Bereich klicken und Sie können die Farbe von Ihrem Schatten setzen. Vielleicht will ich etwas Schatten in der blauen Farbe brauen Bereich. Und ah, das ist die Deckkraft deines Schattens. Ich wollte Toby etwa 20% Rabatt auf Pick, 30% transparent. So können Sie jetzt sehen, dass der Schatten so ist. So werden Sie die Schatten und verschiedene Dinge mit Ihrer Form,
Rechteck und ah verwenden , das ist alles über dieses Rechteck. Sie können die Ausrichtung auch ausrichten. Ich werde in einer anderen Lektion über die Ausrichtung sprechen. Und auch Sie können es erreichen. Aber normalerweise brauchen wir es nicht so zu wiederholen. Aber wenn du willst, kannst
du es tun. Okay, also gehe ich zurück. Komm schon. Sehen Sie Ihre Kontrolle, Z Und das sind alle Eigenschaften. Wenn Sie irgendwelche Fragen haben, um mich zu fragen und versuchen, jemanden wie diesen zu erschaffen, werde
ich Fuß gehen. Setze etwas Text darüber. Hallo, Liebes. Ok, so
etwas. Und ich werde drücken V und den Export es in der Mitte und ändern seine Füllfarbe zehe weiß. Okay, also lass es uns ein bisschen nach unten bewegen. Okay, also sind 16 Schweine oben und 17 Plektren unten. Also, wenn du so etwas klären kannst, würde
ich es gerne sehen und versuchen, Zeh. Zeigen Sie mir die Schaltflächen, die Sie darin erstellen können. Und ich würde sie gerne überprüfen und sehen, was Sie sich einfallen können. Okay, also geht es darum, wie Sie verschiedene Arten von Schaltflächen erstellen können abgerundet, abgerundet, Eckquadrat oder Rechnung gespeichert, aber ansf es mit x d. Lassen Sie uns mit der nächsten Lektion fortfahren.
14. Hintergrund und Object: Lassen Sie uns über Objekt sprechen. Blut und Hintergrund Unschärfe. Tatsache in Adobe X'd. Diese beiden Effekte sind sehr cool. Einer von ihnen. Ich benutze viel Hintergrundblut. Okay, also werde ich Ihnen Beispiele zeigen, beide von ihnen, wie man sie richtig benutzt. Okay, also lasst uns anfangen, Objektblut oder das wieder auf Blut zu verwenden. Wir brauchen ein Bild. Okay, also werde ich das Bild einfach per Drag & Drop auf diesem Kunstboard, das iPad ist, und ich werde es in der Mitte ausrichten und Shift drücken. Und obwohl ich es ein bisschen kleiner machen werde, danke. So etwas wie das. Okay, also haben wir dieses Bild jetzt. Dafür will ich ein Hintergrundblut. Ich brauche jede Form. Vielleicht werde ich dieses Rechteck verwenden und ich werde Zehe verwenden das ganze zerrissene diese Leinwand drücken wir und nein, dieses Rechteck ist ausgewählt. Das Bild ist dahinter. Also nein, ich werde meinen Hintergrund benutzen. Wenn ich also einmal auf dieses Bagram-Blut klicke, kann
man sehen, dass der ganze Hintergrund verschwommen ist. Lass uns diese Grenze verstecken und du kannst den Betrag von dem verdammten Bedürfnis ändern. Vielleicht will ich so viel Blut. Wollen Sie, dass es hell in der vitalen Seite ist? Oder du wolltest dunkel auf der dunkleren Seite sein. Sie können sehen, dass der Effekt anders ist und auch die Deckkraft. Ich benutze nicht so viel. Es wird die Deckkraft dieses Effekts ändern, also halten Sie es auf 0%. Okay, vielleicht
so etwas und so etwas und ich werde es außerhalb
dieses Bereichs erweitern . Ok? Ok. So verwenden wir Hintergrundblut. Also, selbst wenn Sie es in der Mitte so verwenden wollen, also vielleicht will ich nur, dass dieser Bereich
verschwommen wird . Ich kann das ähnlich wie folgt verwenden. OK, also ist diese Form im Grunde unser Haupt-Hintergrund-Blutbereich. Diese Form wird also definieren, welcher Bereich verschwommen wird. Dann haben wir das hier. Wenn du zu diesem Drop-down gehst, haben
wir diesen Objektplan, der Zehenblut geht. Diese Onley dieses Objekt. Wenn ich also auf Objekt klicke, das Sie jetzt sehen können, ist unser Rechteck im Grunde Blut noch der Hintergrund. Also, wenn ich deinen Sculler Zeh schwarz oder so etwas wie dieses ändere. So können Sie jetzt sehen, dass diese Form tatsächlich im Hintergrund noch im Hintergrund verschmilzt. Okay, das ist
also der Unterschied zwischen Objekt-Unschärfe und einem Hintergrundblut, das ich in meiner
mobilen App verwendet habe . Sie werden am Ende dieses Kurses entwerfen, also bleiben Sie dran, und das ist ein sehr cooler Effekt. Sie können diese Hintergrundunschärfe an vielen Stellen verwenden und sie wird Fuß gehen. Machen Sie Ihren Text und Ihre Schaltflächen sichtbar, wenn der Hintergrund sehr ausgelastet ist. Also hier geht es um Bagram-Mädchen und Objektblut. Ich hoffe, Sie haben diese Lektion genossen. Fahren wir mit der nächsten Lektion fort.
15. Ellipse-Tool: heute werde
ich über die Lippen Stuhl sprechen und ah, seinen Hauptzweck. Warum wir es benutzen. Und es ist sehr schnell Zeh, wissen
Sie, schneiden Sie die meisten von meinen Avatar-Bildern. Okay, also gehen wir mit dem Zehenklicken und ziehen so, und ich halte Shift, um es proportional zu machen. Und wenn ich aus der Mitte wachsen wollte, werde
ich die Art Optionstaste zusammen mit meiner Shift-Taste drücken. Okay, also halte ich jetzt Shift und Kunst und Optionstaste, um es so zu machen. Okay, jetzt werde ich es so in die Mitte legen. Ich werde seine Grenze verstecken, und ich werde seine Füllfarbe ändern, so dass Sie sie leicht sehen können. Jetzt werde ich jedes Bild per Drag & Drop darauf, um einen Avatar zu erstellen. Schnell. OK, jetzt können Sie jedes Bild per Drag & Drop auf diese Ellipse ziehen, die Sie sehen oder hören können, um schnell einen
Avatar zu erstellen . Also, was es im Grunde tut, ist, dass es in diesem Kreis abgeschnitten wird. Okay, das Problem dabei ist, dass Sie dieses Bild nicht ändern oder verschieben können. Okay, was Sie tun können, ist, dass Sie die Größe von diesem Kreis vergrößern können. Es geht auf die Zehe. Vergrößern Sie das Bild. Und Sie können auch die Form ändern, die Sie hier sehen können. Okay, jetzt ist es eine Ei-Form, und das Bild ist, dass Sie sehen können, die Anpassung mit diesem Schiff. Also meistens verwenden wir Ellipse Werkzeug für diesen Zweck. Die anderen Optionen, die wir für einen Lippenstuhl haben, sind fast die gleichen. Wir haben Grenz-, Füll-, Deckkraft, Schatten- und Hintergrundblut. Da ist nichts viel dran. Also die meiste Zeit verwenden wir es für diesen Zweck. Wir ziehen einfach jedes Bild hinein, um ein Radar zu erstellen. Unsere Ikonen sind so. Das ist also alles über den Schlupfspaziergang. Wenn Sie Fragen haben, die Sie mir stellen müssen, fahren
wir mit der nächsten Lektion fort.
16. Grundlagen des Stift-Tools in XD: in dieser Lektion erstellen
wir diese drei Symbole. Der eine ist dieser Käse. Eines ist dieses Kartensymbol, und eins ist dieses Chat-Symbol mit Adobe Excuse. Also zuerst werden wir lernen, wie man zu verwenden verbringen zwei suchen. Ich empfehle nicht, dass Sie alle verschiedenen Symbole mit Adobe
Extra erstellen , da es nicht zum Erstellen von AARP gedacht ist. Symbole sind Symbole. Sie können einfach SPG-Symbole aus allen Zeilen verwenden. Es gibt viele kostenlose online auf Bibliotheken. Off SVZ Icons sind so zuerst wir werden sehen, wie Bento zu verwenden. Also werde ich ein weiteres Art-Board Ablaufdatum des iPhone X erstellen und in ein wenig annehmen. Und zuerst gehen wir die Zehe. Wählen Sie dieses Stiftwerkzeug aus, und so können Sie einfache Formen erstellen. Klicken Sie
auf, auf, klicken Sie, klicken Sie, klicken Sie auf, klicken Sie auf OK und klicken Sie zurück auf den ersten Punkt und es wird das Schiff schließen. Sie werden V drücken, und jetzt können Sie diese Form hier bewegen. So ist es, wie Sie erstellen einfache Schiffe jetzt gegen, wie dieser Stift Werkzeug, klicken und klicken und ziehen, um einige abgerundete Ecken zu erhalten und dann werde ich klicken, waren hier und klicken Sie dann zurück. Hier habe ich also einen Bogen geschaffen. Also, wenn Sie auf diese Form doppelklicken, können
Sie sehen, dass Sie alle von diesem klicken können und es gibt den Lenker. Sie können sie nachträglich anpassen,
wie Sie möchten. Also bewegen sie sich, während ich das hier herumschiebe. Okay, also habe ich diesen ausgewählt. Also, wenn ich nur dieses bewegen will und es sollte keinen Einfluss auf diese eine drücken Sie investieren Ihre Option oder Archy. Okay, also auf Ihrer Tastatur, wenn Sie Ihre Taste drücken und dann klicken und diese bewegen, wird
es sich bewegen. Nur diesen hier. Okay, das sind
also die beiden Griffe, also jetzt wird sich das unabhängig bewegen. Also, wenn ich es damit ausrichte, können
Sie sehen, dass es jetzt eine gerade Linie ist. Also, wenn ich d ausgewählt habe, ist
dies eine gerade Linie. Dies ist eine gekrümmte Linie. So steuern und bearbeiten Sie Ihre Teile und ah, verschiedene Ankerpunkte. Also, wenn ich darauf doppelklicke, gibt es hier drei Ankerpunkte. Okay, also einer ist dieser hier. Ich kann auch so etwas verwenden. Also drücke ich Shift-Zeh, richte es in einem perfekten Winkel aus. So ist es jetzt, denke
ich, 90 Grad oder wollte Grad. So habe ich diese Beule erschaffen. Sehr nett. Glatte Beule Okay, so benutzen wir unseren Pento.
17. Stifte zum Erstellen von Symbolen: Okay, also werde ich diese Form löschen. Und jetzt werde ich mit dem Rechteck Tauqir beginnen, diesem ersten Symbol. Also werden wir ein Rechteck erstellen. Okay, also drücken Sie V und jetzt haben wir den Sektenwinkel. Doppelklicken Sie darauf. Und wir haben diese vier Ankerpunkte. Jetzt wählen wir Ach, mentaler Moment aus. Wenn Sie nicht einmal einen Bleistift auswählen, können
Sie den Veranstaltungsort sehen, Khobar. Auf diesen Linien, wo Sie einige Ankerpunkte setzen können, ist
es gedreht Zehe mental, Also klicken Sie einfach einmal, aber hier, einmal hier und eine irgendwo. Also haben wir drei weitere Ankerpunkte zu diesem Schiff hinzugefügt. Was ich jetzt tun werde, ist, dass ich die Zehenpresse V gehe, und ich werde es so unten bewegen. Okay, jetzt habe ich dieses Basisschiff, also wenn ich es nochmals doppelklicke, kann
ich diesen Ankerpunkt auswählen und ihn bewegen. Wenn Sie etwas falsch hier drin haben wollen, doppelklicken Sie darauf. Und Sie werden diese abgerundet um hier schmiegen und Ankerpunkte mehr Lenker die Rundheit aus Ihrer Form wieder
zu kontrollieren, so dass Sie sehen können, jetzt habe ich diesen Bereich
so abgerundet . Dies ist also eine Möglichkeit, mehrere verschiedene Formen aus einfachen Schiffen zu erstellen. Okay, jetzt werden wir diesen Käse kreieren, okay? Die meisten Mäuse werden das wirklich lieben, wenn sie meinen Dad
Dorian beobachten . Okay, also gehen wir zu Fuß, erstellen diesen einen Klick einmal, klicken zweimal, und ich habe hier drüben Lenker. Das ist ein anderer Weg, und ich werde nur hier rüber klicken, und dann, was ich tun werde, ist, dass ich gerade sie jetzt so anschaue. Und ich werde meine Kunst-Optionstaste drücken, um das zu bewegen, wie Okay, also, nein, es ist geradeaus. Und lassen Sie es uns bewegen, um eine perfekte Sie ist so. Okay, also haben wir unser Schiff. Lassen Sie uns die Grenze zwei Pixel machen. Und während der Füllfarbe Zehe, dieses Gelb kann alles ein bisschen heller, gelb wie folgt. Okay, also haben wir über die Form. Wir werden ein paar weitere Formen hier mit diesem Ellipsenhocker hinzufügen. Also drücke ich Shift Zeh gelöscht, Shift und Drag, um diese Kreise so zu erstellen. Okay, also haben wir unsere Formen jetzt können wir die Flaschenfarbe in diese ändern, die ein dunkleres Gelb ist und ah, wir haben ein sehr Schicksal. Gott, nicht gut für einen Spaziergang, wenn du mich magst. Ich habe einen hohen Cholesterinspiegel, also ist es nicht gut für mich, aber immer noch. Okay, hier haben wir unsere Käse-Symbol. So erstellen Sie benutzerdefinierte Formen, Icon. Jetzt werde ich das hier erschaffen. Das ist im Grunde Bürgermeister von Mais. Es ist sehr einfach. Wählen Sie einfach diesen Ellipsenhocker aus, Ah, Lippen hier drüben. Und was ich tun werde, ist, ich werde V DoubleClick drücken und ich möchte nur diesen
Lenker ändern . Also habe ich gerade dieses ausgewählt, diesen Ankerpunkt, und ich werde Shift- und Pfeiltasten drücken, um es unten so zu bewegen. Okay, jetzt ist unsere Grundform komplett. Was ich tun werde, ist ein Doppelklick hier rüber, um unsere scharfe Ecke zu bekommen. Okay, das ist
also sehr netter Trick DoubleClick Zehe bekommen abgerundete Ecken anders, um scharfe
Ecken zu bekommen . Okay, also habe ich eine scharfe Ecke hier drüben. Jetzt werde ich eine weitere kleine Form Ellipse in ihm so erstellen und einfach die
äußere Form auswählen und, ah, entfernen Sie
einfach den Rahmen und verwenden Sie die Füllfarbe zu etwas wie, Ja, ich werde benutze diesen Schlag. Lasst uns das Blau benutzen. Okay, für diesen werde
ich die Grenze entfernen, und ich werde hier etwas Schatten hinzufügen, der Null Null und sechs sein wird. Okay, kein Schatten ist, dass es diese Form entlassen und einfach hier so ausrichten würde . Wählen Sie diese beiden, und ich werde es in der Mitte so ausrichten. Okay, so können Sie hier sehen, unser Karten-Icon ist auch gebaut. Sie können es erweitern, wenn Sie möchten. Sie können es ein bisschen wichtig machen, um es professioneller aussehen zu lassen. Ok. Ok. So können Sie verschiedene Icons mit mental erstellen. Ich empfehle nicht, dass Sie so etwas oder so etwas wie dieses
erstellen Sie bereits erstellte,
professionell erstellte SVG-Symbole verwenden können . SPD steht für skalierbare Vektorgrafiken und in den nächsten Lektionen, einige Lektionen oder in den letzten Lektionen, in denen wir unsere App erstellen werden. Ich werde Ihnen zeigen, wie Sie SPG-Symbole verwenden. Bis dahin werde
ich dich bald sehen. In einer anderen Lektion gehen
wir zur nächsten Liste über.
18. Line: jetzt Lassen Sie unsjetztüber das Zeilenwerkzeug sprechen. Wenn wir hier klicken oder l drücken, ist es ein Linienwerkzeug und Sie können damit eine Linie oder ein Trennzeichen
erstellen . Okay, das ist
also unsere Linie. Das ist die Grenze von dieser Linie. Lassen Sie uns einen Fünf-Pixel-Rahmen wie folgt erstellen. Ok? So können
Sie auch sehen, dass diese Optionen hier versteckt sind. Ich bin mir nicht sicher, ob sie überhaupt aktiviert sind oder nicht. Lassen Sie uns in die Linie erstellen. Okay, also diese Außengrenze ist keine Option für diesen. Es ist nur eine Linie. Und, ah, Sie können die Farbe ändern, wenn Sie wollen. Oh, und auch die Deckkraft, Schatten und zurück auf Blut. Das sind die vier Optionen, die wir hier haben. Die einzige Verwendung außerhalb des Zeilenwerkzeugs, die ich sehe, ist, dass es für den Linktext verwendet wird. Also, wenn ich einen Link hier drüben
habe, kann ich eine Zeile setzen und es so. Okay, also das ist die einzige Nachricht, die ich mir ausdenken kann. Und Sie entwerfen ich für diese Linie zu suchen. Das ist also alles über das Linien-Werkzeug. Wenn Sie Fragen haben, Sie mich gefragt. Fahren wir mit der nächsten Lektion fort, in der wir das Textwerkzeug sehen
19. Text-Tool in Adobe XD: Nein. Wir werden über dieses Textwerkzeug,
Seife, Seife, lusty oder Text sprechen. Und ich ziehe mich hierher, um einen Absatz zu erstellen. Alles, was Sie können einfach überall klicken, um zu löschen. Gerade an der Schlange vor Dexter hier. Also werde ich hier drüben einen Absatz erstellen. Okay, jetzt habe ich einen Text in meinem Absatz. Ich kann einfach irgendwo anders klicken, um einen Absatz und Brüste V zu erstellen und ich kann erweitert
werden , indem Sie die Griffe verwenden, die Sie hier sehen können. Okay, also werde ich das so benutzen und es einfach so hierher bringen. Ok? Nun, auf der rechten Seite, können
Sie sehen, dass wir Text haben. Das ist das Telefon. Du kannst das Telefon wechseln, was immer du willst, Toe. Und dann haben wir hier die Festung. Wir würden alle Stile anders. Und dieser Ford, das ist die Größe, die ich will 24. Ich kann 24 auswählen. Jetzt versteckt es sich. Es ist voll zu machen. Und, äh, dass einige in, um die tatsächliche Korrektorgröße zu sehen. Okay, dann haben wir diese Ausrichtung. Das ist das Zentrum. Dies wird versucht, ausgerichtet, links eine Linie. Und das ist der Unterschied zwischen unserem Ideentext oder Sie können Absatz und einen
Zeilenpunkttext sehen . Okay, hier haben wir diesen Punkttext. Es ist besser für die Ausrichtung. Sie können jetzt sehen, es ist ein festes Quadrat. Okay, wenn ich versuche, es zu ändern. Es handelt sich im Grunde nicht um einen Absatz. Dies ist ein Absatz. Das ist also nur ein neues Feature. Sie haben darin hinzugefügt. Dann können Sie es unterstreichen, wenn Sie möchten. Und dann haben wir diesen Zeilenabstand, den Sie etwas anderes festlegen können, wenn Sie wollen. Oh, als ob ich es auf 32 gesetzt habe. Und das ist Kaktus pinkend, wie breit der Raum im Regisseur sein sollte. Also, wenn ich, ähm er 10 oder 25 Jahre war, können
Sie jetzt sehen, dass der Abstand zwischen den Buchstaben viel ist. Okay, das sind
also die Hauptkontrollen, als wir es wieder haben. Die gleichen ähnlichen Steuerelemente, wie alle anderen Rechtecke. Laura, die Werkzeuge. Wir haben einen Durchgang. Wir haben versagt. Wir haben Grenzen, Schatten und Hintergrund, Bluthintergrund, Blut. Wir werden nirgends auf diesem einen Schatten verwenden. Vielleicht werden wir verwenden, wenn es einen dunklen Hintergrund oder so etwas wie diese Grenze gibt. Ich denke, wir werden den Boden nicht benutzen. Also bleib einfach mit dem Phil und ah, benutze jede Farbe, die du magst. So wie dieser hier. Und das ist alles darüber. Ah, Textvideo. Jetzt gibt es nur einen Hai, der in diesen Bereich kommt, was ist es toll wäre, wenn ich verschiedene vier Stile oder Haare sehen kann. Und jetzt kann ich nur den Telefonnamen von Nordea sehen, wie es aussieht oder wie es sich anfühlt. Okay, also muss ich tatsächlich dazu wechseln, um diesen Kraft-Stil zu sehen. Also ich denke, vielleicht haben sie es im Grunde nur zu einer weit mehr Verarbeitung gemacht und es schnell gemacht. Okay, vielleicht fügen
sie in den späteren Versionen einige Vorschautextilien hier für unterschiedliche Kräfte hinzu. Das ist also alles über das Textwerkzeug in Adobe X t. Ich hoffe, Sie haben diese Lektion genossen. Fahren wir mit der nächsten Lektion fort.
20. Polygon – UPDATE: Auf keinen Fall werden wir über ein sehr neues Tool sprechen, das in Adobe EC eingeführt wurde. Steve juckt. Sie sehen auf Werkzeug und Sie können plus warum, zu glatt es oder einfach klicken Sie hier. Und jetzt werden wir ein Polygon zeichnen. Also hier trockne ich es. Wenn Sie eine Druckverschiebung halten können, wird
es in Proportionen sein und es einfach so lassen. Jetzt können Sie auf der rechten Seite hier in der Erscheinung Stich sehen, können
wir seine Deckkraft kontrollieren. Wir können seine Größe ändern Conch, zum Beispiel, auf den Seiten, die wir wollen, wie fünf Seiten, und wir können es ändern, um zu kämpfen. Wir können auch die gefüllte Farbe ändern. Zum Beispiel, Wenn ich es haben möchte, vielleicht in dieser Farbe und ich möchte, um die Grenze zu verstecken, Ich kann die Grenze verstecken, und ich kann auch einen Eckenradius von wie 50 20 oder solche Dinge, so etwas wie das hier. Und ich kann auch den Eckenradius von diesem steuern, so dass Sie sehen können, dass dies ein kleiner Kreis
darin ist . Wenn ich den Eckenradius ändern möchte, kann
ich ihn verwenden. Okay, also wenn ich will, dass Zeh acht Ecken zugibt. Ich kann acht Ecken haben, also ist dies ein sehr praktisches Werkzeug. Wenn Sie ein paar Pfeile oder solche Dinge erstellen möchten. Ich denke, das ist eine der grundlegenden Formen außer Rechteck, Ellipse. Und das ist Polygon oder Dreieck. Also brauchten wir so etwas. Schwert-Panzer bei gehorchen. Sie haben so etwas hinzugefügt, Senator B X d. Ich hoffe, Sie werden es ausprobieren und einige Formen mit diesem Polygonwerkzeug erstellen. Es ist fast ähnlich wie andere Rechtecke und Ellipse auf. Und das ist alles über dieses neue Polygon-Werkzeug. Fahren wir mit der nächsten Lektion fort.
21. Farben und Paletten: heute werde
ich über Farben sprechen und wie wir erstellen können, wer Farbschema in Adobe X'd erstellen. Okay, also lasst uns anfangen. Begann mit diesem Kunstboard, das iPhone 678 ist und was wir tun werden, ist einfach eine sehr schöne,
runde,
geerdete Ecke zu schaffen runde, . Großbritannien. Ich werde Fernsehen drücken und es bewegen und sechs Schweine der Ungerechtigkeit erschaffen. Okay, so sieht toll aus. Okay, also gehe ich auf die Zehe, entferne die Grenze. Und wenn ich zu dieser Füllfarbe gehe, wenn Sie hier klicken, können
Sie hier sehen wir unsere Farben haben. Okay, also hier haben wir das. Ah, du Bar, wo wir den Farbton ändern können, welche Farbe du willst. Wer ist im Grunde die Farbe mittlere Farbe. Okay, also vielleicht, wenn ich hier reingehe, wollen
Sie und ich, dass es hier drüben ist, okay? Also, wenn ich mich in der Zerstörung und der Farbton oder Sättigung ausziehe, nimmt
diese Farbe tatsächlich zu, Okay,
Also, wenn ich in Entdeckungsgebiet zog, wird
es dunkler in diesem Bereich. Es wird mehr Licht werden. Okay, füge dazu eine Einladung hinzu. Also werde ich fast in der Mitte hier drüben halten. Ok? Nun, das ist die Deckkraft. Also, wenn du transparent sein wolltest, kannst
du das bewegen, denke
ich. Ah, ich sollte es hier behalten. Okay, also so ist deine einfarbige Box, okay. Nein, nein. Ah, hier sind ein paar Optionen, die wir besprechen werden. Ist das ein exakter Dezimalwert? Das ist also, was Ihre Webdesigner brauchen werden. Zehenfarbe der Briten. Okay, das ist
also für Entwickler. Also, wenn Sie wollen, können
Sie diese rgb mehr konvertieren, das ist rot,
blau, blau, grün und Alfa RGB. Ok. Und, ah, normalerweise wir Designer, ich benutze normalerweise diesen Farbton, Sättigung und Helligkeit, die leichter zu kontrollieren ist und leichter Zeh. Wissen Sie, ich nur Ihre Farben in schaffen schöne Farbschemata. das benutzt, ist
es SB. Okay, also hier haben wir dich als Sättigung. Wie viel Farbe Sie diese Farbe in Sättigung setzen möchten. Und das ist die Helligkeit. Okay, also wie hell sollte scherzhaft sein? Also, wenn ich es auf 90% reduzieren, können Sie sehen, jetzt diese Farbe sieht erstellt ist ein bisschen dunklere blaue Farbe. Okay, gehen wir wieder zu diesem Jahr. Ok? So können Sie nicht Ihre Farbe Zehe Ihre Farbe Stretch hinzufügen. Also drücken Sie einfach dieses Plus-Symbol und Sie können hier sehen, wir haben $1 hier hinzugefügt. Okay, jetzt, wenn ich ein Rundschreiben hinzufügen möchte, ist
der beste Weg, das einfach zu ändern. Okay, also will ich, dass das erschaffen wird. Und vielleicht nur zwei sehr etwas. Ich gehe auf die Zehe. Ah, reduzieren Sie seine Helligkeit Zehe 80%. Mal sehen, wie diese Farbe auftaucht. Also werde ich das hinzufügen, dann können wir zu so etwas gehen, dieses dunkle Schwarz. So können Sie hier sehen. Ich habe eine sehr schöne Farbpalette erstellt und Sie können die meisten Farben sehen, die ich hier
generiert habe . Sie sind wirklich passend. Großartig. Okay, das sind alle medizinischen Farben, dieses Seong-Blau und diese blaue Farbe. Nun, hier dreht sich alles um dieses Farbfeld. Wie Sie eine andere Farbschemata hier drüben sein können, bewegen sich in diesem Raum
22. Farbverläufe in Xd: Jetzt gehen wir zu diesem linearen Strahlen. So nachsichtig. Brilliant ist, dass wir ein und zwei Farben haben und das ist der Winkel hier von oben nach unten. So 90 Grad ist der Winkel von Ihrer Zutat. Okay, also hatten wir uns vermischt, damit du sehen kannst, Nein, wenn ich den Winkel verschiebe, wie sich die Zutat ändert. Also, wenn ich es so bewege, okay. Und, ah, lasst uns die Farben in etwas anderes ändern. So können Sie sehen, jetzt habe ich einen sehr schönen,
gierigen int Button hier drüben erstellt . Und wenn ich den Winkel ändern möchte, kann
ich den Winkel so ändern, vielleicht bewegen Sie ihn so, damit Sie jetzt sehen können, wie es gut aussieht. Jetzt nochmal, ich werde darauf klicken und Fuß gehen, Phil. Und Sie können sehen, hier haben wir unsere strahlende Lassen Sie uns versuchen, Disc hinzuzufügen. Strahlend. Also ist es nicht hinzufügen hier drüben. Das ist also eine Sache. Ich denke, sie sollten etwas haben. Eso, wenn ich diesen Knopf drücken, sollte
es meine gierig hinzufügen. Und hier drüben. Okay, also fügt es hier nicht hinzu, aber wir können es woanders etwas hinzufügen. Richtig? Klicken Sie auf diesen Anzeigenkiller. Okay, wenn ich diese Farbe hinzufüge, wird
sie in meinen Vermögensmördern sein. Sie können hier drüben sehen. Das ist mein Styleguide. Im Grunde. Also werde ich später alles abdecken. Zwei Mörder in Adobe Extra. Okay, hier haben wir diese Farbe. Dann haben wir diese vier Farben. Im Moment werden
diese nicht hinzugefügt. Also können wir tun, ist nur ein paar Rechtecke zu erstellen, die ich Montag Gewirr erstellen werde. Und ich werde es duplizieren, indem ich Kunst oder Optionstaste drücke, als es einfach so zu ziehen . Und wie dieses Küken werde ich hier drüben die gleichen Farben verwenden, die ich will. Entfernen Sie einfach die Grenze und ich werde diesen Sculler verwenden, als verfärben. Okay, dann entdeckte jetzt hier ist mein Farbschema. Ich habe das sofort erstellt, also mach dir nicht viel Sorgen darüber. Das, was ist dieses Farbschema? Okay, also gehe ich Zeh wie, wähle alle diese Farben und ich gehe mit der rechten Maustaste und füge Farbe hinzu. Ok. So können Sie sehen Nein, ich habe alle meine Farben zu meinem Vermögen bewegen. Ok. Sie können auch advi Farbe oder Variationen von weiß oder grasen. Wenn Sie es zu Ihrem Farbschema hinzufügen möchten. Okay, so können Sie gierige INTs und all das Cholesterin,
Ihr Farbschema oder den Styleguide hinzufügen . Ok. Style Guide ist im Grunde die Führungsspitze für Ihre Entwickler und Ihre Designer, dass welche Farben für welchen Zweck verwendet werden und wie wir dieses Designsystem mit diesen Farben erstellen können . Okay, jetzt, zum letzten Punkt
gekommen
, der eine Zadie-Zutat ist, haben sie gerade diese wirklich Zutat hinzugefügt, die eine gierige Int von innen ist. Es bewegt sich in einem Kreis, also lasst uns es ein bisschen größer machen. Okay, also machen wir es zu einem Hintergrund. Also werde ich Fuß gehen, eine Tasche wie diese
erstellen. Es ist sichtbarer. Diese Art von strahlend ist besser sichtbar, wenn Sie einen Hintergrund haben. Ok. So können Sie sehen, jetzt ist es Gitter in einer Tasche Runde suchen. Lassen Sie uns unsere Farben zu diesem ändern. Ok? Einer ist etwas dunkler. Einer in der 2. 1 ist etwas leichter. Lasst uns die entfernen. Okay, also lasst uns damit experimentieren. Lassen Sie uns diese dunklere Farbe mit diesem Blau ändern. Und, äh okay, es sieht toll aus. Lassen Sie uns es verschieben, Fügen Sie einige weitere Punkte hinzu. Also klickte ich hier rüber und fügte noch einen Punkt hinzu. Okay, hier werde ich die Farbe in Schwarz ändern. Oder vielleicht etwas Schärferes als so kann Nein. Ich werde Ihnen von Herzen diese radialen Inhaltsstoffpunkte erzählen. Okay, also nur Punkt, den Sie löschen können, ist der Punkt, den Sie bisher eine Zutat erstellt haben. Es muss zwei Farben geben. Okay, also sind sie nicht Ah, ich bin nicht in der Lage, Sie können sagen, löschen Sie diese beiden Punkte und das ist richtig. Die meisten oder 0% und 100%. Und der Punkt, den ich in der Mitte erstellt habe, vervollständigte ich durch Drücken von Löschen auf meiner Tastatur. Alles, was ich kann es so wegschieben und wegziehen, und es wird gelöscht werden. Okay, also diese zwei Farben, sie sind, wissen
Sie, für diesen gierigen Int
gebraucht, und Sie können die Zutat von hier aus kontrollieren. Okay, wenn du willst, ist
es so etwas. Sie können jetzt sehen, dies ist ein toller Hintergrund. Okay, also lasst uns hier einen Text schreiben, damit ihr sehen könnt, was ich getan habe. Ich habe gerade eine Linie mit der Dicke von fünf hinzugefügt. Und ich habe nicht nur eine SMS eingeladen. Hallo, Doktor. Und das sieht toll aus. Okay, also können Sie diese Art von Hintergründen für Ihre Anmeldebildschirme oder Anmeldebildschirme sein. Ok. Mit irgendeiner Zutat drin. Hier geht es also um die Farben und Radio-Zutat in einfarbigen Farben und linearen Inhaltsstoffen . Und diese drei Moore's off Farben Hexi dezimal RGB und normalerweise werden wir dieses
oder Hexi Dezimal für Web hauptsächlich verwenden , aber ich denke, dieser ist perfekt für die Erstellung der Farbschemata, okay?
23. Mit coolors.io Farbschemata zum Erstellen von Farbschemata: ein Werkzeug, das ich für Farbschema Generation empfehlen, ist dies ein Kühler dot ru? Ich denke, Sie können diesen Namen auf Google suchen. Ich werde die u R l teilen Also gehen Sie zu diesem. Generieren? Ja. Also werde ich zu diesem generierten gehen und es wird mit einigen zufälligen Farben beginnen. Okay, was ich vorschlage, ist, dass Sie zuerst versuchen, eine Farbe zu verwenden, die Sie bereits haben. Okay, also gehe ich auf Basis einer Farbe blauen Farbe aus meinem Farbschema oder zwei Farben von dort, um den Rest von den Farben zu bekommen. Okay, also gehen wir zurück zu X'd. Jetzt. Was ich tun werde, ist, dass ich diese blaue Farbe und diese Ah,
sehen Sie,
auf einem Farbschuh,
mein Farbschemakopieren sehen Sie, auf einem Farbschuh,
mein Farbschema werde. Okay, also gehe ich zu Fuß, kopiere diesen Wert Exit-Dezimalwert, und ich gehe zurück hierher. Okay, also unternehme ich eine Farbe, und ich werde sie hier drüben sperren. Okay, also drücken Sie dieses Schloss und es wird Ihnen ein geschlossenes Schloss zeigen. Okay, dann werde ich das zweite Mädchen hier drüben kopieren, und ich werde auch diese Farbe sperren. Ok? Jetzt muss
ich Farben protokollieren. Jetzt werde ich die Leertaste drücken, um einige weitere Farben zu erhalten. Farbt Amerika für diese beiden Mörder. Okay, also haben wir diese violette Farbe. Das sieht gut aus. Auch diese blaue Farbe Ich bin Ich mag diese blaue Farbe. Und wir können auch so etwas verwenden, das ein bisschen orange ist. Nun, in meinem ursprünglichen Farbschema, verwende
ich etwas näher an Gelb und ah, dieses Lila ist ein bisschen dunkellila, so dass Sie jedes Farbschema erstellen können. Nein, ich werde noch einmal die Leertaste drücken und ich mag diese Farbe. Okay, dann werde ich noch einmal die Leertaste drücken, damit Sie jede Farbe sperren können, die Sie mögen. Okay, also habe ich diese Scheißkerle gesperrt. Das hier wird sich also nur ändern. Also mag ich diese zu gelbe Farbe nicht. Vielleicht ist das gut, Onda. Vielleicht werde ich noch ein paar Zeit versuchen. Ich mag diese gelbliche Farbe wirklich, obwohl sie ein bisschen langweilig ist, aber ich denke, es wird gut mit diesen Hintergründen gehen. Okay, sobald ich dieses Farbschema erstellt
habe, kann ich ein Bild oder Bild von diesem oder Ah machen, ich kann es in eine PDF- oder PNG-Datei oder SVG fünf exportieren. Also lassen Sie uns SVG-Datei verwenden. So ist es klar erstellt diese SVG-Datei. Jetzt werde ich diese SVG-Datei in meine,
ähm X'd importieren . Okay, also weniger. Lassen Sie es uns hier rüber bringen. Nein, Sie können hier sehen, wir haben dieses Farbschema, SVG-Datei, und, äh, ich gehe Fuß. Machen Sie es ein bisschen kleiner wie hier. Lassen Sie uns diesen Hintergrund und alles andere verdünnen. Jetzt können Sie sehen, dass Sie dieses Farbschema haben und es ist unvermeidlich. Sie können hier sehen wir haben 45 Boxen und Sie können Ihr Farbschema ändern. So rate ich Ihnen, dass Sie es genommen haben. Farbschemata. Sie müssen mindestens eine oder zwei Farben haben, mit denen Sie beginnen können. Sie können diese Farben aus dem App-Symbol oder Logo von dieser Firma greifen und von dort beginnen. Hier geht es also um Farben und wie man Farbschemata erstellt. Sofort mit diesem Hocker und diesen paar Tipps. Ich hoffe, Sie genießen diese Lektion. Gehen wir zum nächsten
24. Masken in Xd: in dieser Lektion werden
wir über Maskierung lernen und wie wir es in einem no b x d tun können. Es gibt zwei Möglichkeiten, und eine ist ah, was ich wirklich liebe ist, wie wir können, wo wir unsere Moscheen und das Bild darin kontrollieren können . Okay, im Moment werden wir diese erstellen, und Sie können sehen, wenn ich darauf doppelklicke, kann
ich das Bild so bewegen. Das ist also eine kontrollierbare Moschee. Nun, wenn ich eine einfache Elipse wie diese erstelle, okay, also werde ich euch beide zeigen. Meister, das ist die einfachste, und es ist nicht reizbar. Also werde ich einfach Drag & Drop dieses schöne Mädchenbild in diesem. Okay, wir haben diesen Clip in dieser Ellipse, und Sie können sehen, dass wir ihn nicht bearbeiten können. Wenn ich also doppelklicke, wird
es die Form bearbeiten, aber ich kann das Bild nicht bewegen. Okay, das ist
also seine Beschränkung. Dies ist also eine Möglichkeit, Moscheen sofort zu schaffen. Jetzt werde ich es leiten, und wir werden diese Moschee erschaffen. Ok. Also, benutzerdefinierte Masse. Ich werde auch diesen löschen. Also, zunächst einmal,
alles, was wir tun werden, ist, dass Sie entweder ein beliebiges Rechteck in der Form verwenden können, die Sie wollen, oder Sie können Ihre Form mit einem mentalen erstellen. Also gehe ich hier die Form mit meinem Stift-Werkzeug, klicken, ziehen, klicken, ziehen. Und ich werde so etwas erschaffen. Nur ein benutzerdefiniertes Schiff. Also habe ich diese benutzerdefinierte Form Overhead, und ich habe dieses Rechteck hier drüben. Okay, das ist um dieses Rechteck. Zehe Pixel. Okay, wir haben jetzt zwei Formen hier drüben. Eins ist dieser hier. Okay, das ist
also noch eine. Okay, also haben wir diesen Teil, der Ah ist, benutzerdefinierte Form. Lassen Sie uns es benutzerdefinierte Form nennen. Also habe ich
diesen Bereich entwickelt, , diesen Bereich entwickelt, und ich benutze dieses Ding und wir werden Call this Rechteck erstellen. Okay, also mein Rechtschreibung Sex, also mach dir keine Sorgen. Okay, was wir jetzt tun werden, ist, dass du die Zehe gehst. Ah, Drag & Drop jedes Bild. Also werde ich ein Bild hierher ziehen und ablegen. Okay, Jetzt ist das Bild sehr groß, so können Sie es einfach mit Verschiebung und Kunst verkürzen Ich werde es verwenden und gehen, um es kurz zu machen . Verkleinern Sie einfach, steuern Sie oder befehlen Sie Minus, und wir werden dieses verwenden. Okay, so wie das. Okay, also werde ich es hier drüben platzieren, damit du die Form sehen kannst. Ok. Nun, der Trick ist, dass Sie verwenden werden, ich werde dieses Rechteck verwenden. Also werde ich dieses Rechteck über dieses Bild in meinem Ebenenfenster verschieben. Okay, jetzt bin ich das in diesen Schichten, und dieses Bild ist unten, und der Sektenwinkel ist oben. Nein, ich gehe Zehenverschiebung und klicke den Hafen von ihnen, um das Boot von allen auszuwählen. Sie können beide von hier aus auswählen. Richtig? Klicken Sie auf. Und Sie können sehen, dass es eine Option Moschee mit Schiffswicht gibt. Control em oder Shift-Befehl M ist eine Tastenkombination, und Sie können einfach diese drücken und jetzt ist es in diesem Feld rutschte. Nun, das coole Ding daran ist, dass, wenn ich mich wie entwickelt
habe, ich das Bild so bewegen kann. Das ist also wirklich cool. Also habe ich mehr Kontrolle über meine Moschee, und ich kann den Standort aus dem Bild ändern. Vielleicht möchte ich mich hier konzentrieren. Ich kann so etwas gebrauchen. Okay, jetzt hier haben wir uns benutzerdefinierte Form. Und in ähnlicher Weise machen
wir es einfach größer und drehen wir es um 30 so. Okay, jetzt werde ich dem glauben, und ich werde stattdessen dieses Schiff benutzen. Und ich werde diese Datei importieren, einfach Drag & Drop, und es ist sehr groß. Also werde ich Fuß gehen und es ein bisschen kleiner
machen. Okay, das ist
also zu Hause. Raus. Sie können sehen, dass das Bild zu groß für unseren Clipping-Bereich ist. Jetzt sind sie fast gut. OK, so werde ich diese benutzerdefinierte Form über dieses Bild zu verschieben und gehen, um beide aus ihnen durch
Drücken der Umschalttaste auf meiner Tastatur und Rechtsklick auswählen und kann Moschee mit Schiff. Also haben wir eine schöne Moschee oder hier und das bewegt sich einfach herum und ah, gehen so etwas macht es interessanter. Und jetzt können Sie sehen, dass ich auch diese bittende Idiotin unsere Köpfe ändern kann. Wenn ich so etwas mache, können
Sie sehen, dass ich den Moschee-Bereich ändern kann, also doppelklicken. Und Sie können auch diese Moschee im Bereich ändern und dann auch dieses Bild, so dass Sie den Begrenzungsrahmen aus diesem fragen Indien ist anders und dieses Bild ist anders. Wählen Sie dieses Bild können Sie sehen Nein, dies ist de ausgewählt, so dass ich diese um so bewegen kann und ich kann dann wieder irgendwo
anders Fuß klicken , sehen Sie meine Moschee. Ok, so können Sie Moscheen auf benutzerdefinierten Moscheen in Adobe X'd erstellen. Sie sind wirklich hilfreich in Ihrem Design. Ich hoffe, Sie haben diese Lektion genossen und fahren wir mit der nächsten fort.
25. Character in XD: Jetzt werde ich über Übungsfliesen sprechen und wie Sie Ihre Textilien in Ihrem
gesamten Dokument Ein Spiel wiederverwenden können. Jetzt das bin
ich
dasin dieser Tiefe des Vermögens, die hier drüben ist. Okay, Sie gehen
also Zehe drücken Sie diese, und Sie gehen toe Kommen Sie zu diesem Assets so oder alles in Ihrem Assets Schritt, ob ihre Farben, Korrektor, Stile oder Symbole, sie sind global. Also, wenn Sie hier etwas ändern, wird
es sich in all Ihren Kunstboards widerspiegeln. Okay, Also lassen Sie mich illustrieren Beispiel aus Traktor-Stil und wie wir einige hinzufügen können. Das ist meine Überschrift. Okay, also habe ich einen Überschrift Lex Wechsler geschaffen, Sculler Zehe so etwas wie dieses. Und ich werde es in einem Absatz erstellen. Verschieben wir es in zwei Zeilen wie diese. Okay, das ist
also meine Überschrift, und dann werde ich die Zehe erschaffen. Ah, Absatz hier drüben. Er hat regelmäßig benutzt. Okay, das ist
also mein Absatz, okay? Und auch werde
ich seine Farbe in etwas anderes ändern. Vielleicht will ich welche. Ah, hellgraue schwarze Farbe hier drüben. So wie dieser hier. Abgesehen von ah, Pitch Black. Ok, also nur um zwischen meiner Überschrift in meinem Absatz zu unterscheiden. Okay, das ist
also mein Pantagraph. Lassen Sie uns einen weiteren Link hinzufügen. Okay, so nach Hause ich Links werden hier klicken, um weiterzumachen. Das ist also mein Link. Ich werde Farbe verwenden, die diese für diesen Link ist und ich werde eine Unterstreichung verwenden. Okay, das ist
also mein Link. Das ist mein Absatz. Das ist jetzt meine Überschrift. Was ich tun werde, ist, dass ich will, dass sie alle in meinen Charakterstilen sind. OK, also werde ich alle von ihnen auswählen und gehen Zehe Klicken Sie rechts? Klicken Sie auf und fügen Sie Zeichenstil hinzu. Okay, jetzt können Sie sehen, dass wir drei Stile haben. Es zeigt mir den vierten Namen. Ich habe das benutzt. Siehe Goy, Sie ich und auch verschiedene Größen und Farben 48,20 Punkt. Es ist ein bisschen langweilig, Grey. Es ist eine dunkle, schwärzliche Farbe und dann haben wir diesen Spaß für unsere dext Links. Okay, jetzt lass mich dir zeigen, was der Strom ausgeschaltet ist? Ok, also werde ich unser Drop Schienbein drücken und ich werde das auf ein anderes Kunstbrett kopieren. Also haben wir keine Kunstbücher. Okay, also werde ich es ändern. Tun Sie etwas. Diese in Ordnung. Ok. Nun, was wir tun werden, ist, dass wir die Farbe von diesen Überschriften gleichzeitig ändern müssen . Ok? Jetzt können wir es von hier aus tun. Beiseite geknackt, richtig? Wie bei ihm. Und ich werde die Zehe gehen. Verwenden Sie noch etwas. Etwas anderes wie dieses. Und ich werde eine andere Farbe verwenden. Vielleicht möchte ich, dass diese Farbe auf entdeckt werden kann. Ok. Jetzt können Sie sehen, wie ich sofort alle Regisseurstile geändert habe, was im Grunde meine vier Stile sind. Und sie sind global. Also, wenn ich es in einem Bereich ändere, wird
es sich überall anders ändern. Okay, das ist wirklich cool. Ok? Also, wenn ich meine Absätze ändern will, ja. Also, wo ist mein Absatz? Ich denke, das ist mein Absatz. Ich werde seine Farbe bearbeiten. Tue ich nicht. Ich wollte mehr Grad haben. Ich kann die Farbe von hier ändern. Jetzt können Sie sehen, ich habe Sculler Zehengrad ändern und ich kann auch andere Abstellgleis ändern. Also, wenn ich mich ändern will, sind
die Ford die Abstände. Alles wird sich ändern. Also, wenn ich einen Fernseher will, gehen Sie hier rüber und ich will, dass der Abstand Linie ist. Hallo, Toby. 28. Ich kann es von ihr ändern. Okay, das ist
also sehr praktisch. Sie können alles sofort auf all Ihren verschiedenen Kunstboards ändern. Ok? Also, wenn Sie haben, wie, 20 Art Boards sind Bildschirme und Sie wollen die Überschrift ändern, können
Sie es sofort tun. Ok? Es wird dich retten. Dunn hat keine Zeit. So verwenden Sie diese Korrekturstile? Sie können sie hinzufügen und sie von hier löschen. Sie können auch einen Textstil,
Director-Stil löschen . Und ah, das ist, wie Sie diese Power Off Director Stile verwenden und wird X t sein. Ich hoffe, Sie haben diese Lektion genossen. Fahren wir mit der nächsten Lektion fort.
26. Mithilfe von Richtlinien in Adobe XD– UPDATE: jetzt. Vor kurzem im Mai 2019 hat Adobe X T eine neue Funktion eingeführt,
die Leitfäden ist, die für jedes Design-Tool unerlässlich war. Und ich in diesem Video, Ich werde Ihnen zeigen, wie man sie benutzt und wie man sie Zehe und andere Kunsttafel kopiert. Jetzt können Sie sehen, dass ich an unserem Board bin. Und wenn du hier oben
gehst, kannst du sehen, er wurde zu etwas anderem geändert. Also dieser Raum hier drüben, wirst
du diesen bekommen und ihn ziehen und ihn so belassen. OK, so können Sie sehen, wir haben die Stop-toe-Top-Navigation, wo wir Account-Einstellungen und
Zurück-Taste haben . Also werde ich hier drüben einen Führer haben. Dann gehe ich wieder auf die linke Seite und ich werde noch einen packen und ihn hier
drüben lassen , dann eine unter eins, und ich werde es hier drüben so lassen. Nehmen wir noch einen, und ich gehe die Zehe. Hier drüben auf die rechte Seite. Okay, also haben wir rechten und linken Rand, Stopp, Rand und wir können auch unsere untere Grenze hier setzen, und wir müssen es wieder von oben ziehen und es hier drüben lassen, direkt unter diesem nächsten Knopf. Okay, also haben wir diese Guides durchgemacht. Wenn du sie verstecken willst, spüre sie einfach auf. S o. Was ich tun werde, ist, dass ich eine neue Kunsttafel erstellen werde. Lassen Sie uns eine andere Art Board X s erstellen und wir gehen Fuß. Kopieren Sie alle diese Jungs mit der rechten Maustaste. Und lassen Sie uns sehen, wo wir Führer haben, kopieren Sie Guides. Und hier gehen wir Zehe drücken Kontrolle oder Befehl V, oder Sie können unsere Haarführer oder Platzkarten basieren. Okay, das ist
also alles. Sie können auch alle Jungs durch Kontrolle ausblenden. Und dieser Semikolon, das ist, glaube
ich, die gleiche Tastenkombination über alle Adobe extra abs. Wenn ich sie also schnell verstecken möchte, kann
ich zu diesem gehen, und ich kann Semikolons kontrollieren oder befehligen. Okay, also hier haben wir es. Sie können sehen, dass sie sich überall auf allen Kunsttafeln verstecken. Dies ist ein weiteres neues Feature von Toby X.
T. T. Ich hoffe, Sie werden es genießen, lieben und ausprobieren. Weil es sehr notwendig war. Manchmal haben wir einige Richtlinien, um unsere Objekte schnell zu platzieren. Also jetzt, wenn ich diese Richtlinien, Ich weiß, dass ich gehen Zehe Platz meine primäre, aber ein kein Haar und so. OK, also passt es perfekt zu allen anderen Bildschirmen. Das ist also alles über Hilfslinien und wie Sie sie kopieren können und wie Sie sie löschen können und wie Sie sie verwenden können. Ich hoffe, Sie haben diese Lektion genossen. Wenn Sie Fragen haben, die Sie mir stellen müssen, fahren
wir mit der nächsten Lektion fort.
27. Raster wiederholen: Bisher haben wir über Symbole,
Charakterstile,
Farben und alles gesprochen Charakterstile, . Jetzt werden wir über die stärkste Funktion aus einem kein B x d sprechen, die Distel ist. Wiederholen Sie roh. Okay, was es tut, ist, dass wir diesen Inhaltsblock wie diesen haben. Dieser Block Post, zum Beispiel. Und ich will, dass Zehe eine Wiederholung erstellen. Schöpfen Sie es aus. Also werde ich dies treten und einfach medizinisch unten so ziehen und Sie können mehrere Instanzen kopieren, die in sexuell in diese Richtung und auch in der Zerstörung. Wenn Sie möchten, können
Sie so etwas verwenden. Okay, also liegt es an dir, Restriction. Willst du jetzt gehen? Der zweite große Teil ist der Abstand zwischen ihnen, so dass Sie den Abstand zwischen ihnen ändern können. Also vielleicht möchte ich diesen 48 Pixel Abstand zwischen diesen beiden Blockposts. Und jetzt haben wir das. Und der dritte Teil erstellen ist, dass Sie eine Textdatei erstellen können und in jeder Zeile werden Sie den klaren Text für verschiedene Überschriften. Also haben wir diese Überschrift, die ähnlich ist. Ändern Sie es in etwas anderes. Ändern Sie es in etwas anderes. Jetzt werden wir eine Textdatei erstellen und diese Überschrift sofort ändern. All diese Überschriften leicht. Okay, das ist
also meine Textdatei. Also werde ich diese Überschrift eins löschen, und dann in der nächsten Zeile werde
ich sehen, dass die Überschrift für Sie tun wird. Und in der dritten Zeile werde
ich sagen, Überschrift 34 Comey. Okay, also werde ich diese Datei speichern. Und jetzt ist der Trick, dass Sie diese Datei auf der ersten Instanz von
diesem wiederholbaren Raster ziehen und ablegen müssen. Okay, hier ist meine Textdatei. Also werde ich es auf diese ziehen und ablegen. Okay, das ist
also meine Überschrift. Also auf der ersten Kopie, das ist meine erste Kopie meiner Instanz. Also zieh es immer hierher. Nicht in diesem Bereich. Es ist so erste Kopie und ich ging Fuß, ziehen Sie es und legen Sie es ab. Lass es einfach fallen. Oder hier, so, und Sie können sofort sehen. Die drei Überschriften werden erstellt. Okay, das ist
also die Magie aus dem Wiederholungscred. In ähnlicher Weise können
Sie dasselbe mit den Bildern tun. Ok. Also, zum Beispiel, wenn ich einfach zurückgehe und, äh, einfach diesen Absatz entfernen und ich werde Fuß gehen, ein Bild
erstellen. Ein Sprengkopf. Okay, jetzt können Sie sehen, dass ich die ganze Sammlung von meinen Leuten Bilder aus meiner kostenlosen
Bildersammlung geöffnet habe. Und ich behalte meine Sammlung so. Okay, also was ich tun werde, ist, dass ich nur ein Bild in dieses Bild ziehe. Okay, jetzt können Sie sehen, ich habe dieses Bild lässt ihn von der Grenze und kein High. Ich habe dieses Überschriftenbild und dann diesen Link. OK, jetzt werde ich alle auswählen, und ich werde einen Wiederholungskrit erstellen und einfach so etwas löschen. Okay, jetzt habe ich drei Block-Prahls und ich möchte diese drei Bilder sofort ändern. Okay, was ich tun werde, ist, dass ich diese drei Bilder ziehen werde, und ich werde sie in erster Linie hierher fallen lassen. Jetzt können Sie sehen, dass alle drei sofort geändert wurden. Okay, das ist
also die Magie aus. Wiederholen Sie Credo. Und ich denke, es ist eine der besten Funktionen von Adobe extra Sie. Jetzt haben wir das gemeistert. Wiederholen Sie das Erstellen. Sie können auch Ihren Beat Great hier so erweitern. Wenn du willst. Oh, aber ich empfehle es jetzt nicht. Wir sind nicht auf das dran. Ok? Keine weitere Sache ist, dass Sie jetzt hier sehen können, dass wir etwas abgeschnitten haben. Okay, also bewegt sich dieser Inhalt nach draußen. Nun, wenn wir zu diesem Prototyp ziehen und ah, hören
wir es. Zwei Bildschirme, nur um diesen zu besänftigen. Okay, also bewegen Sie das, schleppen Sie diesen Prototyp, und wenn ich auf diesen Bereich klicke, wird das mein Home-Bildschirm sein. Also mach es einfach nach Hause. Dieser Klick hier drüben und ich werde Zeh in diesen einziehen. Nur sein ganzer Blick, also das war's. Okay, also versuchen wir es zu laufen, und du siehst, dass ich einfach nicht gehen kann. Was reinigt. Es scheint, wenn ich nicht in der Lage bin, den Unterschied zu sehen, einfach dies in etwas anderes zu ändern, so dass wir sofort den Unterschied sehen können. So etwas wie das. Okay, jetzt werden wir das laufen lassen. Okay, also haben wir keine auf dem zweiten Bildschirm hier. Nun, was wir tun werden, ist auf dem Bildschirm. Jetzt haben wir das Viewboard versteckt 6 67 Nein, wir werden es auf etwas anderes verschieben. Als Nächstes. Ändern Sie es auf diese Weise, damit wir den gesamten Inhalt sehen können. Okay, jetzt haben wir das. Und, äh, gehen wir zur Stunde. Bevorzugte Art und nein, Sie können sehen, wir haben diese Leiste Bildlaufleiste. Nein, es ist grausam. Wird die erste Woche kühle Luft haben? Nur das vertikale Scrollen und die geringe Boardhöhe wird gleich sein. Ok, ändern Sie das
nicht. Sonst geht es hier auf den Fuß. Ein paar Probleme. Die Tür ändert die Höhe des Ansichtsbretts. Ziehen Sie einfach Ihren Klick auf Ihr Artboard und ziehen Sie es am unteren Rand des Bildschirms. Okay, also ist alles sichtbar. Damit waas den untersten Teil von Ihrem Bildschirm Viewboard Bereich, können
Sie die Tochterlinien sehen. Und jetzt haben wir das. Wenn ich verlängern kann, wenn ich es mehr so erweitern möchte. Und wenn ich das auf etwas anderes ausdehne, können Sie sehen, jetzt haben wir mehr Platz hier drüben und wir können ein bisschen mehr nach unten scrollen. Nun, wenn ich diese Vorschau wieder laufen jetzt können Sie sehen, wir haben mehr Scroll-Level-Bereich. Ok? Nun, wenn Sie diese Wiederholung entfernen möchten erstellen, OK, also werde ich darauf klicken und auf Gruppe Gut. Nun, warum brauche ich es? Also, wenn Sie zu Ebenen gehen, können
Sie hier sehen, wir haben nichts. Also nur eine Gruppe namens wiederholen. Großartig. Ich kann etwas nicht bearbeiten oder ändern, wenn ich möchte. Okay, also was ich tun werde, ist das Raster der UN-Gruppe und ich werde etwas ändern. Vielleicht. Lasst uns weitermachen. Ok. Und wieder, ich werde Zeh einen Beat erstellen. Großartig. Wenn alle diese Gruppen jetzt Sie sehen können, habe ich alle diese drei Gruppen ausgewählt und klar , das erschien wieder großartig. Okay, Sie können sehen, jetzt habe ich das und eins von ihnen erschaffen. Ich habe es gerade bearbeitet. Okay,
Also, wenn Sie Ihre lesen großartig und bearbeitet so anpassen möchten, nur Hoy haben Sie entweder mit der rechten Maustaste und un Gruppenraster oder verwenden Sie dies auf Gruppe erstellen und bearbeiten und dann gegen, wie, jede Gruppe, die Sie getrennt haben. Also, wenn ich wieder Gruppe bin, können
Sie sehen, dass wir diese eine Gruppe jetzt haben und ah, in Discover haben wir drei Gruppen. Ok? Also kannst du hier alles ändern, was du willst. Vielleicht ändere ich das nicht. Ja. Also werde ich zu dieser Gruppe gehen und ich gehe zur Owen Group, weil das eine zusätzliche
Gruppe ist . Okay, also haben wir jetzt drei Gruppen. Wieder einer zu winterlich. Ich werde Beat Creed erschaffen und ich kann ein großartiges Out schaffen. Okay, das ist die Art und Weise, wie Sie, äh, Gruppen Ihre Note und eine Gruppe Ihre große wieder und Sie können sofort Ihre Werte aktualisieren, Ihren Text auf Ihre Bilder,
alles, was Sie wollen. Einfach per Drag & Drop ziehen. Das ist alles über diese neue Funktion, die Wiederholungsraster ist. Ich hoffe, Sie haben diese Lektion genossen. Gehen wir zum nächsten.
28. Komponenten in Adobe XD – UPDATE: Gestern. Adobe X'd waas auf Version Mai 2019 aktualisiert und sie haben ein umfangreiches Update veröffentlicht. In diesem Update haben sie also die Symbole durch die Komponenten ersetzt. Anstatt Symbole zu verwenden, was meine alte Lektion war, ersetze
ich sie durch Komponenten von was? Unsere Komponenten. Ich werde dieses ganze Konzept in dieser Lektion erklären. Also bleib bei mir und lass uns anfangen. Also hier haben wir nur eine Art Board mit nur ein paar extra waren hier eine Taste und diese Sie können sehen, diese sind getrennt Diese eine Diese Ebene ist Hintergrund und das ist Text. Dann wieder unten. Sie können sehen, wir haben dies für diese vier Gruppen auf haben wir? Ah, eine andere Gruppe, die untere Navigation ist. Also all diese vier Symbole, die Sie hier sehen können, sind sie in diesem und dann haben wir den Hintergrund. Also, was wir jetzt tun werden, ist in jeder Hinsicht, Design-System- oder Benutzeroberflächendesigns sind einige. Das beste System ist, dass Sie Ihre Komponenten wiederverwenden können, so Komponente ist genau wie Symbole, Aber sie sind eine behandelbare. Sie können ihre Worte ändern. Sie können ihre Größe ändern. Sie können ihre Farben ändern. Sie können verschiedene Eigenschaften außer Kraft setzen. So können Sie sehen, dass wir hier sind, wie wir eine Komponente herstellen können. Wählen Sie einfach den gewünschten Gruppen-Layer aus. Zum Beispiel, dieser und ich gehen Zehe drücken Befehl oder Kontrolle K oder Und das wird eine
Komponente, die Sie hier sehen können, wir haben Komponente von Dishman. So können Sie es wie,äh,
primäre unterstrichene Taste
umbenennen äh,
primäre unterstrichene Taste
umbenennen . Okay, also haben wir diese Komponente jetzt, es gibt eine Sache, die wir verstehen müssen. Sie können hier sehen, wir haben einen kleinen grünen Jack Gewirr um diese Komponente. Es bedeutet, dass dies die Master-Komponente ist. Also, wenn wir versuchen toe, gehen Sie zu diesem Assets und Sie können hier sehen, haben wir eine weitere Registerkarte hier drüben, die Komponente genannt wird. Wir können es hier umbenennen prime re so etwas lesen. Und jetzt, was ich tun werde, ist, dass ich diesen einen Sprengkopf ziehe und ich bin
so ausgerichtet , und du kannst sehen oder hören auf diesem Knopf, den wir haben. Wir haben hier keine quadratische oder diamantartige Sache, also wenn ich diese auswähle, können
Sie hier sehen, dass wir einen Diamanten haben. Und wenn ich dieses auswähle, ist das eigentlich eine Instanz von diesem Knopf. Also das ist der Meister davon ist ein Kind. Sofortige Instanz. Und es ist Sie können es ändern, ohne diese zu ändern. Versuchen Sie also nicht, den Meister zu wechseln. Wir werden diese bearbeiten,
also werde ich doppelt auf die Zehe klicken, um diese Ebenen zu sehen, damit Sie sehen können, wie das
geöffnet wurde . Diese Komponente ist geöffnet. Wir können die Schichten darin sehen. Wir können die Farbe ändern. Also werde ich mit,
äh,
dieser Farbe gehen äh, und Sie können sehen, dass die Master-Komponente da ist. Okay, also verwenden wir die gleiche Komponente. Und wenn ich zur vorherigen Komponente zurückkehren möchte, kann
ich mit der rechten Maustaste klicken und auf Mars Master-Komponente zurücksetzen. Also wird es meine Einstellungen auf die vorherige Master-Komponente zurücksetzen, die diese war. Okay, also, ähm, das ist eine Sache. Wir können auch die Größe ändern, ohne dass Sie sagen können, tauschen Sie die Größe von hier aus. So können Sie jetzt sehen, dass ich die gesamte Komponente und nicht ihre Teile auswähle. Also gehe ich hier drüben Krabben, und ich werde es so erweitern, ähm, Zehe meinen ganzen Bildschirm und du kannst alles gleich sehen. Wir haben keine Änderungen in der Master-Komponente. Aber wenn wir hier versuchen, etwas zu ändern, zum Beispiel den Kraft-Prozess, lasst uns es in etwas anderes ändern. Lass es uns ändern, um besser zu dienen. So können Sie sehen, sobald ich t und machen Sie eine Änderung in der Kampfkomponente, es wird in all seinen Kindern reflektieren. Also habe ich meine Schrift geändert, und jetzt spiegelt sie sich in allen Kindern wider. Also das ist eine großartige, denke ich,
Verbesserung, weil wir bearbeiten können, können
wir verschiedene Instanzen von der gleichen Schaltfläche erstellen, vielleicht zu Ihren vier verschiedenen Arten von Putin Primary sekundär, tertiären Burtons verschiedenen adul gerade Nachrichten oder solche Dinge. Also, das ist großartig. Okay, also denke ich, das ist alles für diesen hier. Jetzt werde ich eine andere Komponente mit dieser erstellen. Okay, Sie können hier sehen, wir haben diese untere Navigation und ich werde Zehe erstellen eine Komponente. Sie können auch mit der rechten Maustaste klicken. Und hier haben wir Komponente machen und es wird eine Komponente sein Okay, so jetzt können Sie sehen, ob ich gehe zu Kunstboard drücken ein und ich will mit diesem Bildschirm iPhone
sechs ausgehen gehen . Ich kann zu meinem Komponentenabschnitt hier drüben gehen, und ich kann es so ziehen. Also, jetzt, wenn ich die Größe ändern will, zum Beispiel, es war iPhone X Zugang Bildschirm und diese Einheit Charta, so kann ich hier rüber gehen und ich kann hier abhängen. Hier geht es also um Komponenten in den Trümmern. Eigentlich hoffe
ich, Sie haben diese Lektion genossen. Wenn Sie Fragen haben, die Sie mir stellen müssen, fahren
wir mit der nächsten Lektion fort.
29. Verknüpfte Elemente in XD – UPDATE: in diesem Video werden
wir über eine sehr neue Funktion sprechen, die Adobe vor zwei Tagen im Mai 2019
veröffentlicht hat . Und das ist eigentlich ein Designsystem. Sie können ein Designsystem in Adobe X T pflegen. Und wenn Sie eine neue Datei öffnen, können Sie auf der linken Seite sehen, haben wir Link-Assets. Wir werden also sehen, wie wir ein ganzes Designsystem entwickeln können. Und wir können unser Designsystem mit jedem neuen Projekt verknüpfen, das wir entwickeln. Zum Beispiel, ähm, Airbnb oder uber Sie können diese Websites sehen, die sie haben Ihr ganzes Design-System dort
vorgibt , dass sie Symbole dort sind, Di Biographie. Alles ist, weißt
du, in einem Design mit einem System. Also, was sie tun, ist, dass sie einfach das gesamte Designsystem und Juden diese Komponenten aus diesem Designsystem verwenden und sie verwenden, um ein neues Design zu bauen. Nun, bevor wir in verknüpfte Assets gehen, werden
wir Zehe Download dieses schönen Design eine Semantik. Du weckst es für mehr als 60 Semantik. Sie sind eigentlich ein Framework für Front-End-Entwickler, um fab abs zu bauen und es ist ein großartiges . Sie können ihre Website besuchen. Ich werde den Link zeigen. Also hier ist ein kostenloses Kit und es ist sehr detailliert. Sie können sehen, dass wir Knöpfe haben. Wir haben Schritte. Wir sind gestorben. Bogra Gebühr Farben, Formulare, Platzhalter, Befehl, Suche alles, was wir hier haben. Das nennt man also das gesamte Designsystem. Wir haben Komponenten. Wir haben Lasten. Wir haben Typografie, Skalen und jede Überschrift und all das Zeug. Also, sobald Sie das heruntergeladen haben, können
Sie hier sehen. Laden Sie Semantic herunter. Gefällt es dir? Wir werden diese X T-Datei in unserem Adobe X'd öffnen. Jetzt, wo Sie sehen können, habe ich Semantic geöffnet. Sie mögen es und es ist ein detailliertes. Du magst es mit vielen Kunstbrettern. Sie können sehen, wo, wenn ich hineinzoomen, Sie können sehen, dies sind einige Warnmeldungen. Ein paar andere Dinge, als wenn wir hier rüber gehen. Sie können sehen, dass wir Symbole haben. Wir haben Lasten. Onda, Diese dieses Dokument können Sie sehen existieren, Master-Komponente. Wenn Sie sich an meine letzte letzte Lektion erinnern, ist
diese Master-Komponente tatsächlich diejenige, die Sie ursprünglich erstellt haben. Und wenn Sie irgendwelche Änderungen vornehmen oder hier wird es über Ihr gesamtes
Designsystem reflektiert werden . Also alles, was sie hier haben, ist es nicht Meister. Diese sind in so vielen. Wir haben Lasten. Das sind keine Master-Komponenten. Dies sind nur Instanzen von derselben Schaltfläche. Primär defile. Lassen Sie mich hineinzoomen. Sie können hier drüben sehen. Primäres sekundäres Defile. Dies sind keine Hauptkomponenten, da wir auf der linken Seite keinen Diamanten haben. Also hier haben wir verwerfen speichern. Okay, dann haben wir farbige Knöpfe. Dann haben wir Button mit Likes oder solche Dinge beschriftet. Jedenfalls, also der erste Schritt, wenn Sie wollen, wenn Sie Ihr gesamtes Designsystem entwickelt haben, also wie werden Sie das tun? Sie gehen Fuß, geben Sie einige Farben an. Du wirst Typografie,
Schrecken und all das Zeug haben , und du wirst sie auch hier im SX-Panel hinzufügen. Okay, also haben Sie diese Datei erstellt. Sie können sehen, all diese Farben sind hier drüben. Sie werden richtig genannt Warnung, Nachricht, Hintergrund und all das Zeug. Sie müssen sicherstellen, dass hier alles hinzugefügt wurde und dann werden wir dieses Dokument
speichern. Wir gehen, um zu speichern unter und wir werden es als unser Cloud-Dokument speichern. Also werde ich es als mein Cloud-Dokument speichern. Okay, also ist es gerade jetzt, es zu retten. Es wird einige Zeit dauern, weil es mehrere von Toby in meine Cloud hochlädt, und mal sehen, wie viel Zeit es braucht. Okay, jetzt wurde es gerettet. Wir werden es schließen. Wir werden eine neue Datei öffnen. Also werde ich eine neue Datei öffnen. Öffnen wir dieses Web 1920 und wir gehen toe-klik. Nun, wenn wir all diese Komponenten, die wir semantisch gespeichert haben, bringen wollen, gehen wir
toe-klik oder hier Link Assets und wir gehen zu diesen Wolken gehen, dokument-Cloud-Dokumente, und wir werden Wählen Sie diese aus. So jetzt können Sie sehen, dass es alle Vermögenswerte auf der linken Seite gebracht hat. Sie können sehen, dass ich alle Behauptungen habe. Ich habe das ganze Typografiesystem, alles hier drüben. Also, wenn ich etwas schnell bauen will Oops. Wenn ich schnell etwas bauen will, kann
ich hier rüber ziehen. Und das ist mein Knopf. Du kannst jetzt sehen. Sofort. ist es gewesen. Es hat ein kleines Symbol hier, dass es ein verknüpftes Asset ist. Also können wir diese Komponente auch lösen, wenn wir wissen wollen, ob wir mit der
Komponente bleiben und diese wie unser semantisches um,
Kate oder Designsystem verwendenwollen Komponente bleiben und diese wie unser semantisches um,
Kate oder Designsystem verwenden , können
wir das tun. Ok. So können wir auch auf Master-Komponente zurücksetzen. Wenn wir Änderungen vorgenommen haben, können
wir diese Komponente auch in den Master-Quelldokumenten hinzufügen. Also, wenn wir hier klicken, wird
es ein Quelldokument öffnen, und hier haben wir es und wir können es hier bearbeiten. Also gibt es viele Dinge, die Sie hier tun können und lassen Sie uns diesen Fonds ziehen, also haben wir Facebook , aber und dann haben wir grundlegende Kartenkomponenten. Sehen Sie, wir sind hier, und wir sind hier,
und
vielleicht kann ich diesen Knopf hier drüben so hinzufügen. Verschieben Sie es über so etwas, so dass Sie innerhalb von wenigen Drags und Drops sehen können. Ich habe diese Wache für Christie geschaffen und wir können, wissen
Sie, diese hier
benutzen. OK, also sind das tatsächlich Komponenten. Sie können leicht miteinander gehen. Wir können auch noch ein paar Sachen ziehen, wie wir hier rüber haben. Eine manuelle vertikale Schulstange. Also haben wir dieses Menü Navigationsmenü, dann haben wir viele vertikale. Diese sind also in Komponenten eingebaut. Wir können sie wiederverwenden. Wir können sie anpassen, wenn wir wollen. Wenn wir wollen, dass wir sie verknüpfen und ändern, können
wir das auch tun. Also lassen Sie es uns hier überschreiben, und ich gehe zu Ihnen ein paar meinen Posteingang. Ok. So einfach. Einfach, das ist, denke
ich, das perfekte System, das Sie tun können. Und wenn wir hier rüber gehen, können
Sie sehen, dass
wir hier drüben keine Symbole haben. Ok? Also, wenn Sie wollen Oh, verwenden Sie die Symbole, die in dem anderen Dokument waren. Wir sind hier. Sie können diese und alle Symbole sehen, die Sie benötigen, um sie zu Ihren Assets hinzuzufügen. Okay, also wenn wir diese oder vielleicht diese eine Möglichkeit haben, wollen
wir sie über Vermögenswerte hinzufügen. Also werde ich Zehe wählen ihre Auserwählter. Icahn ist diese Ikone und ah hatte es zu einer Komponente gemacht. Ich werde es zu einer Komponente machen. Okay, also nennen wir es, wie bei Expandieren. Ok. Stellen Sie also sicher, dass Sie die Benennung perfekt ist. Du musst so etwas wie dieses Spiel
nicht machen. Es ist also ein Anblick. Nein, das
retten. Das gleiche Dokument, das mein Masterdokument ist. Ich ändere mich. Ich habe ein Asset erstellt, das mein Symbol hier ist. Nein, gehen
wir zurück zu dem ersten Dokument, das verlinkt war, das wir hier in Over entwarfen. Und Sie können sehen, hier haben wir eine Schaltfläche sagen Update. Es bedeutet also, dass jemand in den Masterdokumenten aktualisiert hat. Ich werde nach dem Wort hier drücken, oder wenn ich runtergehe, können
Sie sehen, ich werde das Update drücken und wird Zehe Sie sehen könnten. Zeigen Sie mir eine neue, da sie von der Semantik hinzugefügt wurde. Du magst es, also gehe ich runter. Und hier ist die Komponente. Ich habe gerade hinzugefügt Dies ist Symbol. Okay, so können Sie Ihr Designsystem nahtlos in Schlepptau integrieren. Jedes Design, das Sie tun, also was auch immer Sie Designer tun, wenn wir schon ein System gemacht haben, haben
wir ein Designsystem. Wir können das verwenden und wir können ihre Änderungen in die Master-Komponenten oder Master-Datei aufbauen, was unsere Semantik ist, die Sie böse Art und Weise hier verlinkt haben und es wird alle
Komponenten verknüpfen . Alle Stile waren hier von Überschriftenformatvorlagen, alle Farben,
alles, was es in unser neues Dokument importieren wird. Das geht also alles um verknüpfte Vermögenswerte. Ich denke, es ist ein tolles Feature. Wir können in der Regel ist, dass ,
Ah, und erstellen genial Sie Augen Benutzeroberflächen. Ich hoffe, Sie haben diese Lektion genossen. Wenn Sie Fragen haben, die Sie mir stellen müssen, fahren
wir mit der nächsten Lektion fort.
30. Häufige Tastaturen: Wenn Sie irgendeine Software, jedeApp,
jedeDesign-Software und entsprechende Software lernen App,
jede möchten, wenn Sie schnell in sie bekommen möchten. Und wenn Sie möchten, dass Sie Ihren Workflow sehr schnell machen, müssen
Sie lernen, es ist Verknüpfungen auf der Verknüpfung. Tasten sind, ah, etwas anders, nicht sehr verschieden in Mac und Windows. Es gibt zu viel Ähnlichkeit, und ich liebe die Tastenkombinationen, die in dieser Adobe Exley Software zugeordnet sind, weil sie sehr leicht zu merken sind. Okay, also werden wir die grundlegenderen oder meist verwendeten Crocker-Schlüssel in dieser Lektion abdecken. In der nächsten Lektion werden
wir ein paar weitere Informationen erforschen,
die Ihnen dabei helfen können , Ihren Workflow in Adobe X'd zu
beschleunigen. Okay, also lasst uns anfangen. Also zuerst werden
wir einige von den Werkzeugen auf der linken Seite sehen. Die sind sehr einfach. Auswählbar ist V wie immer wie wir in für ein Geschäft hatten und ich denke, in Illustrator dann haben wir diese Sektenwinkel, das ist Rechteck für unsere und wenn Sie drücken, werden Sie Fuß gehen. Also werde ich das auswählen und ich werde unsere drücken und jetzt habe ich ein Rechteck Lassen Sie uns hier ein Rechteck
zeichnen und seine Grenze entfernen. Okay, also haben wir ein Rechteck, dann haben wir diese Ellipse und sehr leicht und du wirst eine
Ellipse bekommen . Sie können die Umschalttaste drücken, um sie so proportional zu machen. Das ist also sehr einfach. Ich werde wieder v Saudi drücken. Nicht hier drüben. Ich werde V drücken und ich werde irgendwo klicken, um es auszuwählen. Ok. Okay, dann haben wir dieses Zeilenwerkzeug, das ist l. Das ist auch sehr einfach. Nur eine Linie, die Sie kontrollieren können. Optionen waren wieder hier. Ich werde V drücken und ich werde irgendwo anders als dieses mentale klicken. Das ist sehr einfach. Sie können ziehen und so etwas tun. Das ist also unser Pflanzenwerkzeug und ich werde wieder die Flucht drücken, um es so zu verlassen und v d ausgewählt und wieder ausgewählt. Außerdem können
Sie die gefüllte verwenden, wenn Sie möchten. Also, das ist Bendel. Dann haben wir diesen Text über HST D ist für Textwerkzeug. Sie können jede Art von Text verwenden. Okay, die sind
also sehr einfach. Dann haben wir diese Art Board A und Sie werden mehr unsere Bretter haben. Lassen Sie uns ein iPhone X Hardboard hier erstellen, und ich werde die Leertaste drücken, die auch sehr häufige Taste ist, um alles und wie zu bewegen. Ok, warum? Sie entwerfen Steuerelemente und ich werde V drücken, und ich werde die Leertaste drücken, um diese Leinwand zu halten, und ich werde nach oben bewegen, um es in der Mitte zu fokussieren. Okay, das ist
also eine weitere kurze Karte. Sie können die Leertaste drücken, um diese Dinge so zu bewegen. Okay, dann haben wir das Zoomwerkzeug Z, und Sie können es presi verwenden, und Sie können es verwenden, um auf ein Element zu zoomen. OK, jetzt, wenn Sie zurückgehen möchten, können
Sie Ihre Kunst- oder Wahltaste drücken und halten, und Sie können so verkleinern. OK, also klicken Sie einmal und Sie gehen Fuß. Verkleinern. Das ist also der neue Verrückte. Es wird in diesem mehr sein. Wenn Sie verkleinern möchten, müssen
Sie die Bild- oder Optionstaste drücken und halten Sie sie gedrückt und es wird verkleinert. Okay, jetzt sind wir Sie können sehen oder hören in der Zoom-Tool Zoom-Vergrößerung, dass wir bei 75% oder 100% gerade jetzt. Also, wenn ich verkleinere, sind
wir jetzt 75 50%. Ok. Nun, wenn wir mit Shortcut-Kindern zurückgehen wollen, zoomen Sie hinein und zoomen Sie heraus. Das ist auch sehr häufig, und wir werden es viel Zeit verwenden, was Kontrolle oder Befehl ist. Plus wie das. Drücken Sie also die Kontrolle oder den Befehl und dann den Explosionsski als das Minus für das Verkleinern. Dies wird viele Male verwendet werden. Dann für einen Zoom 200% oder Zoom-Zehe dieses Fenster, dann werden wir die Steuerung und Null drücken. Okay, jetzt können Sie sehen, dass es zu 79,44% gehört und es ist aus Respekt vor der Gegend, die ich hier mit meiner Leinwand
habe, in Zonen aufgeteilt . Okay, wenn er es benutzte, traf
ich Prognosen König fünf K. Es könnte mehr als 200% annehmen. Du bist gerade jetzt, ich benutze meinen Windows-PC. Also habe ich weniger Platz. So ist es auf 79,4% in Zonen aufgeteilt, was für mich Zehen bequem ist Tun Sie meine Grafik-Design-Sachen. Nun, wenn Sie es zu vergrößern 200% Sie können das tun, um Sie können Befehl oder Befehl oder Steuerung Drücken Sie ein. Okay, jetzt können Sie sehen, dass es fast ausgeht. Außerhalb meiner Reichweite sind mein Bildschirm und meine Leinwand. Deshalb hat diese Software die Zehe 79,4% erweitert. OK, Sie können
also auf Null drücken, um die Passform zu zoomen. Sie können Steuerelement oder Befehl eins
und ah drücken und Null steuern und befehlen, um es wieder an die Leinwand anzupassen. Okay, das sind also ein paar Werkzeuge. Wir werden sie viel Zeit gebrauchen. Vergrößern, verkleinern und verkleinern. Nun, in der nächsten Lektion, werden
wir einige mawr Tastenkombinationen behandeln, die uns helfen werden, sich mit
den Ebenen zu bewegen . Wenn wir also in die Schichten von diesem Panel gehen, können
Sie sehen, dass wir 12345 Jahre haben. Also werden wir ein paar Dinge mit diesen Ebenen machen, sie
bewegen, sie und Dinge wie diese
ausrichten. Gehen wir also zur nächsten Lektion über.
31. Weitere Tastaturen: Okay, jetzt beginnen
wir mit einigen der meisten Tastenkombinationen für Adobe X T Abschlepparbeiten zu lernen. Pflegemittel darin. Jetzt werden wir etwas Jahre sperren. Okay? Nun, wenn Sie hier
zum Beispiel eine Hintergrundebene haben , lassen Sie uns hier einen Hintergrund wie diesen erstellen. Okay? Jetzt können Sie sehen, dass es an der Spitze ist. Ich wollte hinten sein. Lassen Sie uns eine lineare Zutat erstellen und wählen Sie einige der Farben hier drüben. Das gefällt mir so. Okay, also haben wir eine Zutat. Lassen Sie uns zwei Farben zitieren. Okay. Jetzt können Sie sehen, dies ist, wo einige der Grenze und jetzt können Sie sehen, es ist an der Spitze. Nein, wir wollen, dass es nach unten bewegt wird. Okay,
Also, was wir tun werden, ist, wenn Sie rechts, klicken Sie hier, Sie können die Option zu arrangieren sehen. Das ist also sehr einfach. Zurück in der Mitte. Bringen Sie einen Freund. Okay, also bedenken Sie. Sehr einfache Tip Shift. Also verlagern wir das in die Tasche. Also werden wir drücken Befehl Shift und die hintere Klammer oder die umgekehrte Klammer, um
es zurück zu senden und die Vorwärtsklammer, um es an anderen zu bringen. Okay, also werde ich es jetzt tun. Befehl Shift oder gesteuert. Zurückziehen, Zurück. Beckett und Rekord. Jetzt können Sie links im Ebenenfenster sehen. Es bewegt sich nach oben und unten. Jetzt können wir sehen, dass diese Schicht unten ist. Okay, so wie es unser Hintergrund ist, also wollen wir es sperren, damit du es auf zwei Arten tun kannst, richtig? Sie können mit der rechten Maustaste klicken. Und Sie können sehen, Hier ist das bereit. Einfache Tastenkombination Befehl oder Steuerung. Und so sperren Sie es einfach so. Jetzt können Sie ein kleines Schloss sehen. Ich bin jetzt hier rüber gegangen. Wir können es nicht versehentlich so bewegen. Also, wenn wir wählen, werden
wir diese Textur und alles eigene auf dieser später auswählen. Okay, also gehen wir hier nicht auf die Hintergrundschicht des Selektors. Okay. Okay. So können Sie sehen, jetzt haben wir drei Schichten über dem Haar. Einer ist auf der Rückseite und es ist verriegelt. Nun, eine weitere Sache, die Sie tun können, ist, dass Sie Ihre Ebenen ausblenden können. Also, wenn Sie einen Tag wie diesen wählen und wenn Sie sich verstecken wollen ist Sie gehen Zehe drücken Kontrolle und Semikolon oder Kontrolle oder auf dem Mac, Es wird Befehl sein, Tastensteuerung oder Befehl Semikolons. Und es wird sich so verstecken. Sie können sehen, dass ich es immer wieder verstecke und zeige. Dies ist also auch ein gemeinsamer Schlüssel, den Sie lernen müssen. Dann gibt es noch eine Sache. Zum Beispiel diese beiden. Ich möchte, dass sie miteinander verbunden sind. Also bin ich es. Was ich tun werde, ist, dass ich will, dass es mit diesem zusammengefasst wird. Okay, also werde ich es weiß abdecken. Und so werde ich gehen. Ich will, dass sie eine Gruppe sind. Also werde ich die Umschalttaste drücken und weiter darauf klicken, dass die Elemente oder die Ebenen. Ich möchte in einer Gruppe sein, in der ich die Kontrolle oder den Befehl G
drücken werde . So können Sie auf der linken Seite sehen. Jetzt ist es Gruppe eins. Nein, wenn Sie es umbenennen möchten, können
Sie hier doppelklicken und Sie können sie umbenennen. Sie können sehen, dass wir ein von drei Jahren gruppiert haben und wir können sie auch so weit auf Gruppierung sie gruppieren, wir werden nur einen Schlüssel damit ändern. Also Befehl und unsere Steuerung G war für Gruppierung und Befehl Shift G ist auf Gruppe jetzt
können Sie sehen, dass sie gruppiert wurden. Das sind also einige Dinge, die wir viel verwenden werden, zum Beispiel Gruppierung und Gruppierung. Jetzt noch eine Sache ist, dass, wenn Sie früher duplizieren möchten, wenn ich dieses duplizieren möchte, ich entweder Brust sind Drop Schienbein-Taste und ziehen Sie so und es wird eine
duplizierte erstellen . Der andere Weg ist, dass ich auch Commander Control D drücken kann und es wird duplizieren. Dies sind also zwei Möglichkeiten, um leere in Adobe X'd jetzt ein paar weitere Dinge zu duplizieren. Zum Beispiel, wenn ich alles auswählen möchte, kommt
es Controller Command. Es ist fast üblich in allen Apsis Design, APs, sogar Microsoft Word. Und wenn Sie de auswählen möchten, können
Sie wieder eine Shift-Taste in der Mischung,
Steuerung oder Befehl hinzufügen . Verschieben Sie es und es wird es sezieren. Also werden wir es jetzt wieder auswählen. Ein weiterer Schlüssel, den wir viel verlieren werden, ist die Ausrichtung. Ausrichtung ist sehr notwendig. Zum Beispiel, wenn ich das hier drüben habe und ich wollte in der horizontalen Mitte. Okay, also was ich tun werde, ist, dass ich Shift benutzen und auf Windows Szefc sehen werde, also ist es sehr einfach. Verschieben Sie diese Ebene einfach in der Mitte. Okay, also Schicht sehen? Das macht Sinn. Okay, Jetzt, auf dem Mac, haben
wir eine andere ausgesetzte Tasten, die gesteuert Befehl und sehen auf Windows Shift Siehe, und auf Mac Betriebssystem Control, Befehl und sehen. Okay, also bedenken Sie das. Nun, das ist für das Herz steht im Zentrum der Zerstörung. Nein, wenn du willst, dass es in der Mitte von diesem ist, zum Beispiel, wenn ich das lösche und ich es in der Mitte von dieser ganzen Leinwand will, was ich tun werde, ist, dass ich die Tastenkombination drücken werde. Shift em, die für die Mitte ist. Also Mitte ist vertikal. Mitte ist horizontal, so Shift em ist der Schlüssel. Und auf Mac, wird
es kontrolliert Befehl und m er ist der gleiche. Nur die gemischten Tasten wie Befehl und Kontrolle. Das ist anders. Also, wenn Sie auf einem Mac sind, müssen
Sie die Kontrolle drücken, Commander. Und ok, jetzt gibt es ein paar mehr, die wir verwenden können, was verwandt ist oder Decks. Also, wenn ich etwas Dextre vergibe? Hier. Okay, also haben wir hier drüben SMS. Und wenn ich es fett machen möchte, werde
ich es auswählen und Steuerbefehl sein Zehe, machen Sie es fett Steuerbefehl, um es zu unterstreichen und kursiv für I zu machen, was sehr ähnlich ist, Texteditoren wird verwenden Dies ist jetzt praktisch, wenn Sie wollen , um Ihre nächste Größe zu ändern und wenn Sie die Textgröße sofort erhöhen möchten, was Sie tun können, ist genau wie die nächsten Schritte und unter Windows ist es Kontrollverschiebung und Irakisch in Ihren Tasten, was im Grunde Ihr vollständiger Halt ist. Also Control Shift Full Stop. Und dann gibt es ein Koma, das ist eine weitere Pfeiltaste zurück Carol, um die Größenerhöhung reduziert zu reduzieren. Also drücke ich meine Umschalttaste und Kontrolle halten auf meinem Windows auf Mac-Betriebssystem gerade entfernt die Umschalttaste. Und es wird Kamande und deine Iraker, deine Tochter und dein Komma sein. Okay. Und jetzt ist die letzte Tastenkombination, die ich Ihnen zeigen möchte, diese Maskierung. Also, wenn Sie zwei Jahre haben, ist
eins an der Spitze, dieses Bild, und dann ist dies ein Rechteck. Du wolltest Boot von ihnen mit Shift-Taste auswählen. Und du und du werden Kommando drücken. Shift em oder Control. Shift em. Okay, so wie das. Okay. Also kann ich das jetzt so bewegen, und Sie können sehen, dass ich dieses Bild in dieser Form maskiert habe. Dies ist also die letzte Kontrolle Shift oder Befehl Shift M m Form fragen. Diese Schlüssel sind sehr leicht zu merken. Ich liebe sie einfach. Diese Adobe X'd Tastenkombinationen sind sehr leicht zu merken, da sie mit
Designern in der Mine abgebildet sind und sich leicht an die Funktion erinnern können, die sie tun. Zum Beispiel, Maskierung ist es für sie. Und deshalb ist das die Hauptsache. Ich liebe dieses Tool anders als durch die Funktionen. Also stellen Sie sicher, Jack, Sie haben die meisten Grundlagen gelernt und Sie können diese Dinge leicht in dieser Software tun. Und jetzt, wenn Sie ein Wiederholungsbekenntnis erstellen möchten, ist
es sehr einfach. Wählen Sie einfach diese aus, und drücken Sie die Kontrolle oder den Befehl sind und Sie werden unser Geheimnis so haben, damit Sie
sehen können , oder ihn. Dies ist eine weitere kurze Karte, aber ich denke, die große gute Wir haben diesen Knopf hier drüben, so ist es einfacher, hier drüben zugreifen. es also um diese Tastenkombinationen. Wenn Sie Fragen haben, fragen
Sie mich. Gehen wir zur nächsten Lektion.
32. Was ist das Design von Block: heute werden wir diese Block-Level-Design zu erstellen und wir werden sehr neue
Technik aus der Gestaltung mobiler App lernen , Store-Websites oder alles, was Sie entwerfen. Diese Technik wird also im Grunde verwendet, wenn Sie mit Ihrem Design beginnen. Es gibt also zwei Dinge, die Sie tun können, wenn Sie Ihr Design beginnen. Eine ist, dass Sie mehrere Ebenen aus verschiedenen Elementen erstellen können, die Sie auf Ihrem Bildschirm haben. Zweitens ist, dass Sie im Grunde mit Stift und Papier beginnen. Also empfehle ich wirklich, dass, wann immer
Sie entwerfen, Sie mit einem Stift und Papier beginnen und ich werde Ihnen meine Hängepapier Skizzen und Stift
und Papier Stift Prototypen in diesem in der kommenden Nellessen zeigen . Aber gerade jetzt werden wir uns auf dieses Block-Level-Design konzentrieren und wie es uns helfen kann, unsere Designideen
zu beschleunigen . Und, ah, legen Sie die verschiedenen Layouts und verschiedene Kompositionen, die werden. Das Bild wird sein, wo der Text sein wird, wo die Überschriften sein werden und welche Elemente interaktiv,
interaktiv auf Ihrem Bildschirm sein werden . Jetzt werden wir diese Übung beginnen und ich werde eine aus dem Bildschirm machen und die 2. 1 ist für Sie. Für Ihren Auftrag. Ich werde Zuordnungsvideo in der nächsten Lektion erstellen, die dieser Artikel eins sein wird. Sie werden das generieren und wissen, was wir brauchen, sind nur zwei oder Baumkiller. Wie Sie sehen können. Seine graue Farbe ist ein bisschen dunkel, zustimmen. Und hier ist ein schwärzlich-grau-schwarzes Regular und eine Farbe für unsere interaktiven Elemente. Wie Knöpfe. OK, Sie können
also erraten, welcher Bildschirm dieser ist, indem Sie sich die Elemente hier ansehen. Okay, das ist
also unser Logo oder irgendein Bild. Dies ist einleitender Text. Willkommen zu unserer neuen kreativen App oder so etwas. Dies ist Login und Passwort. Und dann haben wir diesen Login Button. Dann hatten wir das. Vergessen Sie Ihren Passworttext, und dann unten haben
wir den Link angemeldet. Sie können ein bisschen aus klein und die Linie oder es sehen. Okay, das ist
also sehr einfach. Sehr einfach. Mach dir keine Sorgen. Wir werden es in kürzester Zeit lernen. Also lasst uns anfangen. Also, was ich tun werde, ist, ich werde ein neues Kunstboard erstellen gehen auf die
Kunsttafel klicken und wir gehen Zehe erstellen ein iPhone 67 plus sind OK, lasst uns einmal klicken. Gehen wir umrüsten, drücken Sie meine Leertaste, und ich werde es bewegen und steuern Null tut Zehe die Passform weglassen. Okay, also werden wir diesen Anmeldebildschirm jetzt erstellen. Es ist sehr einfach. Was wir tun werden, ist, dass wir dieses Rechteck-Werkzeug verwenden und einfach ein Rechteck
hier so zeichnen . Entfernt den Rahmen, verwendet die Farbe. Das hier verwende ich zwei D zwei D zwei D für die Bilder auf DA für die Bilder. Ich benutze das hier. Okay, also die Mitte stimmen Farbe zu. Okay. Und dann gehen wir auf die Flucht der Zehenpresse. Wir gehen jetzt in die Mitte, um den Text zu holen. Sie können Ihre hier sehen. Hier sind verschiedene Linien unterschiedlicher Länge. Wie ich das nutzen kann, ist, weil aus einer sehr schönen viralen Rahmung Fort, die Block genannt wird, lassen Sie mich Ihnen zeigen. Es ist ah, eine Website, auf der Sie es herunterladen können. Okay, Sie können sehen, dass dies Block für dot com ist. Ich werde den Link mit Ihnen teilen, und Sie können dieses Telefon hier herunterladen. Telefon herunterladen. Es ist auch investieren Telefon Landwirte. Also, wenn Sie vorhaben, ein Web-Telefon zu verwenden, möchten Sie dies auf Ihrer
Website anzeigen ? Du schaffst es, Zeh. Okay. So können Sie hier drüben sehen. Sie verwenden dies, um sehr einfache Layouts wie diese zu erstellen. Sie können hier drüben sehen. Und fangen wir von vorn an, Leo. Wählen Sie das aus. Also laden Sie dieses vierte herunter, installieren Sie es, und das ist alles, was wir brauchen. Okay, nein, nein, wir werden dasselbe Telefon benutzen, und wir gehen auf unserer Tastatur nach Presti. Klicken Sie einmal hier. Das ist also der vierte. Sie werden es von hier aus auswählen. Ich benutze diesen Block neue Fort. Und wenn Sie hier klicken, können
Sie so etwas wie jedes eingeben. Jeder Buchstabentyp, jeder Buchstabe. OK, wenn Sie die Leertaste drücken, wird
es viel Abstand zwischen den beiden Elementen sein. Hier sind die beiden Textbereiche. Was ich normalerweise mache, ist, dass ich diese Leertaste entferne, und ich wähle nur ein Zeichen aus und ändere seine Farbe toe white. Also habe ich auch hier drüben. Jetzt können Sie sehen, es sieht schön aus. Großartig. Und auch, ähm, stellen Sie sicher, dass diese Sexfarbe 707070 ist. Jetzt muss ich Zeh wieder dasselbe tun. Jetzt können Sie Ereignisse sehen, die ich für Mörder im Inneren verwendet habe. Ein Element der Füllfarbe wird zu diesem Bindestrich verschoben, und es gibt keine Colette darin, weil wir mehrere Autos verwenden. Okay, hier haben wir unsere beiden Elemente gesagt: Jetzt werden wir unser Rechteck benutzen, Samer verheddert Werkzeug, und wir werden für ein Textfeld zeichnen. Wir machen die Grenze Zehe fünf fünf. Und ich werde den gleichen Grenzmörder für diesen verwenden
, den ich für dieses Bild verwende. Okay, also haben wir das hier, dass ich die Art Optionstaste drücken werde, um es zu duplizieren. Sie können hier drüben sehen. Ich habe es kompliziert. Wir können dieses eine Porträt hier vergessen. Entferne einfach etwas von hier vorne. Dann gehen wir wieder Zeh, um es zu besänftigen, indem wir unsere Optionstaste auf Ihrer Tastatur weitergeben. Bewegen Sie es einfach hierher. Ok? Also lassen Sie uns die Entfernung sehen. Beste Kunst auf Optionstaste und wählen Sie eine aus den Elementen. Wenn Sie die Entfernung sehen möchten, lassen Sie uns ein wenig vergrößern. Lassen Sie mich Ihnen zeigen, wie ich mir ins Ohr gehe. Der Abstand zwischen diesen beiden Elementen klicke ich auf eines der Elemente, drücke meine Kunst-Optionstaste und du kannst dagegen sehen, dass mir die Entfernungen zeigt. Aber das Element, mit dem ich vergleichen möchte, ist dieses. Also werde ich gleich auf meinem Mund auf diesem, und es wird mir zeigen, dass es Schweine sind. Übel deiner acht Punkte davon entfernt. Okay. Wieder, Wenn ich das tue, ist
es sieben. Also werde ich acht machen. So sehen sie professionell aus und sehen ähnlich aus. Es herrscht Harmonie im Design. Also werden wir die Zehe benutzen. Das könnte uns auch bewegen. Entferne das hier drüben. Also, nein, ich würde es in der Mitte ausrichten. Okay. So wie das. Jetzt haben wir unsere Dieses war Bild oder niedrig abgeschlossen. Geh. Das hier war willkommen. Steuer. Hallo, Essen, oder so etwas. Hier sind unsere beiden Felder Passwort Login und Passwort. Und dann werden wir hier so weit ein persönliches benutzen. Aber wir werden gewinnen, das gleiche Rechteck zu verwenden, oder was Sie tun können, ist nur zu besänftigen, diese sind Korruption und verwenden Sie es oder hier, so. Entfernen Sie den Rahmen. Ändern Sie den Filter. Oh, das oder das hier? Ich werde diese Farbe jetzt verwenden. Nur ein bisschen Zehenwechsel. Ändern Sie das Team ein bisschen. Okay, wir haben jetzt diese Farbe. Es muss sehr helle Farbe sein. So macht es es anders als der gesamte Hintergrund oder die gesamte Schnittstelle, weil es ein möglich ist, aber Okay. Also wieder, ich werde hier klicken. Verwenden Sie einfach den Schatten drei Punkte nach unten. So ist es die unten in der vertikalen Position. Und das ist das Blut. Wie viel? Es ist verschwommen. Okay. Und wir können auch 20% verwenden, damit der Schatten sichtbar ist, haben wir den Schatten wieder. Ich werde das duplizieren, und ich werde es verschieben. Und der Job Befehl Shift Control Shift, Front Record und ah, mit der Farbe vied Next more Go ahead. Es gibt dir so etwas. Der Raum ist also sehr groß. Also ich, was ich normalerweise mache, ist, dass ich einfach OK, also dieser hier sieht auch gut aus. Und wir können so etwas für die Last nutzen, die schön und knackig aussieht. Okay, also haben wir unsere Last beendet. Wir haben noch zwei Elemente. Einer ist vergessen. Ihr Reisepass und einer geht auf den Anmeldebildschirm. Okay, Sie müssen
also alle Elemente denken, die auf dem Bildschirm platziert werden, müssen
Sie sie zuerst auflisten. Also, wenn Sie sie auflisten können, können
Sie sie hier ganz einfach planen. Und Sie werden nicht oft verpassen. Okay, jetzt haben wir diesen und diesen hier verlassen. Okay. Also wieder, wir werden diesen Text replizieren hier sieht es nahe an verzweifelt halten, weil es Sinn
macht. Das wird es sein. Und dann werde ich es noch einmal duplizieren, und ich werde es ein bisschen sagen. Ah, weit weg. Und ich werde diese Farbe benutzen, die sieben Trudy ist. Trudy. Etwas dunklere Farbe. Und auch werde ich diese Unterstriche verlieren. Okay. Wenn Sie dies nicht unterstrichen verwenden möchten, können
Sie dieses Linienwerkzeug auch verwenden, um eine Linie darunter zu platzieren. Es ist also ein bisschen weit weg von diesem. Und ah, entkommen
Sie einfach V und ich werde es etwas näher dran bringen. So wie das. Eso, das ist 105, also lasst uns das bisschen von diesem hier machen. Diese 105 Buddhist, ein Pixel kurz, und ich werde wählen. sie gewehrt und verschoben. Sehen Sie? Okay, also sind sie Schichtmeer. Und auf dem Mac, Sie werden die Steuerschalttaste drücken. Sehen Sie, ich schätze, Kommandoschiffe leicht. So ist es in einer Linie in der Mitte. Sie können sehen, dass ich ein wenig andere Technik von dieser einen Luft verwendet habe. Ich benutze Raum im Text hier drüben, dass es zwei Wörter wie Logan Haar oder so
etwas sein wird. Hier benutze ich nur einen. Es spielt keine Rolle. Es ist nur eine Repräsentation. Also, wenn Sie so etwas wollen, verwenden Sie
einfach weiße Colette hier drüben und lassen Sie mich Vital verwenden. Äh, huh. Okay, jetzt können Sie sehen, dass alles toll und schön aussieht. Lassen Sie uns das Vital von diesem bewegen. Und hier haben wir unseren Login-Bildschirm vorbereitet. Okay. Jetzt ist deine Aufgabe, ich werde noch einen mit dir in der nächsten machen. Okay, also werde ich Ihnen zeigen, was Ihre Aufgabe ist. Es ist sehr einfach. Sie werden diesen Block ein neues Fort verwenden, um dieses Block-Level-Design zu erstellen. Es geht wirklich auf die Zehe. Lassen Sie Ihre Entwürfeprofessionell
aussehen. Lassen Sie Ihre Entwürfe professionell Und es ist der erste Schritt in Ihrem Design. Vielmehr sind
Sie ein erfahrener Designer oder Sie sind ein großer No-Designer. Du musst so anfangen. Es wird wirklich Ihre Design-Fähigkeiten zu verbessern. Okay, Sie können sehen, dass der Abstand zwischen all diesen Elementen perfekt ist. Einige sind, weißt
du, richtig
ausgerichtet. Also dies ist ein Tipp auch, Sie werden mit nur einer Farbe beginnen. Das ist das beste Band, das ich dir für jedes Design geben werde. Also, wenn Sie mit Ihrem Design beginnen, versuchen Sie
nicht, fünf oder sechs Farben gleichzeitig einzuführen. Sie können hier auf diesen sind sehr einfache Bildschirme in nur mit einem Greg Farbe und verschiedenen Aktien von drei sehen. Und ich benutze nur einen, um auf blauer Farbe oder ihn hier zu sehen. Ich benutze eine lila blaue Farbe und Sie können sehen, wie gut dieser Bildschirm aussieht OK Also halten Sie diese Schritte in Ihrem Kopf. Und, ah, wenn Sie Fragen haben, um mich zu stellen, gehen
wir zur nächsten Lektion, die Ihre Aufgabe sein wird.
33. Das Skizzieren von ersten Design-Ideen im Block Level: Okay, heute. Was wir tun werden, ist, dass wir ein Block-Level-Design mit Stift oder Papier erstellen, oder ich habe diese wenigen Textmarker hier drüben bei mir. Einer ist dieser Sharpie, oder man kann den Marker ein wenig sagen. Schlechter Marker. Dann haben wir das. Sie können auch diese Gelstifte verwenden, die etwas dunkler sind. Und Sie können auch nur defensiv auf dieser Art von Papier verwenden. Okay, was ich getan habe, ist,
dass ich es im Schlepptau gefaltet habe. Sehen? Falten, wie Sie hier sehen können. Das wird also ein Bildschirm, eine
zweite Haut und ihre Haut sein . Sie können sie trennen, nachdem Sie Freude zeichnen. OK, so der Vorteil von Bleistift ist, dass Sie es viele Male zeichnen können und Sie es mit dieser
Reserve entfernen können . Und so fangen wir an. Also zuerst werde ich tun oder verwenden. Ich werde nur meinen Bleistift verwenden, um diese Block-Level-Elemente zu zeichnen. Das wird also unser Logo sein. Glauben Sie nicht, dass sie kein großer Reißverschluss Faktor Tag sind. Es sieht nicht sehr gut aus. Okay. Und dann haben wir diesen extra Look hier. Okay. Okay, dann müssen wir hier drüben auf Felder. Das ist das Gleiche, das ich auch werde. Dies ist ein Anmeldebildschirm, den Sie hier sehen können. Also werden wir bleiben. Details überhört. Okay, also können wir so etwas haben, dann wird das ein zweites Feld sein. Das wird unser Burton sein. Okay, also stellen Sie sicher, dass die Texturen in der Mitte so sind. Okay, also haben wir unsere Elemente gesetzt. Nun, das ist Passwort vergessen. Tust du das? Vielleicht so etwas. Dann haben wir hier drüben. Melden Sie sich an. Also hier haben wir die Anmeldung. Okay? Jetzt haben wir unsere erste gebaut, wir können auf diesem Layout viel handeln. Wie können wir unser Logo hier drüben haben und dann den Begrüßungstext hier drüben. Es gibt so etwas. Vielleicht ein paar Statistiken. Wir wollen das so etwas zeigen, etwas wie dieses. Vielleicht ein paar Elemente hier drüben. Okay, dann können wir dieses,
äh,
wieder haben äh, , diesen Logan und das wieder, dieses Spotswood-Feld. Dann haben wir diesen Button können wir auch über Knopf hier drüben haben und vergessen Passwort-Feld hier
drüben. Okay. So können Sie sehen, wie dieses Layout anders ist. Es gibt hier keine Titel. Sie werden hier drin sein. Ok, so
etwas. Vielleicht werden wir einige Symbole hier auf diesen Feldern verwenden, und das wird über Button sein. Also lasst uns hier etwas Text benutzen. Und dann haben wir dieses Schild hier drüben, okay? So können wir einen anderen Knopf haben
, der ein bisschen anders sein wird. Das wird vorbei sein. Melde dich jetzt an, aber okay. So können Sie sehen, dass diese beiden Entlassungen völlig anders sind. Okay, Sie können hier drüben sehen, wie ich die gezeichnet habe. Wenn Sie teilen möchten, können
Sie sie wie folgt teilen. So wie das ist, mach sie nicht sehr hübsch. Wir gehen nur auf die Zehe. Füllen Sie es aus, dass dies ein Bild sein wird. Okay, ein anderer Weg ist, dass Sie jeden Highlighter wie diesen verwenden werden. Ich benutze diese blaue Farbe, und was ich tun werde, ist, dass ich nur die Tasten hervorheben werde. Das wird also mein Knopf sein. Und das wird auch meinen Knopf geben, okay. Und ah, was ich normalerweise mache, ist, dass ich einen anderen Mörder wie diesen Gelb benutze, um die Textlinks hervorzuheben oder so
etwas. Als wäre das ein Link. Also werde ich Gelb dafür verwenden. Okay, also diese Art von Dingen. Wenn dieser also verknüpft ist, kann
ich auch meine Gelstifte verwenden, um so etwas hervorzuheben. Okay, vielleicht ist dies ein Feld Eingabefeld, also werde ich einige Highlights verwenden. 100. Äh, so wie das. Okay. So können Sie sehen, wie einfach und schnell. Wir waren einfach total auf der gleichen Seite. Okay, vielleicht brauchen wir einige Bedingungen oder
so etwas für eine andere Iteration. Vielleicht haben wir etwas hier drüben,
eines,das er mehr gemeint hat. Vielleicht haben wir etwas hier drüben,
eines, So können Sie hier sehen. Wir haben hier mehr Elemente. Vielleicht haben wir Bedingungen. Oder vielleicht helfen oder so etwas. Also hier haben wir mehr. Lassen Sie mich bewegen. Das hier. Wir haben mehr Gegenstände auf einem Bildschirm, und hier haben wir weniger Artikel. Sie müssen also sicherstellen, dass diese Layout-Hilfe uns helfen wird zu entscheiden, was
wir eine Stunde Markup oder Drahtrahmen verwenden werden. Okay, also werden diese sehr weniger Details sein. Gar kein Detail. Nur die Platzhalter für alle Elemente. Okay, Sie können sehen, dass ich nur zwei Farben verwendet habe. Und wenn Sie möchten, können
Sie diese Art von Gelatine Zehenhighlight verwenden. Verschiedene Links wie dieses ist Passwort. Also werde ich es einfach unterstreichen. Vergessen Sie Ihr Passwort. Es ist ein Link. Also werde ich es einfach unterstreichen. So etwas. Sie können auch diese Sharpie Zehe verwenden. Markieren Sie es. Vielleicht will ich das ist ein Schatten. So etwas. Außerdem werde
ich hier etwas Schatten setzen, dass es animiert ist. Es ist wichtig. Also das sind die Details, die in Ihrem,
ähm,
Leute Block Level Design sein werden ähm, . Okay. Damit Sie sehen können, dass ich wirklich draußen war. Sie können viele Layouts entscheiden. Dieser Bildschirm ist sehr einfach. Wir haben hier nur wenige elementare Elemente, also wenn wir zu viele Elemente haben, wie vielleicht 10 Elemente hier drüben, können
wir zu einem anderen Layout wechseln. So können Sie eine Menge von Leo's schnell mit nur Stift und Papier und einigen anderen Markern oder vielleicht Textmarker wie diese erstellen. Okay, also lass mich dir noch eine Sache zeigen, wie du hier drüben sehen kannst. Das ist der Prototyp unseres Volkes, der auf den Fuß ging. Diskutieren Sie in der nächsten Lektion und Halle schwächen. Brechen Sie das hier. Das sind also die vier Schritte. Wann immer Sie mit dem Entwerfen oder Lösen eines Problems entworfenen Problems oder einer App die
Sie erstellen, lösen Sie Probleme mit der Benutzererfahrung. Okay,
also, um diese Probleme zu lösen, wirst
du diese Papierprototypen umschalten. Sie können hier sehen, wir haben diesen Anstieg in der Zahl von diesem Bildschirm. Das ist also die Nummer eins. Bildschirm unser Dashboard eso Ich habe dieses verwendet. Okay, in der nächsten Lektion werden
wir so etwas entwerfen. Wir gehen Zehe, erstellen einige weitere Details für diesen Bildschirm und versichern Ihnen, dass Sie verwenden können setzen Papier Prototypen Zehe, testen Sie es mit Ihren Anwendungen. Das wird also Ihre erste sein, die Sie für Schritt sehen können. Wenn Sie keine Papierprototypen verwenden, dann werden Sie zu Adobe X'd sagen, um die gleichen Prototypen zu erstellen. Und Sie können klicken,
klicken Sie auf anwendbare oder interaktive Prototypen, um besser zu werden und Urteil sind sehen, was ihre Benutzer über diese App denken oder wie sie sich mit diesem Prototyp verhalten. Okay, das war's
also. Du brauchst nur wenige Dinge wie diesen Gelstift und dieses Quecksilber und diesen Bleistift. Und das ist alles. Ein Textmarker, wenn Gelstift und ein Bleistift. Und Sie können diese Art von Block-Layouts erstellen mehrere Layouts sofort. Nun, in der nächsten Lektion, gehen
wir zur nächsten Lektion über, in der wir diskutieren, wie die detaillierten,
diese Art von detaillierten Papierprototypen entworfen werden. Gehen wir also zur nächsten Lektion über.
34. Erste Paper – Details hinzufügen: Ok. Nun, in dieser Lektion, werden
wir mit der Detaillierung dieses Papierblock-Layouts beginnen, und wir werden diesen kreativen Ich Rahmen statischen Drahtrahmen verwenden, alles, was Sie über
Rahmen im Schlepptau verwenden können . Prototyp-Papier-Prototyp. Also, was wir tun werden, ist jetzt, dass wir ihre Titel oder Text hier drüben benutzen. Okay, also werde ich so etwas benutzen und es ein Logo nennen. Okay, dann werden wir einen Text benutzen. Willkommen, sn oder so etwas. Das ist also ein willkommener Text. Dann werden wir hier Textfelder wie dieses ein und zwei verwenden,
und ich werde vielleicht Bleistift hier verwenden, um ein großartiges Ext-Login und Passwort zu zeigen. Okay, also haben wir diesen Punkt erreicht, und dann benutzen wir einen Knopf. Also mal sehen, dass wir uns entschieden haben, diesen hier zu benutzen. Loggen Sie sich ein. Ok. Und hier haben wir Gerichtshof-Chef-Arbeit. Okay, also haben wir dieses Layout benutzt, und dann können wir so etwas verwenden. Uh, hab kein Zählzeichen. Also haben wir unsere Elemente angelegt, und jetzt werden wir den gleichen Textmarker verwenden, um unsere Tasten s hervorzuheben . Besser, wir haben es. Einer von ihnen. Und jetzt werde ich dieses rote Gel Pinto verwenden Sicher, dass dies ein Link sein wird. OK, Sie können dies verwenden oder Sie können einfach diese verwenden Diese schwarze Hilfe im Schlepptau Markieren Sie es so . Das wird also ein Link sein. Also hier haben wir alles angelegt. Sie können auch diese Sharpie sind Marker verwenden, um diese Fehde wie diese K auch so hervorzuheben . Und wenn Sie möchten, können
Sie dieses Logo auch ein wenig hervorheben, wenn Sie gehen möchten. Aber das ist, wie es geht toe Schauen Sie jetzt, damit Sie hier sehen können, haben wir die einfache
Block-Technik und hier haben wir unsere Drahtrahmen oder Menschen Prototyp oder Papier Design Skizzen für Aufbau eines Papierprototypen. Okay, so können Sie mehrere Bildschirme bauen, wie ich groß für diese App habe. Dies ist im Grunde eine Ticketing App und ich denke, ich möchte nicht in zu viele Details gehen, aber so werden Sie es bauen. Also im Grunde, was ich benutze, sind ein paar Farben, eine Farbe für Links markiert meine primäre zweite Reaktion. Und das sind meine Familie oder ich in Schaltflächen auf meinem Bildschirm. Dies sind primäre Aktionen, die der Benutzer auf dieser Schaltfläche ausführen muss. Ok? In auf dem Bildschirm. Das sind also ein paar Dinge, die ich Ihnen wirklich zeigen wollte, bevor Sie in Adobe X'd gehen, weil dies die Planungsphase von jedem Design ist, ist
es wichtiger als das Erstellen eines sehr schön aussehenden oder sehr brillanten Designs oder
Pixelperfektes Design in Adobe X'd. Das ist also alles von mir. Und ich hoffe, Sie haben diese Lektion genossen. Wenn Sie Fragen haben, um mich zu stellen, werde
ich Ihnen eine Aufgabe Toe geben, eine Person
erstellen, einen Prototyp oder Papierblock Design, und einen detaillierten Drahtrahmen aus dem gleichen Design und machen ein Bild und eingereicht. Okay, in der nächsten Lektion gehen
wir zur Periode dieser Aufgabe. Wenn Sie also Fragen haben, die Sie mir stellen müssen, gehen
wir zur nächsten Lektion über.
35. Vertikale Horizontal Prototypes: Okay, in dieser Lektion werden
wir über diese fünf Dinge sprechen, die Papierprototypen verwendet werden. Dann gehen wir auf horizontale Prototypen. Was sind vertikale Prototyp STI Prototyp und lokale perfekte Typ. Wir werden all das abdecken. Ich werde Ihnen die Beispiele geben. Und zuerst gehen wir durch den Papierprototyp. Nein, Papierprototypen sind der beste und einfachste Weg und der billigste Weg, um jeden Prototyp
im Sport zu erstellen . Wie Sie sehen können, hier ist ein Papier für eine Abschreibung. Verschiedene Bildschirme aus Buchungsprozess Von dieser Zug-App können Sie hier sehen. Dies ist der Anmeldebildschirm. Dies ist ein Dashboard, das reserviert wird. Und dann haben wir die Plätze und Träume und dann sehen wir Details, die Sie hier sehen können. Dann haben wir noch ein paar weitere Ausfüllen der Details, Buchungsdetails und so weiter und so weiter. Okay, also was ist der horizontale Prototyp? Ok, also werde ich Ihnen ein Beispiel geben, wenn ich diese Papierprototypen verwende, die ich hier drüben
horizontalen Prototypen habe . Wie der Name schon sagt, wird
es in diese Richtung gehen. Richtung bedeutet, dass, wenn ich ah Horace unter Prototyp baue, können Sie hier oben dieses
Armaturenbrett sehen . Wenn ich einen horizontalen Prototyp für diesen Vorratsbildschirm baue, gibt es hier vier interaktive Elemente. Vielleicht dieser Kampf. Also, was ich tun werde, ist, wenn der Benutzer hier drüben klickt, sie werde ich diese vier und fünf weitere Bildschirme entwerfen, die mit
diesem Statut Buch verknüpft werden . Aber auf der anderen Seite, Ich werde nicht Zehe erstellen in Tiefe Buchungsprozess. Also, wenn jemand auf das Buch
klickt, die Teilnehmer gehen, um den nächsten Bildschirm für die Buchung wie dieser einen Blick Plan zu sehen. Aber nachdem er hier klickt, wird nicht zu einem der Bildschirm gehen, wird er zurückgehen, um zu fangen. Für. Warum? Weil wir die detaillierte Arbeit nicht durch diese Funktionen hier drüben testen. Okay, also, äh, also wird das unser Herzzentrums-Prototyp sein. Sehr begrenzt in der Zerstörung. Es wird vor allem die Informationen,
Architektur oder die Navigation von Ihrer Website abdecken . Also, wenn Sie haben, wie, 10 Kategorien, Sie gehen Zehe, erstellen 10 Seiten, und Benutzer wird nur auf jedem von ihnen tippen. Besuchen Sie diese Seite. Okay, also hier geht es um horizontalen Prototyp. Kein vertikaler Prototyp. Das wird in der Tiefe sein. So senkrecht bedeutet, dass du tief in den Boden hinuntergehst. Okay, also gerade jetzt, wenn ich Ihnen den vertikalen Prototyp für die Buchung von Tickets zeige, so wird es zu treffen oder
es wird spezifisch sein Zehe ein Merkmal einer Funktion von Ihrem Apfel. Unsere Webseite. Okay, also werde ich einen vertikalen Prototyp für Buchtickets bauen, was ich hier gemacht habe. Wenn Sie also auf Buchticker klicken, wird
dies der nächste Bildschirm Buchungsplan sein. Sie werden tot und Ihre Route nachlassen, und Sie werden die Sitzplatzverfügbarkeit sehen. Ok. Und als Nächstes wirst
du die Belagerung in Zügen sehen. Dann gehst du, um die Details runter zu bekommen. Siehe Details für mehr Expansion mehr von dieser Sorte, die Sie ausgewählt haben, als Sie auf
dieses Buch klicken können , um jetzt zu erhalten. Und Sie gehen zu diesen Buchungsdetails. Okay,
also, nachdem Sie Ihre Daten ausgewählt haben, gehen
Sie zu mir, zeigen Ihnen diese letzte Königin, die ich
Zahlungsoptionen entworfen habe . Sie haben Rückzahlungsoptionen. Sie wählen eine aus ihnen, es wird hervorgehoben und Sie wählen Diese Schaltfläche wird sich ändern. Favorit ubl diese Karte und Sie werden hier tippen und Ihre Zahlung erfolgt. OK, also ist dies ein Beispiel aus dem vertikalen Prototyp. Kein Prototyp. Wie der Name schon sagt, können
Sie hier drüben sehen. Dies ist horizontal und das ist vertikal. In den T-Prototypen werden
wir also horizontale und vertikale Prototypen mischen. Also lassen Sie mich Ihnen hier zeigen, wir haben wie, hier haben wir diesen Login-Bildschirm. Lassen Sie mich es Ihnen zeigen. Hier haben wir den Slogan Skin für die gleiche App Drain Booking App. Und wenn Sie zum steileren Typ gehen, wenn ich Justiz einloggen Bildschirm und diesen Anmeldebildschirm bauen, wird
es mein d Prototyp sein. Weil ich bin, kann ich diese beiden Bildschirme horizontal sehen und dann kann ich zu diesem Bildschirm gehen Diese ein ok, auch, wenn Sie vier verschiedene Bildschirme für Bildschirme dafür bauen,
diese drei Funktionen und Gruppe gehen ins Detail auf Lee. Das hier. Ok. Trotzdem wird
es Ihr D-Prototyp sein. Also, äh, ein Merkmal, das Sie in der Tiefe testen werden, andere Sie gehen Fuß. Du wirst nicht eingehend testen. Es wird ein oder zwei Bildschirme für jeden von ihnen sein. Wenn Okay, dann kommen wir zu diesem lokalen Prototyp. Ok? Was der lokale Prototyp bedeutet, ist, dass wir einen Test machen. Nur einen bestimmten Bereich außerhalb Ihrer App. Okay, also vielleicht, wenn wir diese
haben, haben, vergessen Passwort-Funktion. Ok? Wir möchten verschiedene Lay Stunden oder verschiedene Arbeitsabläufe von dieser vergessen
Passwort-Funktion testen . Wir werden das nur testen. Okay, also vielleicht, wenn ich darauf tippe, werde ich der nächste Bildschirm sein. Geben Sie Ihre E-Mail ein, um Ihr Passwort zu erhalten. Das ist also meine erste Idee. Und wenn ich es noch einmal tippe, oder vielleicht in der nächsten Prototyp-Idee, wenn ich hier tippe, komme
ich zu einem Bildschirm, wo ich einfach meinen mobilen Emitter setzen. Okay, also vielleicht dieses vier Guard Passwort. Es fragte mich nach Handynummer in einem Prototyp in einem anderen. Es bat mich um eine E-Mail in einem anderen. Es ruft mich auf meinem Handy an. Okay, das sind also verschiedene Optionen. Sie können es versuchen. Wenn Sie sich also auf nur ein Element in Ihrer gesamten App auf einem einzigen
Bildschirm konzentrieren , werden
Sie diesen lokalen Prototyp verwenden. So ist alles über Papierprototypen, horizontale vertikale de Prototyp, lokale Prototyp, All diese Typen und wie Sie Papierprototyp verwenden werden. Also, was wir normalerweise tun, ist, dass wir dem Benutzer den ersten Bildschirm zeigen und dieser wird versteckt werden. Diese Bildschirme nächsten Bildschirme werden wieder sein. Lassen Sie mich Ihnen diese drei Dinge zeigen. Ich werde so etwas wie Thetis machen. OK, also werde ich diese Bildschirme verstecken und ich werde meinem Benutzer diesen Bildschirm zeigen, nicht diesen. Okay, das ist
also Logo-Willkommenstext. Okay, dein Handynummer-Passwort
eingegeben, und ich will ihn oder Herzzehe. Denken Sie laut nach, bedeutet, dass sie sagen werden, OK, ich möchte meine Handynummer hier setzen. Ich will meinen Pass hier drüben ablegen und dann werde ich die Presse einloggen. Okay, danach gehe
ich auf die Zehe,
schiebe es
so , und ich werde ihnen zeigen, dass dieser Versteck, auf den es wert ist, auf sie zugleitet. Und sobald sie dieses Dashboard sehen, werden
sie sich darauf konzentrieren. Okay, das sind meine Bücher. Sie sind abhängig Tickets. Das sind meine stornierten Tickets. Okay, also will ich O-Ticket. Ok. Davor möchte
ich sicherstellen, dass mein Benutzer,
sie weiß, dass ich bin, ich will schwer ein paar Tickets zu buchen. Okay, also lass mich diesen Tag hier drüben entfernen, um dir die Spitze hier zu zeigen. Das ist Pakistan. Eisenbahnen helfen und Profil. Okay, also, äh hallo, Essen. Und das sind das ist dein Dashboard. Alle Ihre gebuchten und stornierten und ausstehenden Bagger, und dann haben Sie nur vier Dinge, die Sie tun können. Also will ich harten Protest. Nur dieses Reservierungsticket Land. Okay, auch, Sie können hier drüben sehen. Ich habe die Nummer. Sie können sehen, dass dies Null ist, und das ist eins. Das ist nur, um sicherzustellen, dass ich meinen ganzen Prototyp nicht verliere und ich sie nicht verwirre. Und dann muss ich sie, weißt
du, kombinieren. Ich werde verwirrt. Ok, noch
eine Sache, die Sie sehen können, ich habe das aufgezeichnet. Das ist sehr einfach. In Menschen Prototypen. Sie können einfach ein anderes Papier verwenden und es mit dem ersten Bildschirm auf dem gewünschten Teil verbinden. Wenn Sie nur Jane wollen, können Sie
diese Knöpfe abreißen und Sie können ein weiteres Stück von Menschen befestigen. Okay, also denke ich, es geht um Papierprototypen auf horizontaler Paradiesarbeit, vertikale Prototypen. Ich denke, wir haben sie alle abgedeckt. Und gehen wir zur nächsten Lektion über.
36. Stufe der Fidelity und Prototypen: Ok. Nun, in dieser Lektion, werden
wir mit der Detaillierung dieses Papierblock-Layouts beginnen, und wir werden diesen kreativen Ich Rahmen statischen Drahtrahmen verwenden, alles, was Sie über
Rahmen im Schlepptau verwenden können . Prototyp-Papier-Prototyp. Also, was wir tun werden, ist jetzt, dass wir ihre Titel oder Text hier drüben benutzen. Okay, also werde ich so etwas benutzen und es ein Logo nennen. Okay, dann werden wir einen Text benutzen. Willkommen, sn oder so etwas. Das ist also ein willkommener Text. Dann werden wir hier Textfelder wie dieses ein und zwei verwenden,
und ich werde vielleicht Bleistift hier verwenden, um ein großartiges Ext-Login und Passwort zu zeigen. Okay, also haben wir diesen Punkt erreicht, und dann benutzen wir einen Knopf. Also mal sehen, dass wir uns entschieden haben, diesen hier zu benutzen. Loggen Sie sich ein. Ok. Und hier haben wir Gerichtshof-Boss-Arbeit. Okay, also haben wir dieses Layout benutzt, und dann können wir so etwas verwenden. Uh, hab kein Zählzeichen. Also haben wir unsere Elemente angelegt, und jetzt werden wir den gleichen Textmarker verwenden, um unsere Tasten s hervorzuheben . Besser, wir haben es. Einer von ihnen. Und jetzt werde ich dieses rote Gel Pinto verwenden Sicher, dass dies ein Link sein wird. OK, Sie können dies verwenden oder Sie können einfach diese verwenden Diese schwarze Hilfe im Schlepptau Markieren Sie es so . Das wird also ein Link sein. Also hier haben wir alles angelegt. Sie können auch diese Sharpie sind Marker verwenden, um diese Fehde wie diese K auch so hervorzuheben . Und wenn Sie möchten, können
Sie dieses Logo auch ein wenig hervorheben, wenn Sie gehen möchten. Aber das ist, wie es geht toe Schauen Sie jetzt, damit Sie hier sehen können, haben wir die einfache
Block-Technik und hier haben wir unsere Drahtrahmen oder Menschen Prototyp oder Papier Design Skizzen für Aufbau eines Papierprototypen. Okay, so können Sie mehrere Bildschirme bauen, wie ich groß für diese App habe. Dies ist im Grunde eine Ticketing App und ich denke, ich möchte nicht in zu viele Details gehen, aber so werden Sie es bauen. Also im Grunde, was ich benutze, sind ein paar Farben, eine Farbe für Links markiert meine erste zweite Reaktion. Und das sind meine Familie oder ich in Schaltflächen auf meinem Bildschirm. Dies sind primäre Aktionen, die der Benutzer auf dieser Schaltfläche ausführen muss. Ok? In auf dem Bildschirm. Das sind also ein paar Dinge, die ich Ihnen wirklich zeigen wollte, bevor Sie in Adobe X'd gehen, weil dies die Planungsphase von jedem Design ist, ist
es wichtiger als das Erstellen eines sehr schön aussehenden oder sehr brillanten Designs oder
Pixelperfektes Design in Adobe X'd. Das ist also alles von mir. Und ich hoffe, Sie haben diese Lektion genossen. Wenn Sie Fragen haben, um mich zu stellen, werde
ich Ihnen eine Aufgabe Toe geben, eine Person
erstellen, einen Prototyp oder Papierblock Design, und einen detaillierten Drahtrahmen aus dem gleichen Design und machen ein Bild und eingereicht. Okay, in der nächsten Lektion gehen
wir zur Periode dieser Aufgabe. Wenn Sie also Fragen haben, die Sie mir stellen müssen, gehen
wir mit der nächsten Lektion über.
37. So fügst du deine Block in XD hinzu: Ok. In der letzten Lektion
haben wir dieses Block-Level-Design gemacht,
und ich habe Ihnen eine Menge Papierprototypen und verschiedene Typen von Prototypen und
alles über Prototyping gezeigt. In der letzten Lektion haben wir dieses Block-Level-Design gemacht, und ich habe Ihnen eine Menge Papierprototypen und verschiedene Typen von Prototypen und
alles über Prototyping gezeigt Okay, jetzt gehen wir den nächsten Schritt. Okay, also ist der nächste Schritt in jeder Entwurfsphase schnell. Sie haben mit dem Block-Level-Design begonnen, und der nächste Schritt wird sein, dass wir Details hinzufügen. Es ist genau wie, wenn man einen Maler sieht, wenn er anfängt, etwas auf seiner Leinwand zu malen. Was sie tut, ist, dass sie nur ein paar Farben hier und da setzen wird. Großmörder, um nur die Form von ihrem Gemälde zu bekommen oder so etwas. Okay, dann werden sie anfangen, Details hinzuzufügen. Okay, so funktionieren die Skizzen. Selbst wenn Sie versuchen, etwas zu skizzieren, werden
Sie die erste Skizze gehen. Sehr verlieren. Was nicht zu sehr aussieht wie ein Cardone oder etwas, das man anfängt, es zu verfeinern. Und am Ende sieht
es wirklich toll aus. Ok? Ähnlich, in Web-Design, mobile App, Designer, User Experience, entwerfen Sie die ganze Physik off User Experience Design von Informationen von Benutzern, Benutzerinterviews, alles, was Sie hinzufügen Details, Schritt für Schritt. Wenn wir also mit dem nächsten Schritt fortfahren, werden
wir weitere Details hinzufügen. Okay, was wir jetzt tun können, ist, dass wir einen einzigen Killer-Feuerrahmen erschaffen können. Okay, was ich mit einer einzigen Farbe meine, ist, dass ich für jede Aktion nur eine einzige Farbe verwenden werde . Ok? Also anstatt diese auf diesem Telefon Block Telefon zu ersetzen, was wir tun werden, ist, dass wir es ersetzen, Zehe vier, vielleicht Quelle. Ok. Also werde ich das benutzen. Keine NATO schickt. Okay, was ich tun werde, ist, dass ich hinzufügen werde,
wie,eine Person
willkommen zu wie, heißen, okay? So etwas. Also wird es hier drüben sein, und dann gehen wir auch zu Fuß. Sagen Sie dem Benutzer, dass dies das Logo sein wird. Okay, also werden wir hier eine weitere Textebene hinzufügen. Es wird sagen, Logo. Okay, was wir versuchen zu tun, ist, dass wir ein paar weitere Details hinzufügen. Tun Sie es. Okay, das wird
also Logo sein, als dies ein Willkommenstext ist. Dann wird das unser Lasst uns diese löschen und ich werde das duplizieren, weil es mehr Sinn macht. Und so ist es einfacher. Ich übergebe meinen Archie- oder Wahlschlüssel. Das wird ein Bosswort sein. Das wird lange im Menschen dauern. Machen Sie also klarer, dass E-Mails für Benutzer leichter zu merken sind. Also werden wir hier drüben E-Mail benutzen, K. Also werden
wir auch ein paar,
ähm, ähm, lasst uns das ändern. Also werden wir auch einige visuelle Hinweise verwenden, wie dies ist wichtiger Ausmaß, dies wird ein bisschen kleiner sein als diese. Also werde ich, um, 24. und hier werde ich auch 20 verwenden. Dann hier drüben gehen wir wieder zu Er war zwei Naht wie dieser Befehl Verschiebung Front Rekord um es zu machen. Ich bringe es nach vorne, und das wird kein Passwort sein. Es wird,
ähm,
Protokollierung sein ähm, . Nein. Oh, sind Zugang. Okay, also mach es einfacher. Loggen Sie sich ein. Nein. Okay, das ist
also das macht Bewegungen, und dann werden wir beide auswählen, indem wir Shift drücken, und ich werde Zehendrücken Shift. Ich m so dass es für die Zentrierung es in der horizontalen Weise und eigenen Mac sehen, Sie gehen, um Befehl Shift drücken? Si. OK, das sind
also die Tastenkombinationen. Ich mache es immer wieder, damit Sie sich dann leicht daran erinnern können. Hier haben wir für Gott, dein Bosswort. Lass Shing sein Telefon Zeh. Keine Notwendigkeit toe Was ist die Wurzel des Sinnes und wir haben es. Wir werden es nicht ziehen lassen. Ich werde nur 20 große Oezil sein und, äh, lass es uns in der Mitte ausrichten. Ok, Koch. Sehen Sie? Sieht keine Linie in der Mitte aus. Vielleicht ist alles andere nicht ausgerichtet. Also sief sie in die für die Fenster und ich werde es hier so ausrichten. Er sieht toll aus. Und jetzt werden wir Ah hinzufügen, sehr einfache Details hier drüben, die angemeldet ist. Okay, also melde dich weniger Imo an, behalte diese Linie und ich werde es hier drüben replizieren. Unterschreiben. Oh, pendeln. Neues Konto. Stellen Sie dem Benutzer immer Ihre Aussage sehr klar, dass dies eine separate
Aktion sein wird . Okay, also werde ich es so behalten. Jetzt werde ich das auf der Leitung benutzen. Das sieht ein bisschen veer aus. Also gehe ich mit den Zeh. Verwenden Sie dieselbe Zeile. Mal sehen, was das Urteil von diesem ist es Ah, bis 71 Pixel breit. Also machen wir das noch am selben Tag. Und dann werden wir diese so ausrichten. Ich werde sie gruppieren, Commander Control G-Schicht, siehst du? Und es wird in der Mitte sein. Okay, jetzt sehen wir, ob alles andere in der Mitte ist. Lassen Sie uns die Zehe gruppieren, damit es nicht gehen wird. Und das wird unsere Anmeldegruppe sein. Lasst uns bewegen. Bewegen Sie alles in der Mitte. Davor, Wir können auch gruppieren diese beiden jetzt sieht es ausgewogen und alles ist in der Mitte. Das wollten wir schaffen. Jetzt scheint alles in der Mitte. Das wollten wir schaffen. Jetzt ich Was ich möchte, dass Sie tun, ist, dass Sie einen Anmeldebildschirm ähnlich
diesem in der Zuweisung erstellen . Also werde ich eine weitere Aufgabe erstellen. Dies ist der nächste Schritt. Das sind im Grunde unsere Drahtrahmen. Sie können sie auch verwenden, um zwei Bildschirme zu verbinden und wenn Sie einen einfachen Prototyp
Protest mit Ihren Benutzern erstellen möchten . Dies wird ein niedriges Niveau oder niedrige Fruchtbarkeit sein oder, Ich denke, Fidelity Drahtrahmen oder Prototyp gemacht. Also keine Sorge, Sie können leicht bestimmt, weil Ihre Aktion sichtbar ist. Das ist ein Burton. Okay, ich hoffe, Sie haben diese Lektion genossen. Wenn Sie Fragen haben, die Sie mir stellen müssen, gehen
wir zum nächsten.
38. Die Verwendung von Ui Designmustern zum Thema Design: in diesem. Hören Sie, ich werde Ihnen zwei meine Geheimnisse teilen, die Ihnen helfen werden, schneller und besser zu entwerfen. Okay, also diese beiden Suchenden, die ich in dieser Lektion enthüllen werde, und wir werden sie entwerfen, um Bildschirme in dieser Lektion zu registrieren, und diese werden der erste Schritt beim Aufbau des Prototyps sein. Okay, im nächsten Abschnitt werden
wir eigentlich die medizinische App entwerfen, verbessern und entwerfen, die ich Ihnen am Anfang gezeigt habe. Und jetzt werde
ich diesen Abschnitt mit dieser Übung beenden,
und ich hoffe, Sie werden es genießen. Okay, das erste Geheimnis ist, dass also, wenn Sie für so etwas entwerfen und
Sie waren , versuchen, etwas zu verbessern. Unser Design oder Versuch, eine Lösung zu entwickeln. Sie müssen Zehe verwenden, so weniger Farben wie möglich. Ok? Also benutze einfach eine Farbe, was meine Empfehlung ist. Und ich benutze das immer. Sie können sehen, dies sind diese beiden Bildschirme wirklich erstellen aussehen. Sogar ich benutze nur eine Farbe. Ok? Und diese eine Farbe ist diese blaue Farbe. So können Sie sehen, dass dies Ihren Prozess leicht vereinfachen kann. Und Sie können so etwas leicht erstellen. Okay, Nun, das zweite Geheimnis ist, dass immer versuchen, bauen bereits Patron-Bibliotheken oder
Grafik-Bibliotheken zu verwenden . Aber Sie können den Prozess beschleunigen, wie Sie sehen können. Was? Hier. Das ist die Tastatur. Ich habe es nicht entworfen, denn wenn ich versucht habe, es selbst zu entwerfen
,
bin ich
vielleicht nicht in der Lage,es , , zu entwerfen. diese Tastatur. Okay, was ich getan habe, ist, dass ich dieses Schlüsselbrett aus der Bibliothek habe, was ich dir in einer Sekunde zeigen werde, und auch die Stoppleiste. Sie können sehen, dass dies von meinem US-Standard in der OPEC De Library stammt. Sie haben kostenlos gebaut, aber Sie können kostenlos auf Apples Website herunterladen und auch diese und auch diesen Bereich an der Spitze. Dies wird auch von der gleichen Bibliothek begrenzt. Okay, also diese Bibliotheken Musterbibliotheken, Auto-Styx-Guides. Sie werden uns helfen, unsere Arbeit aufzubauen und zu beschleunigen. Okay, also versuchen Sie nicht, Symbole wie diese zu erstellen. Sind das hier diese Batterie? Ich rufe dich an. Es wird Ihren Designprozentsatz verlangsamen. Und das wird Ihnen nicht in Ihrem Berufsleben helfen. Ok? Normalerweise, was ich tue, ist, dass ich normalerweise kaufen Große sind cool aussehende Symbole aus kreativen Markt oder anderen Website, weil dies wird mir helfen, meine Designs zu halten und sie zu halten, wissen
Sie, machen sie sehr schnell. Okay, was wir brauchen ist, dass wir ein schnelles Design brauchen. Wir wollen nicht verschwenden, wie Dan Astor eine Ikone entworfen hat. Okay, also ist das ganze Gerede über zwei Geheimnisse, dass Sie zuerst Bibliotheken verwenden werden, die
in Bibliotheken gebaut sind , die bereits Design-Bibliotheken gebaut wurden, Patron-Bibliotheken, Patron-Bibliotheken,
die für unsere Designs ausgeliehen wurden. Dies sind Standardbibliotheken. Und das sind auch Standard-rus-Tastaturen. Okay, also entwerfen wir Zeh. Sind Ihre Bildschirme im Grunde Also dies wird Ihnen helfen, ob Sie im Fotoshop oder
Adobe X'd oder Skizze entwerfen . Diese eingebauten Bibliotheken sind Sie
, wie es normalerweise nennen sie sie normalerweise Interface Design Kinder, sie werden Ihnen viel helfen. Okay, also werde ich Ihnen die Ressourcen zeigen, die wir für diese Übung brauchen. Wie ich. Gehe zu meinem Browser. Ok. Nun, das erste, was wir brauchen, ist, wenn Sie unter Windows sind, das erste, was wir brauchen, ist dieser San Francisco Ford, das ist ah, fühlen Ford von uns, ABS und auf Mac, es ist bereits installiert. Wenn Sie auf, ähm, Neueste Mac Frage und zweite Sache, Sie können es von hier herunterladen. Okay, so können Sie diesen Download drücken, herunterladen, zip, und installieren Sie die PDF-Version, nicht die offene wahre Tauchgang. Okay, lass mich es dir zeigen. Okay, also hier habe ich diesen Ordner erwartet, den ich heruntergeladen habe, die s f pro Telefon San Francisco beweisen in San Francisco kompakt, die für Apple-Uhren ist, denke
ich. Okay, also San Francisco Pro, ich bin offen und sie haben eine offene Art von wahren Typ. Versucht. Installieren Sie diese eine TDF. Okay, das wird genug sein. Wählen Sie also alle aus, installieren Sie sie. Und wir sind ein wenig wie ich mit Ihnen teilen die U-Arbeiter, die Sie herunterladen müssen, bevor mit dieser Übung beginnen. Nun, wenn Sie zu dieser Entwicklung Kunst Apple Dot com gehen, wie Design Schrägstrich Quellen. Es gibt Ressourcen, um diese zu entwerfen, Sie wissen schon, ich uns 11. Im Moment ist die Version 11. Ich uns 11 Schnittstelle. Sie können sehen, dass wir hier sind. Dies ist von menschlichen Schnittstellenrichtlinien für die Show-Datei Skizzendatei und wird X trotzt . Laden Sie diese Datei herunter und wir werden sie brauchen, wenn wir diese entwerfen. Ok? Außerdem können
Sie eine Menge finden. Andere Ressource ist, wie Sie Ihre Haare auf extra wuchs sehen können. Es gibt noch ein Kind wie dieses. Auch gibt es mit dieser Website, kostenlos von Supply dot com. Ich suche nach XDR uns. Sie können sehen, es gibt Sie auch entkommen. Sie können hier sehen, ist ein weiterer Fall, den ich wirklich mag. Stellen Sie sicher, dass es sich um Standardgrafiken Sie sind nicht ein Sie arbeiten es für bestimmte App. Sie können sehen, dass dies Standarddinge sind, die wir brauchen, wenn wir entwerfen. Wie Sie sehen können, sind das hier drüben Tastaturen. Ok. Und ah, das ist es. Bevor
Sie mit Ihrem Design beginnen, benötigen Sie mindestens dieses oder zumindest dieses. Okay, also lass keine von ihnen weg. Und um sie in einem separaten Ordner zu halten und auch zu versuchen, installieren. Wenn Sie unter Windows 10 installiert diese San Francisco Prue in San Francisco Compact. Sie können sehen, dass dies für Männer tugendhaft ist. In der nächsten Lektion werden
wir tatsächlich damit beginnen, dies zu entwerfen. Okay, also gehen wir zur nächsten Lektion über und beginnen jetzt mit der Gestaltung der Anmeldebildschirme.
39. Die Übung des Ios mit der Signup durchgängen: Okay, jetzt werden wir anfangen, das dafür zu entwerfen. Wir werden eine neue Datei öffnen und wir werden dieses iPhone 678 wählen Klicken Sie darauf. Und wir haben eine andere Akte hier drüben. Steuern oder Befehl Null, um in die maximale Ebene zu zoomen, die wir haben können. Okay, jetzt fangen wir mit der Spitze an, und dafür werden wir unser Du magst es brauchen. Okay, davor denke
ich, wir sollten unsere anderen Dinge schnell auslegen. Okay. So Rechteck DOOL Zehe bekommen einige textuelle Haare. Okay, also haben wir ein weiches Gefühl. Mal sehen, ob es in die Mitte passt. Okay, also sieht es toll aus. Okay, jetzt haben wir über SMS. Wirklich? Jetzt werden wir hier ein Label hinzufügen, und dafür werden
wir Textebene verwenden, und ich werde zu der Kraft gehen, die San Francisco sein wird. Drücken Sie also s f auf Ihrer Tastatur und Sie werden als halb Display drücken Center sehen. Wir werden den Text eines Kochs oder als ein paar Latex verwenden, was auch immer Sie wollen. Okay. Und ich werde außer Text verwenden. Und lasst uns tippen, ähm okay, also hier haben wir einen. Ah, Textfeld. Und auch, ich werde dunkel in der Grenze von diesem hier. Okay? Und so werden es zwei Pixel sein. Sieht gut aus. Okay, also haben wir ein Feld, und was wir hier tun können, ist, dass wir ein Make ein Symbol erstellen können, und es wäre, um die nächsten paar einfach gesagt, und wir können ein anderes Symbol haben, indem wir ziehen oder hier. Und Sie können sehen, dass ich zu diesem SX gewechselt habe, und da ist mein Symbol, und ich kann voran gehen und wechseln x zwei. Ähm,
möglich, so haben wir jetzt zu fühlen, und jetzt brauchen wir einen Knopf. Okay, dafür werde
ich wieder hier rüber gehen. Gehe zu diesem Rechteck-Werkzeug, und ich werde Zehe erstellen ein bisschen schwerer Knopf als dieser. Diese beiden. Ok, das sieht toll aus. Und ich werde für eine Farbe wie diese gehen, okay? Also nein, nicht die Grenze. Aber ich will die Füllung. Toby, wir werden so etwas hören. Nun, vielleicht geht es uns gut. Also werde ich diesen Mörder zu Michaela Switches hinzufügen, damit ich nicht immer wieder darauf zugreifen muss. Okay, das ist
also eine Farbe. Okay. Auch, Ich kann dieses Grab ular diese kreative Arbeit nächste Fahrzeug hinzufügen, so dass ich es immer wieder verwenden kann . Auch diese Rahmenfarbe. Das ist ein weiterer Schatten von drei. Also habe ich jetzt Baummörder, also habe ich nicht mehr Zeh, weißt
du, füge sie immer wieder hinzu. Jetzt werde ich diesen Text duplizieren, so dass Sie in diesem Lease-Panel-Symbol sehen können und Text
außerhalb dieses Symbols ist . Okay? Und Sie können auch die Steuerung drücken, sie
verschieben und sehen, wie es in der Mitte auskleidet. Ich werde es einen großen Verkauf verlagern, weil ich es so mag. Es sieht natürlicher aus. Okay, wir haben jetzt das hier drüben,
zwei Ängste, eine loggen sich ein und was wir brauchen, ist, dass wir zwei weitere Dinge brauchen. Wie vergessenes Passwort. Lass uns okay. So können Sie sehen, wenn ich es in der Nähe ziehen, die beiden fühlen sich auf es gibt eine Entfernung. Zeigt, dass jede Distanz gleich 22 Picks ist OK, also werde ich es so lassen. Okay, also denke
ich auch, dass diese, äh ich die Schule mit dem Symbol verlassen habe, das ich auf den Fuß gehe. Ändern Sie es. Ja, ich werde es schließen, wie zwei Schweine näher sind und jetzt sehen sie besser aus. Okay, das hier ein bisschen mehr nach unten zu
bewegen. Okay, das sieht
also kreativ aus. Okay, also muss der Slogan auch etwas unten sein. Okay, jetzt haben wir nur ein vergessenes Passwort und ein weiteres nächstes. OK, also als nächstes klicken Sie auf diese Kopie und ich bin es hier. Und dann, wenn die moovit und Sie sehen können, wenn ich versuche, etwas zu bezahlen, ist
es immer in der Position. OK, stellen Sie sicher, dass Ihre Distanz zwischen den beiden fähigen Elementen gut ist. Also, wenn ich auf diese tippen möchte, Sie wollen nicht, dass ich tippen Sie auch auf diese. Okay? So stellen Sie sicher, dass Ihre thes zwei Elemente sie haben guten Platz unter ihnen Zehe alot die Taps von Ihrem Tom Bouquet, so stellen Sie sicher, dass sie mindestens 44 oder 50 Pixel voneinander entfernt sind. Also muss dieser Bereich 54 Bilder oder so etwas sein. Okay, dann haben wir, ähm nein, es wird ein Link sein, und ich werde es ein bisschen mehr nach unten bewegen, damit Benutzer leicht darauf tippen können. Okay, machen Sie es
nicht näher an diese Kanten sind unten oder zu viel oben, weil Benutzer nicht auf diesen Bereich zugreifen können. Dies ist eine großartige Gegend. Wenn Sie meine User Experience Ergebnisse gesehen haben, wissen
Sie, wovon ich spreche. Also werde ich es hier so behalten, und ich werde seine Farbe ändern Zehe so blau und auch eine Linie direkt setzen. Okay, lasst uns mal sehen, was ist die Rate von dieser 1 81 und ich werde mein Zeilenwerkzeug verwenden, um eine Linie zu erstellen, die
Shift drückt . Und es ist auch 1 81 Ich werde die Farbe zu diesem Blau ändern, und das war's. Brust V. Und ich werde mich bewegen. Es geht da raus, so
etwas. Okay, jetzt siehst du, dass ich fast am meisten von meinen Gefühlen geschaffen habe. Jetzt können wir einige Schatten hier auf diesem Anmeldebildschirm hinzufügen. Der Schatten genannt. Okay, also füge ich diesen Schatten drei bei Verletzung hinzu und blasen 66 und die Farbe ist diese. Ich bin ich kann das auch benutzen und ah, ich kann es auf 20% reduzieren. So etwas. Okay, also haben wir ah hinzugefügt Schatten und ah, sind unser zwei Passwort und dieses Feld. Und Sie können sie auch außerhalb der Grenze begrüßen. Es sieht sehr schwer aus. Ich schätze schon. Ich werde das gleiche verwenden, das Sie sehen können, wenn ich dieses ändern, wird
es zu diesem reflektiert werden. Tun Sie dies ist sehr ich kann eine sehr schöne Funktion sehen. Ich möchte nicht, dass sie zu sehr hervorgehoben werden, denn im Moment ist
unsere primäre Aktion diese pathetisch. Okay,
also, wenn wir das
getan haben , lassen Sie es ein bisschen nach oben 20 bewegen. Okay, jetzt können Sie sehen, ob ich dieses Symbol bewege. Das ist die Gegend. Es wird zugänglich sein. Also, wenn ich auf diese Ecke tippen, sind auf dieses Passwort, sollte
es aktiviert werden. Okay, also das ist eine Sache, die du in Betracht ziehen musst. Sie können Ihren Entwicklern davon erzählen. Dass dies sein wird, dass dieses Loch das fähige Gebiet sein wird, sind interaktives Video. Okay, jetzt werden wir ein paar Dinge für Details von Ihnen hinzufügen, als ob es an ist. Und ich möchte, dass du uns runterlädst. Du weckst es von meinem uns und, ah, lasst uns das von hier importieren. Okay, jetzt werde ich das hier öffnen, und wir werden ein paar Dinge hierher ziehen. Okay? Also, nein, ich bin in meinen xdd-Quellen für ältere Menschen, und Sie können sehen, ob ich das angerufen habe. Das kann ich. Dies ist der Ordner, und Sie können hier sehen, ist für iPhone X, und das ist für iPhone. Also werde ich die einfache öffnen,
die für iPhone ist, und ich werde zoomen Sie es steuert Ihren Befehl. Null ein bisschen mehr. Lassen Sie uns diesen Titel hier importieren. Okay? So können Sie sehen, dass das alles drin ist. Das sind also Navigationsabfüller. Versuchen Sie, es zu verstecken und es zu zeigen. Also was wir brauchen, ist, dass wir die Symbolleiste nicht brauchen, aber wir brauchen den Zustand einen Punkt an der Spitze. Also werde ich es kopieren. Kommando und Kontrolle oder Kontrolle C. Und ich gehe zu meiner Akte. Ich arbeite und kontrolliere oder befehle V, um es einzufügen oder hier und ziehe es einfach an der Spitze und es wird hier bleiben. Okay, das ist ein Detail, das wir jetzt hinzugefügt haben. Und dann können wir auch das andere Detail hinzufügen, das Ah sein wird. Okay, also was? Ich brauchte Waas das. Okay, also, eigentlich brauchte
ich diesen weißen Bereich. Lassen Sie mich es von hier kopieren. Und, äh, im Grunde damit. Also erinnere ich mich jetzt, dass ich das für dieses weiße heruntergeladen habe, weil wir ein weißes auf
diesem Ziel brauchen . Bist du okay? Also gehe ich Fuß, benutze diese Navigationsleiste. Kopieren Sie es, und ich werde es auf meinem Jahr hier drüben so anheften, und Sie können sehen, dass es oben ist, also werden wir es unten verschieben. Okay, jetzt können Sie sehen, ich habe drücken Sie die Befehlsschalttaste und die hintere Klammer, und es ist den ganzen Weg zurück. Also denke ich, ich hätte einfach drängen sollen. Lassen Sie mich die Kontrolle und unser Kernbefehl diese Klammer bekommen. Okay, also bewegt sich hier wieder hoch, und jetzt werden wir die Farbe ändern, also doppelklicken Sie darauf und ich werde die Farbe ändern. So sieht es aus, diese Sterne zu führen, weil wir sie jetzt nicht brauchen. Richtig? Zugriff auf es e und links übermäßig. Du bist hier. Und ah, nächste Bewegung beim Hund. Was ist los? Okay, jetzt ist es gebraten. Lassen Sie uns seine Farbe weiß ändern und verwenden. Melden Sie sich an. Melde dich an, weißt
du. Okay, also haben wir hier drüben keinen Text, so wie das ist frei oder so etwas. Wir wollen nicht, dass die Benutzerspitze verwirrt wird. Das Anmelden kostet oder so etwas. Also werden wir hier etwas Text hinzufügen. Anmeldung zu bringen ist kostenlos. Okay, jetzt noch
eine Sache. Wir können diese auch hinzufügen, um Zehe zu montieren. Okay, also werde ich ein Symbol dafür machen, aber und so werden wir diese Werkzeuge für die Dinge brauchen. Und
ich werde auch sehen, ob wir das zu einem Symbol machen können. Okay, lass es uns lassen. Denn diese Unterstreichung wird ein Problem sein. Wenn wir dieses Textil hier unterstreichen können, wird
es besser sein. Solar. Weißt du, ich werde es auch zu einem Symbol machen. So ist es einfacher für mich, Links hinzuzufügen, aber verstehen Sie das. Melden Sie sich an. Feigen. Okay. Nein, ich werde ein paar Dinge oder Luft hier und da arrangieren, nur um den Abstand richtig zu machen und ich werde den nächsten Bildschirm verlassen, der Toby für dich entworfen hat. Und Sie werden die Tastatur von hier so importieren? Nein, ich drücke meine Kunst- oder Wahltaste, um die Entfernungen zu sehen. Und ich hoffe auf das hier. Verdächtige das hier. Behalten Sie das hier. Sie können die Entfernungen sehen. Jetzt können Sie sehen, dass ich alles fertig gestellt habe. Und wir haben erfolgreich die RUS eingesetzt. Du arbeitest es von Apple und dass dieser Kerl diese Dinge kopiert und es schnell macht. Okay, also in der nächsten Lektion, werde
ich Ihnen eine Aufgabe geben, um mehr Bildschirme,
ähnliche Bildschirme zu erstellen , indem sie ihnen den Status zeigen und sie mit Zehe verknüpfen, einen Prototyp
erstellen. Okay, also bis dahin, pass auf. Tschüss. Und ich hoffe, Sie haben diese Lektion genossen. Gehen wir zum nächsten
40. Starting: Ok. Nun, Intersection, wir werden unsere großartig aussehende GP Tools App in Adobe X T und bevor wir uns mit diesem Design beschäftigen, muss
ich ein paar Dinge besprechen. Wie zusammen diese Ressource ist, habe ich verwendet, wie Sie gehen, um sie herunterzuladen und wie wir gehen Zehe wählen Sie dieses Farbschema. Ok. So können Sie sehen, dies sind die verschiedenen Bildschirme. Lass uns verkleinern und, äh, dir was
zeigen? 100%? Ich denke, es ist besser, weil es meine Kraft macht. Okay, du siehst hier drüben, dass ich drei Farben benutzt habe. Okay, wenn du genau hinsiehst, ist
eine diese Hauptfarbe, die vorbei ist. Sie können sagen, prime regular für primäre Aktionen wie diese sind für Schaltflächen. Sie können sehen, dass dies all unsere großen Lasten sind, die ein Auto schaffen. Bloggen. Jetzt loggen Sie sich ein. Ok. Außerdem können
Sie sehen, dass ich die gleiche Farbe hier im Slide-Out-Menü verwende. Und da dies unsere Hauptfarbe ist, habe ich eine andere Farbe verwendet, aber Sie können hier drüben sehen, was ein Betsy auf Farbe ist. Okay, also, nein, diese beiden Mörder sind verwandt mit medizinischem Bereich oder Medizin. Okay, also brauchst du Zeh. Denken Sie daran, dass das, was Sie versuchen zu verwenden, okay? Und Sie können auf dieser Farbe sehen, dass ich eine sehr scharfe Farbe brauchte, damit ich einige Elemente
hervorheben kann . Also benutze ich diese junge Farbe. Okay, also kombinieren sie Frauen. Dann gibt es ein Problem, dass, wenn ich Link auf diesem Hintergrund diese dunkle Farbe zeigen möchte, ich eine weitere Farbe brauchte, die diese gelbe Farbe war. Also habe ich eine gelbliche Zehe benutzt, weißt
du, mit meinem Farbschema
gemischt. Okay, dann lassen wir uns es Ihnen zeigen. Ok? Also habe ich bereits eine weitere Farbe für diese Links, was eine zusätzliche Farbe ist. Sie können sehen, ob ich zu diesem wechseln. Sie können sehen, dass dies auch gut aussieht. Sieht nicht sehr schlecht aus. Okay, wenn du
also verfärben willst, ist
das unsere bläuliche Farbe. Sie können sehen oder hören, es ist ein Sechs e c drei. Okay, Sie können hier sehen. Ich habe eine Menge Farben. Wenn ich versuche, etwas zu entwerfen, mache ich viele Farben. Versuchte, mit ihnen zu experimentieren. Ok. Anstatt ein oder zwei Mörder zu haben. Zunächst beginne ich mit einer Farbe wie dieser eine Hauptfarbe und versuche toe. Fügen Sie einige weitere Farben in Kombination hinzu. OK, so können Sie sehen, dass dieses Blau auch mit diesem funktioniert. Ok. Und ah, die andere Hlinka Druckmittel, die ich hier drüben benutze, was meine Standardfarbe ist ein violettes Blau, das das gleiche ist, denke
ich wie dieser Knopf. Okay, also kannst du verschiedene Farben ausprobieren, wenn du Toe willst. Es gibt eine Menge von Online-Ressourcen, um Farbschemata zu erstellen, die ich Ihnen in
nur einer Minute zeigen werde . Einer davon ist mein Favorit, wo Sie nur eine Farbe verwenden können, um ein ganzes Farbschema zu erstellen. Okay, dann können Sie sehen oder hören in diesem Stich sind Sie sehen, dass ich eine dunkle Farbe verwendet habe und im Großen und Ganzen waren oder aktiven Zustand. Ich benutze diese Farbe. Dies ist ein bisschen wie alle Durchschnittswerte. Ich okay, jetzt kannst du hier auf diesem Knopf sehen. Das ist anders. Es ist etwas dunkler. Schattieren Sie die gleiche Siehe auf sehr scharfe Farbe. Sehr helle Farbe. Also das ist Britt sind stumpfe Farbe. Ok. Sie können diese Farbe auch verwenden. Aber ich benutze verfärben diese dunkle, bläuliche violette Farbe für meine primären Aktionen. Okay, und im Inneren des AB, als du in der App im Stich warst, benutze ich Verfärbung für verschiedene Tasten. OK, so können Sie sehen, das ist auch ein Knopf hier drüben. Und das ist auch über ein kein Haar. OK, damit Sie die Ähnlichkeit sehen können, die Sie benötigen, um innerhalb Ihrer App konsistent zu sein. Also, wenn ich eine dunkelblaue Farbe lila Calero hier und verwenden ah Pil Seong Farbe oder hier wird es sein, das ist Inkonsistenz. Also müssen Sie es von all diesen Inkonsistenzen entfernen. So sieht Ihre App erstaunlich und konsistent in Ihrem visuellen Design und Ihren Farben und Schema alles in Ordnung. Und bevor Sie mit diesem Design beginnen, möchte
ich, dass Sie alle Assets herunterladen, die ich in dieser Übung verwendet habe. Sie können sie in Ressourcen in diesem Abschnitt in der ersten Lektion zu finden, kann
dieser angehängt werden . Hören Sie, die SPD Icons Kraft genannt Hintergrund Ich habe verwendet Diese sind alle frei und das ist das Symbol, das ich tatsächlich für die Luft durch Gürtel entworfen. Okay, ich entwarf Okay, also das ist eine britische App für Ärzte. Okay,
Also, bevor Sie mit diesem Design beginnen, möchte
ich, dass Sie diese Assets herunterladen, die daran angehängt sind. Ah, Vortrag. Und Sie brauchen all diese Vermögenswerte, bevor Sie mit dieser Übung beginnen. Laden Sie diese Kraft erneut herunter. E Sand sagte, wenn Sie y Ford und Sie können auch roboto verwenden, wenn Sie wollen. Oh, und das nochmal, E. Und sie werden auch sehr gut aussehen. Diese anderen Ressourcen laden sie herunter und wir beginnen mit der nächsten Lektion. Okay, wir sehen uns bald in der nächsten Lektion.
41. Farbschema und Scheme: Okay, bevor wir anfangen, diese tolle App zu entwerfen, werden
wir ein paar Dinge besprechen. Okay, Nummer eins ist Inspiration. Bevor Sie ein Design beginnen, werden
Sie die ähnlichen abs und ähnliche Websites sehen, um zu sehen, welche Farbschemata
sie verwenden. Was für eine kurze Typografie sie verwenden. Okay, dafür, lassen Sie mich Ihnen zeigen, wie ich diesen Prozess angefangen habe. Bevor ich darauf einging, musste
ich mindestens zwei Mörder auswählen, um damit zu beginnen. Okay, also lass mich dir meine Inspiration zeigen und wie ich sie benutze. Sie können sehen, das ist meine Inspirationsmappe. Ich habe nur drei Dinge hier drüben. Dieses Farbschema. Ich denke, ich habe es geschafft, diese aus Kühlern Punkt C o r zu erstellen. Vielleicht denke ich, einen Job an einem bestimmten Okay, AB, und das ist eine andere, die Sie sehen können. Lassen Sie mich zeigen, dass Sie herangezoomt haben. Dies ist also auch eine Farbe und eine grüne Farbe und eine andere ist blau. Und es gibt diese verschiedenen Schattierungen von hellem Zehenalkohol. Okay, das ist
also ein weiteres Beispiel bei mir Show. Du hast einen gehört, den du hier drüben sehen kannst. Das sieht toll aus. Und wenn Sie genau auf die zwei Mörder hinschauen, die das Hauptziel für mich waren. Okay, also liebe ich diese beiden Mörder, die in unserem Ab verwendet werden können. Michaelas arabische Variation der Verfärbung ist nicht ähnlich. Also versuchen Sie nicht, alles komplett zu kopieren. Obwohl ich denke, dass Sie die gleichen Farben verwenden können, wie sie sind oder hier. Aber ich brauchte ein bisschen heller Fisch und Onkel des blauen Meeres, anstatt das Stil-Krocket. Das ist also meine Inspirationsmappe. Und ah, ich glaube, ich habe schon eine Menge von medizinischen APS gesehen. Also, äh, das war kein großes, großes Problem, aber man kann hauptsächlich sehen, dass Michaela-Schema darin ist. Okay, wir benutzen Van Yellow, das Meer auf dem Stumpfblau, das zwischen CNN und dieser violetten Farbe ist. Und dann ist dieses Telefon ein Brenner bisschen hellblau. Okay, Sie können
also Leere oder Schwarz hinzufügen, und Sie können sie stumpf machen, indem Sie die Helligkeit und Sättigung anpassen und mehr Mörder aus ihm
herausbekommen . Okay, also lass mich dir zeigen, wie ich verschiedene Farben daraus habe. Ok? So können Sie sehen, dass dies eine Farbe ist. Es ist eine große, stumpfe blaue Farbe dunkelblau. Los, los. Nun, wenn ich dir diesen und diesen Mörder zeige Also diese Farbe Okay, damit du sehen kannst, es ist fast die gleiche blaue Farbe, aber auf der großen Seite. Okay, also habe ich
ein bisschen grau benutzt und dieser schwarze Bereich hat eine Farbe von hier verschoben. Okay, also wenn ich zu dieser Farbe gehe, wie ich es dir so entdeckte, schätze
ich. Okay, also kannst du jetzt sehen, was der Unterschied ist? Wie ich es geschafft habe, auf der gleichen Farbe zu verwenden und eine neue Farbe daraus zu erstellen, indem ich sie in diesen Bereich ziehe, können
Sie sehen. Okay, hier ist es fast nah dran. Okay, also geh zurück. Okay, also benutze ich nicht nur Kriegler. Hier drüben ist es ein bisschen von gräulicher blauer Farbe. Und auch Sie können sehen, dass dies auch das gleiche ist. Sie können sehen, es ist immer noch in diesem 211 Hugh Bereich und Ah, und wenn ich zu diesem hier gehe, denke
ich, das ist auch 211. Lassen Sie mich zu diesem hier gehen. Ich verstehe. Also, wer ist das Gleiche? Diese Farbe ist also gleich. Nur die Sättigung und Helligkeit. Ich habe mich verändert. Ich habe diese Technik in meinen anderen Kursen gezeigt Zehe, dass Sie viele Farben
erstellen können indem Sie nur die Helligkeit und Sättigung ändern und den Farbton gleich halten. Okay, wer ist die Grundfarbe, die das definiert? Welche Farbe verwenden Sie? Er war eigentlich die Farbe. Dies sind Einstellungen ganze Situation Haus Hattrick gesättigt. Die Farbe wird sein und dass dies die Helligkeit medizinische wird auf der Lebensseite oder der dunklen Seite sein. Okay, so wählte ich dieses Farbschema und wie ich Inspirationen und verschiedene Farben bekam. Wie Zehe, wissen
Sie, mit dieser Art
anfangen zu entwerfen. Du weißt schon, Professionalität. Eine weitere Sache ist, dass Ihre Entwürfe durch die Zeit zu verbessern. Okay, wenn Sie
also denken, dass ich gerade dieses Design sofort erstellt habe und es keinen Prozess
dazwischen gab , wo ich, weißt
du, verschiedene Layouts
ausprobierte oder verschiedene Gönner ausprobiere, bevor ich Nur ah, Flugzeughintergrund. OK, also habe ich nicht benutzt Lassen Sie mich diesen und diesen verstecken. Okay, also habe ich so etwas benutzt. Okay, dann dachte ich, ich sollte einen Kontext im Hintergrund verwenden, und ich sagte, ich sollte etwas hinter dir verwenden. OK, so verwenden wir Inspiration und Saft, um unsere etwas aussehende APS zu kreieren. Es gibt kein Design auf der Welt, das originell ist. Okay, alles ist von irgendwoher genommen. Okay, das ist
also ein Thema aus meiner Vorlesung. Ich hoffe, Sie haben diese Lektion genossen. Gehen wir zu den nächsten s und wo ich werde, um die User Experience Punkte diskutieren. Wir werden verbessern und zeigen Ihnen die alten Bildschirme von der gleichen App.
42. Die Probleme mit Ux der alten App: Okay, jetzt in diesem Hören, werde
ich Ihnen zeigen, was auf Benutzererfahrung Aspekte hinweist, die wir in diesem jedes
Design verbessert haben . Okay, Jetzt können Sie sehen, dies ist die erste Version von dieser App, die in 200% zoomen kann und Sie können Reifen
sehen. Okay, hier haben wir, Sie können den Anmeldebildschirm sehen. Es sagt Benutzername Passwort, was sehr verwirrend ist. Wir haben es mit E-Mail umgetauscht. Auch, Diese eine Es gibt keine klare visuelle Beschuldigung und visuelle Team, wie Sie diesen Hund blauen Bar und dieses Protokoll sehen können, und sie sind die gleichen. Okay, also diese Aktionsschaltfläche, die als primäre Aktion bezeichnet wird, sollte
sie sich von dieser unterscheiden, weil sie nicht wissen muss, dass dies eine Aktion ist. Und das ist ein Titel, der ein sehr großer visueller Designfehler war. Dann haben wir hier eine Menge von verschiedenen Feldern, die wir die Zehe drei Gefühle reduzieren werden, und dann haben wir das Versteck, das wirklich nicht wie ein Armaturenbrett aussieht. Und Sie können alle Farben und alle Knöpfe sehen. Wenn Sie hier genau hinsehen, sind
sie die gleichen. Okay, es gibt keinen Hinweis darauf, dass dies aktiv ist. Dies ist mit dem Hintergrund verschwommen, was sehr schwierig Zehe ist, wissen
Sie, Verteidigungsjahre. Okay, dann haben wir diesen Bildschirm und es gibt viele verschiedene Aktivitäten hier drüben. Und das ist ein Aktivitäts-Einstiegsbildschirm, den wir nicht entwerfen werden. Und ich werde Ihnen ein paar weitere Bildschirme zeigen, die ihre jüngsten und Design sind. Dies ist ein aktuelles Design von ihrem ah ah ah, Android-App. Und Sie können sehen, dass wir Fuß gehen. Machen Sie es besser. Okay, also dieser Bildschirm, wir nehmen fast dasselbe. Aber Sie können sehen, wie Sie sehen oder hören können, dieser Bereich ist eine Schaltfläche. Dieser Bereich ist auch ein Knopf, aber sie scheinen nicht zu viel wie eine Last zu sein. Okay, wenn du
also mein Beispiel in meinem Team siehst, ändere ich das in einen Knopf. Dann haben wir einen sehr tollen Möwenhintergrund hinten, was ich nicht weiß, mir seltsam erscheint. Hier drüben gibt es kein Avatarbild. Ok. Und, äh, lassen Sie mich zoomen, gehen Sie zum anderen. Ok
, hier sind unsere Aktivitäten. Was sie taten, ist, anstatt ah, viel von sehr großen Navigationsleiste an der Spitze. Die Juden, sie kombinieren alle Aktivitäten in diesem. Okay, so dass jede Aktivität, die meistens verwendet wird, meistens vom Benutzer verwendet wird. Sie müssen an der Spitze sein. OK, so dass Sie leicht auf sie zugreifen können. Und dann haben wir das da Spülbecken Bildschirm. Wir überfallen fast dieselbe Struktur, aber wir versuchen, sie zu verbessern. Okay, so dass das visuelle Design aus dieser App wirklich saugt. Obwohl es besser ist als die erste Version, die diese war. Aber ich denke immer noch, dass wir viel verbessern können. Okay, also sehen sie nicht so aus. Diese sind möglich. Auch das benutzen sie nur einen Mörder für alles. Hier drüben können
Sie die gleiche Farbe für alles sehen. Für Schaltflächen, für Status, für alles. Jetzt können Sie hier sehen, dass dies Status ist. Dort, dort, fünf Beurteilungen. Aber es gibt kein Farbschema, dass diese andere schiere, dass dies ah, mögliche Taste oder nicht. Ok. Außerdem scheint
die Lücke zwischen diesen etwas weniger für mich, für meinen Geschmack. Oder vielleicht denke ich, es geht auf den Fuß. Ah, viel weg. Fehltritte. Fehlschritte bedeutet, dass, wenn jemand versucht, hier zu klopfen, sie in diesem
Bereich tippen , weil sie sehr nah sind. Okay, also müssen wir sie trennen. Dies ist ein weiteres Benutzererlebnisproblem darin. Okay, das ist alles, was ich sagen möchte, dass wir das visuelle Team hier verbessern werden. Wir unterscheiden zwischen der primären Aktion, die die Schaltfläche ist, die ein Titel ist. Und was ist die Information? Okay, also müssen wir alle von diesen trennen. Also fangen wir an, das zu entwerfen. Wir beginnen mit dem ersten Bildschirm, also fahren wir mit der nächsten Lektion fort.
43. Willkommen Screendesign: Okay. Nein, in dieser Lektion wir eigentlich anfangen, diese zu entwerfen. Okay, jetzt kannst du oben sehen. Das ist von dir geliehen, wie es von Apfel. Und ich habe es dir vorher gezeigt, und du kannst sehen, dass dieser Bildschirm ein bisschen verschwommen ist. Wir benutzen Hintergrundblut hier drüben, und alles andere wird von uns entworfen, oder? Gnocchi. Also, was wir tun werden, ist ein neues Dokument erstellen, und es wird iPhone 67 Jahr Bildschirm sein. Drücken Sie einfach den Kick einmal und mit Zoom-Steuerung, Befehl Null. Okay, jetzt, wir fangen hier vorher an. Ich weiß bereits, dass Sie den Assets-Ordner heruntergeladen haben, den ich Ihnen gegeben habe. Okay, also was wir tun werden, ist, dass wir die Fotos und alles
davor hierher bringen . Wir brauchen diese obere Navigationsleiste, also bringen wir sie von, äh, bist du ein Kind von Apple? Das ist also auf Apfel. Du magst es. Und wenn ich hier rüber gehe, brauche
ich diesen
Norden . X iPhone X eins. Okay, also brauchen wir das hier. Also lasst uns die Spitze kopieren. Also haben wir es hier drüben. Kopieren Sie es. Der Zustand der voraus. Entschuldigen Sie das hier. Okay, hier haben wir die Skopje und ziehen sie einfach an der Spitze, und es wird ein medizinisch Ok, Nein, wir Garda Status, aber an der Spitze. Jetzt werden wir das Hintergrundbild hierher bringen, - ein weiteres Rechteck an der Spitze, um den Effekt aus Hintergrundunschärfe zu erzeugen. Also werde ich ein Rechteck hier drüben den Rahmen entfernt haben, und Sie können sehen, dass die Größe die gleiche wie eine Leinwand ist. Und dann benutzen wir Hintergrundblut. Okay, jetzt ist der Hintergrund verschwimmen. Werte werden Blut unter dem Baum sein. Wir brauchen sehr kleines Blut. Helligkeit wird minus eins sein. Wir brauchen ein bisschen runter. Dunkel dunkel, nackter Boden und Deckkraft werden 15% sein. Okay, jetzt können Sie sehen, dass dies der Effekt ist, den ich erstellt habe. Wir müssen es wieder so vor diesem Bild hier drüben verschieben. Okay? Nun, was wir tun werden, ist, wir gehen zu Fuß, wählen sie aus ,
gruppieren sie und wir werden es sperren. Das ist unser Hintergrund. Wir haben hier unseren verschwommenen Hintergrund und die Stop-Navigation erstellt. Aber jetzt brauchen wir hier ein Logo. Also lassen Sie uns dieses Logo verfolgen. Es ist in PNG. Bilden Sie es, damit wir hier Transparenz nutzen können. Okay, das ist
also ein großes großes, also werde ich es verkleinern, indem ich Shift drücke und gedrückt halte. Vielleicht 1 72 Also werde ich Toe Größe es Zehe 1 72 Pixel mal 1 72 Warum denkst du, ich habe ein sehr großes Logo? Weil vielleicht für andere Bildschirme, vielleicht iPhone X wir brauchen ein größeres. Toby exportiert. Okay, das wird jetzt in unseren späteren Diskussionen sein. Ich muss nur wissen, dass wir das brauchen. Und wir werden auch etwas Schatten darüber hinzufügen. Und die Schatteneinstellungen sind sechs und sechs. Okay, also erkranken sechs Schweine an der Unterseite, und sechs ist das Blut, und es wird 10% sein. Okay, also statt 16% werde ich hier 10% verwenden. Die Farbe ist hier drüben. Dies ist, wie viel Prozent vom Schatten, der Deckkraft. Das ist im Grunde Transparenz und Deckkraft dieses Schattens. Alfa, siehst du was? Hier. Okay, hier haben wir einen sehr schönen, cremigen Schatten um ihn herum. Und dann werden wir einen Teil des Textes hier machen, der wie Tee ist. Und ich werde mal hier drüben drücken und wir werden den Ford wieder benutzen. A, die ich sehe. Okay, also lasst uns zuerst Taipower Textilhaar-GP-Zehen, und dann werden wir wieder kowtow. Und ich werde extra fett verwenden. Und, äh, Größe ist 32 Bilder auf 32 Punkten. Ich werde als nächstes TV drücken, es in die Mitte
bringen, und auch die Farbe wird so etwas sein. Toto. Auch, wenn Sie wollen, können
Sie etwas verwenden, das geht, um in das blaue Hemd zu sein. Okay, vielleicht sagt etwas, das näher dran ist, ja, okay. Also die Farbe, die Sie sehen können, was ich verwendet habe, ist, dass ich zu diesem Farbton,
Sättigung und Helligkeit gewechselt habe, und ich benutze die riesige 211, die unsere Hauptfarbe ist, mir und Prime regelmäßig aus diesem Design. Dann benutze ich diese Situation und diese Helligkeit. Okay, also senken wir die Situation. Wenn wir versuchen, es zu erhöhen, wird
es etwas mehr Farbe geben. Sie können sehen, dass es sich in Richtung dieser Farbseite bewegt. Okay, wenn ich es
also wie 90% hierher schiebe, wird es hier drüben sein, also wollen wir nicht, dass es eine bläuliche schwarze Farbe ist. Aber wir wollten etwas sein, äh, in diesem Bereich. 17. Das sieht gut aus. Okay, jetzt geben wir unseren Text hier drüben ein, und lasst uns das erste Mal den Text. Jetzt können Sie sehen, ich habe diesen Bereich Text geklickt, weil es ein Absatz ist. Also müssen wir es damit anpassen. Lassen Sie uns die Größe nach unten auf 16 verschieben und wir werden es so nach unten bewegen. Also lasst uns es in so etwas bringen. Vielleicht so. Okay? Nein, wir brauchen ein regelmäßiges Fort, und wir müssen es in s ändern, wenn Sie mischen. Geh zu diesem. Zuerst
das hier. Jetzt werden
wir die Mitte und Mitte hier benutzen und uns ausrichten. Sparsam. Okay, jetzt ist die Zeilenhöhe und der Zeilenabstand 19. Sie können es auf 20 verbessern, wenn Sie möchten. Oh, aber ich denke, 19 sehen perfekt aus. Dies ist eine sehr ziemlich gut lesbare Telefonate auf sehr kleinen Größen. Und Sie können das auch wieder verwenden. Wenn du Zeh willst, liegt es an dir. Aber ich mag Qual wirklich. Ah, ich frage das Boot sind die freien Formen und wirklich nette Kraft. Also werde ich jetzt wieder bei mir bleiben, weil ich glaube, ich habe mit dir die Qual geteilt. Okay, also ist unser Ladebildschirm oder der erste Bildschirm von unserem AB bereits fertig. Ich hoffe, Sie haben das genossen. Ach, stellen Sie sicher, dass diese Farbe von diesem Text etwas, äh, weniger oder vielleicht dunkler ist. Eine weitere Sache, die wir hier tun müssen, ist, dass wir diese Farbe auswählen und zu
unserem Mörderschalter hinzufügen müssen . Okay, das ist
also unsere erste Farbe. Also mussten wir im Farbfeld sein. Und auch, ich will diese Farbe Toby in der Farbe Musterspitze. Okay, also haben wir hier zwei Farben. Am Ende werden
wir, weißt
du, weißt
du ein Grab
finden. Gut. Stimmen Sie diese Farben ab, also machen Sie sich jetzt keine Sorgen. Das ist unser erster Bildschirm. Wenn du es wechseln willst, du diesen kannst
du diesen
Punkt X.
Du kannst ihn in Punkttext umschalten, wenn du willst,
denn im Moment haben wir es schon geschafft. Punkt X. Du kannst ihn in Punkttext umschalten, wenn du willst, Okay? Das ist also unser Bildschirm. Lassen Sie uns 200% so Platz und es sieht wirklich toll aus. Lass es uns wieder schaffen. Die gleiche Farbe außer sieht wirklich scharf aus. Okay, also ist unser erster Bildschirm fertig. Lassen Sie uns in der nächsten Lektion einen weiteren Bildschirm erstellen. Und ich hoffe, Sie haben das genossen. Eine weitere Sache, die Sie tun können, ist, dass dies unsere Überschrift sein wird. Okay, wir brauchen es, um in diesem sexy OK zu sein, also müssen wir mit der rechten Maustaste klicken und erstellen und killer. Okay, also wollen wir für unsere Textüberschriften verfärben. Und auch wir gehen Zeh. Du machst noch eine Sache, nämlich wir werden den Text erstellen. Okay, das wird
also im Traktor-Stil sein. Einer ist dieser hier. Und das wird über Überschrift und Regisseur Stil sein. Okay, Sie können
also sehen, dass wir bereits einen Stil korrigieren müssen, so wird es einfacher für uns sein, das gleiche in der nächsten Lektion zu tun. Okay, das ist alles, was wir bereits begonnen haben, über Korrekturstil und unsere Farben zu bauen. Ich rate normalerweise, dass Sie erstellen und verbessern Sie Ihre Sty-Führungsfarben und geknackt beiseite und Symbole, wie Sie in Ihrem Design vorwärts gehen, anstatt alles zuerst zu bauen und dann in das Design zu
implementieren. Okay, wir treffen uns in der nächsten Lektion, wo wir den nächsten Bildschirm entwerfen werden.
44. Den Anmeldebereich entwerfen: jetzt in diesem. Hören Sie, wir werden diesen Anmeldebildschirm für die gleiche App entwerfen. Bevor wir das entworfen haben. Dies in dem Prozess, und wir haben diesen Willkommensbildschirm oder Ladebildschirm entworfen, und jetzt gehen wir zu diesem Anmeldebildschirm zu gehen. Okay, hier haben wir diesen Knopf ein bisschen. Schattieren Sie diese beiden Tasten mit diesen Farben. Also lasst uns anfangen und so etwas wirklich entworfen. Ich werde das schließen. Und das ist unsere letzte Arbeitsakte. Nun,
einfach, was ich tun werde, ist, dass ich diese Hartfaserplatte duplizieren werde, meine Art Optionstaste zu
umgehen und sie so zu ziehen. Ok? Nein, das brauchen
wir nicht. Wir haben die Textilien bereits, also brauchen wir sie überhaupt nicht. Okay, also zuerst werden wir einen Zwischenstopp hier rüber haben, was wir auch von meinem U Y aus Apfel bekommen können. Lassen Sie mich zu diesem hier gehen. Und lassen Sie uns mit dem Titel sehen. Ja. Ok. Also hier haben wir diesen Titel. Sie können sehen, dass Dies ist, dass unser Titel in dieser Navigationsleiste? Dies ist eine Symbolleiste. Das ist die Leiche. Wir brauchen die Leiche nicht. Wir brauchen nur diese Navigationsleiste. Und das brauchen wir
eigentlich, eigentlich, ja. Also werde ich die Zehenkontrolle
sehen, einen Befehl C sehen und ihn hier drüben platzieren. Okay, also werden wir es oben unter die Statusleiste verschieben, und wir brauchen keine Farbe in dieser. Und ich werde den gleichen Bereich verwenden, um Jeep be Toole Gesicht zu schreiben, so dass Sie jetzt sehen können, ist es auf San Francisco Pro Display. Was? Wir brauchen es jetzt nicht. Vielleicht können wir dasselbe Telefon benutzen, wenn du willst. Oh, weil Anzeigen für Überschrift. Also lassen Sie uns mit der rechten Maustaste für fremde Farbe auf lokale jedes Bedürfnis klicken, und dann werde ich es zu anderen geknackten Erstein hinzufügen. Vielleicht können wir dieses eine Werkzeug so erstaunlich ändern. Okay, was ich
jetzt tun werde, ist, dass ich es in der Mitte so ausrichten werde, und wir werden diese Sterne entfernen, weil wir sie nicht brauchen. Okay, also lasst uns in diese Schicht gehen und sehen, dass das unsere Gruppe ist, richtig? Zubehör und Zubehör links Wir werden sie entfernen. Okay, hier haben wir die gleichen Spezifikationen, die Apple verwendet. Dies ist die Standard-Spezifikationen auch wir das gleiche tun können. Wir werden auf diese klicken und das war's. Sie können sehen, dass dies nun in diese umgewandelt wird. Ah, das hier. Ich gehe die Zehe. Glauben Sie es, um Ihnen einen Text zu sf. Und das hier ist Sinn aus San Francisco-Produkten. Aber Sie können auch wieder verwenden. Das ist momentan kein sehr großes Problem. Jetzt werden wir Kerzen benutzen. Waren hier sind und ich werde so etwas wie diese hier drüben Karriere gehen. Dies wird unser Textfeld sein. Lass es uns 60 hoch machen. Ich denke, 60 ist zu viel. Vielleicht sehen 50 sechs Waas gut
aus, haben die Grenze entfernt und wir werden etwas Schatten hinzufügen. Lassen Sie uns etwas Schatten hinzufügen. Das sind drei und sechs. Ich werde auch einige abgerundete Ecken machen und werde sehr abgewickelt sein. Also werde ich zu oder hier verwenden und ich denke, Shadow sieht gut aus mit den Standardwerten. Ich glaube, ich will nicht jede Ausbreitung des Schattens. Ich wollte nah daran sein und auch ich wollte sehr leicht. So 10% können Sie 000 10% sehen. Es ist schwarze Farbe. Okay, hier haben wir ein Textfeld. Dann können wir unseren Text drauf haben. Und diese Seite E-Mail wie diese. Und jetzt werden wir einen Safe benutzen. Du eine SMS. Und wir werden eine andere Farbe verwenden. Fügen Sie eine andere Farbe hinzu, um es kann diskret sein. Also haben wir diesen Kriegler. Nun, das ist drücken Sie V und schieben Sie es hierher. Geht zu haben 18 Pixel außerhalb der Entfernung von diesem. Dies ist unser einziges Textfeld. Das sieht toll aus. Als nächstes wählen Sie beide aus und rechts. Klicken Sie auf, und erstellen Sie ein Symbol. Okay, jetzt haben wir hier einen Text drei tiefer. Ziehen Sie es einfach so. Also werde ich Boss Wort haben, damit du sehen kannst, wie einfach es jetzt ist. Und es ist sehr einfach, verschiedene Felder vom gleichen Typ zu erstellen. Okay, also haben wir zwei Felder hier drüben, und jetzt brauchen wir den Anmelde-Button. Ja. Also, was ich tun werde, ist wieder ein Rechteck und ich werde die gleiche Größe wie ein
bisschen höher 60 für die Höhe haben , abseits der Last, weil es von unserem Feld anders sein sollte. Okay, also die Farbe, die ich verwenden werde, ist 211 und 84 60. Okay, das ist
also die Farbe. Und Ah, ich füge hinzu. Oder hier. Und wir gehen Zehenluft. Einige Schatten, dieser Button Schlagschatten und unsere Werte sind die Schatten extrem. Die Farben rufen den Schatten ab. Dies ist die gleiche Farbe, und es wird 36 22. Das ist eine Schattenfarbe, und ah, dann werden wir die Werte auf vier ändern und es. Okay, also diese Werte werden nach einigen Experimenten sein. Auch
die abgerundete Ecke ist vier für diese. Es ist abgerundeter als diese beiden. Ok? Und sei so, es sieht aus wie ein Knopf. Okay, auch, dieser Prozentsatz ist anders. Es wird 30% sein. Wir brauchen einen schwereren Schatten drauf. Okay, also ist es vom Hintergrund getrennt. Das heißt, der Text
, der hier drüben nichtig sein wird. Lassen Sie uns den Text einloggen. Weißt du, so
etwas. Weiße Hälse und die weißen Sicherheiten vor uns. Und, äh OK, also werde ich es in der Mitte so bewegen. Und das sieht zu schaffen, weil es bereits weniger Platz haben. Die Spitze. Ich denke, ich muss es so oben bewegen. Es sieht also gut aus. Okay, jetzt können
wir auch diese ein zwei Stunden Sammlung hinzufügen, klicken Sie mit der
rechten Maustaste und okay. Anstatt dieses hinzuzufügen, werden
wir beide hinzufügen. Also OK, lassen Sie uns für Specter Stil hinzufügen, und dann werden wir Gruppe hinzufügen. Okay, also lasst uns nicht gruppieren, um ein einfaches Ja zu machen. Also haben wir hier jetzt ein besseres Wissen. Ok. Also, wenn ich hier etwas getan habe, wird
es für alle festgehalten. Stellen Sie also sicher, dass dies Ihre Schaltfläche sein wird, und Sie werden nicht viele Dinge darin ändern. OK, jetzt werden wir einen Text hinzufügen, der noch gebildet wird. Passwort vergessen. Das wird ein Link sein. Also werde ich das Singular für den Link hinzufügen, jetzt wird es die Mitte sein. Stellen Sie sicher, dass Ihre Angriffe und alles eine Linie in der Mitte sind, denn im Moment
entwerfen wir alles für die Mitte. Okay, das ist
also gut. Okay, also ist er nicht in der Mitte, da kleine Alles in der Mitte. Und dann war dieser eine Zehe in Bezug auf den Scan okay. So können wir es auch ein bisschen nach oben bewegen. So wie das. Außerdem haben
wir hier drüben viel Platz, also warum ziehen Sie es nicht nach oben? Deshalb werde ich 44 Pixel von der Stadt entfernt haben. Also haben wir hier drüben viel Platz, weil wir ihn brauchen. Wir werden die Log-Evidenz für Facebook und Google entwerfen. Okay, jetzt gehen wir auf die Zehe und machen das Gleiche hier drüben. Und dieses Mal werde ich weniger Höhe für den Knopf haben. Wir werden nur 50 vier sein. Ich denke, es sollte mit diesem übereinstimmen. Das ist hier 56. Okay, also wird das 56 und die High sein. Sehr zäh. Dies ist 5 60 t. Dies ist 5 63 oder so. Alles sollte in diesem auf entworfen konsistent sein. Also gehen wir zu Fuß, bewegen die Grenze. Füllfarbe wird sein, Ah, die Facebook blau bis 18. 84% Sättigung und 60% Helligkeit Okay, also haben wir diese blaue Farbe, die von Facebook-Klicks stammt. Lassen Sie uns es ein bisschen mehr in der Helligkeit wie diese bewegen. Okay, also werden wir vier in dieser Studie hinzufügen. Volle Rundheit dazu. Es ist ein Lord Kapazität für all das. Okay, jetzt sieht es gut aus, und dann werden wir es duplizieren und unsere andere orangefarbene Farbe für unser
Google Google Google verwenden und dann werden wir es duplizieren und unsere andere orangefarbene Farbe für unser
Google Google Google verwenden. Okay, also haben wir in der Waschküche Null Zehe 70 und 85. So, wie können Sie diese Farben zu bekommen? Sie können die Sculler von online bekommen. Sie können sie Farbe auswählen. Sie können eine Farbe daraus auswählen, indem Sie einige von den Werkzeugen verwenden, die ich habe. Ich werde es dir eines Tages bald zeigen. Okay, also haben wir diese zwei Knöpfe und dann brauchen wir einen Text. Wir melden uns einfach per E-Mail an. Ok. Also lasst uns sie ein bisschen nach oben bewegen. Ja. Also,
so , dann werden wir es auch nach oben verschieben, weil wir weniger Basis an der Unterseite haben und
wir werden das duplizieren. Das ist unser Link. Also werden wir registrieren,
menschlich, menschlich, so
etwas in der Mitte, das kleine in der Mitte. Okay, also stellen Sie sicher, dass diese getrennt sind, damit sie leicht in der Lage sein können. Okay, jetzt sehe ich viel weniger Platz hier drüben. Also werde ich diese Albert nach oben verschieben, damit es mehr Platz dafür gibt. Zehe verdrängt. Ok. Ok. Also haben wir alles angelegt. Lassen Sie uns unsere SPG-Symbole aus Fondation Icons bringen. Ich werde aufmachen. Diese Ressource ist Asserts und SPD-Symbole. Eigentlich bewache
ich diese Symbole. Ich habe sie von den Stiftungssymbolen ausgewählt und, ah, damit Sie weniger Zeit haben können, wissen
Sie, sie zu
durchsuchen. Okay, also werde ich beide abholen. Ziehen Sie sie einfach ins Schlepptau. X'd so sieht aus, aber es ist so und schleppte ihn hierher. Okay, jetzt können Sie sehen, dass wir hier Symbole gekauft haben. Bringen wir sie hierher in diesem Bereich. Als nächstes bewegen Sie sich zum Ebenen-Panel, und was ich tun werde, ist okay, also werde ich sie auf die tatsächliche Position verschieben. Und lassen Sie uns Jane die Füllfarbe das Weiß für diesen hier auch. Ich werde sie kleiner machen. Machen wir sie 48 mal 40. Lassen Sie uns das abschließen. Versuchen wir es. 36. 36 ist zu klein, ich denke, für die es sah gut aus. Als nächstes mach es in der Mitte so. Ich denke, sie sehen gut aus. Jetzt werden wir hier etwas Text hinzufügen. Lassen Sie uns diesen Text bewegen und ihn nach vorne bringen. Okay, also werden wir die Farbe von Weiß ändern. Alles, was wir so etwas verwenden können. Wählen Sie dieses aus und wählen Sie dieses weiße und wir werden es ändern. Melden Sie sich an und richten Sie es in der Mitte näher an diesem Login mit Facebook aus, gehen Sie es erneut zu duplizieren und melden Sie sich mit Google an. Jetzt können Sie sehen, dass diese gekauft von ihnen sind links mit ihrem Text ausgerichtet. Okay, also versuche nicht, sie falsch auszurichten oder in der Mitte hierher zu bewegen. Okay, jetzt sieht alles Schule aus. Wir werden einen weiteren Zeichenstil hinzufügen, der unsere Text-Links ist. Richtig? Klicken Sie auf, und fügen Sie Korrekturstil hinzu. Ok, das ist
also unsere Testtext-Links. Dies ist Text auf einem dunklen Hintergrund. Dies ist auf hellem Hintergrund. Das ist unsere Überschrift. Oder Sie können diese auch verwenden. Auch Roberto dafür verwendet, wenn Sie wollen. Oh, und das würde cool aussehen, Tok. Also sind wir mit dieser Übung fertig. Wir haben einige Symbole wie dieses für diese Last und dieses geschaffen. Ah, noch
ein paar Stile, Charakterstile. Ich hoffe, Sie haben diese Lektion genossen. Wenn Sie mehr Hilfe benötigen oder Fragen stellen möchten, können
Sie mich jederzeit fragen. Fahren wir mit der nächsten Lektion fort.
45. Gestalte die Login: Ok. Nein, in diesem „Hören werden
wir diese entwerfen. Ah, Verstopfungen und Bildschirme, die Sie hier sehen können. Dies ist unsere Logan Skin wurden in der vorherigen Lektion entworfen. Und ich glaube, wir haben vergessen, das hinzuzufügen
, wie, um das Passwort zu zeigen. Und jetzt werden wir diesen aktivierten
Passmore-Bildschirmentwerfen Passmore-Bildschirm . Lass es uns bewegen. Lassen Sie es uns woanders bewegen und Distel hier bewegen, damit es mehr Sinnen macht. Keine Anmeldung ist auf der anderen Seite. Okay, jetzt haben wir drei Anmeldebildschirme. Einer ist dieser willkommene Anmeldebildschirm. Dann wird dies aktiviert, wenn Sie versuchen, Ihr Passwort und E-Mail zu senden, und dies ist, während Sie versuchen, hinzufügen versuchen, etwas zu schreiben. Okay,
also, sobald Sie auf diese Ebene klicken OK. Also das ist unser Textfeld Wenn jemand versucht, etwas hier einzugeben , geht
es zu Fuß, bekommt einen blauen Rand unten, und dieses Augensymbol wird blau. Okay, im Moment aktivieren wir zwei Dinge dieses Feld und auch diesen Ah, Knopf. Okay, also wird das eine Last sein. Dies wird ein spannender Bereich sein, den ich Ihnen zeigen werde, wenn wir anfangen, einen
Prototyp dafür zu erstellen . Gut. Ok. Ich hatte viele Probleme beim Erstellen von Prototypen, weil wir einen vollständigen Hintergrund über den
Haaren haben müssen , um einen Prototyp zu verknüpfen. Das ganze Gebiet ist also fähig, oder? Nicht nur dieser ist ein Schritt. Okay, also lasst uns anfangen. Und ah, wir werden diese beiden Bildschirme dort erstellen. Fast ähnlich. Nur ein bisschen Unterschied. Also fangen wir mit diesem an. Okay, also werden wir uns das von unseren leihen, du weckst es von Apple und lasst uns anfangen. Ok. Nun,
einfach, was ich tun werde, ist, dass ich den Bildschirm duplizieren werde, und wir werden ihn so replizieren und die Warnungen, die ihn mit diesem ausrichten. Okay, jetzt ist es eine Linie. Jetzt sind wir in diesem Bildschirm und wir werden hier nichts ändern. Also lassen Sie uns zuerst hinzufügen, dass II verschwunden ist. Also werde ich das SVG-Symbol meines Asset-Ordners gehen. Dies ist mein Symbol, das in unsere Adobe X'd diese Datei gezogen wurde und hoops irgendwo anders gezogen weil es Fuß geht. Klemmen Sie ihn in diesen Behälter, damit ich ihn hier rüber ablegen werde. Ich werde die Zehengröße auf 32 Eichen, 32. Okay, ich denke, es sieht gut aus. Ich werde es hier in alles ziehen und lassen Sie uns über Spitze Panel Schule und sehen, ob das Auge
in diesem Passwort-Feld ist oder nicht. Okay, wo ist unser Passwort? Das sind unsere Pässe, also werde ich ein Passwort nennen. Stellen Sie sicher, dass Sie Ihre Listen jetzt benennen. Ich nenne sie nicht, weil ich sie nicht so wollen, weil ich die Gruppe und das Passwort, das ich dir so etwas aufgegeben habe. Und das ist, ich denke, das ist unser E-Mail-Feld. Ich bin die Rechnungen, die hier rüber schauen. Okay, das ist
also unser soziales, ähm, Google-Symbol. Das ist unsere Navigation. Das ist nah dran. Alles X in der Nähe, das hier. Okay, was ist das für ein Symbol? Ist das der Knopf? Ja, es ist okay. Also loggen Sie sich in B, T n Dash, Logan, VT ein. Und verboten. Ich werde es aktivieren. Okay, also haben wir fast alles, was vermutlich hier genannt wird, und dieses Augensymbol. Wir werden die Farbe der Zehe ändern. Also haben wir zwei Schichten darin. Also werde ich mich ändern. Dein Sculler macht so etwas. Es gibt also einen. Das hier. Können wir sie kombinieren? Ich werde dieses Boot zu Formen kombinieren. Wählen Sie diese beiden Shapes und Prestes aus. Okay, jetzt haben wir nur eine Form mit einer Farbe. So ist es einfacher für uns Zeh, wissen
Sie, ändern Sie Farbe Schlüssel. Unsere Schichtfarben sind auf dieser Seite. Okay, jetzt kannst du es sehen. Das sieht toll aus. Jetzt gehen wir auf die Zehe. Erstellen Sie einen anderen Bildschirm aus diesem. Okay, wir haben einen anderen Bildschirm, und jetzt brauchen wir unsere Tastatur oder hier, was wir von unserem und dem hier bekommen werden. Tut mir leid, dieser hier. X Evers, die Tastatur. Okay, hier haben wir die Tastatur. Nächster Grad, Diese Tastatur und Steuerung. Siehe oder Befehl. Sehen Sie? Und ich gehe die Zehe. Lass uns das schließen. Okay, also wurde ich besiegt. Unser Geist hat sich so gestaltet. Okay, Sie können sehen, jetzt sieht das wirklich cool aus. Wir werden die E-Mail in meine E-Mail ändern. Okay, also sieht es toll aus. Das Passwort wird,
äh, äh, Statik wie das sein. Als Nächstes. Bewegen Sie es ein bisschen. Entschuldigung. Okay, jetzt brauchen wir den Zehenlöser. Dieser aus dem Symbol. Okay, also gehe ich die Zehe, löse sie vom Symbol ab und lass es uns nach draußen bringen. Das Symbol. Also ein Gruppensymbol. Okay, also haben wir unter dem Symbol. Ich werde es hier ein bisschen in der Mitte schieben. So wie das. Okay, jetzt haben wir alles. Jetzt gehen wir auf die Zehe. Wir können sie gruppieren, wenn du willst, aber ich denke, sie sind bereits dabei. Also werde ich es so lassen, weil wir dieses Passgefühl nicht benutzen werden. Wir brauchen nur ein genetisches Symbol, das unser Textfeld ist, das wir hier haben. Also lassen Sie mich es Ihnen zeigen. Wir haben ein Textfeld. Hören Sie, es ist, was wir nicht wirklich brauchen ein spezielles Feld immer wieder. Das wird also so sein. Okay, das ist
also ein Zustand. Wenn also jemand versucht, auf dieses in diesem Bereich zu klicken, um sein oder ihr Passwort zu sehen, wird
es so sein. Also hallo, Welt weiter. Okay, also gehe ich zu Mein Passwort ist eine einzige Gruppe. Okay, so sieht das gut aus, und ich werde die Füllfarbe Zehe eine andere Farbe ändern, die Shop sehen Onkel A Mal sehen, was waas diese Farbe C Null e sechs. Okay, also werde ich es jetzt hinzufügen. Also vergesse ich diese Farbe nicht. Okay, also wird das zu diesem hinzugefügt und von dem, was ich tun werde, ist im Fotoshop. Es ist einfacher, auf Ah ah,
eine andere Ebene in eine andere Ebene zu clippen, was nicht einfacher ist oder hier, weil ich Toby zugeschnitten gestalten möchte. Also, was ich tun werde, ist, dass ich den Zeh auftauchte und andere Rechtecke hier drüben. Und es wird vier Fizzle hoch sein, nicht 40% vier Pixel hoch. Und ich werde die Rahmenfarbe entfernen, wird diese sein. Dies ist unser aktivierter Zustand und ich werde diese abgerundeten Ecken trennen um diese Ecke Anschlag Null oben links wird Null sein. Das wird Null Zehe sein. Ah, richtig. Unten rechts wird zu tun sein. Und dieser hier wird wieder gut werden. Also, jetzt werde ich es ausrichten und den mittleren Boden davon können Sie so sehen, und wir müssen es
auch ein bisschen nach oben bewegen. Also, jetzt denke ich, es sieht besser aus, wenn Sie die Größe nicht reduzieren, können
Sie reduzieren. Aber ich denke, es sieht gut aus. Okay, also haben wir eine gerade aktiviert, wo jemand versucht, in dieses Feld zu klopfen, und es wird die Änderung unter Austausch Farbe von diesem. Es wird also etwas dunklere Farbe sein, und unser Gefühl ist gerade jetzt Aktivität, okay? Nein, es gibt noch ein paar Dinge, die Sie jetzt hinzufügen können. Wir haben hier keine Farben, also werde ich noch ein paar Mörder hinzufügen. Fügen Sie Farbe hinzu. Okay, also haben wir hier drüben noch ein paar Farben dran. Außerdem werden
wir in dieser Farbe diese blaue Farbe hier hinzufügen. Okay, also habe ich ein paar Mörder gemacht. Lassen Sie uns diese Farbe Zeh hinzufügen. Ich gehe mit der Farbe belüftet. Das ist also ein Greg Miller. Dann haben wir dies ein dunkles, schwärzliches Grauweiß. Und diese, denke ich, das sind alle Farben. Wir werden alle Seifen brauchen. Ich distel nur von einem Mystiker. Okay, ich denke, wir haben diese beiden Bildschirme gemacht und Sie können jetzt sehen, indem Sie Symbole verwenden und andere Kunsttafeln
duplizieren. Es ist, wie viel einfacher Zehe, wissen
Sie, produzieren diese Art von Bildschirmen leicht. Ok. Und ich denke, du solltest sie umbenennen. Wenn du es wissen willst, werde
ich ihn separat grün. Aber Sie sollten sie umbenennen. Du solltest sie gruppieren. Und ah, das wird Ihnen helfen, dies leicht zu erstellen. Waren so, wie Sie hier sehen können Wir haben nichts Gruppe hier drüben, die Sie in einem Knopf gruppiert werden sollten. Und Ah, okay. So wird es hier drüben weniger Chaos haben. Lasst uns das hier zusammenfassen. Okay, also habe ich das hier und Facebook. Es ist in letzter Zeit auf Facebook. Also werde ich Steuerbefehl drücken und beide auswählen. Kontrolle G. Komm schon, G. Und das ist unsere Facebook-Gruppe. Okay, ich glaube, wir haben das soziale verlassen. Äh, okay. Jetzt können Sie sehen, dass dies ein Problem ist, in das Sie eintreten können, wenn Sie sie nicht richtig benannt haben. Dies ist Symbol Gesicht Buch. Okay, also versuche ich normalerweise, den Typ von diesem Ding vor diesem Namen zu verwenden. Also, jetzt können wir dieses Aussehen haben, dieses und dieses hier kontrollieren. Komm schon, G, um dieses Gesicht strahlend zu machen. In ähnlicher Weise gehen
Sie, um all diese zu kombinieren. Okay, also wolltest du deine Ebenen so organisieren. Ich hoffe, Sie haben diese Lektion genossen. Wir haben diese Schleppen mehr Bildschirme erstellt. Außerdem, ich denke, wir ändern keinen Titel, sondern in der Mitte. Und wir sind fertig, die Bildschirme zu entwerfen. Ich hoffe, Sie haben diese Lektion genossen. Wenn Sie Fragen haben, die Sie mir stellen müssen, lassen Sie uns zur nächsten Lektion gehen, wo wir den Anmeldebildschirm erstellen werden.
46. Anmeldung von Bildschirmdesign in XD: jetzt in diesem. Hören Sie, wir werden erstellen und registrieren Sie sich per E-Mail-Bildschirm und Ihnen sagen, dass dies
von der Haut sein wird . Okay, also wird der Benutzer das hier anklik oder tippen, und er wird den
Anmeldebildschirm hier drüben bewegen . Okay, jetzt, auf dem Schild des Bildschirms, vielleicht will er zurück und will sich nicht anmelden. Vielleicht hat er es mit dem Mystiker übergeben. Also müssen Sie hier drüben etwas auf dem oberen Zeh haben. Gehen Sie zurück zum Anmeldebildschirm. Okay, was ich jetzt tun werde, ist, dass ich diesen Bildschirm kopieren werde. Okay, also werde ich verkleinern, und ich werde den Bildschirm bewegen oder hier. Ok. Also werde ich es nennen,
Anmeldebildschirm, weil ich denke, es ist besser, diesen einen Namen zu nennen, weil ich keinen Namen produziert habe. Eso Wir brauchen diesen Knopf unten. Vielleicht brauchen wir diesen Text nicht. Das brauchen wir nicht. Okay, also auch, wir brauchen das nicht. Okay, wir brauchen ihn, um sich anzumelden. Er ist Arzt. Vielleicht hatte er also eine medizinische Entscheidungsnummer. Ich denke, wir werden das hier drüben in der ursprünglichen Luft benutzen, aber ich glaube, ich habe nichts wie dort benutzt. Also werden wir jetzt auf vier Felder ausdehnen. E-Mail, Passwort und Ah, zwei weitere. Lasst uns die bewegen. Ziehen Sie den Boden so ab. Und fangen wir mit der Duplizierung an, dieses hier geht nur Toby DoubleClick. DoubleClick wird Ihr Name sein. Und wir werden mit Dr. Medical Positionsnummer beginnen, weil ich denke, es ist eine Notwendigkeit für diese App. Okay, Okay, also
begrenzen wir uns auf vier Farmfelder. Ich denke, das ist eine Notwendigkeit. Es wird also alle Ihre Daten entsprechend dieser Positionsnummer protokollieren. Okay, jetzt lass uns das ein bisschen unten bewegen. Moment ist
dieser hier bei 1 48, dieser ist der für 34. Also gehe ich mit den Zeh. Lass es fallen, Zeh. Ok. Was ist, wenn wir versuchen, alles hier auszuwählen? Drop es gewann 40 Jahre. Hoppla. Lasst uns das hier benutzen. Vertikal verteilen und es wird Zehe alles vertikal so verteilen. Lassen Sie uns alles etwas weiter nach unten bewegen. Vielleicht hier drüben. Ok. und ich werde es schon ein bisschen nach unten bewegen. Mitglied. Äh, dann musst du dich hier einziehen. Okay, vielleicht können wir es in zwei Zeilen trennen, denn hier haben wir dieses Bild, das einfach nicht
wirklich schön aussieht . Ich werde die Mittellinie dieses Textes gehen und auch diesen in der Mitte ausgekleidet. Also für diese, Ich werde die Farbe verwenden Diese hier bereits ein Mitglied anmelden. Okay, also ergibt das Sinn. Jetzt werden
wir auch eine Zeile hier hinzufügen, die so sein wird wie diese Morsi Es ist besser, Wiederverwenden Sie Ihre Elemente und das ist etwas hier drüben. Ich werde es benutzen. Okay, also lassen Sie uns den Knopf etwas nach unten bewegen. 24 Schweine Übel und wir müssen den Text, um es Konto ändern. Ok. Und wir werden zur Mittellinie gehen. Okay, bevor ich Kamanzi betrete, gehe
ich zurück, weil ich sicherstellen muss, dass sie die Mittellinie sind. Sonst geht es um die Dinge hier und da drüben zu bewegen. Okay, also Mittellinie. Und jetzt, wenn ich versuche, etwas geklärtes Konto zu verwenden, wird
es in der Mitte bleiben. Sie können sehen, jetzt ist es in der Mitte. Ich muss nichts ausrichten,
also stellen Sie sicher, dass, wenn Sie eine Schaltfläche erstellen und in der Mitte SMS schreiben, sie zentriert ausgerichtet ist. Ok. Ich glaube, wir haben das erschaffen. Ich brauche diese Sorte hier nicht. Vielleicht, ähm, ich denke, wir werden das Passwort zeigen. Was auch immer er schreibt, wir werden es zeigen. Vielleicht brauchen wir es. Oder hier. Ok. Also vielleicht möchte der Benutzer seinen Pass Erhardt Passwort während der Eingabe sehen. Wir werden es zeigen oder schlagen. Also, nein, wir brauchen eine Navigation hinter dem ersten vorherigen Bildschirm, der hier drüben fehlt. Und dafür werden
wir in unsere Bibliothek gehen, und wir werden ein bisschen hineinzoomen und wir werden sehen, wo die Navigation ist? Okay, also brauchen wir dieses Jahr. Dies ist linke Navigation und was wir von ihm brauchen, ist dieses eine linke Zubehör? Ja, ich gehe die Zehe. Kopieren Sie das. Jetzt können Sie sehen, dass ich dieses Steuerelement von RNC ausgewählt habe, und ich gehe zurück zu meinem Bildschirm und ich gehe toe basiert es hier drüben. So etwas. Okay, jetzt können Sie sehen, dass wir wieder auf den Bildschirm einloggen. Und jetzt müssen wir die Farbe in etwas anderes ändern, weil wir etwas haben. Und so sind wir hier. Und ich denke, vielleicht können wir zu einigen anderen Farben gehen
, Das ist ein bisschen schärfer blaue Farbe, wie diese, que Auch für diese. Ich werde das benutzen, weil wir es von diesem trennen müssen. Okay, vielleicht können wir das
hier benutzen . Dieser sieht auch gut aus. Es spielt keine Rolle. Okay, also okay, jetzt denke ich, dass unser Bildschirm fertig ist und es sieht kreativ aus. Ich denke, alles. Alles, was sechs gemacht hat, sollte es sein. Und wir haben gerade vier Felder ausgedacht, um diesen einfachen Anmeldeprozess zu erstellen. Dies ist wirklich in der Benutzererfahrung von jeder App benötigt. Lassen Sie uns fortfahren, um neue Bildschirme in der nächsten Lektion zu erstellen.
47. Dashboard-Design Teil 1: Okay, jetzt in diesem Hören, werden
wir dieses fantastisch aussehende Dashboard erstellen. Und dafür, dass davor, wir gehen Zeh, sehen einige von den Farbänderungen. Also, was ich getan habe, ist, dass ich es dir zeigen lasse, bevor dieser Knopfkrieg sie hatte. Du gehst auf 11 oder zwei. Dann schätze ich, jetzt habe ich mich auf 218 geändert. Jetzt ist es in einem etwas purpurpuren Farbton. Nun, warum ich es getan habe, weil unsere verfärbt diese Farbe in dem Farbton von 20 ist. Okay, wenn du
also zwei Farben verwendest, will
ich nicht, dass du zu viel hast. Der Unterschied zwischen dem, wer ein oder zwei Punkte ist gut, aber mehr als das wird völlig andere Farben aussehen. Ok. Außerdem wollte
ich von dieser Facebook blaue Farbe getrennt sein. So ist es ein bisschen von lila blaue Farbe. Wenn Sie mehr ändern möchten, wie vielleicht mehr Sättigung hinzufügen, mehr zusammenarbeiten, können
Sie es hinzufügen. Sie können jetzt sehen, wie es anders aussieht als diese beiden Mörder. Okay, das ist
also unsere primäre Interaktion hier drüben. Okay, jetzt werden wir anfangen, dieses zu entwerfen, also wechseln wir zu unserer anderen Kunsttafel, wo wir entwarfen. Also lasst uns anfangen. Weißt du, hier sind wir auf dem Bildschirm, und ich denke, wir werden mit diesem anfangen, also werde ich es so duplizieren. Okay, also werde ich es als Nächstes aufstellen. Snam es Armaturenbrett. Okay, also was brauchen wir hier drüben bei allem anderen, was wir löschen werden? Okay, also werde ich es Toe Dashboard nennen, und wir werden es in der Mitte so ausrichten. Mal sehen. Was ist der 64? 64? Okay, das ist perfekt. Nein, wir werden es so willkommen nennen. Okay, also gehe ich den Zeh, ziehe ihn nach unten, und wir werden eine Ellipse mit einem Ellipsehocker erstellen. Okay, das ist
also weit, dass der Abadan vom Arzt entfernt ist. Wir sind hier. Lasst uns die Grenze jetzt verschieben. Wir werden im Grunde die weiße Grenze mit vier saudischen vier Dicke verwenden. Okay, jetzt ziehen wir das Bild hierher. Okay, das ist
also das Bild von ihrem Arzt. Lassen Sie es uns hier reinziehen. Und es sieht jetzt gut aus. Außerdem werden
wir die Farbe in Stark Black für diese Begrüßungsnachricht ändern. Nächstes Verschieben Sie es näher. Zehe dieses Arztes Bild ein Schlüssel. Okay, also ist das erledigt. Versuchen wir, diesen unteren Bereich zu verwenden und die Navigationsleiste zu erstellen. Sind die Symbolleiste hier drüben? Okay, das nennt man Goldbarren im
U.S. U.S. Design. Und eigentlich in Ordnung. Nun, lassen Sie mich Ihnen zeigen, dass die Größe von diesem. Ah, Armaturenbrett. Entschuldigung. Das ist Board Art Board Board ist 375. Wenn wir es also mit drei
teilen, dann teile ich es mit 33 75 geteilt durch drei. Also ist es 1 25 Okay, also werden wir schaffen. Entschuldigung. Also, was wir werden es sein, ist, dass wir drei Boxen von 1 25 Urteil Peer, und sie werden als eine ganze Flasche Navigationsleiste fungieren. Okay, okay. Also davor werde
ich in meinen A-Sex-Ordner gehen, und ich werde diesen Apfel holen. Ich uns und wir werden die gleichen Design-Spezifikationen für Toolbar oder die Höhe und
auf der Deckgröße verwenden , die Apple hat. Okay, das sind also ihre Spezifikationen. Mal sehen, ist eine Symbolleiste. Ok. Also Okay, also gibt es zwei Beispiele, die Sie verwenden können, ist dieses. Und der andere ist dieser hier. Okay, also im Grunde, wir brauchen so etwas mit Titeln, also werde ich die Kommandosteuerung C kopieren und ich werde zahlen bleiben weg. Also werde ich es nach unten kleben, und wir werden es in unsere Farben ändern, wo wir mit blauen und
violetten Zehenfarben gehen . Also lasst uns das machen. Okay, jetzt kannst du hier drüben sehen. Das ist unsere Dad Bar. Und es ist Fell 49. Das ist die Hauptsache, die wir kopieren wollten. Oder auch, wenn Sie sich diese Textgröße ansehen, ist
es 10. Okay, also werden wir ähnliche Größen verwenden, weil dies die Standards sind. Also gehe ich auf die Zehe, entferne das, okay? Und wir werden das Sek.-Gewirr verwenden, Werkzeug-Zehe, ein Rechteck
erstellen, und wir werden die Größe. Er gewann 25. Also weiß ich nicht, warum sich diese Deckkraft ergibt. Okay, 1 25 und dann 49 wird seine Höhe sein. Wir werden die Grenze zu entfernen und Express V und Film nehmen den Boden und wir werden es ohne Optionstaste
duplizieren. Also eins und okay, dann werden wir horizontalen Verteilerabstand haben. Und so werden wir unsere Bar Bar erstellen. Lassen Sie uns hineinzoomen und Sie können sehen, dass es nur ein bisschen aus Problem gibt oder hier, wenn ich ein bisschen
mehr zoomen . Okay, jetzt ist es verschwunden. Aber wenn wir hinauszoomen, gibt es eine Linie zwischen diesen Schlepptau. Es ist nur die Darstellung. Ist es nicht wirklich da. OK, also werden wir die Farbe für diese,
die aktiv ist, verwenden. Und es wird,denke
ich, denke
ich, diese 11 91 90 in 90. Ok. Und dann für diese beiden, die inaktiv sind, werden
wir die Farbe verwenden, die unsere neue Farbe sein wird. Das sind 220 und 65 40% Richtigkeit, denn es wird eine große,
stumpfe Farbe sein . Also gehe ich mit den Zeh. Entschuldigung. Ich werde es hier drüben hinzufügen, wenn wir sie wollen. Wenn du willst. Entfernen Sie etwas Farbe, ziehen Sie es
einfach so heraus und es wird entfernt werden. Okay, also die gleiche Farbe für diesen hier. Okay, jetzt haben wir unsere Bar hier drüben. Sie haben Bobblehead, und wir brauchen Symbole. Und Dexter hier. Also, für Text, Ich werde dieses Textwerkzeug verwenden, und wir werden in saudi-text-tool schreiben. Lassen Sie uns Taipower, äh, Decs erste Acti-Aufgaben, und ich werde sie auf die Zehe abschneiden, dann ,
okay, so. Und ich werde die Farbe Weiß verwenden. Okay, das ist
also ein Safe. Du eine SMS. Ok. Alles ist aussehen, Singen scheint schön. Richtig? Klicken Sie auf und fügen Sie den Krypto-Stil hinzu. Okay, also haben wir diese kleinen Decks hier drüben, und wir brauchen unsere Ikone hier drüben. Ok? Also vorher werden
wir sie in der Mitte ausrichten, indem wir Shift auswählen und beide auswählen. Okay, also klicken Sie auf die Verschiebung und wählen Sie eine andere aus, und ich werde es ausrichten. Die Mehrheit ist bereits in der Mitte. Okay, jetzt werde ich es duplizieren, und ich werde es in der Mitte eines hier ausrichten, und das ist unsere Spüle, Deb. Okay, also haben wir das wieder in der Mitte. Das ist unser Zuhause, Dabord, Armaturenbrett. Wir können es auch nennen, denke ich Dashboard eher als zu Hause. Diesmal gehe ich also eher mit Dashboard als nach Hause. Okay, also lass es uns in die Mitte bewegen. Okay, also ist Text eingerichtet. Nein, wir müssen unsere Symbole mitbringen. Oder hier. Dafür haben
wir bereits über Icons im Ordner,
die ich bereits für U.
S beschäftigt Icons ausgewählt habe . Du kannst jede SPD benutzen, die ich dir mag. Außer dir. Eins ist dieses Zuhause. Ich muss es hierher bringen. Ok. Also einfach nach draußen kopiert, und ich werde es mit weißer Farbe füllen. Und ich werde seine Größe auf 32 Glasstadt reduzieren. Verwenden Sie es, um zu sagen, nächstes Video spricht Größe zwei 32. Okay, es ist immer noch groß, also werde ich mit 24 gehen. Okay, das sieht
also schön aus. 24 Größe, und ich denke immer noch, dass es ein bisschen größer ist. Was dann? Ich dachte schon. Ich werde diese Höhe auf 24 reduzieren. Wir werden verkleinern und sehen, ob dieses Symbol gut aussieht oder nicht groß aussieht, also sieht es für mich jetzt ein bisschen größer aus. Ich werde das auf 20 verschieben, um zu sehen, wie es aussieht. Okay, also 20 Blick erzielt. Lassen Sie uns das nach unten bewegen und etwas nach unten bewegen. So, jetzt sieht es toll aus. Lasst es uns mitten in diesem hier bewegen. Okay, das ist
also unser Zuhause oder unser Armaturenbrett oder so etwas. Dann haben wir diese Aktivitäten hier. Wir werden ein anderes Symbol verwenden, das ist eine Seite Seite mehrere Symbol, das ich dachte, dass es zu dieser Kategorie passt, wo wir eine Menge verschiedener
Dinge durchführen werden . Okay, jetzt können Sie sehen, dass es mehrere Formen hat. Also, was wir tun werden, ist, dass wir all diese Schiffe zu einem kombinieren, also werde ich sie Gewerkschaften hinzufügen. So, jetzt können Sie sehen, es ist einmal Form, und wir können nur die Farbe auswählen und ändern Sie es einmal, und das ist alles. Okay, also werde ich es hierher schieben, und lasst uns seine Größe Zehe 20 ändern. Ich konnte nicht, wie du warst? Siehst du, es ist fast dasselbe. Stellen Sie sicher, dass Ihre oberen und unteren Entfernungen für Ihre Symbole und Ihre Extricate gleich sind. Also dieser Text ist, wenn Sie ungerade drücken, ist
es vier Pixel von unten entfernt, also werde ich diesen einen Zeh machen. Sieben Schweine. Frontal-Baum. Ok. Außerdem gehe
ich zu sieben Schweinen Tonbildern. Perfekt. Okay, jetzt brauchen wir ein Waschbecken. Ich bin hier rüber gegangen und ich werde etwas hinzufügen. Ich Mais, die diese Schleife waas. Ich denke, jetzt können Sie sehen, wie alle diese Farben sind sehr hell und sehr scharf oder haben eine Menge Sättigung. Also, warum Farben gut aussehen? Okay, also musst du sichergehen. Vielleicht sieht es manchmal nicht gut aus auf Ihrem Farbskin-Schema, so dass Sie zu schwarz
oder so wechseln können . andere Farbe aus Ihrer Wahl. Okay, das ist
also unsere Registerkarte sind komplett. Ok. So können Sie sehen oder hören. Dies ist unsere Registerkarte sind jetzt. Ich denke, wir sollten es gruppieren, damit wir es leicht so benutzen können. Org. Okay, also stelle ich nur sicher, dass es nicht mit unserem Hintergrund gruppiert ist. Das ist also unsere Gruppe. Lasst uns zusammenreißen. Ah, Dad, Bar so etwas und ich werde es unhygienisch machen. Okay, also ist unser Tambor jetzt komplett.
48. Dashboard-Design Teil 2: Lassen Sie uns lange Gold- und Logging-Buttons hier erstellen. Okay, also werde ich es benennen, loggen Sie sich aus. Und ich werde die Zehe gehen. Bewegen Sie es von hier, und ich werde es bewegen. Ein 24 5 Also vielleicht hier drüben, um sich damit zu kleiden. Okay, lass uns mal sehen. Was ist die Entfernung? Acht Pixel. Okay, das ist
also gut. Okay, jetzt, hier
drüben, werden
wir Ah benutzen, diese Hamburger-Symbol eine Zeile
gelöscht, und es wird in dieser Farbe sein oder vielleicht verfärben. OK, also werde ich diese Farbe verwenden, tun für die Größe ein direkt aus dieser Linie, und ich werde verwenden. Vielleicht werde ich es 24 Pixel breit machen. Lassen Sie es uns duplizieren. Es gibt viele Möglichkeiten zu erstellen Manchmal viele Leute, die sie mit diesem Wiederholungsraster erstellt , und sie wiederholen es einfach so. Ok. Und dann sind sie genau die Größe dazwischen. So etwas wie das. Aber ich habe versucht, es anders zu benutzen. Ich mag einfach nicht, weil ich die mittlere anpassen muss, also gehe ich Zehengröße es Zehe 18 Pixel, und die letzte werden auch 24 Picks ist so. Also werde ich das glauben, okay? Nein, wir haben unsere Hamburgerkarte gebaut. Lass es uns bewegen. Gruppieren Sie sie. Ok. Wählen Sie alle diese aus. Drei. Der linke Zugang E. Komm schon, G. G.
Okay, was ich tun werde, ist, dass ich sie zu einer Form kombinieren werde, also muss ich die Farbe nicht immer wieder ändern. Also werde ich diesen Brugler benutzen, weil es so ist. Ich denke, es ist die gleiche Farbe für dieses Logout. Okay, also denke ich, das ist gut. Wir müssen die Entfernungen mit den Apple-Spezifikationen überprüfen. Also werde ich hier rüber gehen und sehen, was der Abstand von diesen Accessoires ist. Machen Sie die Grenzen. OK, also werde ich doppelklicken, doppelklicken Sie erneut, wenn wir dies reflektieren und sehen, was die Entfernung ist. Es ist also eine Zitrone. Pixel sind 11 Punkte eines ähnlich, diese, Also werde ich sehen, es ist fast ich denke 12.6, das ist 11 oder 12. Okay, also ist es 11 oder 12. Wie denken. Okay, also werde ich jetzt 12 benutzen. Es sind acht Pixel, also werde ich es hier rüber bewegen. 1234 Und auch dieser 11 Tau-Häuptling. Jetzt können Sie sehen, wir haben Wir verwenden die gleichen Spezifikationen, die wir verwenden. Okay, also müssen Sie sicherstellen, dass diese Entfernungen und alles Ihren Vorgaben entspricht , die Apple dort drin hat. Du weckst es auf. Okay, also haben wir das. Also, jetzt werden wir den mittleren Bereich schaffen, der hier drüben bei einem Gewirr geräumt ist. Warum? Regie? Und ich werde die Grenze entfernen, und ich werde einige haben Chaos um sie herum. Vier Punkte. Und dann werden wir etwas aus dem Schatten nehmen. Vielleicht verlassen Sie jetzt einfach den Tierheim und ich werde Ah,
Dexter hier benutzen . Also werden wir das zuerst mit Text füllen, also werde ich es Bereichstext machen, und wir gehen zu unseren Vermögenswerten in diesem Bereich,
und ich werde unsere Vorwärts- und alles über Spezifikationen nutzen. Okay, jetzt werden wir diese eine Zehe 347 ausmessen. Hoppla. 3 47 Also werde ich es in der Mitte ausrichten, also benutze ich so viel Bereich wie ich leben kann. Ich die meisten 14 Bilder auf beiden Seiten. Okay, also weißt du, du kannst hier sehen, dass wir das Ding haben und wir werden hier einen weiteren Knopf erstellen
, der gleich hoch sein wird. Okay, so wie das. Und wir werden ein Sein vier Fixierer verwenden, um die Grenze zu entfernen. Die Farbe wird 1 91 Aber wir werden es auf etwas anderes wie 100 83
Helligkeitstaste ändern . Es wird also scharfer und ein bisschen langweilig, wie dunkel. OK, jetzt können Sie sehen, dass dies unsere innere Taste in unserer App ist und ah, lassen Sie es ein bisschen über das ist es ein bisschen kurz machen. Und ich werde Schatten um ihn herum benutzen. Okay, das ist
also ein Knopf. Deshalb brauchen wir einen Schatten um ihn herum. Auch, wenn Sie zu diesem Hintergrund gehen, dieser Hintergrund, aber wir werden tun, ist, dass wir es entsperren, und wir können einige von den Werten ändern, wie,
ähm, vielleicht brauchen wir Helligkeit. Ach, lasst uns den Betrag ändern. Also gehe ich hier drüben mehr Blut, fast doppelt. Okay, also lass es uns auf fünf bewegen. Und ich gehe wieder. Lockett und ich denken, dass es besser ist, hier drüben mehr Klarheit zu haben, denn in unseren anderen Bildschirmen haben wir nur versucht, den Benutzer einzusperren oder einen neuen Konkey zu erstellen. Soho war hier. Ich habe es ein bisschen mehr verschwommen. Und jetzt können Sie sehen, es sieht klarer aus und lässt Sie einen Text hier über die Last. Und wir brauchen Symbole hier drüben an der Seite. Und es gibt eine, ich denke hier über das Pfeilsymbol nach und, ah, lass uns in der Mitte bewegen. Das wird also ein bisschen unproblematisch sein, weil dieser Text Northern Line in der Mitte ausgerichtet ist, und das wird in der Mitte sein. Sieht so aus, dass es so ist. Ok? Und wir werden unseren Pfeil weit bringen, den hier drüben, was unser Wo ist unser Aargh? Aargh! Aargh! Sind das ist in Ordnung. Also, das ist Pfeil, also werde ich es hier rüber bringen. Also, ich denke, wir sollten noch einen Schatten ein bisschen mehr anstrengen, vielleicht 30%, weil wir mehr Schatten brauchen für die Last, die ich hier drüben benutzen werde,
und ich werde Ford oder hier benutzen. Okay, also 30% auf vorher, und das wird meine Werte für meine Knöpfe sein, und Sie können sehen, dass es wirklich schön aussieht. Okay, also ist eine Portion fertig. Wir brauchen, und ich bin hier rüber gegangen, das ist Link Icon. Okay, also brauchen wir kein Pech Black. Lassen Sie hier rüber. Okay, also ist das fast erledigt. Und jetzt gehen wir zum nächsten Bereich. Ist, dass ich denke, dass alles OK, also werde ich seine Größe ein bisschen mehr reduzieren, weil wir nicht brauchen, Zehengruppe dies. Margie, das ist eine Last, Bt und Lob. Und so werde ich es so nach oben
bewegen, dieses hier in diesem schwarz hochziehen es oben so
ausrichten. Als Nächstes. Bewegen Sie es etwas mehr nach oben. Sieht nicht nach einer Linie aus. Okay, also haben wir diesen Bereich abgeschlossen. Wir gehen auf die Zehe. Äh, wähle hier alles aus. Komm schon, G. Und das wird unser Armaturenbrett sein. Und ja, OK, also ist das Dashboard-Idee, und ich werde es hier drüben so duplizieren. Vielleicht schieben Sie es runter. Aber das hier. Okay, jetzt werde ich das zu grau färben, sind vielleicht eher wie ein Grau. Und wir brauchen eine große in der blauen A Okay, also werde ich fiskalisch dieses so etwas verwenden. Okay, jetzt kannst du sehen, wie cool diese Farbe aussieht, okay? Also versuchen Sie nicht, eine Farbe zu verwenden. Das ist, so werde ich die Zehe gehen. Versuchen Sie ein oder zwei Mörder so. Sie können sehen, dass es eine weitere Farbe gibt. Mm, hier
drüben. Okay, also habe ich Stammgäste hinzugefügt, und ich werde sie alle ausprobieren. Ich denke, dieser sieht aus, sind vielleicht diese. Okay, also werde ich es so lassen, und ich werde den Schatten von hier entfernen, weil diese Schaltfläche deaktiviert ist. Okay, also können wir das nicht drücken, also werde ich hier Text verwenden. Okay, also müssen wir denken,
Waschbecken , Waschbecken. Okay, also lasst uns dasselbe benutzen. Ich bin hier rüber gegangen. Dieses, und kopieren Sie es und fügen Sie IQ waren hier und bewegen. Bewegen Sie es, Lex. Ändern Sie Ihre sculler toe die Stelle waas 24 Pixel Entfernung und alles sieht gut aus. Okay, also, ähm, ich denke, das sieht gut aus. Das sieht also toll aus. Okay, also sieht alles gut aus. Wir haben unseren Haupt-Dashboard-Bereich gebaut, und in der nächsten Lektion wir unseren Folienbereich erstellen, der
die Seitenmenüleiste sein wird, wenn wir dieses Hamburger-Menü gedrückt haben. Also erscheint der Bereich, den wir in der nächsten Lektion entwerfen werden. Gehen wir also zur nächsten Lektion über.
49. Sidebar: Okay, also lasst uns anfangen und das schaffen. Ah, genial aussehende Sidebar. Navigation. Okay, was wir
jetzt tun werden, ist, dass wir mit unserem Dashboard beginnen und es replizieren werden. Drücken Sie die gesamte Taste oder Optionstaste. Und hier haben wir eine Kopie vom Versteck. Nein, was ich tun werde, ist, dass das Sidebar sein wird. Also, was ich tun werde, wird in die alle Ebenen und alles gehen, und wir werden alles auswählen und eine Gruppe erstellen. Margie, lasst uns diese 12 entbinden und das wird auch in dieser Gruppe sein. Ja, ich gehe die Zehe. Nennen Sie es. Armaturenbrett Okay, hier haben wir unser Armaturenbrett. Hoppla. Irgendwas stimmt damit nicht, denke
ich. Okay, also werde ich es nach unten verschieben, was der Hintergrund war. Und jetzt, was wir tun werden, ist, dass wir ein weiteres Rechteck oben darauf verwenden und Hintergrund,
Blut, Blut, genau
das gleiche Geschäft verwenden. Okay, also haben sie die Randhintergrundunschärfe verschoben, und wir werden so etwas verwenden. Sechs. Hoppla. Auf Vielfalt, wird
dies sechs Helligkeit wird minus fünf sein. Und die Deckkraft wird 15 sein. So etwas. Okay, diesmal benutze ich ein bisschen ihre dunklere Farbe hier drüben. Sie können es auch verwenden, um zwei oder so etwas zu minus. Nein, die Deckkraft. Die Helligkeit minus zwei. Okay, das ist das, was wir in der Tasche brauchen. Nein, nein, wir haben den Rücken erschaffen. Jetzt werden wir verwenden und andere Rechteck oben drauf, und wir gehen Fuß. Ah, ziehen Sie es von hier und gehen zu füllen Fast 2 36 waren auch. Ok. Und ich werde die Höhe gleich der Grenze machen. Und wir werden die Farbe verwenden, die diese für unsere Website ist. Nie. Und wir werden etwas Schatten um ihn herum benutzen. Also, um es ein bisschen zu machen, okay, also werde ich die Erklärung dafür verwenden, weil wir den Schatten Toby in Zerstörung
von links nach rechts brauchen . Okay, also wird Schatten hier drüben sein, also werden wir das hier benutzen. Entschuldigen Sie es. Null auf der Via Position, und ich werde vier hier drüben benutzen. Okay, lass uns mal sehen. Jetzt siehst du hier ein bisschen Schatten. Ein Gebäude hier drüben. Wir müssen es ein bisschen mehr Zecken auf Release 20% machen. Und ich werde acht hier drüben benutzen, um es ein bisschen mehr zu verbreiten. Okay, hier haben wir den Schatten, dass dieses Element an der Spitze von diesem ist. Okay, also kannst
du es auch etwas heller machen, wenn du willst, also wird der Schatten klarer. Okay, jetzt können Sie sehen, dass der Schatten klarer ist. Als nächstes verwenden Sie die gleichen Werte minus eins. Und über diesen hier. Okay, also haben wir unsere Seite, aber wir sind hier, und jetzt werden wir dasselbe benutzen. Aladar . Und ich werde hier drüben strikt sein. Bringen Sie es hierher. Vielleicht können wir es auf 72 mal 72 drücken, anstatt es etwas größer zu machen. Also werde ich es zu einem kleinen machen. Und wir werden einen anderen Dexter hier benutzen, was sein wird, dass ich Profil gemacht habe. Jetzt können Sie sehen, diese Farbe sieht auch gut hier drüben, weil es das gleiche Mädchen wie diese Hintergrundfarbe ist. Aber jetzt werden wir eine Atomkraft einführen, die unsere gelbe Farbe sein wird. Dies ist die 3. 1 wird Hugh 54 41 Situation und 100% Rabatt Helligkeit sein. So ist es sehr helle Farbe und gelb Sie und Sie können hier drüben sehen. Okay, also haben wir über das Bearbeiten Profil oben, und jetzt werden wir einige aus dem Bereich verwenden würde hier wie das, okay. Und entfernen Sie die Grenze. Es wird eingeladen, aber ich werde einige von der Deckkraft verwenden. Okay, also denke ich, es sollte sein, dass es nicht sein wird. Vijit wird verfärbt sein. Fast. Okay, also werde ich V drücken, und wir werden ein Symbol hier drüben haben, das unser anderes Symbol ist. Schließen wir diesen und gehen Sie zu unserem Ordner. Sauber, trocken, Khan. Und ich werde es in die in meinem dieser 80 unsere Haare ziehen und mal sehen, wie viele Box es hat. Es hat also viele Teile, viele Schiffe, also werde ich sie kombinieren. Verbünde sie. Okay, also stellen Sie sicher, dass das die gleiche Form hat. Okay, jetzt werden wir deinen Sculler wechseln. Dwight, das ist unser Kalendersymbol, und wir werden es groß machen. 24 Fixes wie diese. Ich werde es in der Mitte davon ausrichten, und wir werden etwas Textur verwenden. Wir sind hier, was in der Mitte sein wird. Und ich gehe zu meinem Vermögen, unserem Styleguide. Und ich werde diesen weißen Text wählen. Roy. Jetzt können Sie sehen, dass es perfekt aussieht. Lassen Sie uns ausrichten. Zieh sie ab. Ich dränge. Verschiebung in der Mitte richtete auch diese in der Mitte aus. Das ist es schon in der Mitte. Okay, jetzt haben wir unseren Knopf. Deine Haare wurden hier drüben benutzt, der X-Kreis ist. Also werde ich den Drachen hier drüben so reingehen. Verwenden wir es zuerst draußen, damit wir seine Chips kombinieren können. Okay, also gibt es zwei Formen, die Lex verwenden, sie schnell ändern, also werde ich es schnell ändern. Als nächstes, Machen Sie diese Größe auf 24, die sehr klein ist, weil ich Fuß tippen Sie es. Mein Benutzer wird Fuß gehen. Tippen Sie es mit den Finger, also werde ich es ein bisschen größer machen. Taste wählt die Verwendung 32 aus. Das ist also gut. Außerdem denke
ich, das sieht etwas kleiner aus, um es auch 32 zu machen. Verkleinern Sie, und sehen Sie, wie das aussieht. Sieht es aus, sieht es zu groß aus? Ja. Okay, also werde ich wieder 24 verwenden, was gut aussieht. Schön. Wählen Sie beide mit Shift aus. Also, wenn Sie versuchen, etwas auszurichten, müssen
Sie es mit etwas anderem ausrichten. Sonst ein Objekt. Sie müssen beide auswählen, indem Sie die Umschalttaste drücken. Okay, jetzt hat dieses Boot ausgewählt, also wird es in der Mitte sein. Okay, das sieht
also geklärt aus. Warum? Ich habe alles nach unten verschoben, weil die meisten von den Interaktionen, die 70 bis 80% verwenden , jetzt stürzen. Der beste Bereich für getrommelte Richtung ist dies Sie werden nicht verwenden Sie wissen, das Top-Radio . Außerdem werde
ich es ein großes nach oben bewegen, weil es ein wenig nach unten schaut. Okay, also werde ich von Brasilien Jahr Kalender und Rechteck ändern. Warren G, das wird meine Speisekarte sein. Hoppla, das tue ich nicht. Und lasst uns ins Ziel und schießen. Okay, das sieht
also gut aus. Als Nächstes. Bewegen Sie es etwas nach oben. Ok. Also werde ich es mittendrin bewegen, was nicht so aussieht. Es ist in der Mitte. Okay, also lasst uns das ein bisschen nach oben bewegen. Und auch dieses, weil es zu viel an der Unterseite ist. Ja. Jetzt sieht es besser aus. Und wir haben unsere Sidebar hier fertig gemacht. Und ich hoffe, Sie haben diese Lektion genossen. Wenn Sie Fragen haben, um mich zu stellen, lassen Sie uns weitermachen und die anderen beiden Bildschirme erstellen, die Aktivitäten und Waschbecken sind.
50. Actitivies Screendesign: Okay, jetzt, unaufhörlich. Wir werden diese Aktivitäten Bildschirm erstellen, und ah, wir werden diese API große Funktion von Adobe X verwenden Steve Kanten können Sie sehen oder hören Onkel, Erstellen dies ist eine große und wir werden es replizieren und verwenden Sie diese tolle Funktion, um die Haut zu
entwerfen. Okay, also wird es sehr weniger Zeit in Anspruch nehmen, denn die meiste Zeit denke ich waas für das
Versteck , weil es viele verschiedene Elemente hat. Und jetzt gehen wir mit diesem hier. Also lasst uns anfangen. Also werde ich zu diesem gehen und wir werden das
duplizieren. Ich werde es hier unten duplizieren, und wir werden es nennen,
eigentlich, was bedeutet, dass meine Schreibweise nichts ausmacht, wenn sie falsch liegen. So ist es. Und jetzt werde ich drücken. Komm schon, einer wird kontrolliert. Eine Zehen lassen die Zehe meinen Bildschirm weg, und wir werden das und das hier entfernen. Okay, also werde ich das hier als meine Beurteilungsbeurteilungen verwenden. Nein. Also waren es Aktivitäten, Aktivitäten, und ich werde es so in die Mitte bewegen, und dieser Konvoi war 64. Also werde ich es an den Ort bringen, an dem es okay sein sollte. Jetzt haben
wir viel Platz, und wir werden Wiederholungsgut schaffen. Aber davor werden
wir soviel Platz nutzen wie wir,
oder hier, um dieses wiederholte Glaubensbekenntnis zu schaffen. Also werde ich fast so viel Platz verlassen, und ich werde die Farbe vied verwenden. Okay, und wir werden acht Pixel hier drüben verwenden, wenn du willst. Oh, benutze mehr außer dir. Okay, Nacht. Jetzt werde ich es benutzen, und ich werde etwas Schatten verwenden, weil es den fähigen Zustand unterdrücken wird. Es sollte fähig sein. Also werden wir mit Signifiers zeigen, dass dieser Zustand möglich ist und es 20% schwarzer Schatten sein wird . Sie können jetzt sehen, wie es aussieht. Es sieht so aus und so aus. Okay, es sieht
also gedrückt oder möglich aus. Dann werden wir einen Text verwenden, der hier drüben sein wird, wie diese Bewertung. Und wir werden unseren schwarzen Text hier drüben verwenden. Lass es uns in die Mitte bewegen. Und, ah, wir müssen das Gleiche auch bei überbelegter Verwendung hier drüben verwenden. Also werde ich es kopieren und diese Anzeige hier drüben verarschen. Ändern Sie seine Farbe Zehe, diese. Und ah, wir können auch die andere Farbe verwenden, die 83 war. Entschuldigung. Nein. 90 und Entität. So Helligkeit reduziert Helligkeit, um es Whitmore matt und dunkel zu machen. Also werde ich das einfach so machen und es hierher schieben. Okay, also wird das ganze Gebiet schrecklich sein. Also machen wir uns keine Sorgen darüber, dass diese Gegenstände von diesen Gegenständen platziert werden
,
damit ich näher an diese
Grenze gehen kann , . Okay, also 10 Pixel, also 10 Schweine sehen toll aus. Eine Sache, die wir hier erstellen werden, ist der Status, dass wie viele Gutachter Sie
abgeschlossen haben . Also werde ich eine Ellipse erstellen, den Rahmen
entfernen und für die Füllfarbe zu diesem gehen. Im Moment werden
wir es so etwas ändern, und wir werden weniger Helligkeit 55% oder vielleicht weniger 50% vielleicht mehr oder weniger. 40%. Okay, das sieht
also gut aus. Und ich werde Textwerkzeug verwenden, um etwas hier drüben wie diese fünf zu haben. Okay, also müssen Sie sicherstellen, dass, wenn die Box auf die Zehe geht,
zwei Werte haben also müssen Sie sicherstellen, dass, wenn die Box auf die Zehe geht,
zwei Werte haben,
so dass es immer noch cool aussieht. , Okay, wenn diese Ellipse keine 22 oder 21 oder zweistelligen Werte enthalten kann, wird
es ein Problem mit Ihnen sein. Ok. Stellen Sie also sicher, dass Ihr Schreibtisch für diese Grenzen ausgelegt ist. Ok? So geht es nicht in die Mitte. Richten Sie es darin aus. Machen wir es 36 Picks ist und ah, mal sehen. Jetzt, wenn es richtig ausgerichtet ist, ist
es besser. Jetzt kannst du es nach Belieben nach oben und unten bewegen, so wie ich es so mag. Also werde ich,
du weißt schon,
so etwas benutzen du weißt schon, . Okay, also werden wir hier wieder die weiße Farbe benutzen, und lasst es uns etwas nach unten bewegen. Du hast gesehen, dass es perfekt ist, und lasst uns versuchen, diese Dinge zu gruppieren. Margie, das werden unsere Lippen sein, die das gesteuert haben. Ok. Und lassen Sie uns all diese drei Dinge in der Mitte so ausrichten. Also, jetzt sind sie ausgerichtet. Lassen Sie uns sie gruppieren, damit wir sie an diesem Hintergrund ausrichten können. Okay, Okay, das nennt man eine perfekte Ausrichtung. Ok? Nein, wir haben unsere einzige Sache hier drüben, und wir gehen in die Gruppe. Gruppieren Sie es noch einmal. Es wird also unser Artikel sein. Ich komm handeln, es ist. Mach meine Schreibweise nicht aus. Ich meine Finger sind nicht in meiner Kontrolle. Okay, jetzt werden wir es replizieren, indem wir ein Wiederholungskrit erstellen. Und ich werde das eine B-Klasse halten, und ich werde es in diese Richtung so wiederholen. Okay, jetzt noch
eine Sache. Wir brauchen mehr. Hallo. Tür hier. Also werde ich sowas wie 850 benutzen. Okay, was ich jetzt tun werde, ist, dass ich diese Stadt auch in eine große Stadt wie diese verschieben werde, dieser Hintergrund wird sich ändern. Ich werde es freischalten, und wir werden ihre Größe erhöhen. So etwas, so
etwas. Ich werde es hierher bewegen, damit wir seinen Arm nicht sehen oder hier. Also werde ich es so bewegen. Vielleicht so. Und auch werde ich die Menge reduzieren,
lernen, drei. Okay, also haben wir unseren Hintergrund und alles. Ich werde das noch ein bisschen mehr duplizieren. Okay, so bis zu. Das ist ein 12345678 Also habe ich acht hier drüben. Ich werde den Abstand zwischen ihnen einstellen, also gehe ich in diesem Bereich und versuche es so viel wie möglich zu drücken. OK, also 14 sehen erzielt aus. Und ich denke, die Größe dieses hier ist 67, was leicht in der Lage ist. Also, wenn ich versucht habe, es bereits zu 62 verwenden, können Sie sehen, alles andere eingeführt wird. Das sind also die medizinischen Therapiegruppen. Wenn ich versuche, die Dinge in der 1. 1 zu ändern, wird es in allen von ihnen reflektiert werden. Also, jetzt werde ich die Größe auf 10 reduzieren. Und jetzt können Sie sehen, dass ich noch einen haben kann. Wir sind hier. Das wird also gewollt werden. 3456789 neun. Okay, was ich
jetzt tun werde, ist, dass ich einige,
ich denke, hier drüben kopiert haben werde, was meine Textdatei sein wird. Und das ist schon meine Steuerakte. Bereit. Beurteilung. 123456789 10 11. Das sind Zitrone. Und das sind 1234569 Okay, also werde ich sie von hier entfernen, okay? Also lassen Sie sie einfach so und sehen, was passieren wird. Okay, also werde ich diese und dann diese Bewertung auswählen, und ich ziehe meine Textdatei. Oh, drauf. Okay, das ist die Akte. Ich werde diese Akte hier drüben benutzen und sie hier ablegen. Ok. So können Sie jetzt sehen, dass der gesamte Text geändert wurde. Automatisch. Medizinisch. Okay, das ist
also kreativ. Sie können sehen, das ist, wie ich es mag. Wenn Sie einige dieser Werte ändern möchten, können
Sie auch eine Datei erstellen. Oder Sie können nur einen Zufallswert wie diesen verwenden. Oder vielleicht 05 hier drüben. Die Glocke Sammlerstück Häkchen, Doppelklick eingeben und mehr Details. Und Sie können auch die Steuer- oder Befehlstaste drücken. Gehen Sie direkt zu dem. Okay,
Also, wenn Sie dies nachlassen, wird
dies das ganze große auswählen, dann doppelklicken Sie, um dies eine diese Gruppe und dann diese Gruppe auszuwählen. Wenn Sie all dies vermeiden möchten, können
Sie Befehl,
Steuerung oder Befehldrücken Steuerung oder Befehl und einfach hier so hinübergehen und doppelklicken und diesen auswählen. Also gehe ich auch zu Jane, ein paar von den Werten hier drüben, nur um sicherzustellen, dass es zufällig und gut aussieht. Ok. Außerdem denke
ich, dass diese Farbfarbe ein bisschen anders als meine gestaltete Farbe ist. Also werde ich mit so etwas anderem gehen. Okay, jetzt ist es näher zu dem, was ich tatsächlich entworfen und verwendet. Okay, Sie können hier drüben sehen, wir haben wiederholt Zehe sofort erstellt das,
und ah, das ist alles, was ich für dieses Aktivitätsfenster denke. Und eine Sache, die wir hier tun müssen, ist, dass wir diesen aktivieren und diesen deaktivieren, also bin ich nur, wir werden uns ändern. Die Farbe fängt an. Okay, also sind wir fertig mit dem Bildschirm, und ich hoffe, Sie haben diese Lektion genossen. Dies ist die Ausschalten der Wiederholungsklasse. Und lassen Sie uns zur nächsten Lektion übergehen, wo wir dies anpassen, um gut zu sein und unseren Spülbecken Bildschirm zu
erstellen
51. Bildschirmdesign synchronisieren: Okay, jetzt in diesem Hören, werden
wir diese Senke zu Wolken-Bildschirm erstellen, und ich bin froh, dass wir das Ende dieses Entwurfsprozesses erreichen, weil diese langen Videos mit meiner Boarding Stimme könnte, Sie Wissen Sie, lassen Sie schlafen gehen. Okay, also geh nicht schlafen. Wir werden das Design dieses Bildschirms verwenden, und wir werden den gleichen Bildschirm wie dieser verwenden. Aktivität ist eins, und wir gehen Zehe reduzieren diese Wiederholung gut und schaffen eine Taste und den Senkenstatus
hier drüben . Okay, das ist
also alles. Fangen wir damit an. Und ich werde diese schließen, und wir gehen zurück zu unserer Design-Skin, die wir weniger duplizieren diese Aktivitäten und machen es sinken Bildschirm. Okay, also werde ich ihre Spüle ändern, Zehenwolke, und ich werde es in der Mitte schaffen. Also, jetzt gehe ich zu diesem. Benutze die gleiche Wiederholungsnote und mach sie kleiner, und ,
ah, wir werden die Textdatei Zehe benutzen, alles hier rüber
bringen, diesen vier Text oder hier. Also lasst uns diese Textdatei verarschen. Das ist also unser Textbildschirm. Sie können Interesse sehen, interessierte hochladen. Herunterladen bedeutet, einen Lead aus der Cloud hochzuladen. Okay, also werde ich diese Datei hierher ziehen. Okay, hier haben wir diese Steuer für die Feuerbeckung. Davor werde
ich diejenige auswählen, die ich ändern werde. Also dieser und ich werden diese Datei hierauf fallen lassen. Leah. Also, Jack. Ok. So können Sie sehen, dass unser Text bereits fertig ist. Okay, was wir jetzt tun werden, ist etwas aus. Diese sind deaktiviert, daher benötigen wir eine deaktivierte Farbe oder ein bisschen aus der Erstellung. Ein wenig Haarseifen. Also gehen wir in die Gruppe dieser Klasse, und ich werde Sie von den Farben hier drüben ändern. So wie dieser hier. Ich werde es ändern, Zehe diese Farbe und auch diese. Ich werde es zu dieser Farbe ändern, die eine große gräuliche ist. Okay, also 00 oder einfach sagen, Null in der Mitte eines 00 sieht ein bisschen hart für mich aus. Okay, also gibt es kein Interesse für den Download, und dann werde
ich auch den Schatten daraus entfernen. So ist es nicht brust fähig. Das sind alle möglich, also werde ich diese einfach deaktivieren. Okay, wenn du
also etwas anderes deaktivieren willst, kannst
du die gleiche Gnade tun. Also Ihr Stil ist Ihre Farben müssen dem Benutzer sicher sein, dass dies nicht in der Lage ist. Dies ist kein Klick leisten. Ok, also das ist ah, bisschen off leisten endet und bedeutet Konzert, das ich in meiner Benutzererfahrung für Bigness Partituren diskutiert. Und ich hoffe, wenn Sie fahren, wenn Sie es nicht gesehen haben, sollten Sie es nehmen. Und dann gehen wir auch Zehenfarbe dieses Schlepptau diese hervorgehobene Farbe und dies wird im Dunkeln
sein. Bläuliche Farbe. Okay, also ist das erledigt. Jetzt werden wir hier unser besseres Wissen schaffen. Auch. Wir müssen es hier rüber bewegen, weil wir keinen Zeh brauchen. Machen Sie es 667 Okay, so tut mir leid. 667 Sollte die Höhengruppen sein. Was geschieht, um dies zu reflektieren und wir werden 667 verwenden, die ein
Standard-Berichtsbildschirm für diese ap nächsten Film sechs es unten ist. Okay, wir haben unseren Bildschirm zurück, und jetzt werden wir einen Knopf hier drüben benutzen und ah, lasst uns einen Knopf erstellen. Oder vielleicht können wir diesen Knopf von allen hier bekommen. Okay, das ist
also unsere Knopfeinschätzung, und ich gehe mystisch mit hier,
und ich denke, es ist ein bisschen größer, also können wir es vielleicht etwas kleiner machen. Siehe Korpi. Oder vielleicht mehr. Siehe 100. Okay, also 300 sieht erzielt aus. Das ist entfernen Sie das. Hoppla. Sport ist hier drüben passiert. Ich möchte das sperren, weil ich es nicht immer wieder auswählen möchte. Okay, also werde ich das löschen, und wir werden es in die Mitte bewegen und alles versenken. Keine Rechtschreibung. Die Off-Synchronisierung ist nicht korrekt. Also werde ich sie korrigieren. Okay, wir brauchen ein Symbol hier drüben, das dasselbe ist, dieses, und ah, ich werde es kopieren und hier drüben einfügen. Okay, also schaffe ich es in diesem einen, in
diesem verzweifelten Zeh, krabbe es und ziehe ihn hierher, und wir werden es etwas größer machen, weil es hier sehr klein aussieht. Also werde ich 24 Größe oder Haare verwenden. Lassen Sie uns es in der Mitte so ausrichten und Ah, Hoppla. Mach es einfach. Oh, okay. Jetzt sieht das toll aus. Denk jetzt alles nach. Und ich denke, unsere Last ist fast erledigt. Mal sehen, wie es aus der Ferne aussieht. Es sieht also getrennt von hier aus leer aus. Also werde ich so eine Zehenpick machen. Okay, ich denke, das war gut zu OK, also machen wir uns keine Sorgen um zu viel von den Ausrichtungen. Okay, vielleicht können wir die Größe von hier reduzieren. So etwas. Jetzt sieht es ausgeglichener aus und lassen Sie uns es in der Mitte
so ausrichten . Okay, also, äh, nur ein Status hier drüben
, der unser Text dort zuletzt ist. Und ich denke, wir brauchen hier drüben einen
Textbereich. Lassen Sie uns die Farbe ändern, damit Sie sie deutlich sehen können. Und ah, wir gehen auf die Zehe. Warum ist das minus 24? Okay, also denke ich, das sind die Spezifikationen. Ich glaube, ich muss dem hier vertrauen, und wir wählen nur Außensoldaten in der nächsten Zeile aus. Ich werde es so in die Mitte gehen. Ich denke, es muss näher an dieser Last sein, weil es nur ein Status von diesem Knopf ist. Das macht also Sinn, weil Dinge, die näher an einander liegen, werden ich zusammen
betrachtet werden . Also sind sie beigefügt Okay, so singen Bildschirm ist fertig. Ich hoffe, Sie haben diese Lektion genossen. Das war ein schneller Weg, es mit unserer Wiederholungsnote zu tun. Und wenn Sie unsere geändert wiederholen wollen eine große zurück. Sie können alle auswählen und Sie können wieder einen Beat erstellen. Erstellen Sie hier drüben. Und Sie können es auch auf diese Weise erweitern. Weil was? Wir brauchen sie nicht. Okay, das ist alles für diese Lektion. Ich hoffe, Sie genießen diese Lektion. Fahren wir mit der nächsten Lektion fort, in der wir die Senke Toe Wolke Nachricht erstellen werden. Also, wenn wir diesen Knopf drücken, brummt die Nachricht, dass alles gesunken ist. Lassen Sie uns also Aufträge verschieben, die das letzte Grün von diesem Design erstellen. Und nicht langweilig werden oder nicht schlafen gehen. Okay, also bald in der nächsten Lektion.
52. Statusaktualisierung Bildschirm mit Statusaktualisierungen synchronisieren: Ok. In dieser Lektionist
dies die letzte Lektion aus unseren Designstädten. In dieser Lektion Und das ist unser Bildschirm, der die Zehenwolke versenkt. Wenn jemand gedrückt wird, lass mich es dir zeigen. Wenn wir diese Taste gedrückt haben, wird
es diesen Bildschirm anzeigen und alles wird synchronisiert, und es wird den Status geben. Dies wird also das Feedback in User Experience Design sind Usability Design genannt. Okay, also sollten wir unsere App ah sagen, dass dies auf diesem Haar getan wurde. Das ist noch ausstehend oder so etwas. Das ist also die Feedback-Nachricht, und das ist die Abteilung von unserem US-Betriebssystem. Eso, wir werden es von meinem Usu I Design Kind leihen. Also lasst uns loslegen und diesen Bildschirm jetzt entwerfen. Okay, jetzt gehen wir gegen den Start von diesem Bildschirm und replizieren ihn einfach. Und das ist Spüle Bildschirm. Okay, also wird alles sinken. Okay, was wir tun werden, ist, dass ich das freischalten werde, alles mit Shift-Befehl, G Kontrolle G, und das ist unsere Sink-Bildschirmtaste. Und was wir tun werden, ist, dass wir das sperren, damit wir es nicht auswählen. Und ich werde Zehe ein weiteres Ebenenrechteck an der Spitze erstellen, ihn von der Grenze Hintergrund Unschärfe. Und ich werde den Wert verwenden, um fünf Helligkeit zu sein. - Toby. Minus Zehe. So etwas wie das. Die Kapazität wird 15% betragen. Okay, jetzt werden wir uns die Nachricht von unserem Rus ausleihen und die US Kate öffnen. Trägt Ihr Sketch hier? Wir haben nur einen Doppelklick darauf, und es wird sich öffnen, aber nicht öffnen. Komm schon, Tzeitel. Und komm mit einem oder kontrolliere eins. Hoppla. Lassen Sie mich sehen. Wo sind die Nachrichten? Also hier haben wir die Nachrichten, die Sie hier sehen können. Das ist eine Botschaft. Also gehen wir zehen schlaff. Diese Nachricht. Komm schon und sieh mal, das nennt man eine Warnung. Command Control V. Okay, also haben wir diese Nachricht hier drüben. Okay, also ist es groß in einer grauen Farbe. Ich ändere es. Teilen. Ich denke, das muss bei uns Design möglich sein. Also werde ich weiß hier drüben benutzen, und auch, ich werde einen Teil des Schattens hier drüben benutzen. Okay, so habe ich diesen Titel benutzt. Ich bin mir nicht sicher, ob es in unseren USA möglich ist, denke ich, es wäre möglich, nur die Farbe zu ändern. Alles andere ist gleich. So sinken. Ah, und hier werden wir das sagen und das wird geschehen. Okay, das ist
also unser Bildschirm, und gehen wir zurück und ändern Sie die Helligkeit von minus Entschuldigung, minus drei. Es ist also langweiliger, damit wir diese Botschaft deutlich sehen können. Okay, auch, ich werde die Schattenspitze auf eine dunklere Seite bewegen. Okay, jetzt sieht es besser aus. Okay, das ist
also unser Bildschirm an. Und wenn Sie diese Farbe ändern möchten, möchte
ich sie in eine tolle Farbe ändern. Oder vielleicht Disc regulär. Okay, das sieht toll aus. Und ich hoffe, Sie haben dieses Design Bildschirm Städte genossen. Das ist die letzte Königin. Nun, in der nächsten Lektion, werden
wir den Prototyp machen. Wir werden es verknüpfen,
und ich werde Ihnen zeigen, was sind die Probleme, mit denen wir mich normalerweise konfrontiert haben, durch die Tabellenbereiche auf DA. Eine Menge anderer Dinge. Okay, in der nächsten Lektion werden
wir mit dem Prototyping beginnen, und wir werden den Workflow über diese Bildschirme verknüpfen, also hoffe ich, Sie haben diese Serie genossen. Wenn Sie Fragen haben, die Sie mir stellen müssen, gehen
wir zum nächsten Abschnitt.
53. Raster zur Verbesserung der Designs: Jetzt werden wir einige aus dem Netz sehen. Einführung von Rory Designer in der gesamten Design-Übung. Ich habe nie jede Art von großen ist, weil ich ziemlich schnell bauen. Jetzt gehe ich auf die Zehe. Wenn Sie wirklich Junior-Design finden wollen, brauchen Sie dafür kreiert. OK Noten helfen Ihnen, Ihr Design auszurichten und zu harmonisieren, wie Sie hier sehen können. Dies ist ein sehr heraus 12345678 Spalten Groß. Und ich habe einige Bereiche auf der rechten oder linken links links gelassen, die Ränder hier drüben können Sie sehen, ich habe links 11 Punkte auf beiden Seiten sicher zu sein und ich richte alles aus Mein Login Sie hier sehen können ist mein Hamburger-Menü logoed alles toe diese Kreaturen. Okay, so wird es mehr Harmonie zu machen und auch es wird helfen, uns zu verwenden Zehe, Sie wissen schon, ein breites Klicken oder Tippen auf die Bereiche ville. Es ist nicht zugänglich, also stellen Sie sicher, dass Sie mindestens 11 oder 12 Punkte außerhalb des Randes auf beiden Seiten haben. Also eine Sache ist, dass die zweite Sache ist, dass Sie hier sehen können, können Sie auch Ihre oder machen Sie die Everton Heights von Ihren Elementen. Laut Toa werden sie schöner aussehen. Wie Sie sehen können. Hier ist mein Knopf. Ich kann es darauf ausrichten. 123456 sechs Mittelsäulen hier drüben und auch alle von ihnen. Also werden sie diese beiden Spalten draußen lassen, um einen guten Spielraum zu haben. Also lassen Sie mich Spaß für diese eine für Sie schaffen. Also werde ich auf diese klicken, die unser Art Board Name ist, und ich werde auf Erstellen klicken. Und ich werde Spalten verwenden, die hier sein werden und dann das Wohl davon so lassen, wie es ist. 10 Pixel. Und was ich tun werde, ist, das sind die Ränder. Ich möchte ähnliche Margen auf beiden Seiten. Also werde ich 12 für diesen einen verwenden. Also denke ich, wir haben 11 benutzt. Also tut es mir leid, dass ich dieses verwenden werde, also werde ich 11 verwenden und ich denke, es gibt ein Problem. Also lassen Sie uns auf dies klicken, bevor verwendet, weil ich den Standard hier gemacht habe. Ok. Und, ah, Sie können sehen oder hören. Das ist, lassen Sie uns 11 für hier Zehe verwenden, um zu sehen. Warum ist das ein Problem? Manchmal ist es eine Berechnung. Die Berechnung ist also nicht richtig. Wir könnten also einige Probleme haben, wie z. B. unebene Margen auf beiden Seiten. Also müssen Sie sich später für sie kümmern. So, jetzt können Sie sehen, dass es behoben ist. Dies werde ich diesen Standard machen. Und jetzt können Sie sehen, dass dies der Bereich ist, den wir verwenden. Und das ist, dass Sie sehen können, wenn ich hineinzoomen. Es gibt einige von den Bereichen, die wie diese herauskommen. Also werde ich es so benutzen und es wird auf diese Weise schnappen. Also, jetzt ist es richtiger darauf ausgerichtet. Dieser Bereich Sie können das gleiche für diesen tun. So ist der Vert zu 62. Also werde ich das 1 bis 62 machen. An wen sind sechs? Okay, Sie können sehen, jetzt haben wir eine Karte für unsere Gier, und es sieht natürlicher aus. Mehr können Sie sagen, mehr ausgerichtet Design Okay s Oh, das ist großartig. Und deshalb möchte ich diese Layout-Klasse sehen, damit Sie Ihre eigene erstellen können. Und ah, du kannst dein Design so anlegen lassen. Okay, Sie können hier sehen, ob ich hierher gehe. Das sieht hübsch aus. Es ist unten in der linken Ecke. Es ist in der rechten Ecke. Und Ah, sind meine anderen Elemente auf meiner Seite. Ich bin nicht gerade jetzt wieder Dimensionierung sie, aber ich wirklich können Sie sagen, ich empfehle wirklich, dass Sie eine Art off erstellen verwenden sollten weil sie gehen Zehe machen Ihr Design aussehen ziemlich OK, so dass ich es auf diesem Bereich auf dieser Seite ausrichten. Diese 3 52 auch, dies wird 3 52 So stellen Sie sicher, dass Ihre gesamten Bereiche oder dieser mittlere Inhaltsbereich
3 52 Punkte breit ist . Das ist also die Größe, die ich von diesem Glaubensbekenntnis bekommen habe. Okay, das ist alles, was ich dir dieses großartige System zeigen wollte und wie wir mit dieser Klasse entwerfen. Und Sie können hier sehen, ob Sie zu diesem Schaltflächenbereich gehen. Wir verwenden diese sechs Spalten für diese Schaltfläche auch für diese Felder. Das ist also alles über Gittersysteme. Und wenn Sie wirklich mehr in einem großen System und vertikal von ihnen wissen wollen. Sie sollten meine Typografie für Designer und Entwickler Schulen sehen. Wenn Sie Fragen haben, die Sie mir stellen müssen, gehen
wir zur nächsten Lektion über, in der ich den fehlenden Styleguide besprechen werde und wie wir ihn vorbereiten werden. Okay, also lassen Sie uns auf die Anleitung zum Erstellen von Stilen gehen.
54. Die Stilrichtlinien in XD verfeinern: Jetzt schauen wir uns unseren Styleguide an, und wir werden unsere Farben,
unsere Übungsstile verfeinern . Wir haben unsere Symbole verwendet Wir werden immer wieder verwenden. Okay, also lasst uns anfangen. Und wir werden all diese Bildschirme verwenden, um diese Farben zu erstellen. Ok? Und jetzt, bis jetzt, haben
wir eine große Farbe, die diese ist. Dies ist aber in Doppelklick und Sie können hier sehen wir haben gescheitert. Sie können mit der rechten Maustaste klicken. Und du kannst, ähm okay, also ist es bereits hinzugefügt. Es gibt mir also nicht die Möglichkeit, die Farbe hinzuzufügen. Also werde ich mit diesem gehen, also doppelklicken Sie mit der rechten Maustaste, und Sie können hier sehen. Es sagt, Farbe hinzufügen. Nun, diese Option wird kommen, wenn Sie mit der rechten Maustaste auf die Sim auf dieser Ebene klicken. Ok? Außerdem können
Sie es zu einem Symbol machen und ah,
das heißt, wir brauchen nicht, weil es hier einmal erscheinen wird, also müssen wir es nicht einfach machen. Also auf Lee, die wiederverwendbaren Elemente, die wir immer wieder verwenden werden unsere Wiederholung in unserem Design , die ein Symbol sein werden, kam dann haben wir diese Board-Decks, was Qual ist. Ich glaube, es ist dieser hier. Wenn ich darauf doppelklicke, ist
es mit Sinn, dass, wenn pro Anzeige in Ordnung ist. Und irgendwie sagt es, dass es nicht ist Es ist nicht in der Lage, es in Windows zu finden, aber ich denke, es wird es in meinem Mac finden. Also im Moment werde ich wechseln ist Zeh. Ah, ja. Wenn Sie ich dext Sie habe ich angezeigt. Also werde ich mit dir gehen. Ich zeige und es wird diese ändern. Okay, also für Windows, werde
ich das für Mac verwenden. Sie können SF Prue Display verwenden. Ok. Dieser Ort ist im Grunde zum Verstecken von Gewalt, also haben wir bearbeitet. Also unsere Überschriftengrößen sind 32 diese Qual und 34 dieses hier. So verwenden wir als f Sie ein Display überall, das diese Größe ist. Also jetzt, wenn Sie löschen möchten, können
Sie den Traktorstil von hier zu Recht vervollständigen oder entfernen. Ok? Also behalte ich es nur, um sicherzustellen, dass ich nicht woanders benutzt habe. Ok. Ah, okay. Als nächstes hier sehen, können
Sie
hier sehen,dass wir unsere Linkfarbe haben, die hier drüben ist. Sie ich Text Dies ist auch eine weitere Link-Warnung, die ich versucht habe zu verwenden. Es wäre kreativ. Ich kann sie neu anordnen, aber im Moment denke
ich, dass ich sie nicht in Adobe X'd neu anordnen kann. Okay, entweder kann ich diesen Link-Stil ausprobieren. Das ist ein bisschen blaues Hellblau, wasschärfer ist was als diese dumpfe, dunkelviolette Farbe. Okay, also habe ich es hier behalten. Es gibt also zwei Verknüpfungsstile, diesen und diesen. Also vielleicht noch eine Sache. Was wir hier versuchen können, ist, dass wir den Hintergrund ändern können oder hier, also werde ich es freischalten. Und wenn wir diesen Hintergrund heller machen, dann lassen Sie mich Ihnen zeigen, was ich meine. Also werde ich es heller machen. Also werde ich die Helligkeit Zehe drei Hoffnungen drei verbessern. Ok. Und jetzt werde ich diese Kapazität 200% wollen. Und lasst uns es auch Ah,
fünf machen . Okay, jetzt kannst du den Effekt jetzt sehen, Mein alles. Meine Felder, meine Links. Mein alles ist sichtbarer. So ist es an Ihnen Ihre Design-Wahl, wenn Sie es sichtbarer machen wollen, weil auf Licht wo Boden diese Farbe dunkle Farben wirklich genial aussehen. Okay, also ist das gerade in der Tat, was ich dir gezeigt habe. Sie können hier drüben sehen. Ich gehe zurück zu meinen vorherigen Einstellungen und ah, okay. Also, steuern oder Befehl Z, um zu den vorherigen Einstellungen zurückzukehren, lassen Sie uns den gleichen Wert verwenden. Ich denke, so haben Sie minus eins. Und die Menge waas, glaube
ich, war drei oder fünf. Entschuldigen Sie fünf für keinen Umzug zu unseren anderen Farben, die Sie sehen oder hören können, dass diese Farbe in unserer Farbe fehlt . Die Farbe ist hier drüben. Sie können sehen, weil dies ein bisschen dunklere Farbe ist und das ist ein bisschen schärfer. Sonstiges. Also werde ich mit der rechten Maustaste klicken. Es wurde bereits hinzugefügt, so dass Sie keine Option sehen können, um es erneut hinzuzufügen. Also gehe ich Zehe DoubleClick, DoubleClick und doppelklicken Sie erneut Toe. Wechseln Sie zu diesem und klicken Sie getrocknet. Sie können sehen, dass diese Farbe nicht hinzugefügt wird, also haben wir zwei Killer, die eine ist dunkler. Eins ist eine schärfere, hellere Farbe und drei Farben für unseren Text. Dark Black und Gree und das hier. Okay, ich glaube, wir haben nicht avuncular für diesen Namen hinzugefügt. Also werde ich auf die Anzeige gehen. Ich denke, ich sollte es als Zeichenstil hinzufügen, denn wenn ich mehr Text hinzufügen möchte fühlt, werde ich einfach darauf klicken. Okay, das ist
also unser „Hier ist unser Textil“. Dies ist unsere großartige X-Testversion für unseren Link. Entschuldigung. Unser fühlt sich an Tour de Power. Fühle, dass das hier drüben sein wird. Okay, also ist das fast erledigt. Lassen Sie uns in andere Bereiche gehen. Okay, also noch eine Sache, du kannst das auch zu einem Symbol machen, oder? Klicken Sie auf und machen Sie Symbol und es wird hier hinzugefügt werden, was ich bereits getan habe. Sie können sehen, ob ich hier nach unten scrolle. Ich habe das Symbol, weil wir es möglicherweise immer wieder auf verschiedenen Bildschirmen verwenden müssen. Okay, dann haben wir ah, diese Farbe fehlt. Okay, also werde ich mit der rechten Maustaste Hoffnungen klicken, richtig? Klicken Sie auf und fügen Sie Director-Stil hinzu Also haben wir diese 17 Punkt Sand sagte, wenn pro dext Also eine weitere Sache. Ich glaube, ich gehe mit den s, die ich dext habe. Also werde ich das auf dich umstellen? Ich bin jetzt an meinen Fenstern. Okay, also auf deinem Mac, wirst
du SF Brutus verwenden, um SF Proof SMS Telefon zu spielen. Ok. Okay, das ist
also gut. Wir haben fast alle Farben, die unseren Gaumen hinzugefügt werden. Dies ist es ein fast alle Sammlerstile, die wir brauchen. Ok. Ah, okay, also denke ich, das war's. Vielleicht brauchen wir nichts anderes. Vielleicht das hier. Das ist unser kleinster. Ich glaube, das habe ich. Ich habe alles hier gemacht. Das sind 10 Punkte, also vielleicht diese Farben, die ich nicht hinzugefügt habe. Ok, das ist
also die Farbe in diesem Ellipsenhocker. Und wenn ich mit der rechten Maustaste klicke, kann
ich es zu Farben hinzufügen. Es ist eine andere Farbe. Auch Dieser hier ist eine andere Klasse ist eine bläuliche graue Farbe. Okay, jetzt kannst du sehen, wie ich das erschaffen habe. Könnten diese Farben begann ich mit nur einer Verfärbung. Dann füge ich weiter diesen zweiten Rückrufdurchschnitt hinzu, war dieser und ich habe zwei Schattierungen
daraus erstellt . Dann habe ich diesen bläulichen Lehrplan, um sie zu entfernen. Einer ist dunkel, einer ist hell. Dann habe ich drei verschiedene Variationen von Schwarz und Anmut für Text und ein Vital. Das ist alles, was Sie für Ihr Farbschema oder ein tolles Farbschema benötigen, das nur zwei Farben ist. Eins ist die Hauptreaktion. Zweitens ist Ihre zweite Reaktionsfarbe oder Ihr zweiter Rückruf, den Sie für Tasten
oder Links eingegeben verwenden werden, ist zwei oder drei Gree-Aktien aus als nächstes, und die vierte ist eine andere Variante von drei und Ihr Mörder. Okay, also wird es Ihre ganze App ausmachen. Das ist also alles über dieses Farbschema, Stil, Wachen und alles. Ich denke, wir haben unseren Styleguide abgeschlossen. Ich werde mein Dokument speichern und das war's. Ich hoffe, Sie genießen diese Lektion. Fahren wir mit der nächsten Lektion und weiteren Informationen über Adobe X'd fort.
55. IOS Design Richtlinien: heute werden wir den wichtigsten Teil aus Design lernen,
das ist Ah, das ist Ah, Sie est Spezifikationen und Denkmäler und verschiedene Elemente off Design, die Sie brauchen, um
gerecht zu werden, wenn Sie die Gestaltung jeder. Ich war App. Okay, also lasst uns anfangen. Also, das ist eine temporäre, die ich mit Ihnen teilen werde. Ich habe es gerade gerade erschaffen. Vielleicht innerhalb der letzten 30 35 Minuten, oder? Also, was ich werde Ihnen sagen, ist, dass verschiedene Größen von verschiedenen Elementen aus Ihrem
IOS-Design . Also im Moment sind wir für iPhone 678 noch die Plus-Version entwerfen sind das iPhone X. Okay, Also diese Denkmäler, sie sind fast die gleichen in allen verschiedenen Spezifikationen für auch für X. Aber die Größe ist aus. Die Bildschirme sind etwas anders. Okay, jetzt, was wir tun werden, ist, dass wir damit anfangen werden. Ah, oben hier drüben. Okay, das ist
also unser Spot an der Spitze, und es wird 20 Punkte in der Höhe sein. Okay, Sie müssen
also bedenken, dass diese Monumente im Hinterkopf haben, dass wir das für
20 Punkte entwerfen . Sie werden von diesem Status besetzt sein. Flaschen Sie ihn. Okay, die nächste ist unsere Aktionsidee. Oder zeigen Sie jetzt an, wo Sie zwischen Ihrer App navigieren möchten. Es könnte Knöpfe hier drüben geben. Dies ist die US 11 Version auf dem letzten Update im iPhone IOS Betriebssystem. Okay, so ist es im Moment ist das gleiche, was 44 Punkte ist. Und das ist die Standardgröße von Ihrem Tom oder Ihrem Fingertipp in Port. Okay, also ist dies im Grunde ein User Experience Konzept, Ihre jede mögliche oder umsetzbare Taste oder Nachbar oder jedes Element, das Sie möchten, dass Ihr Benutzer mehr
gedrückt wird , tippen
Sie auf, Sie müssen es mit der Höhe mindestens 44 haben Punkte und auch die vit. Also, wenn Sie sich diesen übergeordneten Titel ansehen, okay,
Also, wenn ich zu diesem linken Zugang E gehe, können
Sie sehen, dass es Ziel ist. Das ist also sehr groß. Es ist 1 80 vied und 44 in der Höhe. Okay, also musst du all diese Dinge im Hinterkopf behalten. Auch, wenn man sich das anschaut, ist
es Treffpunkt. Sollte so hier drüben sein. OK, also müssen Sie die Kopfschmerzen angeben. Okay, okay. Bewegen Sie sich weiter. Jetzt. Dies ist tatsächlich die volle Höhe von diesem Titelbereich oder diese Aktion Ni-Bar mit diesem
Titelbereich ist 96 Punkt. Du siehst also, was ich denke? Das ist fast 56. Vielleicht Punkte. Ich bin mir nicht sicher. Vielleicht 50 Fuß. Nun, raten Sie, oder das können Sie tun. Matten und Berechnung Okay, das sind
also zwei Denkmäler. Ich gehe später mit dem Text und Größen von verschiedenen Überschriften und Absatztext . Im Moment bewege ich mich nur mit diesen Momenten, okay? Nicht ganz unten. Wenn Sie hier schauen, haben
wir die Stich unsere und es hat fünf Symbole, die Standard ist. Erhöhen Sie also nicht mehr als fünf. Symbole sind Tab-Bereiche oder hier, weil jeder 75 Punkte sein wird. Warum? Das ist gut genug für Ihren Tumbel, um Sie wissen, die Größe Ihrer Zeit Bookie. Jetzt auf der Höhe aus diesem Tag, aber ist 49 Punkte. Wenn Sie also doppelklicken, können
Sie hier sehen wir die Höhe ist 49. Und auch ich denke, wir verwenden das gleiche in unserem wir gehen, um die gleiche Höhe in unserem Design zu verwenden. Okay, also für die Tasten, die Sie hier sehen können, ist der Knopf. Der Standard ist der gleiche. Es muss 44 Punkte minimale Höhe sein und Sie können ändern. Ich habe jetzt 1 80 Und auch Sie können sehen, es muss eine gute Distanz zwischen diesen beiden jetzt sind wir Creed arbeitet an acht Schweinen Ill,
Great, Great, die ich in meinem Workflow aus modernen Web-Design-Kurs gelehrt habe. Und wenn Sie wissen, wissen Sie nicht viel über die 8.8 Hilfsmittel, die einfache einfach werde ich Ihnen zeigen, dass es die Vielfachen von es sind vier. Also all diese Entfernungen, die Sie sehen können, hören Sie 16,16 Punkt, 16 Punkt. Diese sind alle auch auf den Vielfachen von 16 oder acht oder vier oder vielleicht zwei. Also ist alles in geraden Zahlen. Okay, also ah, 44 ist minimal. Sie können auch verwenden, wenn Sie möchten. Sie können auch 48. Das ist kein sehr großes Problem. Also bleib nicht, dass ich nur den Zeh alle Knöpfe machen will. Sie müssen 44 in der Höhe sein. Sie können die Höhe erhöhen, wenn Sie wollen, aber nicht locken. Es wird ein Problem für den Benutzer sein, darauf zu tippen. Okay, also verwende ich den Abstand von 16 Punkt zwischen zwei möglichen Tasten, damit meine Benutzer nicht falsch treten. Okay, wenn der Benutzer versucht, hier zu tippen, verpasst
er nicht versehentlich ein Tippen auf diese Schaltfläche. Das ist also das. Okay, jetzt bewege ich die Überschriftengrößen. Diese Größe, im Grunde, diese Hauptüberschrift ist 34 Pixel oder 34 Punkte. Im Grunde. Das ist also die Hauptüberschrift oder die mittlere Überschrift von Ihrer Seite, und dann bewegen wir uns zu diesem Textkörper. Der Haupttext wird 17 Punkte betragen. Das ist Standard. Sie können nicht versuchen, darunter zu gehen, weil es einige Probleme beim Lesen auf kleineren Geräten wie iPhone fünf haben wird. Okay, also bedenken Sie, dass Sie für alle unterschiedlichen entwerfen. Ich war Models. 5678 auf. Schauen Sie sich nicht nur acht oder sieben an und verwenden Sie diese Textgröße. Okay, das ist
also eine bequeme Textgröße. Es ist in ihren Standards für die Rubrik. Größen auf. Sie sind auf der rechten Seite. Alles über 20 Punkte. Sie können das zu einer Überschrift machen. Also benutze ich hier drüben. 27 Punkte. San Francisco, Sie zeigen Display. Fords sind im Grunde vier Überschriften. Wenn Sie also versuchen, Überschriften zu verwenden, werden
Sie die Anzeige dafür verwenden. Okay, so können Sie sehen, San Francisco pro Display-Kraft sind für Überschriften. Ich habe dies in meiner Typografie für Designer,
Schulen gezeigt und wenn Sie wissen, wollen Sie mehr über Linie,
Hand verstecken und vertikalen Rhythmus und all diese Dinge wissen . Sie sollten sich meine typografische Xeni Hope ansehen. Okay, jetzt gehe ich den Zeh, komm die Ränder. Jetzt können Sie hier links und rechts sehen. Es gibt Margen von 16 Punkten, also ist dies im Grunde ein acht Punkte Great. So leben sie doppelt von acht,
das sind 16 Punkte auf beiden Seiten. Dies ist eine sichere Marge, weil ich Finger, die sie nicht auf diesen Bereich tippen können Wenn Sie versuchen, Sie wissen, drücken Sie Ihren Finger oder versuchen, über etwas hier drüben, weil ich ein Spiel auf meinem
Android-Handy spielen . Und wenn ich versuche zu tippen, gibt es eine Last, die ein Stick auf es ist in diesem Bereich stecken, und es ist wirklich schwierig, Zugang, dass ich muss, wissen
Sie, tippen Sie in einem anderen wie Dan. Verschiedene Winkel. Wissen Sie,
eigentlich, eigentlich, und drücken Sie den Knopf hier drüben. Okay, also musst du versuchen, einen weiten Bereich zu erreichen, den du hier drüben sehen kannst. Dies ist eine Menge Bereich außerhalb des fähigen Bereichs außerhalb dieser Ränder. Sie können auch diese Überschrift in diesem Text sehen. Alles ist außerhalb dieser Ränder. Versuchen Sie also, das in Ihrem Design zu verwenden. Nun, hier geht es um die Konstruktionsspezifikationen. Es gibt viele andere Design-Spezifikationen wie unterschiedliche Höhen von anderen Elementen und anderen und grafischen Elementen. Ich werde nicht ins Detail gehen. Ah, Menge. Ich gebe Ihnen einen oder zwei weitere Artikel zu teilen. Sie können über alle verschiedenen Spezifikationen lesen. Aber das sind die grundlegenden. Ich denke, du kannst nicht schief gehen, wenn du das alles perfekt bekommst. So Hahnbereich fast immer wird 44 Punkte minimale Höhe und ah, diese sind unterschiedlich. Textgröße ist auch die Textgröße in der Treppe. Aber wenn man genau hinschaut, wird
das 10 Punkte sein. Da dieser Text nicht zum Lesen gedacht ist, dient er nur dazu, den Hinweis von diesem Symbol zu entfernen. Wenn ich also ein sehr neues Symbol verwende und mein Benutzer es nicht erkennen kann, kann
er es . Er oder sie kann diesen Text lesen und sofort wissen, dass dies ah,
Einnahmen ist . Ich bin weg oder so etwas. Okay, also hier geht es um verschiedene Designspezifikationen von uns 11. Ich hoffe, Sie haben diese Lektion genossen. Ich werde dieses Dokument teilen, damit Sie es herunterladen können. Es wird in meinem Google Drive-Ordner sein. Also schauen Sie sich dieses an und entwerfen Sie Ihre vielleicht schön. Und mit den Ausgaben sind U S Richtlinien. Diese werden als ich benutze Designrichtlinien bezeichnet. Ich hoffe, Sie genießen diese Lektion. Wenn Sie Fragen haben, fragen
Sie mich. Fahren wir mit der nächsten Lektion fort.
56. Tippe auf die Zielgrenzen: Nein. Bevor wir in Prototyping gehen und in Prototyping graben, werden
wir Zehe arrangieren einige Dinge und Feinabstimmung Wenige Dinge, die ich sehr problematisch fand als ich meinen Prototyp auf meinem iPhone getestet. Okay, also das Problem ist Ah, hier haben wir eine Menge Bildschirm. Also gehen wir zuerst auf die Zehe. Der erste Schritt, den ich machen werde, ist, dass ich sie arrangieren werde. Eso haben wir weniger Bildschirm in einem Schritt entfernt. Also werde ich dieses Armaturenbrett nach unten verschieben. Wir sind hier, und dann diese Aktivitäten zusammen mit Dashboard, und dann haben wir diese Seitenleiste, die Menü ist. Nachdem wir vom Versteck und auch diesen beiden Bildschirmen aufgetaucht sind, werde
ich sie hierher bringen. Okay, also wählen wir alle aus den Büchern aus. Lassen Sie uns alle auswählen, indem Sie auf die Namen klicken und die Umschalttaste drücken, und ich werde sie so verschieben. Okay, das ist alles, was wir jetzt brauchen, und es gibt noch ein Problem, das ich gefunden habe, ist der Trefferbereich, zum Beispiel, wenn ich versuche, dieses Gesetz Ziegenzehe,
den nächsten Bildschirm oder den Logger zu verknüpfen Bildschirm oder diesem Bildschirm 1. 1 Okay, jetzt auf diesem Bildschirm wird
es funktionieren. Ordnung. Wenn ich versuche, es auf meinem PC zu testen Dies, indem ich diesen Prototyp hier drüben verwende, wird
es funktionieren. Ordnung. Aber wenn ich versuche, es auf meinem iPhone fünf s oder einem beliebigen Gerät zu testen und das Problem wird sein, dass der Benutzer nicht in der Lage ist, auf diesem kleinen Bereich zu tippen. Okay, also müssen wir diesen schrecklichen Bereich etwas größer für den Finger machen. Okay, was wir tun werden, ist, dass wir uns von diesem fähigen Bereich kümmern,
was ist, ich denke, ich habe dies in der Benutzererfahrung für große Krankenschwester Partituren diskutiert. Es muss also mindestens 44 Punkte oder etwas näher dran sein,
so dass die Benutzer leicht Kapital haben können. Dies war 44 Pixel von 44 Punkten. Okay, also zuerst werde ich tun, ist, dass ich Fuß gehe, einige Hintergründe im Hintergrund oder transparente Hintergründe hinter diesem Logo
erstellen werde. Okay, also lass es uns zuerst mit einem Bildschirm machen, damit du sehen kannst, was ich meinte. Okay, also wählen wir das hier aus. Jetzt können Sie sehen, dass das unser ganzes zurück zu Logan ist. Ok? Was wir hier tun können, ist, wenn ich zu diesem Schild gehe und wenn ich zu diesem Design gehe und
im Detail von diesem hier gehe, okay. So können wir sehen, dass das Zubehör übrig ist. Ok. Eine Sache, die wir tun können, ist, dass Sie hier sehen können. Sie haben hinzugefügt, dass dies von Ihnen geliehen wird, wie es von uns, die von Apple ist. So können Sie sehen, dass sie die Grenze hinzugefügt haben, die so groß ist. Also, wenn Sie sogar in diesem Bereich tippen, wird
es zurück gehen. Okay, Aber für uns, Sie können sehen, ob ich zu diesem Passwort Gefühl gehen, wenn jemand versucht, auf dieses Icon zu tippen Icon, es ist nur dieses Symbol, so müssen wir seine Grundnahrungsbereich jetzt erweitern. Was wir tun werden, ist, dass wir etwas Ähnliches verwenden werden,
und ich werde dieses Gebiet so viele Medien nutzen, die er abseits der Grenze und auch die gefüllten sind. Okay, das ist
also ein leeres Rechteck, und ich werde es direkt unter diesem Fischsymbol benutzen, und ich werde es Grenze für I Icahn nennen. Okay, jetzt, wenn jemand versucht, auf das zu tippen, wird
es diesen Bildschirm zeigen. OK, das sind also einige kleine Details. Sie müssen bedenken, dass Ihr Prototyp gute,
leistungsfähige Bereiche haben muss, auf die ein Benutzer einfach tippen kann. Auch, wenn Sie sich dieses Log in Haar betrachten, können
wir auch eine ähnliche Sache hier hinzufügen. Also werde ich das ganze Gebiet in der Lage machen. Ich werde die Grenze entfernen, ihn vom Feld, und ich gehe die Zehe. Bewegen Sie es darunter. Das wird lange hier drin hungrig sein, okay? Und ich werde sie gruppieren. Komm schon, G. Also das ist hier einloggen, Link. Das sind also Dinge, die Sie berücksichtigen müssen. Dies sind sehr kleine Details, die Ihren Prototyp perfekt machen werden. Also stelle sicher, dass du es mit all deinen fähigen Elementen hier drüben so machst. Das hier. Ok. Sie können sehen, dass dies eine Gruppe ist, also werde ich sie öffnen und ich werde die Zehe geräumt. Sind in der Lage Bereich hier drüben. So etwas wird es hier drüben sein. Entferne diese Grenze von dieser gefüllt, und ich werde sie unter dieses Schiff bringen. Nennen wir es eine Grenze. Ja, so
etwas. Und, äh, ich denke, das ist gut. Außerdem können
wir den gleichen Grenzbereich für diese Abmeldung tun. Außerdem können
wir das Gleiche dafür tun. Fertig. Also gehen wir Zehe verwenden diesen ganzen Bereich am unteren oder diesen ganzen Bildschirm, weil getan, wenn jemand auf irgendwelchen auf dem Bildschirm dieser kleine Schritt Pop-up-Bereich klicken wird, wird
es gehen zurück zu diesem Waschbecken zu Clark Bildschirm. Das ist alles, was ich mit Ihnen teilen wollte, dass
wir vor Beginn eines Prototypings ein paar Dinge beheben müssen, was das Hauptproblem ist. Ok. Und die Grenze von Ihrem Tap-Ziel, es wird im Grunde genommen Tap Ziel davon genannt. Ich hoffe, Sie haben diese Lektion genossen. Gehen wir mit der nächsten Lektion über und beginnen wirklich mit dem Prototyping.
57. Prototype und Signup: Okay, jetzt werden wir mit dem Prototyping beginnen, und in dieser Lektion werden
wir zu diesem Prototyp-Bildschirm wechseln und beginnen. Okay, also zuerst gehen wir den Prototyp der fünf ersten Bildschirme, weil wir nicht alles
in nur einem Clough in nur einer Lektion nehmen können . Okay, also, äh, wenn Sie auf irgendeinen aus dem Bildschirm klicken, können
Sie sehen, dass es zwei Möglichkeiten gibt, ob Sie es mit einem anderen Bildschirm auf und auch mit
diesem Home-Icon verknüpfen können . Okay, also zu Hause in diesem wird der Startbildschirm sein, also werde ich auf diesen klicken. Dies wird also über den Startbildschirm sein. Also, wenn ich diese Desktop-Bewertung spielen, können
Sie sehen, dass dieser Startbildschirm ist dieser Bildschirm. Also, wenn ich versuche, auf einen anderen Bildschirm zu klicken und es zu starten Wenn ich gestartet habe, können
Sie sehen, dass es von diesem Bildschirm starten wird. Das ist eine Sache. Okay, also lassen Sie uns diesen Startbildschirm machen, und ich werde ihn mit meinem Protokoll verknüpfen und willkommen, denn das ist, was wir wollen. Gehen Sie einfach auf den Bildschirm und gehen Sie auf dem Willkommensbildschirm zu sein. Ok? Also wollte ich Ziel sein ist lang und willkommen. Also benennen Sie Ihre Bildschirme mit Bedacht. UK Login willkommen. Und ich will die Tradition, die die Wirkung Slide links sein wird. Versucht, also habe ich getrocknet. Drücken Sie nach links, drücken Sie. Richtig. Also wollte ich im nächsten Bildschirm aufgelöst werden. Und das ist Lockerung. Es ist, wie es geht Zehenrutsche. Was ist das für einen Übergang? Wie ihre Tradition wird leichter als mit Verlangsamung oder es wird sehr schnell in der Starter am Ende sein. Also will ich nicht ins Detail gehen. Das ist Lockerung. Verwenden Sie das einfach rein und raus sind raus. Okay, also habe ich diesen ausgewählt. Dann werde ich zu dieser Dauer gehen. Wie lange wird dieser entspannende Effekt zeigen? Sollte es zu lang sein? Ich empfehle nicht, dass Sie über 10.5 gehen sollten. Es wird viel Zeit in Anspruch nehmen. OK, also stellen Sie sicher, dass Sie sich zwischen 0,12 Punkt 4.5 befinden. Also werde ich dies verwenden, was Punkt ist, also denke ich, ich sollte etwas näher verwenden. 2.25 Okay. Und das ist eine weitere Option, die ich in der nächsten Lektion zeigen werde. Also, jetzt, nicht Jacke und ah, versuchen
wir unseren Vorsprung. Ich habe und sehen, ob es Links ist, so dass Sie sehen können Nein, Ich kann tippen oder klicken Sie darauf. Also, wenn ich darauf klicke, können
Sie sehen, jetzt habe ich Maiszehe diesen Login-Bildschirm. Okay, jetzt sind wir auf diesem Bildschirm. Wir haben erfolgreich Prototyp für Spiel von diesem auf diesem Bildschirm. Also entscheiden wir uns für den Workflow aus unserer App oder Website oder Design-Umhang. Auf diesem Bildschirm haben
wir Interaktionen für diesen Logan entwickelt. Jetzt Knopf, denn es geht, um den Slogan Prozess hier drüben zu gehen. Und dann haben wir diese Anmeldung mit E-Mail-Prozess, die auf diesem Bildschirm für die Anmeldung mit Facebook und Google nehmen wird. Dafür haben wir keinen Bildschirm entworfen. Darauf wird Ah, sehr vertikaler Prototyp sein. Wenn Sie sich erinnern, wird
es sehr detailliert Prototyp für dieses Anmelden und unterzeichnen Sie einen Prozess. Ich will nicht, dass es sehr im Prozess ist. Und ah, das ist, wir werden diesen Bildschirm verlinken. In diesem Bereich können Sie nicht sehen, dass dieser kalte Wasserhahn Bereich ausgewählt ist. Also wirklich, wir wollen, dass das passiert. Also, jetzt gehe ich zu diesem Bildschirm und lass uns die Folie nach links benutzen. Okay, jetzt gibt es eine sehr wichtige Sache, die du im Hinterkopf behalten musst. Folie nach links wird auf diesem Bildschirm angewendet, nicht auf den Bildschirm. Und ich wollte Toby 10.4 2., weil der Punkt zu schnell sein wird. Also werde ich es 0,4 Sekunden benutzen und diese verwenden. Ah, unser ist draussen. Entschuldigen Sie das hier. Okay, jetzt ist eine Interaktion erledigt. Nun, eine weitere Interaktion auf diesem Bildschirm ist diese eine Anmeldung jetzt und es geht toe goto to screen log und gefüllt. Es ist nur der nächste Bildschirm. Wir möchten dem Benutzer zeigen, wie der Bildschirm sein wird. Und auch können wir zu diesem ein Protokoll inaktiviert gehen, was besser ist, denn standardmäßig werden wir dem Benutzer das Passwort anzeigen, während er oder er tippt . Okay, also werde ich lieber auf die Haut gehen, als lange. Und Fred schauen ein so dieser Bildschirm und ich will es Zeh. Lassen Sie uns es auflösen, weil es auf den nächsten Bildschirm geht und Punkt Zwangsdauer. Okay, jetzt haben wir ein paar Werte verknüpft. Lasst uns nur diesen Bildschirm und ich gehe die Zehe. Verwenden Sie diese Desktop-Bewertung und lassen Sie uns sehen, wie es ist. nun Klicken
wirnunauf den Slogan. Okay, also geht es großartig. Und Ah, Moment ist
dieser nicht verbunden oder nicht. Nicht mal das hier. Also stecke ich mit dem fest. Das ist also kreiert. Und, ah, wenn wir diesen Bereich verknüpfen
, der sein wird, lassen Sie uns dieses Passwort verknüpfen und dann haben wir es ist eine Grenze für Symbol. Okay, das ist
also die Grenze, die ich auf der linken Seite im Ebenenfenster ausgewählt habe, und ich werde sie verknüpfen, Zehe dieses. Also lasst uns auf den Bildschirm klicken, und es wird die Zehe auflösen, okay. Und all diese Einstellungen werden gleich sein. Und wenn ich auf diesem Bildschirm versuche, auf diesen zu klicken, gehe
ich zurück zu diesem. Das ist also unsere Login-Arbeit, Passwort, Ansicht, Interaktion. Und so möchte ich zurück zu diesem hier. Also ist es im Grunde zwischen diesen beiden Zuständen zu wechseln, und ich wollte sehr schnell sein, also wollte ich 20,2 Sekunden sein. Und lasst uns das auch ändern. Zwei Punkte. Wenn Sie etwas ändern möchten, klicken Sie
einfach auf den Bildschirm und auf die Interaktion oder hier, die Ihnen die
Optionen zeigen , die ich wollte. Toby. 0,2 Sekunden. Ok. Nun, Ah, wir müssen auch wählen,
und wir wollen, dass es auf die Dashboards geht. Nach dem Loggen. Ich wollte, dass du zu diesem Dashboard-Bildschirm gehst, also dieses Mal wollen wir es Zeh, nicht auflösen. Lasst es uns ins Ok schieben. Also werde ich verwenden, das ist in Ordnung jetzt, weil ich denke, es ist richtig. Und ich wollte auch vier Sekunden gleich für diesen Logbuch in Berlin sein. Ich wollte vier Sekunden sein, dass es gut ist. Jetzt werde ich das von Anfang an spielen. Ich werde auf diese klicken. Okay, also möchte ich mich einloggen. Ok. Ich gebe zum Teil mein Passwort ein und wird mir angezeigt. Klicken wir noch einmal auf diese tippen. Wieder. Das ist also sehr schön und cool Effekt, den Sie hier sehen können. Ok. Und dann werde ich wieder die Zehe gehen. Loggen Sie sich ein. Und das ist mein Armaturenbrett. So verwende ich diesen Bildschirm und diese Interaktionen und um diesen Prototyp zu erstellen. Und jetzt werden wir sehen, ob hier ein Link fehlt. Also dieser hier ist Denken Sie an diese Anmeldung. Okay, so auf Anmelden. Ich möchte zurück zum Logging gehen. Das sind also die beiden Interaktionen, die hier oben waren. Ich möchte zurück zur Liste gehen, denBildschirm
einloggen, Bildschirm
einloggen, und ich möchte, dass es selig ist. Ich würde schreiben. Okay, also möchte ich, dass dieser hier direkt in der Zerstörung gleitet, und dieser wird reinrutschen. Okay, also ist das im Grunde rauszurutschen, eigentlich. Jedenfalls, so wird das nach links rutschen. Und wenn ich auf dieses klicke, mal sehen. Was ist das Okay, also ist das auch nach links schieben. Okay, das ist
also die Folie nach links. Diese Sortierung sollte Folie sein. Richtig? Es wird also in die richtige Richtung gehen, also okay, also wird das Rutschen sein, richtig? Und auch, dies wird Folie nach rechts und einfach jetzt Punkt für sein. Okay, also lasst uns das testen. Und jetzt werde ich auf diesen klicken. Melden Sie sich lange an und melden Sie sich an. Bloggen. Melden Sie sich an. Bloggen. Okay, sie sehen wirklich sehr nett aus. Sie können dies den ganzen Tag lang spielen. Ok? Also zurück, um sich anzumelden. Dieser hier funktioniert auch. So sind unsere Top-Bildschirme fertig Jetzt sind wir Wir haben sie richtig verlinkt. Wenn Sie dies ausführen, können
Sie sehen, dass dies unser Ladebildschirm ist. Und dann, wenn ich zum Slogan gehe, kann ich sehen, dass dies der Aktivitäts-Log-Bildschirm ist, wo ich mein Passwort
eingeben und ich kann Ihnen dienen und ich kann es verstecken. Ich kann wieder stumm schalten. Ich kann zu diesem Login gehen. Und das wird jetzt mein Dashboard sein. Wir aktivieren nicht. Das war dieses, weil wir diese in der nächsten Lektion angehen werden. Ich hoffe, Sie haben diesen Schritt Bereich und alles genossen. Wie es verknüpft werden wird. Wenn Sie eine Interaktion löschen möchten, ziehen Sie sie
einfach so aus. Und es ist Es wird gelöscht werden. Jetzt können Sie sehen, dass dieses Element mit keinem Bildschirm verknüpft ist. So löschen Sie es. Das ist also so ziemlich es. Wenn Sie irgendwelche Einstellungen bearbeiten möchten, können
Sie einfach klicken und ein Pop-Off öffnet sich. Haben Sie, was Ziel und Übergang und Erleichterung Sie wollen. Und das ist alles. Wenn Sie Fragen haben, um mir A zu stellen, gehen wir mit der nächsten Lektion über und erstellen Sie die Grippe für den Rest aus dem Prototyp.
58. Prototyping von Dashboards und anderen Bildschirmen in XD: Okay, jetzt, in dieser Lektion werden
wir den Rest der Bildschirme verknüpfen und den Club mit ihnen machen, und wir werden den Rest von unserem Prototyp abschließen. Okay, also lasst uns anfangen. Okay, lassen Sie uns das Schlepptau vergrößern, Steuern oder Kommando eins. Okay, das ist
also unser Dashboard, und das ist unsere Sidebar. Also müssen wir sicherstellen, dass sie hineinrutschen. Sehr richtig. Also, wenn jemand klickt auf diesen Button hier drüben, die Hamburger-Menü ist. Also zuerst werden
wir diese Interaktion und auch diese Abmeldung erstellen. Also alles auf all diesen Bildschirmen, werde
ich die gleiche Interaktion erstellen. Okay, also wählen wir diesen aus. Und ich gehe zu diesem Prototyp, und ich bin genau wie diese Gruppe, die mein linkes Menü ist und ich bin genau wie diese Gruppe,
die mein linkes Menü ist. Und ich gehe zu diesem Bildschirm, der meine Seitenleiste ist, die auftauchen wird, und ich will, dass dieser eine Zehenbusch Bush gemacht ist der Busch Push versucht zu zahlen. Also, hier werden wir die Push-Aktion verwenden, und lassen Sie es uns testen. Ich werde dieses eine Home-Bildschirm nur für die Leichtigkeit aus dieser Übung machen, die ich nicht
stehen will . Gehen Sie durch alle Bildschirme, also lassen Sie es uns testen. Okay, also sieht es etwas seltsam aus. Vielleicht brauchen wir Zeh. Machen Sie es zu pflegen. Machen wir es wieder 0,15 Sekunden oder 0,1 Sekunden splayed. Und ich will sehen, wie es aussieht. Es ist sehr schnell. Jetzt machen
wir es 0,2 Sekunden und sehen, wie es aussieht. Okay, also sieht es besser aus. , Mal sehen,ob eine andere Interaktion besser aussieht. Also werde ich Leichtigkeit verwenden. Und auch, Ich werde Slide verwenden. Richtig. Sehen Sie also, ob die Schieberegler besser funktionieren oder der Busch. Richtig. Okay, also lassen Sie uns diesen Bildschirm sperren und ah, klicken Sie auf diese Interaktion und es sollte Bush sein. Richtig? Und lasst uns das benutzen, und ich werde es erhöhen. 2,3 Sekunden. Okay, mal sehen, wie es jetzt aussieht, als würde es gut aussehen. Okay, jetzt, das ist gut. Wählen wir diesen aus. Okay, also versuche ich, diese Interaktion zu kopieren, aber ich denke, es gibt keinen Weg. Also werde ich die gleichen Einstellungen verwenden. Bush, richtig. Er ist draußen und 0,3 Sekunden. Ja, ein Schub. Richtig. Einfache Notiz. 12 Sekunden. Okay, jetzt werden wir diese,
äh,
Grenze verknüpfen äh, . Nur diesen hier. Ich gehe zurück zum Prototyping, und wir werden es nicht mit dieser ersten Login-Bildschirmtaste verknüpfen. Also will ich, dass es richtig ist. Oder soll ich es auflösen? Ich denke, ich sollte es auflösen, weil es natürlicher aussieht. Also wollte ich aus dem Weg gehen und es auflösen, Zehe diesen Anmeldebildschirm, und ich werde diese 0,4 Sekunden verwenden, um sich aufzulösen. Okay, jetzt bin
ich fertig damit, also gehe ich zu diesem. Hoppla. Also habe ich dieses ausgewählt, so scheinen wieder. Und dann gibt es diese, und ich glaube, ich habe keine benutzt. Ähm, es ist eine Grenze. Ich will die Grenze oder hier, was diese sein wird. Und ich will, dass es wieder mit der Zehe verbunden ist. Dieser Bildschirm das gleiche. Okay, jetzt werden wir unsere alle testen,
also um zu sehen, dass alles gut funktioniert. Also werde ich mit diesem Bildschirm beginnen, der getestet wurde. Okay, also haben nur gearbeitet. Und lassen Sie uns nur die anderen Dinge wie Gesetz Gold. Okay, es sieht toll aus. Abmelden sieht toll aus. Jetzt gibt es noch eine Sache. Ich wollte zurück zu diesem Bildschirm gehen, also möchte ich hier etwas aktivieren. Vielleicht habe ich den ganzen Bildschirm gewarnt, zu diesem hier zurückzukehren. Okay, also will ich, dass es Bush links ist und die gleiche Einstellung. Mal sehen, wie es aussieht. Also werde ich das zerstäuben. Hat irgendjemand von euch einen Schritt irgendwo vorstellt? Prestes Stephanie. Okay, jetzt sieht es natürlicher aus. Okay, also ist das getan Seite, aber ist fertig. Nein, wir haben diese Aktivitäten. Okay, also diese untere Leiste, die Stichstange oder die Hockerstange, wir wollen alle miteinander verknüpfen. Okay, also lasst uns das machen. Das ist sehr einfach. Wir werden das damit verbinden, und es geht zu Fuß. Ich denke, ich sollte es auflösen. Das wird sich innerhalb dieser 0,2 Sekunden auflösen, was ich wirklich liebe. Dieser Wert ist wirklich Liebe. Es ist nach unserer menschlichen Psychologie. Okay, das ist
also gut. Fangen wir an, diesen zu benutzen. Okay, auf diesem Bildschirm möchte
ich, dass dieser hier rüber geht, und ich möchte diese Schulposition bewahren. Okay, also die Scroll-Position ist, dass es gerade jetzt Schule nach oben ist, und es wird das erhalten. Es ist immer mit dem Laden beginnen, Baby. Okay, also will ich es. Toby gleitet nach links. Also dieser Bildschirm dieses Dashboard wird nach links gleiten, und diese Aktivität mit Aktivitäten Bildschirm wird kommen. Okay, also wollte ich Toby Punkt drei Sekunden ausklingen lassen, okay, ähnlich für die Spüle. Also gehen wir einen Bildschirm nach dem anderen für die Spüle. Ich werde dasselbe tun. Das wird nach links rutschen und er ist draußen und bewahrt die Schulposition. Und für diesen Bildschirm. Nun, dieser Bildschirm ist fertig. Alle Links wurden getan. Dieses Dashboard ist bereits mit diesem verknüpft, so dass wir es nicht benötigen. Toby, es ist schon aktiv. Also wollen wir nur die letzten beiden. Welches ist dieser eine oder dieser eine Zehe, der Tok baut. Jetzt gehen wir wieder auf die Zehe. Verknüpfen Sie es wie dieses Licht links. Okay, also heißt das okay, dann wollen wir es. Dieser wird nach links gleiten, weil er mit den Worten nach vorne geht. Okay, aber jetzt gehen wir zurück zum Armaturenbrett, ist
die Richtung anders. Okay, wenn ich zurück zum Armaturenbrett gehe, sollte
es gleiten. Richtig? Also sollte es so gehen, und das Dashboard wird zurückkommen. Okay, also lassen Sie es uns auf See testen. Was? Ich meine, das ist
also die Schulposition. So ist es an der Spitze. Das wird so sein. OK, also jetzt, was ich brauche oder hier ist, ich wollte nicht die Scroll-Position beibehalten. Erinnern Sie sich. Es sieht schwierig oder anders für mich aus. Vielleicht. Ich denke, wir sollten es so benutzen. Ich mag die Schule sowieso nicht immer wieder, also wird das sowieso nach links rutschen,
also okay, also haben wir versucht, sie zu benutzen. Okay, also sind diese beiden Bildschirme fertig. Diese beiden Interaktionen, alle Interaktionen auf diesen Bildschirmen sind abgeschlossen. Jetzt werden wir auf diese einmal zu bewegen oder Dashboard wird zurück Folie sein. Richtig. Okay, also wird das gleiten, richtig? Es ist okay. Das hat auch diesen erzielt. Dieser wird auch auf diesen Bildschirm gehen, und es wird auch gleiten. Richtig. Okay, das ist
also gut. Okay, also muss ich das auch verknüpfen, aber unter diesem Bildschirm
, der Zehe geht, sollten wir auflösen. Ok. Wir wollen nicht gleiten, weil
wir im Interaktionsdesign nicht auf einen anderen Bildschirm gehen. Es ist der gleiche Bildschirm. Wir wollen die Nachricht über den Bildschirm zeigen, also werde ich es auflösen. Okay, also lassen Sie uns das injizieren. Jetzt. Ich denke, unser ganzer Bildschirm hat Bohne Prototyp. Und lassen Sie uns das widersprechen und ich werde auf dem Home-Bildschirm für diesen verwenden, und ich werde es testen. Okay, also werde ich diesen Bildschirm testen. Lassen Sie uns alles andere verstecken, und ich werde dies auf dem Bildschirm für Ihr Fenster testen. Nächster Klick in die Ecke. Als Nächstes. Gehen Sie zur Anmeldung. Okay, melden Sie sich an. Sieht gut aus. Ich werde gehen, um mich anzumelden und nur diesen Bereich. OK, also das sieht toll aus Protokollierung jetzt werde ich auf den Bildschirm gehen. Das Sidebar-Menü. Ok. Suchen, arbeiten. Großartig aussehend toll. Gehen Sie zu diesen Aktivitäten. Und wenn ich gehe zu sinken und zurück zu Aktivitäten ist es wieder auf dem oberen Bereich zu erhalten. Ich mag es wirklich nicht, wenn es mir den Scrollball zeigt. Es sieht wirklich abscheulich aus. Aber ich denke, sie arbeiten Tag für Tag und Nacht für Nacht an einem Tag, also werden sie es verbessern. Also denke ich, unsere ganzen Bildschirme von Knollers Test sehen toll aus. Okay, Sie können sehen, wie das verschwommen wird. Wirklich coole und nette Tatsache. Lassen Sie uns abmelden und wir sind zurück zu unserem Anmeldebildschirm. Jetzt können Sie sehen, wie wir diesen Prototyp erstellt haben und in diesem ganzen Prozess
versuchen, Bildschirm für Bildschirm zu verknüpfen. So vergessen Sie nicht, Ihre Interaktion zu verknüpfen. Ich hoffe, Sie haben diese Lektion in den nächsten s genossen, und wir werden sehen, wie Sie das Video von diesem Prototyp aufnehmen können und wie Sie diesen Prototyp mit anderen Benutzern
teilen können , um es zu testen oder zu befehlen. Gehen wir also zur nächsten Lektion über.
59. Prototyp mit anderen teilen: Der Hauptzweck von jedem Prototyp ist, dass Sie es mit anderen teilen können. Sie können besprechen, was wir es darin verbessern können und andere können es kommentieren. Dies kann also möglich sein, indem wir unseren Prototyp mit unseren anderen
Teammitgliedern teilen . Und dafür haben
wir dieses Symbol hier drüben zu teilen. Und wenn Sie darauf klicken, gibt es drei Optionen veröffentlicht Prototyp,
verwalten, verwalten, veröffentlichen Links und veröffentlichte Design-Spezifikationen. Wir werden über Design-Spezifikationen sprechen, Elektron, die im Grunde für Entwickler und vielleicht andere die anderen Teammitglieder, die wirklich ihre Design-Spezifikationen benötigen. Und wir gehen sofort auf den Fuß. Klicken Sie auf diesen Publish-Prototyp. Jetzt werde ich es X'd nennen. Also hier ist der Titel. Ich werde es X'd Gauß nennen. Zuordnung So etwas. Und ich werde Zehe deaktivieren diese offene Vollbildschirm-Show harten Sport Hände. Okay, also wird es mir zeigen, dass die Bereiche interaktiv sind und andere Arten befehlen, Commander. Also werde ich einen öffentlichen Link erstellen. Es wird Zehe es hochladen. Es wird einige Zeit dauern, es hochzuladen. Okay, Jetzt können Sie sehen, dass es hochgeladen wurde, und ich kann offen in überzeugende Kopie und Bett-Schnur, und ich kann es in jeder anderen Seite oder so etwas einbetten. Also gehe ich auf die offene Verbindung. Ich kann den Link kopieren und per E-Mail an andere Teammitglieder oder jeden anderen, mit dem ich diesen
Prototyp teilen möchte . Ich bin gerade gearbeitet. Öffnen Sie diesen Link. Okay, Jetzt können Sie sehen, dass der Prototyp in meinem Browser geöffnet wurde, und wenn ich darauf klicke, können
Sie sehen, dass es funktioniert. Ok? Damit ich darauf klicken kann, kann
ich daran arbeiten. Und auch, Ich kann auf diese Show klicken. Kommando sagte, es wird mir den Kommentar zeigen. Ich kann auch einige Kommentare wie diese machen. Das Armaturenbrett sieht toll aus. Graben. Also werde ich die Zehenpresse einreichen. Und auch, wenn ich ein paar andere Dinge wie klicke, vielleicht scheint diese Farbe schön. Und wenn ich versuche, darauf Pinto Art Board zu klicken, kann
ich auf jeden Bereich neben der Art Board klicken, wo ich will. Zum Beispiel, wenn ich das will Also Okay, so jetzt können Sie sehen, dieser Mörder scheint nett. Es ist an diesem Bereich angebracht, also spreche ich über verfärbt, so dass Sie sehen können, wie dies wirklich cool ist. Sie können es Ihren Teammitgliedern zeigen, dass sie Design besprechen können, dass dies gut aussieht . Das sieht schlimm aus. So etwas wie das. OK, Sie können sehen,
dass dies ein funktionierender Prototyp ist. Sie können es mit jedermann teilen. Es wird im Browser funktionieren, und das ist alles. Sie können auch auf den Vollbildmodus wechseln, wenn Sie möchten. Ich habe nur am besten entkommen und Sie können sehen Hier ist ein Link mit Adobe X T gemacht und das ist das Datum und die Uhrzeit und alles. Und ich denke, das ist, wie Sie es mit Ihren Teammitgliedern teilen können. Und jetzt, wenn Sie Ihre Links verwalten möchten, gibt es eine andere Verwaltung Veröffentlichen Links. Es geht auf die Zehe. Gehen Sie zu allen Links, die Sie freigegeben haben. Ok, okay. Jetzt können Sie sehen, es gibt zwei, was eigentlich Frühstück ist. Wenig umkehren. Und das ist die Klassenzuweisung. Also jetzt werde ich diesen gemeinsamen Link glauben und einfach diesen behalten. Okay, also werde ich diesen Link auch mit euch teilen, damit ihr ihn ausprobieren und
selbst sehen könnt . Ich hoffe, Sie haben diese Lektion genossen. Und du wirst wirklich, ich liebe Ah, deinen Prototyp
verbessern und du kannst ihn mit anderen teilen. Sie können von anderen,
Teammitgliedern oder Ihrer Familie,
IhrenFreunden oder was auch immer beginnen Teammitgliedern oder Ihrer Familie,
Ihren . Okay, also geht es darum, deinen Prototyp zu teilen. Fahren wir mit der nächsten Lektion fort.
60. Prototypen auf dem Mac aufnehmen: Ok. Nun, in dieser Lektion, werde
ich Ihnen die sehr schöne und coole Funktion zeigen, die Ihr Prototyp-Video
im Makro aufnimmt . Moment bin
ich in meinem Mac-Betriebssystem. Und wenn Sie sehen, ob Sie ich werde auf diese klicken. Also werde ich meinen Prototyp spielen und Sie können sehen, hier ist mein Prototyp und es gibt eine kleine Aufnahmetaste oben. Nein, Wenn ich auf diesen Datensatz klicke, wird
es mit der Aufnahme meines Prototyps beginnen. Und wenn ich versuche, mit ihm zu interagieren, wird alle Interaktionen aufzeichnen. Also werde ich alle Interaktionen wie diese aufzeichnen. Und wenn ich zu anderen Bildschirmen gehe, wird
es all das aufzeichnen. Ok. Und wenn ich hier rüber gehe, loggen Sie sich aus, und jetzt können Sie sehen, dass es alles zugesprochen hat. Ich werde dieses noch einmal drücken, und es wird das in meiner kreativen Cloud voll speichern, wenn ich O im MP vier-Format möchte. Okay, also werde ich es so retten. Und jetzt werde ich diese Datei in einem schnellen Zeitplan öffnen. Ok? Jetzt kannst du sein Ach
Video sehen . Ich denke, dieser hier wurde es heute um 11 Uhr erstellt. 29 Uhr und ich werde die Zehe öffnen in kurzer Zeit, Spieler. Es ist ein bisschen groß, also werde ich es so kurz machen. Okay, jetzt können Sie sehen, ob ich es spiele, es wird die ganze Interaktion so spielen. Jetzt können Sie sehen, es ist wirklich cool, sehr reibungslosen Übergang und alles und aufgenommen mit einer sehr schönen Auflösung, weil es Mac fünf Bildschirm. OK, also ist dies die Funktion aus einer Mac Auto B x d Mac Frage, wo Sie Ihre ah
Bildschirme aufnehmen können . Und wenn Sie nicht mit Mac, nicht gesagt werden, weil Windows-Version ist mit ihm Schritt zu halten. Also bis zu der Zeit, die Sie diesen Kurs zu sehen, oder vielleicht in den nächsten Monaten, vielleicht ihre Leasing diese Funktion in der Windows 10-Betriebssystem toe. Okay, also ah, das ist alles über die Aufnahme Ihres Prototyps im Mac-Betriebssystem. Wenn Sie Fragen haben, die Sie mir stellen müssen, gehen
wir zum nächsten Hören
61. Design: Jetzt in diesem Video werde
ich Ihnen eine sehr schöne Funktion zeigen, die jetzt in Beta Better ist, die von Adobe X'd ist. Und dieser Feature-Name ist entworfen. Inspection. Okay, also, Inspector
, der Ihnen im Grunde zeigen wird, zeigt Ihnen die Farben und die verschiedenen Abstände zwischen den verschiedenen Elementen für Ihre Entwickler. Also, wenn Sie Oh wollen, übergeben Sie Ihr Design an Ihre Entwickler und Sie denken darüber nach, Tools zu verwenden. Tools von Drittanbietern. Sie sollten zuerst sehen, dass es in innerhalb eingebaut ist und gehorchen extra, das heißt veröffentlichen. Inspection. Okay, also lassen Sie mich sehen, ob es okay ist, also Design-Spezifikationen. Also nennen sie es Design-Spezifikationen. Es ist jetzt in der Beta-Version. Sie versuchen, es immer wieder und Tag für Tag zu verbessern. Also Ah, Moment, was sind die Eigenschaften, die ich Ihnen zeigen werde. Also öffnen Sie einfach Ihr Design wie folgt, und Sie gehen Zehe klicken Sie auf diese Design-Spezifikationen und Sie können sehen, ich habe es bereits
auf meiner ah,
Adobe X t Specs Website geteilt auf meiner ah, . Und jetzt können Sie hier sehen, es sagt Weinberg basiert auf IOS. Also brauchen wir wirklich, dass die Einheiten in unseren USA sind, was Punkte sind. Also werde ich das Glied öffnen. Okay, jetzt kannst du das sehen. Es hat diesen Link geöffnet und ich habe es in der Klasse erstellt benannt. Also, wenn Sie auf den Mauszeiger auf einem aus dem Bildschirm klicken, zeigt es auch die Grippe, so dass Bildschirm geht toe dieses oder dieses oder dieses ein oder dieses. So zeigt es mir auch den Fluss von allen Bildschirmen, verschiedenen Bildschirmen und auch, wenn Sie auf einen von ihnen klicken, wird
es einige Zeit dauern, um Lourdes und Sie können sehen, dass es zeigt mir alle Farben. Ich kann auch die Farbwerte ändern, um Dezibel rgb,
alfa und die I s L.
A auszuüben alfa und die I s L. , die Farbton, Sättigung, Leichtigkeit und Alfa ist, die meist in nach ich denke, und es unterscheidet sich von nur sein in der Regel. Das sind also die Schnüre, die auf Web-Seiten RGB verwendet werden oder tatsächlich können Sie auch sehen, dies zeigt mir alle Director-Stile an der Unterseite. Sie können sehen, Sie können auch die Größe zwei Pixel oder Punkte ändern oder DP DP ist normalerweise für Android. Okay, im Moment ist es für unsere U S. Air. Das ist eine Iris. Abso sind die Größen in Punkten. Okay, also gehen wir zurück und klicken Sie auf ein anderes Fenster. Wenn ich hier anklicke und jetzt kommen wir auf die Entfernungen zwischen den verschiedenen Elementen. Wenn ich also auf dieses klicke, kann
man sagen, dass es mir zeigt, dass es 352 Punkte breit und 62 Punkte in der Höhe ist. Außerdem zeigt
es mir auf der rechten Seite das Aussehen von acht Punkt-Rundheit aus allen Ecken . Deckkraft, 100% Kalorien. Weißer Schatten ist Nullpunkte auf der X-Achse y ein Punkt. Es ist vertikal an der Unterseite. Ein Punkt ist das Blut. Ok. Auch wissen, wenn ich auf dieses klicke, es zeigt mir die Entfernungen auf der linken Seite. Es ist 18 Punkte innerhalb dieses weißen Rechtecks. So geben Sie Ihren Entwicklern die Spezifikationen? Es gibt Tools von Drittanbietern, die Sie mit Toby extra Hündinnen integrieren können, und Zeppelin, die Ihnen im letzten Abschnitt zeigen werden, wo wir sowohl Zeppelin jemals genannt Toe Show haben die Schnüre und das Design entwickelt Spezifikationen und alles, was in diesem Büro ist. Ich hoffe, Sie haben diese Lektion genossen, und wenn Sie Fragen haben, die Sie mir stellen müssen, gehen
wir zur nächsten Lektion über.
62. Warum du in 1x 2x exportierst?: Ok. Nun, in dieser Lektion, werde
ich über die verschiedenen Exportgrößen sprechen, die wir für verschiedene iPhone-iPhones benötigen, wie iPhone X iPhone sechs plus iPhone, sechs Bildschirme und iPhone, fünf Bildschirme. Okay, so Veranstaltungsort Design in Adobe X'd Das Design, das Sie auf machen ist immer in einem X
sein.Okay , Also entwerfen Sie bei dieser Auflösung ein X. Also, wenn wir brauchen mehr Auflösung oder wir brauchen die Tasten und Symbole für andere Bildschirme iPhone six plus und iPhone X und iPhone sechs, müssen
wir die doppelte Größe von dieser Ressource. Okay, ich werde es dir in ein paar Sekunden zeigen. Stellen Sie sicher, dass, wissen
Sie, und verstehen Sie diese Begriffe nicht. Einer neben Werken und drei X. Jetzt können Sie sehen, ob wir diese Bildschirme betrachten. iPhone fünf Bildschirm. Sie können sehen, es ist 6 40 mal 11 36 Pixel als iPhone. Sechs. Ist das ein 7 50 von 1334. Das ist die Höhe, und das ist das Wort. Und nein, wenn Sie Zehe iPhone sechs plus springen, ist
das im Grunde ist es ah, Auflösung. Und normalerweise haben wir nicht auf diesem Design, weil es nach unten skaliert Skala von iPhone sechs ein
sechs plus Und für iPhone X, Sie können sehen, dies ist die Portraitgröße. Das sind also verschiedene Größen und Sie können auf diesen drei Bildschirmen sehen. Hier drüben brauchen wir unterschiedliche Auflösung von Bildern, denn wenn wir dieses X
wie 6 40 11 36 oder etwas hier entworfen haben. iPhone 3 20 von 40. Das Großbritannien, das wir haben, wird sehr klein sein, weil wir weniger Pixel haben. Anzahl der Pixel. Jetzt haben wir mehr Pixel. Also auf dieser großen Anzahl von Pixeln, wenn wir, wie 50 Pixel, einen Knopf
ausblenden, wird
es auf diesem iPhone X sehr klein
aussehen.Also müssen wir extrahieren. Unsere Ressource ist in drei verschiedenen Größen ein XTO arbeitet und drei X, so dass wir für alle entwerfen und
gerecht werden können . Tun Sie diese verschiedenen Bildschirme. So können Sie hier sehen, wir haben alle verschiedenen Größen hier gezeigt,
die, die ich von unseren nächsten zwei X und drei X verwendet. Jetzt werde ich für den Shop wechseln, weil manchmal Zehenschalter zwischen für
den Einkauf und über 60 und über 64 verschiedene Bilder und für verschiedene Hintergründe Jetzt, wenn Sie einen Hintergrund, den Sie benötigen, entwerfen
Sie immer einen Hintergrund in hoher Auflösung. Okay,
Also, wenn Sie entwerfen Sie, sollten
Sie etwas in diesem iPhone sechs plus Größe zu entwerfen, weil wir diesen
Hintergrund brauchen und wir werden es auf verschiedenen Geräten skalieren. Okay, Sie können
also auch dieses iPhone sechs sehen, aber wir brauchen einen größeren Hintergrund. Also, wenn Sie Ihren Hintergrund vorbereiten, Ihr Hintergrundbild in iPhone sechs, müssen
Sie Zehe verwenden die sechs plus Größe, und Sie müssen einen größeren Hintergrund erstellen. Zum Beispiel, Wenn ich hier nur einen Hintergrund erstelle, lassen Sie uns einen Hintergrund erstellen. Okay, jetzt werde ich ein gieriges Int-Overlay dafür im Fotoshop verwenden. Und lasst uns so etwas benutzen. Okay, also, zum Beispiel, ich habe das wieder. Nein, nein, ich werde es exportieren. Und ah, das ist die Größe, in die ich exportiere. Und ich benutze PNG 24 Ich werde speichern, dies wird exportiert werden. Schlechte Kredit für den Laden. Okay, jetzt werde ich zu meinem X T wechseln und ich werde iPhone sechs plus öffnen. Okay, also habe ich das hier geöffnet. Machen wir es zu 100%. Und nein, ich möchte diesen Hintergrund in diesen importieren. Also gehe ich zu meinem Desktop-Export und importiere das einfach. Jetzt können Sie sehen, dass das der Hintergrund ist, okay? Und es ist sehr groß. Also brauchen wir so etwas wie dieses Wochenende. Passen Sie die Größenverschiebung und nur die Größe so an. Es ist also einfacher für uns, wenn wir einen größeren Hintergrund haben. Wir haben einen größeren Designhintergrund. Jetzt können Sie hier sehen, wir haben dies, um 4 14 von Lachs, 36 Also, wenn wir versuchen, die tatsächliche Größe von zwei X Größe zu entwerfen, weil in Adobe X eine
Sache im Auge behalten würde , wird
es immer in einem X entwerfen. Also im Moment ist
diese Größe nicht im Grunde zwei X oder drei X. Also, wenn ich zu diesem wechseln und die Größe sehen, die es waas, lassen Sie uns diese Größe 10 80 von 1920. Okay, also werde ich die Größe ändern. Vert wird 9 10 80 sein und das wird 1920 sein. Also, jetzt ist das eigentlich die do X-Größe. Ok? Ich denke, drei x Also, wenn ich meinen Hintergrund hier rüber ziehen jetzt, Sie können sehen, dass es gut passt. So ist es gerade jetzt diese drei x Größe und die eigentlichen großen Zellen, die die drei X Kriege waren. Diese eine 12 24 mal 2200 und acht. Also, wenn Sie wirklich die tatsächliche Größe von drei X wollen, ist
es tatsächlich diese und die Downscale Größen diese 1 10 Jahre um 1920. Also brauchst du Zeh. Behalten Sie all diese Dinge im Hinterkopf. Nein. Wenn wir versuchen, ein Kunstboard aus dem iPhone X zu erstellen, können
Sie sehen, dass es in Vanek ist. Es sieht also sehr klein aus. Nein, wenn wir versuchen, es drei x zu machen, sollte
es so etwas wie diese 11 25 sein. Also werde ich Höhe verwenden. Eso Rate ist 11. 25. Also ist es 11. 25 und die Höhe wird 2436 sein. Okay, Jetzt können Sie sehen, dies ist die tatsächliche drei X Schweine krank Größe von Ihrem iPhone X. Und wenn wir zurück gehen, das ist sterben für die nächste Größe auf einem X so Ah, Adobe Axity. Es ist immer Laster zu Design mit Benex nie versucht, in einer größeren Auflösung zu entwerfen , weil es einige Probleme haben wird. Versuchen Sie immer, in einem X zu entwerfen, aber wenn Sie Ihre Grafiken in Adobe X'd immer in drei X die
größte Größe, die Sie für Ihre Hintergründe haben, da sie später in drei verschiedene
Größen exportiert werden , wenn Sie übergeben Sie es Ihren Entwicklern. Das ist also der Tipp, den ich euch geben wollte. Ein X ist eigentlich die tatsächliche Größe. Es ist auf der tatsächlichen Pixelgröße und zwei zusätzliche Doppel und drei X ist dreifach die Seiten. So etwas wie das. Also haben wir drei Pixel statt eines auf iPhone X und iPhone 67 Plus, wir haben gegen drei X ja, drei Pixel auf DA auf iPhone sechs. Wir haben zwei X, was zwei Pixel für jeden Pixel anstelle eines Pixels bedeutet. Also, wenn wir iPhone einfaches iPhone die 1. 1 haben wir nur ein Pixel haben. Und wenn wir auf iPhone fünf wechseln, dann haben wir die doppelte Auflösung. Wir haben mehr Platz und so wird unser Design sehr klein aussehen. Also werden wir für Hälse entwerfen und wir können unsere Exportgröße verbessern, Zehe diese beiden Größen. Das wird in Zukunft mehr Sinn machen, weil wir unsere
Grafiken und Kunstbohrungen tatsächlich exportieren werden. Okay, also wollte ich nur sichergehen, dass Sie die Idee von diesem hier bekommen. Nächste zwei x und drei X Hier haben wir den größten Bildschirm mehr Pixel. Hier haben wir ein bisschen weniger Bildschirmgröße, ein bisschen weniger Pixel. Und hier haben wir die kleinsten sind die tatsächlichen Pixel übersetzt in das eigentliche Design. Okay, wenn wir
also in ein X entwerfen, wird
es auf dem iPhone angezeigt. gleiche wie unser Design. Das sind die zwei x größeren. Dies ist die drei x größer. Also werden wir im Schlepptau exportieren, all diese drei Größen in der nächsten Lektion.
63. Perfektes Beispiel von 1x 2x 3x: jetzt in dieser Lektion, werde
ich Ihnen das perfekte Beispiel toe geben, verstehen ein x zwei x und drei X und ihre Beziehung. Und was ist diese große Zelldichte und diese langweilig ist und diese zwei x drei x und ein x Problem. Okay, also war ich lange Zeit nicht in der Lage, es zu verstehen. Und jetzt habe ich es einfach perfekt verstanden. Aber ich möchte, dass du das auch perfekt verstehst. Okay, hier können Sie sehen, dass das eine nächste ist und die physische Größe außerhalb des Platzes ist. Dies ist ein perfektes Quadrat in diesen drei Beispielen und das ist das gleiche. Nehmen Sie also einfach an, dass es sich um einen Zentimeter Pixelbereich handelt. Okay, also ist das ein Zoll ein Zoll ein Zoll. Jetzt, auf dem iPhone vier oder den Geräten, die ein X ältere Geräte sind, wird
es 10 Pixel mal 10 Pixel haben. Also, was ist ein X? Bestimmte kleine Boxen hier und stehen Bilder hier drüben, so dass er schlecht spricht, wird ein bisschen
größer Box sein , um den gleichen Platz jetzt auf den Netzhautgeräten oder zwei X-Geräte zu besetzen, wo die Auflösung sehr hoch ist. Der gleiche Bereich wird mit mehr Pixeln oder mehr solchen Türen gesichert. So jede quadratische Tür, die Sie sehen können. Nein, wir haben 20 mal 20. Jetzt haben wir doppelt so groß von diesen Türen. Hier. Wir hatten 10 Pixel, und hier haben wir 20 Pixel im gleichen Raum Jetzt in den drei x die neuesten Geräte,
die iPhone sieben plus acht plus sechs plus und iPhone X sind. hier haben wir mehr Auflösung oder mehr Pixel im Detail in einem kleinen Raum aus dem gleichen einen Zoll. Okay, also haben wir jetzt 30 kleine und kleine und 90 Tang-Endorse. Ich weiß, was das bedeutet, ist, dass wir Mawr Chris sehen, mehr bunte Grafiken auf diesen Geräten
ausgeben. Okay, also und du musst diese Dinge im Hinterkopf behalten. Sie können hier sehen, dass sie gezeigt haben, dass Sie alle anderen hohen Auflösung haben Sie
schleppen müssen Erwarten Sie zwei X und drei X und von X, Ihre ah, alle Bilder für verschiedene Geräte. Sie können auch einen Nächsten verwenden. Wenn Sie ältere Geräte unterstützen möchten, wenn Sie nicht unterstützen möchten und Sie können mit Ihren Entwicklern darüber sprechen. Auch hier sehen wir wieder, dass es Pixel für Pixel Groß. So basiert es auf Design basiert auf acht Punkt Rate berauscht basiert. Dies sind also ein paar von den Richtlinien, was sind die Bilder, Größen und Auflösung. Und was ist das für ein Exzenter. Ich hoffe, du wurdest dieses Konzept jetzt zerstört, und , wenn du Fragen hast,die du mir stellen musst, lass uns zur nächsten Lektion übergehen.
64. Zeichenflächen zum Erstellen von Mockups exportieren: Okay, jetzt, in dieser Lektion werde
ich Ihnen zeigen, wie Sie verschiedene Bilder erkunden können. Und wir werden mehr über eine nächste zwei X und drei X verstehen. Okay,
Also, wenn Sie wählen Sie eine aus Ihrem Kunstboard und gehen Sie zu Ihrer Menüleiste, haben
Sie verschiedene Exportoptionen, schlecht ausgewählt und alle Kunstboards. Sie können alle Art-Boards exportieren oder nur ein ausgewähltes Art-Board exportieren. Und Sie können Badge Export. Ich werde diesen Patch Export in der nächsten Lektion zeigen. Gerade jetzt gehen wir toe, wählen Sie diese und jetzt können Sie hier sehen verschiedene Optionen für Ihren Export. PNG SPD pdf jpg Wir werden PNG oder vielleicht SPD nicht diese Zehe verwenden, vielleicht für Hintergründe. Wir könnten dieses JPEG-Bild verwenden. Okay, Nun, von all diesen Optionen, werden
wir unsere USA wählen, weil wir für IOS entworfen und es war iPhone sechs Bildschirm und ändern Sie dies
nie, weil Sie,
ah, ah, entwerfen Sie Ihre Standarddesign. Aber die Rituale iPhone 67 oder sechs plus oder X wird es immer ein x auf Ihrem OBE extra sein. Okay,
es sei denn, Sie haben die Auflösung geändert. Jetzt wählen wir auf OK. Jetzt auch können
Sie
auchden Ordner ändern. Wir werden nicht exportieren. Ich bin es. Ich habe bereits aus Ordner hier drüben ausgewählt. Und jetzt werde ich auf Exportieren klicken. Und mal sehen, was es uns zeigt. Jetzt können Sie hier sehen ist mein Exportordner. Und wenn ich diesen Exportordner öffne, können
Sie hier sehen, wir haben drei auf verschiedenen Hintergrundgrößen zwei x drei x und das ist die eigentliche. Also, wenn ich dieses geöffnet habe, können
Sie sehen, das ist ein großer kleiner und tun X wird ein bisschen größer sein. Sie können sehen, der Größenunterschied auf drei x wird ein bisschen größer sein. Aber im Moment zeigt es es nicht in 100%. Dies ist die drei x tatsächliche Größe. Jetzt können Sie sehen, dass dies für all diese verschiedenen Bildschirme anders ist. Und jetzt, wenn im Fotoshop, wenn Sie versuchen, Zehe, erstellen Sie ein Mock up von diesem Design, lassen Sie mich es Ihnen zeigen. Ok? Also, wenn wir dieses Mock jetzt haben, diese Akte, werde
ich diese mit Ihnen teilen, also werde ich mich für den Laden öffnen. Ok? Jetzt können
Sie sehen, dass das für den Laden geöffnet ist, und ich habe eine Oberste, und ich denke, es sieht für mich so aus. Sehen Sie die Größe von diesem hier. Okay, also ist es iPhone sechs Bildschirm. Und mal sehen, ob ich versucht, Zehe benutzt. Ah, das hier, äh, das nächste. Okay, also werde ich dieses X benutzen und versuchen, es hier rüber zu fallen. Jetzt können Sie sehen, dass es kleiner ist, weil iPhone sechs ist nicht ein Ausgang ist zwei x So weiter. Jetzt werde ich tun, ist ich werde diese zwei x in meinen Fotoshop ziehen und jetzt können Sie sehen es ist fit auf den Bildschirm. Voy, weil wir das iPhone sechs ist, ist im Grunde zwei x. Also jetzt haben wir diese zwei x Schrei. Also ist es fit und ich werde es retten und Sie können sehen, Lassen Sie mich es Ihnen zeigen. Dies ist die aktualisierte Version. Okay, jetzt, wenn Sie ex extrahieren andere Bildschirme, lassen Sie mich einfach extra extrahieren dieses ein, und ich werde es exportieren, indem Sie ausgewählt, und ich werde es in den gleichen Ordner exportieren und lassen Sie uns diesen Ordner verschieben und ich gehe wieder. Schnappen Sie sich diese zwei x eins zwei X und Ups. Entschuldigung. Ich muss hier drüben etwas öffnen. Okay, das ist
also der Bildschirm. Ich gehe Zeh und schnapp mir meine zwei x Bildschirm und ich gehe die Zehe. Legen Sie es hier rüber. Speichern Sie es und es wird in diesem aktualisiert. Okay, Jetzt können Sie sehen, wie es aktualisiert wurde. Nun, wenn ich zu diesem Durstbildschirm gehe und wenn ich doppelklicke und einen anderen Bildschirm
hier drüben löschte , werde ich exportieren. Lassen Sie uns exportieren. Auf diesem Bildschirm,exportieren
wir diesen Bildschirm. Auf diesem Bildschirm, Dies ist die 3. 1 Ich werde zu erkunden ausgewählt. Und ich werde dasselbe exportieren. Das Gleiche hier drüben machen. Das hier. Ich werde Drag & Drop es hier rüber, und es ist kostenlos, weil es iPhone sechs Auflösung ist. Jetzt können Sie sehen, wie es aussieht. Und das ist die vollständige Nahaufnahme. Und Sie können sehen, wie gut das aussieht. Das hat den Vollbildmodus erreicht. Und Sie können jetzt sehen, dass das wirklich genial aussieht. So können Sie Ihre Entwürfe in Adobe X t erstellen und Sie können Ihre weiteren Cops wie diese im Adobe Photo Shop erstellen. Also, wenn Sie diese beiden Werkzeuge haben, können
Sie sie wirklich mühelos kombinieren und Sie können eine Menge von großen Designs wie
das erstellen . So habe ich mehr Tasse von meinen Bildschirmen erstellt. Lassen Sie mich es Ihnen zeigen. Ich glaube, ich habe das hier benutzt. Es gibt eine andere Ressource. Habe ich nicht. Ich habe das von dir benutzt. Iss es. Das hier, schätze
ich. Öffnen wir es für den Laden. Und Sie können sehen, dass es verschiedene Markups wie diese gibt. Also, wenn ich irgendwelche von ihnen wähle und ich benutze, zum Beispiel ,
dieses kann
ich das gleiche damit tun. Okay, jetzt werde ich die Bildgröße sehen, ob es in Ordnung ist, also denke ich, es wird die drei Verbrauchsteuern nehmen. Oder versuchen wir es, weil es größer aussieht. Ja. Okay, also braucht es drei X, weil die Leinwandgröße näher an 2000 etwas 11 25
ist, was eine sehr harte drei ist. X iPhone X sind iPhone-Exzise. Also werde ich es schließen und Sie werden sehen, dass dies der erste Bildschirm ist. Wenn ich hineinzoomen, können
Sie sehen, wie es wirklich cool aussieht. Sie können auch die Anzeige und den Bildschirm hier ändern. Lassen Sie mich einen anderen Bildschirm wie diesen hinzufügen. Okay, also werde ich es schnell speichern und es mir zeigen. So kommt es gerade jetzt auf. Ist es immer noch nicht. Ich denke, es ist auf 100%. Und wenn ich dieses Grün wähle, wird
es mir einen anderen Bildschirm zeigen. Verwenden wir diese drei X und ich werde es jetzt hier drüben setzen. Warum? Ich zeige dir das alles. Also haben Sie eine gute Idee von diesen All diese Auflösungen drei x vier x und Sie können leicht,
äh, äh, zeigen Sie Ihren Kunden Ihre Entwürfe auf eine coole Art und Weise wie diese. Okay, ich hoffe, Sie haben diese Exportoption verstanden. Wenn Sie alle Ihre Kunsttafeln gleichzeitig exportieren möchten, können
Sie alle Kunsttafeln exportieren. Und es wird unseren Vorstand in drei Resolutionen exportieren. Wo neben drei x zu
verlängern. Wenn ich also auf dieses klicke, werde
ich die anderen ersetzen. Und jetzt siehst du, dass ich alle meine Kunsttafeln hier drüben habe. Okay, so exportierst du alle deine Kunsttafeln, und ich werde in der nächsten Lektion über den Batch-Export sprechen, damit sie dich dann bald sehen. Und wenn Sie Fragen haben, die Sie mir stellen müssen, gehen
wir mit der nächsten Lektion über.
65. Batch Feature in Adobe XD: In dieser Lektion werden
wir uns nun den Badge-Export ansehen, der
die jüngste sehr neue Funktion von Adobe X'd ist. Und es ist wirklich hilfreich. So wollen Ihre Designer zum Beispiel zum Beispiel
diese Schaltflächen in verschiedenen drei Auflösungen. Sie warnten dieses Icon Icon in drei Auflösungen. Was als nächstes? Zwei x und drei X. Sie brauchen auch diese Ah! Ah, dieses Logo hier drüben in drei Auflösungen. Auch diese beiden Schaltflächen Google loggen Sie sich mit Google
ein, melden Sie sich mit Facebook in drei verschiedenen Auflösungen an. Was ist also der kookiest schnellste und einfachste Weg, dies zu tun? Es ist sehr einfach in Adobe. Eigentlich ist
dies dieser Batch-Export wirklich genial Feature. Und wenn ich zu diesem hier gehe, Okay, also was Sie tun müssen, ist, dass Sie jedes von Ihrem Asset auswählen müssen, das Sie exportieren möchten, und Sie gehen zu diesem auf Ebenen Panel hier drüben, und Sie werden diese Marke hier markieren . Dies ist für schlechten Export. Okay, also werde ich auch diesen Hintergrund hier auswählen, und ich habe ihn auch als Markierung für den Batch-Export ausgewählt. Und noch eine Sache, die ich angepasst habe, ist, dass ich diesen Hintergrund mit dieser Schicht Moschee. Okay? Und es gibt noch eine Möglichkeit, diesen Hintergrund auch in drei verschiedene
Auflösungen zu extrahieren . Und ich denke, es wird das mit diesem Batch-Export tun. Sie können das auch in für den Shop tun, wenn Sie wollen. Oh, und ah, jetzt auf diesem Bildschirm führen
wir alle nur diese beiden Dinge an. Okay, dann, auf diesem Bildschirm, brauchen
wir diesen Knopf. Dies ist unser Login Button. Das ist, dass wir es exportieren müssen. Badge Export. Dann brauchen wir auch diesen einen Facebook-Button Badge Export. Und ich werde auch diesen Login mit Google mit Google glatten. Okay, also all diese Knöpfe auch, ich brauche nur diese diese, wenn ich ich kann, kannst du sicherstellen, dass du sie auch richtig benennst. Ich ich gehe auf so etwas. Also machen sie mehr Sinn, okay? Weil Sie sie für Ihre Entwickler exportieren, und dies muss ein guter Name sein. So können sie es auch leicht erkennen, Sie können sehen, das ist mein I. Ich rufe auf, äh, aktiviert so etwas und ich werde auf den Markt für Batch-Export und dann auf diesem Bildschirm brauche ich nicht. Okay, also brauche ich das. Aber das ist anders. Also werde ich Zehenspuren gehen, das hier. Okay, auf diese Weise werden
Sie alle Symbole und all die verschiedenen Dinge markieren, die Sie exportieren möchten. Okay. Zum Beispiel können
Sie dieses Symbol hier sehen. Das ist, äh, dieser Glenda-Rike auf diesem Symbol hier drüben, das ist F-Kreis-Symbol. Also x Kreis Kreis I auf. Ich bin beim Markt. So werden Sie alle Ihre Vermögenswerte in Ihrem Geschenk in Ihrem Design markieren, und Sie werden alle von den's für Ihre Entwickler erwarten. Okay? Sie können diese auch verwenden. Zum Beispiel. Dies ist deaktiviert. Und für jedes Mal haben
diese Symbole, die wir gehen, verschiedene Zustände, zum Beispiel. Zum Beispiel, dieses Dashboard können Sie hier sehen, dieses Dashboard Lassen Sie uns eigentlich habe ich Dies ist eigentlich sollte in einer Gruppe sein. Das ist also Dashboard. Okay, also werde ich es Dash Board nennen und fähig. Okay, also wird das viel helfen. Also werde ich es so exportieren und das wird unser Dashboard nicht aktivieren oder deaktivieren oder so etwas sein. Okay, also wirst du benennen, was immer du willst. Ich drücke Kontrolle,
Befehlstaste, um verschiedene Elemente und Controller-Ware auszuwählen, um sie zu tasten. Das Dashboard wird also deaktiviert, so
etwas. Sie können mit Ihren Entwicklern darüber sprechen, welche Konvention sie verwenden,
unabhängig davon, ob sie deaktiviert oder etwas anderes aktives oder nicht aktives verwenden, etwas anderes haben könnten. Jetzt gehst du den Zeh. Sie diese Markierung für den Export und es wird drei Bilder für aktivierte und
deaktivierte Elemente exportieren . Okay. Und Sie werden dasselbe für diese Aktivitäten tun und sinken. Und dann dieser Knopf, das ist unsere Schaltflächenbewertung. Es ist bereits ausgewählt, also brauchen Sie keine Zehe. Wählen Sie das aus. Und sobald Sie alle Ihre verschiedenen Assets ausgewählt haben und Sie zum Beispiel
diesen Button hier über exportieren möchten , aber eine Bewertung möchte ich es exportieren. Wissen Sie, dass das hier ist, aber ich bin behindert. Ich werde nicht exportiert. Sie stellen sicher, dass Sie beide Status für diese Schaltflächen aktiviert und deaktiviert exportieren. Okay, dann gehen wir zu diesem Export und wir werden dieses Abzeichen auswählen und
wir werden unser uns ein x Export auswählen und das ist alles. Gehen wir zu unserem Exportordner und Sie können hier drüben sehen Dies ist wirklich cool. Also haben wir diese Taste, diese Taste für zwei x drei x die ganze Last für alle verschiedenen Größen Sie können sehen, wir gehen Zehe Geben Sie sie an unsere Entwickler und sie werden,wissen
Sie, wissen
Sie, wirklich küssen unsere Hände, weil alle Vermögenswerte dort schwer sie haben alle Vermögenswerte dort drüben kam Jetzt können Sie sehen, dies ist das Dashboard verschiedene Symbole wir exportiert Sie können sehen, dies ist das I-Symbol all die verschiedenen Größen für all diese Symbole Sie haben wir bereits alles, was wir brauchen Um es unseren Entwicklern zu geben, und es ist wirklich, wissen
Sie, einfach. Ich habe bereits markiert Wenn ich etwas ändern möchte, kann
ich auf diesen Button ändern und ich kann wieder auf den Export klicken Batch-Export. Es wird alle meine bereits exportierten Elemente Schlüssel aktualisieren. Dies ist also die beste Funktion, die ich in Adobe X'd denke, die, wie sie kürzlich veröffentlicht haben,
ich hoffe, Sie haben diese Lektion genossen. Wenn Sie Fragen haben, die Sie mir stellen müssen, gehen
wir zur nächsten Lektion
66. Live-Vorschau deiner App auf Iphone: Ok. In dieser Lektionwerde
ich Ihnen von dem zusätzlichen Kapital erzählen. In dieser Lektion Wir sind tatsächlich im Durchschnitt, dass du leben kannst. Vorschau Ihres APS, indem Sie Ihren Mac mit Ihrem iPhone korrigieren. Und das ist die App, die ich installiert habe. Sie können darauf tippen. Und das ist die Ansicht, die Sie sehen werden. Es werden drei Registerkarten am unteren Rand sein. Einer ist extra. Dokument 1 ist eine Live-Vorschau, wenn es Einstellungen ist. Im Moment werden
wir mit dieser Live-Vorschau gehen. Stellen Sie sicher, dass Ihr Telefon über diese angeschlossen ist. Du musst hier drüben sein. Sie können sehen, dass ich nicht mit dem USB auf meinem Mac gehandelt habe. Das zweite Ende wird also mit dem Mac sein. Okay, jetzt gehen wir auf die Zehe. Verwenden Sie diese Lebensvorschau-Taste, und Sie können sehen, es geht zu Lourdes es von meinem Mac. Also, wenn Sie auf Ihren Mac schauen, wenn Sie sich Ihren Mac hier drüben, können
Sie sehen, hier ist ein kleines Symbol aus dem Leben, Sie Dörfer zeigen Essenz iPhone. Okay, also muss es sein, wenn du verbunden bist, wird
es so etwas zeigen. Jetzt werde ich Ihnen zeigen, wie Sie die gleiche Karte hier verwenden können. Ich werde das Protokoll drücken, um es zu testen. Sie können sehen, es zeigt mir die Herzsportarten hier drüben. Und ich werde sicherstellen, dass es leicht in der Lage ist und andere. Der Benutzer vermisst den Wasserhahn nicht. Indiens ist okay, also ist der Fokus von dieser Kamera ein bisschen Jaggi, also mach dir keine Sorgen. Ok? So können Sie sehen Hier ist die Live-Vorschau von dieser App Over hier. Wir können auch eine öffnen diese Sidebar-Menü. Wir können Gold lang haben. Und so können Sie Ihr iPhone oder jedes iOS-Gerät iPhone 678 oder X mit Ihrem ah
,
Adobe X'd mit Ihrem Mac verbinden , . Und Sie können es auch mit Ihren Mac-Book-Profis tun. Sie können es mit ihm verbinden und Sie bestreiten live. Nur dein Prototyp. Okay, also das ist eine Funktion, die ich wirklich möchte, dass ihr euch sagt. Ich hoffe, Sie haben diese Lektion genossen. Bis bald in der Lektion
67. Developer mit Zeplin: Sie wissen, in diesem Hören, werden
wir die Zusammenarbeit Teil der Design-Zusammenarbeit decken bedeutet, dass Ihre Entwickler, sie brauchen zitierte Farben. Sie brauchen die Schatten und alles in der zitierten ehemaligen auf der auf den Schriften, die Kraft, die Sie verwendet haben, sie wollen alles, jedes Detail. Wie viel von der Entfernung zwischen diesen beiden Elementen und allem? Scheidung Es umfasste ehemalige. So ist es einfacher für sie, Ihr Design in Schlepptau zu konvertieren. Gut. Ok. Um dies zu tun, haben
wir einige Tools, die kürzlich von Adobe X aktualisiert wurde, und das heißt, wenn Sie zur Datei gehen, können
Sie Ihre Designs auf Ihrem Mac exportieren. Es ist nur ein Mac nur verfügen über jedes Gericht und trennen die erste wir gehen Zeppelin, kümmern sich um den Zeppelin und beurteilen in. Wenn Sie also nichts über das Flugzeug wissen, müssen Sie es herunterladen. Okay, also gehen wir nach Zeppelin, Tochter. Sie können sich kostenlos registrieren Konto, das für eine App oder eine Anwendung kostenlos ist, und Sie können zu diesem Simon-Designer oder so etwas gehen. Ah, unten, Sie können sehen, dass es Mac-App und Fenster oben, also Ah, richtig. nach unten. Dies ist nur für Mac Funktion. So können Sie diese Maquette herunterladen. auch Sie können diesauchherunterladen. Ah Magan Fenster App direkt. Wenn Sie auf Google suchen, können
Sie dazu gehen. Ihre Anhänger als Apfel in Tochter Sie und Sie können sehen, es gibt drei Versionen für Windows und zwei verschiedene Versionen für Windows und eine für Mac. Stellen Sie sicher, dass Sie ein Konto erstellen, da es in Zeile 1 funktionieren wird. Die APP ist ein Leben lang kostenlos, also ist es keine sehr große Sache. Ich denke, es ist ein sehr süßes Feature von ihnen, dass sie diese Option frei gegeben haben, ein aktives Projekt und ah, wir werden es kostenlos ausprobieren. Okay, also sobald Sie ihre ab herunterladen und installieren, wird
es so etwas sein. Okay, das ist Zeppelin. Ich habe den Zeppelin geleitet, und es gibt derzeit kein Projekt. Okay, also werden wir ein Projekt erstellen, es wird ein
U.S.-Projektsein U.S.-Projekt , weil wir alles in Punkten entworfen haben. Es war ein ah, uns iPhone 67 Jahr Bildschirm. Also werden wir brauchen schnell gelockt und objektiv c. Nach Okay, also werden wir das bekommen und schaffen. Und es hat ein Projekt für uns geschaffen. OK, jetzt werde ich einen GP nennen, weil es der Name aus der eigentlichen App ist. Okay, also lassen Sie es so. Jetzt gehen wir zu einem Brief, Toby X'd und wir werden alle Kunsttafeln auswählen. Also werde ich alle unsere Bretter von hier auswählen, bevor, stellen Sie
sicher, dass Sie es sind. Sie haben die Nummer Ihrer Bildschirme so. Wie Sie sehen oder hören 030 bis 0 für, denn es wird ein höllisches Problem sein, wenn Sie versuchen, sie zu sortieren oder versuchen, sie auf
Zeppelin oder einem anderen neu anzuordnen , um das zu mögen. Okay, also werden diese Werkzeuge nicht helfen. Also, was ich tun werde, ist, dass ich sie alle auswählen werde. Ich drücke die Schicht und werde Toe Zeppelin exportieren. Sie können sehen, dass mir das hier zeigt. Dieses Projekt werde ich importieren. Wir haben das entworfen. Als Nächstes. Wir werden eine nächste auswählen, und jetzt können Sie sehen, es ist es begonnen hat, meine Bildschirme toe Adobe von Adobe XTC hochzuladen siehe toe mein Projekt auf Siplin. Okay, damit auf diese Dateien zugegriffen werden kann. Warum gibt es Online-App, die Web-App und auch diese eine Sie können sehen, können Sie auch Ihre Skizze Feuer exportieren. Das wird X t Figur Geist für den Shop cc sein. Dies sind also vier beliebte Tools aus Ihrem Design und User Experience Design, die einige Zeit in
Anspruch nehmen wird . Also gehe ich mit den Zeh. Mach es schnell, okay? Nein, ich glaube, alle meine Bildschirme und Kunsttafeln wurden hochgeladen. Und lassen Sie mich sehen. Wir sind alles in Ordnung? Also ist alles hier. 01 Laden und alles. Jetzt können wir es klären. Hier drüben ist der Name mit Namen? Nein. Sie können sehen, dass sie hochgeladen und nach dem Namen sortiert wurden. Okay, Sie können sehen, das ist die Dichte, die ich in der neben uns entworfen habe, ist der Typ aus dem Projekt. Dies ist der Web-App-Link. Sie können es mit anderen teilen und Sie können dieses Projekt online und diese andere
Integration anzeigen . Wenn Sie zu slack hinzufügen möchten, können
Sie zu slack hinzufügen, die eine Kommunikationssoftware ist. Und ah, hier haben wir die Szenen von Lee entworfen und Richtlinien Styx Wachen. Dies ist im Grunde eine andere Funktion von ihnen, die Sie auf Ihren Bildschirmen zeichnen können, wenn Sie möchten. Oh, aber das werden wir nicht tun. Dies sind die Erweiterungen hier drüben, was im Grunde der entsprechende Teil ist. Was sind die Erweiterungen, die sie verwenden? Sie haben vor kurzem kann ich sagen, dass sie ihre Programmierung Sachen ausgelagert haben. Okay, Sie können sehen, dass wir schnell von Zeppelin und Attributen brauchen. Saiten das. Beide sind für U S Betriebssysteme und Zeug ist die im Grunde die entsprechende Sprache für Rus abs. Okay, jetzt werde ich es schließen. Wenn Sie weitere Erweiterungen erkunden oder weitere Erweiterungen hinzufügen möchten, können
Sie diese hinzufügen. Sie können sie auch ausschalten. Sie können zu den weiteren Einstellungen gehen, wie ich es beim Bereitstellungsziel verwendet habe. Wenn du etwas willst, willst
du ein paar Dinge ändern. Du schaffst es hier drüben. Okay, also bin ich gerade. Der Besitzer. Ich kann auch meine Teammitglieder hierher einladen. Dies ist die Schnittstelle von meinem Projekt. Und jetzt, wenn Sie zu Sty Guide gehen
, den wir in ah,
ein paar Sekunden erstellen werden, was der Hauptzweck von diesem Siplin ist. Okay, also was wir tun werden, ist, dass wir zu diesem gehen, und das ist unsere Hauptüberschrift. Also werden wir unseren Styleguide erstellen. So über Cooders Scan, können
unsere Entwickler leicht verwenden, get this. Erzielte diese Farben auf die Größen aus diesem Text und die verschiedenen Elemente Design-Elemente , und sie können es schnell verwenden und einfach ein Gericht aus ihm verwenden. Okay, Sie können hier sehen, ist die Größe, und hier ist die Farbe. Okay, wenn ich versuche, diese Farbe hinzuzufügen, können
Sie sie sehen. Ich habe dieses Holzkohle-Cree gemacht. Ich kann auch Kohle Gree hinzufügen, hier
drüben. So etwas wie das. Okay, also wird das dann so sein. Das ist mein Textil. Ich werde sagen, Überschrift und so was. Ok. Also werde ich es so hinzufügen. Drücken Sie die Eingabetaste, und es wird zu unserem Styleguide hinzugefügt werden. Jetzt werden wir es weiter zu unserem Steiger hinzufügen. Gehen wir zum nächsten Bildschirm und wir können diesen klicken. Das ist andere Vermögenswerte. Wenn Sie Assets in PNG Landwirte für die drei Größen herunterladen möchten, eine zusätzliche Werke und drei x Sie können das von hier aus tun. Ok. Auch, wenn ich doppelklicke, können
Sie sehen, dass es mir diese Gefühl Farbe zeigt. Ich werde es hinzufügen. Das ist meine Primärfarbe. Also füge primär bei Dyn hinzu. Okay, die Namenskonvention, die hauptsächlich in unseren USA verwendet wird, ist, dass mit einem kleinen Buchstaben beginnen und das nächste Trennzeichen wird groß sein und das nächste Trennzeichen wird Kapital sein. So dunkle Schiefer primär. Okay, also kannst du solche Dinge hinzufügen. Sie können auch hinzufügen, zum Beispiel, dies ist meine Link-Warnung. Ich werde Zehe hinzufügen dieses Licht, vielleicht Link und ich werde Zehe Fügen Sie es so hinzu, dass auch ich in Textilien hinzufügen kann. Ah, Blue Link so etwas. Okay, gehen wir zum nächsten Bildschirm. Und ich glaube, wir haben nichts oder Kopf. Und wenn Sie hinzufügen möchten, können
Sie diesen weißen Text hinzufügen, den Sie sehen können, können Sie auch den Inhalt aus verschiedenen Elementen kopieren. Also, wenn ich den Inhalt von diesem aber und ich kann es kopieren und ich kann es in meinem Bildschirm oder meine entsprechende Software, wo ich meine Akkorde verwende und alles verweilen Ok, gehen
wir zum nächsten. Ok? Also können wir diese Farben weiter hinzufügen,
okay, okay, im
ganzen Land,
das ist unser zweiter regulärer. Wir werden diesen hinzufügen. Also, wenn wir weiterhin verschiedene Stile hinzufügen, so ist dies unsere Absätze Studie, so werden wir es schlecht hinzufügen. Uh, Grafik als Nächstes. So etwas wie das. Dies ist es hat bereits die Farbe gesammelt, die diese anthrazit ist. Wir haben es bereits gerettet. Okay, jetzt noch
eine Sache. Wenn du zu dieser Überschrift gehst, die wir nicht gerettet haben, waren die Zehe. Speichern Sie es als Überschrift eins. Also gehe ich mit den Zeh. Machen Sie einen kleinen Brief hier drüben. So etwas wie das. Okay, das ist
also unser Text für Text zur Verwendung. Also gehe ich zum Textfeld oder ah, Formular. Sieh mal, es ist ein Textfeld als nächstes. Also das ist unser Also das ist unser Textfeld Extra Schlüssel. Also, ja. Also haben wir nur dieses getan. So werden Sie weiterhin verschiedene Farben und alles hier zu schaffen. Dies ist deaktiviert, aber in Farbe. Und das ist unsere aktive. Das ist unser dunkler Schlaf. Primäre Farbe. Also werden wir weiterhin alles hinzufügen. Ok. So können Sie auch diese hinzufügen. Ah, nie als Nächstes. Okay, Sie können
also sehen, dass dies für Ihre Entwickler sehr einfach ist, dies zu bekommen. Also bewachen Sie die Idee. Eine weitere Sache, die Sie Ihren Entwicklern leicht sehen können, sind die Abstände zwischen verschiedenen Elementen. Wenn Sie also auf etwas klicken, können
Sie sagen, es zeigt mir die Entfernung von oben, diese primäre Leiste auf der rechten Seite, auf der linken Seite und auch von unten. Okay, wenn ich
also über irgendein anderes Element schwebe, kannst
du sehen, dass ich diesen 21 Punkt zerstört habe. Also meine Entwickler, sie brauchen tatsächlich diese Entfernungen in Punkten. So wird es wirklich einfach für sie sein,wissen
Sie, diese Bildschirme zu wissen
Sie entwerfen und zu entwickeln. Okay, nein, nein, wir gehen zurück zum Armaturenbrett und wechseln zu unserem Styleguide. Jetzt können Sie sehen, dass dies die Schnur ist, die unsere Entwickler wirklich lieben werden. Dies ist die schnelle Schnur, die Sie oben sehen können. Schnelle Farbpalette, alle verschiedenen Farben, Klassen für sie zu verwenden. Auch können
Sie sehen, dies ist unser viertes Buch haben wir alle verschiedenen Überschriften und alle verschiedenen Formen Stile, die wir über unsere verwendet haben Wenn ich, wenn ich wie es verpasst haben, haben wir gelbe Farbe und andere Farben. Sie können sie hinzufügen. Diese Lektion ist für Sie zu verstehen, wie Sie mit diesem Tool, wissen
Sie, weitere Optionen
erkunden können. Jetzt können Sie sehen, ich habe auf die Erweiterung geklickt und wir können auch die Erweiterungen Mehr
Erweiterungen aus Zeppelin sehen . Also, wenn Sie an einem Android-System oder irgendetwas anderes arbeiten, brauchen
Sie vielleicht etwas wie hier drüben. Lassen Sie mich es Ihnen zeigen. Okay, so können Sie sehen Hier ist das Beispiel. Beispiel ist im Grunde für Android-Ressourcen aus Farben Textiles Ziel C und Verschiebung ist für U S C ss Les sagt ein CSS-Stylisten, diese sind für Web-Entwicklung. Reagieren Sie native Ah, und ah zugeschrieben Strings tatsächlich wirklich Strings. Ich weiß nicht viel darüber,
aber ich denke, es ist für mich vor Apple IOS System von so etwas wie das zerstörte native ist von Facebook. Es kann eine native abs für iPhone und Android erstellen. Beide Systeme ag Zamel Prüfung Verbündeten Zimmel. Ich glaube, ich weiß nicht viel darüber. Ich sehe Emmanuel,
bekannt, dass es für die Entwicklung ist. Okay, du kannst diese beiden Zeppelin hinzufügen, wenn du willst. Wenn Sie an einem Projekt arbeiten, in dem ein anderes Projekt ausgeführt wird, können
Sie es hinzufügen und den Fuß wechseln. Ändern Sie alles. Hier ist in Ordnung, also können Sie es deaktivieren und Sie können es hinzufügen. Welcher Kopf? Okay, hier dreht sich alles um Zeppelin und wie wir Zeppelin Zeppelin verwenden können, die Schmerzen von unseren Grenzen
lindern und diese fantastisch aussehende und schöne medizinische App entwickeln . Und ich hoffe, Sie haben diese Lektion auf diesem ist der Stil Kerl genossen. Dies ist ein Dashboard. Wenn Sie mehr Benutzer oder mehr aus Ihrem Team einladen möchten, sind Ihre Teammitglieder Ihre Quartiere. Sie können das tun, weil es einfacher für sie sein wird, die Entfernungen und alle diese
Farben auf den Styleguides im zitierten ehemaligen zu sehen . Okay, also geht es hier nur um Zeppelin. Ich denke, dieser Vortrag wird sehr lang. Sie können mehr erkunden, wenn Sie wollen. Sie können mir Fragen stellen. Wenn Sie es getan haben. Fahren wir mit der nächsten Lektion fort, in der wir die jemals Cord App erkunden werden.
68. Handoff mit Avocode entwickeln: Ok. Jetzt ist das zweite Werkzeug, über das ich sprechen werde, jemals Code
, der Zeppelin ähnlich ist. Aber es hat einige weitere Funktionen, und für mich denke
ich, es ist für Entwickler von Designern gebaut. Perspektive. Ich glaube nicht, dass es sehr einfach zu bedienen ist, und es gibt nur wenige Funktionen, die in jedem Akkord fehlen. Vielleicht ist es deine eigene Meinung, oder vielleicht ist es meine eigene Meinung, aber ich denke, es fehlt etwas, genau wie ein Schritt hinter Sepp. Okay, also kannst du das auch mit jedem Gericht machen. Lassen Sie mich Ihnen ihre Website zeigen. Dies ist ein Rekord und ich habe einen Court Dot com und Sie können es für 14 Tage versuchen. Das ist ein Problem hier drüben. Obwohl ihr Preismodell Modell sehr billig ist, denke
ich, 6,75 monatlich für jedes Teammitglied. Okay, wenn ich ein einzelner Freiberufler bin, denke
ich, das ist ein tolles Paket für mich. Sie können es für 14 Tage verwenden. Kostenlose Testversion, wenn Sie Zeh wollen. Wenn du es ausprobierst. Wenn Sie es mehr mögen als der Zeppelin, können
Sie voran gehen und diesen verwenden. Okay, also werde ich es dir zeigen. Ich habe bereits ihre Kutsche gekauft, um euch in den Partituren zu zeigen. Also werde ich zu meinem Adobe x gehen, ich habe heruntergeladen und installiert es bereits, so dass Sie es
herunterladen und installieren können . Wenn Sie mir folgen wollen und Sie sehen können, kann es auch bei O B X D Dateien und ein
wenig Photoshopped gefeuert und Skizzendateien importieren . Also alle von ihnen, es ist nicht Sport Feige Ma, Ich denke gerade jetzt eso Zeppelin ist nur, Ich denke ein oder zwei Schritte voraus vor ihnen. Also gehe ich zu meinem Adobe X'd und gehe zur Datei und exportiere jedes Gericht. Okay, so denken Sie daran, dass vor der Installation und Aufzeichnung, diese Option wird nicht erscheinen, weil diese ah, diese App muss auf dem Rücken installiert werden. Okay, also klicke ich auf jedes Gericht. Eine gute Eigenschaft an jedem Gericht ist, dass ich nicht alle meine Kunsttafeln auswählen muss. Es wird Zehe erkennen all mein Herz Brett und gehen Zeh. Laden Sie sie hoch. Was? Hier. Okay, also werde ich ein neues Projekt erstellen. Also lasst uns hier ein Projekt erstellen. Erstellen Sie ein neues Projekt. Dies ist ein Iris-Projekt. Okay, also werden wir es benennen. Sind US-Projekt so etwas. Erstellen Sie ein Projekt. Okay, also hat es bereits begonnen, meine Bildschirme hochzuladen. Okay, also hat es den Upload beendet, und für mich ist
es sehr Farce, aber sie haben verschiedene Spüle-Eigenschaften. Okay, also okay, also noch eine Sache, die es mir auf der rechten Seite zeigt. Es kann zeigen, dass es mir zeigt, wer ich die Projekteigentümer oder die Leute bin, mit denen ich
dieses Projekt teile . Außerdem
gibt es eine weitere Funktion, die Aktivität ist, die ich glaube nicht, dass ich Zeppelin jetzt gesehen habe, es zeigt mir Aktivität von jedem Benutzer. Also, wenn ich ah, Durchschnitt eine Datei oder so etwas, es wird die Aktivität anderen Benutzern zeigen, dass dieser Benutzer Dateien auf diesem Benutzer hinzugefügt
hat, hat eine neue Version der Datei hinzugefügt. Also diese M accord, es ist auch Sie können sagen, die
Verwaltung der Versionskontrolle, was ein sehr Ich würde sagen, sehr schwieriges Problem in den meisten der Apsis ist. Okay, das ist
also nach Namen, also gehe ich nach Neo sortiert nach Namen. Das ist dasselbe wie Zeppelin. Außerdem können
Sie die Senke drücken, um Ihre Dateien zu versenken, wenn Sie etwas geändert haben, und Sie können auch Ihre
Dateifreigabe zusätzliche Datei freigeben. Also oben, Sie haben Ihre Kontoeinstellung Suche einladen Menschen, die Sie einladen möchten. Dies ist ein Projekt, und das ist die x'd Datei. Ich bin gerade geöffnet. Ok. Also, wenn ich versuche, etwas zu öffnen, lassen Sie mich doppelklicken. Es wird einige Materie Daten herunterladen, also lädt im Grunde die Bilder und andere Daten herunter, nachdem wir doppelt darauf geklickt haben. Ok. Obwohl ich denke, es fühlt sich schnell für mich an, es ist nur eine Benutzererfahrung. Punkt von wenigen. Okay, also werde ich es hier rüber ziehen. Niemand coole Sache daran ist, dass es Ihnen alle Ebenen auf der rechten linken Seite zeigen wird . Das ist also mein Hintergrund. Dies ist das Logo der Hintergrundoberflächenleiste auf GP-Werkzeugen. Okay, wenn du
also auf das Logo klickst, zeigt
es dir die Größe und die Entfernungen hier drüben an. Sie können auch die Lineale sehen, wenn Sie hier einige Linien wie diese ziehen möchten und einige Ränder oder Führungen hier für Ihre Entwickler können Sie das tun. Okay, also, ähm, auf der rechten Seite, sehen
Sie, dass es mir zeigt, das auf Logo zu exportieren. Okay, wenn es geht, zeigt
es mir Exporteur drei x zwei X Aber ich weiß nicht, warum es mir das Problem der
Exportlösung gibt . Ich empfehle nicht, Ihre Assets mithilfe dieses Datensatzes zu exportieren. Ich habe gesehen, dass Sie sehr schreckliche Ergebnisse sagen können. Ich mag das Extrahierte nicht. Man kann sagen, welche Vermögenswerte sie extrahieren. Sie sind sehr unglücklich auf die sehr geringe Qualität. Ich bin mir nicht sicher, warum sie das haben. Ah, Problem. Okay, also bin ich nicht sicher, ob es mir zeigt, dass J peg B Motor, wie bei der Optimierung aktiviert ist. Aber wirklich, Sie können in diesen 44 Minuten sparen. Sie können hier sehen, wo, aber ich empfehle nicht, diesen zu verwenden. Okay, verwenden Sie Adobe x de bads Export, um Ihre Grafiken zu exportieren. Okay,
Also, jetzt, wenn Sie auf diese Schicht klicken, die unser Textil ist, können
Sie hier sehen wir alle Stile gesehen haben. Was ist ein sehr für den Sport ist die hohe Kapazität vier Größe, aber es ist ein Ford, den sie verwendet haben und Wenn Sie zu diesem gehen, können
Sie alle Gordo vor. in Zeppelin gab es nicht so viel Platz zur Verfügung, aber in ah Platte, Ich habe gesehen, dass es Schnüre für eine Menge aus verschiedenen Schichten erzeugt. Okay, weil es alle Ebenen damit importiert. Also, wenn ich darauf klicke, können
Sie hier das Gericht dafür auch den vierten Namen sehen, Größe alles. Es erzeugt das Gericht, obwohl Sie die erzielten geistig kopieren müssen. Okay, Ihre Entwickler brauchen
also Überschuss hier auf Sie gerade hochgeladen und sie werden es in ihre App
kopieren, um dies zu erstellen. Sie können hier den Text sehen, wenn Sie kopieren möchten. Wenn Sie den Text hier drüben kopieren möchten, können
Sie. Dies ist ein Akkord zum Generieren dieses Stils und dies ist ein Text. Hier geht es also um diese Seite. Es zeigt mir auch ihre Design-Einstellungen. Das ist es. Als Nächstes können
Sie die Designleitfäden auch ausblenden und einblenden, wenn Sie möchten. Sie können auch vergrößern. Verkleinern. Ich werde jetzt rauszoomen. Und es gibt noch eine Funktion, die wir hier auf der rechten Seite sind. Sie können sehen. Okay, hier im Stil, gibt es noch eine Sache, die ich dir zeigen möchte. Wenn Sie auf diese Optionen klicken, können
Sie sehen, es gibt andere Optionen aus verschiedenen anderen ah Sprachen. Wie Android wie ccs-Stil reagieren, reagieren nativ. Wenn ich also auf React native klicke, können
Sie sehen, dass es mir den Code für React zeigt. Einheimische. Das ist also wirklich cool. Ich denke, es hat hier mehr Optionen, und es ist einfacher, zwischen verschiedenen Zitatstilen zu wechseln. Okay, das ist
also diese Ana, noch
eine Sache ist, dass, wenn ich diese habe, okay, wenn ich
also dazu gehe, lass es mich dir zeigen. Also, wenn ich diesen Text hier drüben habe und Sie sehen können, ist der Mörder. Ok. Also kann ich diese Farbe als Variable hinzufügen und ich werde sie grau nennen. Tolle Steuer. Gleiche, wie wir dort hinzugefügt haben. Aber es wird in der Variablen hier drüben sein, so können Sie hier sehen Wir haben eine Variable. Und wenn ich darauf klicke und das hinzufüge, zeigt
es mir Kopieren, Variable, Erstellen, Extrizieren. So ist es auch großartig extra, wo die gleiche Farbe in der gesamten Anwendung verwendet wird. Es wird zeigen, dass diese Variable ist. Also sind diese Variablen genau wie Stil, Führungsfarben oder globale Farben für immer Gericht. Es ist nur, man kann ein bisschen anders Workflow von ah Siplin sagen, aber ich denke, sie kommen dorthin. Okay, Sie können sehen, dass Sie alle Ihre Farben wie diese hinzufügen können. Also, wenn ich zu einem anderen Bildschirm gehe, vielleicht wie dieser, okay, also, nein, ich bin auf dem Bildschirm. Okay,
Also, wenn ich diese hinzufügen, ist das meine Grundfarben Schönheit und so etwas. Also werde ich eine Variable erstellen. Jetzt können Sie sehen, ich habe zwei Variablen, die Zehenkiller hier drüben haben, und OK, damit Sie das Gericht von hier aus generieren können. Ich denke, wenn Sie darauf klicken, können
Sie sehen, dass Sie alle Schnur von diesen Variablen sehen können. Also, wenn Sie weiter alle Farben hier drüben hinzufügen, wie diese, werde
ich es Link blau nennen. Ok. Also können Sie weiter verschiedene Farben hinzufügen, wie das ist, ähm, Textfeld, sehen
Sie, also werde ich weiterhin Variablen hinzufügen hier drüben, und wenn Sie sehen oder hören, habe ich bereits vier Variablen, und ich kann das Gute für all diese Variablen erstellen. Das ist also fast das Gleiche. Das gefällt mir wirklich. Ihre App zeigt hier alle verschiedenen Ebenen. Deshalb erzeugt es mehr Gold. Okay, Sie können sehen, ob ich auf den Slogan Nein Button klicke und zu diesem gehen. Es zeigt mir das Gericht dafür, diesen Login Button zu generieren. Okay, also kannst du hier sehen. Es zeigt mir auch diesen Schattenversatz. Also bin ich nicht sicher, ob ich nicht 1/4 bin. Aber aus einer Viertelperspektive, denke
ich, dass sie diese Vermögenswerte nicht brauchen. Sie können diese Schaltfläche nur basierend auf diesem Gericht generieren. Okay, das ist
also das? Nein, hier drüben
gibt es noch ein paar Sachen. Als wäre das Hand. Du kannst es benutzen, um Dinge zu bewegen, und dann haben wir dieses schlaffe Werkzeug. Sie können hier verschiedene Elemente auswählen, um
anzuzeigen, was verschiedene Stile sind, abgelehnt. Und dann haben wir dieses Denkmal. Es wird Meiring sein. Alles in Ordnung? Wenn ich also versucht habe, auf irgendetwas zu klicken, wird
es so moderieren. Ok? So können Sie jetzt sehen, es zeigt mir etwas anderes über die Größen und die Abstände zwischen den Elementen. Sie sind jetzt prominenter, und auch das ist Wiggler. Sie können Farben hinzufügen, indem Sie hier auf diese Weise klicken. Also, wenn ich versuche, Farben hier hinzuzufügen, kann
ich verschiedene Farben haben. Okay, also habe ich nicht verstanden, was es bedeutet, all diese Farben hier drüben hinzuzufügen. Denn wenn ich zu einem anderen Bildschirm gehe, lass mich zu einem anderen Bildschirm gehen. Ok? Also, wenn ich zu diesem Bildschirm gehe und es hier keine Farben gibt, sind
sie nicht global. Sie sind in diesem Bildschirm auf Lee definiert. Also gefällt mir das nicht. Sie können diese Methode oder Dysfunktion sagen. Außerdem können
Sie Ihre, ähm,
Entwürfe loben ähm, . Wenn jemand hier loben will, kann
er hier drüben loben. Und hallo da. Das ist allgemeines Kommando. Wenn Sie eine Generierung wünschen, können
Sie auch einen solchen Zusatz hinzufügen, indem Sie hier über klicken. Und ah, du bist da ist ah, Rechtschreibfehler. Okay, also werde ich diese Generation so erschaffen. Okay, also hat es gestärkt und Sie können auch den Status beitreten. Sie können es löschen oder Sie können sagen, dass es von mir oder dem Designer oder dem
Entwickler gelöst wurde . Es gibt also viele Features hier, die ich wirklich besprechen möchte. Andi,
ich denke, ein paar weitere Dinge tragen mich noch ein paar Sekunden mit. Okay, also werde ich das hier öffnen. Und wenn Sie zu diesem Projektfenster gehen, ist die linke Seitenleiste. Okay, wenn ich
also irgendwelche von diesen Designs öffne, können Sie auf der linken Seite sehen, gibt es Versionskontrolle . Das ist also die Versionskontrolle. Wenn ich also versuche, ein neues Design oder eine Kette hochzuladen, wird mir zeigen, dass dies
Version eins ist . Dies ist Virgin zu waschen Eintrag. Ich kann sie in einer Vorschau anzeigen. Ich kann jede Version öffnen, die ich hier habe. Das ist also wirklich cool. Ich zerstöre mich auch. Die Projektinformationen. Laden Sie ins Team ein. Öffentliche Verknüpfungskraft kopieren. Ich bin mir nicht sicher, warum sich das formt. Es ist in Ordnung. Ich bin mir nicht sicher, was das ist. Ich habe es nicht benutzt. Und auch der ehemalige Es ist dieser. Okay, das ist
also nur die allgemeinen Informationen. Es hat also eine Versionskontrolle, die ein gutes Feature ist, als es alle Layer anzeigt. Und ah, Ihre Entwickler können die Datei auch von hier herunterladen. Sie können es teilen. Sie können es mit Ihrem Teammitgliederbefehl teilen. Inspection. Ah, viele Dinge. Sie können es hier tun. Ich glaube, sie sind auf gleicher Tough. Sowohl Zeppelin als auch jedes Gericht. Sie sind kreativer Zeh. Arbeiten Sie mit Ihren Entwicklern zusammen. Ich will nicht, dass dieser Vortrag 30 Minuten dauert. Ich hoffe, Sie haben diese Lektion genossen. Wenn dir dieses Video gefällt oder du wirklich mehr darüber wissen willst, kannst
du mir die Fragen stellen. Ich hoffe, Sie haben diese Lektion und die Informationen in dieser Lektion genossen. Wir sehen uns bald in einem anderen Video.
69. Öffne Skizzen, Photohsop und Illustrator-Dateien in XD: Nein. Das sehr anständige Feature von txt ist, dass es Photoshopped Dateien öffnen kann und es auch Ihre Skizzendateien
importieren kann . Okay, also werde ich das versuchen. Ich habe ein paar Skizze und eine für die Shop-Dateien gespeichert. Also werde ich das tun, wenn es es öffnen kann, okay. So kann er es öffnen. BST Forex t Ich werde es Zehe öffnen. Mal sehen, Was sind die Stile, die es konvertieren kann und wie es aussieht und Okay, so ziemlich gut okay. So wirklich gut. Ich würde es wirklich mögen. Es war sehr schnell. Und Sie können sehen, dass die vierte Kraft die gleichen sind. Der Hintergrund, Es hat einen Hintergrund. Ich hatte einen Hintergrund. Okay, also ist es das Gleiche. Okay, also habe ich eine Last und dann haben wir diesen Phil, der Grady int ist? Okay, so super cool. Alles ist gleich. Ich habe Zutat verwendet. Ich habe unsere Steuerakte benutzt. Ich habe Schatten benutzt und ich bin mir
nicht sicher, woher der Schatten kommt. Okay, wenn ich
also zu diesem gerundeten gehe, Okay, also ist Schatten auch übersetzt Nun, also werde ich 10 von 10 Markierungen auf dieser einen geben, also lasst uns diese Skizzendatei in Adobe X T öffnen und ich bin diese geöffnet. Das ist auch sehr einfach. Woops. Okay, das ist
also fast das gleiche, wie es in einer Skizze erscheint. Und Ah, ich denke, ich bin wirklich aufgeregt über dieses neue Feature. Es kann alles importieren. Sie können alle Schichten auf der linken Seite sehen und ah, sagen
Sie nicht okay. Auch, hier haben wir ich hatte einige Gruppen in meiner Fotoshow Datei. Sie können sehen, dass es auch alle Gruppen importiert hat. Also das ist erst kürzlich erschienen, Ich denke, vielleicht ein paar Tage zurück ein oder zwei Tage zurück, Ich fand das. Okay, also ein weiteres Feature,
das ist, dass Sie CC-Bibliotheken Bild darin verwenden können. OK, wenn Sie
also eine Bibliothek haben, einige Farben gespeichert. Ok. Stellen Sie also sicher, dass Sie in Ordnung ,
also , können
Sie hier sehen, ich habe die Farbpaletten und alle Collector-Style und Absatzstile aus meiner Photoshopping-Datei. Ich habe sie hier gerettet. Sie können das in Ihrer Creative Cloud verwenden. Okay, also wenn ich etwas hierher ziehe und ich diese Farbe oder diese Farbe aus meinen
Farbpaletten füllen möchte , habe ich Informationen generiert, um zu zeigen oder Illustrator kann ich das tun. Und es gibt eine weitere Funktion, die ich werde Zehe zeigen Sie in einer anderen Lektion, die ist, dass Sie auch Ihre Live-Handel von Ihrem ah Illustrator-Symbole verwenden können. Wenn Sie einige Symbole in Illustrator entwerfen, lassen Sie mich sehen, ob ich Illustrator hier drüben habe. Okay, also werde ich eine neue Datei erstellen. Ich werde alles mobil benutzen. Okay, also klären Sie einfach etwas, und ich werde nur eine Form verwenden. Ich werde hier drüben nur eine Form benutzen. Schlaganfall. Ich benutze neun Punkte. Ok? Und lassen Sie mich umziehen. Also werde ich mentale benutzen. Okay, also werde ich mit diesem Schiff gehen, nur mit diesem Schiff, und mal sehen, ob ich es kopieren und in Großbritannien benutzen kann. Also lassen Sie es aus dem Haar kopieren und es in einem edlen 60. Es ist selbst und es ist am besten Oops. Okay, damit es Live-Formen hierher bringen kann. Sie können hier drüben sehen, ich habe diese Form in Adobe gezeichnet, eigentlich. Also der Adobe Illustrator, das ist tatsächlich hat es eine Menge Kontrolle über Formen und Symbole. Sie können viele Symbole in Adobe Illustrator erstellen, die ein großartiges Werkzeug zum Erstellen von Logos,
Symbolen,
alles ist Symbolen, . Sie können den Filter entfernen, Sie können sehen, dass wir hier sind, und es hat dieses Schiff erstellt. Das ist also ein weiteres Merkmal. Sie können Ihre Inhalte von Illustrator oder für den Shop kopieren und von ihm zurückkopieren. Ok. Ok. Also gab es ein weiteres Feature, das von C C war. Wenn Sie Ihr Symbol in Ihrer C-C-Bibliothek verwendet haben. Ok. Also, wenn ich hier drüben dazu gehe, öffnen Sie CC-Bibliotheken. Und wenn Sie ein Symbol hier in der CC-Bibliothek haben, speichern
wir es in der C-C-Bibliothek um zwei. Bibliothek. Es ist mehr davon. Oder Haare. Erinnern Sie mich später. Okay, also werde ich meine Bibliothek benutzen, und ich werde sie hinzufügen oder zischen. Ok. Also habe ich hier ein grafisches Bild, das Kunstwerk eins ist. Lassen Sie es uns so lassen und ich werde es ähnlich verwenden. Oder hier. Wo ist meine Sissy Bibliothek? Und ich gehe in meine Bibliothek und ich werde diese Form hier importieren. Eso ist es tatsächlich gehen, diese zu verknüpfen? Ja. Also, wenn ich versuche, etwas hier drüben zu ändern, wird
es automatisch über das Haar reflektiert. Okay, also lass mich dir sagen, dass dieser auch diesen verdünnt. Das hier, das hier. Ok. Also, nein, ich habe meine Form aus meiner Bibliothek importiert. rechten Maustaste auf. Es muss eine Option Toe geben. Ok. Also werde ich das hier drüben bearbeiten. Lass es uns beenden. Oder hier, weil es derjenige ist, der verknüpft ist. Also gehe ich mit den Zeh. Schließen Sie es, speichern Sie es. Und ich denke, nein, es sollte sich hier widerspiegeln. Also hier haben wir die nächste, sehen, ob Okay, so jetzt können Sie sehen, ich denke, es wurde hier schon betroffen. Lass es uns in etwas anderes ändern. Das soll das hier aussehen. Komm schon, C S. Also habe ich das hier. Okay, also was ich versuche zu tun, ist, dass ich versuche, diesen zu ändern. Okay, was ich versuche zu tun, ist, seine Farbe zu ändern. Die Eigenschaften gehen, um seine Farbe zu blau zu ändern. Ich werde es so retten. Als nächstes schließe diesen und lass uns sehen, was mit passiert. Ok, also wurde es hier drüben aktualisiert. Ich bin mir nicht sicher, warum es hier nicht operiert hat. Okay, also lass uns das ist der Sanitäter. Sie können Ihren Designer arbeiten. Wenn jemand ein Symbol entwirft, kann
er in Illustrator arbeiten. Und wenn sie ein Symbol dort drüben bedienen, wird
es in Ihren Adobe axity Dateien sofort ohne Aufwand widergespiegelt werden. Wenn Sie diese Bibliotheken verwenden, keine BCC-Bibliotheken, kreative Cloud-Bibliotheken. Okay, das sind
also die wenigen Features, die ich euch wirklich zeigen wollte, dass es importieren kann. Ah, viele verschiedene Dateiformate und,
ah, ah, viele verschiedene Tools von Adobe Family und auch von Skizze. Und ah, ich hoffe, Sie haben diese Lektion genossen. Fahren wir mit der nächsten Lektion fort.
70. Adobe XD Aktualisierungen April Mai 2018: heute werde ich Zehe aktualisieren Sie mit den neuesten. Was passiert mit Adobe X T Und ich wollte wirklich über ihren neuen Plan sprechen, das ist der Strukturplan und Adobe? Eigentlich haben
sie einen Job, eine Firma. Sie haben es frei gemacht. Also, wenn Sie ein Designer oder Entwickler oder User Experience Designer sind. Sie sollten von diesem profitieren. Erzählen Sie Ihren Freunden und anderen davon, und sagen Sie ihnen auch, dass Nehmen Sie meinen Kurs. Okay, das ist Adobe X T. Und Sie können einen Prototyp 1 teilen und Spezifikationen 1 und 2 GP aus Cloud-Speicher entwerfen, was kostenlos ist mit Adobe X'd und ah, das ist für Sie. Wenn Sie Freiberufler sind, können
Sie es einfach verwenden. Dies ist ein großartiges Werkzeug. Und es gibt noch ein paar weitere Updates, die da drin kommen. Meine und Apple Session, lassen Sie mich es Ihnen zeigen. Also hier sind die wenigen Updates, die später Themen aus sind. Es wird XTC sein. Sieh mir einen Apfel an. Ich werde Ihnen einige von ihnen in diesem Video zeigen. Also lasst uns zu unserem Adobe wechseln, tatsächlich Bildschirm und sehen, was die Schauspieler sind. Okay, also hier haben wir auf dem Bildschirm. Ich muss hier drüben Symbole machen. Ein paar Symbole, drei Bildschirme, drei Yard Boards, einige Textilhaare. Also, wenn Sie zu diesem Asset gehen, spannen Sie es auf, indem Sie dieses Assets hier rüber treten. Wenn du etwas aus dem Textil oder der Praxis siehst, würde
ich es zu Recht nennen. Es gibt eine neue Sache, die Highlight on Canvas genannt wird. Also, wenn ich darauf klicke, wird
es den gleichen Stil hervorheben, der auf allen Kunstbrettern verwendet wird und Highlight sind jeweils von ihnen. So wird jede Instanz aus diesem Traktorstil hervorgehoben. Noch eine Sache. In ähnlicher Weise können
Sie das gleiche mit diesem tun, also wird dies hier verwendet. Dies ist also das Symbol wird es dreimal auf drei verschiedenen Kunsttafeln hervorheben. Das ist also ein sehr cooler Trick, wenn Sie viele Symbole haben und SieIhre Bibliothek nicht
durcheinander bringen wollen, Sie können leicht zu ihnen gehen und sehen, wo sie verwendet wurden. Ihre Bibliothek nicht
durcheinander bringen wollen, Außerdem können
Sie das gleiche mit den Farben tun. Die Farben waren, dass Sie ein Killer-Highlight auf Leinwand verwendet haben. Sie werden dieses grüne Farb-Highlight auf Leinwand hervorheben. Sie werden die Textabnutzung hervorheben. Diese Farbe wurde verwendet. Das ist also ein sehr cooles, ein neues Feature. Noch eine Sache. Sie können auch Ihre Vermögenswerte wie diesen Farbkorrektor,
Stile,
Symbole ausverkauft Stile, . Sie können auch in Symbolen suchen. Zum Beispiel habe ich sie Symbol eins genannt. Also, das geht nur auf die Zehe. Suchen Sie das Symbol und es zeigt mir dieses Symbol eins. Es ist der Name aus dem Symbol, das ich suche. Also, wenn du hier rüber gehst und zu diesem Bildschirm gehst und ah, wenn ich zum Symbol gehe, kannst
du Symbol ein Symbol in irgendeinem Text sehen. Das ist also ein großartiger da oben. Sie haben noch eine Sache, die ich wirklich geliebt habe. Es ersetzt. Du ersetzst deine Symbole. Okay, also wenn ich will, dass dieses Symbol auf diesen all diesen drei Symbolen grüne Symbole durch
dieses ersetzt werden . Ich werde das hier rüber ziehen und überall sonst wird es durch
das Symbol eins ersetzt . So können Sie sehen, dass dies ein großer Zaubertrick ist. Wenn Sie Ah haben, Adobe x t. Sie können dies versuchen. Okay, ein weiteres neues Update basiert auf mehreren Kunstbohrungen. Okay, zum Beispiel, zum Beispiel, wenn mein Text hier drüben ist und ich will, dass er an der gleichen Stelle auf allen anderen
Kunsttafeln ist, werde
ich ihn kopieren und Boote auswählen, die Kunstbretter. Ich werde beide Herzbretter auswählen, indem ich Shift-Steuerbefehl drücke. Wir und Sie können sehen, dass sie genau an der gleichen Stelle eingefügt werden, wo ich sie sein wollte, so dass Sie mehrere Kunsttafeln verwenden können, und Sie können ein Element oder ein Symbol mehrere Kunsttafeln gleichzeitig einfügen. Jetzt gibt es noch eine weitere Funktion zum pastoralen Schutz Ihrer Design-Spezifikationen und
Support-Prototypen , die Sie vielleicht nicht möchten, dass jeder Ihren veröffentlichten Prototyp sieht. Sie können darauf klicken. Sie können auf das erforderliche Passwort hier auch ähnlich klicken, für veröffentlichte Design-Spezifikationen können
Sie ein Passwort benötigen, also sind dies die neuen Funktionen von Adobe X t. Ich hoffe, Sie haben diese Lektion genossen. Wenn Sie Fragen haben, die Sie mir stellen müssen, lassen Sie uns weitergehen, um mehr über txt zu erfahren
71. Juni 2018 Adobe XD Update überlagert sich eine feste Position: heute werden
wir uns eines der größten und über 60 Updates aller Zeiten ansehen, die ich wartete und einer von ihnen ist diese übermäßig Unterstützung. Also werde ich Ihnen in dieser Lektion zeigen. Was sind die neuen Updates, die kürzlich hinzugefügt wurden, toe Adobe XTC C war in festgelegten festen Positionen. Privat lädt eine bessere Kontrolle für Bildfelder ein, Design mit mathematischen Berechnungen und, ähm, über Lissa Board. Also werde ich zu meinem Adobe extra wechseln. Ich werde Ihnen zuerst diese beiden zeigen, die mit dem Prototyping verwandt sind. Also mal sehen, was sind diese Updates und was Sie damit machen können und was Sie mit Ihren
Prototypen neu machen können ? Okay, jetzt habe ich hier nur einen einfachen Prototyp von diesen Bildschirmen erstellt und lassen Sie mich verkleinern, und ich werde Ihnen zeigen, dass es noch ein paar Kunsttafeln gibt. Eines ist diese Tastatur One ist dieses Aktionsblatt für uns. Nun, wenn Sie
diesen Prototyp spielen, , und Sie können sehen,dass die sehr schöne Sache daran ist, so dass, wenn ich scrollen, können
Sie sehen, dass mein dieses Plus-Symbol das behoben ist und dieser Stop-Header behoben ist. Ist das unten eine Navigationsleiste oder unten? Nie. Es ist auch fixiert, und mein Inhalt ist, dass Sie sehen können, bewegen und gleiten unter ihnen. Also das ist Ah, wirklich erstellen Update für Adobe X T und Sie werden es wirklich genießen. Also die meisten der Zeiten, wenn wir ihre mobilen APs erstellen oder vielleicht Websites dort Header sind fixiert. Wenn wir also den Inhalt verschieben, bleibt
der Header an der Spitze haften. Dies ist also das neue Update in diesem Juni X'd Update 2018 Juni 2018 Und Sie können dies mit
Ihren Elementen tun . Okay, also noch eine Sache und übermäßig, und ich werde es dir zeigen. Also, wenn ich gehe, werde
ich dieses Plus-Symbol drücken. Sie können sehen, dass dies über weniger Bildschirm ist, so dass Sie das gleiche Overlay in mehreren verschiedenen
Kunstboards verwenden können und lassen Sie mich Ihnen wieder zeigen. Das ist Overlay. Und wenn ich zum zweiten Bildschirm gehe, siehst du hier drüben Dies ist mein zweiter Bildschirm und du kannst die Saleh Mantis Fix sehen, aber andere bewegen sich. Wenn ich also auf dieses klicke, ist
dies, dass dies ein weiteres Overlay ist. Also habe ich auf diesen gewartet. So können Sie jedes Element auf jede andere Kunst überlagern. Und Sie können das übermäßig mehrmals mit einem einzigen Overlay in verschiedene Kunstbohrungen verwenden. Okay, also werde ich Ihnen zeigen, wie Sie das tun können. Das ist also sehr einfach. Ich werde hier ein neues Dokument erstellen. Ich habe 678 gefunden und lassen Sie uns die Kontrolle oder den Befehl Null vergrößern. Und was ich tun werde, ist, dass ich ah,
feste Header erstellen werde , und es ist sehr einfach. Und Zeh füllen Sie es mit etwas Farbe. Lass es uns rot machen und die Grenze entfernen. Okay, hier ist Sie können sehen, dass sie auf der rechten Seite feste Position hinzugefügt haben, also wird dies es repariert machen. Und noch eine Sache, die Sie in diesem linken Spitzenpanel erinnern müssen, spielt auch
die Reihenfolge aus der Liste eine Rolle. Wenn Sie also die obere Schicht legen, wird
dies behoben werden. Stopp. Hatte es. Also werde ich es so nennen. Und jetzt, was ich tun werde, ist, dass ich einige Inhalte setzen werde, nur um diese Zeile
mehrmals zu besänftigen . Ok? Also hier haben wir es. Wir haben verschiedene Linien. Jetzt stellen Sie sicher, dass dies Ihre Top-Heather, es wird an der Spitze sein. Also werde ich es oben im Layer-Stapel verschieben, weil es oben an
dieser Linie scrollen wird. Okay, das ist
also, dass du sichergehen musst. Und Ah, was Sie tun können, ist, wenn Sie wissen, drücken Sie das, halten Sie
einfach auf. Es passiert nichts. Also müssen wir noch eine Sache reparieren, die wir machen, um diese Kunst ein bisschen größer wie
diese hier drüben gelangweilt . Das macht es wie OK, also wenn Sie diese blaue Linie in dieser Leiste sehen können, ist
dies weit, wenn Sie Ihre Ansicht Board einstellen. Okay, lass mich es dir zeigen. So können Sie hier sehen, haben wir die Aussicht. Port-Einstellung ist 2667 Also, wenn ich versuche, dies zu bewegen, wird
es sich bewegen. Dies ist ein weiteres neues Feature, das sie haben. Ich habe keine neueren Versionen. Okay, also jetzt, wenn ich versuche, es zu spielen, können
Sie sehen, dass ich Bildlaufleiste habe, und Sie können sehen, dass mein Inhalt hinter diesem oberen festen Header ist OK, also lassen Sie uns etwas Schatten hinzufügen, damit wir richtig sehen können, was passiert über hier. Also werde ich einen dunklen Schatten haben, der sich ausbreiten wird, wie 30 große Oezil oder 30 Punkte hier drüben. Okay, also werde ich wissen, Play it und du kannst sehen, wie es sich dahinter bewegt. Okay, das ist
also wirklich cooles Feature. Sie können auch den Hintergrundbluteffekt damit machen. Wenn Sie also ein Bild mit Haaren haben und eine Hintergrundunschärfe an diese angepasst haben, können
Sie auch den Hintergrund schwarz machen. Ok. Stellen Sie also sicher, dass Ihr Header hier oben steht. Oder ein beliebiges festes Element, das Sie wollen. Toby oben. Sie müssen es in der Spitze in der Nähe Spanisch sein. Okay, das ist
also ein Feature, also das nächste, das ich dir zeigen werde, ist übermäßig okay. Also, was Sie tun können, ist zum Beispiel, wenn ich mich zu diesem gehen lasse, unser uns, wecken
Sie es auf, okay? Jetzt siehst du, dass ich das geöffnet habe, von dem du es weckst. Und was ich tun werde, ist, dass ich
zum Beispiel einige der Elemente von hier verwenden werde . Und das sind all diese diese Meldungsfelder. Das ist also ein Aktionsblatt. Ich gehe die Zehenkontrolle. Sehen Sie? Oder Befehl. Sehen Sie sich das gesamte Aktionsblatt hier drüben an. Und ich werde die Zehe gehen. Lassen Sie uns das schließen. Okay, hier haben wir es. Lasst es uns hier drüben stützen. Okay, das ist
also mein Aktionsblatt, und Sie können sehen, dass es in der Fußleiste ist. Also, wenn ich diesen Entwurf zurückziehe, kannst
du sagen, das ist unser Brett. Das ist Weltraumhafen. Was wir also tun müssen, ist, dass wir es zuerst zu einem Kunstboard machen müssen. Okay, so wird es funktionieren. Also werde ich 678 drücken und Sie können hier sehen, dass wir es drin haben. Lass es uns so machen und wissen, was ich tun werde, ist in diesem Bereich hier drüben. Ich werde einen Knopf hinzufügen, vielleicht so etwas hier drüben. Machen Sie einfach einen blauen Knopf. Das war's. Diese Übung ist nur, um Ihnen zu zeigen, was Sie damit machen können. Also habe ich hier auf diesem Gebiet einen Knopf erstellt, und ich werde es auch für Expedition schaffen. So wird es repariert werden hier und an der Spitze. Okay, also,
ähm, jetzt gehen wir zum Prototyp. Hier werden wir die Magie machen. Also werde ich es mit diesem Bildschirm verknüpfen. Und anstatt Übergang, werde
ich es übermäßig schaffen. Okay, jetzt können Sie auf der linken Seite sehen Es zeigt Ihnen, wo Sie Ihre übermäßig platzieren . Okay,
Also, wenn Sie eine kleine Größe da drüben haben, wie Sie sehen können, es nimmt die ganze Leinwand Größe sind unsere ganze Ansicht. Porengröße Wenn Sie einen größeren Ansichtsport haben, können
Sie ihn nach oben und unten verschieben. Ok. Also, wenn ich es hierher schiebe,
siehst du, dass ich es nach unten schiebe, oder ich kann es nach oben bewegen. Also werde ich es so hinunterschieben. Okay, also lasst uns den Übergang ändern. Übermäßig auflösen ist aus. Okay, das ist
also kreieren. Selbst wenn du es von unten stützen willst
, dann lass uns ah, lass es uns aufschieben. Also werde ich jetzt Slide nach oben benutzen. Wir werden spielen und lassen Sie mich Ihnen zeigen, wie es läuft, damit Sie sehen können, dass sie so von unten nach
oben rutschen . Und auch Sie können von oben sehen, es ist unten ein wenig. Ich habe es angepasst, aber richtig, aber ich denke, du solltest den ganzen Bildschirm aufnehmen. Und das ist nur zur Demonstration. Ok? Nun, was ist der Nutzen daraus? Also haben wir über Leasing. Also, wenn ich ein anderes Kunstboard wie dieses habe und ich eine andere Last hier drüben habe, die
zum Beispiel
dieses ist zum Beispiel und sie es auch mit dem gleichen Aktionsblatt verknüpfen wollen, möchte
ich nur, dass es mit diesem verknüpft wird, und ich gehe Zeh, lass es nach oben rutschen, und das war's. Okay, jetzt können Sie sehen, dass ich es mehrmals auf verschiedenen Bildschirmen verwenden kann. Also muss ich nicht, wissen
Sie, ähm, ähm, mein Kunstbrett mehrfach
duplizieren. Also, wenn ich eine Komponente habe, die auf anderen Bildschirmen verwendet werden kann, oder es kann übermäßig andere Bildschirme, vielleicht Aktion betrügen einige weitere Optionen, Also kann ich das tun, indem ich einfach diese Taste drücke und es so übermäßig macht, so ist dies unsere übermäßig und wir können es mehrfach in unseren Prototypen verwenden. Okay, also das ist eine von den mächtigsten, ich denke, Updates bieten ausgeliefert zu werden. Aber ich bin mir nicht sicher über die Zukunft, aber im Moment ist
das das Beste. Ich denke, ich kann Sie von Adobe 61 bekommen. Ist das fix Verschmutzung und Verschraubung des Inhalts? Es scrollt dahinter. Und andere ist, dass diese übermäßig Elemente Sie können auch Ihre Tastaturen und andere
Elemente überlagern , wenn Sie möchten. Oh, also geht es darum. Ich werde Toe teilen Sie mit Ihnen ein paar weitere Updates teilen, die sie ihre nicht
sehr bedeutsam in der nächsten Lektion gemacht haben . Okay, ich hoffe, Sie haben dieses neue Prototyping genossen. Schöne Prototyping-Updates von Adobe X t und bis bald. In einer anderen Lektion.
72. Juni 2018 Aktualisierung von math: Jetzt werden wir uns ein paar weitere Updates ansehen, die Adobe X im Juni 2018 gemacht hat. Und einer von ihnen ist eine verrückte Berechnung hier drüben. Okay, wenn ich es
also mit 1,5 multipliziere,
siehst du, dass ich die nächste Höhe kriege. Das ist also sehr cool. kannst du tun. Zum Beispiel. Ich werde es abnehmen mit 58 es wird es nach oben bewegen. Okay, also ist das wirklich cool. Sie können mathematische Berechnungen sind hier drüben, wo die es sehr eng und exposition. Und warum positionieren Sie sich von diesem Element? Also, das ist eine von ihren oben. Es gibt noch ein Update ist. Also, wenn Sie zu diesem Publish-Prototyp gehen, wenn Sie darauf klicken, können
Sie neue private Link in einer besseren,
besseren Version sehen . Wenn Sie also darauf klicken, können
Sie sehen, dass Sie den Titel hier platzieren und einen privaten Link erstellen können, den Sie
mit Ihnen unsere Show mit einem oder zwei Personen privat teilen können . Ok, also wird es nicht für alle global sein. Sie können auch erstellen, um Sie sehen können, können Sie auch hier einladen. Du musst zuerst den Teil veröffentlichen, bevor du Leute eingeladen hast. Okay, also, ähm, Sie können diesen privaten Link erstellen. Dies ist eine neue Funktion, die sie gerade hier hinzugefügt haben. Okay, jetzt, das dritte Update, das zuerst sehr ärgerlich war. Also, wenn Sie versuchen, hier drüben eine Ellipse auf einem Kreis zu erstellen, ist
das Problem, wenn ich versuche, ein Foto oder Bild hierher zu bringen, zum Beispiel, diesen Kerl. Also, wenn ich versuche, es hier drüben so zu kleben, mit einer Moschee. Also in der hässlicheren Version davor, konnten
Sie dieses Bild nicht bewegen. Jetzt können Sie darauf doppelklicken und Sie können es so bewegen. Sie können die Höhe und Größe alles anpassen. Das ist also, denke
ich, sehr benötigte Funktion, die in der ersten Version von diesem fehlte. Die Versionen vor diesem Juni 2018 aktualisieren und ich liebe es wirklich. Damit du es wissen kannst. Ziehen Sie Ihr Bild einfach per Drag & Drop in einen beliebigen Bereich. Zum Beispiel, dieses und Sie können es einfach so ziehen und verschieben Sie es so. Ok, also geht es auf die Zehe. Klemmen Sie das drinnen. Dieser Bereich, und Sie können leicht bearbeiten, indem Sie doppelklicken und Ihre Größe so etwas anpassen. Das sind also die wenigen Updates, die sehr cool sind. Ich liebe diesen hier wirklich. Das ist echt cool. So können Sie leicht ein Datum Ihre Film-Moschee oder Phil Phil Bild Moschee Formen hier oben. Und Sie können hier auch mathematische Berechnungen durchführen. Und einer ist dieser veröffentlichte Prototyp mit privatem Link. sind also alle Updates im Juni 2018. Ich hoffe, Sie haben diese Lektion genossen und ich hoffe, Sie werden diese Updates lieben. Ein paar von ihnen. Ich habe sie wirklich geliebt. Ich vermisse immer noch einen Schatten hier drüben. Ich bin mir nicht sicher, wann sie gehen. Zehe hatte noch einen Schatten über dem Haar oder mehrere Schatten. Ich warte auf diesen Tag. Ich hoffe, Sie haben diese Lektion genossen. Fahren wir mit der nächsten Lektion fort.
73. 06 stacking Aug 2020: In diesem Video werden wir über die neuesten Funktionen
von Adobe XD lernen , die Stapeln ist. Nun, stapeln, wie Sie bereits wissen, bedeutet das, dass wir unsere Sachen nach oben
und unten legen und dann können wir sie neu anordnen. Also, wie es tatsächlich funktioniert. Wir werden also ein paar der Gruppen schaffen. So funktioniert es mit Gruppen. Zum Beispiel, ich habe diese Zeile hier drüben. Lasst uns die Grenze entfernen. Und ich werde auf den Kopf klicken, wie dieses Blau. Und dann werde ich hier drüben eine Steuer errichten. Und machen wir es 12 Pixel hier drüben. Das wird also unser Gruppenbefehl oder
Kontrolle G sein und dann werde ich es replizieren. Okay, jetzt können Sie sehen, wir haben sechs Gruppen hier
auf der linken Seite. Sie können sehen, dass wir sechs Gruppen haben, Gruppe 123456. Nein, ich werde sie in eine andere Gruppe gruppieren, nur um ihre Stapelung zu kontrollieren. Also Befehl und Kontrolle G, Dies ist unsere, nennen wir es Master-Gruppe. Jetzt können Sie sehen, dass wir diese Monstergruppe erstellt haben. Jetzt werden wir klicken, wählen Sie diese MOSFET-Gruppe und aktivieren Sie unsere Stapelung. Also werden wir hier rüber klicken. Und das ist unsere Stapelung von oben nach unten, von rechts nach links. Also gerade jetzt sind wir von oben nach unten. Also werden wir mit vertikalen Stapel bleiben. Und Sie können hier sehen, wenn ich versuche, klicken und klicken Sie und wählen Sie diese und ziehen Sie es hier nach oben, können
Sie sehen, dass es die Position mit der zweiten ändert. Wenn ich versuche, das hier nach oben zu bringen, lassen Sie es uns hier rüber bringen. Es wird an der Position bleiben, wo der letzte noch war. Ich kann das noch mal gebrauchen. Drücken und halten Sie die Umschalttaste gedrückt, so dass es in der Zeile geht. So können Sie auch hier sehen, Sie den Abstand zwischen zwei Gruppen hier so reduzieren können. Sie können Sie vor, Layout und Entfernung oder Haarabstand vor und nach sehen. So können Sie diesen Overhead verketten. Also, wenn wir das hier auswählen, okay? So funktioniert das Stapeln also. Wenn Sie jetzt entwerfen, haben
Sie möglicherweise die obere Navigationsleiste. Möglicherweise haben Sie hier einige vorgestellte Bereiche, Bilder oder so etwas. Sie könnten also andere Gruppen haben oder hier, vielleicht haben Sie ein Bild hier drüben, zum Beispiel, wie dieses. Sie könnten also ein Rechteck haben. Hier sind also ein paar Bilder. Ich werde ein bildbares Haar auf meinen Pfeil vx t ziehen und fallen
lassen. Gehen wir zurück zu den Ohren, Kugeln und doppelklicken Sie darauf. Und Sie können sehen, dass dies unser Bild ist. Also, wenn ich es nach oben bewegen will, können
Sie hier drüben sehen, ich kann es leicht nach oben bewegen. Das ist also wirklich hilfreich, wirklich, wirklich hilfreich, wenn Sie das Layout Ihrer mobilen App oder Ihrer Website ändern möchten. Sie möchten einige Abschnitte nach oben und unten verschieben. kannst du in einem Augenblick tun. Das ist also wirklich hilfreich. Neue Funktionen Stapeln, können Sie die Reihenfolge in
vertikale Kleben auf die eine ändern , wo wir diese Stapelung hier haben. In dieser Reihenfolge. Sie können hier sehen, jetzt ist es gewesen, das Layout wurde geändert. Also lasst uns die Größe der ändern, unser Kreditnehmer hier. Lassen Sie uns etwas verkleinern. Und jetzt können Sie sehen, ob ich die Reihenfolge ändern möchte, kann
ich das so machen. Das ist also tatsächlich horizontales Stapeln. Und das erste, das ich dir gezeigt habe, die vertikale. Sie können auch etwas Polsterung um es herum haben. Das ist also der ganze Abschnitt. Sie können ein paar Betten hinzufügen. Sie können sehen, ob ich versuche, die Polsterung zu reduzieren, dies ist eine Polsterung auf allen Seiten dieser MOSFET-Gruppe, diese ganze Stapelreihenfolge. So verwenden Sie horizontale oder vertikale Stapelung in Adobe XD. Ich hoffe, Sie haben diese Lektion genossen. Dies ist die Laser neueste Funktion vor kurzem im Jahr 2020 eingeführt, denke ich. Gehen wir also zur nächsten Lektion über, um ein paar weitere Dinge zu lernen.