Einführung in Drag-and-Drop-Interaktionen

Suchen
Captivate Benutzerhandbuch

Auf dieser Seite

Gilt für: Captivate

某些 Creative Cloud 应用程序、服务和功能在中国不可用。

Bei Drag-and-Drop-Interaktionen in Adobe Captivate werden die Benutzer getestet, ob sie Elemente aus einer Gruppe einander zuordnen können.

Assets und Beispiele

Für die Verfahren in diesem Dokument müssen Sie Assets wie Bilder und Beispieldateien für Adobe Captivate-Projekte verwenden. Sie können Ihre eigenen Assets und Beispiele verwenden. Es wird jedoch empfohlen, dass Sie die folgende ZIP-Datei auf Ihren Computer herunterladen und extrahieren:

drag-drop-interactions.zip

Erstellen Ihrer ersten Drag-and-Drop-Interaktion

Lassen Sie uns eine grundlegende Drag-and-Drop-Interaktion erstellen, um Länder ihren Hauptstädten zuzuordnen. 

  1. Öffnen Sie ein leeres Projekt.

  2. Fügen Sie eine Leere Folie aus dem Menü Folien in der Symbolleiste hinzu.

  3. Fügen Sie die Bilder der Sehenswürdigkeiten und der Länder aus der ZIP-Datei zur Folie hinzu. Schauen Sie sich das Bild unten an.

    CC1

  4. Starten Sie den Drag-and-Drop-Interaktionsassistenten aus dem Menü Einfügen.

  5. Legen Sie im ersten Schritt des Assistenten die Sehenswürdigkeiten als Ziehen-Quellen fest. Um die Sehenswürdigkeiten gleichzeitig auszuwählen, halten Sie die STRG-Taste gedrückt und klicken Sie sie an. Klicken Sie auf Weiter.

    CC2

  6. Legen Sie im zweiten Schritt des Assistenten die Länder als die Ablegen-Ziele fest. Um die Länder gleichzeitig auszuwählen, halten Sie die STRG-Taste gedrückt und klicken Sie sie an. Klicken Sie auf Weiter.

    CC3

  7. Im dritten Schritt ordnen Sie die Sehenswürdigkeiten den jeweiligen Ländern zu. Ziehen Sie den Ziehpunkt in der Mitte der Ziehen-Quelle und legen Sie ihn auf dem entsprechenden Ablegen-Ziel ab. Klicken Sie auf Fertig stellen, um den Assistenten zu schließen.

    CC4

  8. Während des letzten Schritts des Assistenten werden zwei Textbeschriftungen auf der Bühne angezeigt. Geben Sie hier den Erfolgstext ein und hier den Text für Misserfolg. Klicken Sie nun auf diese Textbeschriftung, um die Feedback-Nachrichten zu bearbeiten, die der Benutzer erhält, wenn er die Übung bestanden oder nicht bestanden hat. Sie können auch die Eigenschaften des Texts wie Farbe, Größe, Ausrichtung und Schriftstil anpassen.

    Auf der Folie im letzten Schritt des Assistenten wird außerdem die Schaltfläche Senden angezeigt. Der Benutzer muss also auf Senden klicken, um die ihm zugewiesene Aufgabe abzuschließen.

    CC5

  9. Sie können dem Benutzer mehr als einen Versuch gestatten. Gehen Sie zum Eigenschafteninspektor, Registerkarte Drag & Drop, Abschnitt Aktionen, und ändern Sie die Anzahl der Versuche auf 3.

    Wenn Sie diese Option auswählen, können Sie auch die vom Benutzer vorgenommene Interaktion vor dem nächsten Versuch zurücksetzen. Wählen Sie im selben Abschnitt Aktionen Alle zurücksetzen unter Zurücksetzen.

  10. Sie können es den Benutzern auch gestatten, interaktiver zu arbeiten, anstatt die Antworten zu senden.

    1. Wählen Sie das Ablegen-Ziel aus. Wechseln Sie zum Eigenschafteninspektor Registerkarte Drag and Drop Abschnitt Format   und klicken Sie auf Objektaktionen.
    2. Das Dialogfeld Akzeptierte Ziehen-Quellen wird geöffnet.
    3. Heben Sie die Auswahl Alle akzeptieren auf und legen Sie die Anzahl der Versuche durch Bearbeiten der Anzahl fest. Überprüfen Sie nun die akzeptable Ziehen-Quelle für das ausgewählte Ablegen-Ziel. Legen Sie auf ähnliche Weise die zulässigen Ziehen-Quellen für die anderen Ablegen-Ziele fest.

  11. Um die Drag-and-Drop-Interaktion zu sehen, klicken Sie auf Vorschau.

