Flows bauen

Diese Seite beschreibt alle Gesten, die der Editor beim Erstellen eines Flows unterstützt: Schritte hinzufügen, bearbeiten, entfernen und anordnen. Sie gilt für den auf der Flow-Karte eingebetteten Editor sowie für den großen Editor — beide sind bearbeitbare Zeichenflächen.

Ein Flow ist bearbeitbar, solange sein Status Entwurf ist. Wenn du versuchst, einen veröffentlichten Flow zu bearbeiten, legt der Editor automatisch eine Entwurfsversion für dich an und wechselt die Seite auf diesen Entwurf — danach kannst du ganz normal weiterarbeiten.

Aufbau eines Schritts

Jeder Schritt auf der Zeichenfläche wird als quadratischer Block dargestellt mit:

• einem Symbol in der Mitte, das den Aktionstyp repräsentiert.
• einer Beschreibung darunter (maximal drei Zeilen), die du in der Schritt-Konfiguration vergibst.
• einem kleinen Entfernen-Button (×) oben rechts. Dieser Button erscheint nur beim Hovern über dem Schritt.
• einem kleinen Hinzufügen-Button (+) an der rechten Kante. Dieser Button taucht am letzten Schritt jeder Sequenz auf, damit du den Flow erweitern kannst.

Manche Schritte sind Gruppen — sie enthalten Zweige (zum Beispiel ein Entscheidungsschritt mit ja- und nein-Pfad). Gruppen haben dasselbe Symbol und dieselbe Beschreibung, und zusätzlich gehen von ihnen Verbindungen nach unten in die jeweiligen Zweige ab.

Neuen Schritt hinzufügen

Es gibt drei Stellen, an denen du einen Schritt hinzufügen kannst. In allen drei Fällen öffnet der Klick auf den +-Button einen Auswahldialog, in dem du den Schritt-Typ wählst — danach landest du direkt in der Konfiguration des neuen Schritts.

• Am Ende einer Sequenz. Hovere den letzten Schritt; an seiner rechten Kante erscheint ein grüner +-Button. Ein Klick darauf hängt einen neuen Schritt an.
• Zwischen zwei bestehenden Schritten. Hovere die Verbindungslinie zwischen ihnen — die Linie hebt sich hervor und in ihrer Mitte taucht ein grüner +-Button auf. Ein Klick fügt dort einen Schritt ein.
• In einen leeren Zweig. Eine Gruppe mit einem noch leeren Zweig zeigt einen gestrichelten Platzhalter-Block mit einem großen + in der Mitte an. Klicke auf den Platzhalter, um den ersten Schritt dieses Zweigs anzulegen. Bei einem nicht-leeren Zweig fügst du genauso wie zwischen zwei anderen Schritten über die eingehende Verbindungslinie einen weiteren Schritt ein.

Schritt bearbeiten

Klicke einen Schritt einmal an, um seine Konfigurationskarte zu öffnen. Wenn die Karte geschlossen wird, übernimmt die Zeichenfläche die vorgenommenen Änderungen (Beschreibung, Parameter usw.) und zeichnet den Schritt neu.

Schritt entfernen

Hovere den Schritt, den du entfernen möchtest; oben rechts erscheint ein kleiner roter ×-Button. Ein Klick entfernt den Schritt. Alle Verbindungen, die in den Schritt hinein- oder herausgingen, werden automatisch wieder zusammengeführt.

Schritte anordnen

Der Editor startet jeden Flow mit einem automatischen Layout, das Schritte von links nach rechts entlang des Ausführungspfads anordnet und Zweige vertikal unter ihrer Eltern-Gruppe stapelt. Dieses Auto-Layout ist für die meisten Flows gut genug, aber du kannst die Anordnung jederzeit von Hand feinjustieren.

• Ziehe einen Schritt an eine neue Position. Die neue Position wird sofort gespeichert, sodass sie bestehen bleibt, wenn du andere Schritte hinzufügst oder entfernst.
• Ziehst du eine Gruppe, wandern ihre Kinder mit und behalten dabei ihre relative Anordnung innerhalb des Zweigs.
• Doppelklicke einen Schritt, um seine Position zurück in den automatisch berechneten Slot zu setzen. Das ist der schnellste Weg, ein versehentliches Verschieben rückgängig zu machen. Doppelklick auf eine Gruppe setzt die gesamte Gruppe zurück — die Kinder folgen mit derselben Delta-Verschiebung, damit das innere Layout relativ zum Gruppen-Kopf erhalten bleibt.

Da auch jede automatisch gesetzte Position gespeichert wird, fügt sich ein frisch hinzugefügter Schritt neben seinen Nachbarn ein, ohne den gesamten Flow neu zu sortieren. Würden zwei automatisch platzierte Schritte übereinander landen, schiebt der Editor das explizit platzierte Geschwister nur so weit zur Seite, wie nötig ist.

Verbindungen und Zweige

Du zeichnest die Verbindungen nicht selbst — sie ergeben sich aus der Struktur des Flows. Sequenziell aufeinanderfolgende Schritte werden von links nach rechts über ihre seitlichen Handles verbunden. Gruppen haben zusätzlich ein Handle an der Unterseite, das in jeden ihrer Zweige führt; die Zweig-Bezeichnung (ja, nein, usw.) schwebt über dieser Verbindung, damit du auf einen Blick erkennst, welcher Pfad welcher ist.

Wenn du einen Schritt in einen bestimmten Zweig einfügen möchtest, nimm dazu den +-Button oder den Ghost-Platzhalter aus Neuen Schritt hinzufügen — "nach der Gruppe" hinzufügen würde den Schritt hinter der Gruppe als Ganzes platzieren, nicht in einen ihrer Zweige.