Eine Umfrage erstellen
Die Benutzeroberfläche ist in mehrere Registerkarten unterteilt. Die weitere Anleitung beschreibt die Möglichkeiten der einzelnen Registerkarte von links nach rechts.

Registerkarte „Designer“
Auf der Registerkarte „Designer“ können Sie Ihre Umfrage konfigurieren. Sie können Fragen und Bereiche aus der Toolbox per Drag & Drop auf die Entwurfsoberfläche (Design Surface) ziehen und dann das Eigenschaftenraster (Property Grid) verwenden, um die Fragen-, Bereichs- und Umfrageeinstellungen zu ändern.

Im weiteren Verlauf stellen wir Ihnen zunächst die 21 Frage- und Paneltypen vor. Anschließend erklären wir in 6 Vorgehensweisen, wie Sie mit wenigen Klicks die Umfrage optisch, inhaltlich und redaktionell optimieren.
Frage- und Paneltypen
Die Toolbox enthält die folgenden 21 Frage- und Paneltypen:
1. Optionsfeldgruppe (Radio Button)
Die Befragten verwenden Optionsfelder, um eine einzelne Antwort auszuwählen. Verwenden Sie den Typ „Optionsfeldgruppe“ für Fragen, die mehrere Optionen haben, aber nur eine Antwort akzeptieren.

2. Bewertungsskala (Rating Scale)
Die Befragten wählen eine Zahl innerhalb eines Bereichs aus. Verwenden Sie den Typ „Bewertungsskala“, wenn die Befragten eine Bewertung abgeben sollen.

Vorgehensweise: Verwenden Sie grafische Symbole ( Sterne, Emojis ) für Kurswerte.
Erweitern Sie die Kategorie Kurswerte und wählen Sie den gewünschten Kurstyp aus.

Alternativ können Sie den Kurstyp mithilfe eines Adorners direkt auf der Entwurfsoberfläche ändern:

3. Kontrollkästchen (Checkboxes)
Die Befragten klicken auf ein oder mehrere Kontrollkästchen, um Antworten auszuwählen. Verwenden Sie den Kontrollkästchentyp für Fragen, die mehrere Antworten zulassen.

4. Dropdown
Die Befragten wählen eine einzelne Antwort aus einer Dropdown-Liste aus. Wie die Optionsfeldgruppe kann der Dropdown-Typ für Fragen verwendet werden, die mehrere Optionen haben, aber nur eine Antwort akzeptieren. Die Dropdown-Benutzeroberfläche kann jedoch mehr Optionen anzeigen und nimmt dabei weniger Platz auf dem Bildschirm ein.

5. Dropdown-Menü mit Mehrfachauswahl
Die Befragten können eine oder mehrere Antworten aus einer Dropdown-Liste auswählen. Im Gegensatz zu einem einfachen Dropdown -Fragetyp können die Befragten bei der Dropdown-Liste mit Mehrfachauswahl mehrere Antworten auswählen.

6. Ja/Nein (Boolscher Editor)
Die Befragten schalten einen Booleschen Editor auf „Ja“ oder „Nein“.
Die Antwort wird in den Umfrageergebnissen als true für „Ja“ oder false für „Nein“ gespeichert.

7. Datei-Upload
Verwenden Sie den Datei-Upload-Typ, um den Befragten das Hochladen von Dateien (zum Beispiel für Hausaufgaben) zu ermöglichen. Die Befragten ziehen eine oder mehrere Dateien per Drag & Drop in den dafür vorgesehenen Bereich oder wählen Dateien im Dialogfenster „Datei hochladen“ des Browsers aus. Die hochgeladenen Dateien werden als Base64-codierte Zeichenfolgen in den Umfrageergebnissen (unter „Details“) gespeichert.

- Wie Sie die Formate für hochgeladene Dateitypen einschränken
Der Dateiuploadtyp basiert auf dem Standard<input type="file">HTML-Element. Um Dateitypen einzuschränken, verwendet das Standardelement dasaccept-Attribut. Geben Sie seinen Wert in das Feld Akzeptierte Dateitypen in der Kategorie Allgemein ein:

Beschränken Sie immer die zulässigen Dateitypen, um mögliche Sicherheitslücken zu vermeiden.
- Vorgehensweise: Aktivieren der Mehrfachauswahl von Dateien
Erweitern Sie die Kategorie „Allgemein“ und wählen Sie „Mehrere Dateien zulassen“ aus:

8. Bildauswahl
Die Befragten wählen ein oder mehrere Bilder oder Videos aus einer Serie aus. Ein mit diesem Bild oder Video verknüpfter Wert wird in den Umfrageergebnissen gespeichert.

- Vorgehensweise: Werte mit Bildern oder Videos verknüpfen
Erweitern Sie die Kategorie „Choices“ (Auswahlmöglichkeiten) und geben Sie die Werte in die Tabelle „Auswahlmöglichkeiten“ ein:

- Vorgehensweise: Aktivieren der Mehrfachauswahl für Bilder oder Videos.
Erweitern Sie die Kategorie „Allgemein“ und wählen Sie „Mehrfachauswahl zulassen“ aus:

9. Ranglisten
Die Befragten ziehen Elemente aus einer Liste per Drag & Drop, um sie nach Rangfolge oder Präferenz neu anzuordnen. Verwenden Sie den Rangfolgetyp für Fragen, bei denen die Befragten die Reihenfolge der Elemente festlegen müssen.

10. Einzeilige Eingabe
Die Befragten geben ihre Antworten in Textform, als Zahlen oder mit Datum und Uhrzeit in einen einzeiligen Editor ein. Verwenden Sie den einzeiligen Eingabetyp für Fragen, die kurze Antworten erfordern.

11. Langer Text
Die Befragten geben ihre ausführliche Antwort in einen mehrzeiligen Textbereich mit anpassbarer Größe ein. Verwenden Sie den Typ „Langer Text“ für offene Fragen, die mehrzeilige Antworten akzeptieren.

12. Mehrere Textfelder
Die Befragten geben ihre Antworten in mehrere einzeilige Texteditoren ein. Verwenden Sie den Typ „Mehrere Textfelder“ für offene Fragen, die mehr als eine kurze Antwort erfordern.

13. Bedienfeld
Der Panel-Typ ist ein Container für andere Fragen und Panels. Verwenden Sie diesen Typ, um mehrere Fragen oder Panels zu gruppieren und gemeinsam zu steuern.
14. Dynamisches Panel
Der Typ „Dynamisches Panel“ ist ein Vorlagenpanel, das mehrere Fragen enthalten kann. Befragte können Panels basierend auf der Vorlage hinzufügen und entfernen.

15. Einzelauswahlmatrix
Beim Matrixtyp „Einzelauswahl“ werden Optionsfelder in Zeilen und Spalten angezeigt. Die Befragten können in jeder Zeile nur ein Optionsfeld auswählen.

- Vorgehensweise: Neue Zeilen hinzufügen
Erweitern Sie die Kategorie Zeilen und klicken Sie auf Neu hinzufügen :

- Vorgehensweise: Zeilen zufällig anordnen
Erweitern Sie die Kategorie „Zeilen“ , suchen Sie den Zeilenreihenfolge- Editor und ändern Sie ihn in „Zufällig“:

16. Mehrfachauswahlmatrix
Die Befragten verwenden diese Editoren, um in jeder Zelle einen gewünschten Wert auszuwählen. Das folgende Bild veranschaulicht den Multi-Select-Matrixtyp mit den standardmäßigen Dropdown-Editoren:

Vorgehensweise: Ändern des Editortyps
Erweitern Sie die Kategorie „Allgemein“ und wählen Sie den gewünschten Editortyp aus dem Dropdown-Menü „Zellentyp“ aus:

17. Dynamische Matrix
Der dynamische Matrixtyp ähnelt einer Mehrfachauswahlmatrix , aber die Befragten können Matrixzeilen hinzufügen und entfernen.