Anpassen der Drag-and-Drop-Interaktion

Anwenden von Effekten auf Ziehen-Quellen und Ablegen-Zielen

Sie können visuelle Effekte erstellen, während Sie die Ziehen-Quelle auf das Ablegen-Ziel verschieben. Wählen Sie dazu die Ziehen-Quellen, wechseln Sie zum Eigenschafteninspektor, Registerkarte Drag & Drop, Abschnitt Format   und wählen Sie entweder Zoom oder Glühen.

Ebenso können Sie den Effekt Zoom für das Ablegen-Ziel festlegen.

Festlegen einer Anzeigemeldung

Sie können optionale Nachrichten für die korrekte und falsche Übereinstimmung anzeigen oder dem Benutzer einen Hinweis geben.

Wählen Sie das Ablegen-Ziel, wechseln Sie zum Eigenschafteninspektor, Registerkarte Drag & Drop, und aktivieren Sie unter Anzeige die Option Beim Akzeptieren. Die Textbeschriftung für Erfolg erscheint auf der Folie. Sie können die Erfolgsmeldung selbst festlegen.

Ebenso können Sie die Option Beim Ablehnen oder Hinweis  aktivieren und die entsprechende Meldung festlegen.

Verwenden der Interaktionseigenschaften

Sie können festlegen, dass die Ziehen-Quelle zurück an ihre ursprüngliche Position verschoben wird, wenn der Benutzer sie versehentlich verschiebt. Sie können den Benutzer auch dazu veranlassen, die Datei neu zu ziehen, wenn sie nicht an der richtigen Stelle abgelegt wird. Verwenden Sie die Interaktionseigenschaften im Bereich Optionen auf der Registerkarte Drag and Drop, um diese Aktionen auszuführen .

redrag_option

Erstellen einer Responsive-Drag-and-Drop-Interaktion

  1. Öffnen Sie ein Responsive-Projekt.

  2. Fügen Sie zwei vertikale Fluid Boxes aus der Symbolleiste ein. 

  3. Fügen Sie drei horizontale Fluid Boxes in die obere Reihe und in die untere Reihe ein. 

    cc_responsive_1

  4. Fügen Sie wie im vorherigen Abschnitt die Bilder der Sehenswürdigkeiten und der Länder aus der ZIP-Datei zur Folie hinzu.

  5. Passen Sie die Fluid Boxes an, um sie an die einzelnen Bilder anzupassen.

    cc_responsive_2

  6. Bewegen Sie den Vorschau-Schieberegler, um zu sehen, wie die Bilder auf verschiedenen Formfaktoren angezeigt werden. Zum Beispiel zeigt das untere Bild, wie sie auf einem iPad angezeigt werden.

    cc_responsive_3

  7. Starten Sie den Drag-and-Drop-Interaktionsassistenten. 

  8. Legen Sie die Ziehen-Quellen fest, legen Sie Ziele ab und ordnen Sie sie wie im vorherigen Abschnitt zu. Bearbeiten Sie auch die Textbeschriftungen für Erfolg und Misserfolg.

  9. Zeigen Sie das Projekt in der Vorschau an.

Verwenden von Typen in einer Drag-and-Drop-Interaktion

Sie können auch Drag-and-Drop-Interaktionen verwenden, damit die Benutzer ähnliche Elemente aus einer Sammlung von Elementen gruppieren können. Diese Aufgabe wird mit der Option Typen gelöst. Lassen Sie uns zum Beispiel ein Projekt erstellen, in dem vermischtes Obst und Gemüse getrennt werden muss.

