Creative Connection

13. Februar 2018 /UX/UI Design /Web-Design /

Das Februar-Update für Adobe XD ist da

Wir möchten, dass XD euch dabei hilft, in Denkgeschwindigkeit zu gestalten. Deshalb haben wir vergangenen Monat dem Zooming einen Leistungsschub sowie Verbesserungen bei den Farb- und Exportfunktionen hinzugefügt. Außerdem haben wir es für euch leichter gemacht, Workflows mit Drittanbieter-Integrationen einzufügen, auf die ihr angewiesen seid, um eure Aufträge zu finalisieren.

In diesem Monat bietet unser Update optimierte Vektor-Workflows zwischen Adobe Illustrator und XD sowie eine neue Möglichkeit, in Windows durch die Verwendung der Stift- und Touch-Funktion kreativ zu sein.

Wollt ihr diese neue Version und mehr in Aktion sehen? Besucht Adobe Live vom 13. bis 15. Feb., um zu erleben, wie die besten UX-Designer die neuesten Funktionen in Adobe XD verwenden.

Verwendet ihr Illustrator, um Icons und Vektorgrafiken zu entwerfen? Wir haben die Arbeit mit Illustrator und XD durch verknüpfte Vektorgrafiken wesentlich vereinfacht. Verknüpfte Vektorgrafiken ermöglichen es euch, Vektorinhalte aus Illustrator in XD einzubringen. Nehmt in Illustrator Änderungen an euren Arbeiten vor und aktualisiert sie in XD. Um das neue Features zu zelebrieren, haben wir vor Kurzem drei Icon Kits zusammen mit renomierten Designern veröffentlich. Lest mehr über die Icon Kits von Anton & Irene, Büro Destruct und Lance Wyman im Blog und ladet euch sie kostenlos herunter.

Das ist noch nicht alles. Eine der Grundprinzipien von XD besteht darin, auf der neuesten Plattform aufzubauen und die technologischen Fortschritte, die Hardware bieten kann, zu nutzen. Bei Windows freuen wir uns euch mitteilen zu können, dass XD nun einfache Stift- und Touch-Gesten unterstützt.

Wir sind immer auf der Suche nach Möglichkeiten, die von uns ausgelieferten Funktionen zu verbessern. In diesem Monat haben wir unter anderem die Pipette und das Scrollen verfeinert.

Vektorgrafiken in CC Bibliotheken

Das Versprechen der Creative Cloud ist es, euch und euer Team in die Lage zu versetzen, effizient mit verschiedenen CC-Anwendungen zu arbeiten. Häufig habt ihr Elemente wie Icons, Illustrationen und andere Vektorgrafiken, die ihr in Illustrator erstellt, die ihr jedoch in anderen Anwendungen wie XD verwenden möchtet. Mithilfe von Vektorgrafiken könnt ihr jetzt Vektorinhalte aus Illustrator und Adobe Stock mit XD wiederverwenden.

Einfügen von verknüpften Vektorgrafiken

Ihr könnt eine Vektorgrafik aus dem CC-Bibliothek-Fenster per Drag & Drop auf die Leinwand ziehen, um sie als verknüpfte Vektorgrafik zu platzieren. Sobald ihr die Grafik fallen lasst, seht ihr eine verschwommene Vorschau mit einem Kreisel, während XD einen kleinen Zaubertrick durchführt, um sie in einen vollständig skalierbaren verknüpften Vektor zu konvertieren. Sobald dies abgeschlossen ist, seht ihr die Grafik, die in der Größe verändert und rotiert werden kann.

Aktualisieren von verknüpften Vektorgrafiken

