Adobe XD Versionen vom August, Oktober und November 2019
xd-mnemonic

Adobe XD ist ein vektorbasiertes Tool, mit dem Sie Nutzererlebnisse (User Experience, UX) für Websites und iOS-/Android-Apps entwerfen und entsprechende Prototypen erstellen können. Sie können ganz einfach zwischen Wireframe-Modus, Visual Design, Interaktionsdesign, Prototyperstellung, Vorschau und Freigabe umschalten – und das alles in einem einzigen, leistungsstarken Tool.

XD wurde für Designer unterschiedlichster Inhalte und Zwecke konzipiert: UX-/UI-Designer, Interaktionsdesigner, Experience-Designer, Produktdesigner, Webdesigner, App-Designer, Grafikdesigner, Unternehmer und andere mehr.


Overview

Neue Funktionen in Adobe XD 24

Die XD Version vom November 2019 umfasst folgende Verbesserungen: 

Zusammenarbeit in Echtzeit mithilfe von Co-Editing (Beta)

Über die Funktion „Co-Editing“ (Beta) können Sie in Echtzeit mit anderen Designern zusammenarbeiten und so Ihren Arbeitsablauf beschleunigen und doppelte oder widersprüchliche Arbeiten vermeiden. Sie können Avatare anderer Benutzer sehen, die dasselbe Dokument bearbeiten, und Bearbeitungen werden in Echtzeit an alle übertragen.

Durch Co-Editing können Ihre Designteams schneller arbeiten und eine einzige Informationsquelle für ein gesamtes Designprojekt bereitstellen.

Beta-Funktionen sind neue Funktionen, die XD Benutzern zur Verfügung gestellt werden, damit sie diese ausprobieren und Feedback dazu abgeben können, während wir diese Funktionen weiterentwickeln und einsatzbereit machen. Bei Beta-Funktionen können Probleme hinsichtlich Qualität und Performance auftreten.

1

Weitere Informationen finden Sie unter Zusammenarbeit und Co-Editing.

Interaktive Elemente mit Komponentenzuständen hinzufügen

Sie können jetzt mithilfe von Komponentenzuständen unterschiedliche Varianten für verschiedene Benutzerinteraktionen erstellen.Sie können beispielsweise eine Schaltflächenkomponente erstellen und dann – je nachdem, ob z. B. der Cursor bewegt oder eine Schaltfläche gedrückt wird – verschiedene Zustände für die Komponente erstellen. 

So brauchen Sie nicht mehr mehrere Zeichenflächen erstellen und verdrahten, um komplexe Interaktionen darzustellen! 

Bei eine Komponente mit verschiedenen Zuständen können Sie mit dem Trigger Hover im Prototypmodus einen Hover-Effekt festlegen, wenn der Cursor über einem bestimmten Designelement platziert wird.

Probieren Sie’s aus.

Components-Hero

Designänderungen mithilfe der Dokumentchronik verwalten

Zu jedem Cloud-Dokument gibt es jetzt eine Dokumentchronik, die eine Übersicht über die verschiedenen Versionen des Dokuments bietet, die während der Arbeit am Dokument gespeichert worden sind. Sie können sogar zu einer früheren Version zurückkehren und die letzten Änderungen an Ihrem XD Dokument wiederherstellen. 

Um zu einer früheren Version zurückkehren, öffnen Sie in der Dokumentchronik eine Version des Dokuments, kopieren den Inhalt und fügen ihn in Ihre aktuelle Version ein. 

Nun können Sie mit anderen Designern zusammenarbeiten und die Entwicklung Ihrer Dokumente im Laufe der Zeit nachverfolgen!

history_xd

Weitere Informationen finden Sie unter Designänderungen verwalten.

Mithilfe mehrfacher Interaktionen hochwertige Prototypen erstellen

Im Prototypmodus haben Sie jetzt die Möglichkeit, mehrfache Interaktionen für ein einzelnes Designelement oder Objekt anzugeben.

Sie ziehen aus einem einzigen Element mehrere Verdrahtungen und fügen Interaktionen für verschiedene Trigger wie Antippen oder Ziehen hinzu ohne dafür Objekte oder Zeichenflächen duplizieren zu müssen.

Schluss mit der Anhäufung vereinzelter Interaktionen! 

Multiple-trigger