Drag-and-drop

  1. Öffnen Sie ein leeres Projekt.

  2. Fügen Sie eine Leere Folie aus dem Menü Folien in der Symbolleiste hinzu.

  3. Fügen Sie die Bilder von Obst und Gemüse aus der angegebenen Zip-Datei zur Folie hinzu.

    dnd-_fv1

  4. Starten Sie den Drag-and-Drop-Interaktionsassistenten.

  5. Im ersten Schritt legen Sie alle Obst- und Gemüseelemente als Ziehen-Quellen fest. Ordnen Sie sie dabei in verschiedene Gruppen mithilfe von Typen ein. Sie können diese Aufgabe in zwei Phasen durchführen:

    1. Wählen Sie alles Obst gleichzeitig aus. Um diese Gruppe „Obst“ zu nennen, klicken Sie auf das Symbol + neben der Option Zu Typ hinzufügen auf der Assistenten-Symbolleiste.
    2. Wählen Sie auf ähnliche Weise alle einzelnen Gemüseelemente gleichzeitig aus und erstellen Sie einen Typ namens „Gemüse“.

    Klicken Sie auf Weiter.

    DnD-FV3
    DnD-FV4

  6. Wählen Sie die Körbe als Ablegen-Ziele aus. Klicken Sie auf Weiter.

    DnD-FV5

  7. Ziehen Sie den Ziehpunkt in der Mitte einer Frucht und ziehen Sie diese in den Obstkorb. Während Sie das Element ziehen, zeigen auch alle anderen Obstelemente automatisch auf den Obstkorb. Wenn Sie ein Gemüseelement dem Gemüsekorb zuordnen, werden alle anderen Gemüseelemente ebenfalls dem Warenkorb zugeordnet. Klicken Sie auf Fertig stellen.

    DnD-FV6

  8. Legen Sie die Erfolgs- und Misserfolgsmeldungen fest. Fügen Sie außerdem eine Textbeschriftung hinzu und benennen Sie sie Sie haben 3 Versuche

  9. Sie können dem Benutzer mehr als einen Versuch gestatten. Gehen Sie zum Eigenschafteninspektor, Registerkarte Drag and Drop, Abschnitt Aktionen, und ändern Sie die Anzahl der Versuche auf 3.

    Wenn Sie diese Option auswählen, können Sie auch die vom Benutzer vorgenommene Interaktion vor dem nächsten Versuch zurücksetzen. Wählen Sie im selben Abschnitt Aktionen unter Zurücksetzen Alle zurücksetzen.

    DnD-FV7

  10. Um die Interaktion zu sehen, klicken Sie auf Vorschau.

Fügen Sie eine Drag-and-Drop-Interaktion in ein Adobe Captivate-Quiz ein

Drag-and-Drop-Interaktion kann in ein Adobe Captivate-Quiz aufgenommen werden, sodass die Drag-and-Drop-Interaktion zusammen mit den regulären Quizfragen auch bewertet werden kann.

Fügen wir die Drag-and-Drop-Interaktion aus dem ersten Abschnitt dieses Artikels einem Quiz hinzu.

  1. Öffnen Sie ein leeres Projekt.

    Verwenden Sie den Titel Quiz starten.

    Fügen Sie außerdem eine Schaltfläche mit dem Startsymbol aus dem Menü Formen in der Symbolleiste zur Folie hinzu. Gehen Sie zum Eigenschafteninspektor, Registerkarte Eigenschaften Abschnitt Aktionen und legen Sie für Bei Erfolg als Zur nächsten Folie fest.

  2. Um eine einfache Drag-and-Drop-Interaktion zu erstellen, folgen Sie den Schritten 3-8 im Abschnitt: Erstellen Ihrer ersten Drag-and-Drop-Interaktion

  3. Wählen Sie die Drag-and-Drop-Folie im Filmstreifen. Wechseln Sie zum Eigenschafteninspektor, Registerkarte Drag and Drop, Abschnitt Aktionen und aktivieren Sie unter Berichterstellung die Option In Quiz einfügen. Sie können sehen, dass Zur Gesamtsumme hinzufügen aktiviert ist, sobald In Quiz einfügen aktiviert ist.

    Sie können auch die Antworten des Benutzers in einer Sitzung sammeln und sie an ein LMS senden, um sie in einem Bericht zu veröffentlichen. Aktivieren Sie für diese Option unter Berichterstellung   Antworten weitergeben.

  4. So zeigen Sie den Benutzern nach dem Absenden der Antworten die Punktzahl an:

    1. Wechseln Sie zum Menü Quiz auf der Menüleiste und wählen Sie Quizvoreinstellungen.
    2. Das Dialogfeld „Quizvoreinstellungen“ wird geöffnet. Wählen Sie im Dialogfeld, im Bereich Kategorien unter Quiz die Option Einstellungen.
    3. Aktiviereren Sie Punktzahl am Quizende anzeigen. Eine Quiz-Ergebnisfolie wird nach der Drag-and-Drop-Interaktionsfolie hinzugefügt.
    dnd_quiz_menu

  5. Entfernen Sie die Feedback-Textbeschriftungen von der Drag-and-Drop-Folie.

  6. Zeigen Sie das Projekt in der Vorschau an, um das Quiz in Aktion zu sehen.