18. HTML
Verwenden Sie den HTML-Typ, um Text nach Bedarf zu formatieren, Links einzufügen und Medien oder andere benutzerdefinierte Elemente in die Umfrage einzufügen. Dieser Typ wird nur für die Präsentation verwendet und erzeugt keinen Wert, der in den Umfrageergebnissen gespeichert werden kann. Beachten Sie, dass HTML-Inhalte anfällig für Sicherheitsverletzungen sein können. Stellen Sie sicher, dass die von Ihnen eingefügten Links zu vertrauenswürdigen Ressourcen führen.
19. Ausdruck
Verwenden Sie den Ausdruckstyp, um Werte zu berechnen und sie den Befragten zu präsentieren. Sie können beispielsweise die Punktzahlen vorheriger Antworten zusammenfassen oder einen Durchschnittswert ermitteln. Der berechnete Wert wird in den Umfrageergebnissen gespeichert.
Hier drei konkrete Beispiele, wie der Ausdruckstyp als vielseitiges Werkzeug genutzt werden kann, um dynamische Inhalte oder berechnete Ergebnisse in einen Fragebogen einzufügen:
Beispiel 1: Zusammenfassung von Antworten (Punktzahl)
- Szenario: Sie erstellen einen Quiz- oder Test-Fragebogen und möchten am Ende die Gesamtpunktzahl anzeigen, die der Befragte basierend auf seinen Antworten erzielt hat.
- Umsetzung:
- Sie fügen Fragen hinzu, die eine numerische Bewertung (z. B. 1–5 Punkte) liefern.
- Der Ausdruckstyp summiert die Punkte mit einer Formel wie {Frage1} + {Frage2} + {Frage3}.
- Nutzen: Der Befragte sieht sofort seine Gesamtergebnisse, was die Interaktivität erhöht und den Test attraktiver macht.
Beispiel 2: Anzeige des aktuellen Datums und der Uhrzeit
- Szenario: Sie möchten den Befragten zeigen, wann genau sie die Umfrage abgeschlossen haben (z. B. für Audit-Zwecke oder als Zeitstempel).
- Umsetzung:
- Der Ausdruckstyp verwendet eine Systemvariable wie {currentDate} oder {currentDateTime}.
- Diese wird automatisch berechnet und angezeigt, sobald der Befragte die Umfrage ausfüllt.
- Nutzen: Sie dokumentieren die Teilnahmezeit, was bei Compliance-Fragebögen oder in Schulungstests wichtig sein kann.
Beispiel 3: Dynamische Textpersonalisierung (z. B. Name + Anrede)
- Szenario: Sie möchten den Fragebogen persönlicher gestalten, indem Sie den Befragten mit seinem vollständigen Namen ansprechen.
- Umsetzung:
- Der Fragebogen enthält Felder wie {Vorname} und {Nachname}, die der Teilnehmer ausfüllt.
- Der Ausdruckstyp kombiniert diese Werte: „{Vorname} {Nachname}“.
- Sie können diesen kombinierten Namen im weiteren Verlauf des Fragebogens verwenden, um den Text persönlicher zu gestalten.
- Nutzen: Dies schafft eine ansprechendere Nutzererfahrung und kann das Engagement erhöhen.
In der folgenden Abbildung verkettet der Ausdruckstyp Vor- und Nachnamen, um einen vollständigen Namen anzuzeigen:

Um einen Ausdruck anzugeben, geben Sie ihn in das Feld Ausdruck in der Kategorie Allgemein ein . Ihr Ausdruck kann auf andere Umfragefragen verweisen (z. B. {question1} + {question2}) oder integrierte Berechnungsfunktionen verwenden.
20. Bild
Verwenden Sie den Bildtyp, um der Umfrage ein Bild oder Video hinzuzufügen. Dieser Typ wird nur zur Präsentation verwendet und erzeugt keinen Wert, der in den Umfrageergebnissen gespeichert werden kann.
21. Unterschrift
Die Befragten verwenden Maus- oder Touch-Gesten, um ihre Unterschrift in den zugewiesenen Eingabebereich zu zeichnen. Verwenden Sie diesen Typ, um die Unterschrift des Befragten oder andere handgezeichnete Eingaben zu erhalten.

