Benutzerhandbuch Abbrechen

Testen der Prototypen auf iOS/Android

  1. Adobe XD Benutzerhandbuch
  2. Einführung
    1. Neue Funktionen in Adobe XD
    2. Häufige Fragen
    3. Erstellen von Designs und Prototypen und Freigeben mit Adobe XD
    4. Systemanforderungen
      1. Hardware- und Softwareanforderungen
      2. Adobe XD, Big Sur und Apple silicon | macOS 11
    5. Arbeitsbereich – Grundlagen
    6. Ändern der in Adobe XD angezeigten Sprache
    7. Zugriff auf UI-Design-Kits
    8. Barrierefreiheit in Adobe XD
    9. Tastaturbefehle
    10. Tipps und Tricks
    11. Adobe XD-Abo-Varianten
    12. Änderungen am XD Starter-Abo
  3. Design erstellen
    1. Zeichenflächen, Hilfslinien und Ebenen
      1. Erste Schritte mit Zeichenflächen
      2. Verwenden von Hilfslinien und Rastern
      3. Bildlauffähige Zeichenflächen erstellen
      4. Arbeiten mit Ebenen
      5. Erstellen von Bildlaufgruppen
    2. Formen, Objekte und Pfade
      1. Auswählen, Vergrößern, Verkleinern und Drehen von Objekten
      2. Verschieben, Ausrichten, Verteilen und Anordnen von Objekten
      3. Gruppieren, Sperren, Duplizieren, Kopieren und Spiegeln von Objekten
      4. Festlegen von Strichen, Flächen und Schlagschatten für Objekte
      5. Erstellen sich wiederholender Elemente
      6. Perspektivisches Design mit 3D-Transformationen
      7. Bearbeiten von Objekten mithilfe boolescher Operationen
    3. Text und Schriften
      1. Arbeiten mit Zeichen- und Textwerkzeugen
      2. Schriften in XD
    4. Komponenten und Zustände
      1. Arbeiten mit Komponenten
      2. Arbeiten mit verschachtelten Komponenten
      3. Hinzufügen mehrerer Zustände zu Komponenten
    5. Maskierung und Effekte
      1. Erstellen einer Maske mit Formen
      2. Arbeiten mit Weichzeichnen-Effekten
      3. Erstellen und Ändern von Farbverläufen
      4. Fülleffekte anwenden
    6. Layout
      1. Responsive Resize und Bedingungen
      2. Festlegen fester Innenabstände für Komponenten und Gruppen
      3. Erstellen dynamischer Designs mit Stapeln
    7. Videos und Lottie-Animationen
      1. Arbeiten mit Videos
      2. Erstellen von Prototypen mit Videos
      3. Arbeiten mit Lottie-Animationen
  4. Prototypen erstellen
    1. Erstellen interaktiver Prototypen
    2. Animieren von Prototypen
    3. Für Auto-Animate unterstützte Objekteigenschaften
    4. Erstellen von Prototypen mit Tastatur- und Gamepad-Nutzung
    5. Erstellen von Prototypen mit Sprachbefehlen und Audiowiedergabe
    6. Erstellen zeitgesteuerter Übergänge
    7. Hinzufügen von Overlays
    8. Sprachprototypen erstellen
    9. Erstellen von Ankerlinks
    10. Erstellen von Hyperlinks
    11. Testen von Designs und Prototypen
  5. Freigeben, Exportieren und Review
    1. Ausgewählte Zeichenflächen freigeben
    2. Freigeben von Designs und Prototypen
    3. Zugriffsberechtigungen für Links festlegen
    4. Arbeiten mit Prototypen
    5. Prototyp-Review
    6. Arbeiten mit Design-Spezifikationen
    7. Freigeben von Design-Spezifikationen
    8. Auswerten von Design-Spezifikationen
    9. Navigation in Design-Spezifikationen
    10. Reviews und Kommentarfunktion zu Design-Spezifikationen
    11. Exportieren von Design-Assets
    12. Exportieren und Herunterladen von Assets aus Design-Spezifikationen
    13. Gruppenfreigabe für Unternehmen
  6. Design-Systeme
    1. Design-Systeme mit Creative Cloud-Bibliotheken
    2. Arbeiten mit Dokumentelementen in Adobe XD
    3. Arbeiten mit Creative Cloud-Bibliotheken in Adobe XD
    4. Von verknüpften Elementen zu Creative Cloud-Bibliotheken migrieren
    5. Arbeiten mit Designtoken 
    6. Verwenden von Elementen aus Creative Cloud-Bibliotheken
  7. Cloud-Dokumente
    1. Cloud-Dokumente in Adobe XD
    2. Zusammenarbeit und Co-Editing
    3. Co-Editing bei für Sie freigegebenen Dokumenten
  8. Integrationen und Plug-ins
    1. Arbeiten mit externen Elementen
    2. Arbeiten mit Design-Elementen aus Photoshop
    3. Kopieren und Einfügen von Elementen aus Photoshop
    4. Importieren oder Öffnen von Photoshop-Designs
    5. Arbeiten mit Illustrator-Elementen in Adobe XD
    6. Öffnen oder Importieren von Illustrator-Designs
    7. Vektordateien aus Illustrator nach XD kopieren
    8. Plug-ins für Adobe XD
    9. Erstellen und Verwalten von Plug-ins
    10. Jira-Integration für Adobe XD
    11. Slack-Plug-in für XD
    12. Zoom-Plug-in für XD
    13. Designs von XD aus auf Behance freigeben
  9. XD für iOS und Android
    1. Testen der Prototypen auf iOS/Android
    2. Adobe XD unter iOS/Android – Häufige Fragen
  10. Fehlerbehebung
    1. Bekannte und behobene Probleme
      1. Bekannte Probleme
      2. Behobene Probleme
    2. Installation und Updates
      1. XD scheint unter Windows nicht kompatibel zu sein
      2. Fehlercode 191
      3. Fehlercode 183
      4. Probleme beim Installieren von XD Plug-ins
      5.  Aufforderung zur Deinstallation und erneuten Installation von XD | Windows 10
      6. Probleme mit der Migration von Einstellungen
    3. Absturz beim Programmstart
      1.  Adobe XD stürzt ab, wenn es auf Windows 10 gestartet wird
      2.  XD wird beendet, wenn Sie sich von Creative Cloud abmelden
      3. Problem mit dem Abonnementstatus unter Windows
      4. Warnung zu blockierter Applikation, wenn XD auf Windows gestartet wird
      5. Generierung von Absturzbildern auf Windows
      6. Sammlung und Freigabe von Absturzprotokollen
    4. Cloud-Dokumente sowie Creative Cloud-Bibliotheken.
      1. Probleme mit XD Cloud-Dokumenten
      2. Probleme mit verknüpften Komponenten
      3. Probleme mit Bibliotheken und Links
    5. Erstellen und Veröffentlichen von Prototypen und Durchführen von Reviews
      1. Prototyp-Interaktionen können unter macOS Catalina nicht aufgezeichnet werden
      2. Probleme mit Arbeitsabläufen für die Veröffentlichung
      3. Veröffentlichte Links werden in Browsern nicht angezeigt
      4. Prototypen werden in Browsern nicht korrekt dargestellt
      5. Kommentarfeld wird plötzlich bei freigegebenen Links angezeigt
      6. Bibliotheken können nicht veröffentlicht werden
    6. Importieren, exportieren und Zusammenarbeit mit anderen Applikationen
      1. Import und Export in XD
      2. Photoshop-Dateien in XD
      3. Illustrator-Dateien in XD
      4. Von XD nach After Effects exportieren
      5. Sketch-Dateien in XD
      6. Apps von Drittanbietern sind im Export nicht sichtbar

