Assets aus Design-Spezifikationen exportieren und herunterladen

Assets aus Design-Spezifikationen exportieren

Wenn Sie Ebenen für den Export markieren und beim Veröffentlichen von Design-Spezifikationen Assets bereitstellen, können diese Ebenen über den Design-Spezifikations-Link heruntergeladen werden. Vektor-Assets sind im SVG-, PNG- und PDF-Format verfügbar und Bitmap-Assets im PNG- und PDF-Format.

Weitere Informationen zum Exportieren von Assets für Design-Spezifikationen und zum Herunterladen erhalten Sie im folgenden Video.


Ebenen für den Export markieren

Für den Export markierte Ebenen werden in den Design-Spezifikationen als Assets bereitgestellt. Um Assets für den Export zu markieren, wählen Sie eine beliebige Ebene auf der Arbeitsfläche aus und verwenden eine der folgenden Optionen: 

  • Klicken Sie auf eine Zeichenflächenebene und aktivieren Sie die Option Für Export markieren
  • Klicken Sie auf der Arbeitsfläche mit der rechten Maustaste auf die Ebene und wählen Sie im Popup-Menü Für Export markieren
  • Verwenden Sie den Tastaturbefehl  auf macOS bzw. den Tastaturbefehl  auf Windows.
  • Öffnen Sie das Ebenenbedienfeld und klicken Sie auf das Symbol  („Für Export markieren“) neben dem Ebenennamen. 

Um mehrere Assets zu exportieren, wählen Sie mehrere Ebenen in einer Zeichenfläche aus und klicken auf Für Export markieren.

Wenn Sie ein Illustrator- oder Photoshop-Dokument mit Bildern importieren oder öffnen, markiert XD automatisch alle Bitmap-Bilder für den Export. 

Assets für den Export markieren
Assets für den Export markieren

Design-Spezifikationen mit Assets veröffentlichen

Wenn Sie beim Veröffentlichen von Design-Spezifikationen Assets bereitstellen und den veröffentlichten Link für Entwickler freigeben, geben Sie ihnen einen zentralen Ort, an dem sie diese Assets herunterladen können.

  1. Markieren Sie in XD die zu exportierenden Ebenen.

  2. Klicken Sie rechts oben im Bildschirm auf die Schaltfläche Freigeben und wählen Sie Für Entwickler freigeben. In Design-Spezifikationen wird davon ausgegangen, dass Designs eine Auflösung von 1x haben.

    Für Entwickler freigeben
    Für Entwickler freigeben
  3. Wählen Sie im Dropdown-Menü „Exportieren für“ die Plattform für den Designexport aus. Aktivieren Sie die Option Assets zum Download bereitstellen und klicken Sie auf Link erstellen.

    Assets in Design-Spezifikationen bereitstellen
    Assets in Design-Spezifikationen bereitstellen

    Basierend auf der Plattform, für die Sie das Design erstellen, verfügt jede Plattform über separate Einstellungen für die Auflösung:

    • Web: Die Assets werden bei einer Auflösung von 1x und 2x exportiert.
    • iOS: Die Assets werden bei einer Auflösung von 1x, 2x und 3x exportiert.
    • Android: Die Assets werden für die folgenden Android-Bildschirmrasterdichten optimiert und exportiert:
      • ldpi – geringe Dichte (75 %)
      • mdpi – mittlere Dichte (100 %)
      • hdpi – hohe Dichte (150 %)
      • xhdpi – extra hohe Dichte 1 (200 %)
      • xxhdpi – extra hohe Dichte 2 (300 %)
      • xxxhdpi – extra hohe Dichte 3 (400 %)
  4. Um die veröffentlichte Design-Spezifikation im Browser zu öffnen, klicken Sie auf das Symbol Im Browser öffnen. Wählen Sie dann eine Zeichenfläche aus, um die Elemente anzuzeigen. Die ausgewählten Elemente werden zusammen mit anderen Details der Zeichenfläche im Browser angezeigt. 

    Wenn Sie den Mauszeiger über die Elemente führen, werden in der kontextabhängigen Auswahl die ausgewählten Elemente blau hervorgehoben.

    Assets im Web
    Assets im Web

Assets aus Design-Spezifikationen herunterladen

Wenn Sie die veröffentlichte Design-Spezifikation für Entwickler freigeben, können die Entwickler Assets daraus exportieren. Entwickler können Assets einzeln oder gleichzeitig herunterladen.

Mit Cmd + A bzw. Strg + A können Sie alle Elemente auswählen und bei gedrückter Umschalttaste mehrere. Die Assets werden als ZIP-Datei in den Download-Ordner auf Ihrem Computer heruntergeladen. Sie können Vektor-Assets ins SVG-, PDF- oder PNG-Format umwandeln und Bitmap-Assets ins PNG- oder PDF-Format.

Assets herunterladen
Assets herunterladen

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