Unsere Datenschutzrichtlinie wird in Kürze aktualisiert. Bitte sehen Sie sich die Vorschau an.

Sketch Grundkurs

Elemente im Raster anordnen

Testen Sie unsere 2016 Kurse

10 Tage kostenlos!

Jetzt testen Alle Abonnements anzeigen
Oft benötigt man beim Screendesign Elemente, die sich in einem Raster regelmäßig wiederholen. Eine große Hilfe ist dabei die Option Make Grid.

Transkript

In unserem finalen Design haben wir hier einen Screen, der heißt "Albums", und hier haben wir eine Übersicht all unsere Alben hier innerhalb eines Rasters oder eines Grids. So, wie man das automatisiert, ganz einfach in Sketch erstellen kann, das möchte ich hier jetzt demonstrieren. Dazu erzeuge ich mir jetzt erst mal ein neues Artboard, und zwar iPhone 7. Hier haben wir das Artboard. Ich zoome mal hier über Cmd+2 hinein, schaue mir die beiden gegeneinander an. So und jetzt möchte ich auch dieses 3x4 Grid haben. Und dazu erzeuge ich mir erst mal ein Rechteck mit einer abgerundeten Kante. So, und das soll in dem Fall 92 px groß sein. So. Ein bisschen daneben getroffen. Okay, machen wir 92 draus. Die Rundung der Kante können wir hier noch beeinflussen. Ich möchte kein Board da haben, so, und das sieht eigentlich schon sehr gut aus. Der Abstand nach links soll in dem Fall 20 px sein, also verringern wir diesen. So, und jetzt möchte ich hieraus ein solches Grid machen. Das geht ganz einfach über das Menü "Arrange", und dann haben wir hier den Punkt "Make Grid". So jetzt müssen wir hier festlegen, was für ein Grid wir haben möchten. Und als erstes Mal soll es natürlich drei Reihen haben und vier Columns. Beziehungsweise genau umgekehrt, wir haben drei Columns und vier Reihen. Und ich möchte jetzt jeweils 30 px Abstand haben sowohl hier zwischen, als auch hier zwischen. Und dann klicke ich einfach auf "Make Grid", und hier haben wir unser Grid erhalten. Statt also hinzugehen und jedes Objekt einzeln auszuwählen, dann zu duplizieren und zu verschieben und dann diese ganze Reihe nochmal auszuwählen, zu kopieren und zu verschieben, ja, da sind wir eine ganze Zeit beschäftigt. Dank diesem Befehl "Make Grid" ist das Ganze hier natürlich ein Kinderspiel geworden. Ja, eine weitere Möglichkeit, wozu man "Make Grid" verwenden kann, möchte ich mal an einem neuen Dokument zeigen, und zwar wenn ich mir jetzt hier ein Artboard erstelle, dann kann ich auch für ein Artboard ein Grid anlegen. Ich wähle das Artboard aus, gehe dann über "Arrange" "Make Grid. Und in dem Fall möchte ich nur eine Raw haben, da kann ich auch kein Margin, also keinen Abstand festlegen, und vieleicht sechs Screens. Und der Abstand dazwischen soll 150 px sein. Ich klicke auf "Make Grid", und hier haben wir jetzt die gesamten Screens, die wir jetzt als Basis nehmen können, um daran jetzt arbeiten zu können. Es geht also, blitzschnell in Sketch ein Grid zu erstellen, egal ob es für Elemente ist oder sogar, wie wir gesehen haben, für ganze Artboards gilt.

Sketch Grundkurs

Lernen Sie die grundlegende Bedienung von Sketch am Beispiel des UX-Designs einer App.

4 Std. 45 min (54 Videos)
Derzeit sind keine Feedbacks vorhanden...
 
Hersteller:
Software:
Exklusiv für Abo-Kunden
Erscheinungsdatum:25.04.2017

Dieser Online-Kurs ist als Download und als Streaming-Video verfügbar. Die gute Nachricht: Sie müssen sich nicht entscheiden - sobald Sie das Training erwerben, erhalten Sie Zugang zu beiden Optionen!

Der Download ermöglicht Ihnen die Offline-Nutzung des Trainings und bietet die Vorteile einer benutzerfreundlichen Abspielumgebung. Wenn Sie an verschiedenen Computern arbeiten, oder nicht den ganzen Kurs auf einmal herunterladen möchten, loggen Sie sich auf dieser Seite ein, um alle Videos des Trainings als Streaming-Video anzusehen.

Wir hoffen, dass Sie viel Freude und Erfolg mit diesem Video-Training haben werden. Falls Sie irgendwelche Fragen haben, zögern Sie nicht uns zu kontaktieren!