Wir bewegen uns in einer Welt, wo die digitalen Möglichkeiten Tag für Tag zunehmen und die Begriffe «User Experience» und «User Interface» immer mehr an Relevanz gewinnen. Jede Applikation und Interaktion muss so verständlich wie möglich dargestellt werden, um mögliche Fehlinterpretationen sowie -Anwendungen zu vermeiden. Um dies vor der Entwicklung zu gewährleisten, stellt das Unternehmen Adobe Systems, welches durch Programme wie Photoshop, InDesign, Illustrator und vielen weiteren kreativen Lösungen schon seit Jahrzehnt einen hohen Bekanntheitsgrad in der Design-Welt eingenommen hat, das Programm Adobe XD zur Verfügung.
Das Programm ermöglicht es UI/UX-Designern vollständig digitale Prototypen zu entwickeln, vielseitig anwendbare Darstellungen zu generieren und gewährleistet dank plattformübergreifender Kompatibilität eine klare Kommunikation. Vieles also, wurde aus harter Photoshop- sowie Illustrator- «Bastlerei» zu einem optimal ausgerichteten Werkzeug.
Beim «soft» Launch der Gratisversion im Jahr 2015 war der USP (Unique Selling Point) des neuen Programms klar auf das «Prototypen» und den Komponenten angelegt. Heute sind dies weiterhin die wichtigsten Funktionen des Programms. Allerdings hat sich die Funktion von integrierten Plugins im Verlauf der letzten sieben Jahren extrem entwickelt. In der UI/UX Gemeinschaft gehören Plugins zum täglichen Gebrauch und sind kaum mehr wegzudenken.
Was genau ist ein Plugin für Adobe XD?
Adobe ermöglicht mit der Funktion «Add ons» externe Softwarehersteller neue Zusatzmodule auf der XD Plattform zu publizieren. Diese individuellen Lösungen ermöglichen den UI/UX-Designers einen optimierten Arbeitsprozess wie beispielsweise Zugriff auf Gratisbilder oder voll automatisierte Verknüpfungen. Die Plugins müssen vom Benutzer manuell installiert werden und sind auf der Adobe Creative Cloud in Form von Applikationen zu aktivieren.
Wir von der Agentur GLA United sind vom Konzept und der Entwicklung der Plugin-Integration begeistert, denn durch die Integration der Plugins haben wir über die Jahre schon einige Arbeitsstunden eingespart. Wobei sicherlich auch die eine oder andere Stunde für Recherchen und das «Testing» zu investieren waren. Um diese Situation für Dich vorzubeugen, stellen wir Dir unsere Top 8 gratis «Must-have» Plugins vor.
Icons 4 Design
Bei der Anwendung einer Webseite oder einer App, welche in der ersten Entwicklungsphase ist und noch klar definiert werden muss, welche Icons wo postiert werden, benützen wir das Plugin Icons 4 Design oft. Dieses Plugin gibt uns die Möglichkeit auf bis zu 5’000 kostenlose, qualitativ hochwertige Symbole zurückzugreifen. Dies spart Zeit und gewährleistet uns genügend Gesprächsstoff für das nächste Kundenmeeting, um die Icons konkret weiterzuentwickeln.
http://emsoftware.com/xdplugins/?mv=product&mv2=accc
Calendar
Wie alle UI/UX-Designers kennen wir den mühsamen Aufwand Kalenderdaten aufzubereiten. Dieses Plugin ermöglicht reale Kalendermonate mit nur einem Klick zu implementieren. Es unterstützt mehrere Sprachen und ist einwandfrei anpassbar. Für uns eine echte Hilfe bei jeder Integration.
https://www.paolobiagini.com/?mv=product&mv2=accc
unDraw
Der Einsatz von illustrativen Bildern kann bei der Kundschaft einen grossen «WOW»-Effekt erzeugen. In den meisten Fällen ist dies aber erst durch erstellte Arbeit klar ersichtlich. Um einen gegebenen Richtungsstil für das passende Projekt anzuwenden, arbeiten wir vermehrt mit dem Plugin unDraw. Diese Palette an vektorbasierenden Illustrationen ermöglicht uns auch im Handumdrehen kundenspezifische Eigenschaften wie bspw. das Verschieben oder Umfärben einzelner Elemente.
https://undraw.co/?mv=product&mv2=accc
UI Faces
Um als Platzhalter das passende Gesicht für ein Profilbild oder ein passendes Testimonial zu finden, benötigt es in den meisten Fällen eine Suche auf Google-Bilder oder anderen Stockbilder-Webseiten. Dieses Plugin vereinfacht Dir den Prozess und ermöglicht anhand einer Filterfunktion das passende Gesicht von etlichen Quellen zu finden. Diese Optimierung ermöglicht Dir nicht nur das Bild auf die genau Pixelgrösse zu importieren, sondern auch eine vollumfängliche Auswahl.
https://www.uifaces.co/adobe-xd-plugin?mv=product&mv2=accc
Web Export
Dieses Plugin verhilft Dir, detaillierte Export-Möglichkeiten für die Integration Deiner Webseite und ist eine grosse Hilfe bei der Veröffentlichung einer Landingpage oder einer Mikro-App. Auch wenn gegebenenfalls Dein HTML 5 Wissen limitiert ist, bist Du mit diesem Plugin gut aufgehoben und kannst die Wünsche der Webentwickler bestens umsetzen.
https://www.velara3.com/?mv=product&mv2=accc
Anima
Wenn Dir die interaktiven Möglichkeiten der Prototypen von Adobe XD nicht ausreichen, dann ist Anima genau das passende Plugin für Dich. Anima verwandelt statische Designs in vollständig interaktive High-Fidelity-Prototypen anhand von generierter Codierung. Interaktive Textfelder «Live text input» oder unterschiedliche Device-Darstellungen «Breakpoints» bringen Deine Wireframes auf ein neues Level und lassen das Verhalten der Interaktionen wie das «Live»-Produkt anfühlen.
https://www.animaapp.com/?mv=product&mv2=accc
Wireframer
Wireframer hat eine riesige Auswahl an individuellen Wireframe-Vorlagen, die beliebig eingesetzt werden können ohne Anmeldung oder Bezahlung. Diese Frames sind gerade bei der Definition der Webstruktur sehr hilfreich und werden von unserer Seite gerne als Grundlage verwendet.
https://www.yumtastic.net/?mv=product&mv2=accc
Lorim Ipsum
Klingt banal, ist aber so! Auch wenn das Plugin Lorim Ipsum «nur» die gleichen Eigenschaften gewährleistet, wie wir es aus dem offline Gebrauch kennen und sicherlich nicht zu den kreativsten Lösungen zählt, gehört es für uns in die Top 8. Wir verwenden dieses Plugin mit hoher Wahrscheinlichkeit am meisten von allen. Das Einsetzen von Blindtext bei der Entwicklung eines Designs ist essenziell und kann anhand dieses Plugins direkt aus der Textfeld-Option generiert werden.
https://xdplugins.pabloklaschka.de/?mv=product&mv2=accc
Du willst mehr rund um das Thema erfahren? Let’s connect!