Sie können Prototypen in Echtzeit testen oder in Creative Cloud gespeicherte XD Dateien in XD auf einem Mobilgerät öffnen. Eine weitere Möglichkeit ist, veröffentlichte Prototypen in einem mobilen Browser zu testen.

Mit der Adobe XD App können Sie folgende Aktionen durchführen:

 Wenn auf Ihrem Gerät Adobe XD für Windows 10 ausgeführt wird, wird auf Android die Echtzeitansicht über USB nicht unterstützt.

Voraussetzungen für die Echtzeitansicht auf einem Mobilgerät

Zum Testen von XD Dateien in der Echtzeitansicht oder indem Sie sie aus Creative Cloud öffnen:
  • Adobe XD für iOS/Android

Eine Liste der unterstützten iOS- und Android-Versionen finden Sie unter XD für iOS und Android – Häufig gestellte Fragen.

Zum Testen veröffentlichter Prototypen:

  • Browser auf einem Mobilgerät.

Eine Liste der unterstützten mobilen Browser finden Sie unter Unterstützte Browser.

Prototypen in Echtzeit auf iOS-/Android-Geräten testen

Sie können Ihre Prototypen in Echtzeit auf einem Gerät testen, das über ein USB-Kabel an Ihren Computer angeschlossen ist.

