Zeichenflächen in Photoshop
Zeichenflächen für verschiedene Geräte auf derselben Arbeitsfläche

Wenn Sie ein Web- oder UX-Designer sind, gestalten Sie wahrscheinlich zunehmend Websites oder Apps für mehrere Geräte. Zeichenflächen helfen Ihnen bei der Optimierung Ihres Designprozesses durch eine unbegrenzte Arbeitsfläche, auf der Sie Designs für mehrere Geräte und Bildschirme erstellen können. Beim Erstellen von Zeichenflächen können Sie aus einer Vielzahl von voreingestellten Formaten wählen oder Ihr eigenes benutzerdefiniertes Zeichenflächenformat definieren.

Zeichenflächen sind selbst dann nützlich, wenn Ihre Designs normalerweise nur auf eine Bildschirmgröße beschränkt sind. So können Sie beispielsweise beim Entwickeln einer Website mithilfe von Zeichenflächen Designs für verschiedene Seiten und im Kontext nebeneinander anzeigen. 

Hinweis:

Zeichenflächen werden für den RGB-Farbmodus und erweiterten GPU-Zeichnungsmodus optimiert.

Was genau ist mit „Zeichenfläche“ gemeint?

Sie können sich eine Zeichenfläche als eine spezielle Art einer Ebenengruppe vorstellen. Mit einer Zeichenfläche werden die Inhalte aller enthaltenen Elemente an die Ränder geheftet. Die Hierarchie der Objekte auf einer Zeichenfläche wird im Ebenenbedienfeld zusammen mit Ebenen und Ebenengruppen angezeigt. Zeichenflächen können Ebenen und Ebenengruppen, nicht jedoch andere Zeichenflächen enthalten.

Visuell dienen Zeichenflächen als individuelle Leinwände in einem Dokument. Alle Ebenen im Dokument, die nicht in einer Zeichenfläche enthalten sind, werden am oberen Rand des Ebenenbedienfelds gruppiert und von keiner Zeichenfläche beschnitten.

Zeichenfläche-Voreinstellungen

Um das Aussehen Ihrer Zeichenflächen anzupassen, wählen Sie „Voreinstellungen“ > „Benutzeroberfläche“ > „Erscheinungsbild“ > „Zeichenflächen“. Sie haben die Möglichkeit, die Hintergrundfarbe für die Zeichenfläche auszuwählen und den Rahmen der Zeichenfläche anzuzeigen oder auszublenden.

Voreinstellungen für Zeichenflächen in Photoshop

Erstellen eines Zeichenflächendokuments

  1. Wählen Sie in Photoshop Datei > Neu aus.
  2. Geben Sie im Dialogfeld Neu einen Namen für das Dokument ein. Beispiel: iPhone-Website.
  3. Wählen Sie im Popup-Menü Dokumenttyp die Option Zeichenfläche aus.
  4. Wählen Sie eine der über 35 vorgegebenen Zeichenflächengrößen aus.
Größe der Zeichenfläche in Photoshop
Große Auswahl an vorgegebenen Zeichenflächengrößen

  1. Beginnen Sie damit, Ihre Designelemente zur Zeichenfläche hinzuzufügen. Sie können Smartobjekte, Ebenen, Ebenengruppen usw. zur Zeichenfläche hinzufügen.

Konvertieren eines vorhandenen Dokuments in ein Zeichenflächendokument

Ein Standard-Photoshop-Dokument können Sie schnell und einfach in ein Zeichenflächendokument umwandeln.

  1. Wählen Sie eine oder mehrere Ebenengruppen oder Ebenen im Dokument aus.
  2. Klicken Sie mit der rechten Maustaste auf die Auswahl und wählen Sie dann Zeichenfläche aus Ebenen oder Zeichenfläche aus Gruppe.