- Vorgehensweise: Größe des zugewiesenen Bereichs ändern.
Erweitern Sie die Kategorie „Allgemein“ und ändern Sie die Werte für „Breite“ und „Höhe“:

Sie können auch ein Bild in den Hintergrund laden. Im Fragebogen dürfen Befragte dann Freihand-Markierungen vornehmen oder fehlerhafte Bereiche kennzeichnen.
- Vorgehensweise: Bildformat ändern
Die Eingabe des Befragten wird als base64-kodiertes Bild in einem der folgenden Formate gespeichert: PNG, JPEG, SVG. Um das gewünschte Format auszuwählen, verwenden Sie das Dropdown-Menü Bildformat in der Kategorie Allgemein:

- Anleitung: Stiftfarbe ändern
Erweitern Sie die Kategorie „Allgemein“ und wählen Sie im Dropdown-Menü „Stiftfarbe“ die gewünschte Farbe aus:

Vorgehensweisen
1. Verschönerer (Adorner)
Verschönerer sind Entwurfsoberflächensteuerelemente zur Aufwertung von Umfrageelementen. Verwenden Sie Verschönerer, um UI-Text direkt zu bearbeiten, Auswahlmöglichkeiten neu anzuordnen, Elemente zu duplizieren und zu löschen, anzugeben, ob eine Antwort erforderlich ist, und andere Aktionen für Umfrageelemente auszuführen. Einstellungen, die Sie mithilfe von Adornern angeben, werden mit Einstellungen im Eigenschaftenraster synchronisiert und umgekehrt.
Jeder Elementtyp verfügt über einen zugehörigen Satz von Verschönerern. Das folgende Bild hebt Adorner für eine Dropdown -Frage hervor:

2. Hinzufügen einer Frage zur Umfrage
Ziehen Sie den gewünschten Fragentyp per Drag & Drop aus der Toolbox auf die Entwurfsoberfläche. Alternativ können Sie auf die Schaltfläche Frage hinzufügen klicken, um eine Frage mit einzeiliger Eingabe hinzuzufügen . Diese Schaltfläche zeigt auch ein Auslassungssymbol an, mit dem Sie den Typ der eingefügten Fragen ändern können.

3. Angeben von Standardantworten
Erweitern Sie die Kategorie „Daten“ und klicken Sie auf „Standardantwort festlegen“ , um das Popup-Fenster „Standardantwort“ zu öffnen. Geben Sie die Standardantworten ein oder wählen Sie sie aus und klicken Sie auf „ Übernehmen“ :

4. Hinzufügen einer Seite zur Umfrage
Wählen Sie im Eigenschaftenraster „Umfrage“ aus , erweitern Sie die Kategorie „Seiten“ und klicken Sie im Seiteneditor auf die Schaltfläche „Neu hinzufügen“ :

Alternativ können Sie eine Seite auf der Entwurfsoberfläche hinzufügen. Die Oberfläche zeigt unten das Grundgerüst einer neuen Seite an. Um eine neue Seite hinzuzufügen, müssen Sie ihr eine Frage hinzufügen .
5. Ändern des Fragentyps
Verwenden Sie in der Frage den Elementtyp-Selektor:

Einige Fragetypen sind nicht austauschbar. Eine Dropdown -Frage unterstützt beispielsweise Auswahlmöglichkeiten, eine einzeilige Eingabe hingegen nicht. Wenn Sie den Fragetyp von Dropdown auf einzeilige Eingabe umstellen, gehen Ihre Auswahlmöglichkeiten verloren. In diesem Fall können Sie auf die Schaltfläche Rückgängig (Undo) klicken , um die vorherige Konfiguration wiederherzustellen:

6. Löschen der Umfrage
Klicken Sie in der Symbolleiste auf die Schaltfläche „Umfrage löschen“ :

Registerkarte „Vorschau“
Auf der Registerkarte „Vorschau“ können Sie die Umfrage als Teilnehmer anzeigen und daran teilnehmen.