Prototypen in Echtzeit auf einem Gerät testen
Prototypen in Echtzeit auf einem Gerät testen

  1. Verbinden Sie Ihr iOS- oder Android-Gerät mit dem USB-Anschluss des Computers, auf dem Adobe XD für den Desktop ausgeführt wird. Stellen Sie sicher, dass Sie die neueste Version der Desktop-Applikation von XD besitzen, die in Creative Cloud verfügbar ist.

     

    • Vergewissern Sie sich, dass Sie USB-Kabel für die Datenübertragung verwenden. Einige USB-Kabel können nur zum Aufladen von Geräten und nicht für die Datenübertragung verwendet werden.
    • Sie möchten Ihr iPhone an einen Windows-Computer anschließen? Stellen Sie sicher, dass Sie iTunes für Windows installiert haben, damit Sie Ihr Design oder Ihren Prototyp auf Ihrem iPhone in der Echtzeitansicht anzeigen können.
  2. Öffnen Sie Adobe XD für iOS/Android auf Ihrem iOS- bzw. Android-Gerät.

  3. Die in Adobe XD auf dem Desktop ausgewählte (oder aktive) Zeichenfläche wird auf Ihrem Gerät angezeigt. Alle Änderungen, die Sie an Ihren Designs vornehmen, werden in Echtzeit auf Ihrem iOS-/Android-Gerät dargestellt.

    Wenn Sie im Prototypmodus Verdrahtungen für Interaktionen hinzufügen, können Sie sehen, wie diese Interaktionen ablaufen (ebenso wie im Vorschaufenster auf dem Desktop).

  4. Rufen Sie durch dreimaliges Tippen auf den Bildschirm der mobilen App weitere Optionen auf:

    • Übersicht: Zeigt eine Übersicht aller Zeichenflächen in Ihrem Design an.
    • Bildschirm als Bild teilen: Teilt eine bestimmte Zeichenfläche als PNG-Datei über E-Mail, Slack oder andere Kanäle.
    • Hotspot-Hints: Aktiviert beim Testen des Prototyps die Hotspot-Hints.
    • Wischgesten-Navigation: Verhindert, dass Sie bei der Interaktion mit einem Prototyp eine Wischgeste ausführen.
    • Anzeigeoptionen: Zur Anzeige Ihres Designs in verschiedenen Formaten.

Als Cloud-Dokumente gespeicherte XD Dokumente in der Echtzeitansicht testen

