Wenn Sie eine App erstellen, benötigen Sie eine Reihe von Bildern, die als App-Symbol und Startbildschirme für iOS-, Android- und Windows-Geräte verwendet werden. Als Grafiken für iOS können die verschiedensten Größenkombinationen erforderlich sein, während für Android-Apps nur ein Bild und für Windows-Apps drei Bilder benötigt werden. Mit der Datei „Asset Generator.psd“ und der Generator-Funktion in Adobe Photoshop CC lässt sich das Erstellen dieser Dateien koordinieren und automatisieren.

In Adobe Photoshop CC wurde die Generator-Funktion eingeführt, mit der das Erstellen von Webgrafikdateien auf Grundlage von Ebenennamen automatisiert wird. Die Datei „Asset Generator.psd“ greift auf den Generator zurück, um die Bilddateien beim Erstellen von Apps zu erstellen. Der Generator erstellt einzelne Dateien sowie eine Ordnerstruktur, in der die Dateien für die drei Plattformen organisiert werden.

Erstellen von Startbildschirm-Bildern mit InDesign

Für den Fall, dass Sie InDesign Photoshop für Designprojekte vorziehen, hat Keith Gilbert eine InDesign-Vorlage erstellt, mit der Sie mit InDesign die erforderlichen PNG-Dateien erstellen und exportieren können. Siehe 2015-Vorlage für Begrüßungsbildschirm.

Verwenden von Photoshop Asset Generator

  1. Laden Sie die Datei „Asset Generator.psd“ herunter, extrahieren Sie sie und verschieben oder kopieren Sie sie an den gewünschten Speicherort, z. B. den Speicherort der erforderlichen Komponenten für die AEM Mobile-Veröffentlichung.

    Herunterladen

  2. Öffnen Sie die Datei „Asset Generator.psd“ in Adobe Photoshop CC.

  3. Wählen Sie in Photoshop CC „Datei“ > „Generieren“ > „Bild-Assets“, um den Generator zu aktivieren.

    Wenn diese Option aktiviert wurde, erstellt Photoshop Dateien auf Grundlage der im Ebenenbedienfeld definierten Ebenen- und Gruppennamen. Photoshop erstellt einen Elementordner auf Grundlage des Dateinamens am Speicherort der Asset Generator-Datei. Elementdateityp, Qualitäten, Abmessungen, Namen und Ordnerstruktur werden durch die Ebenen- und Ebenengruppennamen in der Photoshop-Datei gesteuert.

  4. Doppelklicken Sie zum Bearbeiten eines Smart-Objekts auf das Ebenenminiaturbild. Es wird eine weitere temporäre Photoshop-Datei geöffnet. Diese kann Ebenen oder zusätzliche Smart-Objekte enthalten.

    In der Asset Generator-Datei wird eine Vielzahl von Photoshop-Smart-Objekten verwendet. Alle Symbole sind Duplikate eines einzelnen Smart-Objekts. Wenn Sie also ein Symbol bearbeiten, werden alle anderen Symbole automatisch aktualisiert. Für die meisten Startbilder werden separate, unabhängige Smart-Objekte verwendet.

    Bei Ebenen mit einer grünen Beschriftung handelt es sich um Smart-Objekte, die angepasst werden sollten. Sie finden grüne Ebenen im Ebenenbedienfeld und im Startbildordner im Ebenenbedienfeld. Wenn Sie Inhalte bearbeiten, werden die Elemente erneut generiert.

  5. Nehmen Sie die gewünschten Änderungen vor und speichern und schließen Sie dann die Smart-Objekt-Datei. Wenn Sie zur Photoshop-Hauptdatei zurückkehren, werden alle Duplikate der Smart-Objekte automatisch aktualisiert.

    Doppelklicken Sie auf das Miniaturbild eines Smart-Objekts, um seinen Inhalt zu bearbeiten. Vektor-Smart-Objekte werden in Adobe Illustrator bearbeitet, wenn sie geöffnet werden. Nachdem Sie ein Vektor-Smart-Objekt in Illustrator bearbeitet haben, speichern und schließen Sie die Datei in Illustrator und kehren Sie dann zu Photoshop zurück. Der Inhalt wird automatisch aktualisiert.

    Speichern und schließen Sie alle Smart-Objekte, bis Sie zu den Asset Generator-Dateien zurückkehren. Alle Duplikate des Smart-Objekts werden aktualisiert.

  6. Doppelklicken Sie auf das Miniaturbild eines Smart-Objekts, um seinen Inhalt zu bearbeiten. Vektor-Smart-Objekte werden in Adobe Illustrator bearbeitet, wenn sie geöffnet werden. Nachdem Sie ein Vektor-Smart-Objekt in Illustrator bearbeitet haben, speichern und schließen Sie die Datei in Illustrator und kehren Sie dann zu Photoshop zurück. Der Inhalt wird automatisch aktualisiert. Speichern und schließen Sie alle Smart-Objekte, bis Sie zu den Asset Generator-Dateien zurückkehren. Alle Duplikate des Smart-Objekts werden aktualisiert.

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