Weitere Informationen finden Sie unter Erstellen interaktiver Prototypen | Übersicht.

Titel: Mehrfache Interaktionen

Dauer: 4 Minuten


Auf Plug-ins aus dem neu gestalteten Plug-in-Manager zugreifen

Über den neu gestalteten Plug-in-Manager können Sie nach Plug-ins für XD suchen und diese installieren. Durchsuchen Sie verschiedene Kategorien und Sammlungen von Plug-ins, suchen Sie nach bestimmten Plug-ins oder Begriffen und zeigen Sie für jedes Plug-in eine Profilliste an mit Screenshots, Beschreibungen, Sprachunterstützung und mehr an.

Plug-in-Manager
Neu gestalteter Plug-in-Manager

Weitere Informationen finden Sie unter Plug-ins in XD.

Titel: Neu gestalteter Plug-in-Manager

Dauer: 2 Minuten


Freigabe und Zusammenarbeit mit dem neu gestalteten Freigabeerlebnis

Der neue Freigabemodus fasst verschiedene Freigabefunktionen an einem zentralen Ort zusammen. Auf diese Weise können Sie Ihre Designs freigeben und problemlos mit anderen Designern zusammenarbeiten. In Kombination mit Vorgaben für verschiedene Szenarios wie Design-Review oder Entwicklung haben Sie die volle Kontrolle darüber, wie Sie freigegebene Links verwalten oder aktualisieren.

Im Folgenden erfahren Sie mehr über die Vorteile des neu gestalteten Freigabemodus.

  • Mehrere veröffentlichte Links verwalten: In der URL-Auswahl sehen Sie alle bisher veröffentlichten Links. Sie können diese Links einfach ändern oder sogar Ihre vorhandenen Design-Links aktualisieren!
  • Beim Veröffentlichen verwendbare Vorgaben: Für verschiedene Szenarios stehen Ihnen praktische Vorgaben wie Design-Review, Entwicklung, Präsentation, User Testing oder Benutzerdefiniert im Menü Anzeigeeinstellungen zur Verfügung. Sie brauchen jetzt beim Erstellen eines Design-Links nicht mehr jedes Mal die geeigneten Optionen oder Kontrollkästchen auswählen. XD macht das für Sie!
  • Dieselbe URL für mehrere Vorgaben und Iterationen beibehalten: Erstellen Sie einmal eine URL, die Sie dann wiederverwenden können oder für die sie je nach Bedarf die zugeordnete Vorgabe wechseln. 
  • Einfache Identifizierung von Zeichenflächen: Identifizieren Sie visuell die hervorgehobenen Zeichenflächen, die von der Arbeitsfläche aus veröffentlicht werden sollen. In Ihren veröffentlichten Links wird es keine fehlenden Verdrahtungen oder Bildschirme mehr geben.
Freigabemodus
Neu gestalteter Freigabemodus

Weitere Informationen finden Sie unter Freigeben von Designs und Prototypen.

Titel: Freigabemodus

Dauer: 3 Minuten


Elemente mit verbesserter Creative Cloud-Bibliotheken-Integration freigeben

Sie können jetzt auf Creative Cloud-Bibliotheken zugreifen und diese durchsuchen, Elemente wie Komponenten, Grafiken, Farben, Verläufe oder Zeichenformate aus XD in Creative Cloud-Bibliotheken einfügen und sie von XD heraus direkt in XD Projekten verwenden.

Sie können auch XD Elemente zu CC-Bibliotheken hinzufügen und in anderen Creative Cloud-Applikationen verwenden.

Versorgen Sie die Kreativteams in Ihrem Unternehmen mit gemeinsamen Ressourcen wie Markenfarben, Grafiken, Logos und vielem mehr!

Creative Cloud-Bibliotheken
Creative Cloud-Bibliotheken in XD

Weitere Informationen finden Sie unter Creative Cloud-Bibliotheken für XD

Sketch-Bibliotheken in verknüpfte Elemente konvertieren

Wenn Sie an Ihren Designsystemen arbeiten, können Sie jetzt ältere Sketch-Elemente importieren ohne sie neu erstellen zu müssen.

Ihre Sketch-Symbole und -Elemente werden in XD Komponenten konvertiert und Sie können sie auch als verknüpfte Elemente verwenden.

1

Weitere Informationen finden Sie unter Sketch-Bibliotheken konvertieren.