Der Hauptvorteil der Verwendung einer verknüpften Vektorgrafik besteht darin, den Arbeitsaufwand bei der Bearbeitung in Illustrator zu reduzieren und dann die Grafik wieder in XD zu importieren. Bei verknüpften Grafiken könnt ihr mit Rechtsklick auf das Vorschaubild im CC-Bibliothek-Fenster klicken und im Kontextmenü “Bearbeiten” wählen. Dadurch wird die Grafik in Illustrator geöffnet und ihr könnt Änderungen an ihr vornehmen. Wenn ihr die Bearbeitung eurer Grafik abgeschlossen habt, klickt ihr in Illustrator auf “Speichern” und könnt zuschauen, wie diese Änderungen auf magische Weise auf die Grafik in XD angewendet werden. Dies ist eine enorme Zeitersparnis bei der Arbeit zwischen Illustrator und XD.

Aufhebung der Verknüpfung und Bearbeitung von Vektorgrafiken

Es kann vorkommen, dass ihr es vorziehen würdet, dass die verknüpfte Grafik keine Aktualisierungen mehr von Illustrator erhält. Um die Verknüpfung aufzuheben, klickt ihr auf das Symbol “Verknüpfung aufheben” in der oberen linken Ecke der Grafik oder verwendet die Option Verknüpfung aufheben im Kontextmenü. Sobald die Verknüpfung aufgehoben ist, könnt ihr in XD verschiedene Eigenschafften wie die Füllung, die Kontur und den Pfad bearbeiten.

Beibehaltung der Scroll-Position

Ihr verfügt jetzt über eine einfache Möglichkeit, eine Änderung an einen bestimmten Bildschirmbereich zu kommunizieren, den zu sehen ihr vorher scrollen musstet.

Vor dieser neuen Version war es so, dass der Prototyp euch beim Scrollen durch einen Bildschirm und beim Klicken auf ein vernetztes Objekt zum oberen Rand des nächsten Bildschirms brachte, anstatt eure Scroll-Position auf dem vorherigen Bildschirm beizubehalten.

Bei der Vernetzung von Objekten im Prototyp-Modus könnt ihr nun auswählen, die Scroll-Position beizubehalten, so dass der Prototyp zum nächsten Bildschirm wechseln kann, während er die Position des vorherigen Bildschirms beibehält.

Stift & Touch in Windows

Mit der Entwicklung der Designindustrie entwickeln sich auch die Bedürfnisse der Gestalter und die Plattformen, auf denen sie arbeiten. Wir geben uns Mühe, auf jeder Plattform ein guter Partner zu sein und einzigartige Fähigkeiten einzusetzen, um die neuesten Technologien zu nutzen. Mit dieser Version haben wir daher grundlegende Stift- und Touch-Unterstützung für XD auf Windows 10 als Ergänzung zu Maus und Keyboard eingeführt.

Ihr könnt die Stift- und Touch-Oberfläche verwenden, um mit den Werkzeugen von XD zu interagieren, Illustrationen auf der Leinwand zu erschaffen, durch Ebenen zu navigieren, mit Symbolen zu interagieren, Prototypen zu vernetzen, Eigenschaften zu bearbeiten, durch das Vorschaufenster zu scrollen und vieles mehr.

Kleine Optimierungen zwischendurch waren noch nie so einfach in XD. Ihr könnt den Stift verwenden, um Werte in den Eigenschafteninspektor einzugeben, oder – noch besser – auf ein numerisches Feld tippen und es gedrückt halten, um Werte durchzublättern.

Mit der Touch-Funktion könnt ihr auf der Leinwand zeichnen, Objekte in der Größe verändern und Raster wiederholen, Bilder per Drag & Drop bewegen und sogar mit der Pipette Farbwerte auswählen.

Dies ist erst der Anfang und wir freuen uns auf euer Feedback.

Verbesserung von Design Specs Beta

Design Specs Beta ist die Brücke zu eurem Entwicklungsteam. Es ermöglicht euren Entwicklern, eine Vorschau eurer Designs im Browser zu sehen und wichtige Informationen wie Farbwerte, Maße und Styles zu erfassen. Wir haben jetzt Unterstützung für die Anzeige von Layout-Rastern in Design Specs Beta hinzugefügt. Dadurch können eure Entwickler die von euch gewählte Struktur und das Framework sehen und verstehen.

