Adobe XD Experience Design: – UX/UI-Design + Prototyping
Online-Schulungen, offene Trainings in Nürnberg und Inhouse-Seminare & Kurse auch in München und Saarbrücken.
Adobe XD ist die neue Komplettlösung für die Gestaltung ansprechender UX/UI-Designs. Erstellen Sie Prototypen für unterschiedliche Gerätekategorien, verknüpfen Sie Ihre Screendesigns zu einem interaktiven Klickmodell und testen Sie die Benutzererfahrung für eine optimale Usability.
Das Ziel ist positive Kundenerlebnisse bei der Benutzung Ihrer screenbasierten Anwendungen zu erzielen. Adobe XD unterstützt Sie bei der Erstellung interaktiver Klickprototypen – ohne eine einzige Zeile Code programmieren zu müssen. Sammeln Sie erste Ideen für Ihre Screendesigns, erstellen Sie ein Wireframe-Modell und gestalten Sie ein ansprechendes Mockup Ihrer Anwendung. Selbst die Erstellung komplexer Prototypen, mit hunderten einzelner Screens, ist in Adobe XD mühelos möglich!
Nach der Gestaltungsphase verdrahten Sie die einzelnen Screens zu einem interaktiven Klickmodell und fügen animierte Seitenübergänge hinzu. Anschließend testen Sie Ihren Prototypen auf den gewünschten Endgeräten in Echtzeit und holen Kundenfeedback ein.
Schulungsziel
Sie lernen in dieser Einsteigerschulung den Arbeitsbereich und kompletten Workflow von Adobe XD kennen, Designelemente aus Adobe Illustrator und PhotoShop zu integrieren und ansprechende Screendesigns mit den Werkzeugen von Adobe XD zu gestalten.
Weiterhin lernen Sie die einzelnen Screens zu einem interaktiven Klickmodell miteinander zu verketten, auf mobile Endgeräte zu übertragen und die Benutzererfahrung live zu testen. Schließlich erfahren Sie noch, wie Sie Designelemte aus Adobe XD für die spätere Programmierung Ihrer Anwendung extrahieren können.
Zielgruppe
- Mediengestalter, Grafiker, Kommunikationsdesigner
- Web Designer/Entwickler
UX/UI-Designer
Empfohlene Vorkenntnisse
- sicheres Arbeiten unter Windows oder Apple macOS
- Grundlagenkenntnisse in Adobe Illustrator und Photoshop von Vorteil
- Kenntnisse in HTML, CSS oder Javascript nicht erforderlich!
Schulungsinhalte – Tag 1
- Grundlagen von Adobe XD
- Der Startbildschirm
- Überblick über die Benutzeroberfläche
- Arbeiten im Design- und Prototyp-Modus
- Unterschiede der Oberfläche zwischen Windows und Mac
- Nutzen der UI-Kits
- Arbeiten mit Cloud-Dokumenten
- Kennenlernen der wichtigsten Tastaturkurzbefehle
- Anlegen von Zeichenflächen und Rastern
- Zeichenflächen hinzufügen und duplizieren
- scrollbare Zeichenflächen erstellen
- Einrichten eines Gestaltungsrasters
- Ein Wireframe-Modell anlegen
- Bilder importieren und maskieren
- Effizientes Arbeiten mit dem Wiederholungsraster
- Texte und Bilder mit dem Wiederholungsraster nutzen
- Formen und Inhalte erstellen und verwalten
- Kennenlernen der Zeichenwerkzeuge
- Pfade zeichnen und modifizieren
- Objekte anordnen, verteilen und ausrichten
- Texte anlegen und formatieren
- Gestaltung komplexer Formen mit Hilfe der Pfad-Operationen
- Weichzeichen- und Schatteneffekte generieren
- Elemente- und Ebenen-Palette
- Farben und Verläufe anlegen und speichern
- Globale Farbänderungen vornehmen
- Textformate anlegen und verwalten
- Globale Textformatierungen vornehmen
- Elemente suchen und filtern
- Projekte mit der Ebenen-Palette strukturieren
- Komponenten und Instanzen
- Komponenten anlegen und Instanzen erzeugen
- Eingebettete und verknüpfte Komponenten
- Komponenten in einem Team-Workflow nutzen
- Instanzen austauschen und aktualisieren
- Zusammenarbeit mit Illustrator & PhotoShop
- Icons und Piktogramme aus Illustrator exportieren
- Bildelemente aus PhotoShop-Layouts extrahieren
- Creative Cloud Bibliotheken
- Eine neue Bibliothek anlegen
- Objekte, Farben und weitere Designelemente zu einer Bibliothek hinzufügen
- Elemente aus aus dem Adobe Market hinzufügen
- Bilder aus Adobe Stock verwenden
- Bibliotheken programmübergreifend nutzen
- Bibliotheken für Teammitglieder freigeben
- Designelemente archivieren und dauerhaft löschen
Schulungsinhalte – Tag 2
- Responsive Größenänderungen
- Responsive Resize für Objekte
- Größenveränderungen manuell definieren
- Objekte verankern
- Responsives Skalieren von Zeichenflächen aktivieren
- Interaktive Prototypen erstellen
- Definition der Startseite
- Objekte und Zeichenflächen miteinander verdrahten
- Seitenübergänge festlegen
- Timing der Animationseffekte steuern
- zeitgesteuerte Übergangseffekte
- Status-Zustände von Komponenten definieren
- Mehrere Auslöser für ein Objekt festlegen
- Automatische Zurück-Buttons definieren
- Interaktivität im Prototyp-Modus hinzufügen
- Überprüfung des Prototpyen auf einem Smartphone
- Animierte Microinteraktionen
- Definieren automatischer Animationseffekte
- Kippschalter und animierte Schaubilder erstellen
- Praxis-Beispiele für Auto-Animate Effekte
- Eine Vorschau animierter Inhalte betrachten
- Sprach- und Tastatursteuerung
- Sprachbefehle festlegen
- Gesprochene Audio-Antworten hinzufügen
- Tastaturkurzbefehle als Auslöser festlegen
- Zusammenarbeit mit Kunden und Entwicklern
- Erstellen eines Demonstrationsvideos der Bedienung
- Veröffentlichen des Klickmodells im Internet
- Passwortgeschützte Prototypen freigeben
- Kommentare zum Klickmodell hinzufügen
- Einzelne Objekte für die Programmierung exportieren
- Zeichenflächen und Objekte in verschiedenen
- Formaten und Größen exportieren
- Designspezifikationen für Entwickler freigeben
- Auswertung der Designspezifikationen
- PlugIns
- Erweiterungen hinzufügen und verwalten
- Vorstellung nützlicher PlugIns
- Hilfreiche Tipps & Tricks
Verfügbare Plattformen
Microsoft Windows und Apple macOS
Dauer
2 Tage à 8 Unterrichtsstunden.(1)
(8:30 Uhr bis ca. 15:45 Uhr)