Hinzufügen von Zeichenflächen zum aktuellen Dokument

  1. Klicken Sie im Werkzeugbedienfeld auf das Symbol , um das Zeichenflächen-Werkzeug auszuwählen.
  1. Zeichnen Sie die Zeichenfläche auf die Arbeitsfläche.
  2. Skalieren Sie die Zeichenfläche (sofern erforderlich). Wählen Sie in der Werkzeugoptionsleiste im Popup-Menü „Format“ ein voreingestelltes Format aus. Alternativ können Sie die Größe der Zeichenfläche benutzerdefiniert belassen.
Skalieren der Zeichenfläche in Photoshop
Skalieren der Zeichenfläche

  1. Benennen Sie die Zeichenfläche nach Wunsch. Führen Sie die folgenden Schritte durch:
    1. Wählen Sie bei ausgewählter Zeichenfläche Ebene > Zeichenfläche umbenennen aus. 
    2. Geben Sie einen neuen Namen für die Zeichenfläche ein und drücken Sie die Eingabetaste.
  2. Beginnen Sie damit, Ihre Designelemente zur Zeichenfläche hinzuzufügen. Sie können Smartobjekte, Ebenen, Ebenengruppen usw. zur Zeichenfläche hinzufügen.

Schnelles Hinzufügen neuer Zeichenflächen zu einem Dokument

Sie können Ihrem Dokument Zeichenflächen hinzufügen, indem Sie auf die Plus-Symbole (+) klicken, die neben den aktuell im Dokument enthaltenen Zeichenflächen angezeigt werden. Diese Plus-Symbole (+) werden überall dort angezeigt, wo die Arbeitsfläche zusätzliche Zeichenflächen aufnehmen kann. Klicken Sie bei gedrückter Wahl- bzw. Alt-Taste auf ein Plus-Symbol (+), um eine Zeichenfläche mitsamt ihrem Inhalt zu duplizieren.

  1. Wählen Sie eine Zeichenfläche aus.
  2. Klicken Sie auf ein Plus-Symbol neben der Zeichenfläche. Photoshop fügt dem Dokument eine Zeichenfläche in Richtung des Plus-Symbols hinzu.
Hinzufügen von Zeichenflächen mit Plus-Symbolen in Photoshop
Hinzufügen von Zeichenflächen mit Plus-Symbolen

Hinweis:

Klicken Sie bei gedrückter Wahl- bzw. Alt-Taste auf ein Plus-Symbol (+), um die aktuell ausgewählte Zeichenfläche mitsamt ihrem Inhalt zu duplizieren. Die neue Zeichenfläche wird in Richtung des Plus-Symbols hinzugefügt, auf das Sie geklickt haben.

Arbeiten mit Zeichenflächen

Einstellen des Zeichenflächenhintergrunds

Legen Sie im Eigenschaftenbedienfeld (Fenster > Eigenschaften) für die Zeichenfläche den gewünschten Wert für die Zeichenflächenhintergrundfarbe fest. Sie können den Zeichenflächenhintergrund auch als transparent festlegen.

Einstellen des Zeichenflächenhintergrunds

Verschieben von Elementen zwischen Zeichenflächen

Ziehen Sie einfach die Elemente auf der Arbeitsfläche von einer Zeichenfläche zu anderen. Wenn Sie ein Element zwischen Zeichenflächen verschieben, versucht Photoshop, sie an derselben Position relativ zu den Linealursprüngen in den oberen linken Ecken der Zeichenflächen zu positionieren.

Wenn Sie ein Element einer Zeichenfläche hinzufügen/von einer Zeichenfläche entfernen, wird das neue Element für diese Zeichenfläche nach der Z-Ordnung ganz oben im Ebenenbedienfeld platziert.

Sie können auch Ebenen/Elemente, die zu keiner Zeichenfläche gehören, mit vorhandenen Zeichenflächen gruppieren. Ziehen Sie einfach das Element auf der Arbeitsfläche zur Zielzeichenfläche. Alternativ dazu können Sie es im Ebenenbedienfeld in die Zielzeichenfläche verschieben.

Duplizieren von Ebenen oder Ebenengruppen