Wenn ihr im Design-Modus ein Layout-Raster für eine eurer Zeichenflächen aktiviert habt, kann der Entwickler zwischen den Layout-Rastern in Design Specs Beta hin- und herschalten, um es zu sehen. Es ist nur in den Zeichenflächen vorhanden, in denen der Gestalter es aktiviert hat, und ist auch standardmäßig eingeschaltet. Der Entwickler kann wählen, ob er es abschalten möchte, wenn er es gesehen hat.

Pipette im Eigenschafteninspektor

Als wir zum ersten Mal die Farbauswahl in XD lieferten, erhielten wir Feedback über die Unterstützung einer Pipette in ihr. Im Dezember haben wir die Pipette vom Eigenschafteninspektor in die Farbauswahl verlegt.

Wir dachten, wir würden das Leben leichter machen. Dann hörten wir euer Feedback und realisierten, wie viele unnötige Klicks ihr ausführen musstet, um eine Farbe auszuwählen, nachdem wir die Pipette in die Farbauswahl verschoben hatten. Wir hörten auch, wie einfach es nun war, Farben für Farbverläufe auszuwählen, da wir die Pipette hineinverlegt hatten.

Wir sind uns darüber im Klaren, dass der Zugang zur Pipette sowohl im Eigenschafteninspektor als auch in der Farbauswahl absolut notwendig ist, um schnell arbeiten zu können. Mit dieser Version führen wir die Pipette deshalb auch wieder in den Eigenschafteninspektor ein.

Verbesserung der Kommentarfunktion

Wir sind immer auf der Suche nach Möglichkeiten, die von uns ausgelieferten Funktionen zu verbessern. In diesem Monat haben wir ein paar Verbesserungen an den Kommentarfunktionen zu Prototypen vorgenommen, die es einfacher machen, Kommentare hinzuzufügen und sie an einen bestimmten Teil des Entwurfs anzuhängen.

Ressourcen

Ladet Fünf kostenlose UI-Kits herunter, die von fünf talentierten Gestaltern exklusiv für Adobe XD veröffentlicht wurden, damit ihr eure Projekte schneller umsetzen könnt.

Icon-Kits

Bei der Awwwards 2018 haben wir ein exklusives Set von Icon-Kits für die Verwendung in Adobe XD  veröffentlicht. Sie wurden von drei weltbekannten Designern entworfen und unterstreichen die Bedeutung von Icons für Interaktionsdesign in der modernen digitalen Welt. Erfahrt mehr über die Kits von Lance Wyman, Anton & Irene und Büro Destruct in unserem Blog Post hier. Ob Anfänger oder Profi – dieses kleine Geschenk von Adobe wird euer nächstes Projekt schneller, einfacher und damit auch nutzerfreundlicher machen. Ihr könnt die Kits hier kostenlos herunterladen.

UX-Community

Lasst uns im Gespräch bleiben! Folgt uns unter @AdobeXD für Updates oder kontaktiert unser Team auf Twitter mit #AdobeXD. Ihr könnt mit uns auch gern auf Facebook chatten, wo wir Videos und Neuigkeiten mit euch teilen und eure Fragen live beantworten.

Für Einblicke in UX direkt über euer Postfach bestellt einfach den Experience-Design-Newsletter von Adobe!

Wenn ihr eure Prototypen auf Behance freigebt, denkt bitte daran, sie mit #MadeWithAdobeXD zu taggen, und wählt Adobe Experience Design unter “Verwendete Tools” – so erhaltet ihr die Chance auf eine Erwähnung in unserem Adobe-XD-Newsletter.

UX/UI Design, Web-Design

Diskutiere jetzt mit

  • By Timo - 12:39 PM on February 14, 2018   Reply

    Ohhja, verknüpfte Vektor-Grafiken! Die (fehlende) Funktion war für mich das Killer-Kriterium wenn es darum ging, neue UI-Projekte in XD aufzusetzen. Jetzt kann die Situation wieder völlig neu bewertet werden. Sehr cool, weiter so Adobe!

Diskutiere jetzt mit