Vorgehensweise: Erneutes Ausführen der Vorschau
Nachdem Sie die Umfrage in der Vorschau abgeschlossen haben, können Sie die Umfrageergebnisse im Tabellen- oder JSON-Format sehen. Klicken Sie über den Ergebnissen auf die Schaltfläche „Testumfrage wiederholen“, um die Umfrage erneut in der Vorschau anzuzeigen:

Vorgehensweise: Vorschau der Umfrage auf verschiedenen Geräten
Klicken Sie auf das Gerätesymbol (Device) und wählen Sie das gewünschte Gerät aus dem Dropdown-Menü aus. Sie können auch auf das Ausrichtungssymbol (Orientation) klicken , um zwischen Quer- und Hochformat zu wechseln:

Registerkarte „Logik“
Auf der Registerkarte „Logik“ werden logische Regeln angezeigt und können bearbeitet werden, die den Umfrageablauf festlegen.

Vorgehensweise: Hinzufügen einer neuen Regel
Klicken Sie unten auf der Registerkarte „Logik“ auf „ Neue Regel hinzufügen“, um Editoren anzuzeigen, mit denen Sie Bedingungen angeben und Aktionen auswählen können, die ausgeführt werden sollen, wenn diese Bedingungen erfüllt sind.
Bedingungen festlegen (if-Klauseln)
Wählen Sie eine Frage aus (Question name), deren Antwort überprüft werden soll, und eine logische Operation aus den entsprechenden Dropdown-Menüs (Logical operation). Geben Sie dann die Antwort (Answer) an, auf die die Regel angewendet wird. Einige logische Operationen erfordern keine Antwort (z. B. Leer oder Nicht leer).

Wenn die Regel mehr als eine Bedingung erfordert, klicken Sie auf die Schaltfläche Bedingung hinzufügen. Sie können den logischen Operator AND oder OR verwenden, um die neue und die vorherige Bedingung zu kombinieren.

Bedingungen, die Sie in der Benutzeroberfläche angeben, werden in logische Ausdrücke umgewandelt. Wenn Sie die Ausdrücke lieber direkt eingeben möchten, klicken Sie in der Symbolleiste auf die Schaltfläche „Manuelle Eingabe“ .

Geben Sie die Aktion an (Then-Klausel)
Wählen Sie eine der folgenden Aktionen aus dem Dropdown-Menü:
- Seite anzeigen (ausblenden): Macht die ausgewählte Seite sichtbar. Wenn Sie die Seite ausblenden möchten, kehren Sie die Logik Ihrer Bedingung um.
- Seite aktivieren (deaktivieren): Macht die ausgewählte Seite editierbar. Wenn Sie die Seite schreibgeschützt machen möchten, kehren Sie die Logik Ihrer Bedingung um.
- Frage anzeigen (ausblenden): Macht die ausgewählte Frage sichtbar. Wenn Sie die Frage ausblenden möchten, kehren Sie die Logik Ihrer Bedingung um.
- Frage aktivieren (deaktivieren): Macht die ausgewählte Frage bearbeitbar. Wenn Sie die Frage schreibgeschützt machen möchten, kehren Sie die Logik Ihrer Bedingung um.
- Frage als erforderlich markieren: Erfordert eine Antwort auf die ausgewählte Frage.
- Umfrage abschließen: Schließt die Umfrage ab.
- Antwort festlegen: Legt eine bestimmte Antwort auf die ausgewählte Frage fest.
- Antwort kopieren: Kopiert die Antwort der ausgewählten Frage in eine Zielfrage.
- Zur Frage springen: Navigiert die Umfrage zur ausgewählten Frage.
- Ausdruck ausführen: Führt einen benutzerdefinierten Ausdruck für die ausgewählte Frage aus.
- Seitenmarkierung „Umfrage abgeschlossen“ festlegen: Gibt benutzerdefinierte HTML-Markup für die Seite „Umfrage abgeschlossen“ an.
Vorgehensweise: Bearbeiten einer Regel
Klicken Sie auf eine Regel, um sie zu erweitern, und verwenden Sie UI-Elemente, um die Regel zu bearbeiten. Klicken Sie auf „Fertig“ , um Ihre Änderungen zu speichern.
Vorgehensweise: Filterregeln
Verwenden Sie den Fragenfilter, um Regeln nach einer bestimmten Frage zu filtern. Sie können auch den Aktionstypfilter verwenden, um nur Regeln für den ausgewählten Aktionstyp anzuzeigen:

Registerkarte „JSON-Editor“
Umkehrfunktion: Vom Designer zum JSON-Code
Alle im Designer erstellten oder bearbeiteten Umfragen werden automatisch in eine valide JSON-Struktur übersetzt.
Diese Funktion ermöglicht es, die im visuellen Editor konfigurierten Inhalte auch auf Codeebene zu prüfen, zu sichern oder weiterzuverwenden.
Der exportierte JSON-Code kann vielseitig eingesetzt werden:
- Archivierung und Versionierung: Speichern Sie Umfragen extern, um sie später erneut zu laden oder zu vergleichen.
- Wiederverwendung in anderen Projekten: Kopieren Sie vollständige JSON-Strukturen in neue Umfragen oder übertragen Sie sie auf andere Mandanten.
- Integration in externe Systeme: Verwenden Sie den Code zur Einbindung in SurveyJS Studio, Power BI, APIs oder LMS-Schnittstellen.
- KI-gestützte Anpassungen: Kombinieren Sie vorhandene JSON-Strukturen mit Prompts, um bestehende Umfragen automatisch erweitern oder modifizieren zu lassen.
Der JSON-Editor dient damit nicht nur zur Erstellung, sondern auch als bidirektionales Werkzeug:
Er verbindet den grafischen Designer mit der Codeebene und sorgt dafür, dass jede Umfrage technisch transparent, portabel und langfristig wiederverwendbar bleibt. Sie Ihr Ziel, und die KI erzeugt eine startklare Konfiguration.

Registerkarte „Designs“ (in Entwicklung; noch nicht verfügbar)
Auf der Registerkarte „Designs“ können Sie das angewendete UI-Design anpassen. Sie können Farben, Größen, Schriftarten, Schatteneffekte und andere Parameter für das Erscheinungsbild der Umfrage in einer benutzerfreundlichen Oberfläche ändern.

Vorgehensweise: Speichern eines benutzerdefinierten Designs
Umfragen-Designs sind JSON-Objekte mit CSS-Variablen und anderen Designeinstellungen. Wenn Sie mit der Anpassung fertig sind, klicken Sie auf die Schaltfläche „Exportieren“, um ein JSON-Objekt mit Ihrem benutzerdefinierten Design herunterzuladen.

Wenn Sie bereits über eine JSON-Designdatei verfügen und mit der Designanpassung fortfahren möchten, klicken Sie auf die Schaltfläche „Importieren“ und wählen Sie die Datei aus, die in Survey Creator geladen werden soll.

Andere Funktionen hängen von den von Ihrem Entwicklungsteam implementierten Features ab.
Registerkarte „Übersetzung“
Auf der Registerkarte „Übersetzung“ werden die Umfragezeichenfolgen angezeigt und Sie können sie in verschiedene Sprachen übersetzen.

Vorgehensweise: Hinzufügen einer weiteren Sprache
Klicken Sie in der Seitenleiste „Spracheinstellungen“ auf das Symbol „ Hinzufügen “ und wählen Sie im Popup-Menü die gewünschte Sprache aus:

Vorgehensweise: Filtern von Übersetzungszeichenfolgen
Verwenden Sie den Seitenfilter, um Zeichenfolgen nach einer bestimmten Seite zu filtern. Sie können auch den Filter „Verwendete Zeichenfolgen“ verwenden, um nur die geänderten Zeichenfolgen anzuzeigen:

Vorgehensweise: Importieren oder Exportieren von Übersetzungszeichenfolgen in CSV
Klicken Sie in der Symbolleiste auf die Schaltfläche „ In CSV importieren“ oder „In CSV exportieren“ :