Sie können Ihre XD Dokumente für einen Test auf iOS-/Android-Geräten bereitstellen, indem Sie sie in XD Desktop als Creative Cloud-Dokumente speichern. 

  1. Stellen Sie sicher, dass Ihr XD Dokument auf XD Desktop als Creative Cloud-Dokument gespeichert wurde.

  2. Öffnen Sie die Adobe XD App auf Ihrem iOS-/Android-Gerät.

  3. In XD Dokumente werden alle XD Dokumente, die Sie im Ordner „Cloud Documents“ gespeichert haben, angezeigt. Sie können diese Dateiliste nach Dateinamen durchsuchen und das Ergebnis in aufsteigender oder absteigender alphabetischer oder chronologischer (Änderungsdatum) Reihenfolge sortieren. Wenn Sie die gewünschte Datei gefunden haben, können Sie sie anzeigen, indem Sie darauf tippen.

  4. In der Echtzeitansicht können Sie durch dreimaliges Tippen die folgenden Prototypoptionen aufrufen:

    • Übersicht: Um eine Übersicht aller Zeichenflächen in Ihrem Design anzuzeigen. Sie Sie können diese Übersicht durchsuchen und dann zu einer bestimmten Zeichenfläche springen.
    • Bildschirm als Bild teilen: Um eine bestimmte Zeichenfläche als PNG-Datei über E-Mail, soziale Medien oder andere Möglichkeiten, die Ihr Gerät bereitstellt, zu teilen.
    • Hotspot-Hints: Um beim Testen des Prototyps Hotspot-Hints zu aktivieren.
    • Wischgesten-Navigation: Um für die Interaktion mit einem Prototyp Wischgesten zu aktivieren.
    • Anzeigeoptionen: Zur Anzeige Ihres Designs in verschiedenen Formaten.

    Wenn Sie die Zoom-Eingabehilfe aktiviert haben, tippen Sie mit zwei anstatt mit drei Fingern.

  5. Nachdem Sie das Design auf Ihrem iOS-/Android-Gerät überprüft haben, können Sie den Prototyp für die Reviewer freigeben. 

    Bevor Sie den Prototyp freigeben, stellen Sie sicher, dass Sie die Hotspot-Hints aktiviert haben. Dazu tippen Sie dreimal auf den Bildschirm der XD App und aktivieren Hotspot-Hints

  6. Geben Sie den Prototyplink für andere über E-Mail, soziale Netzwerke oder über sonstige vom Gerät bereitgestellte Möglichkeiten frei. Tippen Sie dreimal auf den Bildschirm der XD App und wählen Sie Für Reviewer freigeben.

     Sie können einen Prototyplink nur freigeben, wenn er zuvor mindestens einmal über die XD Desktop-Applikation freigegeben wurde.

Schriften auf iOS/Android

Hier einige Möglichkeiten zum Verwalten von Schriften auf iOS/Android:

  • Wenn möglich, werden Schriften zu Ihrem iOS- bzw. Android-Gerät gesendet, wenn Sie darauf Ihr Design anzeigen. Allerdings gestatten bestimmte Schriftanbieter die Übertragung, Anzeige und Weitergabe ihrer Schriften nicht. Sie sind selbst dafür verantwortlich, dass Sie die Schriftlizenzvereinbarung zwischen Ihnen und dem jeweiligen Schriftanbieter einhalten.
  • Beim Testen eines Prototyps auf einem iOS-/Android-Gerät erhalten Sie eine Warnmeldung, wenn eine Schrift nicht auf Ihrem Gerät vorhanden ist. Fehlende Schriften werden durch verfügbare Schriften ersetzt.
  • Adobe Fonts
    Wenn ein XD Cloud-Dokument auf XD für iOS/Android in der Echtzeitansicht angezeigt wird, wird Adobe Fonts automatisch aktiviert und die Schriften werden korrekt angezeigt.
  • Nicht-Adobe-Schriften
    iOS 13.0 unterstützt die Installation von selbstdefinierten Schriften. Benutzer können mit den von Apple bereitgestellten Methoden oder über die mobile Creative Cloud-App für iOS (ab Version iOS 13.1) selbstdefinierte Schriften über Apps von Drittanbietern installieren. 

Heruntergeladene XD Dateien von Ihrem Gerät löschen

Um den Speicherplatz auf Ihrem iOS-/Android-Gerät anzupassen, können Sie heruntergeladene Dateien löschen, indem Sie durch Tippen Einstellungen > Voreinstellungen wählen.

