Tutorials

How to Make Artboard Projects in Photoshop

Melden

Hier ist ein ausführliches Tutorial, wie du mit Zeichenflächen (Artboards) in Adobe Photoshop arbeitest. Dieses Feature ist ideal für Webdesign, Social-Media-Sets oder App-Prototypen.

Zeichenflächen ermöglichen es dir, mehrere Layouts für verschiedene Geräte oder Formate innerhalb einer einzigen Photoshop-Datei zu erstellen.

1. Ein neues Projekt mit Zeichenflächen erstellen

Wenn du ein komplett neues Projekt startest, kannst du die Zeichenflächen direkt aktivieren:

  1. Öffne Photoshop und klicke auf Neu erstellen (Create New).
  2. Wähle rechts im Bereich „Vorgabendetails“ den Namen und die Maße deines Projekts.
  3. Setze den Haken bei der Option Zeichenflächen (Artboards).
  4. Wähle ein Preset (z. B. unter dem Reiter „Web“ oder „Mobil“) oder gib eigene Maße ein.
  5. Klicke auf Erstellen.

Nun siehst du deine erste Zeichenfläche in der Mitte und im Ebenen-Bedienfeld als eine Art Gruppe mit dem Namen „Zeichenfläche 1“.

2. Das Zeichenflächen-Werkzeug verwenden

Um Zeichenflächen zu bearbeiten oder neue hinzuzufügen, benötigst du das spezielle Werkzeug:

  1. Klicke in der Werkzeugleiste lange auf das Verschieben-Werkzeug (Move Tool).
  2. Wähle das Zeichenflächen-Werkzeug (Artboard Tool) aus.
  3. Sobald das Werkzeug aktiv ist, erscheinen an den Rändern deiner aktuellen Zeichenfläche Plus-Symbole (+).
  4. Klicke auf ein Plus-Symbol, um in diese Richtung eine neue Zeichenfläche mit den gleichen Maßen zu erstellen.

3. Bestehende Dokumente in Zeichenflächen umwandeln

Wenn du bereits ein normales Dokument hast und daraus ein Artboard-Projekt machen möchtest:

  1. Wähle im Ebenen-Bedienfeld die Ebenen aus, die du umwandeln möchtest.
  2. Mache einen Rechtsklick auf die markierten Ebenen.
  3. Wähle Zeichenfläche aus Ebenen... (Artboard from Layers).
  4. Gib der Zeichenfläche einen Namen und klicke auf OK.

4. Zeichenflächen organisieren und anpassen

  • Größe ändern: Wähle eine Zeichenfläche im Ebenen-Bedienfeld aus. Mit dem aktivierten Zeichenflächen-Werkzeug kannst du nun an den Eckpunkten ziehen oder oben in der Optionsleiste exakte Maße eingeben.
  • Verschieben: Du kannst die Zeichenflächen frei auf der Arbeitsfläche anordnen, um Platz für neue Entwürfe zu schaffen.
  • Hintergrundfarbe: Klicke im Eigenschaften-Fenster (Properties) auf „Hintergrund der Zeichenfläche“, um zwischen Weiß, Schwarz, Transparent oder einer benutzerdefinierten Farbe zu wählen.

5. Ebenen zwischen Zeichenflächen bewegen

  • Um ein Element von einer Zeichenfläche auf eine andere zu bewegen, ziehe die Ebene im Ebenen-Bedienfeld einfach in die Gruppe der anderen Zeichenfläche.
  • Alternativ kannst du das Objekt auf der Leinwand mit dem Verschieben-Werkzeug direkt von einer Fläche auf die andere ziehen. Photoshop ordnet die Ebene automatisch der neuen Zeichenfläche zu.

6. Exportieren der Zeichenflächen

Einer der größten Vorteile ist der Export. Du kannst jedes Artboard als einzelne Datei speichern:

  1. Gehe auf Datei > Exportieren > Exportieren als... (Export As).
  2. Auf der linken Seite siehst du alle deine Zeichenflächen aufgelistet. Du kannst alle auswählen oder nur bestimmte.
  3. Wähle rechts das Dateiformat (JPG, PNG, SVG) aus.
  4. Klicke auf Exportieren.

Tipp: Wenn du jedes Artboard blitzschnell als einzelne Datei (z.B. PDF oder PSD) speichern willst, nutze Datei > Exportieren > Zeichenflächen in Dateien...

Zusammenfassung der Vorteile

  • Übersicht: Alle Design-Varianten (z.B. Instagram Post, Story und Banner) in einer Datei.
  • Konsistenz: Farben und Schriften lassen sich einfacher über mehrere Formate hinweg abgleichen.
  • Effizienz: Schneller Export aller Formate mit nur einem Klick.
0