Wenn Sie eine Ebene oder Ebenengruppe in einem Dokument duplizieren, das Zeichenflächen enthält, können Sie die Zeichenfläche auswählen, in der Sie die duplizierte Ebene platzieren möchten.

Duplizieren von Ebenen: Wählen Sie die Zeichenfläche aus, in der Sie die duplizierte Ebene einfügen möchten

Verschieben

Klicken Sie bei ausgewählter Zeichenfläche oder ausgewähltem Verschieben-Werkzeug auf die Beschriftung einer Zeichenfläche, um sie auszuwählen. Verschieben Sie sie jetzt an den gewünschten Ort auf der Arbeitsfläche.

Skalieren

Klicken Sie bei ausgewählter Zeichenfläche oder ausgewähltem Verschieben-Werkzeug auf die Beschriftung einer Zeichenfläche, um sie auszuwählen. Wählen Sie jetzt eine vorgegebene Größe für die Zeichenfläche in der Werkzeugoptionsleiste aus.

Wenn Sie die Zeichenfläche auf eine benutzerdefinierte Größe skalieren möchten, ändern Sie ihre Begrenzungen mithilfe der Ziehpunkte.

Raster

Wählen Sie eine Zeichenfläche und wählen Sie Ansicht > Anzeigen > Raster, um Raster in einer Zeichenfläche anzuzeigen.

Hilfslinien

Wenn eine Zeichenfläche ausgewählt ist, ziehen Sie Hilfslinien vom Lineal auf die Arbeitsfläche. Diese Hilfslinien werden jetzt zusammen mit der Zeichenfläche verschoben. Sie können eine Zeichenfläche mit den zugewiesenen Hilfslinien auch duplizieren, um der duplizierten Zeichenfläche identische Hilfslinien zuzuweisen. Alternativ können Sie Ansicht > Neues Hilfslinienlayout auswählen, um die gewünschten Zeichenflächen als Ziele festzulegen. Um die Optionen zur Sichtbarkeit der Hilfslinien festzulegen, wählen Sie Ansicht > Anzeigen.

Neues Hilfslinienlayout in Photoshop
(Links) Neues Hilfslinienlayout | (Rechts) Optionen zur Sichtbarkeit der Hilfslinien

Zeichenflächen-Eigenschaften überprüfen

Wählen Sie eine Zeichenfläche und anschließend Fenster > Eigenschaften, um die wichtigsten Eigenschaften schnell zu überprüfen. Sie können die Zeichenfläche auch vom Eigenschaftenbedienfeld“ aus skalieren.

Zeichenflächen-Eigenschaften werden auch in der Werkzeugoptionsleiste angezeigt, wenn eine Zeichenfläche ausgewählt ist. 

Eigenschaftenbedienfeld für Zeichenflächen in Photoshop
Das Eigenschaftenbedienfeld für Zeichenflächen

Zeichenflächenamen anzeigen

Um Zeichenflächenamen ein- bzw. auszublenden, wählen Sie Ansicht > Anzeigen > Zeichenflächenamen. Zeichenflächenamen werden automatisch auf die Breite der Zeichenfläche gekürzt.

Filtern von Ebenen nach Zeichenfläche

Wählen Sie im Ebenenbedienfeld aus dem Popupmenü „Suchen“ die Option Zeichenfläche. Wählen Sie eine Zeichenfläche oder eine beliebige Ebene in einer Zeichenfläche aus. Die Ebenenbedienfeld-Ansicht wird jetzt auf die ausgewählte Zeichenfläche beschränkt. Um zur vollständigen Ebenenbedienfeld-Ansicht zurückzukehren, heben Sie entweder die Auswahl aller Ebenen auf oder wählen Sie ein Element außerhalb der Zeichenfläche aus.

Verhindern des automatischen Verschachtelns in und aus Zeichenflächen

Weisen Sie die Sperre in der Abbildung einer Zeichenfläche zu, um das automatische Verschachteln in und aus Zeichenflächen zu verhindern. Weisen Sie sie bestimmten Ebenen innerhalb einer Zeichenfläche zu, um das automatische Verschachteln dieser Ebenen zu verhindern. Um das normale Verhalten des automatischen Verschachtelns wiederherzustellen, entfernen Sie die entsprechenden Sperren aus den Zeichenflächen oder Ebenen.

