Pidoco. Dein Wireframing Tool.

Hilfe

Interaktion

Was sind Interaktionen?

Interaktionen sind Eigenschaften, die Sie jedem Element, jeder Seite oder Ebene hinzufügen können, um zu simulieren, wie ein Nutzer mit Ihrer Anwendung interagiert. Interaktionen werden durch Aktion/Reaktion-Paare definiert, die jeweils aus einer Nutzer-Aktion (Was muss der Nutzer tun, um eine bestimmte Systemantwort auszulösen?) und einer System-Reaktion (Wie antwortet das Projekt auf die Nutzer-Aktion?) bestehen. Jede im Projekt definierte Aktion ruft daher immer eine ganz spezifische Reaktion hervor. Sie können einem Element mehrere Interaktionen hinzufügen, z. B. eine Swipe-Geste auf ein Bild zeigt das nächste Bild an, während ein Tap auf ein Bild dieses vergrößert. Sie können außerdem Interaktionen anlegen, die mehrere Reaktionen beinhalten, beispielsweise einen Klang abspielen und gleichzeitig eine Systemmeldung anzeigen. Interaktionen können Sie sich als wenn-dann-Funktionen vorstellen, die definieren, wie Ihr Projekt auf bestimmte Nutzereingaben reagiert.

Interaktionen erstellen/hinzufügen

Um Ihrem Projekt Interaktionen hinzuzufügen, wählen Sie das Element aus, welches Sie interaktiv gestalten möchten. Öffnen Sie das Kontextmenü und wählen den „Interaktionen“-Tab aus. Klicken Sie nun auf die „Interaktion hinzufügen“-Taste.

Der Interaktionsdialog öffnet sich. Wählen Sie nun die Nutzer-Aktion aus dem "Wenn der Nutzer"-Dropdown und bestimmen Sie im „dann“-Dropdown die System-Reaktion genauer. Klicken Sie auf „Speichern“ um die Interaktion hinzuzufügen.

Sie können Ihre Interaktionen mit zusätzlichen Parametern verfeinern, z. B. mit

  • Richtungen,
  • Winkel,
  • Intensität,
  • Klickart,
  • Eigenschaften,
  • Fingeranzahl,
  • individuellen Klängen,
  • Animationen, oder
  • Verzögerungen.

Um mehrere Reaktionen hinzuzufügen, die auf eine Nutzer-Aktion folgen, nutzen Sie die Option „Reaktion hinzufügen“. Der Parameter „Verzögerung“ stellt eine Hilfe dar, wenn Sie eine Reaktionsabfolge oder Reaktionssequenzen erstellen wollen, zum Beispiel um eine Diashow zu simulieren.

Sie können Interaktionen zu bestimmten Elementen, wie z. B. Schaltflächen oder Bildern hinzufügen, welche die gewünschte Reaktion auslösen sollen. Wenn die Nutzer-Aktion keinem spezifischen Element zugeordnet werden soll (z. B. Kippen des Gerätes oder Ändern der Position), können Sie die Interaktion einer Seite zuordnen, von der aus sie aufgerufen werden kann. Wenn die gleiche Interaktion auf mehreren Seiten oder im gesamten Projekt verfügbar sein soll, fügen Sie die Interaktion zu einer (sonst leeren) Ebene hinzu, welche Sie auf allen gewünschten Seiten aktivieren können.

Hinweis: Um die einfache Interaktion „zeige Seite“ (oder „gehe zu Seite“) hinzufügen, können Sie die „Ziel“-Option im Kontextmenü des enstprechenden Elements als Abkürzung nutzen.

Verfügbare Nutzer-Aktionen und System-Reaktionen:

Hier finden Sie eine Liste aller verfügbaren Nutzer-Aktionen und System-Reaktionen und die entsprechend verfügbaren Parameter, die sie näher definieren:

Verfügbare Nutzer-Aktionen:

  • Klickt/tapt: Bestimmen Sie die Maustaste, welche der Nutzer klicken muss (Links- oder Rechtsklick) sowie die Anzahl der Finger.
  • Tapt und hält: Bestimmen Sie, wie lange der Nutzer mit seinen Fingern auf das ensprechende Element drücken und halten soll.
  • Hovert: Definieren Sie, ob der Nutzer das gewählte Element berühren oder verlassen soll.
  • eine Wisch-Geste macht (Swipe): Wählen Sie die Swipe-Richtung (links, rechts, hoch oder runter).
  • eine Pinch-Geste macht: Wählen Sie die Pinch-Richtung (nach innen, außen oder in jede Richtung).
  • den Standort ändert: Bestimmen Sie hier den GPS-Ort auf der Karte und definieren, ob der Nutzer diesen spezifischen Ort betreten oder verlassen soll.
  • eine Tastenkombination eingibt: Definieren Sie die-Taste oder-Tastenkombination, die zu drücken ist, um eine Reaktion auszulösen. Dies wird unter-Tastenfolge angezeigt. (Das Verwenden von mehreren-Tasten und/oder-Tastenkombinationen ist möglich.)
  • das Gerät dreht: Bestimmen Sie die Richtung, in welche das Gerät gedreht werden soll, d. h. entweder ins Hoch- oder Querformat.
  • das Gerät neigt: Definieren Sie die Richtung, in welche das Gerät gekippt werden soll (nach links, rechts, oben oder unten) sowie die die Kippbewegung (nach vorn oder hinten) und den Neigungswinkel des Geräts.
  • das Gerät schüttelt: Bestimmen Sie die Intensität (1 = leicht, 3 = stark) und die Dauer, die das Gerät geschüttelt werden soll.

Verfügbare System-Reaktionen:

  • zeige Seite: Um eine zusätzliche Seite anzuzeigen, wählen Sie, ob Sie einen Link mit oder ohne einem Refresh erstellen wollen und ob sich der Link in einem neuen-Tab öffnen soll oder ob ein Instant Link innerhalb des gleichen Frames erstellt werden soll. Animationen, wie zum Beispiel Überblenden oder Hineingleiten und Verzögerungen können auch hinzugefügt werden.
  • ändere Ebenen-Sichtbarkeit: Bestimmen Sie, ob der Header und/oder Footer sichtbar oder versteckt sein soll oder umgeschalten wird.
  • spiele einen Klang: Sie können hier einen Klang hochladen, der für eine bestimmte Dauer abgespielt wird.
  • gehe zurück (Browserverlauf)/gehe vorwärts (Browserverlauf): Mit dieser Reaktion können Sie in Ihrem Browserverlauf vor und zurück gehen.
  • zeige Systemmeldung: Schreiben Sie eine Nachricht, welche als Systemwarnung angezeigt wird.
  • zeige ein Overlay: Um ein Overlay hinzuzufügen, wählen Sie die gewünschte Seite aus dem Dropdown.
  • schließe letztes Overlay: Wenn Sie ein Overlay verwenden, können Sie diesen wieder schließen. Um dies zu tun, wählen Sie diese Reaktion und definieren den Zeitpunkt, wann es wieder geschlossen werden soll.
  • scrolle die Seite: Bestimmen Sie die Position (nach oben oder nach unten), die Scroll-Dauer (in Sekunden) und den Zeitpunkt, wann das automatische Scrollen Ihrer Seite beginnen soll.
  • schließe das Browserfenster: Um das Browserfenster zu schließen, definieren Sie die Verzögerung.

Hinweis: Sie können den Parameter „Verzögerung“ für jede System-Reaktion verwenden. Dies ist besonders hilfreich, wenn Sie mit einer Vielzahl von Reaktionen arbeiten, die Sie als chronologische Sequenz arrangieren wollen.

Interaktionen verwalten

Alle verfügbaren Interaktionen auf einer bestimmten Seite finden Sie im Meine Interaktionen-Panel. Hier finden Sie eine Übersicht aller Interaktionen auf einer Seite oder einer Ebene (Hinweis: Interaktionen, die Ebenen zugewiesen sind, werden nicht angezeigt, wenn Sie eine Seite wählen, auf der die Ebene verwendet wird, d. h. Sie müssen die entsprechende Ebene einzeln auswählen.), können Interaktionen kopieren, löschen, den Interaktionsdialog öffnen, um Interaktionen zu bearbeiten, und herauszufinden, welche Elemente mit einer bestimmten Interaktion verknüpft sind oder die gleiche Interaktion besitzen.