Neue Funktionen in Adobe XD 23

Die XD Version vom Oktober 2019 umfasst folgende Verbesserungen: 

Fülleffekte

Ab XD 23.0 können Sie zerstörungsfreie Fülleffekte anwenden, um Ihre Bilder oder Grafikelemente zu gestalten.

Verwenden Sie die Fülleffekte, um Ihren Designs ein neues Aussehen zu verleihen, indem Sie die Farben von Objekten mit den Farben der zugrunde liegenden Objekte abgleichen und Ihren Designs Leben einhauchen.

Füllmethoden

Weitere Informationen zum Anwenden von Fülleffekten finden Sie unter Anwenden von Fülleffekten.

Schrittweise verschieben und vergrößern

Ab XD 23.0 können Sie diese Tastenkombinationen mit den Pfeiltasten kombinieren, um die Position und Größe der Benutzeroberflächenelemente in Schritten in Größe der Rasterkästchen genau zu steuern.

  • Umschalt + Pfeiltasten: Verschiebt die Auswahl in Schritten von 10 Pixel.
  • Cmd + Pfeiltasten: Ändert die Größe der Auswahl in Schritten von 1 Pixel (das Element ist in der linken oberen Ecke angeheftet).
  • Cmd + Umschalt + Pfeiltasten (Mac) und Alt + Umschalt + Pfeiltasten (Windows): Ändert die Größe der Auswahl in Schritten von 10 Pixel (das Element ist in der linken oberen Ecke angeheftet).

Bei aktivierten Rasterkästchen:

  • Umschalt + Pfeiltasten: Verschiebt die Auswahl so, dass sie zuerst am Raster ausgerichtet wird, und verschiebt sie dann in Schritten in Größe der Rasterkästchen.
  • Cmd + Umschalt + Pfeiltasten (Mac) bzw. Alt + Umschalt + Pfeiltasten (Windows): Ändert die Größe der Auswahl so, dass sie zuerst am Raster ausgerichtet wird, und dann in Schritten in Größe der Rasterkästchen (das Element ist in der linken oberen Ecke angeheftet).
Schrittweise vergrößern
Schrittweise vergrößern

Auswahl über überlappende Ebenen hinweg

Designmodus:

In XD 23.0 wurde das Verhalten der Tastenkombination Cmd + Klicken bzw. Strg + Klicken erweitert, indem ein Drilldown in der Z-Reihenfolge von Objekten auf der Design-Arbeitsfläche sowie in den Design-Spezifikationen ausgeführt wird. Wenn Sie die gewünschte Ebene erreicht haben, können Sie sie mit der Tastatur schrittweise verschieben oder per Rechtsklick das entsprechende Kontextmenü öffnen.

Wenn mehrere Ebenen übereinander gestapelt sind, wählen Sie mit Cmd + Klicken bzw. Strg + Klicken das nächste Objekt unter der ausgewählten Ebene aus. Wenn Sie die letzte darunterliegende Ebene erreicht haben, gelangen Sie mit derselben Tastenkombination zurück zur obersten Ebene. 

Überlappende Ebenen auswählen
Auswahl über überlappende Ebenen hinweg

Design-Spezifikationen

Um die unter einer überlappenden Ebene verborgenen Ebenen anzuzeigen und zu prüfen, zeigen Sie mit der Maus darauf und klicken Sie mit der rechten Maustaste auf den entsprechenden Bereich auf der Zeichenfläche. Dadurch wird eine Liste aller Ebenen und deren Kontextdetails an diesem Pixelpunkt angezeigt. Sie können auch mit Cmd + Klicken einen sequenziellen Drilldown ausführen und die Ebeneneigenschaften anzeigen.

Weitere Informationen über den Zugriff auf überlappende Ebenen finden Sie unter Auswählen, Vergrößern, Verkleinern und Drehen von Objekten.

Neue Funktionen in Adobe XD 22

Bearbeitung in Photoshop

Bearbeitung in Photoshop

XD bietet jetzt eine verbesserte Integration mit Adobe Photoshop, indem Sie XD Bilder direkt in Photoshop öffnen, bearbeiten und in Echtzeit aktualisieren können. Beim Bearbeiten und Speichern der Bilder in Photoshop speichert XD die reduzierte Datei und platziert anstelle der bearbeiteten Datei die Bitmap-Datei in XD. 