Verhindern des automatischen Verschachtelns in und aus Zeichenflächen in Photoshop

Zeichenflächen-Positionssperre

Wählen Sie eine Zeichenfläche aus und weisen Sie die Positionssperre zu. Die Zeichenfläche ist jetzt in ihrer Position auf der Arbeitsfläche fixiert, Elemente können aber wie gewohnt hinzugefügt, verschoben oder entfernt werden.

Position sperren in Photoshop

Umbenennen

Doppelklicken Sie im Ebenenbedienfeld auf den Namen der Zeichenfläche und geben Sie einen neuen Namen ein. Alternativ können Sie den Befehl Ebene > Zeichenfläche umbenennen verwenden.

Auflösen von Zeichenflächen

Sie können die Gruppierung von Zeichenflächen schnell aufheben. Wählen Sie bei ausgewählter Zeichenfläche Ebene > Gruppierung von Zeichenflächen aufheben. Die Gruppierung der Zeichenflächen wird aufgehoben und alle Bestandteile werden auf die nächsthöhere Ebene im Ebenenbedienfeld verschoben. Wird die letzte Zeichenfläche im Dokument aufgelöst oder ihre Gruppierung aufgehoben, wird das Dokument zu einem Nicht-Zeichenflächen-Dokument.

Exportieren von Zeichenflächen

Exportieren von Zeichenflächen als Bildelemente

Sie können Zeichenflächen als JPEG-, GIF-, PNG-, PNG-8- oder SVG-Bildelemente direkt vom Ebenenbedienfeld aus exportieren.

Weitere Informationen finden Sie unter Exportieren von Zeichenflächen und Ebenen.

Exportieren von Zeichenflächen als PDF

Sie können Zeichenflächen als PDF-Dokumente exportieren. Führen Sie folgende Schritte aus:

  1. Wählen Sie in Photoshop Datei > Exportieren > Zeichenfläche in PDF aus.
  2. Führen Sie im Dialogfeld Zeichenfläche in PDF Folgendes durch:
    • Wählen Sie das Ziel/den Speicherort aus, an dem Sie die generierten PDF-Dokumente speichern möchten.
    • Geben Sie ein Dateinamenpräfix für die erzeugten PDF-Dokumente an. Beispielsweise Campaign_insurance.
    • Geben Sie an, ob Sie nur Inhalte der Zeichenflächen oder auch den Inhalt der Bereiche exportieren möchten, die die Zeichenflächen überlappen.
    • Geben Sie an, ob Sie alle Zeichenflächen oder nur die aktuell ausgewählten exportieren möchten.
    • Geben Sie an, ob Sie zusammen mit den Zeichenflächen auch Zeichenflächenhintergründe exportieren möchten.
    • Geben Sie an, ob Sie ein PDF-Dokument für alle Zeichenflächen im aktuellen Dokument oder ein PDF-Dokument pro Zeichenfläche erstellen möchten. Wenn Sie mehrere PDF-Dokumente generieren möchten, nehmen alle diese Dokumente das Dateinamenpräfix an, das Sie zuvor angegeben haben.
    • Geben Sie eine Kodierungsoption für die zu exportierenden PDF-Dokumente an: ZIP oder JPEG. Wenn Sie „JPEG“ gewählt haben, müssen Sie zusätzlich eine Qualitätseinstellung (0–12) angeben.
    • Geben Sie an, ob das ICC-Profil (International Color Consortium) in den exportierten PDF-Dateien enthalten sein soll. Ein ICC-Profil enthält Daten, die ein Farbeingabe- oder -ausgabegerät charakterisieren.
    • Geben Sie an, ob Sie zusammen mit den Zeichenflächen auch Zeichenflächenamen exportieren möchten. Sie können beim Auswählen dieser Einstellung eine benutzerdefinierte Schrift, Schriftgröße, Schriftfarbe und eine Farbe für erweiterte Arbeitsflächen angeben.
  3. Klicken Sie auf Ausführen. Photoshop erzeugt das PDF-Dokument.