Hovern Sie über eine beliebige Interaktion in Meine Interaktionen, um zu sehen, welchem Element sie zugewiesen ist. Das entsprechende Element wird dann farblich hervorgehoben. Klicken Sie auf eine beliebige Interaktion, um den Interaktionsdialog zu öffnen und die gewählte Interaktion bearbeiten zu können.

Wenn zwei oder mehr Elemente sich eine Interaktion teilen, werden sie als Interaktionsgruppe in Meine Interaktionen dargestellt. Um alle Elemente zu finden, die die gleiche Interaktionen besitzen, wählen Sie ein Element mit der Interaktion, die Sie suchen, und klicken auf den „Alle finden“-Button select-all .

Sie können eine Interaktion auf andere Elemente kopieren, indem Sie das Element, das diese Interaktion bereits besitzt, und alle Elemente, die diese Interaktion erhalten sollen, auswählen. Dann klicken Sie auf den „Duplizieren“ Button not-applied-to-all und die Interaktion wird auf alle gewählten Elemente übertragen.

Interaktionen bearbeiten

Um eine existierende Interaktion zu bearbeiten, wählen Sie das zur Interaktion gehörige Element und öffnen dessen Kontextmenü. Wählen Sie den „Interaktionen”-Tab, um alle zum Element gehörigen Interaktionen zu sehen. Wählen Sie die Interaktion, welche Sie editieren möchten. Dies öffnet den Interaktionsdialog, sodass Sie nun die Interaktion editieren können. Um eine zuvor definierte Reaktion zu entfernen, benutzen Sie den „Löschen“-Button delete , welcher sich neben der entsprechenden Reaktion befindet. Klicken Sie einfach auf „Speichern“, um Ihre Änderungen zu speichern.

Nutzen Sie alternativ das Meine Interaktionen-Panel, um die Interaktionen zu öffnen, die Sie ändern wollen.

Interaktionen löschen

Um Interaktionen zu löschen, wählen Sie das Element, dem die Interaktion hinzugefügt wurde, und öffnen das Kontextmenü. Wählen Sie den-Reiter „Interaktionen“, um alle Interaktionen anzuzeigen, die zu diesem Element gehören. Klicken Sie auf den „Löschen“-Button klicken.

Öffnen Sie alternativ den Meine Interaktionen-Panel und klicken auf der Interaktion, die Sie löschen möchten, den „Löschen“-Button delete . Hinweis: Löschen Sie ein Element, so werden auch alle zugehörigen Interaktionen gelöscht.

Interaktionen simulieren

Interaktionen können Sie entweder in Ihrem Webbrowser (z. B. auf Ihrem PC) oder auf Ihrem Mobilgerät (z. B. mittels der Pidoco App) simulieren.

Um Interaktionen in Ihrem Webbrowser zu simulieren, klicken Sie auf die „Simulieren“-Taste icon-simulation . Die Simulation wird dann in einem neuen Browser-Fenster geöffnet. Um Touchgesten, Gerätebewegungen oder Standortsänderungen zu simulieren, hovern Sie mit Ihrer Maus über das entsprechende Element oder die Seite und klicken auf das dazugehörige Symbol, das oberhalb des Elements angezeigt wird.

Um Interaktionen auf Ihrem Mobilgerät zu simulieren, laden Sie sich die Pidoco App von iTunes oder aus dem Play Store herunter, loggen sich mit Ihren Pidoco-Anmeldedaten ein und öffnen das gewünschte Projekt, indem Sie diesen aus der angezeigten Projektliste wählen. Alternativ können Sie das Projekt auch per E-Mail teilen, indem Sie die Funktion „Einladungs-E-Mail zur 'Mobile App' versenden“ wählen. Klicken Sie auf den Link und das Projekt öffnet sich sofort in der App, ohne dass Sie sich einloggen müssen.

Hinweis: Die Pidoco App ist nur zur Ansicht und Simulation der Projekte auf mobilen Geräten vorgesehen. Eine Bearbeitung der Projekte ist mit unserer App nicht möglich. Um dies zu tun, melden Sie sich auf pidoco.com an, bearbeiten das Projekt dort und laden die App neu.

<< zurück zur Übersicht

Newsletter Anmeldung

Das neue Pidoco kommt im Herbst 2018. Abonnieren Sie jetzt unseren Newsletter um rechtzeitig informiert zu werden.

Keine Sorge, wir nutzen Ihre Email nur für den Versand relevanter News. Kein Spam. Versprochen.