In den Voreinstellungen sehen Sie, wie viel lokaler Speicher gerade verbraucht wird. Indem Sie auf Offline-Dokumente entfernen tippen, können Sie XD Dokumente, die Sie auf Ihr Gerät heruntergeladen haben, wieder löschen.

Sie können auch einzelne Dateien entfernen, indem Sie die Datei auswählen und die Option Offline verfügbar deaktivieren. 

Veröffentlichte Prototypen in mobilen Browsern testen

Wenn Sie einen freigegebenen Link in einem mobilen Browser öffnen, wird darin eine vergrößerte Zeichenfläche angezeigt, die das gesamte Fenster einnimmt. Wenn die Zeichenflächen des Prototyps nicht verdrahtet sind, wischen Sie nach links oder rechts, um von einer Zeichenfläche zur nächsten bzw. vorherigen zu navigieren.

Vergrößerte Ansicht
Zum Zoomen zusammenziehen

Wenn Sie den Prototyp zum ersten Mal öffnen, kann Ihr Browser-Fenster drei Sekunden lang inaktiv sein, dann erscheint ein Zusammenzieh-Symbol. Wenn Sie einen weiteren veröffentlichten Prototyp öffnen, wird dieses Zusammenzieh-Symbol nicht mehr im gleichen Browser angezeigt. Ziehen Sie die Finger zusammen, um die Zeichenfläche für die Bewegungsansicht zu fassen. 

Verwenden Sie die folgenden Optionen in der Bewegungsansicht:

  •   Zurück zur Startzeichenfläche 
  •  Durch die Zeichenflächen navigieren 
  •  Kommentare zu Designs und Prototypen abgeben

 Durch Auf-/Zuziehen können Sie den Prototyp in seiner Originalgröße anzeigen. Sie können einen Prototyp ohne Qualitätseinbußen beim Inhalt auf bis zu 200 % vergrößern und auf bis zu 25 % verkleinern.

Designs und Prototypen in mobilen Browsern kommentieren

Sie können öffentliche Designs und Prototypen kommentieren ohne sich erst anmelden zu müssen.

Zur Anzeige zusammenziehen
Startseite

  1. Ziehen Sie auf dem Bildschirm zwei Finger zusammen, um die Optionen auf der Startzeichenfläche anzuzeigen. 
  2. Navigieren Sie mit den Pfeiltasten zu dem Bildschirm, den Sie kommentieren wollen. 
  3. Tippen Sie auf das Kommentarsymbol , um die gemeinsamen Prototypen oder Designs zu kommentieren. 
Erst kommentieren
Erst kommentieren, dann anmelden

4. Tippen Sie auf das Sendesymbol  und melden Sie sich mit Ihrer Adobe ID und Ihrem Kennwort an, um Ihre Kommentare zu übermitteln oder auf vorhandene Kommentare zu antworten.

 Sie können sich auch als Gast anmelden, um einen Kommentar abzugeben. Wenn Sie einen privaten Weblink haben, benötigen Sie eine Adobe ID, um sich anzumelden.

Echtzeitansicht der Designs bei unterschiedlichen Auflösungen

An Bildschirmgröße anpassen

Mit dieser Einstellung wird Ihr Design vergrößert bzw. verkleinert, um es an die Breite oder Höhe Ihres Geräts anzupassen, je nachdem, wodurch Ihr Design nicht abgeschnitten wird. Zeichenflächen werden nur bis zum Zweifachen ihrer geplanten Auflösung vergrößert. 

Bei 100 % anzeigen

Ihr Design wird in der Auflösung angezeigt, in der Sie das Design erstellt haben, also ohne Größenänderung. Wenn Ihr Design über den Bildschirm hinausragt, können Sie es mit zwei Fingern bewegen.

Flexibel

Zeichenflächen können mit zwei Fingern gezoomt und bewegt werden. Zeichenflächen werden nur bis zum Zweifachen ihrer geplanten Auflösung vergrößert. Interaktionen funktionieren auch in dieser Ansicht. 

Adobe-Logo

Bei Ihrem Konto anmelden