Zum Hauptinhalt springen
Bildauswahl

Füge Eingaben mit vordefinierten Optionen und Icons und Bildern hinzu.

Heyflow avatar
Verfasst von Heyflow
Vor über einer Woche aktualisiert

Mit dem Bildauswahl-Block kannst du eine Reihe von vordefinierten Antworten für deine Fragen angeben. Dieser Block ist ähnlich wie die Mehrfachauswahl, bietet dir aber die Möglichkeit, Icons und Bilder zu einer Antwort hinzuzufügen.


Hinzufügen der Bildauswahl

  1. Im Tab Blöcke gehe zu Eingabe und ziehe den Bildauswahl-Block in deinen Heyflow

  2. Passe die Einstellungen wie z.B. Navigation nach Bedarf an

  3. Ändere das Icon der Optionen oder lade ein eigenes Bild hoch

  4. Füge ein Systemlabel hinzu, um sicherzustellen, dass du die Daten auf sinnvolle Weise weiterverarbeitest.

  5. Publiziere deinen heyflow und schon bist du startklar!

[video-to-gif output image]


Änderungsoptionen

In der Inhaltsspalte kannst du weitere Informationen oder Hinweise geben. Du kannst weitere Optionen hinzufügen, indem du auf die Schaltfläche + Neue Option klickst, und ordne die vorhandenen Optionen neu an, indem du die sechs Punkte, ganz rechts von jeder Auswahl, gedrückt hältst.

Füge jeder Option ein Label und eine Variable hinzu, um eine einfache Auswertung und Weiterverarbeitung deiner Antworten zu gewährleisten. Dies kann besondern sinnvoll sein, wenn du Berechnungen nutzen möchtest.

Darüber hinaus kannst du die Anzahl der angezeigten Optionen in jeder Zeile anpassen, indem du die Spalten im Bereich Aussehen anpassen. Du kannst bis zu fünf Optionen auswählen, die in einer Zeile angezeigt werden sollen. Dies kann ein wichtiges Hilfsmittel sein, für die bestmögliche Gestaltung deines Flows.


Konditionale Logik

Mit der Bildauswahl kannst du unser Tool der konditionalen Logik nutzen. Dieses Tool ermöglicht es dir, spezielle, differenzierte Pfade zu schaffen, je nachdem welche Antworten deine Kund:innen wählen. So werden deine Kund:innen auf die für sie zugeschnittenen Fragen geleitet und müssen keine für sie irrelevanten Fragen beantworten. Ebenfalls hilft dir das Tool, deinen Flow schlank zu halten, sodass du keine doppelten Screens platzieren musst. Hier erfährst du mehr zur konditionalen Logik.


Design der Bildauswahl

Es gibt mehrere Möglichkeiten, den Block noch mehr als oben beschrieben anzupassen. Gehe einfach auf die Registerkarte Design und beginne mit der Arbeit an den Presets. Bei manchen Plänen kannst du sogar noch tiefer in alle Bereiche von Design und Aussehen eintauchen. Wenn du an den Presets arbeitest, kannst oben in den Bereich Styles gehen und jedes kleine Detail der einzelnen Bereiche bearbeiten.


Bearbeitungsoptionen

Allgemein

  • Auswahl: Wähle zwischen Einfach und Mehrfach um zu bestimmen, ob eine einzelne Antwort oder mehrere Antworten per Klick möglich sein sollen.

  • Sensitiv: Wenn aktiviert, werden die Werte nicht in unserer Datenbank gespeichert (mehr Informationen hier).

  • Benötigt: Wenn aktiviert, müssen deine User eine Auswahl treffen, bevor sie im Flow weiter klicken können.

Navigation

  • Navigation: Wähle die Aktion, die auf den Klick auf eine der Optionen geschieht. Dafür sollte Navigiere beim Klicken einer Option aktiviert sein. Ansonsten wird erst bei Klick auf den Weiter Button (o.ä.) die Navigation ausgelöst. Navigiere zum nächsten Screen deines Flows oder gehe zu einem spezifischen Screen deines Flows. Oder definiere konkrete Regeln für die Navigation, die auf die Eingabe der Nutzer:in reagieren. Alternativ kannst du keine Aktion auswählen.

  • Navigiere beim Klicken einer Option: Die Navigation wird sofort per Klick und ohne den Klick auf einen Button ausgelöst. Erfahrungshalber empfiehlt sich dennoch das Platzieren eines Buttons (mehr Informationen zu unseren Best Practices hier).

Abstand

  • Breite: Hierüber kannst du die maximale Ausbreitung des Blockes anpassen und zwischen S, M, L und maximaler Breite auswählen.

  • Oben, Unten, Links und Rechts: Über diese Optionen kannst du den Abstand zu allen Seiten festlegen. Verwende hierzu entweder den Schieberegler oder lege die genaue Pixelanzahl fest.

Aussehen

  • Sichtbarkeit: Hierüber kannst du auswählen, ob der Block nur in der mobilen bzw. Desktop Version angezeigt wird oder diesen gänzlich verstecken.

  • Hintergrundfarbe: Du kannst du eine Farbe auswählen, die als Hintergrund für den Block genutzt wird.

  • Label ausrichten: Wähle, ob dein zuvor gewähltes Label linksbündig, mittig oder rechtsbündig, über der Mehrfachauswahl, platziert ist.

  • Optionen ausrichten: Anwendbar, wenn die Optionen nicht gleichmäßig auf alle Zeilen verteilt sind (z. B. 3 Optionen in der ersten Zeile und 2 Optionen in der zweiten Zeile). Dies gilt dann für die Optionen in der letzten Zeile.

  • Spalten (Desktop): Lege fest, wie viele Spalten in einer Zeile auf dem Desktop angezeigt werden sollen.

  • Spalten (Mobil): Lege fest, wie viele Spalten in einer Zeile auf dem Smartphone angezeigt werden sollen.

  • Zeile 2 anzeigen: Fügt bei allen Optionen eine weitere Zeile unterhalb des Labels hinzu.

  • Vorauswahl: Bestimme, dass einige Optionen vorausgewählt sind, wenn die Nutzer:in diesen Screen erreicht.

Labels & Variablen

  • System Label: Lege ein System Label für den gesamten Block fest.

  • Variable: Siehe Variable.

  • System Label: Lege zusätzlich ein System Label für jede einzelne Option des Blocks fest.

Min & Max

  • Bedingung: Wähle eine und/oder zwei Bedingungen für die Anzahl an benötigten ausgewählten Optionen. Du kannst sowohl die Mindestanzahl als auch die maximale Anzahl an Optionen festlegen.

Tracking

  • Tracking aktiviert: Wenn aktiviert, kannst du jeder Option einen Event Namen geben, der an deine anderen integrierten Tracking-Tools, wie z.B. Google Analytics, gesendet wird. Mehr Informationen zu Tracking findest du hier.

Hat dies deine Frage beantwortet?