Weitere Informationen finden Sie unter Arbeiten mit externen Elementen

Dauer: 3:20 Minuten


Verbessertes Bedienfeld für Plug-ins

Bedienfeld für Plug-ins

Mit der neuesten Version von XD können Sie XD Plug-ins direkt von XD aus starten und damit interagieren. Im neuen Bedienfeld „Plug-ins“ können Sie Plug-ins in XD anzeigen und verwalten. Auf diese Weise können Sie sich ganz auf Ihre Kreativität konzentrieren, während Sie an Ihren XD Designs arbeiten. 

Weitere Informationen finden Sie unter Plug-ins anzeigen und installieren.

Dauer: 4:30 Minuten


CSS-Codefragmente in Design-Spezifikationen

Um die Designs in eine funktionale Website zu übertragen, können Sie die CSS-Codefragment aus den Designspezifikationen kopieren und in Ihren Code einfügen.

Der CSS-Code wird automatisch generiert, wenn Sie beim Veröffentlichen von Design-Spezifikationen im Fenster Für Entwickler freigeben als Ausgabeziel Web auswählen. Wenn Sie Ihre Design-Spezifikation veröffentlichen, zeigt XD automatisch das CSS-Codefragment für die ausgewählte Ebene an. 

CSS-Codefragmente
CSS-Codefragmente

Weitere Informationen finden Sie unter Auswerten von Design-Spezifikationen in XD.

Dauer: 2:58 Minuten


Verbesserungen bei Komponentenbegrenzungen

Komponenten unterstützen eine Vielzahl von Überschreibungen und passen die Größe nahtlos an verschiedene Bildschirmgrößen an, können jedoch beim Anwenden von Effekten oder beim Reorganisieren von Objekten problematisch sein. In früheren XD Versionen wurde der Inhalt abgeschnitten, wenn Sie ein Objekt hinzufügten, das sich außerhalb der Begrenzungen der ursprünglichen Primärkomponente befand.

Um Probleme mit Komponentenbegrenzungen zu beheben, wählen Sie die Primärkomponente aus, klicken mit der rechten Maustaste und wählen Begrenzungen an Inhalt anpassen. Die Komponentenbegrenzungen werden so angepasst, dass alle abgeschnittenen Objekte in der Primärkomponente sowie in den Instanzen vollständig angezeigt werden.

Beim Erstellen neuer Komponenten:

  • Schatten und Weichzeichnungen werden außerhalb des Begrenzungsrahmens der Komponente gerendert und
  • der Begrenzungsbereich passt den gesamten Inhalt in die Komponente ein.
Begrenzungen an Inhalt anpassen
Begrenzungen an Inhalt anpassen

Dauer: 4 Minuten


Reduzierung gebrochener Pixelwerte

Beim Design von HiDPI-Bildschirmen verursachen gebrochene Pixelwerte (Pixelwerte mit Dezimalstellen) verzerrte Inhalte. Ab XD 22.0 rundet XD die Pixelwerte, wenn Sie von Gruppen von Objekten, Komponenten oder Bildmasken die Größe ändern, um Designfriktionen und Bildverzerrungen zu beseitigen. XD behält jedoch gebrochene Werte von Inhalten bei, die vor XD 22.0 erstellt worden sind.  

Reduzierung gebrochener Pixelwerte
Reduzierung gebrochener Pixelwerte

Dauer: 3:20 Minuten


Wechseln zwischen Raster- und Flow-Ansicht

Um sich einen Gesamtüberblick über den Design-Flow mit Informationen zum Zeichenflächenlayout zu verschaffen, klicken Sie links oben auf dem Bildschirm auf den Namen des Prototyps oder der Design-Spezifikation. Die Standardansicht ist die Rasteransicht. Sie können zwischen Raster- und Flow-Ansicht wechseln, in denen jeweils Folgendes angezeigt wird:

  • In der Rasteransicht werden alle Zeichenflächen in einem Rasterformat angezeigt, sodass Sie die einzelnen Zeichenflächen prüfen und aufrufen können.
  • In der Flow-Ansicht wird die Design- und Layouthierarchie der Zeichenfläche dargestellt.
Rasteransicht
Rasteransicht
Flow-Ansicht
Flow-Ansicht

Weitere Informationen finden Sie unter Navigation in Design-Spezifikationen in XD.