Exportieren von Zeichenflächen als Dateien

Sie können Zeichenflächen als separate Dateien exportieren. Führen Sie folgende Schritte aus:

  1. Wählen Sie in Photoshop Datei > Exportieren > Zeichenfläche in Dateien aus.
  2. Führen Sie im Dialogfeld Zeichenfläche in Dateien Folgendes durch:
    • Wählen Sie das Ziel aus, an dem Sie die generierten Dateien speichern möchten.
    • Geben Sie ein Dateinamenpräfix an.
    • Geben Sie an, ob Sie nur den Inhalt der Zeichenfläche exportieren oder überlappende Bereiche einbeziehen möchten.
    • Geben Sie an, ob Sie alle Zeichenflächen oder nur die aktuell ausgewählten exportieren möchten.
    • Geben Sie an, ob Sie zusammen mit den Zeichenflächen auch Zeichenflächenhintergründe exportieren möchten.
    • Wählen Sie den Dateityp für den Export. Sie haben die Möglichkeit, Dateien als BMP, JPEG, PDF, PSD, Targa, TIFF, PNG-8 oder PNG-24 zu exportieren.
    • Geben Sie die Exportoptionen für den Dateityp an, den Sie ausgewählt haben.
      • Geben Sie an, ob Sie zusammen mit den Zeichenflächen auch Zeichenflächenamen exportieren möchten. Sie können beim Auswählen dieser Einstellung eine benutzerdefinierte Schrift, Schriftgröße, Schriftfarbe und eine Farbe für erweiterte Arbeitsflächen angeben.
  3. Klicken Sie auf Ausführen. Photoshop exportiert die Zeichenflächen als Dateien im ausgewählten Format.

Gerätevorschau und die Companion App „Preview CC“

Vorschau von Designs auf Zielgeräten in Photoshop

Mit der Gerätevorschau in Photoshop und der Companion App „Preview CC“ können Sie Designs auf ihren iOS-Zielgeräten schnell in einer Vorschau anzeigen. Preview CC wird über einen USB-Port oder über WLAN mit Photoshop verbunden und zeigt eine Live-Vorschau Ihres Layouts an. Alle Änderungen, die Sie an Ihrem Design vornehmen, werden automatisch an das Gerät gesendet, sodass Sie sie in einer Vorschau anzeigen lassen können.

Bei Dokumenten mit Zeichenflächen versucht die Gerätevorschau, Ihnen die richtige Zeichenfläche durch Abgleich der Größe und Position mit der Größe des angeschlossenen iOS-Geräts anzuzeigen. Sie können auch über die Navigationsleiste eine bestimmte Zeichenfläche auf dem Gerät anzeigen lassen oder per Wischgeste in der Reihenfolge durch die Zeichenflächen blättern, in der sie im Ebenenbedienfeld in Photoshop aufgeführt werden.

Weitere Informationen zur Gerätevorschau und zu Preview CC finden Sie unter:

Häufig gestellte Fragen

Kann ich eine Zeichenfläche innerhalb einer Zeichenfläche hinzufügen?

Nein. Das Verschachteln von Zeichenflächen wird derzeit nicht unterstützt.

Ist eine Zeichenfläche eine Art Ebene?

Sie können sich Zeichenflächen als eine spezielle Art einer Ebenengruppe vorstellen. Zeichenflächen werden wie Ebenen und Ebenengruppen im Ebenenbedienfeld in Photoshop aufgeführt.

Kann ich aus einem Photoshop-Standarddokument Zeichenflächen erstellen?

Dieses Werk unterliegt den Bedingungen der Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License.  Twitter™- und Facebook-Beiträge fallen nicht unter die Bedingungen der Creative Commons-Lizenz.

Rechtliche Hinweise   |   Online-Datenschutzrichtlinie