Adobe XD: Layout und Raster

Name: Adobe XD: Layout und Raster
Author: Alyssa Galganov

Lernen Sie, wie man dynamische Layouts in Adobe XD erstellt

Preview the first lesson free — get full access to all 5 lessons.

Kurs: On-Demand

Hallo! Mein Name ist Alyssa, und in diesen Lektionen Wir werden die Arbeit mit Adobe XDs durchgehen Layout und Raster. Das Definieren eines Rastersystems wird Ihnen bei Ihrem Design helfen in Ausrichtung bleiben und kann wertvolle Zeit beim Pixelmessen sparen und Abstand zwischen den Elementen. In Adobe XD gibt es zwei Optionen um Anleitungen beim Einrichten Ihres Designs zu geben: Layout und quadratisch. Sehen wir uns das Layout-Raster an. Ich werde einfach eine neue Datei erstellen indem Sie hier auf meinem Startbildschirm klicken auf die Schaltfläche Neue Datei, und der Standardbildschirm von 1920 Pixel breit und 1080 Pixel hoch ist ausgewählt. Ich klicke einfach hier in den grauen Bereich abwählen, weil ich es dir nur zeigen will dass, wenn Sie auf den Namen klicken, Wir können die Zeichenfläche auswählen. Wenn wir die Zeichenfläche auswählen, Sie können hier im Immobilieninspektor nachsehen dass sich unten eine Gitterplatte befindet. Derzeit heißt es Layout für den Rastertyp, und wenn wir auf den Chevron klicken, Sie können sehen, dass Sie zwischen Layout und Quadrat wählen können. Ich werde es beim Layout belassen, und ich werde weitermachen und klicken Sie hier in dieses kleine Kästchen, und was uns das tun lässt, ist umschalten das Layoutraster. Derzeit ist es die Farbe Cyan, und es sind 12 Spalten, aber Sie können dies ändern, wie Sie möchten. Wir können hier weitermachen, und ich gehe hier rein und tippe 16 ein, und ich drücke die Return-Taste, um es zu bestätigen. Jetzt sehen Sie 16 Spalten. Ich könnte weitermachen und auch die Rinnenbreite ändern. Ich ändere das auf so etwas wie 24, und Sie können sehen, dass es jetzt eine etwas breitere Lücke gibt zwischen diesen 16 cyanfarbenen vertikalen Spalten. Wenn das nicht Ihre Farbe ist, können Sie sie jederzeit ändern indem Sie auf dieses Schachbrett hier drüben klicken, das ist die Spaltenfarbe der Layout-Klasse, und Sie können hier jede gewünschte Farbe auswählen. Ich kann fortfahren und diesen Schieberegler einfach nach oben und unten bewegen und bis ich die Farbe bekomme, die ich mag. Wenn Sie denken, dass Sie sie dunkler mögen, Sie können fortfahren und das Alpha ändern hier in Prozent. Derzeit ist der Standardwert 25 %. Sie können fortfahren und es auf etwa 10 ändern. Drücken Sie die Tabulatortaste oder die Eingabetaste, um es zu bestätigen, und Sie können sehen, dass es jetzt viel heller ist. Wenn mir das wirklich gefallen hat und in mehreren Projekten verwenden wollte, Ich kann fortfahren und klicken und es zu meinem Standard machen. Wenn ich all diese Änderungen vorgenommen habe und entscheide, dass das nicht das ist, was ich mag, wir können fortfahren und auf die Schaltfläche Standard verwenden klicken, und wir gehen zurück, wo wir angefangen haben. Vielen Dank fürs Zuschauen. Seien Sie gespannt auf das nächste Video wo wir über das quadratische Gitter gehen werden.

Anfänger Anbieter : Alyssa Galganov 5 Lektionen · 16m auf Arabisch, Deutsch, Englisch, Spanisch, Französisch, Portugiesisch, Chinese

Kursbeschreibung

In diesem Kurs lernen Sie, wie Sie mit Hilfe von Rastern, Hilfslinien, Ausrichtung, Verteilung und Wiederholung dynamische Layouts in Adobe XD erstellen können. Bei der Arbeit an Ihren Designs können Sie Hilfslinien verwenden, um Objekte auszurichten oder die Abstände zwischen Elementen auf einer Zeichenfläche zu verwalten. Raster dienen als Rahmen, auf dem Sie Ihre Designelemente organisieren und die Symmetrie des Layouts sicherstellen können.

Die Definition eines Rastersystems kann Ihnen helfen, sicherzustellen, dass Ihr Design ausgerichtet bleibt, und spart wertvolle Zeit beim Messen von Pixeln und Abständen zwischen Elementen. Sie werden die beiden Rasteroptionen in Adobe XD kennenlernen, die Ihnen beim Einrichten Ihres Designs helfen: Layout und Quadrat.

Was Sie lernen werden

Erstellen Sie Layout-Gitter in Adobe XD und passen Sie diese an, um Ihre Designelemente zu strukturieren
Erstellen Sie Quadratgitter in Adobe XD und passen Sie diese an, um Symmetrie über ein Artboard hinweg zu wahren
Erstellen Sie Hilfslinien und verwalten Sie diese, um Objekte auszurichten und den Abstand zwischen Elementen zu steuern
Richten Sie Designelemente aus und verteilen Sie sie für konsistente, organisierte Layouts
Verwenden Sie die Schaltfläche "Wiederholungsgitter", um Elemente effizient zu duplizieren

Wichtige Erkenntnisse

Gitter dienen als Rahmen für die Organisation von Designelementen und stellen die Symmetrie eines Layouts sicher.
Die Definition eines Gittersystems hilft, ein Design in Ausrichtung zu halten und spart Zeit beim Messen von Pixeln und Abstand zwischen Elementen.
Adobe XD bietet zwei Gitteroptionen, die Orientierung beim Einrichten eines Designs bieten: Layout und Quadrat.
Hilfslinien können verwendet werden, um Objekte auszurichten oder den Abstand zwischen Elementen auf einem Artboard zu verwalten.

Häufig gestellte Fragen

Was werde ich in diesem Kurs lernen?

Sie lernen, wie Sie dynamische Layouts in Adobe XD mit Gittern, Hilfslinien, Ausrichtung, Verteilung und Wiederholung erstellen, einschließlich wie Sie Layout- und Quadratgitter erstellen und anpassen sowie wie Sie Hilfslinien erstellen und verwalten.

Welche Gitteroptionen behandelt dieser Kurs in Adobe XD?

Der Kurs behandelt die zwei Gitteroptionen in Adobe XD, die Orientierung beim Einrichten Ihres Designs bieten: Layout und Quadrat.

Welche Themen sind in den Lektionen enthalten?

Die Lektionen behandeln Layout Grids, Square Grids, Creating Guides, Aligning and Distributing Design Elements und the Repeat Grid Button.

Warum sind Gitter beim Entwerfen in Adobe XD nützlich?

Gitter dienen als Rahmen für die Organisation von Designelementen und die Sicherung der Symmetrie, helfen, Ihr Design in Ausrichtung zu halten und sparen wertvolle Zeit beim Messen von Pixeln und Abstand zwischen Elementen.