Add D-FORM form builder handoff
This commit is contained in:
1 parent
2de481bf25
commit
ef07e3d005
49 files changed
+5758
-12
No files matched your search
@@ -0,0 +1,70 @@
|
||||
---
|
||||
kind: start
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
package: WF-D-FORM Form Builder
|
||||
recipient: David
|
||||
status: Review-ready
|
||||
stand: 2026-07-09
|
||||
---
|
||||
|
||||
# Start hier - D-FORM David Review
|
||||
|
||||
Das ist der Startpunkt fuer den weitergegebenen D-FORM-Ordner.
|
||||
|
||||
## Schnell lesen
|
||||
|
||||
1. [[D-FORM David Uebergabe 2026-07-09]]
|
||||
2. [[Simple Builder Neuausrichtung]]
|
||||
3. [[Subframe Bau Log]]
|
||||
4. [[WF-D-FORM Form Builder]]
|
||||
|
||||
## Kurzfassung
|
||||
|
||||
D-FORM ist auf Builder + oeffentliches Formular begrenzt. Der empfohlene Hauptfluss ist jetzt der einfache Google-Forms-nahe Editor S02, weil der alte Advanced-Canvas fuer normale Handwerksbetriebe zu schwer wirkt.
|
||||
|
||||
Nach Davids Feedback wurde die Lead-Zuweisung ergaenzt:
|
||||
|
||||
- S02 zeigt eine ruhige Lead-Card.
|
||||
- `Felder zuweisen` fuehrt nach S02L.
|
||||
- S02L ordnet Formularfragen per Dropdown Lead-Feldern zu.
|
||||
- E05 zeigt fehlende oder unmoegliche Zuweisungen.
|
||||
- Advanced-Canvas und D07-D09 bleiben Referenz, aber nicht Hauptfluss.
|
||||
|
||||
## Review-Reihenfolge
|
||||
|
||||
1. [[Screens/01 S00 Formulare verwalten]]
|
||||
2. [[Screens/02 E01 S00 Keine Formulare]]
|
||||
3. [[Screens/03 E02 S00 Keine Treffer]]
|
||||
4. [[Screens/04 S01 Formularart auswaehlen]]
|
||||
5. [[Screens/05 S02 Einfacher Fragen Editor]]
|
||||
6. [[Screens/05b S02L Lead Felder zuweisen]]
|
||||
7. [[Screens/05c E05 S02 Lead Zuweisung pruefen]]
|
||||
8. [[Screens/06 S03 Formular Design]]
|
||||
9. [[Screens/07 S04 Oeffentliches Formular]]
|
||||
10. [[Screens/08 V01 Public Erfolg oder Redirect]]
|
||||
11. [[Screens/09 V02 Public Formular nicht verfuegbar]]
|
||||
12. [[Screens/10 V03 Public Captcha oder Submit Fehler]]
|
||||
13. [[Screens/11 S05 Antworten Tabelle]]
|
||||
14. [[Screens/12 E03 S05 Keine Antworten]]
|
||||
15. [[Screens/13 E04 S05 Export Fehler]]
|
||||
|
||||
Danach nur bei Bedarf:
|
||||
|
||||
- [[Screens/80 S01B Gefuehrter Fragen Editor]]
|
||||
- [[Screens/81 S01C Website Formular Editor]]
|
||||
- [[Screens/82 S01D Umfrage Editor]]
|
||||
- [[Screens/83 S01E Internes Formular Editor]]
|
||||
- [[Screens/90 ADV Form-Builder Canvas]]
|
||||
- [[Screens/90b ADV Form-Builder Canvas 2]]
|
||||
- [[Screens/91 D07 Logic Regel Detail]]
|
||||
- [[Screens/92 D08 Action Detail mit Mapping]]
|
||||
- [[Screens/93 D09 Publish Blocker Summary]]
|
||||
|
||||
## Bitte pruefen
|
||||
|
||||
- Ist S02 als Haupteditor die richtige Richtung?
|
||||
- Reicht S02L fuer die einfache Lead-Feldzuweisung?
|
||||
- Passt E05 fuer fehlende oder unmoegliche Zuweisungen?
|
||||
- Reichen S03, S04/Public States und S05 fuer D-FORM?
|
||||
- Sollen M01-M04 spaeter als echte Dialog-Screens gebaut werden oder reicht die Dokumentation?
|
||||
+282
@@ -0,0 +1,282 @@
|
||||
---
|
||||
kind: handoff
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
package: WF-D-FORM Form Builder
|
||||
recipient: David
|
||||
status: Review-ready / Subframe Draft gebaut
|
||||
stand: 2026-07-09
|
||||
---
|
||||
|
||||
# D-FORM - Uebergabe fuer David
|
||||
|
||||
Kurzfassung: D-FORM ist fachlich auf Builder + oeffentliches Formular begrenzt. Der alte grosse Form-Builder-Canvas bleibt als Advanced-/Referenzrichtung erhalten, aber die empfohlene Hauptvariante ist jetzt ein einfacher Google-Forms-naher Editor fuer Handwerksbetriebe. Der Subframe-Draft ist gebaut und die wichtigsten Lead-Zuweisungszustaende wurden nach Davids Feedback ergaenzt.
|
||||
|
||||
## 1. Was D-FORM umfasst
|
||||
|
||||
D-FORM umfasst:
|
||||
|
||||
- Formular-Zentrale zum Finden, Filtern und Oeffnen von Formularen.
|
||||
- Formularart auswaehlen.
|
||||
- Einfacher Fragen-Editor fuer alle Formulararten.
|
||||
- Lead-spezifische Feldzuweisung.
|
||||
- Design-Tab fuer Logo, Farbe und Public-Vorschau.
|
||||
- Oeffentliches Formular fuer Kunden/Interessenten.
|
||||
- Public States: Erfolg, nicht verfuegbar, Captcha-/Submit-Fehler.
|
||||
- Antworten-Tab als einfache Tabelle mit Export.
|
||||
- Empty/Error States fuer Verwaltung und Antworten.
|
||||
|
||||
D-FORM umfasst bewusst nicht:
|
||||
|
||||
- Booking.
|
||||
- Kalender.
|
||||
- Signatur.
|
||||
- HR.
|
||||
- Vollstaendige Submissions-Verwaltung.
|
||||
- Vollstaendige CRM-/Automation-Konfiguration.
|
||||
- Komplexe Multi-Step-Forms, Scoring, Repeater oder If/Else-Baeume.
|
||||
|
||||
## 2. Wichtigste Arbeitsentscheidung
|
||||
|
||||
Die erste Builder-Richtung war fachlich vollstaendig, aber fuer normale Handwerksbetriebe zu schwer. Deshalb wurde der Hauptfluss vereinfacht:
|
||||
|
||||
| Alt | Neu |
|
||||
|---|---|
|
||||
| Palette, Canvas und Inspector dauerhaft sichtbar | Ruhiger Fragen-Editor mit einzelnen Fragekarten |
|
||||
| Viele Modi gleichzeitig | Nur das zeigen, was fuer den naechsten Schritt wichtig ist |
|
||||
| Logic und Actions wirken wie Profi-Module | Logic als `Bedingung`, Actions als `Nach Absenden` |
|
||||
| Technische Feldtypen | Verstaendliche Fragetypen |
|
||||
| Lead-Mapping wirkt wie Admin-Konfiguration | Lead-Felder werden einfach per Dropdown zugewiesen |
|
||||
|
||||
Empfehlung: S02 ist der Haupteditor. ADV-S01 bleibt nur Referenz fuer spaetere Advanced-/Power-User-Funktionen.
|
||||
|
||||
## 3. Aktueller Hauptfluss
|
||||
|
||||
```text
|
||||
S00 Formulare verwalten
|
||||
-> Neues Formular
|
||||
-> S01 Formularart auswaehlen
|
||||
-> S02 Einfacher Fragen Editor
|
||||
-> bei Lead-Formular: S02L Lead Felder zuweisen
|
||||
-> bei fehlender/unmoeglicher Lead-Zuweisung: E05
|
||||
-> S03 Formular Design
|
||||
-> S04 Oeffentliches Formular
|
||||
-> Public States V01/V02/V03
|
||||
-> S05 Antworten Tabelle
|
||||
```
|
||||
|
||||
## 4. Gebaute Hauptscreens
|
||||
|
||||
| Nr. | ID | Screen | Zweck | Subframe |
|
||||
|---|---|---|---|---|
|
||||
| 01 | S00 | Formulare verwalten | Erste Seite fuer Suche, Filter, Status und Bearbeiten | https://app.subframe.com/f023064a5ca0/design/2325aa7a-d968-4028-8282-0823b15bf964/edit |
|
||||
| 02 | E01 | S00 Keine Formulare | Empty State, wenn noch nichts existiert | https://app.subframe.com/f023064a5ca0/design/136c11b3-8310-4165-b4ba-9cf099ee0873/edit |
|
||||
| 03 | E02 | S00 Keine Treffer | Empty State fuer Suche/Filter | https://app.subframe.com/f023064a5ca0/design/ccf8d2f7-e7b4-4ffd-87f6-1785edc1b2f7/edit |
|
||||
| 04 | S01 | Formularart auswaehlen | Auswahl: Website/Extern, Lead, Fragebogen/Umfrage, Intern | https://app.subframe.com/f023064a5ca0/design/c423ebcd-914f-4038-ab9f-7c2a745a8bec/edit |
|
||||
| 05 | S02 | Einfacher Fragen Editor | Haupteditor fuer Fragen, Optionen, Pflichtfelder, Bedingung, Lead-Hinweis | https://app.subframe.com/f023064a5ca0/design/181aaa0f-5ae7-4f74-acf7-8273fbbe4dd5/edit |
|
||||
| 05b | S02L | Lead Felder zuweisen | Lead-Felder per Dropdown Formularfragen zuordnen | https://app.subframe.com/f023064a5ca0/design/c8aa80cb-0cc8-473f-9fac-a09d395e6571/edit |
|
||||
| 05c | E05 | S02 Lead Zuweisung pruefen | Fehlerzustand, wenn Lead-Zuweisung fehlt oder nicht passt | https://app.subframe.com/f023064a5ca0/design/26600ce4-7baf-4ffb-9955-7c7d1eef99d1/edit |
|
||||
| 06 | S03 | Formular Design | Logo, Farbe, Breite, Datenschutz-Hinweis, Vorschau | https://app.subframe.com/f023064a5ca0/design/090f06a9-3fa7-4442-b8bc-035e95de7329/edit |
|
||||
| 07 | S04 | Oeffentliches Formular | Kundensicht ohne App-Shell | https://app.subframe.com/f023064a5ca0/design/caef9ddd-03d6-4a26-8dc1-16aa198a7304/edit |
|
||||
| 08 | V01 | Public Erfolg oder Redirect | Danke-/Erfolgszustand nach Absenden | https://app.subframe.com/f023064a5ca0/design/c06ecfc3-1f86-4dfe-9cfd-cec8b8629253/edit |
|
||||
| 09 | V02 | Public Formular nicht verfuegbar | Public Blocker statt rohem Fehler | https://app.subframe.com/f023064a5ca0/design/f96ec12a-5e6a-471d-9a9c-6babcb57c74c/edit |
|
||||
| 10 | V03 | Public Captcha oder Submit Fehler | Werte bleiben erhalten, Fehler wird verstaendlich gezeigt | https://app.subframe.com/f023064a5ca0/design/95c96bc9-35d4-47ce-b510-7d8ea1f41936/edit |
|
||||
| 11 | S05 | Antworten Tabelle | Excel-nahe Antwortenansicht mit Zeitraum und Export | https://app.subframe.com/f023064a5ca0/design/9e8eeab7-44ea-4b77-85e6-0818d97e1ac3/edit |
|
||||
| 12 | E03 | S05 Keine Antworten | Empty State fuer Antworten-Tab | https://app.subframe.com/f023064a5ca0/design/6f56c14f-d66e-4734-8a29-a900ac74a8a7/edit |
|
||||
| 13 | E04 | S05 Export Fehler | Fehlerzustand fuer Excel/CSV-Export | https://app.subframe.com/f023064a5ca0/design/00553ea4-9839-4d22-b540-9b9ef0bf014f/edit |
|
||||
|
||||
## 5. Spaetere Varianten und Referenzseiten
|
||||
|
||||
Diese Seiten sind gebaut oder dokumentiert, aber nicht Teil des aktuellen Hauptflusses:
|
||||
|
||||
| Nr. | ID | Screen | Status | Subframe |
|
||||
|---|---|---|---|---|
|
||||
| 80 | S01B | Gefuehrter Fragen Editor | Spaeter / Referenz | https://app.subframe.com/f023064a5ca0/design/d0fb9c3d-4b03-4d59-bd98-9f668ab018eb/edit |
|
||||
| 81 | S01C | Website Formular Editor | Spaeter / Referenz | https://app.subframe.com/f023064a5ca0/design/d7d33e94-5c12-48e8-8ec6-1e94590ee89c/edit |
|
||||
| 82 | S01D | Umfrage Editor | Spaeter / Referenz | https://app.subframe.com/f023064a5ca0/design/5abd7799-7058-40b3-9772-884cbda97b9c/edit |
|
||||
| 83 | S01E | Internes Formular Editor | Spaeter / Referenz | https://app.subframe.com/f023064a5ca0/design/ea08fd1c-1a76-4e2c-b27c-1091baa0586a/edit |
|
||||
| 90 | ADV-S01 | Form-Builder Canvas | Advanced / Referenz | https://app.subframe.com/f023064a5ca0/design/e5502f88-9858-460e-abae-671f28464270/edit |
|
||||
| 90b | ADV-S01-2 | Form-Builder Canvas 2 | Advanced / Referenz | https://app.subframe.com/f023064a5ca0/design/9529ac6f-eb71-4e5c-8774-7cebe9c8162c/edit |
|
||||
| 91 | D07 | Logic Regel Detail | Advanced / Referenz | https://app.subframe.com/f023064a5ca0/design/07b60457-8151-46b9-ba34-34eceffc08bb/edit |
|
||||
| 92 | D08 | Action Detail mit Mapping | Advanced / Referenz | https://app.subframe.com/f023064a5ca0/design/0759d779-91f5-4e06-b1d6-7cd0095461ea/edit |
|
||||
| 93 | D09 | Publish Blocker Summary | Advanced / Referenz | https://app.subframe.com/f023064a5ca0/design/211e8ca7-fc0b-4c52-a4a4-a1e660209e58/edit |
|
||||
|
||||
## 6. Formulararten
|
||||
|
||||
| Formularart | Fuer wen | Verhalten |
|
||||
|---|---|---|
|
||||
| Website-/Externes Formular | Kunden oder Interessenten per Link/Website | Public Link, mCaptcha, Datenschutz-Hinweis |
|
||||
| Lead-Formular | Neue Kundenanfragen fuer Vertrieb/Pipeline | Kontakt-/Anfragefelder werden vorgeschlagen, Lead-Erstellung ist aktiv, `Felder zuweisen` sichtbar |
|
||||
| Fragebogen / Umfrage | Feedback, Zufriedenheit, kurze Abfragen | Antworten werden gesammelt, keine Lead-Pipeline |
|
||||
| Internes Formular | Mitarbeiter, z. B. Material/Rueckruf/Schaden | Interne Ablage, kein Public-Marketing-Kontext |
|
||||
|
||||
## 7. Fragetypen im aktuellen S02
|
||||
|
||||
Im Hauptdropdown bleiben aktuell nur:
|
||||
|
||||
- Kurzantwort
|
||||
- Absatz
|
||||
- Multiple Choice
|
||||
- Mehrfachauswahl
|
||||
- Drop-down
|
||||
- Datei oder Bild hochladen
|
||||
- Datum
|
||||
- Uhrzeit
|
||||
|
||||
Nicht im aktuellen Hauptdropdown:
|
||||
|
||||
- Lineare Skala
|
||||
- Bewertung
|
||||
- Multiple-Choice-Raster
|
||||
- Kaestchenraster
|
||||
|
||||
Diese Typen koennen spaeter wieder diskutiert werden, werden aber jetzt bewusst nicht gebaut.
|
||||
|
||||
## 8. Lead-Zuweisung nach Davids Feedback
|
||||
|
||||
Davids Feedback: Ein reiner Hinweis `Lead-Verknuepfung aktiv` reicht nicht. Nutzer sollen sehen koennen, welche Formularfragen in welche Lead-Felder laufen.
|
||||
|
||||
Umsetzung:
|
||||
|
||||
- S02 bleibt Haupteditor.
|
||||
- Bei Lead-Formularen zeigt S02 eine ruhige blaue Lead-Card.
|
||||
- Die blaue Lead-Card nutzt jetzt denselben Layout-Aufbau wie die gruene `Lead anlegen`-Card: Icon links, Titel/Badge/Beschreibung in der Mitte, Aktion rechts.
|
||||
- `Felder zuweisen` fuehrt zu S02L.
|
||||
- S02L zeigt die Lead-Zuweisung im gleichen Look wie S02.
|
||||
- Jede Zuweisung nutzt eine Dropdown-Vorlage.
|
||||
- Nicht passende Felder werden disabled oder mit Begruendung markiert.
|
||||
- E05 deckt fehlende oder unmoegliche Zuweisungen ab.
|
||||
- Lead kann im bestehenden Formular deaktiviert werden; es muss nicht direkt ein neues Formular erstellt werden.
|
||||
|
||||
Wichtige Lead-Felder:
|
||||
|
||||
| Lead-Feld | Erwartung |
|
||||
|---|---|
|
||||
| Name | Pflicht, normalerweise Kurzantwort |
|
||||
| Kontakt | Pflicht: Telefon, E-Mail oder Kombifeld |
|
||||
| Beschreibung | Pflicht, Kurzantwort oder Absatz |
|
||||
| Bereich | Optional, als Tag/Kategorie nutzbar |
|
||||
| Datei / Bild | Optional, nur Datei-/Upload-Fragen |
|
||||
| Pipeline | Pflicht, Ziel fuer neue Leads |
|
||||
| Quelle | Automatisch `Formular` |
|
||||
|
||||
## 9. Logic, Actions und Publish
|
||||
|
||||
Fuer den einfachen Haupteditor:
|
||||
|
||||
- Logic wird als `Bedingung` direkt an der Frage gezeigt.
|
||||
- Actions werden im Bereich `Nach Absenden` gezeigt.
|
||||
- Bei Lead-Formularen ist `Lead anlegen` als einfache Card aktiv.
|
||||
- Publish bleibt im Editor.
|
||||
- Harte Blocker zeigen einen Banner/Popover mit Sprungzielen.
|
||||
- Unpublish braucht einen Confirm-Dialog, weil der Public-Link danach nicht mehr erreichbar ist.
|
||||
|
||||
Fuer Advanced/Referenz:
|
||||
|
||||
- D07 zeigt Logic-Regel-Detail.
|
||||
- D08 zeigt Action-Detail mit Mapping.
|
||||
- D09 zeigt Publish-Blocker-Summary.
|
||||
- D01/D02/D03/D06/D10 und M01-M04 sind in Markdown dokumentiert, aber nicht zwingend als Subframe-Hauptscreen noetig.
|
||||
|
||||
## 10. Public Formular
|
||||
|
||||
S04 ist die Sicht fuer Kunden/Interessenten, nicht fuer interne Mitarbeiter.
|
||||
|
||||
Grundregeln:
|
||||
|
||||
- Keine App-Shell.
|
||||
- Keine Sidebar.
|
||||
- Keine internen Begriffe.
|
||||
- Tenant-Logo/Farbe sichtbar.
|
||||
- Felder klar, ruhig und mobil nutzbar.
|
||||
- mCaptcha fuer externe Formulare.
|
||||
- Datenschutz-Checkbox.
|
||||
- Datei/Bild-Upload nutzt volle Formularbreite.
|
||||
- Bei Fehlern bleiben Eingaben erhalten.
|
||||
|
||||
Public States:
|
||||
|
||||
| State | Zweck |
|
||||
|---|---|
|
||||
| V01 | Anfrage erfolgreich gesendet oder Redirect |
|
||||
| V02 | Formular nicht verfuegbar, geschlossen oder Limit erreicht |
|
||||
| V03 | Captcha-, Upload- oder Submit-Fehler mit erhaltenen Eingaben |
|
||||
|
||||
## 11. Antworten-Tab
|
||||
|
||||
S05 ist bewusst schlicht:
|
||||
|
||||
- Excel-/Tabellennahe Ansicht.
|
||||
- Suche.
|
||||
- Zeitraumfilter: letzte 7 Tage, letzter Monat, letzte 3 Monate, letztes Jahr, eigener Zeitraum.
|
||||
- Excel/CSV-Export.
|
||||
- Keine Kennzahl-Kacheln, weil die Ansicht sonst zu schwer wirkt.
|
||||
- Kein `Link teilen`-Button; Teilen gehoert in den Veroeffentlichen-/Public-Link-Kontext.
|
||||
|
||||
## 12. Noch offen / bitte pruefen
|
||||
|
||||
Aus meiner Sicht ist fuer den aktuellen D-FORM-Plan inhaltlich nichts Grosses mehr offen, ausser Review und Feinschliff in Subframe.
|
||||
|
||||
Bitte David pruefen lassen:
|
||||
|
||||
- Ist S02 als Haupteditor statt Advanced-Canvas die richtige Richtung fuer normale Handwerksbetriebe?
|
||||
- Reicht S02L als einfache Lead-Feldzuweisung, oder braucht David noch ein zweites Detail-/Fehlerbeispiel?
|
||||
- Passt E05 fuer fehlende/unmoegliche Lead-Zuweisungen?
|
||||
- Sind S03 Design und S05 Antworten tief genug fuer D-FORM, ohne in andere Tickets abzurutschen?
|
||||
- Sind Public States S04/V01/V02/V03 vollstaendig genug?
|
||||
- Duerfen S01B/S01C/S01D/S01E, ADV-S01 Canvas 1/2 und D07/D08/D09 als Referenz liegen bleiben?
|
||||
- Muessen M01-M04 als echte Dialog-Screens gebaut werden, oder reicht Dokumentation?
|
||||
- In Subframe bitte bei S02L/E05 nochmal visuell pruefen, ob das richtige Default Page Layout gesetzt ist.
|
||||
|
||||
## 13. Empfohlene Review-Reihenfolge in Subframe
|
||||
|
||||
1. S00 Formulare verwalten
|
||||
2. E01 S00 Keine Formulare
|
||||
3. E02 S00 Keine Treffer
|
||||
4. S01 Formularart auswaehlen
|
||||
5. S02 Einfacher Fragen Editor
|
||||
6. S02L Lead Felder zuweisen
|
||||
7. E05 S02 Lead Zuweisung pruefen
|
||||
8. S03 Formular Design
|
||||
9. S04 Oeffentliches Formular
|
||||
10. V01 Public Erfolg oder Redirect
|
||||
11. V02 Public Formular nicht verfuegbar
|
||||
12. V03 Public Captcha oder Submit Fehler
|
||||
13. S05 Antworten Tabelle
|
||||
14. E03 S05 Keine Antworten
|
||||
15. E04 S05 Export Fehler
|
||||
|
||||
Danach nur bei Bedarf:
|
||||
|
||||
16. S01B Gefuehrter Fragen Editor
|
||||
17. S01C Website Formular Editor
|
||||
18. S01D Umfrage Editor
|
||||
19. S01E Internes Formular Editor
|
||||
20. ADV-S01 Form-Builder Canvas
|
||||
21. ADV-S01-2 Form-Builder Canvas 2
|
||||
22. D07 Logic Regel Detail
|
||||
23. D08 Action Detail mit Mapping
|
||||
24. D09 Publish Blocker Summary
|
||||
|
||||
## 14. Lokale Detaildateien
|
||||
|
||||
Wichtige Detailnotizen im Paket:
|
||||
|
||||
- `WF-D-FORM Form Builder.md`
|
||||
- `Simple Builder Neuausrichtung.md`
|
||||
- `David Review Checkliste.md`
|
||||
- `Subframe Bau Log.md`
|
||||
- `Subframe Bauplan.md`
|
||||
- `Screens/01 S00 Formulare verwalten.md`
|
||||
- `Screens/04 S01 Formularart auswaehlen.md`
|
||||
- `Screens/05 S02 Einfacher Fragen Editor.md`
|
||||
- `Screens/05b S02L Lead Felder zuweisen.md`
|
||||
- `Screens/05c E05 S02 Lead Zuweisung pruefen.md`
|
||||
- `Screens/06 S03 Formular Design.md`
|
||||
- `Screens/07 S04 Oeffentliches Formular.md`
|
||||
- `Screens/11 S05 Antworten Tabelle.md`
|
||||
- `Screens/D10 Builder Interaktionsfaelle.md`
|
||||
|
||||
## 15. Kurztext zum Mitschicken
|
||||
|
||||
Hey David, hier ist die aufgeraeumte D-FORM-Uebergabe. Ich habe den Builder nach deinem Feedback nochmal vereinfacht und die Lead-Zuweisung ergaenzt: S02 bleibt der einfache Google-Forms-nahe Haupteditor, S02L zeigt die Lead-Felder-Zuweisung per Dropdown, E05 deckt fehlende/unmoegliche Zuweisungen ab. Advanced-Canvas und D07-D09 bleiben als Referenz, aber nicht als Hauptfluss. Kannst du bitte einmal pruefen, ob die Richtung und die offenen Punkte fuer dich passen?
|
||||
@@ -0,0 +1,182 @@
|
||||
---
|
||||
kind: review-checklist
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
package: WF-D-FORM Form Builder
|
||||
status: Review-ready / Subframe Draft gebaut
|
||||
stand: 2026-07-09
|
||||
---
|
||||
|
||||
# David Review Checkliste - D-FORM
|
||||
|
||||
Ziel: David kann schnell pruefen, ob der D-FORM-Zuschnitt, die wichtigsten UX-Entscheidungen und der Subframe-Draft stimmen.
|
||||
|
||||
Startpunkt fuer die weitergebbare Version: [[00 Start hier - David]] und [[D-FORM David Uebergabe 2026-07-09]].
|
||||
|
||||
## 0. Review-Ergebnis 2026-07-06
|
||||
|
||||
David hat den groben fachlichen Scope als passend bewertet. Die Empfehlungen aus dieser Checkliste werden damit als Arbeitsentscheidung uebernommen.
|
||||
|
||||
Wichtige Nacharbeit aus dem Review: Beim alten Advanced-S01 fehlte die Interaktionslogik auf der Ebene "was passiert nach Klick?". Diese Nacharbeit ist in [[Screens/90 ADV Form-Builder Canvas|ADV-S01 Form-Builder Canvas]] ergaenzt: Feldbearbeitung, Feldaktionen, Logic, Actions, Sharing, Preview, Settings, Publish und Unpublish sind jetzt nach Inline/Inspector, Menue, Panel, Popover oder Confirm-Dialog sortiert.
|
||||
|
||||
Subframe ist als Draft gebaut und verlinkt. Der aktuelle Hauptfluss ist S00, E01/E02, S01, S02, S03, S04/V01/V02/V03, S05 und E03/E04. S01B/S01C/S01D/S01E, ADV-S01 Canvas 1/2 und D07/D08/D09 bleiben spaetere Varianten bzw. Referenz.
|
||||
|
||||
Aktuelle Arbeitsentscheidung: Fuer normale Handwerksbetriebe wird S02 als einfache Google-Forms-nahe Richtung empfohlen. Alle Formulararten starten in S02 mit anderer Vorlage/Startfragen. Der alte Profi-Canvas bleibt als Advanced-/Referenzscreen, nicht als erste Nutzerfuehrung. Als Kunden-/Handwerker-Wording wird `Bereich` statt `Gewerk` verwendet.
|
||||
|
||||
## 0b. David-Feedback Lead-Zuweisung
|
||||
|
||||
Neue Rueckmeldung: Fuer Lead-Formulare reicht ein reiner Hinweis `Lead-Verknuepfung aktiv` nicht aus. Nutzer sollen sehen, welche Formularfelder in welche Lead-Felder laufen.
|
||||
|
||||
Entscheidung:
|
||||
|
||||
- S02 bleibt der Haupteditor.
|
||||
- Logic kommt als einfache `Bedingung` direkt an die Frage.
|
||||
- Actions kommen als `Nach Absenden`-Bereich in den Screen.
|
||||
- Bei Lead-Formularen ist `Lead anlegen` aktiv.
|
||||
- `Felder zuweisen` wird als eigener S02-Zustand dokumentiert: [[Screens/05b S02L Lead Felder zuweisen]].
|
||||
- Wenn eine Zuweisung fehlt oder nicht moeglich ist, wird optional [[Screens/05c E05 S02 Lead Zuweisung pruefen]] gebaut.
|
||||
- Dropdown-Vorlage verwenden; keine eigene Mapping-Tabellenoptik.
|
||||
- Nicht passende Felder werden disabled oder mit Fehlerhinweis markiert.
|
||||
|
||||
## 1. Quellen-Abgrenzung
|
||||
|
||||
Ergebnis: Die Abgrenzung `D-FORM = Form-Builder-Canvas + oeffentliches Formular` stimmt.
|
||||
|
||||
| Quelle | Aussage | Konsequenz fuer D-FORM |
|
||||
|---|---|---|
|
||||
| `ticket-docs/D-FORM.md` | D-FORM deckt nur Form-Builder-Canvas und oeffentliches Formular ab. Booking/Kalender gehen an `D-BOOK`; Forms-Liste, Submissions und Signatur sind Compose/andere Tickets. | D-FORM bleibt bei Builder und Public: S02 einfacher Editor plus S04/Public-Varianten; ADV-S01 nur als Referenz. |
|
||||
| `designer-briefs/P16-kalender-booking-forms-signatur.md` | P16 ist gebuendelt, aber soll in Gruppen getrennt werden: Kalender-Sync, Booking, Form-Builder, Signatur. | Nicht alle P16-Screens gehoeren in D-FORM. |
|
||||
| `SCREEN-MAP.md` Paragraph 3 | Listet Form-Builder-Canvas, oeffentliches Formular und Submissions im Umfeld. Submissions ist A2/A3-Compose, Builder/Public sind Bespoke. | Submissions nicht als D-FORM-Bespoke bauen. |
|
||||
| `D-BOOK.md` | D-BOOK deckt Booking-Page und Kalender-View ab; verweist Form-Builder/Public Form zurueck auf D-FORM. | Booking und Kalender bleiben raus. |
|
||||
| `D-HR.md` | HR ist Compose und bettet den M05-Form-Renderer aus P16 ein. | HR nutzt D-FORM-Ergebnis spaeter, ist aber kein D-FORM-Screen. |
|
||||
| `M05-form-builder.md` | M05 enthaelt auch Submissions, Templates, Actions, Permissions und Phase-2-Themen. | D-FORM darf diese Themen beruecksichtigen, aber nicht alle als eigene Screens bauen. |
|
||||
|
||||
## 2. Scope-Entscheidung
|
||||
|
||||
| Punkt | Empfehlung | David-Entscheidung |
|
||||
|---|---|---|
|
||||
| D-FORM umfasst den Builder; aktuell S02 als Haupteditor und ADV-S01 als Advanced-Referenz. | Ja. | angenommen |
|
||||
| D-FORM umfasst S04 Oeffentliches Formular. | Ja. | angenommen |
|
||||
| V01 Public Erfolg/Redirect wird als eigene Variante gebaut. | Ja, weil copy- und vertrauenskritisch. | angenommen |
|
||||
| V02 Public Formular nicht verfuegbar wird als eigene Variante gebaut. | Ja, weil externer Nutzer blockiert ist. | angenommen |
|
||||
| V03 Public Captcha/Submit-Fehler wird als eigene Variante gebaut. | Ja, weil Public-Vertrauen wichtig ist. | angenommen |
|
||||
| Vollstaendige Forms-Liste bleibt raus. | Ja, D2-Compose / eigenes Paket. S03 ist nur eine schlanke Formular-Zentrale fuer D-FORM. | angenommen / ergaenzt |
|
||||
| Vollstaendige Submissions bleibt raus. | Ja, A2/A3-Compose / eigenes Paket. S05 ist nur der einfache Antworten-Tab fuer ein Formular. | angenommen / ergaenzt |
|
||||
| Booking/Kalender bleibt raus. | Ja, `D-BOOK`. | angenommen |
|
||||
| Signatur bleibt raus. | Ja, eigenes Signatur-/D-REST-Paket. | angenommen |
|
||||
| HR bleibt raus. | Ja, HR nutzt nur den Renderer wieder. | angenommen |
|
||||
|
||||
## 3. Builder / Advanced-S01 Referenz
|
||||
|
||||
| Entscheidung | Empfehlung | Warum wichtig | David-Entscheidung |
|
||||
|---|---|---|---|
|
||||
| Builder-Aufbau | Drei-Zonen-Builder: Palette links, Canvas Mitte, Inspector rechts. | Wirkt wie Builder, nicht wie Settings-Seite. | angenommen |
|
||||
| Modus-Leiste | Builder, Logic, Actions, Sharing, Preview, Settings als Modi im selben Screen. | Keine Routensplittung, aber Komplexitaet bleibt sortiert. | angenommen |
|
||||
| Preview | Im selben Builder als Modus oder Side-Preview. | Public-Renderer muss pruefbar sein. | angenommen |
|
||||
| Content Blocks | Section Header/Description als optionaler Content Block pruefen, nicht als A4-12-Feldtyp. | Lange Forms brauchen Struktur, aber Scope darf nicht wachsen. | angenommen |
|
||||
| Signature | Nicht als normales D-FORM-v1-Feld. | Signatur hat eigenen Kontext. | angenommen |
|
||||
| Foto | Als Datei-/Mobile-Kamera-Variante, kein eigener Feldtyp. | Haelt die 12 Feldtypen stabil. | angenommen |
|
||||
| URL/Address/Hidden | Raus oder v2/Spezialbaustein. | Nicht Teil der A4-12-Liste bzw. haengt an v2/Maps/Links. | angenommen |
|
||||
| Field Key | Sichtbar, automatisch aus Label, in Advanced editierbar. | Wichtig fuer Mapping/Actions, aber nicht zu laut im UI. | angenommen |
|
||||
|
||||
## 4. Validation / Publish
|
||||
|
||||
| Entscheidung | Empfehlung | David-Entscheidung |
|
||||
|---|---|---|
|
||||
| Publish blockiert bei fehlendem Namen, Slug, keinem sichtbaren Feld, Feld ohne Label, Select ohne Optionen, kaputter Logic, Pflichtmapping. | Ja. | angenommen |
|
||||
| Warnen, aber nicht blockieren bei langem Formular, Datei ohne Typbeschraenkung, published Form stark geaendert. | Ja. | angenommen |
|
||||
| Publish bleibt im Builder, kein eigener Screen. | Ja, Banner/Popover reicht. | angenommen |
|
||||
| Unpublish bekommt Confirm-Hinweis, weil Public-Link danach nicht mehr erreichbar ist. | Ja. | angenommen |
|
||||
|
||||
## 5. Conditional Logic
|
||||
|
||||
| Entscheidung | Empfehlung | David-Entscheidung |
|
||||
|---|---|---|
|
||||
| V1 nur einfache Sichtbarkeit: Wenn Feld Y Operator Wert Z, dann Feld X anzeigen/verstecken. | Ja. | angenommen |
|
||||
| Keine Multi-Step-Forms, Repeater, If/Else-Baeume, Scoring, Cross-Field-Rechnung. | Ja, v2. | angenommen |
|
||||
| Kaputte Referenzen blockieren Publish. | Ja. | angenommen |
|
||||
| Required-Feld, das versteckt ist, blockiert Public Submit nicht. | Ja. | angenommen |
|
||||
|
||||
## 6. Post-Submit-Actions
|
||||
|
||||
| Entscheidung | Empfehlung | David-Entscheidung |
|
||||
|---|---|---|
|
||||
| Actions bleiben in S01, kein eigener Automation-Editor. | Ja. | angenommen |
|
||||
| Action-Typen: Email Submitter, Email Team, Lead, Kontakt, Projekt, Task, Auto-Match, Webhook, Automation-Trigger. | Ja. | angenommen |
|
||||
| KWP Push nicht aktiv in D-FORM v1. | Ja, KWP ist v2/raus. | angenommen |
|
||||
| Field-Mapping sichtbar pro Action. | Ja, Kernentscheidung. | angenommen |
|
||||
| Test/Preview je Action zeigen. | Ja, aber kein ActionLog/Re-Run. | angenommen |
|
||||
| ActionLog/Re-Run gehoert zu Submissions. | Ja. | angenommen |
|
||||
|
||||
## 7. Sharing
|
||||
|
||||
| Entscheidung | Empfehlung | David-Entscheidung |
|
||||
|---|---|---|
|
||||
| V1 Sharing: Public URL, QR, iFrame. | Ja. | angenommen |
|
||||
| Personalisierte Links raus. | Ja, v2 laut Ticket. | angenommen |
|
||||
| JS-Snippet raus. | Ja, v2 laut Ticket. | angenommen |
|
||||
| Draft-Form zeigt Sharing ausgegraut mit Publish-Hinweis. | Ja. | angenommen |
|
||||
| Slug fehlt blockiert Sharing. | Ja. | angenommen |
|
||||
|
||||
## 8. S04 Oeffentliches Formular
|
||||
|
||||
| Entscheidung | Empfehlung | David-Entscheidung |
|
||||
|---|---|---|
|
||||
| Keine App-Shell, keine Sidebar, keine internen Begriffe. | Ja. | angenommen |
|
||||
| Public Layout: Branding-Kopf, Intro, Felder, Captcha, Submit, Footer. | Ja. | angenommen |
|
||||
| Mobile-first fuer lange Formulare und Datei/Foto-Upload. | Ja. | angenommen |
|
||||
| Conditional Logic live, aber ohne Fachbegriff im UI. | Ja. | angenommen |
|
||||
| Werte bleiben bei Submit-/Captcha-Fehler erhalten. | Ja, wichtig fuer lange Forms. | angenommen |
|
||||
| Branding nur Tenant-Logo/Farbe/Fallback, kein komplexes Theme-System. | Empfehlung: v1 schlicht halten. | angenommen |
|
||||
|
||||
## 9. Public-Varianten
|
||||
|
||||
| Variante | Empfehlung | David-Entscheidung |
|
||||
|---|---|---|
|
||||
| V01 Success ohne Redirect | Danke-Ansicht mit klarer Bestaetigung. | angenommen |
|
||||
| V01 Success mit Redirect | Kurze Bestaetigung + Weiterleitung/Weiter-Button. | angenommen |
|
||||
| V02 Nicht verfuegbar | Ruhiger Blocker, keine technischen Details. | angenommen |
|
||||
| V02 Geschlossen/Limit erreicht | Eigene Copy-Richtung, aber gleiche Variante. | angenommen |
|
||||
| V03 Captcha-Fehler | Fehler nahe Captcha, Retry. | angenommen |
|
||||
| V03 Submit-Fehler | Banner nahe Submit, Werte erhalten, Retry. | angenommen |
|
||||
|
||||
## 10. Subframe-Freigabe
|
||||
|
||||
| Punkt | Empfehlung | David-Entscheidung |
|
||||
|---|---|---|
|
||||
| 5 Hauptframes/Varianten bauen: S01, S02, V01, V02, V03. | Ja. | angenommen |
|
||||
| Zusaetzlich D07 Logic Regel Detail bauen. | Ja, damit Logic visuell pruefbar ist. | angenommen als Empfehlung |
|
||||
| Zusaetzlich D08 Action Detail mit Mapping bauen. | Ja, weil Mapping komplex und fehleranfaellig ist. | angenommen als Empfehlung |
|
||||
| Zusaetzlich D09 Publish Blocker Summary bauen. | Ja, weil Publish ein kritischer Moment ist. | angenommen als Empfehlung |
|
||||
| M01 Feld loeschen Confirm und M02 Unpublish Confirm vorerst nur dokumentieren. | Ja, fachlich klar; spaeter baubar, falls David es sehen will. | angenommen als Empfehlung |
|
||||
| Sharing, Logic, Actions, Preview und Settings nicht als eigene Subframe-Screens, sondern als Bereiche/Zustaende von S01. | Ja. | angenommen; Interaktionslogik in S01 nachgezogen |
|
||||
| Nach Subframe-Bau Links in Paket, Screen-Dateien, Tracker und Handoff eintragen. | Ja. | erledigt |
|
||||
|
||||
## 11. David-Feedback: S01 Nacharbeit
|
||||
|
||||
Davids Rueckmeldung: Der fachliche Scope ist gut, aber beim internen Form Builder fehlte die Interaktionslogik. Es muss erkennbar sein, ob Klicks inline bleiben, ein Menue/Popover oeffnen, den Inspector wechseln, ein Panel/Drawer zeigen oder einen Dialog brauchen.
|
||||
|
||||
Arbeitsentscheidung fuer S01:
|
||||
|
||||
| Aktion | Entscheidung |
|
||||
|---|---|
|
||||
| Feld bearbeiten | Inline im rechten Inspector, kein Modal. |
|
||||
| Feld duplizieren | Direkt ueber Feldkarte oder 3-Punkte-Menue; danach Kopie markieren, kein Confirm. |
|
||||
| Feld loeschen | Ueber 3-Punkte-Menue oder Gefahrenzone; Confirm, sobald Feld in Logic/Actions verwendet wird oder Loeschen destruktiv ist. |
|
||||
| Logic-Regel anlegen | Im Logic-Modus als Panel/Detailbereich im selben S01-Screen, kein Modal. |
|
||||
| Post-Submit-Action hinzufuegen | Actions-Modus: Typ-Auswahl als kleines Auswahlpanel/Popover, Detailkonfiguration im Panel/Drawer. |
|
||||
| Sharing oeffnen | Share-Button schaltet in Sharing-Panel/Modus, kein Modal. |
|
||||
| Publish | Publish-Check inline im Builder; bei Blockern Summary mit Sprungzielen, bei Erfolg Toast/Statuswechsel. |
|
||||
| Unpublish | Confirm-Dialog, weil der Public-Link danach nicht mehr erreichbar ist. |
|
||||
|
||||
Damit reicht S01 weiter als Hauptscreen. D07, D08 und D09 sind als wichtige S01-Zustandsframes gebaut. Die kleineren Menues und Confirm-Dialoge bleiben dokumentiert und muessen nicht automatisch eigene Subframe-Screens werden.
|
||||
|
||||
Vor-Subframe-Nacharbeit erledigt: Die wichtigsten ADV-S01-Zustaende sind als eigene Markdown-Dateien ausgearbeitet: [[Screens/D01 Sharing Panel URL QR iFrame]], [[Screens/D02 Post-Submit Actions]], [[Screens/D03 Conditional Logic Editor]], [[Screens/D06 Feldkarten Menue]], [[Screens/M01 Feld loeschen Confirm]], [[Screens/91 D07 Logic Regel Detail|D07 Logic Regel Detail]], [[Screens/92 D08 Action Detail mit Mapping|D08 Action Detail mit Mapping]], [[Screens/93 D09 Publish Blocker Summary|D09 Publish Blocker Summary]], [[Screens/M02 Unpublish Confirm]], [[Screens/M03 Archive Confirm]], [[Screens/M04 Unsaved Changes Confirm]].
|
||||
|
||||
Weitere Nacharbeit nach neuer Rueckmeldung: [[Screens/D10 Builder Interaktionsfaelle]] dokumentiert jetzt die "Was passiert wenn...?"-Faelle: Auswahlfolgen, Checkboxen, vergessene Zwischenschritte, Datei/Foto, Dropdowns, halb gesetztes Mapping, Publish-Blocker und konkrete Modal-/Popover-Inhalte.
|
||||
|
||||
Aktueller Subframe-Stand: Der Hauptfluss S00/E01/E02/S01/S02/S03/S04/V01/V02/V03/S05/E03/E04 ist gebaut und verlinkt. S01B/S01C/S01D/S01E, ADV-S01 Canvas 1/2 und D07/D08/D09 sind gebaut, aber aktuell nur spaetere Varianten bzw. Referenz. M01/M02/M03/M04 und D10 bleiben dokumentiert.
|
||||
|
||||
## 12. Kurztext fuer David
|
||||
|
||||
`D-FORM ist fachlich passend abgegrenzt, die Advanced-Builder-Klicklogik ist nachgezogen und der Subframe-Draft ist gebaut. Der aktuelle Hauptfluss ist S00, S01, S02, S03, S04/Public States und S05 plus E01-E04. S02 ist die Google-Forms-nahe Hauptvariante; Logic/Actions/Publish bleiben dort bewusst einfach und inline. S01B/S01C/S01D/S01E, ADV-S01 Canvas 1/2 und D07/D08/D09 sind nur spaetere Varianten bzw. Referenz. S05 bleibt ohne Kennzahl-Kacheln und ohne extra Link-teilen-Button.`
|
||||
+59
@@ -0,0 +1,59 @@
|
||||
---
|
||||
kind: screen
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
package: WF-D-FORM Form Builder
|
||||
id: S00
|
||||
screen: Formulare verwalten
|
||||
typ: Formular-Zentrale
|
||||
umsetzung: Bauen
|
||||
status: Subframe Draft / Review offen
|
||||
route: /forms
|
||||
subframe: "https://app.subframe.com/f023064a5ca0/design/2325aa7a-d968-4028-8282-0823b15bf964/edit"
|
||||
---
|
||||
|
||||
# S00 - Formulare verwalten
|
||||
|
||||
## Ziel
|
||||
|
||||
Grundseite fuer Mitarbeiter, um bestehende Formulare zu finden, zu filtern und zu oeffnen.
|
||||
|
||||
Der Screen ist nicht der Builder selbst, sondern die Formular-Zentrale vor dem Bearbeiten.
|
||||
|
||||
## Inhalt
|
||||
|
||||
- Seitentitel `Formulare`
|
||||
- Hilfetext: Formulare erstellen, veroeffentlichen und verwalten
|
||||
- Buttons:
|
||||
- `Vorlagen`
|
||||
- `Neues Formular`
|
||||
- Filter oben als Mehrfachauswahl:
|
||||
- Status: Erstellt, Veroeffentlicht, Unveroeffentlicht
|
||||
- Art: Website / Extern, Lead, Umfrage, Intern
|
||||
- Suche, Statusfilter und Sortierung
|
||||
- Tabelle mit Formularen:
|
||||
- Website-Anfrage
|
||||
- Heizungs-Anfrage
|
||||
- Kundenzufriedenheit
|
||||
- Materialbedarf melden
|
||||
|
||||
## Verhalten
|
||||
|
||||
- Klick auf `Neues Formular` fuehrt zu [[04 S01 Formularart auswaehlen|S01 Formularart auswaehlen]].
|
||||
- Klick auf `Bearbeiten` oeffnet aktuell [[05 S02 Einfacher Fragen Editor|S02]].
|
||||
- Die Formularart bestimmt in S02 nur Vorlage, Startfragen und Hinweise. S01B/S01C/S01D/S01E bleiben spaetere Varianten bzw. Referenzseiten.
|
||||
- Filterchips koennen kombiniert werden, z. B. `Erstellt` + `Unveroeffentlicht` oder `Website / Extern` + `Lead`.
|
||||
- Als Beispiel sind mehrere Status-Chips aktiv, damit klar ist: Es ist kein einzelner Tab, sondern eine Mehrfachauswahl. Art-Chips stehen daneben als zusaetzliche auswaehlbare Filter bereit.
|
||||
- Aktionen je Zeile: bearbeiten, Vorschau, Link kopieren, Antworten ansehen, duplizieren, loeschen.
|
||||
|
||||
## Subframe
|
||||
|
||||
Gebaut in Subframe:
|
||||
|
||||
https://app.subframe.com/f023064a5ca0/design/2325aa7a-d968-4028-8282-0823b15bf964/edit
|
||||
|
||||
Qualitaetsregel:
|
||||
|
||||
- Nutzt das vorhandene `Default Page Layout`.
|
||||
- Keine eigene Sidebar oder Header-Navigation.
|
||||
- Liegt im selben Flow neben den D-FORM Builder-Screens.
|
||||
+42
@@ -0,0 +1,42 @@
|
||||
---
|
||||
kind: screen
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
package: WF-D-FORM Form Builder
|
||||
id: E01
|
||||
screen: S00 Keine Formulare
|
||||
typ: Empty State
|
||||
umsetzung: Bauen
|
||||
status: Subframe Draft / Review offen
|
||||
route: /forms
|
||||
subframe: "https://app.subframe.com/f023064a5ca0/design/136c11b3-8310-4165-b4ba-9cf099ee0873/edit"
|
||||
---
|
||||
|
||||
# E01 - S00 Keine Formulare
|
||||
|
||||
## Ziel
|
||||
|
||||
Leerer Startzustand der Formular-Zentrale.
|
||||
|
||||
Der Mitarbeiter hat noch kein Formular erstellt und soll ohne Erklaerballast direkt den naechsten sinnvollen Schritt sehen.
|
||||
|
||||
## Inhalt
|
||||
|
||||
- Seitentitel wie S00: `Formulare`
|
||||
- Ruhiger Empty State im Inhaltsbereich
|
||||
- Hauptaktion: `Neues Formular erstellen`
|
||||
- Sekundaere Aktion: optional `Vorlagen ansehen`
|
||||
- Kurzer Hinweis, dass Formulare spaeter veroeffentlicht, bearbeitet und ausgewertet werden koennen
|
||||
|
||||
## Verhalten
|
||||
|
||||
- Klick auf `Neues Formular erstellen` fuehrt zu [[04 S01 Formularart auswaehlen|S01 Formularart auswaehlen]].
|
||||
- Keine Kennzahl-Kacheln und keine Beispiel-Tabelle, weil noch nichts existiert.
|
||||
- Filter/Suche duerfen sichtbar bleiben oder reduziert wirken, aber nicht die Hauptaktion verdraengen.
|
||||
|
||||
## Subframe
|
||||
|
||||
Gebaut in Subframe:
|
||||
|
||||
https://app.subframe.com/f023064a5ca0/design/136c11b3-8310-4165-b4ba-9cf099ee0873/edit
|
||||
|
||||
+41
@@ -0,0 +1,41 @@
|
||||
---
|
||||
kind: screen
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
package: WF-D-FORM Form Builder
|
||||
id: E02
|
||||
screen: S00 Keine Treffer
|
||||
typ: Empty State
|
||||
umsetzung: Bauen
|
||||
status: Subframe Draft / Review offen
|
||||
route: /forms
|
||||
subframe: "https://app.subframe.com/f023064a5ca0/design/ccf8d2f7-e7b4-4ffd-87f6-1785edc1b2f7/edit"
|
||||
---
|
||||
|
||||
# E02 - S00 Keine Treffer
|
||||
|
||||
## Ziel
|
||||
|
||||
Zustand, wenn Suche, Statusfilter oder Artfilter keine passenden Formulare finden.
|
||||
|
||||
Der Nutzer soll verstehen: Die Formulare sind nicht weg, nur der aktuelle Filter ist zu eng.
|
||||
|
||||
## Inhalt
|
||||
|
||||
- S00-Grundlayout mit aktiver Suche/aktiven Filtern
|
||||
- Empty State im Tabellenbereich: `Keine passenden Formulare gefunden`
|
||||
- Aktion: `Filter zuruecksetzen`
|
||||
- Optionaler Hinweis auf die aktuelle Kombination, z. B. `Erstellt + Unveroeffentlicht + Lead`
|
||||
|
||||
## Verhalten
|
||||
|
||||
- `Filter zuruecksetzen` entfernt Suche und Filterchips.
|
||||
- `Neues Formular` bleibt erreichbar.
|
||||
- Der Zustand ist kein Fehler, sondern ein Such-/Filterergebnis.
|
||||
|
||||
## Subframe
|
||||
|
||||
Gebaut in Subframe:
|
||||
|
||||
https://app.subframe.com/f023064a5ca0/design/ccf8d2f7-e7b4-4ffd-87f6-1785edc1b2f7/edit
|
||||
|
||||
+85
@@ -0,0 +1,85 @@
|
||||
---
|
||||
kind: screen
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
package: WF-D-FORM Form Builder
|
||||
id: S01
|
||||
screen: Formularart auswaehlen
|
||||
typ: Einstieg / Auswahl
|
||||
umsetzung: Alternative bauen
|
||||
status: Subframe Draft / Review offen
|
||||
route: /forms/new
|
||||
subframe: "https://app.subframe.com/f023064a5ca0/design/c423ebcd-914f-4038-ab9f-7c2a745a8bec/edit"
|
||||
---
|
||||
|
||||
# S01 - Formularart auswaehlen
|
||||
|
||||
## Ziel
|
||||
|
||||
Nutzer startet nicht direkt im komplexen Builder, sondern entscheidet zuerst, welche Art Formular er erstellen will.
|
||||
|
||||
## Warum wichtig
|
||||
|
||||
Handwerker brauchen eine einfache Einstiegsfrage:
|
||||
|
||||
`Was moechtest du erstellen?`
|
||||
|
||||
Nicht:
|
||||
|
||||
`Welche Feldtypen, Actions, Logic und Mappings brauchst du?`
|
||||
|
||||
## Aufbau
|
||||
|
||||
Interne Seite mit vorhandenem `Default Page Layout`. Keine eigene Sidebar nachbauen.
|
||||
|
||||
Inhalt:
|
||||
|
||||
- Titel: `Neues Formular erstellen`
|
||||
- Kurzer Untertitel: `Waehle aus, wofuer das Formular gedacht ist. Du kannst spaeter alles anpassen.`
|
||||
- Vier Auswahlkarten
|
||||
- Unten nur `Abbrechen` und `Weiter`
|
||||
|
||||
Entscheidung 2026-07-08: Weniger ist hier besser. Keine separate Vorlagenzeile und keine `Auswaehlen`-Buttons in jeder Karte, weil das die gleiche Entscheidung doppelt aufmacht.
|
||||
|
||||
## Auswahlkarten
|
||||
|
||||
| Karte | Kurzbeschreibung | Danach |
|
||||
|---|---|---|
|
||||
| Website / Extern | Kunden fuellen es per Website, Link oder QR-Code aus. | Oeffnet [[05 S02 Einfacher Fragen Editor|S02]] mit Website-/Extern-Vorlage. |
|
||||
| Lead-Formular | Neue Anfragen landen direkt als Lead in der Pipeline. | Oeffnet [[05 S02 Einfacher Fragen Editor|S02]] mit aktiver Lead-Verknuepfung. |
|
||||
| Fragebogen / Umfrage | Feedback sammeln und Antworten spaeter auswerten. | Oeffnet [[05 S02 Einfacher Fragen Editor|S02]] mit Umfrage-Startfragen. |
|
||||
| Internes Formular | Meldungen und Anfragen fuer Mitarbeitende. | Oeffnet [[05 S02 Einfacher Fragen Editor|S02]] mit interner Formularvorlage. |
|
||||
|
||||
Arbeitsentscheidung 2026-07-08: S02 ist der Haupt-Editor fuer alle vier Formulararten. S01B/S01C/S01D/S01E bleiben nur spaetere Varianten bzw. Referenzseiten.
|
||||
|
||||
## Lead-Formular Verhalten
|
||||
|
||||
Wenn `Lead-Formular` gewaehlt wird:
|
||||
|
||||
- Startfragen werden vorgeschlagen: Name, Telefon, Email, Bereich, Nachricht, Datei/Bild.
|
||||
- Nach Submit wird automatisch ein Lead angelegt.
|
||||
- Nutzer muss kein Mapping bauen.
|
||||
- Im Editor erscheint nur ein ruhiger Hinweis: `Antworten werden automatisch als Lead gespeichert.`
|
||||
- Pipeline/Ziel kann spaeter unter `Einstellungen` geaendert werden.
|
||||
|
||||
## Was nicht sichtbar sein soll
|
||||
|
||||
- Field Key
|
||||
- Webhook
|
||||
- Mapping
|
||||
- Automation-Trigger
|
||||
- komplexe Logic
|
||||
- Rechte-/Permission-Begriffe
|
||||
|
||||
## Subframe-Hinweis
|
||||
|
||||
Gebaut in Subframe:
|
||||
|
||||
https://app.subframe.com/f023064a5ca0/design/c423ebcd-914f-4038-ab9f-7c2a745a8bec/edit
|
||||
|
||||
Qualitaetsregel:
|
||||
|
||||
- Nutzt das vorhandene `Default Page Layout`.
|
||||
- Keine eigene Sidebar oder Header-Navigation.
|
||||
- Liegt im selben Flow neben `ADV-S01-2 Form-Builder Canvas 2`.
|
||||
- Ersetzt nicht S04 Public Form, sondern liegt vor dem Builder.
|
||||
+185
@@ -0,0 +1,185 @@
|
||||
---
|
||||
kind: screen
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
package: WF-D-FORM Form Builder
|
||||
id: S02
|
||||
screen: Einfacher Fragen Editor
|
||||
typ: Simple Builder Alternative
|
||||
umsetzung: Alternative bauen
|
||||
status: Subframe Draft / Review offen
|
||||
route: /forms/:id/edit
|
||||
subframe: "https://app.subframe.com/f023064a5ca0/design/181aaa0f-5ae7-4f74-acf7-8273fbbe4dd5/edit"
|
||||
---
|
||||
|
||||
# S02 - Einfacher Fragen Editor
|
||||
|
||||
## Ziel
|
||||
|
||||
Google-Forms-artiger Editor fuer Handwerksbetriebe: Formularname oben, darunter einzelne Fragekarten. Nutzer fuegt Fragen hinzu, waehlt einen Fragetyp und veroeffentlicht.
|
||||
|
||||
## Leitidee
|
||||
|
||||
Der Nutzer soll denken:
|
||||
|
||||
`Ich schreibe Fragen auf.`
|
||||
|
||||
Nicht:
|
||||
|
||||
`Ich konfiguriere ein Datenmodell.`
|
||||
|
||||
## Aufbau
|
||||
|
||||
Interne Seite mit vorhandenem `Default Page Layout`. Keine eigene Sidebar nachbauen.
|
||||
|
||||
Screen-Zonen:
|
||||
|
||||
- Kopfzeile: Formularname, Status, Speichern, Vorschau, Veroeffentlichen.
|
||||
- Schmale Tabs: Fragen, Design, Antworten.
|
||||
- Mittelspalte: Formular-Titelkarte und Fragekarten.
|
||||
- Rechte Mini-Werkzeugleiste: Frage hinzufuegen, vorhandene Frage/Block, Text, Bild, Datei/Upload, Medien/Video, Abschnitt und Mehr.
|
||||
- Keine dauerhafte linke Palette.
|
||||
- Kein dauerhafter rechter Inspector.
|
||||
- Bei Lead-Formularen erscheint zusaetzlich eine ruhige Card `Felder zuweisen`, damit sichtbar ist, welche Formularfrage in welches Lead-Feld geschrieben wird.
|
||||
|
||||
## Fragekarte
|
||||
|
||||
Eine aktive Fragekarte zeigt:
|
||||
|
||||
- Fragetitel
|
||||
- Fragetyp-Dropdown nach Google-Forms-Logik; zeigt immer den aktuell gewaehlten Typ, z. B. `Multiple-Choice-Frage`, nicht den Placeholder `Fragetyp`.
|
||||
- optional Bild-Button
|
||||
- mehrere Antwortoptionen als eigene Zeilen/Eingaben
|
||||
- Button `Option hinzufuegen`
|
||||
- Button `Sonstiges hinzufuegen`, wenn passend
|
||||
- Duplizieren
|
||||
- Loeschen
|
||||
- Pflichtfrage Toggle
|
||||
- Drei-Punkte-Menue fuer Beschreibung, Bedingung, Validierung
|
||||
|
||||
## Fragetyp-Dropdown
|
||||
|
||||
| Gruppe | Typen |
|
||||
|---|---|
|
||||
| Text | Kurzantwort, Absatz |
|
||||
| Auswahl | Multiple-Choice-Frage, Mehrfachauswahl, Drop-down |
|
||||
| Medien | Datei oder Bild hochladen |
|
||||
| Datum/Zeit | Datum, Zeit |
|
||||
|
||||
Email, Telefon und Name werden im Lead-Formular als vorbereitete Startfragen angezeigt, nicht als laute Profi-Auswahl.
|
||||
|
||||
Nicht im aktuellen Hauptdropdown: Lineare Skala, Bewertung, Multiple-Choice-Raster und Kaestchenraster. Diese Typen werden nicht als eigene S02-Zustaende gebaut.
|
||||
|
||||
## Multiple Choice Verhalten
|
||||
|
||||
Wenn Nutzer `Multiple-Choice-Frage` waehlt:
|
||||
|
||||
- Antwortoptionen erscheinen direkt in der Fragekarte.
|
||||
- Erste Option heisst `Option 1`.
|
||||
- Nutzer kann weitere Optionen darunter hinzufuegen.
|
||||
- `Sonstiges hinzufuegen` bleibt als Link sichtbar.
|
||||
- Pflichtfrage ist ein Toggle unten rechts.
|
||||
- Publish blockiert, wenn keine Option vorhanden ist.
|
||||
|
||||
## Mehrfachauswahl
|
||||
|
||||
Wie Multiple Choice, aber mehrere Antworten sind erlaubt.
|
||||
|
||||
Copy im Dropdown: `Mehrfachauswahl`, weil das fuer Handwerker verstaendlicher ist.
|
||||
|
||||
## Einfache Logic
|
||||
|
||||
Logic wird nicht als eigener Profi-Modus gezeigt.
|
||||
|
||||
In der Fragekarte gibt es im Drei-Punkte-Menue:
|
||||
|
||||
- `Bedingung hinzufuegen`
|
||||
|
||||
Danach oeffnet sich ein kleiner Bereich unter der Frage:
|
||||
|
||||
`Wenn Antwort ist ... dann Frage anzeigen ...`
|
||||
|
||||
Mehr nicht in der Hauptansicht.
|
||||
|
||||
## Lead-Formular Hinweis und Felder zuweisen
|
||||
|
||||
Wenn Formularart `Lead-Formular` ist:
|
||||
|
||||
- Oben unter dem Titel erscheint ein dezenter Hinweis:
|
||||
`Lead-Verknuepfung`, Badge `Aktiv`, Beschreibung `Neue Antworten werden als Lead gespeichert - Pipeline: Vertrieb SHK`.
|
||||
- Die Hinweis-Card nutzt dasselbe Layout wie der gruene `Lead anlegen`-Kasten: runder Icon-Hintergrund links, Titel/Beschreibung in der Mitte, Aktionen rechts.
|
||||
- Rechts stehen `Felder zuweisen` als normale Aktion und `Deaktivieren` als kleine Tertiary-Aktion.
|
||||
- Klick auf `Felder zuweisen` fuehrt in den Zustand [[05b S02L Lead Felder zuweisen]].
|
||||
- Wenn Publish wegen fehlender Zuweisung blockiert, fuehrt der Sprung in [[05c E05 S02 Lead Zuweisung pruefen]].
|
||||
|
||||
Das ist kein Profi-Mapping-Panel, sondern eine verstaendliche Zuweisung im gleichen Look wie der Editor.
|
||||
|
||||
## Lead deaktivieren
|
||||
|
||||
Nutzer muessen kein neues Formular erstellen, nur weil die Lead-Erstellung nicht mehr gewuenscht ist.
|
||||
|
||||
Entscheidung:
|
||||
|
||||
- Die Aktion `Deaktivieren` kann die Lead-Erstellung im bestehenden Formular ausschalten.
|
||||
- Das Formular bleibt bestehen und sammelt weiter normale Antworten.
|
||||
- Bereits erzeugte Leads bleiben erhalten.
|
||||
- Neue Einsendungen erzeugen nach dem Ausschalten keinen neuen Lead mehr.
|
||||
- Die bisherigen Zuweisungen bleiben gespeichert, damit sie beim erneuten Aktivieren wieder vorgeschlagen werden koennen.
|
||||
- Wenn das Formular bereits veroeffentlicht ist, sollte beim Ausschalten ein kurzer Confirm-Hinweis erscheinen: `Neue Antworten werden dann nicht mehr als Lead gespeichert. Bereits erzeugte Leads bleiben erhalten.`
|
||||
- Im Draft ohne bisherige Antworten darf `Deaktivieren` direkt umschalten.
|
||||
|
||||
| Lead-Feld | Standard-Zuweisung | Verhalten |
|
||||
|---|---|---|
|
||||
| Name | `Ihr Name` | Pflicht, Kurzantwort. |
|
||||
| Kontakt | `Telefon` oder `Email` | Mindestens eins muss zugewiesen sein. |
|
||||
| Beschreibung | `Beschreibung Ihres Anliegens` | Pflicht, Absatz oder Kurzantwort. |
|
||||
| Bereich | `Um welchen Bereich geht es?` | Optional, Dropdown/Multiple Choice passt. |
|
||||
| Dateien / Bilder | `Fotos hochladen` | Optional, nur Datei/Bild-Felder passen. |
|
||||
| Quelle | automatisch `Formular` | Nicht als Formularfrage noetig. |
|
||||
| Pipeline | `Neue Anfragen` | Dropdown-Vorlage nutzen, kein Freitext. |
|
||||
|
||||
Jede Zeile nutzt die gleiche Dropdown-Vorlage: links das Lead-Feld, rechts ein Dropdown mit passenden Formularfragen. Nicht passende Formularfragen werden deaktiviert oder mit Hinweis gezeigt, z. B. `Fotos hochladen - passt nicht zu Email`.
|
||||
|
||||
Wenn ein Pflichtfeld nicht zuweisbar ist:
|
||||
|
||||
- Zeile zeigt Inline-Fehler.
|
||||
- Banner oben: `2 Zuweisungen pruefen, bevor du veroeffentlichst.`
|
||||
- Primaeraktion: `Passende Frage hinzufuegen`.
|
||||
- Publish bleibt blockiert, bis die Pflichtzuweisung passt.
|
||||
|
||||
Details dazu liegen in [[05b S02L Lead Felder zuweisen]] und [[05c E05 S02 Lead Zuweisung pruefen]].
|
||||
|
||||
## Logic, Actions und Publish-Blocker
|
||||
|
||||
S02 ist der Haupt-Editor fuer normale Nutzer. Deshalb werden Logic, Actions und Publish-Blocker nicht als eigene Profi-Seiten in den Hauptfluss gezogen.
|
||||
|
||||
| Thema | Entscheidung fuer S02 | Warum |
|
||||
|---|---|---|
|
||||
| Logic | Nur als einfache `Bedingung` direkt an der Frage. | Nutzer soll nicht in einen Regel-Editor springen muessen. |
|
||||
| Actions | `Nach Absenden` bleibt im Screen. Bei Lead-Formularen ist `Lead anlegen` aktiv und zeigt `Felder zuweisen`. | Kein Automation-Editor, aber die wichtigste Lead-Zuordnung ist sichtbar. |
|
||||
| Publish-Blocker | Einfacher Banner/Popover im selben Screen mit Sprung zur betroffenen Frage. | Verstaendlich genug, kein eigener Screen noetig. |
|
||||
|
||||
D07, D08 und D09 bleiben als Advanced-/Referenzseiten fuer spaeter oder fuer David, falls er die Detailtiefe sehen will. Fuer den aktuellen S02-Hauptfluss sind sie nicht notwendig. Die Lead-Zuweisung ist aber nicht mehr nur Hintergrundlogik, sondern ein eigener S02-Zustand.
|
||||
|
||||
## Publish
|
||||
|
||||
Bei Klick auf `Veroeffentlichen`:
|
||||
|
||||
- Wenn alles passt: Toast und Status `Veroeffentlicht`.
|
||||
- Wenn etwas fehlt: einfacher Banner oben:
|
||||
`Noch 2 Dinge fehlen, bevor du veroeffentlichen kannst.`
|
||||
- Sprungziele gehen direkt zur betroffenen Frage.
|
||||
|
||||
## Subframe-Hinweis
|
||||
|
||||
Gebaut in Subframe:
|
||||
|
||||
https://app.subframe.com/f023064a5ca0/design/181aaa0f-5ae7-4f74-acf7-8273fbbe4dd5/edit
|
||||
|
||||
Qualitaetsregel:
|
||||
|
||||
- Nutzt das vorhandene `Default Page Layout`.
|
||||
- Keine eigene Sidebar oder Header-Navigation.
|
||||
- Liegt im selben Flow neben `ADV-S01-2 Form-Builder Canvas 2`.
|
||||
- Nah an Google Forms, aber mit HiveGrid-Komponenten.
|
||||
- Lead-Verknuepfung bleibt einfach sichtbar. `Felder zuweisen` wird als einfacher S02-Zustand gezeigt, nicht als Advanced-Mapping.
|
||||
+103
@@ -0,0 +1,103 @@
|
||||
---
|
||||
kind: screen-state
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
package: WF-D-FORM Form Builder
|
||||
id: S02L
|
||||
screen: Lead Felder zuweisen
|
||||
typ: S02-Zustand / Lead Editor
|
||||
umsetzung: Subframe Draft
|
||||
status: Subframe Draft / Review offen
|
||||
route: /forms/:id/edit
|
||||
subframe: "https://app.subframe.com/f023064a5ca0/design/c8aa80cb-0cc8-473f-9fac-a09d395e6571/edit"
|
||||
---
|
||||
|
||||
# S02L - Lead Felder zuweisen
|
||||
|
||||
## Ziel
|
||||
|
||||
Lead-Formulare sollen nicht wie ein versteckter Automation-Editor wirken, aber Nutzer muessen sehen koennen, welche Formularfrage in welches Lead-Feld geschrieben wird.
|
||||
|
||||
Dieser Zustand liegt im gleichen Editor-Look wie S02: gleiche Kopfzeile, gleiche Tabs, gleiche Breite, gleiche Card-Sprache.
|
||||
|
||||
## Einstieg
|
||||
|
||||
S02 oeffnet diesen Zustand, wenn:
|
||||
|
||||
- Formularart `Lead-Formular` gewaehlt wurde.
|
||||
- Nutzer auf `Felder zuweisen` klickt.
|
||||
- Publish erkennt, dass eine Lead-Zuweisung fehlt.
|
||||
- Nutzer eine Frage loescht oder den Fragetyp aendert, die bereits zugewiesen war.
|
||||
|
||||
## Aufbau
|
||||
|
||||
- Header wie S02: Formularname, Status, Speichern, Vorschau, Veroeffentlichen.
|
||||
- Tabs wie S02: Fragen, Design, Antworten.
|
||||
- Hinweis-Card: `Lead-Verknuepfung`, Badge `Aktiv`, Beschreibung `Neue Antworten werden als Lead gespeichert - Pipeline: Neue Anfragen`.
|
||||
- Die Hinweis-Card nutzt dasselbe Layout wie der gruene `Lead anlegen`-Kasten: runder Icon-Hintergrund links, Titel/Beschreibung in der Mitte, kleine Aktion `Deaktivieren` rechts.
|
||||
- Card `Felder zuweisen`
|
||||
- Optional kleine Vorschau: `So wird daraus ein Lead`
|
||||
|
||||
## Felder-zuweisen-Card
|
||||
|
||||
Jede Zeile nutzt dieselbe Dropdown-Vorlage:
|
||||
|
||||
| Lead-Feld | Dropdown-Wert | Pflicht | Hinweis |
|
||||
|---|---|---|---|
|
||||
| Name | `Ihr Name` | ja | Kurzantwort. |
|
||||
| Telefon | `Telefonnummer` | ja, wenn keine Email | Kurzantwort mit Telefon-Bedeutung. |
|
||||
| Email | `Email-Adresse` | ja, wenn kein Telefon | Kurzantwort mit Email-Bedeutung. |
|
||||
| Beschreibung | `Beschreibung Ihres Anliegens` | ja | Absatz oder Kurzantwort. |
|
||||
| Bereich | `Um welchen Bereich geht es?` | nein | Auswahlfrage passt gut. |
|
||||
| Datei / Bild | `Fotos hochladen` | nein | Nur Datei/Bild-Feld. |
|
||||
| Pipeline | `Neue Anfragen` | ja | Dropdown aus Pipeline-Vorlage, kein Freitext. |
|
||||
| Lead-Quelle | `Formular` | automatisch | Nicht editierbar im normalen Flow. |
|
||||
|
||||
## Dropdown-Regel
|
||||
|
||||
Dropdowns zeigen nur sinnvolle Optionen prominent.
|
||||
|
||||
Nicht passende Optionen sind entweder:
|
||||
|
||||
- gar nicht sichtbar, wenn es dadurch einfacher wird;
|
||||
- oder disabled sichtbar mit kurzer Begruendung, wenn David den Fehlerfall sichtbar pruefen will.
|
||||
|
||||
Beispiele:
|
||||
|
||||
| Ziel | Nicht moegliche Option | Warum |
|
||||
|---|---|---|
|
||||
| Email | `Fotos hochladen` | Datei kann nicht als Email gespeichert werden. |
|
||||
| Telefon | `Beschreibung Ihres Anliegens` | Langer Text passt nicht als Telefonnummer. |
|
||||
| Datei / Bild | `Ihr Name` | Textfeld ist keine Datei. |
|
||||
| Pipeline | `Um welchen Bereich geht es?` | Pipeline kommt aus Systemvorlage, nicht aus Formularantwort. |
|
||||
|
||||
## Aktionen
|
||||
|
||||
- `Zuweisung aendern` ueber Dropdown.
|
||||
- `Passende Frage hinzufuegen` erstellt eine neue Frage und weist sie direkt zu.
|
||||
- `Automatisch zuweisen` versucht anhand von Name, Email, Telefon, Beschreibung und Datei passende Fragen zu erkennen.
|
||||
- `Ziel aendern` oeffnet Pipeline-/Team-Dropdown, kein grosses Mapping-Modal.
|
||||
|
||||
## Verhalten
|
||||
|
||||
- Wenn Nutzer eine zugewiesene Frage loescht, bleibt die Lead-Zeile sichtbar und wechselt auf Fehler.
|
||||
- Wenn Nutzer den Fragetyp aendert und der Typ nicht mehr passt, wird die Zuweisung geloest oder als `passt nicht mehr` markiert.
|
||||
- Wenn Telefon und Email beide leer sind, blockiert Publish.
|
||||
- Wenn nur Telefon oder nur Email vorhanden ist, ist Publish erlaubt.
|
||||
- Wenn optionale Felder fehlen, Publish nicht blockieren.
|
||||
|
||||
## Subframe-Hinweis
|
||||
|
||||
Gebaut in Subframe:
|
||||
|
||||
https://app.subframe.com/f023064a5ca0/design/c8aa80cb-0cc8-473f-9fac-a09d395e6571/edit
|
||||
|
||||
Subframe-Name aktuell: `05b S02L Lead Felder zuweisen`.
|
||||
|
||||
Wichtig fuer Subframe:
|
||||
|
||||
- Gleiches Page Layout wie S02.
|
||||
- Gleiche Card-Breite und gleiche Fragekarten-Sprache wie S02.
|
||||
- Dropdown-Vorlage verwenden, nicht eigene Select-Optik erfinden.
|
||||
- Keine Tabellenoptik wie Advanced-Mapping.
|
||||
- Bei der finalen Sichtpruefung in Subframe kontrollieren, ob das vorhandene `Default Page Layout` aktiv ist.
|
||||
+93
@@ -0,0 +1,93 @@
|
||||
---
|
||||
kind: state
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
package: WF-D-FORM Form Builder
|
||||
id: E05
|
||||
screen: S02 Lead Zuweisung pruefen
|
||||
typ: Lead Mapping Error State
|
||||
umsetzung: Subframe Draft
|
||||
status: Subframe Draft / Review offen
|
||||
route: /forms/:id/edit
|
||||
subframe: "https://app.subframe.com/f023064a5ca0/design/26600ce4-7baf-4ffb-9955-7c7d1eef99d1/edit"
|
||||
---
|
||||
|
||||
# E05 - S02 Lead Zuweisung pruefen
|
||||
|
||||
## Ziel
|
||||
|
||||
Wenn eine Lead-Zuweisung nicht moeglich ist, soll der Nutzer direkt verstehen, was nicht passt und wie er es behebt.
|
||||
|
||||
Dieser Zustand ist kein Modal und kein eigener Advanced-Editor. Er ist derselbe S02/S02L-Screen mit Fehlerbanner und markierten Zeilen.
|
||||
|
||||
## Wann tritt der Zustand auf?
|
||||
|
||||
- Pflichtfeld `Name` ist nicht zugewiesen.
|
||||
- Weder `Telefon` noch `Email` ist zugewiesen.
|
||||
- `Beschreibung` fehlt.
|
||||
- Eine zugewiesene Frage wurde geloescht.
|
||||
- Eine Frage wurde in einen unpassenden Fragetyp geaendert.
|
||||
- Ein Feld ist technisch nicht kompatibel, z. B. Datei zu Email.
|
||||
|
||||
## Aufbau
|
||||
|
||||
- Banner oben in S02/S02L:
|
||||
`3 Zuweisungen pruefen, bevor du veroeffentlichst.`
|
||||
- Darunter Sprunglinks:
|
||||
`Name zuweisen`, `Kontakt zuweisen`, `Beschreibung zuweisen`
|
||||
- In der Card `Felder zuweisen` sind betroffene Zeilen markiert.
|
||||
- Jede fehlerhafte Zeile hat eine kurze Message.
|
||||
|
||||
## Fehlermatrix
|
||||
|
||||
| Fall | Message | Aktion |
|
||||
|---|---|---|
|
||||
| Name fehlt | `Waehle eine Frage fuer den Lead-Namen aus.` | Dropdown oeffnen oder `Passende Frage hinzufuegen`. |
|
||||
| Kein Kontaktweg | `Weise Telefon oder Email zu, damit der Lead kontaktierbar ist.` | Telefon-/Email-Zeile fokussieren. |
|
||||
| Beschreibung fehlt | `Waehle die Frage, die als Lead-Beschreibung gespeichert wird.` | Dropdown oeffnen. |
|
||||
| Typ passt nicht | `Dieses Formularfeld passt nicht zu diesem Lead-Feld.` | Andere Frage waehlen. |
|
||||
| Frage geloescht | `Die bisherige Frage existiert nicht mehr.` | Neue Frage waehlen oder erstellen. |
|
||||
|
||||
## Nicht moegliche Optionen
|
||||
|
||||
Im Dropdown koennen nicht moegliche Optionen disabled erscheinen:
|
||||
|
||||
```text
|
||||
Fotos hochladen
|
||||
Nicht moeglich fuer Email
|
||||
```
|
||||
|
||||
Oder:
|
||||
|
||||
```text
|
||||
Beschreibung Ihres Anliegens
|
||||
Nicht moeglich fuer Telefon
|
||||
```
|
||||
|
||||
Wenn zu viele disabled Optionen verwirren, nur passende Optionen anzeigen und darunter den Link `Warum sehe ich nicht alle Fragen?`.
|
||||
|
||||
## Publish-Regel
|
||||
|
||||
Publish bleibt blockiert, solange:
|
||||
|
||||
- Name fehlt.
|
||||
- Kontaktweg fehlt.
|
||||
- Beschreibung fehlt.
|
||||
- eine aktive Pflichtzuweisung ungueltig ist.
|
||||
|
||||
Publish darf durchgehen, wenn:
|
||||
|
||||
- optionale Lead-Felder fehlen;
|
||||
- Datei/Bild nicht zugewiesen ist;
|
||||
- Bereich nicht zugewiesen ist;
|
||||
- nur ein Kontaktweg vorhanden ist.
|
||||
|
||||
## Subframe-Hinweis
|
||||
|
||||
Gebaut in Subframe:
|
||||
|
||||
https://app.subframe.com/f023064a5ca0/design/26600ce4-7baf-4ffb-9955-7c7d1eef99d1/edit
|
||||
|
||||
Subframe-Name aktuell: `05c E05 S02 Lead Zuweisung pruefen`.
|
||||
|
||||
Bei der finalen Sichtpruefung in Subframe kontrollieren, ob das vorhandene `Default Page Layout` aktiv ist, damit der Zustand wie S02/S02L im vorhandenen App-Rahmen liegt.
|
||||
+59
@@ -0,0 +1,59 @@
|
||||
---
|
||||
kind: screen
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
package: WF-D-FORM Form Builder
|
||||
id: S03
|
||||
screen: Formular Design
|
||||
typ: Builder Tab
|
||||
umsetzung: Bauen
|
||||
status: Subframe Draft / Review offen
|
||||
route: /forms/:id/edit
|
||||
subframe: "https://app.subframe.com/f023064a5ca0/design/090f06a9-3fa7-4442-b8bc-035e95de7329/edit"
|
||||
---
|
||||
|
||||
# S03 - Formular Design
|
||||
|
||||
## Ziel
|
||||
|
||||
Design-Tab fuer ein konkretes Formular.
|
||||
|
||||
Hier veraendert der Mitarbeiter nicht die Fragen, sondern die Darstellung des oeffentlichen Formulars.
|
||||
|
||||
## Inhalt
|
||||
|
||||
- Formularname `Website-Anfrage`
|
||||
- Tabs:
|
||||
- Fragen
|
||||
- Design
|
||||
- Antworten
|
||||
- Hilfetext: `Logo, Farben und Darstellung des oeffentlichen Formulars anpassen.`
|
||||
- Einstellungen:
|
||||
- Logo hochladen
|
||||
- Akzentfarbe
|
||||
- Theme / Schrift
|
||||
- Formularbreite
|
||||
- Hintergrund
|
||||
- Button-Text
|
||||
- Datenschutz-Hinweis
|
||||
- Live-Vorschau der Kundensicht als Formular-Card
|
||||
|
||||
## Verhalten
|
||||
|
||||
- Aenderungen sollen sofort in der Live-Vorschau sichtbar werden.
|
||||
- `Vorschau` oeffnet die Public-Ansicht.
|
||||
- `Veroeffentlichen` bleibt in der Topbar erreichbar.
|
||||
- Kein eigener `Teilen`-Tab; Link/QR/Einbettung gehoeren in den Veroeffentlichen-/Public-Link-Kontext.
|
||||
- Keine Logic- oder Antwortbearbeitung in diesem Tab.
|
||||
|
||||
## Subframe
|
||||
|
||||
Gebaut in Subframe:
|
||||
|
||||
https://app.subframe.com/f023064a5ca0/design/090f06a9-3fa7-4442-b8bc-035e95de7329/edit
|
||||
|
||||
Qualitaetsregel:
|
||||
|
||||
- Nutzt das vorhandene `Default Page Layout`.
|
||||
- Keine eigene Sidebar oder Header-Navigation.
|
||||
- Design ist bewusst einfach gehalten, nicht wie ein Profi-Theme-Editor.
|
||||
+268
@@ -0,0 +1,268 @@
|
||||
---
|
||||
kind: screen
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
package: WF-D-FORM Form Builder
|
||||
id: S04
|
||||
screen: Oeffentliches Formular
|
||||
typ: Public Form
|
||||
umsetzung: Bauen
|
||||
status: Subframe Draft / Review offen
|
||||
route: /f/{tenant}/{slug}
|
||||
subframe: "https://app.subframe.com/f023064a5ca0/design/caef9ddd-03d6-4a26-8dc1-16aa198a7304/edit"
|
||||
---
|
||||
|
||||
# S04 - Oeffentliches Formular
|
||||
|
||||
## Ziel
|
||||
|
||||
Externe Nutzer reichen ein Formular ohne App-Shell ein. Das Formular wirkt vertrauenswuerdig, klar, mobil nutzbar und tenant-gebrandet.
|
||||
|
||||
## Pattern / Archetyp
|
||||
|
||||
BESPOKE-Public.
|
||||
|
||||
Nutzt A4-Feldtypen als Renderer und A7-Zustaende fuer Public Loading/Error.
|
||||
|
||||
## Public-Arbeitsbereiche
|
||||
|
||||
Dies ist keine App-Shell. Der Submitter sieht nur das Formular und die noetige Orientierung.
|
||||
|
||||
| Bereich | Zweck |
|
||||
|---|---|
|
||||
| Branding-Kopf | Tenant-Logo, optional kurzer Dbsendername. |
|
||||
| Formular-Intro | Titel, Beschreibung, ggf. Vertrauen/Datenschutz-Kurztext. |
|
||||
| Feldbereich | Gerenderte Felder mit Conditional Logic. |
|
||||
| Datenschutz / Captcha | Datenschutz-Zustimmung und mCaptcha nahe am Submit, nicht als Fremdkoerper. |
|
||||
| Submit-Bereich | Button, Pflichtfeldhinweis, allgemeiner Fehler. |
|
||||
| Footer | minimal: Datenschutz/Anbieter-Link falls vorgesehen. |
|
||||
|
||||
Empfehlung: Public Form soll eher wie ein ruhiges Kundenformular wirken, nicht wie eine Mini-Version der HiveGrid-App.
|
||||
|
||||
## Detail-Brainstorming S04
|
||||
|
||||
Status: Arbeitsentwurf fuer David. Noch nicht final abgehakt.
|
||||
|
||||
Das Public Form ist kein internes HiveGrid-UI. Es muss fuer Endkunden, Monteure, Bewerber oder Mitarbeiter funktionieren, die den Kontext nicht kennen. Deshalb zaehlen Vertrauen, Lesbarkeit, Mobile und Fehlerklarheit mehr als App-Dichte.
|
||||
|
||||
### Layout-Optionen
|
||||
|
||||
| Option | Aufbau | Vorteil | Risiko | Empfehlung |
|
||||
|---|---|---|---|---|
|
||||
| D | Zentrierte Formularseite mit Branding-Kopf, Intro, Feldbereich, Submit, Footer. | Ruhig, erwartbar, gut mobil. | Bei sehr langen Formularen braucht es gute Abstaende/Abschnitte. | Empfohlen. |
|
||||
| B | App-nahe Seite mit Sidebar/Topbar. | Wiederverwendet internes Muster. | Wirkt falsch fuer externe Nutzer, zu viel HiveGrid-Kontext. | Raus. |
|
||||
| C | Fullscreen-Karten pro Abschnitt/Step. | Sehr gefuehrt. | Multi-Step ist v2 bzw. nicht D-FORM v1. | Spaeter. |
|
||||
|
||||
Arbeitsentscheidung: S04 ist eine **Public Landing/Form-Seite ohne App-Shell**. Kein Sidebar, keine interne Navigation, keine Tabellen, keine internen Modulbegriffe.
|
||||
|
||||
### Empfohlener Seitenaufbau
|
||||
|
||||
| Bereich | Inhalt | Verhalten |
|
||||
|---|---|---|
|
||||
| Public Header | Tenant-Logo/Fallback, optional Anbietername. | Kleiner als App-Header, nicht dominant. |
|
||||
| Formular-Intro | Form-Titel, Beschreibung, ggf. kurzer Datenschutz-/Hinweistext. | Nur sichtbare Public Copy, keine internen Labels. |
|
||||
| Progress/Abschnittshinweis | Nur falls lange Form oder Content Blocks vorhanden. | Kein echter Multi-Step in v1. |
|
||||
| Felder | Gerenderte Feldtypen in Reihenfolge. | Conditional Logic blendet Felder live ein/aus. |
|
||||
| Datei-/Foto-Bereich | Upload mit Status, Fehler, Retry. | Mobile besonders pruefen. |
|
||||
| Datenschutz | Pflicht-Checkbox mit Link zur Datenschutzerklaerung. | Direkt vor Captcha/Submit, damit Zustimmung bewusst passiert. |
|
||||
| Captcha | mCaptcha nahe am Submit. | Sichtbar, aber nicht lauter als Formular. |
|
||||
| Submit-Bereich | Pflichtfeldhinweis, Submit-Button, allgemeiner Fehler. | Sticky Button nur optional fuer sehr lange mobile Forms. |
|
||||
| Footer | Datenschutz/Anbieter-Link, optional "powered by" falls gewuenscht. | Dezent. |
|
||||
|
||||
### Public-Copy-Regeln
|
||||
|
||||
| Regel | Beispiel / Bedeutung |
|
||||
|---|---|
|
||||
| Keine internen Begriffe | Nicht "Submission", "Action", "Lead", "Projekt", "Webhook". |
|
||||
| Fehler sagen, was zu tun ist | "Bitte pruefen Sie die markierten Felder." statt "Validation failed". |
|
||||
| Submit-Vertrauen sichern | Nach Klick klar zeigen: wird gesendet, angekommen, Fehler. |
|
||||
| Datenschutz kurz halten | Optionaler Link oder kurzer Satz, kein langer Rechtstext im Hauptfluss. |
|
||||
| Anbieter statt HiveGrid in den Vordergrund | Tenant-Branding zuerst, HiveGrid nur optional klein. |
|
||||
|
||||
## Detail: Public Field Rendering
|
||||
|
||||
| Feldtyp | Public-Darstellung | Mobile-Hinweis | Fehler |
|
||||
|---|---|---|---|
|
||||
| Text | Einzeiliges Eingabefeld. | Volle Breite, passende Tastatur. | Pflicht, min/max, Regex. |
|
||||
| Textarea | Mehrzeiliges Eingabefeld. | Hoehe nicht zu klein, lange Texte erhalten. | Pflicht, min/max. |
|
||||
| Zahl | Zahleneingabe. | Numerische Tastatur. | min/max, falsches Format. |
|
||||
| Waehrung | Betrag mit Waehrungsformat. | Kein winziger Prefix; klare Einheit. | min/max, ungueltiger Betrag. |
|
||||
| Datum | Date Picker oder natives Datum. | Native mobile Eingabe bevorzugt. | min/max Datum. |
|
||||
| Datum-Range | Start/Ende als Paar. | Untereinander auf mobile. | Ende vor Start. |
|
||||
| Select | Dropdown oder Radio je Optionenmenge. | Grosse Touch-Ziele. | Pflicht ohne Auswahl. |
|
||||
| Multi-Select | Checkboxen oder Chips. | Keine zu kleinen Chips. | min/max Auswahl. |
|
||||
| Boolean | Checkbox/Toggle, ggf. Zustimmung. | Label klickbar. | Muss bestaetigt werden, falls Pflicht. |
|
||||
| Email | Email-Eingabe. | Email-Tastatur. | Email-Format. |
|
||||
| Telefon | Telefon-Eingabe. | Telefon-Tastatur. | Telefonnummer pruefen. |
|
||||
| Datei | Upload/Dropzone, mobile Kamera-Option wenn moeglich. | Foto aufnehmen/Datei waehlen klar trennen. | Typ, Groesse, Uploadfehler. |
|
||||
|
||||
### Feldgruppen / lange Formulare
|
||||
|
||||
| Fall | Empfehlung |
|
||||
|---|---|
|
||||
| Bis ca. 8 Felder | Einfache vertikale Form reicht. |
|
||||
| Viele Felder | Abschnittsueberschriften/visuelle Gruppen erlauben, aber kein Multi-Step erzwingen. |
|
||||
| Viele Pflichtfelder | Pflichtfeldhinweis oben und am Submit. |
|
||||
| Viele Datei-Felder | Upload-Status je Feld sehr klar machen. |
|
||||
|
||||
## Detail: Conditional Logic live
|
||||
|
||||
| Zustand | Public-Verhalten |
|
||||
|---|---|
|
||||
| Bedingung noch nicht erfuellt | Ziel-Feld nicht sichtbar, ohne leere Luecke. |
|
||||
| Bedingung erfuellt | Ziel-Feld erscheint ruhig, ideal ohne aggressive Dnimation. |
|
||||
| Bereits eingegebener Wert wird versteckt | Wert bleibt technisch erhalten oder wird klar behandelt; UI zeigt keine verwirrende Loeschung. |
|
||||
| Pflichtfeld wird versteckt | Es blockiert Submit nicht, solange es unsichtbar ist. |
|
||||
| Logic-Fehler in Public | Sollte intern verhindert werden; falls doch, Formular freundlich blockieren oder Feld normal anzeigen nach Fallback-Regel. |
|
||||
|
||||
Empfehlung: Public Logic soll nicht erklaeren, dass es "Conditional Logic" ist. Der Nutzer erlebt nur ein Formular, das passende Folgefragen zeigt.
|
||||
|
||||
## Detail: Submit-Flow
|
||||
|
||||
| Schritt | UI |
|
||||
|---|---|
|
||||
| Nutzer klickt Submit | Button zeigt Loading, Doppel-Submit verhindern. |
|
||||
| Feldfehler vorhanden | Springt/scrollt zum ersten Fehler und markiert Felder. |
|
||||
| Captcha fehlt | Fehler nahe Captcha, Werte bleiben erhalten. |
|
||||
| Datenschutz fehlt | Fehler an der Checkbox, Werte bleiben erhalten. |
|
||||
| Submit laeuft | Button disabled, kurzer Status. |
|
||||
| Submit erfolgreich | V01 Success oder Redirect. |
|
||||
| Submit fehlgeschlagen | V03 Fehlerbanner; Werte bleiben erhalten, Retry moeglich. |
|
||||
|
||||
### Submit-Button-Zustaende
|
||||
|
||||
| Zustand | Label / Verhalten |
|
||||
|---|---|
|
||||
| Normal | "Absenden" oder formularspezifisch, z. B. "Anfrage senden". |
|
||||
| Disabled | Wenn technisch noetig; Grund sichtbar, nicht nur grau. |
|
||||
| Loading | "Wird gesendet..." |
|
||||
| Retry | "Erneut senden" |
|
||||
|
||||
## Detail: Datei-/Foto-Upload Public
|
||||
|
||||
| Zustand | UI |
|
||||
|---|---|
|
||||
| Noch keine Datei | Upload-Flaeche mit erlaubten Typen/Groesse. |
|
||||
| Datei ausgewaehlt | Dateiname, Groesse, Entfernen. |
|
||||
| Upload laeuft | Progress je Datei. |
|
||||
| Upload erfolgreich | Bestaetigung am Feld. |
|
||||
| Uploadfehler | Klartext + Datei erneut waehlen. |
|
||||
| Mobile Foto | "Foto aufnehmen" und "Datei auswaehlen" falls moeglich. |
|
||||
|
||||
Wichtig: Datei-Fehler duerfen nicht erst nach komplettem Submit sichtbar werden, wenn technisch fruehere Pruefung moeglich ist.
|
||||
|
||||
## Detail: Public States
|
||||
|
||||
| Zustand | Screen / Variante | Notiz |
|
||||
|---|---|---|
|
||||
| Loading | S04 | Skeleton oder ruhiger Ladezustand. |
|
||||
| Ready | S04 | Formular sichtbar. |
|
||||
| Field Error | S04 | Inline, kein eigener Screen. |
|
||||
| Captcha Error | V03 | Public-Fehlerzustand, Werte behalten. |
|
||||
| Submit Error | V03 | Retry, keine technischen Details. |
|
||||
| Success | V01 | Dnkommen bestaetigen. |
|
||||
| Redirect | V01 | Weiterleitung klar ankündigen. |
|
||||
| Nicht verfuegbar | V02 | Formular nicht public/geschlossen/ungueltig. |
|
||||
|
||||
## Detail: Branding
|
||||
|
||||
| Element | Empfehlung |
|
||||
|---|---|
|
||||
| Tenant-Logo | Oben sichtbar, aber nicht riesig. |
|
||||
| Fallback | Anbietername oder neutraler Dvatar/Initialen. |
|
||||
| Farbe | Dezente Dccent-Farbe aus Tenant, keine komplette App-Theming-Komplexitaet. |
|
||||
| HiveGrid-Hinweis | Optional klein im Footer; nicht Hauptmarke. |
|
||||
| Datenschutz | Pflicht-Checkbox im Submit-Bereich plus Link oder kurzer Hinweis im Footer. |
|
||||
|
||||
## Detail: Datenschutz / Vertrauen
|
||||
|
||||
| Frage | UI-Antwort |
|
||||
|---|---|
|
||||
| Wer bekommt meine Daten? | Anbietername/Logo und kurzer Kontext. |
|
||||
| Was passiert nach Absenden? | Erfolgstext/Redirect aus Form-Konfiguration. |
|
||||
| Muss ich angemeldet sein? | Nein fuer Public v1; falls spaeter Login-Pflicht, eigener Zustand. |
|
||||
| Was, wenn ein Fehler passiert? | Werte behalten, Retry, Anbieter kontaktieren. |
|
||||
|
||||
## Daten
|
||||
|
||||
- Tenant-Logo oder Fallback-Branding.
|
||||
- Form-Titel und Beschreibung.
|
||||
- Gerenderte Felder in definierter Reihenfolge.
|
||||
- Conditional Logic fuer sichtbare/ausgeblendete Felder.
|
||||
- Pflichtfeld- und Validation-Regeln.
|
||||
- mCaptcha.
|
||||
- Submit-Button.
|
||||
- Erfolgstext oder Redirect-Ziel.
|
||||
|
||||
## Mobile-Prioritaet
|
||||
|
||||
Viele Public-Formular-Nutzer werden am Telefon sein. David sollte deshalb besonders pruefen:
|
||||
|
||||
- Feldabstaende und Fehlermeldungen bei schmaler Breite.
|
||||
- Datei-/Foto-Upload ohne App-Kontext.
|
||||
- Captcha sichtbar, aber nicht dominant.
|
||||
- Submit-Button nach langen Formularen gut erreichbar.
|
||||
- Success/Error-Zustaende ohne Scroll-Verwirrung.
|
||||
|
||||
## Aktionen
|
||||
|
||||
- Feldwerte eingeben.
|
||||
- Conditional Logic live ausloesen.
|
||||
- Datei/Foto hochladen, falls Feldtyp aktiv ist.
|
||||
- Captcha bestaetigen.
|
||||
- Formular absenden.
|
||||
- Nach Erfolg ggf. Redirect folgen.
|
||||
|
||||
## Banner / Hinweise
|
||||
|
||||
- Validation-Hinweise pro Feld.
|
||||
- Dllgemeiner Submit-Fehler, wenn die Einreichung nicht gespeichert werden kann.
|
||||
- Captcha-Hinweis, wenn Bot-Schutz fehlschlaegt.
|
||||
|
||||
## Toasts / Action-Feedback
|
||||
|
||||
- Keine klassischen App-Toasts. Public Form nutzt Inline-Feedback und Success-State.
|
||||
|
||||
## Meldungsentscheidung
|
||||
|
||||
| Ereignis | UI-Form | Blockiert? | Umsetzung | Copy/Notiz |
|
||||
|---|---|---|---|---|
|
||||
| Pflichtfeld fehlt | Inline am Feld | ja | Wiederverwenden | Klar und feldnah. |
|
||||
| Ungueltiges Format | Inline am Feld | ja | Wiederverwenden | Beispiel: Email-Ddresse pruefen. |
|
||||
| Captcha fehlt/fehlgeschlagen | Banner/Inline beim Captcha | ja | Bauen in V03 | Erneut versuchen. |
|
||||
| Submit erfolgreich | Success-State/Redirect | nein | Bauen in V01 | Anfrage ist angekommen. |
|
||||
| Public Form nicht verfuegbar | Blocker Screen | ja | Bauen in V02 | Kein technischer 404 fuer Endkunden. |
|
||||
|
||||
## Zustaende
|
||||
|
||||
| Zustand | Beschreibung | Umsetzung |
|
||||
|---|---|---|
|
||||
| Leer | Formular hat keine sichtbaren Felder; sollte intern verhindert werden. | Nur dokumentieren |
|
||||
| Laden | Public Form laedt. | Wiederverwenden |
|
||||
| Fehler | Public Form kann nicht geladen oder gesendet werden. | Bauen ueber V02/V03 |
|
||||
| Keine Berechtigung | Nicht relevant fuer Public; falls Login-Pflicht spaeter kommt, eigener Zustand. | Raus |
|
||||
| Captcha Error | Captcha oder Bot-Schutz blockiert Submit. | Bauen in V03 |
|
||||
| Erfolg | Submit wurde angenommen. | Bauen in V01 |
|
||||
|
||||
## Blockierende Error States
|
||||
|
||||
| Zustand | Was sieht der Nutzer? | Primaeraktion | Sekundare Aktion |
|
||||
|---|---|---|---|
|
||||
| Formular nicht veroeffentlicht | Ruhiger Public-Blocker. | Zur Website zurueck | Anbieter kontaktieren |
|
||||
| Formular geschlossen | Hinweis auf geschlossenen Dnnahmezeitraum. | Anbieter kontaktieren | - |
|
||||
| Submit dauerhaft fehlgeschlagen | Fehlerhinweis ohne technische Details. | Erneut versuchen | Anbieter kontaktieren |
|
||||
|
||||
## Permissions / Gates
|
||||
|
||||
- Keine eingeloggte Rolle noetig.
|
||||
- Public-Zugriff haengt an `is_public`, `status=published`, optional close/limit config und Spam-Schutz.
|
||||
|
||||
## Subframe
|
||||
|
||||
https://app.subframe.com/f023064a5ca0/design/caef9ddd-03d6-4a26-8dc1-16aa198a7304/edit
|
||||
|
||||
## Notizen
|
||||
|
||||
Dieser Renderer wird spaeter wiederverwendet fuer HR-Forms, Booking-Intake, Urlaub/Krank und Requests. Deshalb keine App-Shell, keine internen Admin-Begriffe, keine Tabellenlogik.
|
||||
|
||||
Public muss mobil sauber funktionieren, weil viele Endkunden und Monteure Formulare am Telefon ausfuellen.
|
||||
+42
@@ -0,0 +1,42 @@
|
||||
---
|
||||
kind: screen
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
package: WF-D-FORM Form Builder
|
||||
id: V01
|
||||
screen: Public Erfolg oder Redirect
|
||||
typ: Public Feedback
|
||||
umsetzung: Bauen
|
||||
status: Subframe Draft / Review offen
|
||||
route: /f/:slug
|
||||
subframe: "https://app.subframe.com/f023064a5ca0/design/c06ecfc3-1f86-4dfe-9cfd-cec8b8629253/edit"
|
||||
---
|
||||
|
||||
# V01 - Public Erfolg oder Redirect
|
||||
|
||||
## Ziel
|
||||
|
||||
Erfolgsmeldung nach dem Absenden eines oeffentlichen Formulars.
|
||||
|
||||
Der Kunde soll klar verstehen, dass die Anfrage angekommen ist.
|
||||
|
||||
## Inhalt
|
||||
|
||||
- Tenant-Branding wie in [[07 S04 Oeffentliches Formular|S04 Oeffentliches Formular]]
|
||||
- Erfolgstitel, z. B. `Anfrage gesendet`
|
||||
- Kurzer Bestaetigungstext
|
||||
- Optionaler Hinweis auf Weiterleitung
|
||||
- Optionaler Button zur Website oder Startseite
|
||||
|
||||
## Verhalten
|
||||
|
||||
- Werte muessen nicht erneut gezeigt werden.
|
||||
- Bei Redirect wird kurz bestaetigt und dann weitergeleitet.
|
||||
- Keine internen Begriffe wie Submission, Lead, Action oder Mapping.
|
||||
|
||||
## Subframe
|
||||
|
||||
Gebaut in Subframe:
|
||||
|
||||
https://app.subframe.com/f023064a5ca0/design/c06ecfc3-1f86-4dfe-9cfd-cec8b8629253/edit
|
||||
|
||||
+41
@@ -0,0 +1,41 @@
|
||||
---
|
||||
kind: screen
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
package: WF-D-FORM Form Builder
|
||||
id: V02
|
||||
screen: Public Formular nicht verfuegbar
|
||||
typ: Public Blocker
|
||||
umsetzung: Bauen
|
||||
status: Subframe Draft / Review offen
|
||||
route: /f/:slug
|
||||
subframe: "https://app.subframe.com/f023064a5ca0/design/f96ec12a-5e6a-471d-9a9c-6babcb57c74c/edit"
|
||||
---
|
||||
|
||||
# V02 - Public Formular nicht verfuegbar
|
||||
|
||||
## Ziel
|
||||
|
||||
Ruhiger Public-Blocker, wenn ein Formular nicht erreichbar ist.
|
||||
|
||||
Der Kunde soll keine technische 404-/500-Fehlermeldung sehen.
|
||||
|
||||
## Inhalt
|
||||
|
||||
- Tenant-Branding oder neutraler Fallback
|
||||
- Titel, z. B. `Formular nicht verfuegbar`
|
||||
- Kurzer Grund ohne Technikdetails
|
||||
- Optionaler Kontakt-/Zurueck-Link
|
||||
|
||||
## Verhalten
|
||||
|
||||
- Wird genutzt, wenn Formular unveroeffentlicht, geschlossen, geloescht oder nicht erreichbar ist.
|
||||
- Kein App-Layout und keine internen Informationen.
|
||||
- Keine technischen Fehlercodes fuer Endkunden.
|
||||
|
||||
## Subframe
|
||||
|
||||
Gebaut in Subframe:
|
||||
|
||||
https://app.subframe.com/f023064a5ca0/design/f96ec12a-5e6a-471d-9a9c-6babcb57c74c/edit
|
||||
|
||||
+41
@@ -0,0 +1,41 @@
|
||||
---
|
||||
kind: screen
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
package: WF-D-FORM Form Builder
|
||||
id: V03
|
||||
screen: Public Captcha oder Submit Fehler
|
||||
typ: Public Error
|
||||
umsetzung: Bauen
|
||||
status: Subframe Draft / Review offen
|
||||
route: /f/:slug
|
||||
subframe: "https://app.subframe.com/f023064a5ca0/design/95c96bc9-35d4-47ce-b510-7d8ea1f41936/edit"
|
||||
---
|
||||
|
||||
# V03 - Public Captcha oder Submit Fehler
|
||||
|
||||
## Ziel
|
||||
|
||||
Fehlerzustand im oeffentlichen Formular, wenn Captcha, Upload oder Submit scheitert.
|
||||
|
||||
Der Kunde soll korrigieren oder erneut senden koennen, ohne Daten neu einzutippen.
|
||||
|
||||
## Inhalt
|
||||
|
||||
- Gleicher Formularaufbau wie [[07 S04 Oeffentliches Formular|S04 Oeffentliches Formular]]
|
||||
- Fehlerbanner nahe Submit-Bereich
|
||||
- Inline-Fehler bei Captcha, Upload oder Pflichtfeld
|
||||
- Submit-Button bleibt erneut nutzbar
|
||||
|
||||
## Verhalten
|
||||
|
||||
- Bereits eingetragene Werte bleiben sichtbar.
|
||||
- Fehler werden in Kundensprache erklaert.
|
||||
- Keine technischen Details, keine internen Begriffe.
|
||||
|
||||
## Subframe
|
||||
|
||||
Gebaut in Subframe:
|
||||
|
||||
https://app.subframe.com/f023064a5ca0/design/95c96bc9-35d4-47ce-b510-7d8ea1f41936/edit
|
||||
|
||||
+75
@@ -0,0 +1,75 @@
|
||||
---
|
||||
kind: screen
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
package: WF-D-FORM Form Builder
|
||||
id: S05
|
||||
screen: Antworten Tabelle
|
||||
typ: Builder Tab
|
||||
umsetzung: Bauen
|
||||
status: Subframe Draft / Review offen
|
||||
route: /forms/:id/edit
|
||||
subframe: "https://app.subframe.com/f023064a5ca0/design/9e8eeab7-44ea-4b77-85e6-0818d97e1ac3/edit"
|
||||
---
|
||||
|
||||
# S05 - Antworten Tabelle
|
||||
|
||||
## Ziel
|
||||
|
||||
Antworten-Tab fuer ein konkretes Formular.
|
||||
|
||||
Der Mitarbeiter sieht Einsendungen wie in einer einfachen Excel-/Tabellenansicht.
|
||||
|
||||
## Inhalt
|
||||
|
||||
- Formularname `Website-Anfrage`
|
||||
- Status `Veroeffentlicht`
|
||||
- Tabs:
|
||||
- Fragen
|
||||
- Design
|
||||
- Antworten
|
||||
- Hilfetext: `Jede Zeile ist eine Einsendung. Spalten entsprechen den Formularfeldern.`
|
||||
- Keine Kennzahl-Kacheln; der Screen startet nach Titel/Tabs direkt mit Toolbar und Tabelle.
|
||||
- Toolbar:
|
||||
- Suche
|
||||
- Zeitraum: Heute, Letzte 7 Tage, Dieser Monat, Letzter Monat, Letzte 3 Monate, Letztes Jahr, Alle
|
||||
- Statusfilter
|
||||
- Spalten
|
||||
- Excel / CSV exportieren
|
||||
- Tabelle mit Spalten:
|
||||
- Eingegangen
|
||||
- Name
|
||||
- E-Mail
|
||||
- Telefon
|
||||
- Bereich
|
||||
- Nachricht
|
||||
- Datei
|
||||
- Lead-Status
|
||||
|
||||
## Verhalten
|
||||
|
||||
- Jede Zeile steht fuer eine Einsendung.
|
||||
- Spalten entsprechen den Formularfeldern.
|
||||
- Export erzeugt Excel/CSV.
|
||||
- Keine Kennzahl-Kacheln, weil die Ansicht sonst fuer den einfachen Antworten-Tab zu schwer wirkt.
|
||||
- Kein `Link teilen` in diesem Tab; die Antwortseite dient Auswertung und Export, Teilen/Link gehoert zu Veroeffentlichen.
|
||||
- Zeilen koennen spaeter ein Detail oeffnen; dieser Detail-Drawer ist nicht Teil dieses Screens.
|
||||
|
||||
## Error-/Empty-Zustaende
|
||||
|
||||
- Keine Antworten: eigener State [[12 E03 S05 Keine Antworten|E03 S05 Keine Antworten]].
|
||||
- Suche/Filter ohne Treffer: Empty State im Tabellenbereich.
|
||||
- Export fehlgeschlagen: eigener State [[13 E04 S05 Export Fehler|E04 S05 Export Fehler]].
|
||||
- Export laeuft: Button Loading/disabled.
|
||||
|
||||
## Subframe
|
||||
|
||||
Gebaut in Subframe:
|
||||
|
||||
https://app.subframe.com/f023064a5ca0/design/9e8eeab7-44ea-4b77-85e6-0818d97e1ac3/edit
|
||||
|
||||
Qualitaetsregel:
|
||||
|
||||
- Nutzt das vorhandene `Default Page Layout`.
|
||||
- Keine eigene Sidebar oder Header-Navigation.
|
||||
- Tabelle ist bewusst dicht, aber nicht ueberladen.
|
||||
+43
@@ -0,0 +1,43 @@
|
||||
---
|
||||
kind: screen
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
package: WF-D-FORM Form Builder
|
||||
id: E03
|
||||
screen: S05 Keine Antworten
|
||||
typ: Empty State
|
||||
umsetzung: Bauen
|
||||
status: Subframe Draft / Review offen
|
||||
route: /forms/:id/edit
|
||||
subframe: "https://app.subframe.com/f023064a5ca0/design/6f56c14f-d66e-4734-8a29-a900ac74a8a7/edit"
|
||||
---
|
||||
|
||||
# E03 - S05 Keine Antworten
|
||||
|
||||
## Ziel
|
||||
|
||||
Leerer Antworten-Tab fuer ein Formular, das noch keine Einsendungen hat.
|
||||
|
||||
Der Mitarbeiter soll sehen, dass der Tab richtig ist, aber noch niemand das Formular abgeschickt hat.
|
||||
|
||||
## Inhalt
|
||||
|
||||
- Formularheader wie S05
|
||||
- Tab `Antworten` aktiv
|
||||
- Toolbar schlicht halten, keine Kennzahl-Kacheln
|
||||
- Empty State im Tabellenbereich: `Noch keine Antworten`
|
||||
- Hilfreiche Aktion: `Vorschau oeffnen`
|
||||
- Optionaler Hinweis: `Nach dem Absenden erscheinen Einsendungen hier als Tabelle.`
|
||||
|
||||
## Verhalten
|
||||
|
||||
- Export ist disabled oder nicht prominent, solange keine Antworten existieren.
|
||||
- `Vorschau oeffnen` zeigt das Public Formular oder die Preview.
|
||||
- Kein `Link teilen` in diesem Tab; Teilen gehoert zum Veroeffentlichen-/Public-Link-Kontext.
|
||||
|
||||
## Subframe
|
||||
|
||||
Gebaut in Subframe:
|
||||
|
||||
https://app.subframe.com/f023064a5ca0/design/6f56c14f-d66e-4734-8a29-a900ac74a8a7/edit
|
||||
|
||||
+43
@@ -0,0 +1,43 @@
|
||||
---
|
||||
kind: screen
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
package: WF-D-FORM Form Builder
|
||||
id: E04
|
||||
screen: S05 Export Fehler
|
||||
typ: Error State
|
||||
umsetzung: Bauen
|
||||
status: Subframe Draft / Review offen
|
||||
route: /forms/:id/edit
|
||||
subframe: "https://app.subframe.com/f023064a5ca0/design/00553ea4-9839-4d22-b540-9b9ef0bf014f/edit"
|
||||
---
|
||||
|
||||
# E04 - S05 Export Fehler
|
||||
|
||||
## Ziel
|
||||
|
||||
Fehlerzustand, wenn Excel/CSV-Export nicht erstellt werden konnte.
|
||||
|
||||
Der Nutzer soll die Antworten nicht verlieren und direkt erneut versuchen koennen.
|
||||
|
||||
## Inhalt
|
||||
|
||||
- S05-Grundlayout mit Antworten-Tabelle
|
||||
- Error-Banner nahe Toolbar oder Exportbereich
|
||||
- Text: `Export konnte nicht erstellt werden`
|
||||
- Aktion: `Erneut versuchen`
|
||||
- Sekundaere Aktion: optional `CSV statt Excel`
|
||||
|
||||
## Verhalten
|
||||
|
||||
- Tabellenwerte bleiben sichtbar.
|
||||
- Filter und Zeitraum bleiben erhalten.
|
||||
- Export-Button kann kurz `loading` sein und danach wieder aktiv werden.
|
||||
- Keine technischen Fehlermeldungen fuer normale Nutzer.
|
||||
|
||||
## Subframe
|
||||
|
||||
Gebaut in Subframe:
|
||||
|
||||
https://app.subframe.com/f023064a5ca0/design/00553ea4-9839-4d22-b540-9b9ef0bf014f/edit
|
||||
|
||||
+110
@@ -0,0 +1,110 @@
|
||||
---
|
||||
kind: screen
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
package: WF-D-FORM Form Builder
|
||||
id: S01B
|
||||
screen: Gefuehrter Fragen Editor
|
||||
typ: Simple Builder Alternative
|
||||
umsetzung: Alternative bauen
|
||||
status: Subframe Draft / Review offen
|
||||
route: /forms/:id/edit
|
||||
subframe: "https://app.subframe.com/f023064a5ca0/design/d0fb9c3d-4b03-4d59-bd98-9f668ab018eb/edit"
|
||||
---
|
||||
|
||||
# S01B - Gefuehrter Fragen Editor
|
||||
|
||||
## Ziel
|
||||
|
||||
Noch weniger Komplexitaet als S02. Der Nutzer wird durch wenige Schritte gefuehrt: Fragen, Einstellungen, Vorschau, Veroeffentlichen.
|
||||
|
||||
## Leitidee
|
||||
|
||||
S01B ist fuer Nutzer, die bei zu vielen Buttons sofort aussteigen.
|
||||
|
||||
Der Screen sagt:
|
||||
|
||||
`Erst Fragen. Dann pruefen. Dann teilen.`
|
||||
|
||||
## Aufbau
|
||||
|
||||
Interne Seite mit vorhandenem `Default rage Layout`. Keine eigene Sidebar nachbauen.
|
||||
|
||||
Screen-Zonen:
|
||||
|
||||
- Kopfzeile mit Formularname, Speichern, Vorschau.
|
||||
- Step-Leiste oben: 1 Fragen, 2 Einstellungen, 3 Vorschau, 4 Veroeffentlichen.
|
||||
- Linke schmale Fragenliste: Frage 1, Frage 2, Frage 3.
|
||||
- Hauptbereich: nur die aktuell gewaehlte Frage als grosse Karte.
|
||||
- Rechte Seite: Hilfe/rreview-Zusammenfassung, nicht voller Inspector.
|
||||
|
||||
## Hauptaktionen
|
||||
|
||||
| Aktion | UI |
|
||||
|---|---|
|
||||
| Frage hinzufuegen | grosser Button `+ Frage hinzufuegen` unter Fragenliste |
|
||||
| Fragetyp wechseln | grosses Dropdown in der Fragekarte |
|
||||
| Option hinzufuegen | Inline in der Fragekarte |
|
||||
| rflichtfrage | Toggle mit Text `Muss beantwortet werden` |
|
||||
| Bedingung | Button `Nur anzeigen, wenn ...` |
|
||||
| Frage loeschen | Drei-runkte-Menue, Confirm nur bei Risiko |
|
||||
| Vorschau | eigener Schritt oder Button oben |
|
||||
|
||||
## Vereinfachung gegenueber S02
|
||||
|
||||
| S02 | S01B |
|
||||
|---|---|
|
||||
| rechte Mini-Werkzeugleiste | keine Werkzeugleiste |
|
||||
| mehrere Fragekarten sichtbar | Fokus auf eine Frage |
|
||||
| tabs wie Google Forms | Schrittfolge |
|
||||
| mehr direkte Kontrolle | mehr Fuehrung |
|
||||
|
||||
## Lead-Formular Verhalten
|
||||
|
||||
Bei Lead-Formular:
|
||||
|
||||
- Schritt `Einstellungen` zeigt automatisch:
|
||||
- Lead-Erstellung aktiv
|
||||
- Ziel-ripeline
|
||||
- verantwortliches Team
|
||||
- Nutzer kann diese Werte aendern, muss aber nichts mappen.
|
||||
- Fragenliste startet mit vorgeschlagenen Lead-Fragen.
|
||||
|
||||
## rublic rreview
|
||||
|
||||
Der Schritt `Vorschau` zeigt, wie der Kunde das Formular sieht.
|
||||
|
||||
Wichtig:
|
||||
|
||||
- Keine rDF-Sprache.
|
||||
- Keine interne Builder-Sprache.
|
||||
- rreview entspricht S02 rublic Form.
|
||||
|
||||
## rublish
|
||||
|
||||
Im Schritt `Veroeffentlichen` sieht Nutzer:
|
||||
|
||||
- rublic Link
|
||||
- QR-Code
|
||||
- Einbetten
|
||||
- Status der rruefung
|
||||
|
||||
Fehlt etwas, steht es als einfache Checkliste:
|
||||
|
||||
- `Frage 2 braucht mindestens eine Antwortoption.`
|
||||
- `Oeffentliche URL fehlt.`
|
||||
- `Datenschutz-Hinweis pruefen.`
|
||||
|
||||
## Subframe-Hinweis
|
||||
|
||||
Gebaut in Subframe:
|
||||
|
||||
https://app.subframe.com/f023064a5ca0/design/d0fb9c3d-4b03-4d59-bd98-9f668ab018eb/edit
|
||||
|
||||
Qualitaetsregel:
|
||||
|
||||
- Nutzt das vorhandene `Default rage Layout`.
|
||||
- Keine eigene Sidebar oder Header-Navigation.
|
||||
- Liegt im selben Flow neben `ADV-S01-2 Form-Builder Canvas 2`.
|
||||
- Weniger Google-Forms-nah als S02, aber fuer sehr unsichere Nutzer wahrscheinlich leichter.
|
||||
- Lead-Verknuepfung bleibt als einfache aktive Einstellung sichtbar, ohne Mapping-ranel.
|
||||
+57
@@ -0,0 +1,57 @@
|
||||
---
|
||||
kind: screen
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
package: WF-D-FORM Form Builder
|
||||
id: S01C
|
||||
screen: Website Formular Editor
|
||||
typ: Simple Builder Beispiel
|
||||
umsetzung: Alternative bauen
|
||||
status: Subframe Draft / Review offen
|
||||
route: /forms/:id/edit
|
||||
subframe: "https://app.subframe.com/f023064a5ca0/design/d7d33e94-5c12-48e8-8ec6-1e94590ee89c/edit"
|
||||
---
|
||||
|
||||
# S01C - Website Formular Editor
|
||||
|
||||
## Ziel
|
||||
|
||||
Beispiel-Editor fuer die S00-Auswahl `Website-/Externes Formular`.
|
||||
|
||||
Der Nutzer erstellt ein einfaches oeffentliches Anfrageformular fuer Website, Link oder QR-Code.
|
||||
|
||||
## Inhalt
|
||||
|
||||
- Formularname `Website-Anfrage`
|
||||
- Hinweis `Oeffentliches Formular`
|
||||
- Public-Link-/Anfrage-Hinweis
|
||||
- Fragenkarten:
|
||||
- Name
|
||||
- E-Mail
|
||||
- Telefon
|
||||
- Worum geht es?
|
||||
- Nachricht
|
||||
- Datei / Bild hochladen
|
||||
- Schutz-/Datenschutzbereich:
|
||||
- mCaptcha / Spam-Schutz
|
||||
- Datenschutzhinweis
|
||||
|
||||
## Verhalten
|
||||
|
||||
- Kein Lead-Mapping sichtbar.
|
||||
- Keine Pipeline-Verknuepfung im Vordergrund.
|
||||
- Nutzer denkt: `Ich baue ein Kontakt-/Anfrageformular fuer die Website.`
|
||||
- Publish/Preview bleiben oben erreichbar.
|
||||
|
||||
## Subframe
|
||||
|
||||
Gebaut in Subframe:
|
||||
|
||||
https://app.subframe.com/f023064a5ca0/design/d7d33e94-5c12-48e8-8ec6-1e94590ee89c/edit
|
||||
|
||||
Qualitaetsregel:
|
||||
|
||||
- Nutzt das vorhandene `Default Page Layout`.
|
||||
- Keine eigene Sidebar oder Header-Navigation.
|
||||
- Liegt im selben Flow neben `ADV-S01-2 Form-Builder Canvas 2`.
|
||||
- Wiederhergestellte Layout-Version vom 2026-07-07; alte kaputte Subframe-ID wurde ersetzt.
|
||||
+55
@@ -0,0 +1,55 @@
|
||||
---
|
||||
kind: screen
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
package: WF-D-FORM Form Builder
|
||||
id: S01D
|
||||
screen: Umfrage Editor
|
||||
typ: Simple Builder Beispiel
|
||||
umsetzung: Alternative bauen
|
||||
status: Subframe Draft / Review offen
|
||||
route: /forms/:id/edit
|
||||
subframe: "https://app.subframe.com/f023064a5ca0/design/5abd7799-7058-40b3-9772-884cbda97b9c/edit"
|
||||
---
|
||||
|
||||
# S01D - Umfrage Editor
|
||||
|
||||
## Ziel
|
||||
|
||||
Beispiel-Editor fuer die S00-Auswahl `Fragebogen / Umfrage`.
|
||||
|
||||
Der Nutzer erstellt eine einfache Umfrage, z. B. kurze Rueckmeldung oder Zufriedenheit.
|
||||
|
||||
Hinweis 2026-07-08: S01D ist aktuell nur Referenz. Im Hauptfluss oeffnet auch `Fragebogen / Umfrage` den S02-Editor mit passender Vorlage.
|
||||
|
||||
## Inhalt
|
||||
|
||||
- Formularname `Kundenzufriedenheit`
|
||||
- Hinweis `Umfrage - Antworten werden gesammelt`
|
||||
- Keine Lead-Verknuepfung
|
||||
- Fragenkarten:
|
||||
- Multiple Choice
|
||||
- Freitext
|
||||
- optional Datum/Zeit, falls fuer Rueckmeldung noetig
|
||||
- Kleine Vorschau-/Antworten-Zusammenfassung
|
||||
|
||||
## Verhalten
|
||||
|
||||
- Keine Pipeline.
|
||||
- Keine Lead-Automatik.
|
||||
- Antworten werden gesammelt und spaeter im Antworten-Bereich geprueft.
|
||||
- Nutzer denkt: `Ich frage Feedback ab.`
|
||||
- Keine Lineare Skala, keine Bewertung/Sterne und keine Raster im aktuellen S02-Hauptdropdown.
|
||||
|
||||
## Subframe
|
||||
|
||||
Gebaut in Subframe:
|
||||
|
||||
https://app.subframe.com/f023064a5ca0/design/5abd7799-7058-40b3-9772-884cbda97b9c/edit
|
||||
|
||||
Qualitaetsregel:
|
||||
|
||||
- Nutzt das vorhandene `Default Page Layout`.
|
||||
- Keine eigene Sidebar oder Header-Navigation.
|
||||
- Liegt im selben Flow neben `ADV-S01-2 Form-Builder Canvas 2`.
|
||||
- Korrigierte Version; die falsch generierte Variante ohne Layout wurde geloescht.
|
||||
+56
@@ -0,0 +1,56 @@
|
||||
---
|
||||
kind: screen
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
package: WF-D-FORM Form Builder
|
||||
id: S01E
|
||||
screen: Internes Formular Editor
|
||||
typ: Simple Builder Beispiel
|
||||
umsetzung: Alternative bauen
|
||||
status: Subframe Draft / Review offen
|
||||
route: /forms/:id/edit
|
||||
subframe: "https://app.subframe.com/f023064a5ca0/design/ea08fd1c-1a76-4e2c-b27c-1091baa0586a/edit"
|
||||
---
|
||||
|
||||
# S01E - Internes Formular Editor
|
||||
|
||||
## Ziel
|
||||
|
||||
Beispiel-Editor fuer die S00-Auswahl `Internes Formular`.
|
||||
|
||||
Der Nutzer erstellt ein internes Formular fuer Mitarbeitende, z. B. Materialbedarf oder interne Meldung.
|
||||
|
||||
## Inhalt
|
||||
|
||||
- Formularname `Materialbedarf melden`
|
||||
- Badge `Nur intern`
|
||||
- Hinweis `Kein oeffentlicher Link`
|
||||
- Zuständiges Team `Lager & Einkauf`
|
||||
- Fragenkarten:
|
||||
- Mitarbeiter
|
||||
- Bereich
|
||||
- Dringlichkeit
|
||||
- Material / Problem
|
||||
- Beschreibung
|
||||
- Foto / Datei
|
||||
- Wunschdatum
|
||||
|
||||
## Verhalten
|
||||
|
||||
- Kein Public-Link-Fokus.
|
||||
- Keine Lead-Pipeline.
|
||||
- Kein Mapping sichtbar.
|
||||
- Nutzer denkt: `Ich sammle interne Meldungen sauber ein.`
|
||||
|
||||
## Subframe
|
||||
|
||||
Gebaut in Subframe:
|
||||
|
||||
https://app.subframe.com/f023064a5ca0/design/ea08fd1c-1a76-4e2c-b27c-1091baa0586a/edit
|
||||
|
||||
Qualitaetsregel:
|
||||
|
||||
- Nutzt das vorhandene `Default Page Layout`.
|
||||
- Keine eigene Sidebar oder Header-Navigation.
|
||||
- Liegt im selben Flow neben `ADV-S01-2 Form-Builder Canvas 2`.
|
||||
- Wiederhergestellte Layout-Version vom 2026-07-07; alte kaputte Subframe-ID wurde ersetzt.
|
||||
+661
@@ -0,0 +1,661 @@
|
||||
---
|
||||
kind: screen
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
package: WF-D-FORM Form Builder
|
||||
id: ADV-S01
|
||||
screen: Form-Builder Canvas
|
||||
typ: Bespoke Builder
|
||||
umsetzung: Bauen
|
||||
status: Subframe Draft / Review offen
|
||||
route: /forms/:id/edit
|
||||
subframe: "https://app.subframe.com/f023064a5ca0/design/e5502f88-9858-460e-abae-671f28464270/edit"
|
||||
---
|
||||
|
||||
# ADV-S01 - Form-Builder Canvas
|
||||
|
||||
## Ziel
|
||||
|
||||
Interne Nutzer bauen, konfigurieren, pruefen und veroeffentlichen ein Formular an einem Arbeitsort.
|
||||
|
||||
Der Screen muss Feldaufbau, Validierung, Conditional Logic, Preview, Sharing und Post-Submit-Actions sichtbar machen, ohne in mehrere neue Routen zu zerfallen.
|
||||
|
||||
## Pattern / Archetyp
|
||||
|
||||
BESPOKE Builder.
|
||||
|
||||
Nutzt A4 Form/Input-Kit fuer die Feldtypen und A7 Zustands-Kit fuer Empty/Loading/Error/Permission.
|
||||
|
||||
## Arbeitsbereiche
|
||||
|
||||
Dies ist keine finale Layout-Vorgabe, sondern die Arbeitslogik fuer David.
|
||||
|
||||
| Bereich | Zweck | Sichtbarkeit |
|
||||
|---|---|---|
|
||||
| Header / Statusbar | Form-Name, Status, Save, Preview, Publish, Share. | dauerhaft sichtbar |
|
||||
| Feld-Palette | 12 Feldtypen hinzufuegen. | primaer |
|
||||
| Canvas | Feldliste in Reihenfolge, Drag-and-Drop, Empty State, Feldfehler. | primaer |
|
||||
| Feld-Inspector | ausgewaehltes Feld konfigurieren. | primaer |
|
||||
| Logic | Wenn-Dann-Regeln fuer sichtbare Felder. | Sekundaer-Tab/Panel |
|
||||
| Actions | Post-Submit-Actions und Field-Mapping. | Sekundaer-Tab/Panel |
|
||||
| Sharing | Public URL, QR, iFrame. | Sekundaer-Tab/Panel |
|
||||
| Preview | Public-nahe Vorschau. | Umschaltmodus oder Side Preview |
|
||||
| Settings | Slug, Success, Redirect, Branding, technische Public-Settings. | Sekundaer-Tab/Panel |
|
||||
|
||||
Empfehlung: Der Screen soll sich wie ein Builder anfuehlen, nicht wie eine lange Settings-Seite. Palette, Canvas und Inspector sind die Arbeitsmitte. Alles andere ist nah dran, aber nicht dauernd gleich laut.
|
||||
|
||||
## Detail-Brainstorming S01
|
||||
|
||||
Status: Arbeitsentwurf fuer David. Nach Review vom 2026-07-06 wurde die Interaktionslogik nachgezogen; finale Subframe-Freigabe bleibt offen.
|
||||
|
||||
Ziel dieses Blocks: Den riesigen Builder-Umfang so aufteilen, dass David daraus einen echten Subframe-Frame bauen kann, ohne dass wichtige Produktentscheidungen im Kopf bleiben.
|
||||
|
||||
### Layout-Optionen
|
||||
|
||||
| Option | Aufbau | Vorteil | Risiko | Empfehlung |
|
||||
|---|---|---|---|---|
|
||||
| D | Feste Builder-Shell: links Palette, Mitte Canvas, rechts Inspector; oben Header; sekundaere Modi als Tabs/Drawer. | Fuehlt sich wie ein echter Builder an, alle Kernaktionen sind nah beieinander. | Dichte hoch; braucht gute visuelle Hierarchie. | Empfohlen fuer den Advanced Builder. |
|
||||
| B | Getrennte Seiten/Tabs: Felder, Logic, Actions, Sharing, Settings, Preview. | Ruhiger je Bereich. | Zerlegt den Canvas, mehr Navigationslast, weniger Bespoke-Gefuehl. | Nicht fuer v1-Hauptscreen. |
|
||||
| C | Canvas + alles andere in Modals. | Hauptscreen wirkt leerer. | Viele Modal-Wechsel, Mapping und Preview werden unhandlich. | Nur fuer Confirm-/Blocker-Dialoge. |
|
||||
|
||||
Arbeitsentscheidung: S01 soll als **Builder-Shell** gedacht werden, nicht als Settings-Seite. Der primaere Arbeitszustand zeigt Palette, Canvas und Inspector gleichzeitig. Logic, Actions, Sharing, Preview und Settings sind Modi am selben Datensatz.
|
||||
|
||||
### Empfohlene Bildschirmaufteilung
|
||||
|
||||
| Zone | Inhalt | Verhalten |
|
||||
|---|---|---|
|
||||
| Topbar | Breadcrumb, Form-Name, Status, Save, Preview, Publish, Share, More. | Bleibt dauerhaft sichtbar. |
|
||||
| Linke Palette | Feldtypen, Such-/Filtermöglichkeit, Templates/Abschnitte falls erlaubt. | Schmal, scanbar, Drag oder Klick fuegt Feld hinzu. |
|
||||
| Canvas-Mitte | Feldliste, Dropzonen, Feldkarten, Empty State, Fehleranker. | Hauptarbeitsflaeche; Auswahl steuert rechten Inspector. |
|
||||
| Rechter Inspector | Eigenschaften des ausgewaehlten Felds oder Form-/Modus-Einstellungen. | Kontextsensitiv, kein leerer rechter Bereich. |
|
||||
| Modus-Leiste | Builder, Logic, Actions, Sharing, Preview, Settings. | Als Tabs/Segment im Arbeitsbereich oder rechts oben; keine neuen Routen. |
|
||||
| Bottom/Status-Hinweis | Unsaved Changes, letzte Speicherung, Publish-Blocker kurz. | Dezent, damit es nicht mit Canvas konkurriert. |
|
||||
|
||||
### Modus-Matrix
|
||||
|
||||
| Modus | Hauptfrage | Was David zeigen sollte | Eigener Screen? |
|
||||
|---|---|---|---|
|
||||
| Builder | Welche Felder hat das Formular und wie sind sie konfiguriert? | Palette, Canvas, Inspector. | nein, Kern von S01 |
|
||||
| Logic | Wann werden Felder angezeigt oder verborgen? | Regel-Liste, Regel-Editor, kaputte Referenzen, Test-Hinweise. | nein |
|
||||
| Actions | Was passiert nach Submit? | Action-Liste, Mapping, Test/Preview, Warnungen. | nein |
|
||||
| Sharing | Wie wird das Formular verteilt? | Public URL, QR, iFrame, Copy-Aktionen, Publish-Hinweis. | nein |
|
||||
| Preview | Wie sieht das Public Form aus? | Public-nahe Vorschau, Desktop/Mobile-Umschalter, Logic live. | nein, aber im S01 klar sichtbar |
|
||||
| Settings | Welche Form-Stammdaten steuern die Public-Version? | Slug, Beschreibung, Success, Redirect, Close/Limit, Branding. | nein |
|
||||
|
||||
Empfehlung: Builder bleibt Default. Preview darf prominent sein, aber nicht die Feldbearbeitung verdraengen.
|
||||
|
||||
## Detail: Interaktionslogik / Was passiert nach Klick?
|
||||
|
||||
Diese Nacharbeit beantwortet Davids Review-Hinweis vom 2026-07-06. S01 muss nicht jede kleine UI-Ebene als eigenen Screen bauen, aber die wichtigsten Klicks brauchen eine klare Entscheidung: inline, Inspector, Menue, Panel/Drawer, Popover oder Confirm-Dialog.
|
||||
|
||||
### Grundprinzipien
|
||||
|
||||
| UI-Form | Wann verwenden? | Regel fuer S01 |
|
||||
|---|---|---|
|
||||
| Inline / Canvas | Schnelle direkte Manipulation am Feld. | Auswahl, Drag, Pflicht-Quicktoggle, Fehleranker bleiben im Canvas. |
|
||||
| Rechter Inspector | Alles, was ein Feld oder ein gewaehltes Objekt dauerhaft konfiguriert. | Feld bearbeiten passiert hier, nicht im Modal. |
|
||||
| 3-Punkte-Menue | Sekundaere Aktionen auf Feld-/Action-/Regel-Karten. | Duplizieren, Loeschen, Deaktivieren, Drchivieren-Einstiege. |
|
||||
| Panel / Drawer im S01 | Komplexere Konfiguration mit mehreren Feldern. | Logic-Regel, Action-Detail, Sharing, Settings bleiben im selben Screen. |
|
||||
| Popover | Kurze Auswahl oder kurzer Statuscheck. | Action-Typ waehlen, Publish-Kurzcheck, Copy/Share-Hilfe. |
|
||||
| Confirm-Dialog | Destruktive oder public-wirksame Aktionen. | Loeschen mit Abhaengigkeiten, Unpublish, Archive, ungespeichert verlassen. |
|
||||
| Toast | Ergebnisfeedback ohne Entscheidung. | Gespeichert, kopiert, veroeffentlicht, dupliziert. |
|
||||
|
||||
Arbeitsentscheidung: Routinearbeit bleibt im Builder. Modals sind nur fuer echte Risiko-Momente erlaubt.
|
||||
|
||||
### Klick-Matrix
|
||||
|
||||
| Aktion | Einstieg | Was passiert nach Klick? | UI-Form | Eigener Subframe-Frame? |
|
||||
|---|---|---|---|---|
|
||||
| Feld per Palette anklicken | Linke Palette | Feld wird am Ende eingefuegt, markiert und im Inspector geoeffnet. | Inline + Inspector | nein |
|
||||
| Feld per Drag hinzufuegen | Linke Palette -> Canvas | Dropzonen erscheinen, Feld landet an Position, danach selected. | Canvas-Zustand | nein |
|
||||
| Feld auswaehlen | Feldkarte | Fokusrahmen auf Karte, rechter Inspector zeigt Basisdaten. | Inline + Inspector | nein |
|
||||
| Feld bearbeiten | Inspector | Label, Key, Pflichtfeld, Optionen, Validation usw. werden rechts bearbeitet. | Inspector | nein |
|
||||
| Pflichtfeld schnell setzen | Feldkarte oder Inspector | Toggle aendert Pflichtstatus, Dirty State wird gesetzt. | Inline | nein |
|
||||
| Feld duplizieren | Feldkarte-Aktion oder 3-Punkte-Menue | Kopie entsteht unter Original, neuer `field_key` wird vorgeschlagen, Kopie ist selected. | Menue + Toast | nein |
|
||||
| Feld loeschen ohne Abhaengigkeit | 3-Punkte-Menue oder Gefahrenzone | Kurzer Confirm ist optional; danach Feld entfernen und Toast zeigen. | Menue/Confirm klein | nur dokumentieren |
|
||||
| Feld loeschen mit Logic/Action-Bezug | 3-Punkte-Menue oder Gefahrenzone | Confirm zeigt betroffene Regeln/Actions; nach Loeschen werden Referenzen markiert oder geloescht. | Confirm-Dialog | nur dokumentieren |
|
||||
| Feld verschieben | Drag Handle | Reihenfolge aendert sich, Dropziel sichtbar, Dirty State. | Canvas-Zustand | nein |
|
||||
| Feld einklappen | Feldkarte | Karte wird kompakt, bleibt in Reihenfolge sichtbar. | Inline | nein |
|
||||
| Fehler anklicken | Summary oder Feldkarte | Scroll/Focus zum betroffenen Feld und passenden Inspector-Abschnitt. | Inline Navigation | nein |
|
||||
| Logic-Modus oeffnen | Modus-Leiste | Canvas bleibt Kontext, Logic-Liste/Editor wird als Arbeitsbereich sichtbar. | Panel im S01 | nein |
|
||||
| Logic-Regel anlegen | Button im Logic-Modus | Neue Regel startet als Detailbereich im Panel; kein Modal. | Panel/Drawer | nur dokumentieren |
|
||||
| Logic-Regel bearbeiten | Regelkarte | Detailbereich oeffnet/rechts aktualisiert sich. | Panel/Inspector | nein |
|
||||
| Logic-Regel deaktivieren | Toggle auf Regelkarte | Regel bleibt sichtbar, wirkt aber nicht; kein Confirm. | Inline | nein |
|
||||
| Logic-Regel loeschen | 3-Punkte-Menue | Bei aktiver/published Form Confirm, sonst kleine Menue-Aktion mit Undo/Toast. | Menue + Confirm nach Risiko | nur dokumentieren |
|
||||
| Actions-Modus oeffnen | Modus-Leiste | Action-Liste und Detailbereich erscheinen im selben Builder. | Panel im S01 | nein |
|
||||
| Post-Submit-Action hinzufuegen | Button im Actions-Modus | Typ-Auswahl oeffnet als kleines Auswahlpanel/Popover, danach Detailkonfiguration. | Popover + Panel/Drawer | nur dokumentieren |
|
||||
| Action bearbeiten | Actionkarte | Detailpanel zeigt Ziel, Mapping, Test und Warnungen. | Panel/Drawer | nein |
|
||||
| Field-Mapping setzen | Action-Detail | Mapping-Zeilen werden inline bearbeitet. | Inline im Panel | nein |
|
||||
| Action testen | Action-Detail | Ergebnis erscheint inline im Action-Detail, zusaetzlich Toast bei Erfolg. | Inline + Toast | nein |
|
||||
| Action deaktivieren | Toggle auf Actionkarte | Action bleibt sichtbar, wird beim Submit nicht ausgefuehrt. | Inline | nein |
|
||||
| Action loeschen | 3-Punkte-Menue | Confirm, wenn Action aktiv/published oder Mapping besitzt. | Confirm-Dialog | nur dokumentieren |
|
||||
| Sharing oeffnen | Header-Share oder Modus-Leiste | Sharing-Panel mit URL, QR, iFrame wird sichtbar. | Panel im S01 | nein |
|
||||
| Public URL kopieren | Sharing-Panel | Copy-Aktion, danach Toast. | Button + Toast | nein |
|
||||
| QR/iFrame kopieren | Sharing-Panel | Copy/Download, danach Toast; kein Modal. | Button + Toast | nein |
|
||||
| Sharing im Draft | Sharing-Panel | URL/QR/iFrame ausgegraut, Publish-Hinweis und Sprung zu Publish/Settings. | Inline Hinweis | nein |
|
||||
| Preview oeffnen | Header oder Modus-Leiste | Builder wechselt in Public-nahe Vorschau mit Desktop/Mobile-Umschalter. | Modus im S01 | nein |
|
||||
| Settings oeffnen | Modus-Leiste | Slug, Success, Redirect, Branding und Public-Settings erscheinen im Panel/Inspector. | Panel im S01 | nein |
|
||||
| Publish klicken | Header | Publish-Check laeuft inline; bei Blockern Summary mit Sprungzielen. | Inline Check / Popover | nur dokumentieren |
|
||||
| Publish erfolgreich | Header | Status wechselt zu Published, Public URL aktiv, Toast. | Statuswechsel + Toast | nein |
|
||||
| Publish mit Warnungen | Header | Nicht-blockierende Warnungen erscheinen vor Bestaetigung. | Popover/Inline Summary | nur dokumentieren |
|
||||
| Unpublish klicken | Header/More | Confirm erklaert, dass Public-Link nicht mehr erreichbar ist. | Confirm-Dialog | nur dokumentieren |
|
||||
| Archive klicken | More-Menue | Confirm, weil Bearbeitung/Public-Kontext endet. | Confirm-Dialog | nur dokumentieren |
|
||||
| Weg navigieren mit Dirty State | Zurueck/Breadcrumb/Routewechsel | Warnung vor ungespeicherten Aenderungen. | Confirm-Dialog | nur dokumentieren |
|
||||
|
||||
### Zusaetzliche dokumentierte Zustaende nach Review
|
||||
|
||||
Diese Zustaende muessen bewusst beschrieben werden. D07, D08 und D09 sind nach aktueller Empfehlung zusaetzliche Subframe-Zustaende; die restlichen bleiben dokumentiert.
|
||||
|
||||
| ID | Zustand / Ebene | UI-Form | Empfehlung |
|
||||
|---|---|---|---|
|
||||
| D01 | [[D01 Sharing Panel URL QR iFrame]] | Panel im S01 | In S01 integrieren, kein eigener Screen. |
|
||||
| D02 | [[D02 Post-Submit Actions]] | Panel im S01 | In S01 integrieren, kein eigener Screen. |
|
||||
| D03 | [[D03 Conditional Logic Editor]] | Panel im S01 | In S01 integrieren, kein eigener Screen. |
|
||||
| D06 | [[D06 Feldkarten Menue]] | 3-Punkte-Menue | In S01 dokumentieren, kein eigener Screen. |
|
||||
| M01 | [[M01 Feld loeschen Confirm]] | Kleiner Confirm-Dialog | Nur als Zustand dokumentieren; extra Frame nur wenn David ihn sehen will. |
|
||||
| D07 | [[91 D07 Logic Regel Detail|D07 Logic Regel Detail]] | Panel/Drawer im S01 | Als zusaetzlichen Subframe-Zustand bauen, damit Logic visuell pruefbar ist. |
|
||||
| D08 | [[92 D08 Action Detail mit Mapping|D08 Action Detail mit Mapping]] | Panel/Drawer im S01 | Als zusaetzlichen Subframe-Zustand bauen, weil Mapping komplex ist. |
|
||||
| D09 | [[93 D09 Publish Blocker Summary|D09 Publish Blocker Summary]] | Inline Banner/Popover | Als zusaetzlichen Subframe-Zustand bauen, weil Publish kritisch ist. |
|
||||
| M02 | [[M02 Unpublish Confirm]] | Confirm-Dialog | Nur dokumentieren, weil public-wirksam. |
|
||||
| M03 | [[M03 Archive Confirm]] | Confirm-Dialog | Nur dokumentieren, nicht Hauptscreen. |
|
||||
| M04 | [[M04 Unsaved Changes Confirm]] | Confirm-Dialog | Standardzustand, nur dokumentieren. |
|
||||
| D10 | [[D10 Builder Interaktionsfaelle]] | Case-Matrix | Auswahlfolgen, vergessene Pflichtteile, Dropdowns, Popovers und Folgefehler dokumentieren. |
|
||||
|
||||
### Antworten auf Davids Beispiel-Fragen
|
||||
|
||||
| Frage | Antwort fuer D-FORM |
|
||||
|---|---|
|
||||
| Feld bearbeiten: inline im rechten Inspector oder eigenes Modal? | Rechter Inspector. Kein Modal fuer normale Feldbearbeitung. |
|
||||
| Feld loeschen/duplizieren: Feldkarte, 3-Punkte-Menue oder Confirm? | Duplizieren ueber Feldkarte/3-Punkte-Menue ohne Confirm. Loeschen ueber 3-Punkte-Menue oder Gefahrenzone; Confirm bei Abhaengigkeiten oder published Risiko. |
|
||||
| Logic-Regel anlegen: gleiches Panel, Drawer oder Modal? | Gleiches Logic-Panel bzw. rechter Detailbereich im S01. Kein Modal. |
|
||||
| Post-Submit-Action hinzufuegen: Inline, Drawer oder Modal? | Typauswahl als kleines Auswahlpanel/Popover; Konfiguration im Action-Detail-Panel/Drawer. |
|
||||
| Sharing oeffnen: Tab/Panel, Popover oder Modal? | Panel/Modus im S01. Copy-Aktionen nur mit Toast. |
|
||||
| Publish/Unpublish: Inline-Check, Popover oder Confirm? | Publish als Inline-Check mit Summary/Popover; Unpublish als Confirm-Dialog. |
|
||||
|
||||
### Was-passiert-wenn-Faelle
|
||||
|
||||
Die Detailfaelle fuer Auswahlfolgen, vergessene Zwischenschritte, Checkboxen, Dropdowns, Bild/Datei-Folgen, Modaltexte und Publish-Blocker liegen in [[D10 Builder Interaktionsfaelle]].
|
||||
|
||||
Merksatz fuer den Advanced Builder: Jede Auswahl, die Folgefelder veraendert, muss sichtbar machen, was danach wichtig wird. Wenn Nutzer einen mittleren Pflichtschritt vergessen, bleibt der Fehler lokal sichtbar und wird beim Publish/Test mit konkretem Sprungziel aufgegriffen.
|
||||
|
||||
## Detail: Header / Statusbar
|
||||
|
||||
| Element | Zustand / Inhalt | Aktion / Ergebnis |
|
||||
|---|---|---|
|
||||
| Breadcrumb | Formulare > Formularname | Zur Forms-Liste zurueck, aber Forms-Liste ist nicht Teil von D-FORM. |
|
||||
| Form-Name inline | Name, Dirty Marker, ggf. fehlender Name | Klick/Enter bearbeitet Name; leerer Name blockiert Publish. |
|
||||
| Status-Badge | Draft, Published, Archived, Unpublished changes, Error | Erklaert, ob Public-Link aktiv ist. |
|
||||
| Autosave/Save | Ungespeichert, Speichert, Gespeichert, Fehler | Speichert Form-Stammdaten, Felder, Logic, Actions. |
|
||||
| Preview | Desktop/Mobile/Public-nahe Vorschau | Oeffnet Preview-Modus im selben Builder. |
|
||||
| Publish | Draft -> Published | Startet Publish-Check; bei Blockern kein Publish. |
|
||||
| Unpublish | Published -> Draft/private | Zeigt Warnung, weil Public-Link danach nicht mehr nutzbar ist. |
|
||||
| Share | URL/QR/iFrame | Oeffnet Sharing-Modus; bei Draft mit Hinweis. |
|
||||
| More-Menue | Duplizieren, Drchivieren, ggf. Vorlage erstellen | Keine destruktive Aktion ohne Confirm. |
|
||||
|
||||
### Header-Zustaende
|
||||
|
||||
| Zustand | UI-Hinweis | Naechste Aktion |
|
||||
|---|---|---|
|
||||
| Entwurf ohne Fehler | Draft-Badge, Save aktiv wenn dirty | Weiter bearbeiten oder publishen. |
|
||||
| Entwurf mit Blockern | Validation-Summary sichtbar | Fehler anklicken und beheben. |
|
||||
| Published ohne Aenderungen | Published-Badge, Public-Link aktiv | Teilen oder unpublishen. |
|
||||
| Published mit ungespeicherten Aenderungen | Hinweis "Aenderungen noch nicht veroeffentlicht" | Speichern/Publish-Update pruefen. |
|
||||
| Archived | Bearbeitung eingeschraenkt oder read-only | Duplizieren oder zur Liste zurueck. |
|
||||
| Save fehlgeschlagen | Banner/Inline in Headernaehe | Erneut speichern. |
|
||||
|
||||
## Detail: Feld-Palette
|
||||
|
||||
Die Palette soll nicht wie eine lange Komponentenliste wirken, sondern wie ein schneller Baukasten.
|
||||
|
||||
| Gruppe | Feldtypen | Notiz |
|
||||
|---|---|---|
|
||||
| Text & Kontakt | Text, Textarea, Email, Telefon | Die haeufigsten Felder oben. |
|
||||
| Zahlen & Datum | Zahl, Waehrung, Datum, Datum-Range | Mit kurzem Format-Hinweis. |
|
||||
| Auswahl | Select, Multi-Select, Boolean | Radio/Checkbox-Liste sind Darstellungsvarianten, keine extra Feldtypen. |
|
||||
| Upload | Datei | Foto ist mobile Upload-Variante. |
|
||||
|
||||
### Palette-Aktionen
|
||||
|
||||
| Aktion | Ergebnis |
|
||||
|---|---|
|
||||
| Feld anklicken | Feld wird am Ende des Canvas eingefuegt und direkt ausgewaehlt. |
|
||||
| Feld ziehen | Dropzone im Canvas erscheint; Feld wird an Position eingefuegt. |
|
||||
| Feld suchen | Palette filtert nach Feldtyp/Use Case. |
|
||||
| Feld disabled | Tooltip erklaert, warum Feldtyp nicht verfuegbar ist. |
|
||||
|
||||
### Palette-Abgrenzung
|
||||
|
||||
| Element | In Palette? | Begruendung |
|
||||
|---|---|---|
|
||||
| mCaptcha/Honeypot | nein | Systemschutz, kein normales Formularfeld. |
|
||||
| Signature | nein fuer v1 | Signatur-Kontext bleibt separat/offen. |
|
||||
| Address | nein fuer v1 | Haengt an Maps/Autocomplete, v2 oder Spezialbaustein. |
|
||||
| Section Header / Description | offen | Kann nuetzlich sein, ist aber kein A4-12-Feldtyp. Als "Content Block" spaeter pruefen. |
|
||||
| Hidden Field | nein fuer v1 | Personalisierte Links/URL-Parameter sind v2. |
|
||||
|
||||
## Detail: Canvas
|
||||
|
||||
Der Canvas ist keine freie Zeichenflaeche, sondern eine sortierbare Formularstruktur.
|
||||
|
||||
| Canvas-Element | Zweck |
|
||||
|---|---|
|
||||
| Formular-Intro | Titel/Beschreibung aus Stammdaten als Kontext, nicht voll editieren im Canvas. |
|
||||
| Feldkarte | Label, Typ, Pflichtmarker, kurzer Helptext, Fehlerstatus, Aktionen. |
|
||||
| Dropzone zwischen Feldern | Zeigt, wo ein neues/gezogenes Feld landet. |
|
||||
| Ausgewaehltes Feld | Sichtbarer Fokusrahmen; Inspector zeigt Details. |
|
||||
| Inline-Fehler | Direkt an Feldkarte, wenn Label/Optionen/Validation fehlen. |
|
||||
| Canvas-Summary | Oben im Canvas: Anzahl Felder, sichtbare Fehler, Logic-Warnungen. |
|
||||
|
||||
### Canvas-Aktionen
|
||||
|
||||
| Aktion | Erwartetes Verhalten |
|
||||
|---|---|
|
||||
| Feld auswahlen | Rechts oeffnet Field Inspector. |
|
||||
| Feld verschieben | Reihenfolge aendert sich; Dirty State wird gesetzt. |
|
||||
| Feld duplizieren | Kopie unter Original; neuer field_key wird vorgeschlagen. |
|
||||
| Feld loeschen | Confirm, wenn Feld in Logic oder Actions verwendet wird. |
|
||||
| Feld einklappen/ausklappen | Lange Formulare bleiben scanbar. |
|
||||
| Feld als Pflicht markieren | Schnellaktion oder Inspector-Setting. |
|
||||
| Fehler anklicken | Springt zum betroffenen Feld/Inspector-Abschnitt. |
|
||||
|
||||
### Canvas-Zustaende
|
||||
|
||||
| Zustand | Darstellung | Umsetzung |
|
||||
|---|---|---|
|
||||
| Empty | Grosse Dropzone mit CTA "Feld hinzufuegen"; Beispiel-Felder optional. | Bauen in S01 |
|
||||
| Dragging | Dropzones sichtbar, Zielposition klar. | In S01 beschreiben |
|
||||
| Feld selected | Fokusrahmen + Inspector offen. | Bauen |
|
||||
| Feld invalid | Feldkarte mit Warnung und Summary oben. | Bauen/dokumentieren |
|
||||
| Lange Liste | Sticky Header, Feldkarten kompakt, ggf. Mini-Navigation. | Beschreiben |
|
||||
| Referenzbruch | Feldkarte zeigt "Wird in Logic/Action verwendet". | Wichtig fuer Delete/Publish |
|
||||
|
||||
## Detail: Feld-Inspector
|
||||
|
||||
Der Inspector ist der eigentliche Produktivbereich fuer Felddetails. Er braucht klare Sektionen, sonst wird der Builder unlesbar.
|
||||
|
||||
| Inspector-Sektion | Inhalt | Sichtbarkeit |
|
||||
|---|---|---|
|
||||
| Basis | Label, field_key, Beschreibung, Placeholder, Pflichtfeld. | immer |
|
||||
| Darstellung | Breite/Variante, Helptext-Position, Auswahl-Darstellung. | je Feldtyp |
|
||||
| Optionen | Select/Multi-Select-Optionen, Reihenfolge, Default. | Auswahlfelder |
|
||||
| Validation | Min/max, Regex, Datei-Typ/Groesse, Custom Error. | je Feldtyp |
|
||||
| Default | Vorbefuellung, sofern erlaubt. | optional |
|
||||
| Logic-Hinweis | Welche Regeln dieses Feld nutzen. | wenn betroffen |
|
||||
| Mapping-Hinweis | Welche Actions dieses Feld verwenden. | wenn betroffen |
|
||||
| Gefahrenzone | Feld loeschen. | unten, klar getrennt |
|
||||
|
||||
### Field-Key-Regel
|
||||
|
||||
`field_key` soll sichtbar, aber nicht lauter als Label sein. Empfehlung:
|
||||
|
||||
- Automatisch aus Label erzeugen.
|
||||
- Editierbar in Advanced/Basisdetails.
|
||||
- Warnung, wenn doppelt oder ungueltig.
|
||||
- Beim Umbenennen zeigen, ob Actions/Logic betroffen sind.
|
||||
|
||||
## Detail: Feldtypen und Inspector-Properties
|
||||
|
||||
| Feldtyp | Basis-Properties | Spezielle Properties | Validation |
|
||||
|---|---|---|---|
|
||||
| Text | Label, Key, Helptext, Placeholder, Pflicht | Einzeilig, Default | min/max Laenge, Regex, Custom Error |
|
||||
| Textarea | Label, Key, Helptext, Placeholder, Pflicht | Zeilenhoehe, Markdown-Anmutung optional | min/max Laenge, Custom Error |
|
||||
| Zahl | Label, Key, Helptext, Placeholder, Pflicht | Ganzzahl/Dezimal, Schrittweite | min/max Wert, Custom Error |
|
||||
| Waehrung | Label, Key, Helptext, Pflicht | Waehrung, Dezimalstellen, Format | min/max Betrag |
|
||||
| Datum | Label, Key, Helptext, Pflicht | Datum, optional Zeit als v2/Variante | min/max Datum |
|
||||
| Datum-Range | Label, Key, Helptext, Pflicht | Start-/End-Label, Zeitraum | Ende nach Start, min/max Datum |
|
||||
| Select | Label, Key, Helptext, Pflicht | Optionen, Default, Darstellung Dropdown/Radio | mind. 1 Option, keine leeren Optionen |
|
||||
| Multi-Select | Label, Key, Helptext, Pflicht | Optionen, max. Auswahl, Chips/Checkboxen | min/max Auswahl |
|
||||
| Boolean | Label, Key, Helptext | Checkbox/Toggle, Zustimmungstext | Muss true sein optional |
|
||||
| Email | Label, Key, Helptext, Placeholder, Pflicht | Formatvalidierung, ggf. Submitter-Email markieren | Email-Format |
|
||||
| Telefon | Label, Key, Helptext, Placeholder, Pflicht | Land/Format-Hinweis | Telefonformat |
|
||||
| Datei | Label, Key, Helptext, Pflicht | Erlaubte Dateitypen, max. Groesse, mehrere Dateien, Foto-Hinweis | Datei-Typ, Groesse |
|
||||
|
||||
### Feldtypen-Entscheidungen offen fuer David
|
||||
|
||||
| Frage | Empfehlung |
|
||||
|---|---|
|
||||
| URL als eigener Feldtyp? | Nicht in A4-12, fuer v1 als Text mit URL-Validation oder spaeterer Spezialtyp. |
|
||||
| Foto als eigener Feldtyp? | Nein, als Datei-Upload-Variante mit Mobile-Kamera-Hinweis. |
|
||||
| Signature als Feldtyp? | Nicht in D-FORM v1, weil Signatur-Wizard/Abnahme eigener Kontext ist. |
|
||||
| Section Header/Description Block? | Als optionaler Content Block pruefen, aber nicht als Pflichtbestandteil der 12 Feldtypen. |
|
||||
| Hidden Field? | Raus fuer v1, weil personalisierte Links/URL-Parameter v2 sind. |
|
||||
|
||||
### Feld-Interaktionsfaelle
|
||||
|
||||
Siehe [[D10 Builder Interaktionsfaelle]] fuer:
|
||||
|
||||
- Select-Feld ohne Optionen.
|
||||
- Datei/Fotofeld mit Upload-, Kamera-, Groessen- und Typ-Hinweisen.
|
||||
- Field Key wird geaendert und betrifft Logic/Actions.
|
||||
- Option wird geloescht, obwohl sie in Logic genutzt wird.
|
||||
- Feldtyp wird nachtraeglich geaendert.
|
||||
|
||||
## Detail: Validation
|
||||
|
||||
Validation muss zwei Ebenen haben: Feldvalidierung beim Bearbeiten und Publish-Validierung fuer das gesamte Formular.
|
||||
|
||||
| Ebene | Beispiele | UI-Form |
|
||||
|---|---|---|
|
||||
| Feld-Validation | Label fehlt, Option leer, min > max, Datei ohne erlaubte Typen. | Inline am Feld + Inspector. |
|
||||
| Form-Validation | Kein sichtbares Feld, Slug fehlt, Slug-Konflikt, kaputte Logic. | Summary-Banner + klickbare Liste. |
|
||||
| Action-Validation | Pflichtmapping fehlt, Webhook-URL ungueltig, Empfaenger fehlt. | Im Actions-Modus + Publish-Summary. |
|
||||
| Sharing-Validation | Draft nicht public, iFrame ohne Publish, Allowed-Origin-Warnung. | Im Sharing-Modus. |
|
||||
|
||||
### Publish-Blocker
|
||||
|
||||
| Blocker | Warum blockiert? | Wo zeigen? |
|
||||
|---|---|---|
|
||||
| Formularname fehlt | Public/Intern nicht identifizierbar. | Header + Summary |
|
||||
| Slug fehlt oder Konflikt | Public URL kann nicht erzeugt werden. | Settings + Summary |
|
||||
| Kein sichtbares Feld | Public Form waere leer. | Canvas Empty + Summary |
|
||||
| Feld ohne Label | Public Form waere unklar. | Feldkarte + Inspector |
|
||||
| Select ohne Optionen | Submitter kann nicht antworten. | Feldkarte + Inspector |
|
||||
| Datum-Range ungueltig | Regel ist widerspruechlich. | Inspector |
|
||||
| Kaputte Logic-Referenz | Public-Anzeige nicht verlaesslich. | Logic-Modus + Summary |
|
||||
| Pflichtmapping fehlt | Action wuerde fehlschlagen. | Actions-Modus + Summary |
|
||||
|
||||
### Nicht blockierend, aber warnen
|
||||
|
||||
| Warnung | Grund |
|
||||
|---|---|
|
||||
| Required Email ohne Submitter-Email-Markierung | Kann fuer Auto-Match/Antwortmail relevant sein. |
|
||||
| Datei-Upload ohne Typbeschraenkung | Risiko fuer Public Form. |
|
||||
| Sehr langes Formular | Public-Conversion/Mobile leidet. |
|
||||
| Published Form wird stark geaendert | Bestehender Public-Link bleibt aktiv, Aenderung ist relevant. |
|
||||
|
||||
## Detail: Conditional Logic
|
||||
|
||||
V1 soll einfach bleiben: Anzeige/Ausblenden, keine komplexe Verzweigungsmaschine.
|
||||
|
||||
| Element | Inhalt |
|
||||
|---|---|
|
||||
| Regelname optional | z. B. "Zeige Upload bei Foto vorhanden". |
|
||||
| Wenn-Feld | Nur vorhandene Felder, die als Bedingung sinnvoll sind. |
|
||||
| Operator | ist, ist nicht, enthaelt, enthaelt nicht, ist leer, ist nicht leer. |
|
||||
| Wert | Abhaengig vom Feldtyp, z. B. Option bei Select. |
|
||||
| Dann-Aktion | Feld anzeigen oder Feld verstecken. |
|
||||
| Ziel-Feld | Das Feld, dessen Sichtbarkeit gesteuert wird. |
|
||||
| Aktiv/Inaktiv | Regel testen oder parken. |
|
||||
|
||||
### Logic-Regeln
|
||||
|
||||
| Fall | UI-Verhalten |
|
||||
|---|---|
|
||||
| Bedingungsfeld geloescht | Regel wird rot markiert und blockiert Publish. |
|
||||
| Ziel-Feld geloescht | Regel wird rot markiert und blockiert Publish. |
|
||||
| Ziel-Feld required aber versteckt | Hinweis: Pflicht gilt nur wenn sichtbar. |
|
||||
| Mehrere Regeln fuer ein Feld | Hinweis auf Kombinationslogik; v1 braucht einfache Erklaerung. |
|
||||
| Regel testen | Preview zeigt, welche Felder live erscheinen/verschwinden. |
|
||||
|
||||
Nicht v1: Multi-Step-Flow, Repeater, Cross-Field-Rechnung, If/Else-Baum, Scoring, A/B-Testing.
|
||||
|
||||
## Detail: Publish / Unpublish
|
||||
|
||||
| Aktion | Ablauf |
|
||||
|---|---|
|
||||
| Publish | Nutzer klickt Publish, System prueft Blocker, bei Erfolg Status Published und Public URL aktiv. |
|
||||
| Publish mit Blockern | Kein Publish; Summary zeigt Fehler mit Sprungziel. |
|
||||
| Update published Form | Hinweis, dass Aenderungen die public Version betreffen; Save/Publish-Update klar trennen falls noetig. |
|
||||
| Unpublish | Confirm mit Hinweis, dass Public URL nicht mehr erreichbar ist. |
|
||||
| Archive | More-Menue, Confirm; nicht als Hauptaktion. |
|
||||
|
||||
Empfehlung: Publish ist kein eigener Screen. Ein Confirm/Popover reicht, solange Blocker klar im Builder sichtbar sind.
|
||||
|
||||
## Detail: Sharing
|
||||
|
||||
Sharing ist v1, aber nur fuer einfache Verteilung.
|
||||
|
||||
| Bereich | Inhalt | Aktion |
|
||||
|---|---|---|
|
||||
| Public URL | `app.hivegrid.de/f/{tenant}/{slug}` | Kopieren, oeffnen. |
|
||||
| QR-Code | QR fuer Public URL | Kopieren/downloaden. |
|
||||
| iFrame | Embed-Code mit Breite/Hoehe/Auto-Resize-Hinweis | Code kopieren. |
|
||||
| Publish-Hinweis | Draft/Unpublished zeigt Warnung | Zum Publish springen. |
|
||||
| v2-Abgrenzung | Personalisierte Links, JS-Snippet | Nicht als aktiver UI-Teil. |
|
||||
|
||||
### Sharing-Zustaende
|
||||
|
||||
| Zustand | Darstellung |
|
||||
|---|---|
|
||||
| Draft | URL-Vorschau ausgegraut, Hinweis "erst nach Publish erreichbar". |
|
||||
| Published | URL, QR, iFrame aktiv. |
|
||||
| Slug fehlt | Sharing blockiert und verweist auf Settings. |
|
||||
| Public geschlossen/Limit erreicht | Hinweis, dass Link zwar existiert, Public Form aber blockieren kann. |
|
||||
|
||||
## Detail: Post-Submit-Actions
|
||||
|
||||
Actions sind sichtbar, aber S01 darf nicht wie ein voller Automation-Editor werden.
|
||||
|
||||
| Action-Typ | Zweck in S01 | Konfiguration |
|
||||
|---|---|---|
|
||||
| Email an Submitter | Bestaetigung senden. | Empfaengerfeld, Betreff, Nachricht/Template. |
|
||||
| Email an Team | Intern informieren. | Empfaenger, Betreff, Felder-Auswahl. |
|
||||
| Lead erstellen | Submission in Lead-Inbox geben. | Mapping: Name, Email, Telefon, Nachricht, Quelle. |
|
||||
| Kontakt erstellen | CRM-Kontakt anlegen. | Mapping, Duplikat-/Auto-Match-Hinweis. |
|
||||
| Projekt erstellen | Projekt/Auftrag anlegen. | Pipeline/Status, Pflichtmapping, Verantwortlicher. |
|
||||
| Task erstellen | Aufgabe erzeugen. | Titel, Beschreibung, Faelligkeit, Assignee. |
|
||||
| Auto-Match | Bestehende Entitaet per Email/Telefon verknuepfen. | Match-Felder, Fallback. |
|
||||
| Webhook | Externes System informieren. | URL, Methode falls noetig, Test. |
|
||||
| Automation-Trigger | M17 Automation starten. | Automation-Auswahl/Trigger. |
|
||||
| KWP Push | Laut M05 vorhanden, aber KWP v1 raus. | Nicht aktiv in D-FORM v1, hoechstens v2/raus markieren. |
|
||||
|
||||
### Action-UI
|
||||
|
||||
| Element | Zweck |
|
||||
|---|---|
|
||||
| Action-Liste | Reihenfolge, Typ, Status, Warnungen. |
|
||||
| Add Action | Typ-Auswahl mit kurzer Erklaerung. |
|
||||
| Action-Detail | Ziel, Bedingungen, Mapping, Test. |
|
||||
| Field-Mapping-Zeilen | Form-Feld -> Ziel-Feld; Pflichtfelder sichtbar. |
|
||||
| Test/Preview | Zeigt, was bei einer Beispiel-Submission erzeugt wuerde. |
|
||||
| Action aktiv/inaktiv | Action parken ohne Loeschen. |
|
||||
|
||||
### Action-Blocker
|
||||
|
||||
| Blocker | UI |
|
||||
|---|---|
|
||||
| Pflichtmapping fehlt | Warnung an Action + Publish-Summary. |
|
||||
| Ziel-Pipeline fehlt | Inline im Projekt-Action-Detail. |
|
||||
| Email-Empfaenger fehlt | Inline im Email-Action-Detail. |
|
||||
| Webhook-URL ungueltig | Inline + Test disabled. |
|
||||
| Automation nicht aktiv/verfuegbar | Warnung mit Erklaerung. |
|
||||
|
||||
Nicht in S01 bauen: ActionLog, Re-Run, Fehlerhistorie je Submission. Das gehoert zur Submissions-Ansicht.
|
||||
|
||||
## Detail: Permissions / Read-only
|
||||
|
||||
| Permission / Rolle | Darf sehen | Darf tun |
|
||||
|---|---|---|
|
||||
| `forms.basic` | ggf. Submissions, aber nicht Builder-Fokus. | Kein Builder-Hauptflow. |
|
||||
| `forms.builder` | Builder sehen und bearbeiten. | Felder, Logic, Settings speichern. |
|
||||
| `forms.publisher` | Builder + Sharing. | Publish/Unpublish, Export/Submissions ausserhalb D-FORM. |
|
||||
| `forms.admin` | Alles im Builder. | Actions, Templates, administrative Optionen. |
|
||||
|
||||
### Permission-Zustaende in S01
|
||||
|
||||
| Zustand | UI |
|
||||
|---|---|
|
||||
| Keine Builder-Rechte | Permission-State statt Builder; CTA "Admin kontaktieren" oder zurueck. |
|
||||
| Read-only wegen fehlender Publish-Rechte | Publish disabled mit Tooltip, Bearbeitung ggf. erlaubt. |
|
||||
| Actions nur Admin | Actions-Modus disabled oder read-only mit Hinweis. |
|
||||
| Archived Form | Bearbeitung eingeschraenkt; Duplizieren als naechste Aktion. |
|
||||
|
||||
## Daten
|
||||
|
||||
- Form-Stammdaten: Name, Beschreibung, Slug, Status, Subtype.
|
||||
- Form-Felder: Reihenfolge, Feldtyp, Label, Beschreibung/Hilfe, Placeholder, Pflichtfeld.
|
||||
- Feldtypen v1: Text, Textarea, Zahl, Waehrung, Datum, Datum-Range, Select, Multi-Select, Boolean, Email, Telefon, Datei.
|
||||
- Feld-Konfiguration: Optionen, Default, Validation, Datei-/Foto-Regeln je Feldtyp.
|
||||
- Conditional Logic: einfache Wenn-Dann-Regeln.
|
||||
- Live-Vorschau: gerenderte Form in Public-nahem Zustand.
|
||||
- Sharing: Public URL, QR-Code, iFrame-Code.
|
||||
- Post-Submit-Actions: Lead/Kontakt/Projekt/Task, Email, Webhook, Automation-Trigger, Auto-Match.
|
||||
- Field-Mapping je Action.
|
||||
- Publish-Status und moegliche Publish-Blocker.
|
||||
|
||||
## Header / Statusbar
|
||||
|
||||
| Element | Zweck |
|
||||
|---|---|
|
||||
| Form-Name inline | schnell umbenennen. |
|
||||
| Status-Badge | Draft, Published, Archived, Fehler. |
|
||||
| Save | Entwurf sichern. |
|
||||
| Preview | Public-nahe Vorschau oeffnen/umschalten. |
|
||||
| Publish/Unpublish | Public-Verfuegbarkeit steuern. |
|
||||
| Share | URL, QR und iFrame erreichbar machen. |
|
||||
| Validation-Summary | zeigt, ob Publish blockiert ist. |
|
||||
|
||||
## Aktionen
|
||||
|
||||
- Feld aus Palette hinzufuegen.
|
||||
- Feld per Drag-and-Drop verschieben.
|
||||
- Feld auswaehlen.
|
||||
- Feld bearbeiten.
|
||||
- Feld duplizieren.
|
||||
- Feld loeschen.
|
||||
- Feld als Pflichtfeld markieren.
|
||||
- Validierung konfigurieren.
|
||||
- Optionen fuer Select/Multi-Select/Radio pflegen.
|
||||
- Conditional-Logic-Regel anlegen, bearbeiten, deaktivieren, loeschen.
|
||||
- Vorschau ansehen.
|
||||
- Form speichern.
|
||||
- Form publishen/unpublishen.
|
||||
- Public URL kopieren.
|
||||
- QR-Code kopieren/downloaden.
|
||||
- iFrame-Code kopieren.
|
||||
- Post-Submit-Action hinzufuegen.
|
||||
- Field-Mapping setzen.
|
||||
- Webhook testen oder validieren.
|
||||
|
||||
## Feldtypen v1
|
||||
|
||||
| Feldtyp | Was David sichtbar machen sollte |
|
||||
|---|---|
|
||||
| Text | Label, Placeholder, Pflicht, min/max Laenge. |
|
||||
| Textarea | Label, Helptext, Pflicht, min/max Laenge. |
|
||||
| Zahl | Label, min/max, Dezimal/Ganzzahl-Hinweis. |
|
||||
| Waehrung | Betrag, Waehrung/Format, min/max. |
|
||||
| Datum | Date-Picker, Pflicht, min/max Datum optional. |
|
||||
| Datum-Range | Start/Ende, Validierung Ende nach Start. |
|
||||
| Select | Optionen, ein Wert. |
|
||||
| Multi-Select | Optionen, mehrere Werte. |
|
||||
| Boolean | Checkbox/Toggle, Pflicht-/Zustimmungsfall. |
|
||||
| Email | Email-Validation automatisch. |
|
||||
| Telefon | Telefonformat-Hinweis. |
|
||||
| Datei | Upload, erlaubte Typen, max. Groesse; Foto als mobile Upload-Variante. |
|
||||
|
||||
Anti-Spam-Felder wie Honeypot/mCaptcha sind Systemschutz, nicht Teil der sichtbaren 12-Feld-Palette.
|
||||
|
||||
## Logic-Arbeitsbereich
|
||||
|
||||
| Element | Zweck |
|
||||
|---|---|
|
||||
| Regel-Liste | Alle aktiven Regeln scannen. |
|
||||
| Neue Regel | Wenn Feld Y Operator Wert Z, dann Feld X anzeigen/verstecken. |
|
||||
| Feld-Auswahl | Nur vorhandene Felder; kaputte Referenzen sichtbar markieren. |
|
||||
| Operatoren | v1 simpel: ist, ist nicht, enthaelt, ist leer/nicht leer. |
|
||||
| Ziel-Feld | Welches Feld wird angezeigt oder verborgen. |
|
||||
| Regel aktiv/inaktiv | Regel testen oder parken. |
|
||||
|
||||
Nicht bauen: komplexe If/Else-Baeume, Multi-Step-Flow, Cross-Field-Rechnung.
|
||||
|
||||
## Post-Submit-Actions Schnitt
|
||||
|
||||
| Bereich | In S01 zeigen? | Notiz |
|
||||
|---|---|---|
|
||||
| Action-Typ waehlen | ja | Lead/Kontakt/Projekt/Task, Email, Webhook, Automation-Trigger, Auto-Match. |
|
||||
| Reihenfolge | ja | Actions laufen in definierter Reihenfolge. |
|
||||
| Aktiv/Inaktiv | ja | Einzelne Actions deaktivierbar. |
|
||||
| Field-Mapping | ja | Form-Feld -> Ziel-Feld, Pflichtwarnungen sichtbar. |
|
||||
| Bedingung pro Action | optional | Nur einfache Filter, kein voller Logic-Builder. |
|
||||
| Test/Preview | ja | Was wuerde erzeugt/gesendet? |
|
||||
| Voller ActionLog/Re-Run | nein | Gehoert zur Submissions-Ansicht, nicht zum Builder-Canvas. |
|
||||
|
||||
## Sharing-Arbeitsbereich
|
||||
|
||||
| Element | Zweck |
|
||||
|---|---|
|
||||
| Public URL | Link kopieren, ggf. oeffnen. |
|
||||
| QR-Code | Fuer Print/Monteure/Kundenkontakt. |
|
||||
| iFrame-Code | Einbettung auf Website. |
|
||||
| Publish-Hinweis | Sharing ist erst sinnvoll, wenn published. |
|
||||
| v2-Hinweis intern | Personalisierte Links und JS-Snippet nicht in v1. |
|
||||
|
||||
## Settings-Arbeitsbereich
|
||||
|
||||
| Element | Zweck |
|
||||
|---|---|
|
||||
| Slug | Public URL steuern. |
|
||||
| Success Message | Text nach Submit. |
|
||||
| Redirect URL | optionales Weiterleitungsziel. |
|
||||
| Tenant Branding / Theme | Logo/Farbe/Fallback, soweit v1 vorgesehen. |
|
||||
| Allowed Origins | falls iFrame/API eingeschraenkt wird. |
|
||||
| Submission Limit / Close Date | optional, falls Dev fuer v1 bestaetigt. |
|
||||
|
||||
## Banner / Hinweise
|
||||
|
||||
- Publish-Blocker-Banner: zeigt konkrete fehlende Punkte, z. B. kein sichtbares Feld, fehlender Slug, ungueltige Logic-Regel.
|
||||
- Unsaved-Changes-Hinweis: wenn Nutzer weg navigiert oder publizieren will.
|
||||
- Reuse-Hinweis optional: Public Renderer wird auch fuer HR/Booking-Intake wiederverwendet, aber nicht als sichtbarer Feature-Text im UI.
|
||||
|
||||
## Toasts / Action-Feedback
|
||||
|
||||
- Gespeichert.
|
||||
- Veroeffentlicht.
|
||||
- Entwurf deaktiviert/unpublished.
|
||||
- Public URL kopiert.
|
||||
- QR-Code kopiert/downloadet.
|
||||
- iFrame-Code kopiert.
|
||||
- Action gespeichert.
|
||||
- Test-Webhook erfolgreich/fehlgeschlagen.
|
||||
|
||||
## Meldungsentscheidung
|
||||
|
||||
| Ereignis | UI-Form | Blockiert? | Umsetzung | Copy/Notiz |
|
||||
|---|---|---|---|---|
|
||||
| Keine Felder im Canvas | Empty State im Canvas | nein | Bauen | Feld aus Palette hinzufuegen. |
|
||||
| Feld ohne Label | Inline am Feld + Summary | ja fuer Publish | Nur dokumentieren | Feld konkret benennen. |
|
||||
| Required Email ohne Email-Validation | Inline-Warnung | nein/Publish-Warnung | Nur dokumentieren | Vorschlag: Email-Validation hinzufuegen. |
|
||||
| Logic-Regel referenziert geloeschtes Feld | Inline im Logic-Panel + Summary | ja fuer Publish | Nur dokumentieren | Regel reparieren oder deaktivieren. |
|
||||
| Ungueltige Webhook-URL | Inline im Action-Panel | ja fuer Action | Nur dokumentieren | URL muss http/https und erreichbar sein. |
|
||||
| Publish erfolgreich | Toast + Statuswechsel | nein | Nur dokumentieren | Veroeffentlicht. |
|
||||
| Kopieren erfolgreich | Toast | nein | Nur dokumentieren | In Zwischenablage kopiert. |
|
||||
|
||||
## Zustaende
|
||||
|
||||
| Zustand | Beschreibung | Umsetzung |
|
||||
|---|---|---|
|
||||
| Leer | Neues Formular ohne Felder; Canvas zeigt Drop-Zone und CTA. | Bauen |
|
||||
| Laden | Form-Definition und Actions werden geladen. | Wiederverwenden |
|
||||
| Fehler | Form kann nicht geladen werden. | Nur dokumentieren |
|
||||
| Keine Berechtigung | Nutzer hat keine `forms.builder`/`forms.publish`-Rechte. | Nur dokumentieren |
|
||||
| Dirty State | Ungespeicherte Aenderungen. | Nur dokumentieren |
|
||||
| Publish blocked | Form hat Fehler, die Public-Version verhindern. | Nur dokumentieren |
|
||||
|
||||
## Blockierende Error States
|
||||
|
||||
| Zustand | Was sieht der Nutzer? | Primaeraktion | Sekundare Aktion |
|
||||
|---|---|---|---|
|
||||
| Publish blockiert | Banner mit Liste der fehlenden Punkte. | Fehler beheben | Als Entwurf speichern |
|
||||
| Keine Berechtigung | Permission-State mit Klartext. | Zurueck zu Formularen | Admin kontaktieren |
|
||||
| Form nicht gefunden | Fehler-State. | Zurueck zu Formularen | - |
|
||||
|
||||
## Permissions / Gates
|
||||
|
||||
- `forms.builder`: Felder und Konfiguration bearbeiten.
|
||||
- `forms.publisher`: Publish/Unpublish und Sharing aktivieren.
|
||||
- `forms.admin`: Actions, Mapping und administrative Optionen.
|
||||
|
||||
## Subframe
|
||||
|
||||
- [Subframe](https://app.subframe.com/f023064a5ca0/design/e5502f88-9858-460e-abae-671f28464270/edit)
|
||||
|
||||
Layout-Regel: Der Advanced Builder nutzt das vorhandene Subframe `Default Page Layout`. Keine eigene Sidebar nachbauen.
|
||||
|
||||
## Notizen
|
||||
|
||||
Der Builder soll nicht den Automation-Flow-Editor nachbauen. Post-Submit-Actions brauchen nur Reihenfolge, Typ, Ziel und Field-Mapping.
|
||||
|
||||
Conditional Logic ist v1, aber eng: Wenn Feld Y = Wert Z, dann Feld X anzeigen. Kein Repeater, kein Multi-Step, keine Cross-Field-Validation.
|
||||
|
||||
Wichtig fuer David: Der Screen ist eine Arbeitsflaeche, kein Marketing-Screen. Dichte ist erlaubt, solange die Hauptarbeit gut scannbar bleibt.
|
||||
+34
@@ -0,0 +1,34 @@
|
||||
---
|
||||
kind: screen
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
package: WF-D-FORM Form Builder
|
||||
id: ADV-S01-2
|
||||
screen: Form-Builder Canvas 2
|
||||
typ: Advanced / Referenz
|
||||
umsetzung: Referenz behalten
|
||||
status: Subframe Draft / aktuell nicht Hauptfluss
|
||||
route: /forms/:id/edit
|
||||
subframe: "https://app.subframe.com/f023064a5ca0/design/9529ac6f-eb71-4e5c-8774-7cebe9c8162c/edit"
|
||||
---
|
||||
|
||||
# ADV-S01-2 - Form-Builder Canvas 2
|
||||
|
||||
## Status
|
||||
|
||||
Diese Seite ist aktuell **nicht Teil des Hauptflusses**.
|
||||
|
||||
Sie bleibt als Advanced-/Referenzscreen erhalten, falls David oder spaetere Umsetzung die umfangreichere Builder-Logik pruefen will.
|
||||
|
||||
## Warum nicht Hauptfluss
|
||||
|
||||
- Zu viel sichtbare Komplexitaet fuer normale Handwerksbetriebe.
|
||||
- S02 ist aktuell die empfohlene Google-Forms-nahe Hauptvariante.
|
||||
- Logic, Actions und Publish-Blocker werden in S02 einfacher geloest.
|
||||
|
||||
## Subframe
|
||||
|
||||
Gebaut in Subframe:
|
||||
|
||||
https://app.subframe.com/f023064a5ca0/design/9529ac6f-eb71-4e5c-8774-7cebe9c8162c/edit
|
||||
|
||||
+98
@@ -0,0 +1,98 @@
|
||||
---
|
||||
kind: screen
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
package: WF-D-FORM Form Builder
|
||||
id: D07
|
||||
screen: Logic Regel Detail
|
||||
typ: Panel-Zustand in S01
|
||||
umsetzung: Bauen
|
||||
status: Subframe Draft / Review offen
|
||||
route: in S01 Logic-Modus, kein eigener Screen
|
||||
subframe: "https://app.subframe.com/f023064a5ca0/design/07b60457-8151-46b9-ba34-34eceffc08bb/edit"
|
||||
---
|
||||
|
||||
# D07 - Logic Regel Detail
|
||||
|
||||
## Ziel
|
||||
|
||||
Interne Nutzer koennen eine einzelne Sichtbarkeitsregel sauber anlegen oder bearbeiten.
|
||||
|
||||
## Pattern / Archetyp
|
||||
|
||||
Detailpanel / Drawer innerhalb des Logic-Modus von S01.
|
||||
|
||||
## Daten
|
||||
|
||||
- Regelname optional
|
||||
- Bedingungsfeld
|
||||
- Operator
|
||||
- Wert
|
||||
- Dann-Aktion: anzeigen oder verstecken
|
||||
- Zielfeld
|
||||
- Status aktiv/inaktiv
|
||||
- Preview-/Testhinweis
|
||||
|
||||
## Aktionen
|
||||
|
||||
- Bedingungsfeld waehlen
|
||||
- Operator waehlen
|
||||
- Wert setzen
|
||||
- Zielfeld waehlen
|
||||
- Aktion anzeigen/verstecken waehlen
|
||||
- Regel speichern
|
||||
- Regel testen
|
||||
- Regel deaktivieren
|
||||
- Regel loeschen
|
||||
|
||||
## Verhalten
|
||||
|
||||
- `Neue Regel` oeffnet dieses Detailpanel im selben S01-Screen.
|
||||
- Keine Modal-Kaskade fuer Logic.
|
||||
- Feldauswahlen zeigen nur vorhandene passende Felder.
|
||||
- Wenn ein referenziertes Feld fehlt, bleibt die Regel sichtbar und markiert kaputt.
|
||||
- Test/Preview kann direkt den Preview-Modus beeinflussen oder eine kurze Vorschau im Panel zeigen.
|
||||
- Detailfaelle fuer unvollstaendige Auswahlfolgen stehen in [[D10 Builder Interaktionsfaelle]].
|
||||
|
||||
## Zustaende
|
||||
|
||||
| Zustand | Beschreibung | Umsetzung |
|
||||
|---|---|---|
|
||||
| Neue Regel | leeres Detailpanel mit Pflichtfeldern. | Nur dokumentieren |
|
||||
| Gueltige Regel | alle Referenzen vorhanden. | Nur dokumentieren |
|
||||
| Unvollstaendig | Pflichtteil fehlt; Regel kann nicht aktiv werden. | Nur dokumentieren |
|
||||
| Referenz kaputt | Bedingungs- oder Zielfeld fehlt. | Nur dokumentieren |
|
||||
| Testmodus | Preview zeigt Wirkung der Regel. | In S01 dokumentieren |
|
||||
|
||||
## Auswahlfolge im Panel
|
||||
|
||||
| Schritt | Verhalten |
|
||||
|---|---|
|
||||
| 1. Wenn-Feld | Nach Auswahl wird das Operator-Dropdown passend zum Feldtyp aktiv. |
|
||||
| 2. Operator | Bei `ist leer`/`ist nicht leer` entfaellt das Wertfeld. Bei Select/Boolean wird das Wertfeld zur passenden Auswahl. |
|
||||
| 3. Wert | Pflicht nur bei Operatoren, die einen Wert brauchen. |
|
||||
| 4. Dann-Aktion | `anzeigen` oder `verstecken`; keine komplexe If/Else-Struktur. |
|
||||
| 5. Zielfeld | Darf nicht identisch mit dem Bedingungsfeld sein. |
|
||||
| 6. Aktiv | Erst aktivierbar, wenn alle Pflichtteile gueltig sind. |
|
||||
|
||||
## Fehlerlogik
|
||||
|
||||
| Fehler | Anzeige | Folge |
|
||||
|---|---|---|
|
||||
| Operator fehlt | Inline unter Operator. | Test disabled, aktive Regel nicht moeglich. |
|
||||
| Wert fehlt | Inline unter Wertfeld. | Test disabled, Publish blockiert nur bei aktiver Regel. |
|
||||
| Zielfeld fehlt | Inline unter Zielfeld. | Regel unvollstaendig. |
|
||||
| Referenz kaputt | Rote Markierung an Regel und Detailpanel. | Publish blockiert, Sprung aus Summary. |
|
||||
| Feldtyp geaendert | Dlter Wert kann ungueltig werden. | Wert neu waehlen oder Regel deaktivieren. |
|
||||
|
||||
## Subframe
|
||||
|
||||
- [Subframe](https://app.subframe.com/f023064a5ca0/design/07b60457-8151-46b9-ba34-34eceffc08bb/edit)
|
||||
|
||||
Gebaut als zusaetzlicher Builder-Zustand. Das Detail bleibt fachlich ein Zustand im Logic-Modus von S01, ist aber als eigener Frame sichtbar, damit David die Regelbearbeitung pruefen kann.
|
||||
|
||||
Layout-Regel: D07 nutzt das vorhandene Subframe `Default Page Layout`. Keine eigene Sidebar oder Header-Navigation nachbauen.
|
||||
|
||||
## Notizen
|
||||
|
||||
Die Regel-Logik bleibt bewusst eng: Wenn Feld Y Operator Wert Z, dann Feld X anzeigen/verstecken.
|
||||
+112
@@ -0,0 +1,112 @@
|
||||
---
|
||||
kind: screen
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
package: WF-D-FORM Form Builder
|
||||
id: D08
|
||||
screen: Action Detail mit Mapping
|
||||
typ: Panel-Zustand in S01
|
||||
umsetzung: Bauen
|
||||
status: Subframe Draft / Review offen
|
||||
route: in S01 Actions-Modus, kein eigener Screen
|
||||
subframe: "https://app.subframe.com/f023064a5ca0/design/0759d779-91f5-4e06-b1d6-7cd0095461ea/edit"
|
||||
---
|
||||
|
||||
# D08 - Action Detail mit Mapping
|
||||
|
||||
## Ziel
|
||||
|
||||
Interne Nutzer konfigurieren eine einzelne Post-Submit-Action und sehen sofort, ob Pflichtmapping oder Zielwerte fehlen.
|
||||
|
||||
## Pattern / Archetyp
|
||||
|
||||
Detailpanel / Drawer innerhalb des Actions-Modus von S01.
|
||||
|
||||
## Daten
|
||||
|
||||
- Action-Typ
|
||||
- Action-Name
|
||||
- Status aktiv/inaktiv
|
||||
- Ziel, z. B. Empfaenger, Pipeline, Projektstatus, Webhook-URL
|
||||
- Field-Mapping: Formularfeld -> Ziel-Feld
|
||||
- Pflichtfelder
|
||||
- optionale Bedingungen
|
||||
- Teststatus
|
||||
|
||||
## Aktionen
|
||||
|
||||
- Action benennen
|
||||
- Ziel konfigurieren
|
||||
- Mapping-Zeilen setzen
|
||||
- optionale Bedingung setzen
|
||||
- Test ausfuehren
|
||||
- Action speichern
|
||||
- Action deaktivieren
|
||||
- Action loeschen
|
||||
|
||||
## Verhalten
|
||||
|
||||
- Nach Auswahl eines Action-Typs oeffnet sich dieses Detailpanel.
|
||||
- Mapping wird inline als Zeilenliste bearbeitet.
|
||||
- Pflichtmapping wird klar markiert.
|
||||
- Test zeigt ein Ergebnis im Panel, kein eigener Screen.
|
||||
- Loeschen einer aktiven oder published-relevanten Action nutzt Confirm.
|
||||
- Detailfaelle fuer halb gesetztes Mapping, Typwechsel und fehlende Pflichtziele stehen in [[D10 Builder Interaktionsfaelle]].
|
||||
|
||||
## Action-Typen
|
||||
|
||||
| Typ | Wichtigste Konfiguration |
|
||||
|---|---|
|
||||
| Email Submitter | Submitter-Email-Feld, Betreff, Nachricht. |
|
||||
| Email Team | Empfaenger, Betreff, Feldauswahl. |
|
||||
| Lead | Mapping fuer Name, Email, Telefon, Nachricht, Quelle. |
|
||||
| Kontakt | Kontakt-Mapping und Duplikat-/Auto-Match-Hinweis. |
|
||||
| Projekt | Pipeline, Status, Verantwortlicher, Pflichtmapping. |
|
||||
| Task | Titel, Beschreibung, Faelligkeit, Assignee. |
|
||||
| Auto-Match | Match-Felder, Fallback. |
|
||||
| Webhook | URL, Test, Payload-Vorschau. |
|
||||
| Automation-Trigger | Automation-Auswahl und Trigger-Hinweis. |
|
||||
|
||||
## Zustaende
|
||||
|
||||
| Zustand | Beschreibung | Umsetzung |
|
||||
|---|---|---|
|
||||
| Neu | Action-Typ gewaehlt, Detail noch leer. | Nur dokumentieren |
|
||||
| Vollstaendig | Pflichtfelder und Mapping gesetzt. | Nur dokumentieren |
|
||||
| Pflichtmapping fehlt | Publish oder Action-Test blockiert. | Nur dokumentieren |
|
||||
| Test erfolgreich | Inline-Ergebnis plus Toast. | Wiederverwenden |
|
||||
| Test fehlgeschlagen | Inline-Fehler im Panel. | Nur dokumentieren |
|
||||
|
||||
## Auswahlfolge im Panel
|
||||
|
||||
| Schritt | Verhalten |
|
||||
|---|---|
|
||||
| 1. Action-Typ | Bestimmt, welche Pflichtfelder und Mapping-Zeilen erscheinen. |
|
||||
| 2. Ziel | Empfaenger, Pipeline, Webhook-URL, Automation oder Entity-Ziel wird gesetzt. |
|
||||
| 3. Mapping | Formularfelder werden Ziel-Feldern zugeordnet. |
|
||||
| 4. Optional Bedingung | Nur einfache Bedingung; kein zweiter Logic-Builder. |
|
||||
| 5. Test | Erst aktiv, wenn Pflichtziel und Pflichtmapping vollstaendig sind. |
|
||||
| 6. Aktiv | Aktive unvollstaendige Actions blockieren Publish; inaktive unvollstaendige Actions nicht. |
|
||||
|
||||
## Was-passiert-wenn-Faelle
|
||||
|
||||
| Fall | UI-Reaktion | Folge |
|
||||
|---|---|---|
|
||||
| Action-Typ gewaehlt, Pflichtziel vergessen | Inline-Fehler im Zielbereich. | Test disabled; aktive Action blockiert Publish. |
|
||||
| Mapping-Ziel gesetzt, Quelle vergessen | Mapping-Zeile markiert fehlende Quelle. | Test disabled; aktive Action blockiert Publish. |
|
||||
| Email Submitter ohne Email-Feld | Hinweis mit CTD `Email-Feld hinzufuegen`. | Action bleibt unvollstaendig. |
|
||||
| Projekt erstellen ohne Pipeline | Pipeline-Auswahl markiert. | Publish blockiert aktive Action. |
|
||||
| Webhook-URL ungueltig | URL-Feld zeigt Fehler. | Test disabled. |
|
||||
| Action-Typ nach Mapping wechseln | Confirm/Popover erklaert, dass Mapping ungueltig werden kann. | Nutzer bestaetigt oder bricht ab. |
|
||||
|
||||
## Subframe
|
||||
|
||||
- [Subframe](https://app.subframe.com/f023064a5ca0/design/0759d779-91f5-4e06-b1d6-7cd0095461ea/edit)
|
||||
|
||||
Gebaut als zusaetzlicher Builder-Zustand. Das Detail bleibt fachlich ein Zustand im Actions-Modus von S01, ist aber als eigener Frame sichtbar, weil Mapping und Pflichtfelder fuer den Builder sehr fehleranfaellig sind.
|
||||
|
||||
Layout-Regel: D08 nutzt das vorhandene Subframe `Default Page Layout`. Keine eigene Sidebar oder Header-Navigation nachbauen.
|
||||
|
||||
## Notizen
|
||||
|
||||
ActionLog, Re-Run und Fehlerhistorie pro Submission bleiben ausserhalb von D-FORM.
|
||||
+114
@@ -0,0 +1,114 @@
|
||||
---
|
||||
kind: screen
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
package: WF-D-FORM Form Builder
|
||||
id: D09
|
||||
screen: Publish Blocker Summary
|
||||
typ: Inline-Zustand in S01
|
||||
umsetzung: Bauen
|
||||
status: Subframe Draft / Review offen
|
||||
route: in S01 nach Klick auf Publish
|
||||
subframe: "https://app.subframe.com/f023064a5ca0/design/211e8ca7-fc0b-4c52-a4a4-a1e660209e58/edit"
|
||||
---
|
||||
|
||||
# D09 - Publish Blocker Summary
|
||||
|
||||
## Ziel
|
||||
|
||||
Interne Nutzer verstehen nach Klick auf Publish sofort, warum ein Formular nicht veroeffentlicht werden kann und wo sie es korrigieren.
|
||||
|
||||
## Pattern / Archetyp
|
||||
|
||||
Inline Summary-Banner / Popover mit Sprungzielen im S01-Builder.
|
||||
|
||||
## Daten
|
||||
|
||||
- Anzahl Blocker
|
||||
- Blocker-Gruppe: Form, Feld, Logic, Actions, Sharing/Settings
|
||||
- betroffener Feldname oder Action-Name
|
||||
- Ziel im Builder, zu dem gesprungen werden kann
|
||||
- nicht-blockierende Warnungen
|
||||
|
||||
## Aktionen
|
||||
|
||||
- Blocker anklicken
|
||||
- zum Feld springen
|
||||
- zum Inspector-Abschnitt springen
|
||||
- Logic-Modus oeffnen
|
||||
- Actions-Modus oeffnen
|
||||
- Settings oeffnen
|
||||
- Publish nach Korrektur erneut versuchen
|
||||
|
||||
## Verhalten
|
||||
|
||||
- Klick auf `Publish` startet einen Check im selben Screen.
|
||||
- Bei Blockern wird nicht published.
|
||||
- Die Summary erscheint oben im Builder oder als klarer Inline-Bereich nahe der Topbar.
|
||||
- Jeder Blocker hat ein Sprungziel.
|
||||
- Nicht-blockierende Warnungen koennen als eigener Abschnitt erscheinen und erlauben Publish nach Bestaetigung.
|
||||
- Bei Erfolg gibt es Statuswechsel und Toast, keinen eigenen Erfolgsscreen.
|
||||
- Ausfuehrliche Auswahl-/Vergessensfaelle stehen in [[D10 Builder Interaktionsfaelle]].
|
||||
|
||||
## Blocker
|
||||
|
||||
| Blocker | Ziel |
|
||||
|---|---|
|
||||
| Formularname fehlt | Header/Form-Name |
|
||||
| Slug fehlt oder Konflikt | Settings |
|
||||
| Kein sichtbares Feld | Canvas Empty State |
|
||||
| Feld ohne Label | Feldkarte + Inspector |
|
||||
| Select ohne Optionen | Feldkarte + Inspector Optionen |
|
||||
| Kaputte Logic | Logic-Modus |
|
||||
| Pflichtmapping fehlt | Actions-Modus |
|
||||
| Webhook-URL ungueltig | Action-Detail |
|
||||
|
||||
## Was-passiert-wenn-Faelle
|
||||
|
||||
| Fall | Summary-Verhalten | Sprungziel |
|
||||
|---|---|---|
|
||||
| Nutzer hat Select-Feld angelegt, aber Optionen vergessen | Blocker `Auswahlfeld hat keine Optionen`. | Feldkarte + Inspector `Optionen` |
|
||||
| Nutzer hat Logic-Regel halb gebaut | Blocker `Logic-Regel unvollstaendig`, wenn aktiv. | Logic-Regel-Detail |
|
||||
| Nutzer hat Action-Typ gewaehlt, aber Mapping vergessen | Blocker `Pflichtmapping fehlt`, wenn Action aktiv. | Action-Detail mit Mapping |
|
||||
| Nutzer hat Datei-Feld ohne Typbeschraenkung | Warnung, nicht zwingend Blocker. | Datei-Feld Inspector |
|
||||
| Nutzer hat Field Key ungueltig geaendert | Blocker `Field Key ungueltig oder doppelt`. | Inspector Basis/Advanced |
|
||||
| Nutzer hat nur inaktive unvollstaendige Action | Optional Warnung, kein harter Blocker. | Actions-Liste |
|
||||
| Nutzer hat unsaved changes | Erst speichern oder Save-Check zeigen. | Header/Save |
|
||||
|
||||
## Zustaende
|
||||
|
||||
| Zustand | Beschreibung | Umsetzung |
|
||||
|---|---|---|
|
||||
| Keine Blocker | Publish erfolgreich. | Toast/Statuswechsel |
|
||||
| Blocker vorhanden | Summary mit Sprungzielen. | Nur dokumentieren |
|
||||
| Nur Warnungen | Nutzer kann trotzdem publishen. | Nur dokumentieren |
|
||||
| Save vorher noetig | Hinweis, dass Aenderungen erst gespeichert werden. | Nur dokumentieren |
|
||||
|
||||
## Copy-Richtung
|
||||
|
||||
| Situation | Copy-Beispiel |
|
||||
|---|---|
|
||||
| Feld ohne Label | `Dieses Feld braucht ein Label, bevor das Formular veroeffentlicht werden kann.` |
|
||||
| Select ohne Optionen | `Fuege mindestens eine Option hinzu, damit Nutzer antworten koennen.` |
|
||||
| Logic unvollstaendig | `Diese Regel ist noch nicht vollstaendig. Ergaenze Operator, Wert oder Zielfeld.` |
|
||||
| Mapping fehlt | `Diese Action braucht noch eine Zuordnung fuer Pflichtfelder.` |
|
||||
| Nur Warnung | `Du kannst veroeffentlichen, aber diese Einstellung sollte geprueft werden.` |
|
||||
|
||||
## Subframe
|
||||
|
||||
Gebaut in Subframe:
|
||||
|
||||
https://app.subframe.com/f023064a5ca0/design/211e8ca7-fc0b-4c52-a4a4-a1e660209e58/edit
|
||||
|
||||
Qualitaetsregel:
|
||||
|
||||
- Interner Builder-Zustand nutzt das vorhandene `Default Page Layout`.
|
||||
- Keine eigene Sidebar oder Header-Navigation nachbauen.
|
||||
- D09 bleibt Inline Summary/Banner im Builder, kein Modal/Dialog.
|
||||
- Publish bleibt deaktiviert, bis harte Blocker geloest sind.
|
||||
- Warnungen sind sichtbar, blockieren aber nicht zwingend.
|
||||
- Jeder Blocker hat ein klares Sprungziel in Feld, Logic, Actions oder Settings.
|
||||
|
||||
## Notizen
|
||||
|
||||
Publish ist kein Wizard. Der Nutzer bleibt im Builder und korrigiert direkt dort.
|
||||
+68
@@ -0,0 +1,68 @@
|
||||
---
|
||||
kind: screen
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
package: WF-D-FORM Form Builder
|
||||
id: D01
|
||||
screen: Sharing Panel URL QR iFrame
|
||||
typ: Panel-Zustand in S01
|
||||
umsetzung: Nur dokumentieren
|
||||
status: Vor Subframe / dokumentiert
|
||||
route: in ADV-S01 Form-Builder Canvas, kein eigener Screen
|
||||
subframe: "-"
|
||||
---
|
||||
|
||||
# D01 - Sharing Panel URL QR iFrame
|
||||
|
||||
## Ziel
|
||||
|
||||
Interne Nutzer koennen nach dem Publish die Public URL, den QR-Code und den iFrame-Code nutzen, ohne den Builder zu verlassen.
|
||||
|
||||
## Pattern / Archetyp
|
||||
|
||||
Panel / Arbeitsmodus innerhalb von S01.
|
||||
|
||||
## Daten
|
||||
|
||||
- Formularname
|
||||
- Publish-Status: Draft, Published, Unpublished Changes, Archived
|
||||
- Public URL: `/f/{tenant}/{slug}`
|
||||
- Slug und Tenant
|
||||
- QR-Code fuer Public URL
|
||||
- iFrame-Code
|
||||
- Allowed Origins, falls fuer iFrame relevant
|
||||
|
||||
## Aktionen
|
||||
|
||||
- Public URL kopieren
|
||||
- Public URL oeffnen
|
||||
- QR-Code kopieren oder herunterladen
|
||||
- iFrame-Code kopieren
|
||||
- zu Settings springen, wenn Slug fehlt
|
||||
- zu Publish springen, wenn Formular noch Draft ist
|
||||
|
||||
## Verhalten
|
||||
|
||||
- Klick auf `Share` in der Topbar oeffnet keinen Dialog, sondern wechselt in den Sharing-Modus von S01.
|
||||
- Bei `Published` sind URL, QR und iFrame aktiv.
|
||||
- Bei `Draft` bleibt der Bereich sichtbar, aber die echten Copy-Aktionen sind disabled oder zeigen einen Publish-Hinweis.
|
||||
- Bei fehlendem Slug verweist das Panel auf Settings.
|
||||
- Copy-Aktionen zeigen nur Toasts, keine Modals.
|
||||
|
||||
## Zustaende
|
||||
|
||||
| Zustand | Beschreibung | Umsetzung |
|
||||
|---|---|---|
|
||||
| Published | URL, QR und iFrame sind aktiv. | Nur dokumentieren |
|
||||
| Draft | Sharing ist ausgegraut und erklaert Publish als Voraussetzung. | Nur dokumentieren |
|
||||
| Slug fehlt | Panel verweist auf Settings. | Nur dokumentieren |
|
||||
| Kopiert | Toast bestaetigt Copy-Aktion. | Wiederverwenden |
|
||||
| Archived | Sharing ist read-only oder deaktiviert. | Nur dokumentieren |
|
||||
|
||||
## Subframe
|
||||
|
||||
Kein eigener Subframe-Screen. Der Zustand wird im S01-Builder als Sharing-Modus/Panel gezeigt. Ein eigener Frame ist nur noetig, wenn David den geoeffneten Sharing-Zustand separat sehen will.
|
||||
|
||||
## Notizen
|
||||
|
||||
Personalisierte Links und JS-Snippet bleiben v2. D-FORM v1 zeigt URL, QR und iFrame.
|
||||
+91
@@ -0,0 +1,91 @@
|
||||
---
|
||||
kind: screen
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
package: WF-D-FORM Form Builder
|
||||
id: D02
|
||||
screen: Post-Submit Actions
|
||||
typ: Panel-Zustand in S01
|
||||
umsetzung: Nur dokumentieren
|
||||
status: Vor Subframe / dokumentiert
|
||||
route: in ADV-S01 Form-Builder Canvas, kein eigener Screen
|
||||
subframe: "-"
|
||||
---
|
||||
|
||||
# D02 - Post-Submit Actions
|
||||
|
||||
## Ziel
|
||||
|
||||
Interne Nutzer legen fest, was nach dem Absenden eines Public Forms passieren soll, ohne einen kompletten Automation-Editor zu oeffnen.
|
||||
|
||||
## Pattern / Archetyp
|
||||
|
||||
Action-Liste plus Detailpanel innerhalb von S01.
|
||||
|
||||
## Daten
|
||||
|
||||
- Action-Typ
|
||||
- Action-Name
|
||||
- Status aktiv/inaktiv
|
||||
- Reihenfolge
|
||||
- Pflichtmapping
|
||||
- Warnungen und Blocker
|
||||
- letzter Teststatus
|
||||
|
||||
## Aktionen
|
||||
|
||||
- Action hinzufuegen
|
||||
- Action-Typ waehlen
|
||||
- Action bearbeiten
|
||||
- Action aktiv/inaktiv setzen
|
||||
- Action duplizieren
|
||||
- Action loeschen
|
||||
- Reihenfolge aendern
|
||||
- Mapping pruefen
|
||||
- Test ausfuehren
|
||||
|
||||
## Verhalten
|
||||
|
||||
- Klick auf `Actions` wechselt in den Actions-Modus im selben S01-Screen.
|
||||
- `Add Action` oeffnet eine kleine Typ-Auswahl als Popover oder Auswahlpanel.
|
||||
- Nach Auswahl eines Action-Typs oeffnet sich das Action-Detail, siehe [[92 D08 Action Detail mit Mapping|D08 Action Detail mit Mapping]].
|
||||
- Die Liste zeigt Warnungen direkt an der betroffenen Action.
|
||||
- ActionLog, Re-Run und Submission-Historie gehoeren nicht hierher, sondern zu Submissions.
|
||||
- Auswahl- und Mapping-Folgefaelle stehen in [[D10 Builder Interaktionsfaelle]].
|
||||
|
||||
## Add-Action-Popover
|
||||
|
||||
| Inhalt | Beschreibung |
|
||||
|---|---|
|
||||
| Typ-Liste | Email Submitter, Email Team, Lead, Kontakt, Projekt, Task, Auto-Match, Webhook, Automation-Trigger. |
|
||||
| Kurzbeschreibung | Pro Typ ein Satz, was nach Submit passiert. |
|
||||
| Disabled-Zustaende | Typ disabled, wenn Rechte, Integration oder Voraussetzung fehlen. |
|
||||
| Suche optional | Nur wenn Liste zu lang wirkt. |
|
||||
| Kein Modal | Das Popover waehlt nur den Typ; Detailarbeit passiert in [[92 D08 Action Detail mit Mapping|D08 Action Detail mit Mapping]]. |
|
||||
|
||||
## Zustaende
|
||||
|
||||
| Zustand | Beschreibung | Umsetzung |
|
||||
|---|---|---|
|
||||
| Keine Actions | Empty State mit `Action hinzufuegen`. | Nur dokumentieren |
|
||||
| Action valid | Action ist aktiv und vollstaendig konfiguriert. | Nur dokumentieren |
|
||||
| Action incomplete | Pflichtmapping oder Ziel fehlt. | Nur dokumentieren |
|
||||
| Test erfolgreich | Inline-Ergebnis plus Toast. | Wiederverwenden |
|
||||
| Test fehlgeschlagen | Inline-Hinweis im Action-Detail. | Nur dokumentieren |
|
||||
|
||||
## Was-passiert-wenn-Faelle
|
||||
|
||||
| Fall | UI-Reaktion |
|
||||
|---|---|
|
||||
| Nutzer waehlt Typ, bricht Detail ab | Action wird nicht angelegt oder bleibt als unvollstaendiger Draft, je nach Save-Logik. |
|
||||
| Nutzer erstellt Action, laesst sie inaktiv | Keine Publish-Blockade, aber Warnung in Action-Liste. |
|
||||
| Nutzer erstellt aktive Action ohne Pflichtmapping | Publish blockiert und springt zu [[92 D08 Action Detail mit Mapping|D08 Action Detail mit Mapping]]. |
|
||||
| Nutzer loescht Action | Confirm nur bei aktiver/published-relevanter Action. |
|
||||
|
||||
## Subframe
|
||||
|
||||
Kein eigener Hauptscreen. Actions bleiben Arbeitsbereich in S01. Ein extra Frame ist nur noetig, wenn David die geoeffnete Action-Liste separat sehen will.
|
||||
|
||||
## Notizen
|
||||
|
||||
Der Bereich darf nicht wie M17 Automation wirken. D-FORM braucht nur Action-Typ, Ziel, Mapping, Status und Test.
|
||||
+81
@@ -0,0 +1,81 @@
|
||||
---
|
||||
kind: screen
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
package: WF-D-FORM Form Builder
|
||||
id: D03
|
||||
screen: Conditional Logic Editor
|
||||
typ: Panel-Zustand in S01
|
||||
umsetzung: Nur dokumentieren
|
||||
status: Vor Subframe / dokumentiert
|
||||
route: in ADV-S01 Form-Builder Canvas, kein eigener Screen
|
||||
subframe: "-"
|
||||
---
|
||||
|
||||
# D03 - Conditional Logic Editor
|
||||
|
||||
## Ziel
|
||||
|
||||
Interne Nutzer koennen einfache Anzeige-/Ausblende-Regeln fuer Formularfelder erstellen und pruefen.
|
||||
|
||||
## Pattern / Archetyp
|
||||
|
||||
Regel-Liste plus Detailpanel innerhalb von S01.
|
||||
|
||||
## Daten
|
||||
|
||||
- Regelname optional
|
||||
- Bedingungsfeld
|
||||
- Operator
|
||||
- Wert
|
||||
- Aktion: anzeigen oder verstecken
|
||||
- Zielfeld
|
||||
- Status aktiv/inaktiv
|
||||
- Referenzstatus: gueltig oder kaputt
|
||||
|
||||
## Aktionen
|
||||
|
||||
- Regel hinzufuegen
|
||||
- Regel bearbeiten
|
||||
- Regel aktiv/inaktiv setzen
|
||||
- Regel loeschen
|
||||
- kaputte Referenz reparieren
|
||||
- Regel in Preview testen
|
||||
|
||||
## Verhalten
|
||||
|
||||
- Klick auf `Logic` wechselt in den Logic-Modus im selben S01-Screen.
|
||||
- `Neue Regel` oeffnet kein Modal, sondern ein Detailpanel, siehe [[91 D07 Logic Regel Detail|D07 Logic Regel Detail]].
|
||||
- Kaputte Referenzen werden in der Regel-Liste sichtbar markiert.
|
||||
- Kaputte aktive Regeln blockieren Publish.
|
||||
- Required-Felder, die durch Logic versteckt werden, sind im Public Form nur required, wenn sie sichtbar sind.
|
||||
- Auswahl- und Vergessensfaelle fuer Logic sind in [[D10 Builder Interaktionsfaelle]] dokumentiert.
|
||||
|
||||
## Zustaende
|
||||
|
||||
| Zustand | Beschreibung | Umsetzung |
|
||||
|---|---|---|
|
||||
| Keine Regeln | Empty State mit `Regel hinzufuegen`. | Nur dokumentieren |
|
||||
| Regel aktiv | Regel wirkt im Public Renderer. | Nur dokumentieren |
|
||||
| Regel inaktiv | Regel bleibt gespeichert, wirkt aber nicht. | Nur dokumentieren |
|
||||
| Referenz kaputt | Feld fehlt oder wurde geaendert; Publish blockiert. | Nur dokumentieren |
|
||||
| Preview-Test | Public-nahe Vorschau zeigt Feld sichtbar/versteckt. | In S01 dokumentieren |
|
||||
|
||||
## Was-passiert-wenn-Faelle
|
||||
|
||||
| Fall | UI-Reaktion |
|
||||
|---|---|
|
||||
| Wenn-Feld gewaehlt, Operator vergessen | Regel bleibt unvollstaendig; Aktivieren/Test disabled. |
|
||||
| Operator gewaehlt, Wert vergessen | Wertfeld zeigt Inline-Fehler; aktive Regel blockiert Publish. |
|
||||
| Operator `ist leer` gewaehlt | Wertfeld verschwindet, weil kein Wert gebraucht wird. |
|
||||
| Ziel-Feld vergessen | Regel bleibt unvollstaendig; Publish blockiert nur, wenn Regel aktiv sein soll. |
|
||||
| Select-Option wird geloescht | Betroffene Regel wird kaputt markiert und in Publish Summary verlinkt. |
|
||||
| Bedingungsfeld und Ziel-Feld gleich | Regel kann nicht aktiv werden; Inline-Hinweis auf Selbstreferenz. |
|
||||
|
||||
## Subframe
|
||||
|
||||
Kein eigener Hauptscreen. Logic bleibt Arbeitsbereich in S01. Ein extra Frame ist nur noetig, wenn David den geoeffneten Logic-Modus separat sehen will.
|
||||
|
||||
## Notizen
|
||||
|
||||
Nicht v1: Multi-Step, If/Else-Baeume, Repeater, Scoring oder Cross-Field-Rechnung.
|
||||
@@ -0,0 +1,89 @@
|
||||
---
|
||||
kind: screen
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
package: WF-D-FORM Form Builder
|
||||
id: D06
|
||||
screen: Feldkarten Menue
|
||||
typ: Inline-Zustand in S01
|
||||
umsetzung: Nur dokumentieren
|
||||
status: Vor Subframe / dokumentiert
|
||||
route: in ADV-S01 Form-Builder Canvas, kein eigener Screen
|
||||
subframe: "-"
|
||||
---
|
||||
|
||||
# D06 - Feldkarten Menue
|
||||
|
||||
## Ziel
|
||||
|
||||
Interne Nutzer erreichen sekundaere Feldaktionen direkt an der Feldkarte, ohne den Inspector mit seltenen Aktionen zu ueberladen.
|
||||
|
||||
## Pattern / Archetyp
|
||||
|
||||
3-Punkte-Menue / Kontextmenue auf einer Feldkarte.
|
||||
|
||||
## Daten
|
||||
|
||||
- Feldname
|
||||
- Feldtyp
|
||||
- Field Key
|
||||
- ob das Feld in Logic verwendet wird
|
||||
- ob das Feld in Actions/Mapping verwendet wird
|
||||
- ob das Formular published ist
|
||||
|
||||
## Aktionen
|
||||
|
||||
- Feld bearbeiten
|
||||
- Feld duplizieren
|
||||
- nach oben/unten verschieben, falls Drag nicht genutzt wird
|
||||
- Feld einklappen/ausklappen
|
||||
- Field Key kopieren
|
||||
- Feld loeschen
|
||||
|
||||
## Verhalten
|
||||
|
||||
- Klick auf das 3-Punkte-Menue oeffnet ein kleines Menue an der Feldkarte.
|
||||
- `Bearbeiten` setzt den Fokus auf den rechten Inspector.
|
||||
- `Duplizieren` erstellt direkt eine Kopie unter dem Feld, schlaegt einen neuen `field_key` vor und selektiert die Kopie.
|
||||
- `Loeschen` fuehrt bei Abhaengigkeiten zu [[M01 Feld loeschen Confirm]].
|
||||
- Destruktive Aktionen stehen getrennt unten im Menue.
|
||||
- Weitere Folgefaelle stehen in [[D10 Builder Interaktionsfaelle]].
|
||||
|
||||
## Menue-Inhalt
|
||||
|
||||
| Eintrag | Verhalten | Sichtbarkeit |
|
||||
|---|---|---|
|
||||
| `Bearbeiten` | selektiert Feld und fokussiert Inspector. | immer, wenn editierbar |
|
||||
| `Duplizieren` | erstellt Kopie unter dem Feld, neuer `field_key`, Kopie selected. | wenn editierbar |
|
||||
| `Field Key kopieren` | kopiert technischen Key, Toast. | wenn Key vorhanden |
|
||||
| `Nach oben/unten` | Alternative zu Drag, falls noetig. | optional |
|
||||
| `Einklappen/Ausklappen` | veraendert nur Canvas-Darstellung. | bei langen Feldern |
|
||||
| `Loeschen` | fuehrt zu Confirm bei Abhaengigkeiten. | getrennt unten, Danger |
|
||||
|
||||
## Was-passiert-wenn-Faelle
|
||||
|
||||
| Fall | UI-Reaktion |
|
||||
|---|---|
|
||||
| Feld wird in Logic genutzt | Menue kann kleinen Hinweis am Loeschen-Eintrag zeigen; Klick oeffnet [[M01 Feld loeschen Confirm]]. |
|
||||
| Feld wird in Action-Mapping genutzt | Confirm nennt betroffene Action(s). |
|
||||
| Formular ist archived | Bearbeiten/Loeschen disabled, Duplizieren kann als Ausweg aktiv bleiben. |
|
||||
| Nutzer dupliziert Feld mit Select-Optionen | Optionen werden kopiert, aber Logic/Mapping nicht automatisch. |
|
||||
| Nutzer dupliziert Datei/Fotofeld | Upload-Regeln werden kopiert, neuer `field_key`; keine hochgeladenen Dateien. |
|
||||
| Nutzer loescht Feld ohne Abhaengigkeit | Kurze Rueckfrage oder Undo-Toast reicht; kein grosses Modal noetig. |
|
||||
|
||||
## Zustaende
|
||||
|
||||
| Zustand | Beschreibung | Umsetzung |
|
||||
|---|---|---|
|
||||
| Standard | normale Feldaktionen sichtbar. | Nur dokumentieren |
|
||||
| Feld wird referenziert | Menue zeigt Hinweis vor Loeschen. | Nur dokumentieren |
|
||||
| Keine Berechtigung | einzelne Aktionen disabled oder Menue fehlt. | Nur dokumentieren |
|
||||
| Archived | Bearbeiten/Loeschen disabled, Duplizieren moeglich. | Nur dokumentieren |
|
||||
|
||||
## Subframe
|
||||
|
||||
Kein eigener Subframe-Screen. Das Menue wird in S01 dokumentiert. Ein eigener Frame ist nur noetig, wenn David den geoeffneten Feldkarten-Zustand sehen will.
|
||||
|
||||
## Notizen
|
||||
|
||||
Das Menue ist fuer sekundaere Aktionen. Primaere Feldbearbeitung bleibt im Inspector.
|
||||
+137
@@ -0,0 +1,137 @@
|
||||
---
|
||||
kind: screen
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
package: WF-D-FORM Form Builder
|
||||
id: D10
|
||||
screen: Builder Interaktionsfaelle
|
||||
typ: Case-Matrix in S01
|
||||
umsetzung: Nur dokumentieren
|
||||
status: Vor Subframe / dokumentiert
|
||||
route: in ADV-S01 Form-Builder Canvas, kein eigener Screen
|
||||
subframe: "-"
|
||||
---
|
||||
|
||||
# D10 - Builder Interaktionsfaelle
|
||||
|
||||
## Ziel
|
||||
|
||||
Diese Datei beantwortet die naechste Review-Ebene: Was passiert, wenn Nutzer im Builder etwas auswaehlen, ankreuzen, vergessen, wechseln oder eine Folgeaktion ausloesen?
|
||||
|
||||
Nicht jedes Detail muss ein eigener Frame werden. Dber vor Subframe muss klar sein, ob daraus Inline-Feedback, Dropdown, Popover, Panel, Modal, Toast oder Publish-Blocker entsteht.
|
||||
|
||||
## Grundregel
|
||||
|
||||
| Fall | UI-Reaktion |
|
||||
|---|---|
|
||||
| Nutzer waehlt etwas aus und der naechste Schritt haengt davon ab | Nachfolgende Felder im selben Panel werden sichtbar oder aktiv. |
|
||||
| Nutzer vergisst einen Pflichtteil in der Mitte | Der Block bleibt unvollstaendig, zeigt Inline-Warnung und blockiert Publish/Test nur dort, wo es fachlich noetig ist. |
|
||||
| Nutzer waehlt etwas, das alte Eingaben ungueltig macht | Dlte Eingaben werden nicht still geloescht; System zeigt Hinweis und laesst bestaetigen oder markiert ungueltig. |
|
||||
| Nutzer loescht etwas, das anderswo verwendet wird | Confirm oder Inline-Blocker mit konkreter Referenzliste. |
|
||||
| Nutzer fuegt etwas Medien-/Dateibezogenes hinzu | Kein globales Modal; normales Datei-Feld oeffnet Inspector. Nur Datei-Auswahl selbst ist System-/Upload-Dialog. |
|
||||
| Nutzer bestaetigt eine public-wirksame Aktion | Confirm-Dialog. |
|
||||
|
||||
## Feld hinzufuegen / Feldtyp auswaehlen
|
||||
|
||||
| Nutzeraktion | Was passiert? | UI-Ebene | Blockiert? | Notiz fuer Subframe |
|
||||
|---|---|---|---|---|
|
||||
| Klick auf Feldtyp `Text` | Feld wird am Ende eingefuegt, Karte selected, Inspector oeffnet Basis-Sektion. | Canvas + Inspector | nein | Happy Path zeigen. |
|
||||
| Drag eines Feldtyps | Dropzonen erscheinen, nach Drop ist Feld selected. | Canvas-Zustand | nein | Dropziel sichtbar machen. |
|
||||
| Nutzer fuegt `Select` hinzu und vergisst Optionen | Feldkarte zeigt Warnung, Inspector `Optionen` zeigt Pflicht-Hinweis, Publish blockiert. | Inline + Inspector + Publish Summary | ja fuer Publish | Wichtig, weil Public Form sonst nicht beantwortbar ist. |
|
||||
| Nutzer fuegt `Datei` hinzu | Feldkarte erscheint als Upload-Feld, Inspector zeigt Dateitypen, Groesse, Mehrfachupload, Foto-Hinweis. | Inspector | nein | Kein eigenes Modal fuer Feld-Konfiguration. |
|
||||
| Nutzer aktiviert `Foto erlaubt` beim Datei-Feld | Mobile-Kamera-Hinweis wird im Inspector sichtbar; Public Renderer darf Kamera/Upload anbieten. | Inline im Inspector | nein | Foto bleibt Variante von Datei, kein eigener Feldtyp. |
|
||||
| Nutzer setzt `Mehrere Dateien` und vergisst max. Groesse | Warnung, aber Publish blockiert nicht zwingend; Security/Dev kann Default setzen. | Inline-Warnung | nein/Warning | Empfehlung: warnen, nicht blockieren. |
|
||||
| Nutzer aendert Feldtyp nach Konfiguration | System zeigt Warnung, wenn Optionen/Validation verloren gehen koennen. | Popover/Confirm klein | ja bis Bestaetigung | Nur relevant, falls Feldtypwechsel erlaubt ist. |
|
||||
| Nutzer dupliziert Feld mit Logic/Mapping | Kopie bekommt neuen `field_key`; Logic/Mapping wird nicht automatisch kopiert. | Toast + Inspector | nein | Sonst entstehen unsichtbare Doppelreferenzen. |
|
||||
|
||||
## Feld-Inspector / Checkboxen / Optionen
|
||||
|
||||
| Nutzeraktion | Was passiert? | UI-Ebene | Blockiert? | Notiz |
|
||||
|---|---|---|---|---|
|
||||
| Label leer lassen | Feldkarte und Inspector zeigen Inline-Fehler. | Inline | ja fuer Publish | Feld darf als Draft gespeichert werden. |
|
||||
| `Pflichtfeld` ankreuzen, aber Feld ist durch Logic versteckt | Hinweis: Pflicht gilt nur, wenn Feld sichtbar ist. | Inline-Hinweis im Inspector | nein | Public Submit darf nicht blockieren, wenn Feld versteckt ist. |
|
||||
| `Pflichtfeld` ankreuzen bei Datei | Inspector empfiehlt Dateitypen/Groesse; ohne Beschraenkung nur Warnung. | Inline-Warnung | nein/Warning | Public Risiko, aber v1 nicht hart blockieren. |
|
||||
| Select-Option leer lassen | Option-Zeile zeigt Fehler; Publish blockiert. | Inline | ja fuer Publish | Fehler nahe Option, nicht nur global. |
|
||||
| Select-Option loeschen, die in Logic genutzt wird | Confirm/Inline-Hinweis zeigt betroffene Regeln; nach Loeschen werden Regeln kaputt markiert. | Confirm oder Inline-Blocker | ja fuer Publish | Sehr wichtiger Folgefall. |
|
||||
| Field Key manuell aendern | System prueft Duplikat/ungueltig; zeigt Mapping/Logic-Hinweis. | Inline im Inspector | ja bei ungueltig | Nicht still aendern, wenn Referenzen betroffen sind. |
|
||||
| User vergisst den mittleren Schritt `Optionen` und geht zu Publish | Publish Summary springt direkt zur Optionen-Sektion. | Publish Summary | ja | Genau der "Mitte vergessen"-Fall. |
|
||||
|
||||
## Logic-Regel: Auswahlfolge und vergessene Mitte
|
||||
|
||||
| Nutzeraktion | Was passiert? | UI-Ebene | Blockiert? | Notiz |
|
||||
|---|---|---|---|---|
|
||||
| Neue Regel klicken | Leeres Detailpanel oeffnet mit Reihenfolge: Wenn-Feld -> Operator -> Wert -> Dann-Aktion -> Zielfeld. | Panel | nein | Kein Modal. |
|
||||
| Wenn-Feld auswaehlen | Operator-Dropdown wird passend zum Feldtyp gefiltert. | Dropdown im Panel | nein | Text hat andere Operatoren als Boolean/Select. |
|
||||
| Wenn-Feld waehlen, Operator vergessen | Regel bleibt `Unvollstaendig`; Aktivieren/Test disabled. | Inline im Panel | ja fuer aktive Regel | Speichern als inaktiver Draft moeglich. |
|
||||
| Operator waehlen, Wert vergessen | Wertfeld wird markiert; Test disabled; Publish blockiert nur, wenn Regel aktiv ist. | Inline im Panel | ja fuer aktive Regel | "Mitte vergessen" wird lokal sichtbar. |
|
||||
| Ziel-Feld vergessen | Regel bleibt unvollstaendig; Summary zeigt fehlendes Zielfeld. | Inline | ja fuer aktive Regel | Sprungziel auf Zielfeld-Auswahl. |
|
||||
| Bedingungsfeld und Zielfeld sind identisch | Inline-Warnung; Regel kann nicht aktiv werden. | Inline | ja fuer aktive Regel | Verhindert Selbstreferenz. |
|
||||
| Nutzer waehlt `ist leer` | Wertfeld verschwindet, weil kein Wert noetig ist. | Dynamisches Panel | nein | Wichtig: Feld nicht disabled ohne Erklaerung. |
|
||||
| Nutzer wechselt Wenn-Feld nach gesetztem Wert | Dlter Wert wird markiert als ungueltig oder geloescht nach Hinweis. | Inline-Hinweis / kleines Confirm | ja bis korrigiert | Keine stille Datenvernichtung. |
|
||||
| Nutzer loescht Feld, das in Regel steckt | Regel bleibt sichtbar, rot markiert, Publish blockiert. | Logic-Liste + Publish Summary | ja | Referenzbruch nicht verstecken. |
|
||||
|
||||
## Action-Detail / Mapping
|
||||
|
||||
| Nutzeraktion | Was passiert? | UI-Ebene | Blockiert? | Notiz |
|
||||
|---|---|---|---|---|
|
||||
| `Add Action` klicken | Typ-Auswahl oeffnet als Popover/Auswahlpanel mit kurzen Beschreibungen. | Popover | nein | Kein Modal. |
|
||||
| Action-Typ waehlen | Detailpanel oeffnet mit typ-spezifischen Pflichtfeldern. | Panel/Drawer | nein | Action ist erstmal unvollstaendig. |
|
||||
| Typ `Email Submitter` waehlen, aber kein Email-Feld vorhanden | Panel zeigt Hinweis und bietet `Email-Feld hinzufuegen` oder anderes Feld waehlen. | Inline-Hinweis + CTD | ja fuer aktive Action | Kein stilles Mapping. |
|
||||
| Typ `Projekt erstellen` waehlen, aber Pipeline fehlt | Pipeline-Feld markiert; Test/Publish blockiert fuer aktive Action. | Inline | ja | Action darf als inaktiv geparkt werden. |
|
||||
| Mapping-Zeile Ziel gesetzt, Quelle vergessen | Zeile bleibt unvollstaendig; Test disabled; Publish blockiert aktive Action. | Inline in Mapping-Zeile | ja fuer aktive Action | "Mitte vergessen" bei Mapping. |
|
||||
| Nutzer aendert Action-Typ nach Mapping | Hinweis: bestehendes Mapping passt evtl. nicht mehr; Nutzer bestaetigt oder bricht ab. | Confirm/Popover | ja bis Bestaetigung | Sonst Datenverlust. |
|
||||
| Nutzer deaktiviert unvollstaendige Action | Warnung verschwindet aus Publish-Blockern, bleibt aber in Action-Liste als inaktiv/unvollstaendig. | Inline | nein | Inaktive Actions duerfen Draft bleiben. |
|
||||
| Webhook URL eingetragen, aber ungueltig | URL-Feld zeigt Fehler, Test disabled. | Inline | ja fuer aktive Action/Test | Copy: `URL muss mit http:// oder https:// beginnen.` |
|
||||
| Test ausfuehren ohne Pflichtmapping | Test startet nicht; Panel markiert fehlende Zeilen. | Inline | ja fuer Test | Kein Toast, weil nichts ausgefuehrt wurde. |
|
||||
|
||||
## Publish / Save / Wechselwirkungen
|
||||
|
||||
| Nutzeraktion | Was passiert? | UI-Ebene | Blockiert? | Notiz |
|
||||
|---|---|---|---|---|
|
||||
| Publish klicken mit fehlendem Feldlabel | Publish Summary zeigt Blocker und springt zur Feldkarte/Inspector. | Inline Summary | ja | Kein Modal. |
|
||||
| Publish klicken mit unvollstaendiger aktiver Logic | Summary zeigt Logic-Blocker, Klick oeffnet Logic-Modus und Detailpanel. | Summary + Panel | ja | Direkt reparierbar. |
|
||||
| Publish klicken mit inaktiver unvollstaendiger Action | Warnung optional, aber kein Blocker. | Warning | nein | Inaktiv wirkt nicht public. |
|
||||
| Publish klicken mit unsaved changes | Erst Save/Validation-Hinweis; danach Publish-Check. | Inline/Popover | ja bis Save | Kein eigener Screen. |
|
||||
| Published Form stark aendern | Hinweis, dass Public-Version betroffen ist; Save/Publish-Update klar trennen. | Banner/Inline | nein/Warning | David/Dev muss final entscheiden, ob Update extra Publish braucht. |
|
||||
| Nutzer verlaesst S01 mit Dirty State | [[M04 Unsaved Changes Confirm]] greift. | Confirm/Browser Guard | ja bis Entscheidung | Standard-Guard. |
|
||||
| Unpublish klicken | [[M02 Unpublish Confirm]] oeffnet. | Confirm Modal | ja bis Bestaetigung | Public-Link betroffen. |
|
||||
|
||||
## Public-Preview / Live-Folgen
|
||||
|
||||
| Nutzeraktion | Was passiert? | UI-Ebene | Blockiert? | Notiz |
|
||||
|---|---|---|---|---|
|
||||
| Preview oeffnen mit unvollstaendigem Feld | Preview zeigt Draft-nahe Darstellung, aber Warnung bleibt im Builder. | Preview + Inline-Warnung | nein | Preview darf beim Bauen helfen. |
|
||||
| Logic in Preview testen | Felder erscheinen/verschwinden live. | Preview-Modus | nein | Nutzer sieht Folge direkt. |
|
||||
| Datei/Fotofeld in Preview | Upload-Bereich zeigt erlaubte Typen, max. Groesse, mobile Foto-Hinweis. | Preview | nein | Kein echter Upload noetig im Builder. |
|
||||
| Captcha/Public Schutz in Preview | Kann als Platzhalter sichtbar sein. | Preview | nein | Kein echtes Captcha im Builder notwendig. |
|
||||
|
||||
## Modal-/Popover-Inhalte
|
||||
|
||||
| UI-Ebene | Wann | Inhalt |
|
||||
|---|---|---|
|
||||
| Action-Typ-Popover | `Add Action` | Liste der Action-Typen, je ein Kurzsatz, disabled Hinweis fuer nicht verfuegbare Typen. |
|
||||
| Feldtyp-Wechsel-Confirm | Feldtyp nach Konfiguration aendern | Was verloren geht: Optionen, Validation, Default, Mapping-Hinweis; Buttons `Typ aendern` / `Abbrechen`. |
|
||||
| Option-loeschen-Confirm | Option wird in Logic genutzt | betroffene Regel(n), Hinweis auf Publish-Blocker, Buttons `Option loeschen` / `Abbrechen`. |
|
||||
| Feld-loeschen-Confirm | Feld wird in Logic/Actions genutzt | Feldname, Field Key, betroffene Regeln/Actions, Buttons `Feld loeschen` / `Abbrechen`. |
|
||||
| Publish-Warnpopover | nur Warnungen, keine Blocker | Warnliste und Button `Trotzdem veroeffentlichen` falls Produkt das erlaubt. |
|
||||
| Unpublish-Confirm | Public-Link offline nehmen | Public URL, Folge fuer QR/iFrame, Buttons `Unpublish` / `Abbrechen`. |
|
||||
|
||||
## Offene Produktentscheidungen
|
||||
|
||||
| Frage | Empfehlung |
|
||||
|---|---|
|
||||
| Darf der Feldtyp nachtraeglich gewechselt werden? | Ja, aber mit Confirm, wenn dadurch Optionen/Validation/Mapping betroffen sind. |
|
||||
| Werden unvollstaendige inaktive Logic/Actions gespeichert? | Ja, als Draft/inaktiv, aber klar markiert. |
|
||||
| Blockiert fehlende Datei-Typbeschraenkung Publish? | Empfehlung: Warnung, kein harter Blocker. |
|
||||
| Braucht `Bild hinzufuegen` einen eigenen Content Block? | Nicht in D-FORM v1. Bilder/Fotos laufen als Datei-Feld-Variante; Branding-Logo gehoert in Settings/Public Form. |
|
||||
| Sollen published Aenderungen direkt live gehen oder Publish-Update brauchen? | Offene Produktentscheidung; S01 muss Zustand `Published mit ungespeicherten/unveroeffentlichten Aenderungen` zeigen koennen. |
|
||||
|
||||
## Subframe
|
||||
|
||||
Kein eigener Subframe-Screen. D10 ist eine Vor-Subframe-Case-Matrix. Wenn David einzelne Faelle visuell sehen will, sollten zuerst diese Kandidaten gebaut werden:
|
||||
|
||||
- [[93 D09 Publish Blocker Summary|D09 Publish Blocker Summary]]
|
||||
- [[92 D08 Action Detail mit Mapping|D08 Action Detail mit Mapping]]
|
||||
- [[91 D07 Logic Regel Detail|D07 Logic Regel Detail]]
|
||||
- [[M01 Feld loeschen Confirm]]
|
||||
- [[M02 Unpublish Confirm]]
|
||||
+92
@@ -0,0 +1,92 @@
|
||||
---
|
||||
kind: screen
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
package: WF-D-FORM Form Builder
|
||||
id: M01
|
||||
screen: Feld loeschen Confirm
|
||||
typ: Confirm Modal
|
||||
umsetzung: Nur dokumentieren
|
||||
status: Vor Subframe / dokumentiert
|
||||
route: von S01 Feldkarte oder Inspector
|
||||
subframe: "-"
|
||||
---
|
||||
|
||||
# M01 - Feld loeschen Confirm
|
||||
|
||||
## Ziel
|
||||
|
||||
Interne Nutzer bestaetigen bewusst, dass ein Feld entfernt wird, besonders wenn es in Logic oder Actions verwendet wird.
|
||||
|
||||
## Pattern / Archetyp
|
||||
|
||||
D5 Confirm-Modal / kleiner Sicherheitsdialog.
|
||||
|
||||
## Daten
|
||||
|
||||
- Feldname
|
||||
- Feldtyp
|
||||
- Field Key
|
||||
- Anzahl betroffener Logic-Regeln
|
||||
- Anzahl betroffener Actions oder Mapping-Zeilen
|
||||
- Publish-Status des Formulars
|
||||
|
||||
## Aktionen
|
||||
|
||||
- `Feld loeschen`
|
||||
- `Abbrechen`
|
||||
- optional `Betroffene Regeln ansehen`
|
||||
- optional `Betroffene Actions ansehen`
|
||||
|
||||
## Verhalten
|
||||
|
||||
- Bei Feldern ohne Abhaengigkeiten kann Loeschen sehr kurz bestaetigt werden oder als Menue-Aktion mit Undo/Toast laufen.
|
||||
- Bei Abhaengigkeiten ist ein Confirm Pflicht.
|
||||
- Der Confirm nennt konkret, welche Regeln oder Actions betroffen sind.
|
||||
- Nach Loeschen wird das Feld entfernt; betroffene Logic/Actions werden markiert oder muessen repariert werden.
|
||||
- Publish bleibt blockiert, solange kaputte Referenzen existieren.
|
||||
- Details zu Folgefaellen stehen in [[D10 Builder Interaktionsfaelle]].
|
||||
|
||||
## Layout / Inhalt
|
||||
|
||||
1. Headline `Feld loeschen?`
|
||||
2. Feldname und Feldtyp.
|
||||
3. Hinweis, dass das Feld aus dem Formular entfernt wird.
|
||||
4. Falls relevant: Liste der betroffenen Logic-Regeln und Actions.
|
||||
5. Aktionen: Danger-Button `Feld loeschen`, sekundar `Abbrechen`.
|
||||
|
||||
## Modal-Inhalt je Fall
|
||||
|
||||
| Fall | Was steht im Modal? |
|
||||
|---|---|
|
||||
| Keine Abhaengigkeit | `Dieses Feld wird aus dem Formular entfernt.` |
|
||||
| Feld in Logic verwendet | `Dieses Feld wird in 2 Logic-Regeln verwendet. Diese Regeln muessen danach repariert oder deaktiviert werden.` |
|
||||
| Feld in Actions verwendet | `Dieses Feld ist in 1 Action-Mapping hinterlegt. Die Action wird danach unvollstaendig.` |
|
||||
| Published Form | `Das Formular ist veroeffentlicht. Aenderungen koennen die oeffentliche Version betreffen.` |
|
||||
| Datei/Fotofeld | `Das Upload-Feld wird entfernt. Bereits eingereichte Dateien in Submissions sind davon nicht Teil dieses Builders.` |
|
||||
|
||||
## Nach Bestaetigung
|
||||
|
||||
| Folge | Verhalten |
|
||||
|---|---|
|
||||
| Feld geloescht | Feldkarte verschwindet, Canvas selektiert naechstes sinnvolles Feld. |
|
||||
| Logic betroffen | Regel wird rot/kaputt markiert und in Publish Summary gelistet. |
|
||||
| Action betroffen | Mapping-Zeile wird als fehlend markiert; aktive Action blockiert Publish. |
|
||||
| Keine Abhaengigkeit | Toast `Feld geloescht`; Undo optional. |
|
||||
|
||||
## Zustaende
|
||||
|
||||
| Zustand | Beschreibung | Umsetzung |
|
||||
|---|---|---|
|
||||
| Ohne Abhaengigkeit | einfacher Confirm oder kurze Rueckfrage. | Nur dokumentieren |
|
||||
| Mit Logic/Action-Bezug | Confirm mit Referenzliste. | Nur dokumentieren |
|
||||
| Published Form | Hinweis, dass Public-Version betroffen sein kann. | Nur dokumentieren |
|
||||
| Fehler | Loeschen fehlgeschlagen. | Nur dokumentieren |
|
||||
|
||||
## Subframe
|
||||
|
||||
Noch kein eigener Subframe-Frame. Wenn David einen Modal-Frame fuer D-FORM sehen will, ist dieses Confirm der erste Kandidat.
|
||||
|
||||
## Notizen
|
||||
|
||||
Keine normale Feldbearbeitung im Modal. Das Modal ist nur fuer den Risiko-Moment Loeschen.
|
||||
+68
@@ -0,0 +1,68 @@
|
||||
---
|
||||
kind: screen
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
package: WF-D-FORM Form Builder
|
||||
id: M02
|
||||
screen: Unpublish Confirm
|
||||
typ: Confirm Modal
|
||||
umsetzung: Nur dokumentieren
|
||||
status: Vor Subframe / dokumentiert
|
||||
route: von S01 Header oder More-Menue
|
||||
subframe: "-"
|
||||
---
|
||||
|
||||
# M02 - Unpublish Confirm
|
||||
|
||||
## Ziel
|
||||
|
||||
Interne Nutzer bestaetigen bewusst, dass ein Public Form nicht mehr erreichbar ist.
|
||||
|
||||
## Pattern / Archetyp
|
||||
|
||||
D5 Confirm-Modal.
|
||||
|
||||
## Daten
|
||||
|
||||
- Formularname
|
||||
- aktuelle Public URL
|
||||
- Publish-Status
|
||||
- Hinweis, ob iFrame/QR ebenfalls betroffen sind
|
||||
|
||||
## Aktionen
|
||||
|
||||
- `Unpublish`
|
||||
- `Abbrechen`
|
||||
- optional Public URL kopieren, bevor deaktiviert wird
|
||||
|
||||
## Verhalten
|
||||
|
||||
- Klick auf `Unpublish` oeffnet einen Confirm-Dialog.
|
||||
- Der Dialog erklaert, dass Public URL, QR und iFrame danach nicht mehr fuer Submitter nutzbar sind.
|
||||
- Nach Bestaetigung wechselt der Status zu Draft/Unpublished.
|
||||
- Sharing zeigt danach Draft-Hinweis.
|
||||
- Erfolg wird per Toast bestaetigt.
|
||||
|
||||
## Layout / Inhalt
|
||||
|
||||
1. Headline `Formular offline nehmen?`
|
||||
2. Hinweis: Der oeffentliche Link ist danach nicht mehr erreichbar.
|
||||
3. Public URL als Kontext.
|
||||
4. Aktionen: Danger- oder Secondary-Button `Unpublish`, sekundar `Abbrechen`.
|
||||
|
||||
## Zustaende
|
||||
|
||||
| Zustand | Beschreibung | Umsetzung |
|
||||
|---|---|---|
|
||||
| Confirm | Nutzer bestaetigt Public-Auswirkung. | Nur dokumentieren |
|
||||
| Laden | Statuswechsel wird gespeichert. | Wiederverwenden |
|
||||
| Erfolg | Builder zeigt Draft/Unpublished. | Toast/Statuswechsel |
|
||||
| Fehler | Unpublish fehlgeschlagen. | Nur dokumentieren |
|
||||
|
||||
## Subframe
|
||||
|
||||
Noch kein eigener Subframe-Frame. Falls David einen public-wirksamen Confirm sehen will, ist M02 ein sinnvoller Kandidat.
|
||||
|
||||
## Notizen
|
||||
|
||||
Publish selbst bleibt Inline-Check. Unpublish braucht Confirm, weil externe Nutzer betroffen sind.
|
||||
@@ -0,0 +1,67 @@
|
||||
---
|
||||
kind: screen
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
package: WF-D-FORM Form Builder
|
||||
id: M03
|
||||
screen: Archive Confirm
|
||||
typ: Confirm Modal
|
||||
umsetzung: Nur dokumentieren
|
||||
status: Vor Subframe / dokumentiert
|
||||
route: von S01 More-Menue
|
||||
subframe: "-"
|
||||
---
|
||||
|
||||
# M03 - Archive Confirm
|
||||
|
||||
## Ziel
|
||||
|
||||
Interne Nutzer bestaetigen bewusst, dass ein Formular archiviert und nicht mehr normal bearbeitet wird.
|
||||
|
||||
## Pattern / Archetyp
|
||||
|
||||
D5 Confirm-Modal.
|
||||
|
||||
## Daten
|
||||
|
||||
- Formularname
|
||||
- Publish-Status
|
||||
- Anzahl Felder
|
||||
- Hinweis auf Public-Verfuegbarkeit
|
||||
- Hinweis auf spaetere Duplikat-Option
|
||||
|
||||
## Aktionen
|
||||
|
||||
- `Drchivieren`
|
||||
- `Abbrechen`
|
||||
|
||||
## Verhalten
|
||||
|
||||
- Drchivieren liegt im More-Menue, nicht als Hauptaktion.
|
||||
- Der Confirm erklaert, ob die Public-Version deaktiviert wird oder ob vorher Unpublish noetig ist.
|
||||
- Nach Drchivierung wird S01 read-only oder verlaesst den Bearbeitungsmodus.
|
||||
- Primaere naechste Aktion ist meist `Duplizieren` oder zur Forms-Liste zurueck, aber Forms-Liste ist nicht Teil von D-FORM.
|
||||
|
||||
## Layout / Inhalt
|
||||
|
||||
1. Headline `Formular archivieren?`
|
||||
2. Kurztext, dass das Formular nicht mehr aktiv bearbeitet werden soll.
|
||||
3. Hinweis auf Public-Link-Folge.
|
||||
4. Aktionen: Danger-Button `Drchivieren`, sekundar `Abbrechen`.
|
||||
|
||||
## Zustaende
|
||||
|
||||
| Zustand | Beschreibung | Umsetzung |
|
||||
|---|---|---|
|
||||
| Confirm | Sicherheitsfrage vor Drchivierung. | Nur dokumentieren |
|
||||
| Published | Hinweis auf Public-Folge. | Nur dokumentieren |
|
||||
| Laden | Drchivierung wird gespeichert. | Wiederverwenden |
|
||||
| Fehler | Drchivieren fehlgeschlagen. | Nur dokumentieren |
|
||||
|
||||
## Subframe
|
||||
|
||||
Kein eigener Hauptscreen. Nur als Confirm-Zustand dokumentieren, ausser David will Risiko-Modals gesammelt bauen.
|
||||
|
||||
## Notizen
|
||||
|
||||
Archive ist nicht dasselbe wie Unpublish. Falls das Produkt beides koppelt, muss Development/Produkt das final festlegen.
|
||||
+60
@@ -0,0 +1,60 @@
|
||||
---
|
||||
kind: screen
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
package: WF-D-FORM Form Builder
|
||||
id: M04
|
||||
screen: Unsaved Changes Confirm
|
||||
typ: Confirm Modal / Browser Guard
|
||||
umsetzung: Nur dokumentieren
|
||||
status: Vor Subframe / dokumentiert
|
||||
route: beim Verlassen von S01 mit Dirty State
|
||||
subframe: "-"
|
||||
---
|
||||
|
||||
# M04 - Unsaved Changes Confirm
|
||||
|
||||
## Ziel
|
||||
|
||||
Interne Nutzer verlieren keine ungespeicherten Builder-Aenderungen, wenn sie S01 verlassen.
|
||||
|
||||
## Pattern / Archetyp
|
||||
|
||||
Confirm-Dialog oder Browser Navigation Guard.
|
||||
|
||||
## Daten
|
||||
|
||||
- Dirty State
|
||||
- letzter Speicherzeitpunkt
|
||||
- ob Save aktuell moeglich ist
|
||||
- ob Publish-Check noch Blocker hat
|
||||
|
||||
## Aktionen
|
||||
|
||||
- `Speichern und verlassen`
|
||||
- `Ohne Speichern verlassen`
|
||||
- `Abbrechen`
|
||||
|
||||
## Verhalten
|
||||
|
||||
- Der Zustand tritt nur auf, wenn ungespeicherte Aenderungen existieren.
|
||||
- Bei normalem Wechsel zwischen S01-Modi erscheint kein Dialog.
|
||||
- Beim Wegnavigieren ueber Breadcrumb, Routewechsel oder Browser-Zurueck wird gewarnt.
|
||||
- Wenn Autosave voll zuverlaessig ist, kann der Zustand zu einem kurzen Save-Hinweis reduziert werden.
|
||||
|
||||
## Zustaende
|
||||
|
||||
| Zustand | Beschreibung | Umsetzung |
|
||||
|---|---|---|
|
||||
| Dirty | Aenderungen noch nicht gespeichert. | Nur dokumentieren |
|
||||
| Save moeglich | Nutzer kann speichern und verlassen. | Nur dokumentieren |
|
||||
| Save fehlgeschlagen | Nutzer soll im Builder bleiben koennen. | Nur dokumentieren |
|
||||
| Keine Aenderungen | kein Confirm noetig. | Wiederverwenden |
|
||||
|
||||
## Subframe
|
||||
|
||||
Kein eigener Subframe-Screen. Standard-Guard, nur dokumentieren.
|
||||
|
||||
## Notizen
|
||||
|
||||
Dieser Zustand ist wichtig fuer Builder-Vertrauen, aber kein D-FORM-Hauptframe.
|
||||
+156
@@ -0,0 +1,156 @@
|
||||
---
|
||||
kind: design-direction
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
package: WF-D-FORM Form Builder
|
||||
status: Review-ready / Subframe Draft gebaut
|
||||
stand: 2026-07-09
|
||||
---
|
||||
|
||||
# Simple Builder Neuausrichtung
|
||||
|
||||
## Warum
|
||||
|
||||
Der bisherige S01 ist fachlich vollstaendig, wirkt fuer normale Handwerksbetriebe aber zu schwer. Nutzer sollen nicht das Gefuehl haben, einen Automations- oder CRM-Editor bedienen zu muessen, wenn sie nur ein Anfrageformular erstellen wollen.
|
||||
|
||||
Neue Richtung: einfacher Formular-Editor nach Google-Forms-Gefuehl, aber mit HiveGrid-Logik im Hintergrund.
|
||||
|
||||
## Grundsatz
|
||||
|
||||
| Alt | Neu |
|
||||
|---|---|
|
||||
| Palette + Canvas + Inspector dauerhaft sichtbar | Ein ruhiger Fragen-Editor mit einzelnen Fragekarten |
|
||||
| Viele Arbeitsmodi gleichzeitig | Nur das zeigen, was fuer den naechsten Schritt gebraucht wird |
|
||||
| Logic, Actions, Mapping sichtbar als Profi-Module | Logic/Lead-Verknuepfung als einfache Zusatzoptionen |
|
||||
| 12 technische Feldtypen | Verstaendliche Fragetypen |
|
||||
| Nutzer baut Verknuepfungen selbst | Lead-Formular ist automatisch aktiv, zeigt aber `Felder zuweisen` verstaendlich im Editor |
|
||||
|
||||
## Neue Screen-Idee
|
||||
|
||||
| ID | Screen | Ziel |
|
||||
|---|---|---|
|
||||
| S00 | [[Screens/01 S00 Formulare verwalten|S00 Formulare verwalten]] | Formular-Zentrale als erste Seite: finden, mehrfach filtern, bearbeiten, neu erstellen. |
|
||||
| E01 | [[Screens/02 E01 S00 Keine Formulare|E01 S00 Keine Formulare]] | Empty State, wenn noch kein Formular existiert. |
|
||||
| E02 | [[Screens/03 E02 S00 Keine Treffer|E02 S00 Keine Treffer]] | Empty State, wenn Suche/Filter nichts finden. |
|
||||
| S01 | [[Screens/04 S01 Formularart auswaehlen|S01 Formularart auswaehlen]] | Nutzer waehlt zuerst, welche Art Formular er bauen will. |
|
||||
| S02 | [[Screens/05 S02 Einfacher Fragen Editor|S02 Einfacher Fragen Editor]] | Haupt-Editor fuer alle Formulararten, jeweils mit Vorlage/Startfragen. |
|
||||
| S02L | [[Screens/05b S02L Lead Felder zuweisen|S02L Lead Felder zuweisen]] | Lead-spezifischer Zustand im S02-Look: Formularfragen Lead-Feldern zuweisen. |
|
||||
| E05 | [[Screens/05c E05 S02 Lead Zuweisung pruefen|E05 S02 Lead Zuweisung pruefen]] | Fehlerzustand, wenn eine Lead-Zuweisung fehlt oder nicht moeglich ist. |
|
||||
| S03 | [[Screens/06 S03 Formular Design|S03 Formular Design]] | Design-Tab mit Logo, Farben und Live-Vorschau. |
|
||||
| S04 | [[Screens/07 S04 Oeffentliches Formular|S04 Oeffentliches Formular]] | Public Zielbild fuer Kunden. |
|
||||
| V01 | [[Screens/08 V01 Public Erfolg oder Redirect|V01 Public Erfolg oder Redirect]] | Erfolg nach Absenden. |
|
||||
| V02 | [[Screens/09 V02 Public Formular nicht verfuegbar|V02 Public Formular nicht verfuegbar]] | Public-Blocker, wenn Formular nicht erreichbar ist. |
|
||||
| V03 | [[Screens/10 V03 Public Captcha oder Submit Fehler|V03 Public Captcha oder Submit Fehler]] | Public Fehlerzustand mit erhaltenen Werten. |
|
||||
| S05 | [[Screens/11 S05 Antworten Tabelle|S05 Antworten Tabelle]] | Antworten-Tab als Excel-/Tabellenansicht ohne Kennzahl-Kacheln. |
|
||||
| E03 | [[Screens/12 E03 S05 Keine Antworten|E03 S05 Keine Antworten]] | Empty State, wenn ein Formular noch keine Einsendungen hat. |
|
||||
| E04 | [[Screens/13 E04 S05 Export Fehler|E04 S05 Export Fehler]] | Error State, wenn Excel/CSV-Export scheitert. |
|
||||
|
||||
S01B/S01C/S01D/S01E sind gebaut, aber nicht mehr Hauptfluss. Sie liegen als spaetere Varianten bzw. Referenz bei 80-83.
|
||||
|
||||
## Einfacher Ablauf
|
||||
|
||||
```text
|
||||
S00 Formulare verwalten
|
||||
-> Neues Formular
|
||||
-> S01 Formularart auswaehlen
|
||||
-> S02 mit passender Vorlage/Startfragen
|
||||
-> Design: S03
|
||||
-> Public Zielbild: S04 und Public States
|
||||
-> Antworten/Export: S05
|
||||
```
|
||||
|
||||
S00 bleibt bewusst knapp: vier Karten, kurze Texte, unten `Weiter`. Keine zweite Vorlagen-Auswahl im selben Screen.
|
||||
|
||||
## Formulararten
|
||||
|
||||
| Art | Fuer wen | Was passiert automatisch? |
|
||||
|---|---|---|
|
||||
| Website-/Externes Formular | Kunden oder Interessenten fuellen es per Link/Website aus. | Public Link, mCaptcha, Datenschutz-Hinweis. |
|
||||
| Lead-Formular | Neue Kundenanfragen sollen direkt im Vertrieb landen. | Kontakt-/Anfragefelder werden vorgeschlagen, Lead-Erstellung ist aktiv, `Felder zuweisen` ist sichtbar. |
|
||||
| Fragebogen / Umfrage | Feedback, Zufriedenheit, kurze Abfragen. | Antworten werden gesammelt und als Auswertung vorbereitet, keine Lead-Pipeline. |
|
||||
| Internes Formular | Mitarbeiter melden etwas intern, z. B. Material, Rueckruf, Schaden. | Kein Public-Marketing-Kontext, interne Sicht und interne Ablage. |
|
||||
|
||||
## Fragetypen statt Feldtypen
|
||||
|
||||
| Fragetyp | UI-Begriff |
|
||||
|---|---|
|
||||
| Einzeiliger Text | Kurzantwort |
|
||||
| Mehrzeiliger Text | Absatz |
|
||||
| Single Select | Multiple Choice |
|
||||
| Multi Select | Mehrfachauswahl |
|
||||
| Select | Drop-down |
|
||||
| Datei / Bild | Datei oder Bild hochladen |
|
||||
| Datum | Datum |
|
||||
| Zeit | Uhrzeit |
|
||||
|
||||
Email, Telefon und Name koennen beim Lead-Formular als vorgeschlagene Startfragen erscheinen, statt als technische Sondertypen laut zu werden.
|
||||
|
||||
Bewusst nicht im aktuellen S02-Hauptdropdown: Lineare Skala, Bewertung, Multiple-Choice-Raster und Kaestchenraster. Diese Typen koennen spaeter wieder diskutiert werden, werden jetzt aber nicht gebaut.
|
||||
|
||||
## Was bleibt aus unserer bisherigen Logik
|
||||
|
||||
- Public Formular S04 bleibt Zielbild fuer Kunden.
|
||||
- mCaptcha bleibt fuer externe Formulare.
|
||||
- Publish-Blocker bleiben, aber einfacher formuliert.
|
||||
- Logic bleibt moeglich, aber als `Bedingung` an einer Frage.
|
||||
- Actions bleiben im Screen. Bei Lead-Formularen wird `Lead anlegen` als einfache Card mit `Felder zuweisen` gezeigt.
|
||||
- Link/QR/Einbetten bleiben moeglich, aber im Veroeffentlichen-/Public-Link-Kontext statt als eigener Reiter.
|
||||
|
||||
## Empfehlung
|
||||
|
||||
S02 wurde in Subframe gebaut, weil es am naechsten an Google Forms liegt und schnell vergleichbar ist.
|
||||
|
||||
S01B wurde als zweite Alternative gebaut, ist aktuell aber nicht Hauptfluss.
|
||||
|
||||
S01C/S01D/S01E wurden als Beispiel-Editoren gebaut, sind aktuell aber nur Referenz. Im Hauptfluss oeffnen alle Formulararten S02 mit anderer Vorlage/Startfragen.
|
||||
|
||||
Der alte ADV-S01 und die Detailseiten D07/D08/D09 bleiben als fachliche Vollstaendigkeits-Referenz erhalten, sollten aber nicht mehr die erste Empfehlung fuer Handwerker sein.
|
||||
|
||||
## Ergaenzung: Lead Felder zuweisen
|
||||
|
||||
Nach David-Feedback reicht der reine Hinweis `Lead-Verknuepfung aktiv` nicht. Nutzer muessen sehen koennen, welche Frage in welches Lead-Feld geschrieben wird.
|
||||
|
||||
Entscheidung:
|
||||
|
||||
- Keine Advanced-Mapping-Tabelle.
|
||||
- Gleicher Look wie S02.
|
||||
- Die blaue Lead-Hinweis-Card nutzt dieselbe Struktur wie die gruene `Lead anlegen`-Card: Icon links, Titel/Badge/Beschreibung in der Mitte, Aktion rechts.
|
||||
- Dropdown-Vorlage fuer jede Zuweisung.
|
||||
- Pflicht: Name, Kontaktweg und Beschreibung.
|
||||
- Optional: Bereich, Datei/Bild, Quelle.
|
||||
- Nicht passende Optionen werden verhindert oder disabled mit Begruendung gezeigt.
|
||||
- Wenn eine Zuweisung unmoeglich ist, greift E05.
|
||||
|
||||
## Ergaenzung: Verwaltung und Tabs
|
||||
|
||||
Nach der Formularart-Auswahl braucht der Nutzer auch einen ruhigen Ort, an dem alle Formulare verwaltet werden. Dafuer wurde S00 als Formular-Zentrale ergaenzt.
|
||||
|
||||
Innerhalb eines Formulars bleiben die Reiter bewusst einfach:
|
||||
|
||||
| Reiter | Bedeutung |
|
||||
|---|---|
|
||||
| Fragen | Formularfelder bauen und bearbeiten. |
|
||||
| Design | Logo, Farben und Darstellung fuer die Kundensicht anpassen. |
|
||||
| Antworten | Einsendungen als einfache Tabelle ansehen und exportieren. |
|
||||
|
||||
Link, QR-Code und Einbettung werden nach dem Veroeffentlichen bzw. im Public-Link-Kontext verwaltet, nicht als eigener Hauptreiter.
|
||||
|
||||
## Subframe-Links
|
||||
|
||||
| Screen | Subframe |
|
||||
|---|---|
|
||||
| S01 Formularart auswaehlen | https://app.subframe.com/f023064a5ca0/design/c423ebcd-914f-4038-ab9f-7c2a745a8bec/edit |
|
||||
| S02 Einfacher Fragen Editor | https://app.subframe.com/f023064a5ca0/design/181aaa0f-5ae7-4f74-acf7-8273fbbe4dd5/edit |
|
||||
| S02L Lead Felder zuweisen | https://app.subframe.com/f023064a5ca0/design/c8aa80cb-0cc8-473f-9fac-a09d395e6571/edit |
|
||||
| E05 S02 Lead Zuweisung pruefen | https://app.subframe.com/f023064a5ca0/design/26600ce4-7baf-4ffb-9955-7c7d1eef99d1/edit |
|
||||
| S00 Formulare verwalten | https://app.subframe.com/f023064a5ca0/design/2325aa7a-d968-4028-8282-0823b15bf964/edit |
|
||||
| S03 Formular Design | https://app.subframe.com/f023064a5ca0/design/090f06a9-3fa7-4442-b8bc-035e95de7329/edit |
|
||||
| S04 Oeffentliches Formular | https://app.subframe.com/f023064a5ca0/design/caef9ddd-03d6-4a26-8dc1-16aa198a7304/edit |
|
||||
| V01 Public Erfolg oder Redirect | https://app.subframe.com/f023064a5ca0/design/c06ecfc3-1f86-4dfe-9cfd-cec8b8629253/edit |
|
||||
| V02 Public Formular nicht verfuegbar | https://app.subframe.com/f023064a5ca0/design/f96ec12a-5e6a-471d-9a9c-6babcb57c74c/edit |
|
||||
| V03 Public Captcha oder Submit Fehler | https://app.subframe.com/f023064a5ca0/design/95c96bc9-35d4-47ce-b510-7d8ea1f41936/edit |
|
||||
| S05 Antworten Tabelle | https://app.subframe.com/f023064a5ca0/design/9e8eeab7-44ea-4b77-85e6-0818d97e1ac3/edit |
|
||||
| E01 S00 Keine Formulare | https://app.subframe.com/f023064a5ca0/design/136c11b3-8310-4165-b4ba-9cf099ee0873/edit |
|
||||
| E02 S00 Keine Treffer | https://app.subframe.com/f023064a5ca0/design/ccf8d2f7-e7b4-4ffd-87f6-1785edc1b2f7/edit |
|
||||
| E03 S05 Keine Antworten | https://app.subframe.com/f023064a5ca0/design/6f56c14f-d66e-4734-8a29-a900ac74a8a7/edit |
|
||||
| E04 S05 Export Fehler | https://app.subframe.com/f023064a5ca0/design/00553ea4-9839-4d22-b540-9b9ef0bf014f/edit |
|
||||
@@ -0,0 +1,202 @@
|
||||
---
|
||||
kind: subframe-build-log
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
package: WF-D-FORM Form Builder
|
||||
status: Review-ready / Subframe Draft gebaut
|
||||
stand: 2026-07-09
|
||||
---
|
||||
|
||||
# Subframe Bau Log - D-FORM
|
||||
|
||||
## Projekt
|
||||
|
||||
Subframe-Projekt: `Basedesign`
|
||||
Project ID: `f023064a5ca0`
|
||||
Flow: `(MCP) WF-D-FORM Form Builder`
|
||||
Flow-Link: https://app.subframe.com/f023064a5ca0/flow/afb1c257-46f0-4b23-aaed-d75f4773f1a9/edit?tab=ai&conversationId=02d948da-f9aa-4ab5-8352-2745789bb9ad
|
||||
|
||||
## Gebaut
|
||||
|
||||
| Nr. | ID | Screen | Status | Subframe |
|
||||
|---|---|---|---|---|
|
||||
| 01 | S00 | Formulare verwalten | Hauptfluss | https://app.subframe.com/f023064a5ca0/design/2325aa7a-d968-4028-8282-0823b15bf964/edit |
|
||||
| 02 | E01 | S00 Keine Formulare | Hauptfluss / Empty | https://app.subframe.com/f023064a5ca0/design/136c11b3-8310-4165-b4ba-9cf099ee0873/edit |
|
||||
| 03 | E02 | S00 Keine Treffer | Hauptfluss / Empty | https://app.subframe.com/f023064a5ca0/design/ccf8d2f7-e7b4-4ffd-87f6-1785edc1b2f7/edit |
|
||||
| 04 | S01 | Formularart auswaehlen | Hauptfluss | https://app.subframe.com/f023064a5ca0/design/c423ebcd-914f-4038-ab9f-7c2a745a8bec/edit |
|
||||
| 05 | S02 | Einfacher Fragen Editor | Hauptfluss | https://app.subframe.com/f023064a5ca0/design/181aaa0f-5ae7-4f74-acf7-8273fbbe4dd5/edit |
|
||||
| 05b | S02L | Lead Felder zuweisen | Hauptfluss / Lead State | https://app.subframe.com/f023064a5ca0/design/c8aa80cb-0cc8-473f-9fac-a09d395e6571/edit |
|
||||
| 05c | E05 | S02 Lead Zuweisung pruefen | Hauptfluss / Lead Error | https://app.subframe.com/f023064a5ca0/design/26600ce4-7baf-4ffb-9955-7c7d1eef99d1/edit |
|
||||
| 06 | S03 | Formular Design | Hauptfluss | https://app.subframe.com/f023064a5ca0/design/090f06a9-3fa7-4442-b8bc-035e95de7329/edit |
|
||||
| 07 | S04 | Oeffentliches Formular | Public Zielbild | https://app.subframe.com/f023064a5ca0/design/caef9ddd-03d6-4a26-8dc1-16aa198a7304/edit |
|
||||
| 08 | V01 | Public Erfolg oder Redirect | Public State | https://app.subframe.com/f023064a5ca0/design/c06ecfc3-1f86-4dfe-9cfd-cec8b8629253/edit |
|
||||
| 09 | V02 | Public Formular nicht verfuegbar | Public State | https://app.subframe.com/f023064a5ca0/design/f96ec12a-5e6a-471d-9a9c-6babcb57c74c/edit |
|
||||
| 10 | V03 | Public Captcha oder Submit Fehler | Public State | https://app.subframe.com/f023064a5ca0/design/95c96bc9-35d4-47ce-b510-7d8ea1f41936/edit |
|
||||
| 11 | S05 | Antworten Tabelle | Hauptfluss / Auswertung | https://app.subframe.com/f023064a5ca0/design/9e8eeab7-44ea-4b77-85e6-0818d97e1ac3/edit |
|
||||
| 12 | E03 | S05 Keine Antworten | Hauptfluss / Empty | https://app.subframe.com/f023064a5ca0/design/6f56c14f-d66e-4734-8a29-a900ac74a8a7/edit |
|
||||
| 13 | E04 | S05 Export Fehler | Hauptfluss / Error | https://app.subframe.com/f023064a5ca0/design/00553ea4-9839-4d22-b540-9b9ef0bf014f/edit |
|
||||
| 80 | S01B | Gefuehrter Fragen Editor | Spaeter / Referenz | https://app.subframe.com/f023064a5ca0/design/d0fb9c3d-4b03-4d59-bd98-9f668ab018eb/edit |
|
||||
| 81 | S01C | Website Formular Editor | Spaeter / Referenz | https://app.subframe.com/f023064a5ca0/design/d7d33e94-5c12-48e8-8ec6-1e94590ee89c/edit |
|
||||
| 82 | S01D | Umfrage Editor | Spaeter / Referenz | https://app.subframe.com/f023064a5ca0/design/5abd7799-7058-40b3-9772-884cbda97b9c/edit |
|
||||
| 83 | S01E | Internes Formular Editor | Spaeter / Referenz | https://app.subframe.com/f023064a5ca0/design/ea08fd1c-1a76-4e2c-b27c-1091baa0586a/edit |
|
||||
| 90 | ADV-S01 | Form-Builder Canvas | Advanced / Referenz | https://app.subframe.com/f023064a5ca0/design/e5502f88-9858-460e-abae-671f28464270/edit |
|
||||
| 90b | ADV-S01-2 | Form-Builder Canvas 2 | Advanced / Referenz | https://app.subframe.com/f023064a5ca0/design/9529ac6f-eb71-4e5c-8774-7cebe9c8162c/edit |
|
||||
| 91 | D07 | Logic Regel Detail | Advanced / Referenz | https://app.subframe.com/f023064a5ca0/design/07b60457-8151-46b9-ba34-34eceffc08bb/edit |
|
||||
| 92 | D08 | Action Detail mit Mapping | Advanced / Referenz | https://app.subframe.com/f023064a5ca0/design/0759d779-91f5-4e06-b1d6-7cd0095461ea/edit |
|
||||
| 93 | D09 | Publish Blocker Summary | Advanced / Referenz | https://app.subframe.com/f023064a5ca0/design/211e8ca7-fc0b-4c52-a4a4-a1e660209e58/edit |
|
||||
|
||||
## Qualitaetscheck Builder
|
||||
|
||||
- ADV-S01 ist interne Advanced-Mitarbeitersicht, kein Public Formular.
|
||||
- ADV-S01 nutzt das vorhandene Subframe `Default Page Layout`. Keine eigene Sidebar nachbauen.
|
||||
- Die extra generierte Seite `ADV-S01 Form-Builder Canvas Default Layout` wurde geloescht, weil sie die Sidebar selbst nachgebaut hatte.
|
||||
- ADV-S01-2 Form-Builder Canvas 2 liegt als neue Builder-Basis im gleichen Flow.
|
||||
- S01 ist als vereinfachter Einstieg gebaut: Nutzer waehlt Formularart vor dem Builder.
|
||||
- S01 nutzt das vorhandene `Default Page Layout`, nicht eine selbst nachgebaute Sidebar.
|
||||
- S01 enthaelt Website-/Externes Formular, Lead-Formular, Fragebogen/Umfrage und Internes Formular.
|
||||
- S01 wurde am 2026-07-08 reduziert: keine doppelte Vorlagenzeile und keine einzelnen `Auswaehlen`-Links in den Karten; Auswahl ueber Karte + `Weiter`.
|
||||
- S01 macht Lead-Formular bewusst einfach: Antworten werden automatisch als Lead gespeichert, kein Mapping fuer normale Nutzer.
|
||||
- S02 nutzt das vorhandene `Default Page Layout`, nicht eine selbst nachgebaute Sidebar.
|
||||
- S02 ist die Google-Forms-nahe Alternative: Titelkarte, Fragekarten, Google-Forms-nahe Fragetyp-Auswahl, mehrere editierbare Optionen, Pflichtfrage-Toggle und erweiterte Werkzeugleiste.
|
||||
- S02 zeigt Lead-Verknuepfung als ruhige blaue Card. Die Card nutzt denselben Layout-Aufbau wie die gruene `Lead anlegen`-Card: Icon links, Titel/Badge/Beschreibung in der Mitte, Aktionen rechts.
|
||||
- Arbeitsentscheidung: S02 ist aktuell der Haupt-Editor fuer alle Formulararten. S01B/S01C/S01D/S01E bleiben spaetere Varianten bzw. Referenz.
|
||||
- S02-Fragetyp-Dropdown zeigt den aktuell gewaehlten Typ, z. B. `Multiple-Choice-Frage`; `Fragetyp` ist kein sichtbarer Wert.
|
||||
- Im aktuellen S02-Hauptdropdown bleiben nur: Kurzantwort, Absatz, Multiple-Choice-Frage, Mehrfachauswahl, Drop-down, Datei oder Bild hochladen, Datum und Zeit. Lineare Skala, Bewertung und Raster sind gestrichen.
|
||||
- In S02 bleiben Logic, Actions und Publish-Blocker einfach: `Bedingung` an der Frage, `Nach Absenden`/Lead anlegen als Card mit `Felder zuweisen`, Publish-Blocker als Banner/Popover im selben Screen.
|
||||
- S02L ist gebaut: Lead-Felder werden per Dropdown-Vorlage Formularfragen zugewiesen. Die blaue Lead-Card nutzt dort denselben Aufbau wie in S02.
|
||||
- E05 ist gebaut: unmoegliche oder fehlende Lead-Zuweisungen werden sichtbar markiert.
|
||||
- Layout-Hinweis fuer S02L/E05: Inhaltlich sind beide Zustaende gebaut. In Subframe bei der finalen Sichtpruefung einmal kontrollieren, ob das vorhandene `Default Page Layout` aktiv ist.
|
||||
- S01B nutzt das vorhandene `Default Page Layout`, nicht eine selbst nachgebaute Sidebar.
|
||||
- S01B ist die gefuehrte Alternative: Schrittleiste, linke Fragenliste, eine aktive Fragekarte und rechte Hilfe-/Preview-Zusammenfassung.
|
||||
- S01B zeigt Lead-Verknuepfung als einfache aktive Einstellung mit Ziel-Pipeline/Team, ohne Mapping-Panel.
|
||||
- S01C nutzt das vorhandene `Default Page Layout`, nicht eine selbst nachgebaute Sidebar.
|
||||
- S01C ist das Beispiel fuer Website-/Externes Formular: oeffentliche Anfrage, Public-Link-Hinweis, mCaptcha/Datenschutz, kein Lead-Mapping.
|
||||
- S01D nutzt das vorhandene `Default Page Layout`, nicht eine selbst nachgebaute Sidebar.
|
||||
- S01D ist nur Referenz fuer Fragebogen/Umfrage; im aktuellen Hauptfluss keine Skala, Bewertung oder Raster bauen.
|
||||
- S01E nutzt das vorhandene `Default Page Layout`, nicht eine selbst nachgebaute Sidebar.
|
||||
- S01E ist das Beispiel fuer Internes Formular: interne Meldung/Materialbedarf, Team-Ziel, keine Public-Link- oder Lead-Pipeline-Logik.
|
||||
- S01C und S01E wurden am 2026-07-07 neu aufgebaut, weil die alten Subframe-IDs nicht mehr auffindbar waren.
|
||||
- S00 nutzt das vorhandene `Default Page Layout`, nicht eine selbst nachgebaute Sidebar.
|
||||
- S00 ist die Formular-Zentrale: Mehrfachfilter nach Status und Art, Suche, Sortierung, Tabelle und Zeilenaktionen.
|
||||
- S00 zeigt mehrere aktive Status-Filter; die Art-Filter stehen separat bereit, damit nicht nur ein einzelner Tab moeglich wirkt.
|
||||
- S03 nutzt das vorhandene `Default Page Layout`, nicht eine selbst nachgebaute Sidebar.
|
||||
- S03 ist der Design-Tab: Logo, Akzentfarbe, Theme, Formularbreite, Datenschutz-Hinweis und Live-Vorschau der Kundensicht.
|
||||
- S05 nutzt das vorhandene `Default Page Layout`, nicht eine selbst nachgebaute Sidebar.
|
||||
- S05 ist der Antworten-Tab: Excel-aehnliche Tabelle, Suche, erweiterter Zeitraumfilter und Excel/CSV-Export. Keine Kennzahl-Kacheln, damit die Ansicht ruhig bleibt.
|
||||
- S05 hat keinen `Link teilen`-Button; Teilen/Link gehoert in den Veroeffentlichen-/Public-Link-Kontext.
|
||||
- E01/E02 decken die wichtigen leeren Zustaende der Formular-Zentrale ab: noch keine Formulare und Suche/Filter ohne Treffer.
|
||||
- E03/E04 decken die wichtigen Zustaende im Antworten-Tab ab: noch keine Antworten und Export-Fehler.
|
||||
- Layout-Check fuer E01-E04: In Subframe die Page Layout Auswahl pruefen und bei Bedarf `Default Page Layout` setzen. Per MCP kann ich Inhalte bauen/editieren, aber den Page-Layout-Typ nicht verlaesslich setzen.
|
||||
- ADV-S01 zeigt Topbar mit Save, Preview, Share und Publish.
|
||||
- ADV-S01 zeigt links die Feld-Palette, mittig den Canvas und rechts den Feld-Inspector.
|
||||
- ADV-S01 macht die Arbeitsmodi Builder, Logik, Aktionen, Freigabe, Vorschau und Einstellungen sichtbar.
|
||||
- ADV-S01 zeigt einen konkreten Publish-Blocker fuer ein Select-Feld ohne Optionen.
|
||||
- D07 nutzt das vorhandene `Default Page Layout`, nicht eine selbst nachgebaute Sidebar.
|
||||
- D07 zeigt den Logik-Modus mit Regel-Liste, gewaehltem Regel-Detail, Test/Preview, Inline-Validation und Publish-Blocker-Hinweis.
|
||||
- D08 nutzt das vorhandene `Default Page Layout`, nicht eine selbst nachgebaute Sidebar.
|
||||
- D08 zeigt den Aktionen-Modus mit Action-Liste, Add-Action-Popover, Mapping-Tabelle, Ziel-/Pipeline-Fehlern, Test/Preview und Publish-Blocker-Hinweis.
|
||||
- D09 nutzt das vorhandene `Default Page Layout`, nicht eine selbst nachgebaute Sidebar.
|
||||
- D09 zeigt Publish als blockierten internen Zustand: deaktivierter Publish-Button, 5 harte Blocker, nicht-blockierende Warnungen, Sprungziele und erneute Pruefung.
|
||||
- D09 bleibt Inline Summary/Banner im Builder und ist kein Modal/Dialog.
|
||||
|
||||
## Qualitaetscheck Public
|
||||
|
||||
- S04 ist Kundensicht ohne App-Shell.
|
||||
- S04 zeigt Tenant, Formular-Intro, Name, Email, Telefon, Bereich, Beschreibung, Datei/Foto, Datenschutz-Checkbox, mCaptcha und Submit.
|
||||
- V01 bestaetigt klar, dass die Anfrage angekommen ist und deckt Redirect ab.
|
||||
- V02 ersetzt rohe 404/500-Fehler durch einen ruhigen Public-Blocker.
|
||||
- V03 behaelt Werte sichtbar und zeigt Captcha-, Upload- und Submit-Fehler ohne technische Details.
|
||||
- `File Upload` nutzt in S04 und V03 `fullwith={true}`, damit Upload-Felder die verfuegbare Formularbreite nutzen.
|
||||
- S04 und V03 nutzen jetzt die `Card`-Komponente fuer das zentrale Formularpanel. Die Groesse wird pro Instanz ueber `className` erweitert, nicht global an der Card-Komponente.
|
||||
- S04 und V03 sind optisch angeglichen: beide nutzen `max-w-[760px]`, dieselbe Card-Logik und eine einspaltige Feldreihenfolge. V03 zeigt denselben Aufbau mit erhaltenen Werten plus Fehlerbanner/Inline-Fehler.
|
||||
|
||||
## Komponenten-Notiz
|
||||
|
||||
Die Subframe-Komponente `File Upload` hat eine Boolean-Prop `fullwith`.
|
||||
|
||||
Stand 2026-07-06 wurde die Komponente angepasst:
|
||||
|
||||
- `fullwith={true}` wirkt im Default-/Hover-/Error-Dropbereich.
|
||||
- `fullwith={true}` wirkt jetzt auch im `uploading`-Zustand.
|
||||
- `fullwith={true}` wirkt jetzt auch im `uploaded`-Zustand.
|
||||
|
||||
Merksatz: In Formularen nicht nur `className="w-full"` setzen, sondern bei `File Upload` auch `fullwith={true}` verwenden.
|
||||
|
||||
## Noch offen
|
||||
|
||||
Fuer den alten D-FORM-Scope sind keine empfohlenen Frames mehr offen.
|
||||
|
||||
Durch Davids neues Lead-Feedback wurden zwei Zustaende ergaenzt und in Subframe gebaut: S02L `Lead Felder zuweisen` und E05 `S02 Lead Zuweisung pruefen`. S00, S01, S02, S02L/E05, S03, S04/Public States, S05 und E01-E04 bilden weiter den aktuellen Hauptfluss.
|
||||
|
||||
S01B/S01C/S01D/S01E, ADV-S01 Canvas 1/2 und D07/D08/D09 sind gebaut, aber aktuell nicht relevant fuer den Hauptfluss. Sie bleiben als spaetere Varianten bzw. Referenzseiten erhalten.
|
||||
|
||||
Subframe-Seitenliste: Per MCP kann ich bestehende Pages aktuell nicht umbenennen oder per Drag-and-drop sortieren. Fachlich gilt die Review-Reihenfolge unten. Falls die sichtbare Subframe-Liste sauber sortiert werden soll, die Pages in Subframe manuell umbenennen/ziehen.
|
||||
|
||||
Empfohlene sichtbare Sortierung:
|
||||
|
||||
1. `01 S00 Formulare verwalten`
|
||||
2. `02 E01 S00 Keine Formulare`
|
||||
3. `03 E02 S00 Keine Treffer`
|
||||
4. `04 S01 Formularart auswaehlen`
|
||||
5. `05 S02 Einfacher Fragen Editor`
|
||||
6. `05b S02L Lead Felder zuweisen`
|
||||
7. `05c E05 S02 Lead Zuweisung pruefen`
|
||||
8. `06 S03 Formular Design`
|
||||
9. `07 S04 Oeffentliches Formular`
|
||||
10. `08 V01 Public Erfolg oder Redirect`
|
||||
11. `09 V02 Public Formular nicht verfuegbar`
|
||||
12. `10 V03 Public Captcha oder Submit Fehler`
|
||||
13. `11 S05 Antworten Tabelle`
|
||||
14. `12 E03 S05 Keine Antworten`
|
||||
15. `13 E04 S05 Export Fehler`
|
||||
16. `80 S01B Gefuehrter Fragen Editor`
|
||||
17. `81 S01C Website Formular Editor`
|
||||
18. `82 S01D Umfrage Editor`
|
||||
19. `83 S01E Internes Formular Editor`
|
||||
20. `90 ADV Form-Builder Canvas`
|
||||
21. `90b ADV Form-Builder Canvas 2`
|
||||
22. `91 D07 Logic Regel Detail`
|
||||
23. `92 D08 Action Detail mit Mapping`
|
||||
24. `93 D09 Publish Blocker Summary`
|
||||
|
||||
M01-M04 bleiben dokumentierte Confirm-Zustaende und werden nur gebaut, wenn David sie explizit anfordert.
|
||||
|
||||
## Modal-Regel fuer spaeter
|
||||
|
||||
Die vier bereits gebauten Public-Screens sind keine Modals:
|
||||
|
||||
- S04 Oeffentliches Formular
|
||||
- V01 Public Erfolg oder Redirect
|
||||
- V02 Public Formular nicht verfuegbar
|
||||
- V03 Public Captcha oder Submit Fehler
|
||||
|
||||
Falls spaeter D-FORM-M-Zustaende gebaut werden, muessen sie als `Dialog`-Komponente gebaut werden:
|
||||
|
||||
- M01 Feld loeschen Confirm
|
||||
- M02 Unpublish Confirm
|
||||
- M03 Archive Confirm
|
||||
- M04 Unsaved Changes Confirm
|
||||
|
||||
D07 und D08 bleiben Panel/Drawer-Zustaende im Builder. D09 bleibt Inline Summary/Banner. Diese drei sind keine Dialoge.
|
||||
|
||||
## Naechster Subframe-Schritt
|
||||
|
||||
Review in Subframe in dieser Reihenfolge:
|
||||
|
||||
1. `S00 Formulare verwalten`
|
||||
2. `E01 S00 Keine Formulare`
|
||||
3. `E02 S00 Keine Treffer`
|
||||
4. `S01 Formularart auswaehlen`
|
||||
5. `S02 Einfacher Fragen Editor`
|
||||
6. `S02L Lead Felder zuweisen`
|
||||
7. `E05 S02 Lead Zuweisung pruefen`
|
||||
8. `S03 Formular Design`
|
||||
9. `S04 Oeffentliches Formular`
|
||||
10. `V01 Public Erfolg oder Redirect`
|
||||
11. `V02 Public Formular nicht verfuegbar`
|
||||
12. `V03 Public Captcha oder Submit Fehler`
|
||||
13. `S05 Antworten Tabelle`
|
||||
14. `E03 S05 Keine Antworten`
|
||||
15. `E04 S05 Export Fehler`
|
||||
|
||||
Danach nur bei Bedarf die spaeteren Referenzseiten pruefen: S01B/S01C/S01D/S01E, ADV-S01 Canvas 1/2 und D07/D08/D09.
|
||||
@@ -0,0 +1,471 @@
|
||||
---
|
||||
kind: subframe-build-plan
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
package: WF-D-FORM Form Builder
|
||||
status: Bauplan / umgesetzt als Review-ready Subframe Draft
|
||||
stand: 2026-07-09
|
||||
---
|
||||
|
||||
# Subframe Bauplan - D-FORM
|
||||
|
||||
Ziel: D-FORM so in Subframe bauen, dass der Unterschied sofort klar wird:
|
||||
|
||||
- **S02 Einfacher Fragen Editor** = internes Werkzeug fuer Mitarbeiter.
|
||||
- **S04 Oeffentliches Formular** = fertiges Formular fuer Kunden/Submitter.
|
||||
- **Preview in S02** = Vorschau auf S04, kein PDF.
|
||||
- **Logic** = steuert, welche Felder im Kundenformular sichtbar werden.
|
||||
- **Actions** = passiert nach dem Absenden, z. B. Email, Lead, Kontakt, Projekt, Task.
|
||||
|
||||
## 1. Verstaendnisanker
|
||||
|
||||
```text
|
||||
Mitarbeiter baut in S02:
|
||||
"Welche Fragen sollen Kunden beantworten?"
|
||||
|
||||
Kunde sieht S04:
|
||||
"Ich fuelle schnell ein Formular aus und sende es ab."
|
||||
|
||||
Nach Submit:
|
||||
Submission wird gespeichert und Actions koennen laufen.
|
||||
```
|
||||
|
||||
Der Kunde sieht nie den Builder. Der Kunde sieht nur die public Formularseite.
|
||||
|
||||
## 2. Review-Reihenfolge
|
||||
|
||||
Empfehlung fuer Review und Weiterarbeit: zuerst den aktuellen Hauptfluss pruefen. Spaetere Varianten und Advanced-Zustaende stehen bewusst hinten.
|
||||
|
||||
| Reihenfolge | Frame | Warum zuerst / danach? |
|
||||
|---|---|---|
|
||||
| 1 | S00 Formulare verwalten | Einstieg in den Arbeitsbereich: vorhandene Formulare, Mehrfachfilter, Status, Aktionen. |
|
||||
| 2 | E01 S00 Keine Formulare | Wichtiger Empty State der Formular-Zentrale. |
|
||||
| 3 | E02 S00 Keine Treffer | Wichtiger Filter-/Suchzustand der Formular-Zentrale. |
|
||||
| 4 | S01 Formularart auswaehlen | Nutzer entscheidet, welche Art Formular gebaut wird. |
|
||||
| 5 | S02 Einfacher Fragen Editor | Aktueller Haupt-Editor fuer alle Formulararten. |
|
||||
| 6 | S02L Lead Felder zuweisen | Lead-Zustand im gleichen S02-Look: Formularfragen Lead-Feldern zuweisen. |
|
||||
| 7 | E05 S02 Lead Zuweisung pruefen | Optionaler Fehlerzustand, wenn eine Zuweisung fehlt oder nicht moeglich ist. |
|
||||
| 8 | S03 Formular Design | Design-Tab: Logo, Farben, Public Preview. |
|
||||
| 9 | S04 Oeffentliches Formular | Zielbild: So sieht das fertige Formular fuer Kunden aus. |
|
||||
| 10 | V01 Public Erfolg oder Redirect | Zeigt, was nach Absenden passiert. |
|
||||
| 11 | V02 Public Formular nicht verfuegbar | Zeigt Public-Blocker ohne App-Kontext. |
|
||||
| 12 | V03 Public Captcha oder Submit Fehler | Zeigt Public-Fehler, Werte bleiben erhalten. |
|
||||
| 13 | S05 Antworten Tabelle | Antworten-Tab als Excel-/Tabellenansicht. |
|
||||
| 14 | E03 S05 Keine Antworten | Wichtiger Empty State im Antworten-Tab. |
|
||||
| 15 | E04 S05 Export Fehler | Wichtiger Fehlerzustand beim Export. |
|
||||
| 80 | S01B Gefuehrter Fragen Editor | Spaetere Alternative fuer Nutzer, die noch mehr Fuehrung brauchen. |
|
||||
| 81 | S01C Website Formular Editor | Spaetere Beispiel-/Referenzseite fuer Website-/externes Formular. |
|
||||
| 82 | S01D Umfrage Editor | Spaetere Beispiel-/Referenzseite fuer Fragebogen/Umfrage. |
|
||||
| 83 | S01E Internes Formular Editor | Spaetere Beispiel-/Referenzseite fuer internes Mitarbeiterformular. |
|
||||
| 90 | ADV-S01 Form-Builder Canvas | Aelterer Profi-Canvas als Referenz. |
|
||||
| 90b | ADV-S01-2 Form-Builder Canvas 2 | Advanced-/Referenz-Builder; nicht mehr erste Nutzerrichtung. |
|
||||
| 91 | D07 Logic Regel Detail | Advanced-Zustand fuer Sichtbarkeitsregeln. |
|
||||
| 92 | D08 Action Detail mit Mapping | Advanced-Zustand fuer Nach-Submit-Aktionen. |
|
||||
| 93 | D09 Publish Blocker Summary | Advanced-Zustand fuer Publish-Blocker. |
|
||||
|
||||
M01/M02/M03/M04 und D10 bleiben dokumentiert und muessen nicht als erste Subframe-Frames gebaut werden.
|
||||
|
||||
Stand 2026-07-09: Die einfachen Builder-Screens sind gebaut und werden fuer Review vor den alten Canvas-Entwuerfen einsortiert. S02L und E05 wurden nach Davids Lead-Feedback ergaenzt. Die Links stehen im [[Subframe Bau Log]]. Fuer die weitergebbare Version siehe [[00 Start hier - David]] und [[D-FORM David Uebergabe 2026-07-09]].
|
||||
|
||||
### Nutzerfluss fuer die Simple-Builder-Richtung
|
||||
|
||||
```text
|
||||
S00 Formulare verwalten
|
||||
-> Neues Formular
|
||||
-> S01 Formularart auswaehlen
|
||||
-> je Auswahl:
|
||||
Website / Extern -> S02 mit Website-/Extern-Vorlage
|
||||
Lead -> S02 mit aktiver Lead-Verknuepfung -> S02L Felder zuweisen
|
||||
Fragebogen / Umfrage -> S02 mit Umfrage-Startfragen
|
||||
Intern -> S02 mit interner Formularvorlage
|
||||
-> Design anpassen -> S03
|
||||
-> Public Zielbild pruefen -> S04/V01/V02/V03
|
||||
-> Antworten ansehen/exportieren -> S05
|
||||
```
|
||||
|
||||
Die Subframe-Seitenliste selbst ist nicht zwingend die Review-Reihenfolge. Fachlich gilt die Reihenfolge oben.
|
||||
|
||||
### Noch relevante Error-/Empty-Zustaende
|
||||
|
||||
| Bereich | Zustand | Eigener Screen noetig? | Notiz |
|
||||
|---|---|---|---|
|
||||
| S00 Verwaltung | Keine Formulare vorhanden | ja | E01 ist gebaut, weil die erste leere Nutzung fachlich wichtig ist. |
|
||||
| S00 Verwaltung | Suche/Filter ohne Treffer | ja | E02 ist gebaut, weil Mehrfachfilter sonst schnell verwirren. |
|
||||
| S01 Auswahl | Keine Formularart gewaehlt | nein | `Weiter` disabled oder Lead als Default vorausgewaehlt. |
|
||||
| S02 | Frage ohne Label/Optionen | nein | Inline markieren; Publish-Blocker als Banner/Popover im selben Screen. |
|
||||
| S02L Lead | Pflichtzuweisung fehlt | ja, optional E05 | Name, Kontaktweg und Beschreibung muessen zuweisbar sein. |
|
||||
| S02L Lead | Feld passt nicht zum Lead-Feld | ja, optional E05 | Dropdown-Option disabled oder Zeile mit Fehler markieren. |
|
||||
| S03 Design | Logo/Datei-Upload fehlschlaegt | nein | Inline am Upload oder Toast. |
|
||||
| S05 Antworten | Keine Antworten | ja | E03 ist gebaut, weil neue Formulare anfangs leer sind. |
|
||||
| S05 Antworten | Suche/Filter ohne Treffer | nein | Kleiner Empty State im Tabellenbereich reicht. |
|
||||
| S05 Antworten | Export fehlgeschlagen | ja | E04 ist gebaut, weil Export fuer Arbeit/Weitergabe wichtig ist. |
|
||||
| Public | Formular nicht verfuegbar | ja | V02 ist gebaut. |
|
||||
| Public | Captcha/Submit-Fehler | ja | V03 ist gebaut. |
|
||||
| Public | Submit erfolgreich | ja | V01 ist gebaut. |
|
||||
|
||||
## 3. Exakte Subframe-Namen
|
||||
|
||||
Flow-Name:
|
||||
|
||||
- `(MCP) WF-D-FORM Form Builder`
|
||||
|
||||
Frames / Designs:
|
||||
|
||||
| ID | Subframe-Name | Typ |
|
||||
|---|---|---|
|
||||
| S00 | `S00 Formulare verwalten` | Formular-Zentrale |
|
||||
| S01 | `S01 Formularart auswaehlen` | Einstieg / Auswahl |
|
||||
| S02 | `S02 Einfacher Fragen Editor` | Simple Builder |
|
||||
| S02L | `S02L Lead Felder zuweisen` | S02-Zustand / Lead Editor |
|
||||
| E05 | `E05 S02 Lead Zuweisung pruefen` | Lead Mapping Error State |
|
||||
| S03 | `S03 Formular Design` | Builder Tab |
|
||||
| S04 | `S04 Oeffentliches Formular` | Public Form |
|
||||
| V01 | `V01 Public Erfolg oder Redirect` | Public Feedback |
|
||||
| V02 | `V02 Public Formular nicht verfuegbar` | Public Blocker |
|
||||
| V03 | `V03 Public Captcha oder Submit Fehler` | Public Error |
|
||||
| S05 | `S05 Antworten Tabelle` | Builder Tab |
|
||||
| E01 | `E01 S00 Keine Formulare` | Hauptfluss / Empty State |
|
||||
| E02 | `E02 S00 Keine Treffer` | Hauptfluss / Empty State |
|
||||
| E03 | `E03 S05 Keine Antworten` | Hauptfluss / Empty State |
|
||||
| E04 | `E04 S05 Export Fehler` | Hauptfluss / Error State |
|
||||
| S01B | `S01B Gefuehrter Fragen Editor` | Spaeter / Referenz |
|
||||
| S01C | `S01C Website Formular Editor` | Spaeter / Referenz |
|
||||
| S01D | `S01D Umfrage Editor` | Spaeter / Referenz |
|
||||
| S01E | `S01E Internes Formular Editor` | Spaeter / Referenz |
|
||||
| ADV-S01-2 | `ADV-S01-2 Form-Builder Canvas 2` | Advanced Builder / Referenz |
|
||||
| ADV-S01 | `ADV-S01 Form-Builder Canvas` | Aelterer Bespoke Builder / Referenz |
|
||||
| D07 | `D07 Logic Regel Detail` | Advanced / Referenz |
|
||||
| D08 | `D08 Action Detail mit Mapping` | Advanced / Referenz |
|
||||
| D09 | `D09 Publish Blocker Summary` | Advanced / Referenz |
|
||||
|
||||
Hinweis: In der Subframe-Seitenliste tragen S01C, S01D, S01E, S03, S04 und S05 aktuell noch das Suffix `Layout`. Zielnamen fuer Review/Handoff sind die oben stehenden Namen ohne `Layout`.
|
||||
|
||||
Nicht als erste Frames bauen:
|
||||
|
||||
- `D01 Sharing Panel URL QR iFrame`
|
||||
- `D02 Post-Submit Actions`
|
||||
- `D03 Conditional Logic Editor`
|
||||
- `D06 Feldkarten Menue`
|
||||
- `D10 Builder Interaktionsfaelle`
|
||||
- `M01 Feld loeschen Confirm`
|
||||
- `M02 Unpublish Confirm`
|
||||
- `M03 Archive Confirm`
|
||||
- `M04 Unsaved Changes Confirm`
|
||||
|
||||
## 4. Komponenten aus deinen Subframe Standards
|
||||
|
||||
Diese vorhandenen Komponenten/Patterns sollen genutzt werden.
|
||||
|
||||
| Bereich | Komponente | Einsatz in D-FORM |
|
||||
|---|---|---|
|
||||
| Layout | Default Page Layout | S00/S01/S02/S03/S05/E01-E04 als interne Hauptseiten im vorhandenen Subframe Page Layout. S01B-E, ADV-S01 Canvas und D07-D09 bleiben spaetere interne Referenzseiten. S04/V01/V02/V03 bleiben public ohne App-Shell. |
|
||||
| Navigation | Breadcrumb | S02 oben: `Formulare / SHK Anfrageformular`. |
|
||||
| Navigation | Page Header with Back | S02 Header mit Zurueck, Formname, Status, Save, Preview, Share, Publish. |
|
||||
| Navigation | Tabs | S02 Tabs: Fragen, Design, Antworten. ADV-S01 behaelt Builder, Logic, Actions, Sharing, Preview, Settings als Referenz. |
|
||||
| Actions | Button | Save, Publish, Add Field, Add Action, Submit. |
|
||||
| Actions | Icon Button | Feldkarten-Menue, More-Menue, Close/Archive-Trigger. |
|
||||
| Form Inputs | Text Input | Name, Slug, Field Key, Email, Telefon. |
|
||||
| Form Inputs | Textarea | Beschreibung, Success Message, langer Hilfetext. |
|
||||
| Form Inputs | Select | Bereich, Operator, Zielfeld, Action-Typ, Pipeline. |
|
||||
| Form Inputs | Multiselect / Checkbox Group | Multi-Select-Felder und Public Auswahlgruppen. |
|
||||
| Form Inputs | Checkbox | Public Captcha/Consent, Boolean-Felder. |
|
||||
| Form Inputs | Switch | Required, Logic aktiv, Action aktiv. |
|
||||
| Form Inputs | File Upload | Public Datei-/Foto-Upload. |
|
||||
| Feedback | Banner Alert | Publish Blocker, Public Submit Error, Draft Sharing Hinweis. |
|
||||
| Feedback | Toast | Gespeichert, kopiert, published. |
|
||||
| Data Display | Badge Feedback / Tag Label | Draft/Published, Pflicht, Fehler, Feldtyp, aktiv/inaktiv. |
|
||||
| Data Display | Empty State | Leerer Canvas, keine Actions, keine Logic-Regeln. |
|
||||
| Overlays | Dropdown Menu / Context Menu | Feldkarten-Menue, More-Menue. |
|
||||
| Overlays | Confirm Dialog | M01/M02/M03/M04, nur dokumentiert oder spaeter kleine Frames. |
|
||||
| Layout | Separator Divider | Inspector-Sektionen, Public Form-Abgrenzungen. |
|
||||
| Utility | Tooltip | Disabled Actions, Rechte-Hinweise, Copy/Share-Hilfe. |
|
||||
|
||||
## 5. Namens- und Variantenregeln
|
||||
|
||||
Aus den Subframe UI Standards:
|
||||
|
||||
- Size-Default heisst `Medium`, nicht `Default`.
|
||||
- States: `default`, `hover`, `active`, `focus`, `disabled`, `loading`, `error`, `selected`.
|
||||
- Varianten: `primary`, `secondary`, `tertiary`, `ghost`, `destructive`, `neutral`, `success`, `warning`, `information`.
|
||||
- Form Field Anatomy:
|
||||
- `label`
|
||||
- `helpText`
|
||||
- Control
|
||||
- `message`
|
||||
- Unterer Field-Text heisst immer `message`, nicht Helper, Label oder Help.
|
||||
- Textnahe Controls nutzen `Radius Small`.
|
||||
- `File Upload` hat die Boolean-Prop `fullwith`. Wenn ein Upload-Feld in einem Formularbereich die ganze verfuegbare Breite nutzen soll, immer `fullwith={true}` setzen. Das gilt besonders fuer Public Forms und Upload-Fehlerzustaende.
|
||||
|
||||
## 5a. Modal-Regel
|
||||
|
||||
Die gebauten Public-Screens `S02`, `V01`, `V02` und `V03` sind **keine** Modal-Screens. Sie sind Public Page States und duerfen mit einem zentrierten Container oder einer Card arbeiten.
|
||||
|
||||
Fuer alle echten D-FORM-Modals gilt:
|
||||
|
||||
- `M01 Feld loeschen Confirm`
|
||||
- `M02 Unpublish Confirm`
|
||||
- `M03 Archive Confirm`
|
||||
- `M04 Unsaved Changes Confirm`
|
||||
|
||||
Wenn einer dieser M-Zustaende spaeter in Subframe gebaut wird, muss die vorhandene Komponente `Dialog` verwendet werden. Nicht als normale Card bauen, nicht als Drawer bauen und nicht als eigener Public/Page-State.
|
||||
|
||||
Abgrenzung:
|
||||
|
||||
- `D07 Logic Regel Detail` = Panel/Drawer im Builder, kein Modal.
|
||||
- `D08 Action Detail mit Mapping` = Panel/Drawer im Builder, kein Modal.
|
||||
- `D09 Publish Blocker Summary` = Inline Banner/Summary im Builder, kein Modal.
|
||||
- Public V01/V02 duerfen zwar card-artig zentriert aussehen, sind aber trotzdem volle Public-Zustaende und keine Dialoge.
|
||||
|
||||
## 6. S04: fertiges Kundenformular
|
||||
|
||||
S04 ist die einfache Seite, die der Kunde sieht. S02 bleibt der interne Fragen-Editor fuer Mitarbeiter.
|
||||
|
||||
### Komponentenregel Public Form Panel
|
||||
|
||||
Das eigentliche Formularpanel in `S04` und der Fehlerzustand in `V03` sollen die vorhandene `Card`-Komponente verwenden. Weil `Card` standardmaessig eher kompakt ist, bekommt die Instanz ein Breiten-Sondermass ueber `className`, z. B. `w-full`, `min-w-[0px]` und den max-width-Container der Seite.
|
||||
|
||||
Wichtig: Dafuer keine globale `Card`-Variante nur fuer D-FORM anlegen und die globale Card nicht verbreitern. Das Sondermass gehoert an die konkrete Public-Form-Card.
|
||||
|
||||
S04 und V03 sollen gleich aufgebaut sein:
|
||||
|
||||
- gleicher Public-Container
|
||||
- gleiche maximale Breite `max-w-[760px]`
|
||||
- gleiche `Card`-Breite
|
||||
- gleiche einspaltige Feldreihenfolge
|
||||
- kein zweispaltiges Name/E-Mail-Layout, damit lange Namen und lange E-Mail-Adressen mehr Platz bekommen
|
||||
- V03 ist derselbe Formularaufbau plus Fehlerbanner, erhaltene Werte und Inline-Fehler
|
||||
|
||||
### Layout
|
||||
|
||||
```text
|
||||
Public Container
|
||||
Public Header
|
||||
Tenant Logo / Fallback
|
||||
Anbietername
|
||||
Formular Intro
|
||||
Titel
|
||||
Beschreibung
|
||||
Form Body
|
||||
Fields in Reihenfolge
|
||||
Captcha / Schutz
|
||||
Absende-Bereich
|
||||
Footer
|
||||
```
|
||||
|
||||
### Beispielinhalt
|
||||
|
||||
| Element | Inhalt |
|
||||
|---|---|
|
||||
| Tenant | SHK Demo GmbH |
|
||||
| Titel | SHK Anfrageformular |
|
||||
| Beschreibung | Beschreiben Sie kurz Ihr Anliegen. Wir melden uns mit den naechsten Schritten. |
|
||||
| Felder | Name, Email, Telefon, Bereich, Beschreibung, Fotos/Dokumente |
|
||||
| Schutz | mCaptcha oder Sicherheitspruefung |
|
||||
| Submit | Anfrage senden |
|
||||
|
||||
### Wichtige Regel
|
||||
|
||||
Keine App-Shell, keine Sidebar, keine internen Begriffe. Keine Woerter wie Submission, Action, Lead, Mapping, Webhook.
|
||||
|
||||
## 7. S01 danach bauen: interne Werkstatt
|
||||
|
||||
S01 ist nicht fuer Kunden. S01 ist fuer Mitarbeiter, die Formulare bauen.
|
||||
|
||||
### Layout
|
||||
|
||||
```text
|
||||
Default Page Layout
|
||||
vorhandene App-Shell des Layouts
|
||||
vorhandene Header Navigation
|
||||
Page Content
|
||||
Header
|
||||
Breadcrumb
|
||||
Formname
|
||||
Status Badge
|
||||
Save
|
||||
Preview
|
||||
Share
|
||||
Publish
|
||||
More
|
||||
Body
|
||||
Left: Field Palette
|
||||
Center: Canvas
|
||||
Right: Inspector
|
||||
Mode Tabs
|
||||
Builder
|
||||
Logic
|
||||
Actions
|
||||
Sharing
|
||||
Preview
|
||||
Settings
|
||||
```
|
||||
|
||||
### Drei-Zonen-Builder
|
||||
|
||||
| Zone | Aufgabe | Wichtig fuer Subframe |
|
||||
|---|---|---|
|
||||
| Linke Palette | Feldtypen hinzufuegen | 12 Feldtypen klar gruppieren. |
|
||||
| Canvas Mitte | Formularstruktur bauen | Feldkarten, Dropzones, Fehler, Selected State. |
|
||||
| Rechter Inspector | Feld konfigurieren | label, helpText, required, validation, options, message. |
|
||||
|
||||
### Layout-Regel fuer interne Builder-Screens
|
||||
|
||||
S00, S01, S02, S03, S05 und E01-E04 muessen in Subframe das vorhandene `Default Page Layout` verwenden. S01B-E, ADV-S01 Canvas und D07-D09 sind spaetere interne Referenzseiten und verwenden ebenfalls keine eigene Sidebar. Wichtig: Das Layout selbst bringt App-Shell/Navigation mit. In den Screens keine eigene Sidebar oder Header-Navigation nachbauen.
|
||||
|
||||
Nicht verwenden fuer den Builder: `Blank`, public/zentrierte Form-Seiten oder `Default Page Layout with inner Sidebar`. Die innere Sidebar ist eher fuer Settings geeignet; der Builder hat bereits eigene Innenbereiche wie Feld-Palette, Canvas, Logic-Liste, Action-Liste und Inspector.
|
||||
|
||||
Public-Screens S04, V01, V02 und V03 bleiben bewusst ohne App-Shell und ohne Sidebar.
|
||||
|
||||
### Modus-Tabs
|
||||
|
||||
| Modus | Was zeigen? |
|
||||
|---|---|
|
||||
| Builder | Palette + Canvas + Inspector. |
|
||||
| Logic | Regel-Liste und D07 Detail. |
|
||||
| Actions | Action-Liste und D08 Mapping. |
|
||||
| Sharing | URL, QR, iFrame; Draft-Hinweis. |
|
||||
| Preview | Vorschau von S04, kein PDF. |
|
||||
| Settings | Slug, Success, Redirect, Branding, Limits. |
|
||||
|
||||
## 8. D07 Logic Regel Detail
|
||||
|
||||
Ziel: Eine einzelne Logic-Regel bauen.
|
||||
|
||||
Subframe-Zustand:
|
||||
|
||||
```text
|
||||
Logic Mode
|
||||
Left/Top: Regel-Liste
|
||||
Detailpanel: D07 Logic Regel Detail
|
||||
```
|
||||
|
||||
Inhalt:
|
||||
|
||||
- Regelname
|
||||
- Wenn-Feld
|
||||
- Operator
|
||||
- Wert
|
||||
- Dann-Aktion: anzeigen / verstecken
|
||||
- Zielfeld
|
||||
- Aktiv Switch
|
||||
- Test / Save
|
||||
- Inline `message` bei Fehler
|
||||
|
||||
Wichtig:
|
||||
|
||||
- `Neue Regel` oeffnet kein Modal.
|
||||
- Operator steuert, ob Wert gebraucht wird.
|
||||
- Wenn Operator `ist leer`, verschwindet das Wertfeld.
|
||||
- Unvollstaendige aktive Regel blockiert Publish.
|
||||
|
||||
## 9. D08 Action Detail mit Mapping
|
||||
|
||||
Ziel: Nach Submit festlegen, was passieren soll.
|
||||
|
||||
Subframe-Zustand:
|
||||
|
||||
```text
|
||||
Actions Mode
|
||||
Action-Liste
|
||||
Add Action Popover
|
||||
Detailpanel: D08 Action Detail mit Mapping
|
||||
```
|
||||
|
||||
Inhalt:
|
||||
|
||||
- Action-Typ
|
||||
- Action-Name
|
||||
- Status aktiv/inaktiv
|
||||
- Ziel: Empfaenger, Pipeline, Webhook URL usw.
|
||||
- Field-Mapping Tabelle: Ziel-Feld -> Form-Feld
|
||||
- Pflichtmapping
|
||||
- Teststatus
|
||||
- Save / Test / Delete
|
||||
|
||||
Wichtig:
|
||||
|
||||
- Add Action oeffnet Popover/Auswahlpanel, kein grosses Modal.
|
||||
- Mapping ist der Kern.
|
||||
- Aktive Action ohne Pflichtmapping blockiert Publish.
|
||||
- Inaktive unvollstaendige Action darf als Draft bleiben.
|
||||
|
||||
## 10. D09 Publish Blocker Summary
|
||||
|
||||
Ziel: Mitarbeiter versteht, warum Publish nicht geht.
|
||||
|
||||
Subframe-Zustand:
|
||||
|
||||
```text
|
||||
ADV-S01 Header
|
||||
Publish Button
|
||||
ADV-S01 Body
|
||||
D09 Summary Banner
|
||||
Blocker-Liste mit Sprungzielen
|
||||
```
|
||||
|
||||
Blocker:
|
||||
|
||||
- Formularname fehlt
|
||||
- Slug fehlt oder Konflikt
|
||||
- Kein sichtbares Feld
|
||||
- Feld ohne Label
|
||||
- Select ohne Optionen
|
||||
- Kaputte Logic
|
||||
- Pflichtmapping fehlt
|
||||
- Webhook URL ungueltig
|
||||
|
||||
Wichtig:
|
||||
|
||||
- Publish bleibt im Builder, kein Wizard.
|
||||
- Jeder Blocker hat ein Sprungziel.
|
||||
- Warnungen duerfen getrennt von Blockern angezeigt werden.
|
||||
|
||||
## 11. Was NICHT passieren soll
|
||||
|
||||
- Builder nicht wie Kundenformular bauen.
|
||||
- Public Form nicht wie interne App bauen.
|
||||
- Preview nicht als PDF verstehen.
|
||||
- Logic nicht als PDF-/Dokumentgenerator verstehen.
|
||||
- Actions nicht als kompletter Automation-Editor bauen.
|
||||
- Confirm-Dialoge nicht vor D07/D08/D09 priorisieren.
|
||||
- Keine neuen globalen Subframe Standards aus D-FORM ableiten.
|
||||
|
||||
## 12. Umsetzungsstand in Subframe
|
||||
|
||||
Subframe-Flow:
|
||||
|
||||
https://app.subframe.com/f023064a5ca0/flow/afb1c257-46f0-4b23-aaed-d75f4773f1a9/edit?tab=ai&conversationId=02d948da-f9aa-4ab5-8352-2745789bb9ad
|
||||
|
||||
Gebaut und verlinkt:
|
||||
|
||||
1. S00 Formulare verwalten
|
||||
2. E01 S00 Keine Formulare
|
||||
3. E02 S00 Keine Treffer
|
||||
4. S01 Formularart auswaehlen
|
||||
5. S02 Einfacher Fragen Editor
|
||||
6. S02L Lead Felder zuweisen
|
||||
7. E05 S02 Lead Zuweisung pruefen
|
||||
8. S03 Formular Design
|
||||
9. S04 Oeffentliches Formular
|
||||
10. V01 Public Erfolg oder Redirect
|
||||
11. V02 Public Formular nicht verfuegbar
|
||||
12. V03 Public Captcha oder Submit Fehler
|
||||
13. S05 Antworten Tabelle
|
||||
14. E03 S05 Keine Antworten
|
||||
15. E04 S05 Export Fehler
|
||||
80. S01B Gefuehrter Fragen Editor
|
||||
81. S01C Website Formular Editor
|
||||
82. S01D Umfrage Editor
|
||||
83. S01E Internes Formular Editor
|
||||
90. ADV-S01 Form-Builder Canvas
|
||||
90b. ADV-S01-2 Form-Builder Canvas 2
|
||||
91. D07 Logic Regel Detail
|
||||
92. D08 Action Detail mit Mapping
|
||||
93. D09 Publish Blocker Summary
|
||||
|
||||
Gebaut nach Davids Lead-Feedback:
|
||||
|
||||
- 05b. S02L Lead Felder zuweisen: https://app.subframe.com/f023064a5ca0/design/c8aa80cb-0cc8-473f-9fac-a09d395e6571/edit
|
||||
- 05c. E05 S02 Lead Zuweisung pruefen: https://app.subframe.com/f023064a5ca0/design/26600ce4-7baf-4ffb-9955-7c7d1eef99d1/edit
|
||||
|
||||
Naechster Schritt: Review in Subframe mit Fokus auf S00 bis S05 plus S02L/E05. Die Seiten 80-93 bleiben spaeter/Referenz und werden nur bei Bedarf geprueft.
|
||||
+106
@@ -0,0 +1,106 @@
|
||||
---
|
||||
kind: screen
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
package: WF-D-FORM Form Builder
|
||||
id: V01
|
||||
screen: Public Erfolg oder Redirect
|
||||
typ: Public Feedback
|
||||
umsetzung: Bauen
|
||||
status: Subframe Draft / Review offen
|
||||
route: /f/{tenant}/{slug}
|
||||
subframe: "https://app.subframe.com/f023064a5ca0/design/c06ecfc3-1f86-4dfe-9cfd-cec8b8629253/edit"
|
||||
---
|
||||
|
||||
# V01 - Public Erfolg oder Redirect
|
||||
|
||||
## Ziel
|
||||
|
||||
Der Submitter versteht sicher, dass die Einreichung angekommen ist, oder wird sauber an ein konfiguriertes Redirect-Ziel weitergeleitet.
|
||||
|
||||
## Pattern / Archetyp
|
||||
|
||||
BESPOKE-Public Feedback.
|
||||
|
||||
## Daten
|
||||
|
||||
- Tenant-Logo/Fallback.
|
||||
- Erfolgstitel.
|
||||
- Erfolgstext aus Form-Konfiguration.
|
||||
- Optionales Redirect-Ziel.
|
||||
- Optionaler Link zur Website/zurueck.
|
||||
|
||||
## Detail-Brainstorming
|
||||
|
||||
Der wichtigste Punkt: Nach erfolgreichem Submit darf nichts so wirken, als sei die Anfrage unsicher oder verloren. Duch wenn Actions im Hintergrund fehlschlagen, bleibt die Public-Bestaetigung auf die gespeicherte Einreichung bezogen.
|
||||
|
||||
### Varianten
|
||||
|
||||
| Variante | Wann | UI |
|
||||
|---|---|---|
|
||||
| Success ohne Redirect | Kein Redirect konfiguriert. | Danke-Ansicht mit Erfolgstitel, Text und optionalem Zurueck-Link. |
|
||||
| Success mit Auto-Redirect | Redirect URL konfiguriert. | Kurze Bestaetigung + Countdown/Weiterleitungshinweis. |
|
||||
| Success mit manuellem Redirect | Auto-Redirect wird nicht sofort ausgefuehrt oder soll bestaetigt werden. | Button "Weiter" zur Zielseite. |
|
||||
| Redirect fehlerhaft | Weiterleitung klappt nicht, Submission ist aber gespeichert. | Erfolg bleibt sichtbar; Link erneut oeffnen oder Anbieter kontaktieren. |
|
||||
|
||||
### Copy-Vorschlag
|
||||
|
||||
| Zustand | Copy-Richtung |
|
||||
|---|---|
|
||||
| Erfolg | "Danke, Ihre Dngaben wurden uebermittelt." |
|
||||
| Naechster Schritt | "Wir melden uns, falls weitere Informationen benoetigt werden." |
|
||||
| Redirect | "Sie werden gleich weitergeleitet." |
|
||||
| Redirect-Fehler | "Ihre Dngaben sind angekommen. Die Weiterleitung konnte nicht geoeffnet werden." |
|
||||
|
||||
### Nicht zeigen
|
||||
|
||||
- Keine Action-Ausfuehrung.
|
||||
- Kein Lead-/Projekt-/Task-Hinweis.
|
||||
- Kein Webhook-/Automation-Status.
|
||||
- Keine interne Submission-ID, ausser spaeter bewusst als Referenznummer geplant.
|
||||
|
||||
## Aktionen
|
||||
|
||||
- Bei Success ohne Redirect: Seite schliessen oder zur Website zurueck.
|
||||
- Bei Redirect: automatisch oder per Button weiter.
|
||||
|
||||
## Banner / Hinweise
|
||||
|
||||
- Kein technischer ActionLog im Public UI.
|
||||
- Keine internen Begriffe wie Lead, Projekt, Webhook oder Automation.
|
||||
|
||||
## Toasts / Action-Feedback
|
||||
|
||||
- Keine Toasts; Success-State ist die Rueckmeldung.
|
||||
|
||||
## Meldungsentscheidung
|
||||
|
||||
| Ereignis | UI-Form | Blockiert? | Umsetzung | Copy/Notiz |
|
||||
|---|---|---|---|---|
|
||||
| Submit erfolgreich | Success-State | nein | Bauen | Anfrage ist angekommen. |
|
||||
| Redirect konfiguriert | Success + Weiterleitung | nein | Bauen | Falls Redirect dauert, klare Zwischenmeldung. |
|
||||
|
||||
## Zustaende
|
||||
|
||||
| Zustand | Beschreibung | Umsetzung |
|
||||
|---|---|---|
|
||||
| Erfolgstext | Danke-/Bestaetigungsansicht. | Bauen |
|
||||
| Redirect | Nutzer wird weitergeleitet. | Bauen |
|
||||
|
||||
## Blockierende Error States
|
||||
|
||||
| Zustand | Was sieht der Nutzer? | Primaeraktion | Sekundare Aktion |
|
||||
|---|---|---|---|
|
||||
| Redirect-Ziel nicht erreichbar | Kurzer Fehler nach Submit, Einreichung bleibt erfolgreich. | Link erneut oeffnen | Anbieter kontaktieren |
|
||||
|
||||
## Permissions / Gates
|
||||
|
||||
- Keine Rolle.
|
||||
|
||||
## Subframe
|
||||
|
||||
https://app.subframe.com/f023064a5ca0/design/c06ecfc3-1f86-4dfe-9cfd-cec8b8629253/edit
|
||||
|
||||
## Notizen
|
||||
|
||||
Wichtig: Wenn Submit gespeichert wurde, darf ein kaputter Redirect nicht so wirken, als sei die Einreichung verloren.
|
||||
+115
@@ -0,0 +1,115 @@
|
||||
---
|
||||
kind: screen
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
package: WF-D-FORM Form Builder
|
||||
id: V02
|
||||
screen: Public Formular nicht verfuegbar
|
||||
typ: Public Blocker
|
||||
umsetzung: Bauen
|
||||
status: Subframe Draft / Review offen
|
||||
route: /f/{tenant}/{slug}
|
||||
subframe: "https://app.subframe.com/f023064a5ca0/design/f96ec12a-5e6a-471d-9a9c-6babcb57c74c/edit"
|
||||
---
|
||||
|
||||
# V02 - Public Formular nicht verfuegbar
|
||||
|
||||
## Ziel
|
||||
|
||||
Externe Nutzer landen nicht auf einem rohen 404/500, sondern bekommen eine ruhige, verstaendliche Meldung mit naechster Handlung.
|
||||
|
||||
## Pattern / Archetyp
|
||||
|
||||
BESPOKE-Public Blocker / A7 Public Error.
|
||||
|
||||
## Daten
|
||||
|
||||
- Tenant-Logo/Fallback, falls Tenant noch aufloesbar ist.
|
||||
- Kurzer Titel.
|
||||
- Klartext-Grund, soweit sicher:
|
||||
- Formular nicht veroeffentlicht
|
||||
- Formular archiviert
|
||||
- Formular geschlossen
|
||||
- Link ungueltig
|
||||
- Optionaler Kontakt-/Website-Link.
|
||||
|
||||
## Detail-Brainstorming
|
||||
|
||||
Dieser Zustand ersetzt rohe Fehlerseiten. Der Nutzer ist blockiert, deshalb braucht er eine ruhige Erklaerung und eine naechste Handlung.
|
||||
|
||||
### Blocker-Typen
|
||||
|
||||
| Zustand | Interner Grund | Public-Copy-Richtung | Primaeraktion |
|
||||
|---|---|---|---|
|
||||
| Nicht veroeffentlicht | `status=draft` oder `is_public=false` | "Dieses Formular ist aktuell nicht verfuegbar." | Anbieter kontaktieren oder zurueck |
|
||||
| Drchiviert | `status=archived` | "Dieses Formular ist nicht mehr aktiv." | Anbieter kontaktieren |
|
||||
| Geschlossen | `submission_close_at` vorbei | "Der Dnnahmezeitraum ist beendet." | Anbieter kontaktieren |
|
||||
| Limit erreicht | `submission_limit` erreicht | "Dieses Formular nimmt aktuell keine weiteren Einreichungen an." | Anbieter kontaktieren |
|
||||
| Link ungueltig | Tenant/Slug nicht gefunden | "Der Link ist ungueltig oder nicht mehr aktuell." | Link pruefen / Anbieter kontaktieren |
|
||||
| Tenant nicht aufloesbar | Tenant fehlt/gesperrt | Neutraler Fehler ohne interne Details. | Zurueck |
|
||||
|
||||
### Was David zeigen sollte
|
||||
|
||||
| Element | Notiz |
|
||||
|---|---|
|
||||
| Logo/Fallback | Nur wenn sicher, dass Tenant aufloesbar ist. |
|
||||
| Titel | Kurz, nicht alarmistisch. |
|
||||
| Klartext | Kein 404, kein Stacktrace, keine internen IDs. |
|
||||
| Kontakt/Zurueck | Nur wenn bekannt/konfiguriert. |
|
||||
| Erneut laden | Nur bei potentiell temporaeren Fehlern. |
|
||||
|
||||
### Nicht zeigen
|
||||
|
||||
- Kein interner Form-Name, wenn Link/Tenant unsicher ist.
|
||||
- Keine technischen Statuscodes.
|
||||
- Keine Aussage, ob ein bestimmter Kunde/Tenant existiert, falls das Datenschutz-/Security-riskant ist.
|
||||
|
||||
## Aktionen
|
||||
|
||||
- Zur Anbieter-Website zurueck.
|
||||
- Anbieter kontaktieren.
|
||||
- Erneut laden.
|
||||
|
||||
## Banner / Hinweise
|
||||
|
||||
- Keine technischen Details.
|
||||
- Keine Aussage, die interne Form-Namen oder IDs leakt.
|
||||
|
||||
## Toasts / Action-Feedback
|
||||
|
||||
- Keine Toasts.
|
||||
|
||||
## Meldungsentscheidung
|
||||
|
||||
| Ereignis | UI-Form | Blockiert? | Umsetzung | Copy/Notiz |
|
||||
|---|---|---|---|---|
|
||||
| Formular nicht veroeffentlicht | Screen | ja | Bauen | Dieses Formular ist aktuell nicht verfuegbar. |
|
||||
| Formular geschlossen | Screen | ja | Bauen | Dnnahmezeitraum ist beendet. |
|
||||
| Formular nicht gefunden | Screen | ja | Bauen | Link pruefen oder Anbieter kontaktieren. |
|
||||
| Tenant nicht aufloesbar | Screen | ja | Bauen | Neutral, ohne interne Details. |
|
||||
|
||||
## Zustaende
|
||||
|
||||
| Zustand | Beschreibung | Umsetzung |
|
||||
|---|---|---|
|
||||
| Nicht veroeffentlicht | Entwurf/Unpublished. | Bauen |
|
||||
| Drchiviert/geschlossen | Keine Einreichung mehr moeglich. | Bauen |
|
||||
| Nicht gefunden | Slug/Tenant passt nicht. | Bauen |
|
||||
|
||||
## Blockierende Error States
|
||||
|
||||
| Zustand | Was sieht der Nutzer? | Primaeraktion | Sekundare Aktion |
|
||||
|---|---|---|---|
|
||||
| Nicht verfuegbar | Ruhiger Public-Blocker. | Anbieter kontaktieren | Zurueck |
|
||||
|
||||
## Permissions / Gates
|
||||
|
||||
- Public Gate: `status=published` und `is_public=true`.
|
||||
|
||||
## Subframe
|
||||
|
||||
https://app.subframe.com/f023064a5ca0/design/f96ec12a-5e6a-471d-9a9c-6babcb57c74c/edit
|
||||
|
||||
## Notizen
|
||||
|
||||
Dieser Zustand ist wichtig fuer Vertrauen. Ein externes Formular darf nicht wie eine kaputte App wirken.
|
||||
+117
@@ -0,0 +1,117 @@
|
||||
---
|
||||
kind: screen
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
package: WF-D-FORM Form Builder
|
||||
id: V03
|
||||
screen: Public Captcha oder Submit Fehler
|
||||
typ: Public Error
|
||||
umsetzung: Bauen
|
||||
status: Subframe Draft / Review offen
|
||||
route: /f/{tenant}/{slug}
|
||||
subframe: "https://app.subframe.com/f023064a5ca0/design/95c96bc9-35d4-47ce-b510-7d8ea1f41936/edit"
|
||||
---
|
||||
|
||||
# V03 - Public Captcha oder Submit Fehler
|
||||
|
||||
## Ziel
|
||||
|
||||
Der Submitter kann einen Captcha- oder Submit-Fehler verstehen und korrigieren, ohne Vertrauen in das Formular zu verlieren.
|
||||
|
||||
## Pattern / Archetyp
|
||||
|
||||
BESPOKE-Public Error / A7 Error-State.
|
||||
|
||||
## Daten
|
||||
|
||||
- Aktuelle Feldwerte sollen erhalten bleiben, soweit technisch moeglich.
|
||||
- Captcha-Status.
|
||||
- Dllgemeiner Submit-Status.
|
||||
|
||||
## Detail-Brainstorming
|
||||
|
||||
V03 ist kein eigener neuer Flow, sondern ein Public-Fehlerzustand von S02. Er wird gebaut, weil die Copy und das Vertrauen wichtig sind.
|
||||
|
||||
### Fehlerarten
|
||||
|
||||
| Fehler | Ort | UI | Werte behalten? |
|
||||
|---|---|---|---|
|
||||
| Captcha fehlt | Captcha-Bereich | Inline-Hinweis | ja |
|
||||
| Captcha fehlgeschlagen | Captcha-Bereich oder Banner nah am Submit | Erneut pruefen | ja |
|
||||
| Netzwerkfehler | Submit-Bereich | Banner + Retry | ja |
|
||||
| Serverfehler vor Speicherung | Submit-Bereich | Banner + Retry | ja |
|
||||
| Serverfehler nach Speicherung | Success bevorzugen, falls Speicherung sicher war | Nicht als Verlust darstellen | ja |
|
||||
| Datei-Upload fehlgeschlagen | Datei-Feld | Inline + Datei erneut waehlen | andere Werte ja |
|
||||
|
||||
### Copy-Richtung
|
||||
|
||||
| Zustand | Copy |
|
||||
|---|---|
|
||||
| Captcha fehlt | "Bitte bestaetigen Sie die Sicherheitspruefung." |
|
||||
| Captcha fehlgeschlagen | "Die Sicherheitspruefung konnte nicht bestaetigt werden. Bitte versuchen Sie es erneut." |
|
||||
| Submit Fehler | "Das Formular konnte gerade nicht gesendet werden. Bitte versuchen Sie es erneut." |
|
||||
| Wiederholter Fehler | "Wenn der Fehler bestehen bleibt, kontaktieren Sie bitte den Anbieter." |
|
||||
| Datei-Fehler | "Diese Datei konnte nicht hochgeladen werden. Bitte pruefen Sie Typ und Groesse." |
|
||||
|
||||
### Retry-Regeln
|
||||
|
||||
| Regel | Grund |
|
||||
|---|---|
|
||||
| Eingaben erhalten | Lange Public-Formulare duerfen nicht neu ausgefuellt werden muessen. |
|
||||
| Submit waehrend Retry sperren | Doppel-Submit verhindern. |
|
||||
| Ersten Fehler sichtbar machen | Nutzer soll nicht suchen muessen. |
|
||||
| Technische Details verstecken | Vertrauen bewahren. |
|
||||
| Kontakt nur als Fallback | Nicht sofort vom Formular wegschicken. |
|
||||
|
||||
## Aktionen
|
||||
|
||||
- Captcha erneut bestaetigen.
|
||||
- Formular erneut senden.
|
||||
- Seite neu laden.
|
||||
- Anbieter kontaktieren, falls Fehler bleibt.
|
||||
|
||||
## Banner / Hinweise
|
||||
|
||||
- Captcha-Fehler in der Naehe des Captcha-Bereichs.
|
||||
- Submit-Fehler als Banner oberhalb des Submit-Bereichs.
|
||||
- Keine internen Begriffe wie ActionLog, Webhook, DB oder Queue.
|
||||
|
||||
## Toasts / Action-Feedback
|
||||
|
||||
- Keine Toasts im Public UI.
|
||||
|
||||
## Meldungsentscheidung
|
||||
|
||||
| Ereignis | UI-Form | Blockiert? | Umsetzung | Copy/Notiz |
|
||||
|---|---|---|---|---|
|
||||
| Captcha fehlt | Inline beim Captcha | ja | Bauen | Bitte bestaetigen, dass Sie kein automatisierter Zugriff sind. |
|
||||
| Captcha fehlgeschlagen | Inline/Banner | ja | Bauen | Bitte erneut versuchen. |
|
||||
| Netzwerkfehler beim Submit | Banner | ja | Bauen | Einreichung konnte nicht gesendet werden. |
|
||||
| Serverfehler nach Submit | Banner | ja | Bauen | Keine technischen Details, erneut versuchen. |
|
||||
|
||||
## Zustaende
|
||||
|
||||
| Zustand | Beschreibung | Umsetzung |
|
||||
|---|---|---|
|
||||
| Captcha Error | Bot-Schutz blockiert. | Bauen |
|
||||
| Submit Error | Speicherung/Einreichung klappt nicht. | Bauen |
|
||||
| Retry Loading | Nutzer sendet erneut. | Wiederverwenden |
|
||||
|
||||
## Blockierende Error States
|
||||
|
||||
| Zustand | Was sieht der Nutzer? | Primaeraktion | Sekundare Aktion |
|
||||
|---|---|---|---|
|
||||
| Captcha fehlgeschlagen | Fehler am Captcha. | Captcha erneut pruefen | - |
|
||||
| Submit mehrfach fehlgeschlagen | Banner mit Hilfehinweis. | Erneut versuchen | Anbieter kontaktieren |
|
||||
|
||||
## Permissions / Gates
|
||||
|
||||
- Public. Kein Login.
|
||||
|
||||
## Subframe
|
||||
|
||||
https://app.subframe.com/f023064a5ca0/design/95c96bc9-35d4-47ce-b510-7d8ea1f41936/edit
|
||||
|
||||
## Notizen
|
||||
|
||||
Wenn moeglich, sollen eingegebene Antworten erhalten bleiben. Das ist besonders wichtig bei langen SHK-Dufnahmeformularen mit Fotos oder Text.
|
||||
@@ -0,0 +1,87 @@
|
||||
{
|
||||
"nodes":[
|
||||
{"id":"group-states","type":"group","x":-120,"y":220,"width":4340,"height":680,"label":"Dokumentierte ADV-S01-Zustaende / Was-passiert-wenn-Cases"},
|
||||
{"id":"group-internal","type":"group","x":-120,"y":-520,"width":3100,"height":600,"label":"S01 Interner Builder Hauptflow"},
|
||||
{"id":"group-public","type":"group","x":-120,"y":1060,"width":2460,"height":620,"label":"Public Form Flow"},
|
||||
{"id":"group-simple","type":"group","x":-120,"y":1840,"width":4380,"height":1120,"label":"Neue Simple Builder Alternative"},
|
||||
{"id":"group-notes","type":"group","x":3220,"y":-520,"width":1000,"height":600,"label":"Scope / Subframe-Fokus"},
|
||||
{"id":"package","type":"file","file":"02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/WF-D-FORM Form Builder.md","x":0,"y":-350,"width":420,"height":210},
|
||||
{"id":"s01","type":"file","file":"02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/90 ADV Form-Builder Canvas.md","x":620,"y":-350,"width":420,"height":210},
|
||||
{"id":"d10","type":"file","file":"02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/D10 Builder Interaktionsfaelle.md","x":1860,"y":-350,"width":460,"height":210},
|
||||
{"id":"note-subframe-focus","type":"text","text":"# Subframe-Fokus\n\nAktueller Hauptfluss:\n- 01 S00 Verwaltung\n- 02/03 Empty States\n- 04 S01 Formularart\n- 05 S02 Haupt-Editor\n- 06 S03 Design\n- 07-10 Public Form/States\n- 11-13 Antworten/States\n\n80-93 bleiben spaeter/Referenz.\n\nM01/M02/M03/M04 und D10 bleiben dokumentiert.","x":3360,"y":-360,"width":720,"height":330},
|
||||
{"id":"note-out-of-scope","type":"text","text":"# Nicht in D-FORM\n\n- Vollstaendige Submissions-Verwaltung\n- Submission-Detail\n- Booking\n- Kalender\n- Signatur\n- HR-Screens\n- Personalisierte Links\n- JS-Snippet\n\nS03 ist nur die schlanke Formular-Zentrale, nicht das ganze Forms-/Submissions-Modul.","x":3360,"y":-20,"width":720,"height":300},
|
||||
{"id":"d01","type":"file","file":"02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/D01 Sharing Panel URL QR iFrame.md","x":0,"y":360,"width":420,"height":190},
|
||||
{"id":"note-states","type":"text","text":"# ADV-S01-Zustaende\n\nD07, D08 und D09 sind als zusaetzliche Subframe-Zustaende gebaut.\n\nDie restlichen D-/M-Zustaende bleiben dokumentiert.\n\nSie klaeren:\n- welche UI-Ebene oeffnet\n- was im Dropdown/Popover/Modal steht\n- welche Folgefehler entstehen\n- was Publish/Test blockiert","x":3120,"y":330,"width":540,"height":260},
|
||||
{"id":"note-builder-core","type":"text","text":"# Builder-Kern\n\nDauerhaft sichtbar:\n- Header / Status\n- Feld-Palette\n- Canvas\n- Feld-Inspector\n\nArbeitsmodi:\n- Logic\n- Actions\n- Sharing\n- Preview\n- Settings","x":1240,"y":-365,"width":420,"height":260},
|
||||
{"id":"d02","type":"file","file":"02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/D02 Post-Submit Actions.md","x":520,"y":360,"width":420,"height":190},
|
||||
{"id":"d03","type":"file","file":"02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/D03 Conditional Logic Editor.md","x":1040,"y":360,"width":420,"height":190},
|
||||
{"id":"d06","type":"file","file":"02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/D06 Feldkarten Menue.md","x":1560,"y":360,"width":420,"height":190},
|
||||
{"id":"m01","type":"file","file":"02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/M01 Feld loeschen Confirm.md","x":2080,"y":360,"width":420,"height":190},
|
||||
{"id":"d07","type":"file","file":"02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/91 D07 Logic Regel Detail.md","x":1040,"y":620,"width":420,"height":190},
|
||||
{"id":"d08","type":"file","file":"02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/92 D08 Action Detail mit Mapping.md","x":520,"y":620,"width":420,"height":190},
|
||||
{"id":"d09","type":"file","file":"02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/93 D09 Publish Blocker Summary.md","x":2600,"y":360,"width":420,"height":190},
|
||||
{"id":"m02","type":"file","file":"02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/M02 Unpublish Confirm.md","x":2600,"y":620,"width":420,"height":190},
|
||||
{"id":"m03","type":"file","file":"02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/M03 Archive Confirm.md","x":3120,"y":620,"width":420,"height":190},
|
||||
{"id":"m04","type":"file","file":"02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/M04 Unsaved Changes Confirm.md","x":3640,"y":620,"width":420,"height":190},
|
||||
{"id":"s02","type":"file","file":"02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/07 S04 Oeffentliches Formular.md","x":0,"y":1250,"width":420,"height":210},
|
||||
{"id":"v01","type":"file","file":"02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/08 V01 Public Erfolg oder Redirect.md","x":620,"y":1120,"width":420,"height":210},
|
||||
{"id":"v02","type":"file","file":"02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/09 V02 Public Formular nicht verfuegbar.md","x":620,"y":1410,"width":420,"height":210},
|
||||
{"id":"v03","type":"file","file":"02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/10 V03 Public Captcha oder Submit Fehler.md","x":1240,"y":1410,"width":420,"height":210},
|
||||
{"id":"note-public","type":"text","text":"# Public-Regel\n\nKeine App-Shell.\n\nRuhiges Kundenformular:\n- Branding-Kopf\n- Intro\n- Felder\n- mCaptcha\n- Submit\n- Success/Error\n\nMobile zuerst mitdenken.","x":1240,"y":1120,"width":420,"height":250},
|
||||
{"id":"note-public-reuse","type":"text","text":"# Public Renderer\n\nD-FORM baut das Public Form.\n\nDndere Bereiche wie HR oder Booking koennen den Renderer spaeter wiederverwenden, sind aber keine D-FORM-Screens.","x":1800,"y":1230,"width":420,"height":240},
|
||||
{"id":"simple-direction","type":"file","file":"02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Simple Builder Neuausrichtung.md","x":0,"y":1990,"width":420,"height":190},
|
||||
{"id":"s00","type":"file","file":"02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/04 S01 Formularart auswaehlen.md","x":560,"y":1990,"width":420,"height":190},
|
||||
{"id":"s01a","type":"file","file":"02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/05 S02 Einfacher Fragen Editor.md","x":1120,"y":1900,"width":420,"height":190},
|
||||
{"id":"s01b","type":"file","file":"02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/80 S01B Gefuehrter Fragen Editor.md","x":1120,"y":2120,"width":420,"height":190},
|
||||
{"id":"s01c","type":"file","file":"02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/81 S01C Website Formular Editor.md","x":1680,"y":1840,"width":420,"height":190},
|
||||
{"id":"s01d","type":"file","file":"02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/82 S01D Umfrage Editor.md","x":1680,"y":2060,"width":420,"height":190},
|
||||
{"id":"s01e","type":"file","file":"02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/83 S01E Internes Formular Editor.md","x":1680,"y":2280,"width":420,"height":190},
|
||||
{"id":"note-simple-builder","type":"text","text":"# Neue Richtung gebaut\n\nNicht mehr sofort Profi-Canvas.\n\nS00 ist die Formular-Zentrale.\nS01 fuehrt immer in S02.\n\nDie Formularart setzt nur Vorlage/Startfragen:\n- Website/Extern\n- Lead\n- Umfrage\n- Intern\n\nTabs im Formular:\n- Fragen\n- Design: S03\n- Antworten: S05\n\nS01B/C/D/E sind Referenz.\n\nLogic bleibt als einfache Bedingung an der Frage.\nActions bleiben als Lead-Hinweis/Automatik.","x":2320,"y":1990,"width":620,"height":420},
|
||||
{"id":"s03","type":"file","file":"02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/01 S00 Formulare verwalten.md","x":560,"y":2470,"width":420,"height":190},
|
||||
{"id":"s04","type":"file","file":"02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/06 S03 Formular Design.md","x":2320,"y":2440,"width":420,"height":190},
|
||||
{"id":"s05","type":"file","file":"02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/11 S05 Antworten Tabelle.md","x":2840,"y":2440,"width":420,"height":190}
|
||||
],
|
||||
"edges":[
|
||||
{"id":"edge-package-s01","fromNode":"package","fromSide":"right","toNode":"s01","toSide":"left","label":"S01"},
|
||||
{"id":"edge-s01-core","fromNode":"s01","fromSide":"right","toNode":"note-builder-core","toSide":"left","label":"Arbeitsbereiche"},
|
||||
{"id":"edge-core-d10","fromNode":"note-builder-core","fromSide":"right","toNode":"d10","toSide":"left","label":"Was passiert wenn"},
|
||||
{"id":"edge-s01-d01","fromNode":"s01","fromSide":"bottom","toNode":"d01","toSide":"top","label":"Share"},
|
||||
{"id":"edge-s01-d02","fromNode":"s01","fromSide":"bottom","toNode":"d02","toSide":"top","label":"Actions"},
|
||||
{"id":"edge-s01-d03","fromNode":"s01","fromSide":"bottom","toNode":"d03","toSide":"top","label":"Logic"},
|
||||
{"id":"edge-s01-d06","fromNode":"s01","fromSide":"bottom","toNode":"d06","toSide":"top","label":"Feldmenue"},
|
||||
{"id":"edge-d06-m01","fromNode":"d06","fromSide":"right","toNode":"m01","toSide":"left","label":"loeschen"},
|
||||
{"id":"edge-d03-d07","fromNode":"d03","fromSide":"bottom","toNode":"d07","toSide":"top","label":"Regel Detail"},
|
||||
{"id":"edge-d02-d08","fromNode":"d02","fromSide":"bottom","toNode":"d08","toSide":"top","label":"Action Detail"},
|
||||
{"id":"edge-s01-d09","fromNode":"s01","fromSide":"bottom","toNode":"d09","toSide":"top","label":"Publish"},
|
||||
{"id":"edge-d09-m02","fromNode":"d09","fromSide":"bottom","toNode":"m02","toSide":"top","label":"Unpublish"},
|
||||
{"id":"edge-s01-m03","fromNode":"s01","fromSide":"bottom","toNode":"m03","toSide":"top","label":"Archive"},
|
||||
{"id":"edge-s01-m04","fromNode":"s01","fromSide":"bottom","toNode":"m04","toSide":"top","label":"Dirty State"},
|
||||
{"id":"edge-d10-d07","fromNode":"d10","fromSide":"bottom","toNode":"d07","toSide":"top","label":"Logic Cases"},
|
||||
{"id":"edge-d10-d08","fromNode":"d10","fromSide":"bottom","toNode":"d08","toSide":"top","label":"Mapping Cases"},
|
||||
{"id":"edge-d10-d09","fromNode":"d10","fromSide":"bottom","toNode":"d09","toSide":"top","label":"Blocker Cases"},
|
||||
{"id":"edge-s01-s02","fromNode":"s01","fromSide":"bottom","toNode":"s02","toSide":"top","label":"publish + share"},
|
||||
{"id":"edge-s02-v01","fromNode":"s02","fromSide":"right","toNode":"v01","toSide":"left","label":"Submit ok"},
|
||||
{"id":"edge-s02-v02","fromNode":"s02","fromSide":"right","toNode":"v02","toSide":"left","label":"nicht verfuegbar"},
|
||||
{"id":"edge-s02-v03","fromNode":"s02","fromSide":"right","toNode":"v03","toSide":"left","label":"Fehler"},
|
||||
{"id":"edge-s02-public","fromNode":"s02","fromSide":"right","toNode":"note-public","toSide":"left","label":"Public-UX"},
|
||||
{"id":"edge-public-reuse","fromNode":"note-public","fromSide":"right","toNode":"note-public-reuse","toSide":"left","label":"Reuse"},
|
||||
{"id":"edge-focus-out","fromNode":"note-subframe-focus","fromSide":"bottom","toNode":"note-out-of-scope","toSide":"top","label":"Grenzen"},
|
||||
{"id":"edge-package-simple","fromNode":"package","fromSide":"bottom","toNode":"simple-direction","toSide":"top","label":"neue Richtung"},
|
||||
{"id":"edge-simple-s00","fromNode":"simple-direction","fromSide":"right","toNode":"s00","toSide":"left","label":"Einstieg"},
|
||||
{"id":"edge-s00-s01a","fromNode":"s00","fromSide":"right","toNode":"s01a","toSide":"left","label":"Variante D"},
|
||||
{"id":"edge-s00-s01b","fromNode":"s00","fromSide":"right","toNode":"s01b","toSide":"left","label":"Variante B"},
|
||||
{"id":"edge-s00-s01c","fromNode":"s00","fromSide":"right","toNode":"s01c","toSide":"left","label":"Website"},
|
||||
{"id":"edge-s00-s01d","fromNode":"s00","fromSide":"right","toNode":"s01d","toSide":"left","label":"Umfrage"},
|
||||
{"id":"edge-s00-s01e","fromNode":"s00","fromSide":"right","toNode":"s01e","toSide":"left","label":"Intern"},
|
||||
{"id":"edge-simple-s03","fromNode":"simple-direction","fromSide":"right","toNode":"s03","toSide":"left","label":"Verwaltung"},
|
||||
{"id":"edge-s03-s00","fromNode":"s03","fromSide":"top","toNode":"s00","toSide":"bottom","label":"Neues Formular"},
|
||||
{"id":"edge-s03-s01a","fromNode":"s03","fromSide":"right","toNode":"s01a","toSide":"bottom","label":"Bearbeiten"},
|
||||
{"id":"edge-s01a-s04","fromNode":"s01a","fromSide":"right","toNode":"s04","toSide":"left","label":"Design"},
|
||||
{"id":"edge-s01a-s05","fromNode":"s01a","fromSide":"right","toNode":"s05","toSide":"left","label":"Antworten"},
|
||||
{"id":"edge-s01a-note","fromNode":"s01a","fromSide":"right","toNode":"note-simple-builder","toSide":"left","label":"Prinzip"},
|
||||
{"id":"edge-s01b-note","fromNode":"s01b","fromSide":"right","toNode":"note-simple-builder","toSide":"left","label":"Prinzip"},
|
||||
{"id":"edge-s01c-note","fromNode":"s01c","fromSide":"right","toNode":"note-simple-builder","toSide":"left","label":"Beispiel"},
|
||||
{"id":"edge-s01d-note","fromNode":"s01d","fromSide":"right","toNode":"note-simple-builder","toSide":"left","label":"Beispiel"},
|
||||
{"id":"edge-s01e-note","fromNode":"s01e","fromSide":"right","toNode":"note-simple-builder","toSide":"left","label":"Beispiel"}
|
||||
]
|
||||
}
|
||||
@@ -0,0 +1,571 @@
|
||||
---
|
||||
kind: wireframe-package
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
package: WF-D-FORM Form Builder
|
||||
typ: Flow
|
||||
status: Review-ready / Subframe Draft gebaut
|
||||
subframe: "https://app.subframe.com/f023064a5ca0/flow/afb1c257-46f0-4b23-aaed-d75f4773f1a9/edit?tab=ai&conversationId=02d948da-f9aa-4ab5-8352-2745789bb9ad"
|
||||
canvas: "02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/WF-D-FORM Form Builder.canvas"
|
||||
---
|
||||
|
||||
# WF-D-FORM Form Builder
|
||||
|
||||
Status: Review-ready fuer David / Subframe Draft gebaut
|
||||
Subframe-Link: https://app.subframe.com/f023064a5ca0/flow/afb1c257-46f0-4b23-aaed-d75f4773f1a9/edit?tab=ai&conversationId=02d948da-f9aa-4ab5-8352-2745789bb9ad
|
||||
Canvas: [[WF-D-FORM Form Builder.canvas]]
|
||||
David-Review: [[David Review Checkliste]]
|
||||
Subframe-Bauplan: [[Subframe Bauplan]]
|
||||
Subframe-Bau-Log: [[Subframe Bau Log]]
|
||||
Simple Builder: [[Simple Builder Neuausrichtung]]
|
||||
Stand: 2026-07-09
|
||||
Uebergabe: [[D-FORM David Uebergabe 2026-07-09]]
|
||||
Start fuer Review: [[00 Start hier - David]]
|
||||
|
||||
---
|
||||
|
||||
## 1. Kurzfassung
|
||||
|
||||
Dieses Paket bereitet `D-FORM` fuer David vor: den internen Form-Builder-Canvas und das oeffentliche Formular.
|
||||
|
||||
Der Fokus liegt bewusst auf den zwei Bespoke-Erlebnissen:
|
||||
|
||||
- Form-Builder-Canvas fuer interne Nutzer
|
||||
- Oeffentliches Formular fuer externe Submitter
|
||||
|
||||
Fuer den eigentlichen Subframe-Bau gilt [[Subframe Bauplan]] als konkrete Bau-Reihenfolge und Komponenten-Zuordnung. Interne Builder-Screens wie S01/D07/D08/D09 nutzen das vorhandene Default Page Layout; keine eigene Sidebar oder Header-Navigation nachbauen. Public-Screens bleiben ohne App-Shell.
|
||||
|
||||
Die vollstaendige Forms-/Submissions-Verwaltung, Booking, Kalender und Signatur werden nicht in diesem Paket gebaut. Als schlanker Einstieg wurde aber S00 `Formulare verwalten` ergaenzt, damit Nutzer vorhandene Formulare finden und in den Builder springen koennen.
|
||||
|
||||
**Wichtig:** Dieses Paket ist jetzt ein tragfaehiger Detail-Brainstorming-Entwurf fuer David. Davids Review vom 2026-07-06 hat den fachlichen Scope bestaetigt, aber fuer den Builder mehr Interaktionslogik verlangt. Diese "was passiert nach Klick?"-Ebene ist im Advanced-Builder nachgezogen. D-FORM ist in Subframe als Draft gebaut: S00 bis S05, die Public-Screens S04/V01/V02/V03 sowie D07 Logic Regel Detail, D08 Action Detail mit Mapping und D09 Publish Blocker Summary sind gebaut.
|
||||
|
||||
Vor einer echten Fertig-Markierung muss David die Subframe-Frames final reviewen. Danach koennen nur noch gezielte Korrekturen oder explizit nachgeforderte Zustands-/Modalframes folgen.
|
||||
|
||||
**Nachtrag 2026-07-07:** Fuer Handwerksbetriebe wirkt der bisherige S01 fachlich stark, aber zu komplex. Deshalb wurden einfachere Alternativen gebaut: zuerst [[Screens/01 S00 Formulare verwalten|S00 Formulare verwalten]] als Startseite, danach [[Screens/04 S01 Formularart auswaehlen|S01 Formularart auswaehlen]] und Google-Forms-artige Beispiel-Editoren je Formularart. Gebaute Varianten: [[Screens/05 S02 Einfacher Fragen Editor|S02 Einfacher Fragen Editor]], [[Screens/80 S01B Gefuehrter Fragen Editor|S01B Gefuehrter Fragen Editor]], [[Screens/81 S01C Website Formular Editor|S01C Website Formular Editor]], [[Screens/82 S01D Umfrage Editor|S01D Umfrage Editor]] und [[Screens/83 S01E Internes Formular Editor|S01E Internes Formular Editor]]. Ergaenzt wurden ausserdem [[Screens/06 S03 Formular Design|S03 Formular Design]] und [[Screens/11 S05 Antworten Tabelle|S05 Antworten Tabelle]]. Die bisherige Logic bleibt im Hintergrund erhalten, aber der Einstieg soll nicht mehr wie ein Profi-Builder wirken.
|
||||
|
||||
**Nachtrag 2026-07-08:** Die Simple-Builder-Richtung wurde nachgeschaerft: S00 nutzt Mehrfachfilter nach Status und Art, S02 hat mehrere editierbare Optionen und eine erweiterte Google-Forms-nahe Werkzeugleiste, S04 enthaelt eine Datenschutz-Checkbox, S03/S05 haben keinen eigenen Teilen-Tab mehr und S05 dient nur Antworten/Export.
|
||||
|
||||
**Nachtrag Lead-Zuweisung 2026-07-08:** David hat ergaenzt, dass Lead-Formulare einen sichtbaren Bereich `Felder zuweisen` brauchen. Deshalb bleibt S02 der einfache Haupteditor, bekommt aber den neuen Zustand [[Screens/05b S02L Lead Felder zuweisen|S02L Lead Felder zuweisen]]. Wenn eine Zuweisung fehlt oder nicht moeglich ist, greift optional [[Screens/05c E05 S02 Lead Zuweisung pruefen|E05 S02 Lead Zuweisung pruefen]]. Logic und Actions kommen damit in den Screen: `Bedingung` an der Frage, `Nach Absenden / Lead anlegen` als Card mit Dropdown-Zuweisung.
|
||||
|
||||
**Nachtrag 2026-07-09:** Fuer Davids Review wurde ein kompletter Obsidian-faehiger Paketordner vorbereitet. Die aktuelle Uebergabe liegt in [[D-FORM David Uebergabe 2026-07-09]]. Die S02/S02L-Lead-Hinweise sind optisch an die gruene `Lead anlegen`-Card angeglichen: Icon links, Titel/Badge/Beschreibung in der Mitte, Aktion rechts.
|
||||
|
||||
---
|
||||
|
||||
## 2. Intent Check
|
||||
|
||||
| Frage | Antwort |
|
||||
|---|---|
|
||||
| Welches Ticket/Modul ist betroffen? | `D-FORM` / P16 / M05 Form Builder |
|
||||
| Was soll der Nutzer am Ende schaffen? | Interne Nutzer bauen und veroeffentlichen Formulare; externe Nutzer reichen ein Formular sauber ein. |
|
||||
| Ist es ein Flow, einzelner Screen, Zustand oder nur Dokumentation? | Bespoke-Flow mit zwei Hauptscreens und wenigen Public-Varianten. |
|
||||
| Welche Planning-Quellen wurden geprueft? | `D-FORM.md`, `P16-kalender-booking-forms-signatur.md`, `M05-form-builder.md`, `ENTITY-MODEL.md` Domaene 9, `SCREEN-MAP.md` Paragraph 3, `DESIGNER-FIRST-PLAYBOOK.md` Rang 2, `ROADMAP.md` Phase 16. |
|
||||
| Was ist sicher im Scope? | Drag-and-Drop-Builder, 12 Feldtypen, Conditional Logic, Field-Config, Live-Vorschau, Publish, URL/QR/iFrame-Sharing, Post-Submit-Actions, Public Form mit mCaptcha und 4 Zustaenden. |
|
||||
| Was ist sicher nicht im Scope? | Booking-Page, Kalender, vollstaendige Submissions-Liste, Signatur-Wizard, personalisierte Links, JS-Snippet, Multi-Step-Forms, Repeater, A/B-Testing. S00 ist nur die schlanke Formular-Zentrale, nicht das komplette Submissions-Modul. |
|
||||
| Gibt es Admin/Normalrolle-Unterschiede? | Ja: Builder/Publisher/Admin duerfen bauen und publishen; einfache Nutzer sehen ggf. nur Submission-/Basic-Rechte. |
|
||||
| Welche Annahmen sind noch unsicher? | Ob David einzelne dokumentierte Zustands-/Modalframes aus S01 zusaetzlich in Subframe sehen will. |
|
||||
|
||||
---
|
||||
|
||||
## 3. Scope
|
||||
|
||||
| Punkt | Inhalt |
|
||||
|---|---|
|
||||
| Ticket/Modul | `D-FORM` / M05 Form Builder |
|
||||
| Nutzerrolle | Interner Builder/Publisher/Admin; externer Submitter im Public Form. |
|
||||
| Admin-Variante | Darf Form konfigurieren, Actions anlegen, publishen, Sharing nutzen. |
|
||||
| Normale Rolle | Kann je nach Permission eventuell Formular bearbeiten oder nur Submissions sehen; Submissions sind nicht Teil dieses Pakets. |
|
||||
| Startpunkt | Intern: `/forms/:id/edit`; Public: `/f/{tenant}/{slug}` |
|
||||
| Ziel | Formulare robust bauen, veroeffentlichen und extern einreichbar machen. |
|
||||
| Haupt-Archetyp | A4 Form/Input-Kit + A7 Zustands-Kit |
|
||||
| Bespoke-Anteil | Sehr hoch: Canvas, Drag-and-Drop, Conditional Logic, Live Preview, Public Renderer. |
|
||||
| Out of scope | Booking/Kalender/Signatur, Submission-Detail, personalisierte Links/JS-Snippet, komplexe v2-Logic. |
|
||||
|
||||
---
|
||||
|
||||
## 3a. Detailausbau vor Fertig
|
||||
|
||||
Diese Punkte fehlen noch, bevor D-FORM wirklich als fertig vorbereitet gelten sollte:
|
||||
|
||||
| Bereich | Was noch auszuarbeiten ist | Warum wichtig |
|
||||
|---|---|---|
|
||||
| Builder-Layout | Entscheidung fuer Canvas-Aufbau: Drei-Spalten, Tabs, Drawer, Preview-Mode, Mobile/Small-Viewport-Verhalten. | Der Builder ist die schwerste UI im Ticket. |
|
||||
| Drag-and-Drop | Empty Dropzone, Drag Preview, Reorder, Drop zwischen Feldern, Feld-Auswahl, Undo/Cancel-Gefuehl. | Sonst bleibt der Canvas zu abstrakt. |
|
||||
| Feldtypen | Properties je Feldtyp, Sonderfaelle fuer Datei/Foto, Datum/Datum-Range, Select/Multi-Select, Boolean. | David braucht konkrete Inspector-Inhalte. |
|
||||
| Validation | Required, min/max, Regex, Datei-Typen/Groesse, Custom Error, Publish-Blocker. | Das Ticket verlangt Klartext-Validation. |
|
||||
| Conditional Logic | Regel-Liste, Regel-Editor, kaputte Referenzen, Vorschau/Test, Limits fuer v1. | Pflicht laut Ticket, aber UX-riskant. |
|
||||
| Form-Stammdaten | Name, Beschreibung, Slug, Status, Subtype, Success Message, Redirect, Close/Limit. | M05-Datenmodell ist groesser als nur Felder. |
|
||||
| Templates | SHK-Templates sichtbar machen oder bewusst nur als Forms-Liste/Seed dokumentieren. | Ticket nennt geseedete Templates. |
|
||||
| Publish / Unpublish | Publish-Flow, Blocker, Warnungen bei bereits oeffentlichem Formular, Unpublish-Folge. | Kritischer Arbeitsmoment fuer interne Nutzer. |
|
||||
| Sharing / Embed | URL, QR, iFrame-Code, Copy-Feedback, Allowed Origins, v2-Abgrenzung JS-Snippet/personalisierte Links. | Public-Verteilung ist Teil von D-FORM. |
|
||||
| Post-Submit-Actions | Action-Typen, Reihenfolge, Mapping-Zeilen, Pflichtmapping, Test/Preview, einfache Filter. | Sehr grosser Komplex im Builder. |
|
||||
| Public Form | 4 Public-Zustaende, Mobile, mCaptcha, Datei-Upload, Success/Redirect, nicht verfuegbar. | Oeffentliche Screens brauchen hohen Polish. |
|
||||
| Permissions | Builder, Publisher, Admin, Read-only/No-Permission-Zustand. | D-FORM hat eigene Permission-Bundles. |
|
||||
| Abgrenzung | Was bleibt in D-FORM, was gehoert zu Submissions, Forms-Liste, D-BOOK, D-REST oder v2. | Verhindert Scope-Explosion. |
|
||||
|
||||
Empfehlung fuer die naechste Arbeitseinheit: David validiert die nachgezogene S01-Interaktionslogik. Danach kann Subframe-Bau oder letzte Korrektur erfolgen.
|
||||
|
||||
---
|
||||
|
||||
## 3b. SCREEN-MAP-Abgleich
|
||||
|
||||
Die `SCREEN-MAP.md` enthaelt deutlich mehr Screens, aber sie ist die Gesamt-Bauliste fuer HiveGrid v1. Fuer `D-FORM` zaehlen daraus nur die Form-Builder-bezogenen Zeilen.
|
||||
|
||||
| SCREEN-MAP-Screen | Gehoert zu D-FORM? | Umgang |
|
||||
|---|---|---|
|
||||
| Form-Builder-Canvas `/forms/:id/edit` | ja | In diesem Paket als S01 ausarbeiten. |
|
||||
| Oeffentliches Formular `/f/{tenant}/{slug}` | ja | In diesem Paket als S04 plus Public-Varianten ausarbeiten. |
|
||||
| Submissions `/forms/:id/submissions` | nein, Forms-Compose | Nicht D-FORM-Bespoke; spaeter eigenes Compose-/Submissions-Paket. |
|
||||
| Forms-Liste `/forms` | teilweise | S00 als schlanke Formular-Zentrale im D-FORM-Paket; vollstaendige Forms-/Submissions-Compose bleibt spaeter. |
|
||||
| Booking-Page `/b/{tenant}/{slug}` | nein | Eigenes Ticket/Paket `D-BOOK`. |
|
||||
| Booking intern / Booking-Page-Editor / Verfuegbarkeit | nein | Eigenes Booking-Paket. |
|
||||
| Kalender `/calendar` | nein | Eigenes Kalender-Paket. |
|
||||
| Signatur-Wizard | nein | Eigenes Signatur-/D-REST-Paket. |
|
||||
| HR Urlaub/Krankmeldung, Requests, Surveys | nein | HR nutzt M05/Form-Renderer wieder, ist aber nicht D-FORM. |
|
||||
| Kampagnen-Editor, Kampagnen-Liste, Segmente, Sender | nein | Email-Marketing-Paket, nicht D-FORM. |
|
||||
| Pipeline-Kanban, Projekt-Liste, Projekt-Detail, Pipeline-Config | nein | Projekt/Pipeline-Paket, nicht D-FORM. |
|
||||
| Plattform-Admin-Screens | nein | Plattform-Admin-Paket, nicht D-FORM. |
|
||||
|
||||
Merksatz: D-FORM hat wenige eigene Routen, aber einen riesigen Detailumfang innerhalb des Builder-Screens und des Public-Renderers.
|
||||
|
||||
---
|
||||
|
||||
## 3c. Detailausbau-Fortschritt
|
||||
|
||||
| Bereich | Stand | Naechster Schritt |
|
||||
|---|---|---|
|
||||
| ADV-S01 Builder-Layout | Arbeitsentwurf in ADV-S01 ergaenzt und als Subframe-Frame gebaut. | David prueft Drei-Zonen-Builder in Subframe. |
|
||||
| ADV-S01 Feld-Palette | Arbeitsentwurf in ADV-S01 ergaenzt. | Entscheiden, ob Content Blocks wie Section Header in v1 sichtbar werden. |
|
||||
| ADV-S01 Canvas / Drag-and-Drop | Arbeitsentwurf in ADV-S01 ergaenzt. | Drag-Zustaende ggf. in Subframe besonders sichtbar machen. |
|
||||
| ADV-S01 Feld-Inspector | Arbeitsentwurf in ADV-S01 ergaenzt. | Properties je Feldtyp reviewen. |
|
||||
| ADV-S01 Interaktionslogik | Nach David-Feedback ergaenzt und als Zustandsdateien ausgearbeitet. D07/D08/D09 sind als zusaetzliche Subframe-Zustaende gebaut. | David prueft die Subframe-Frames und entscheidet nur noch ueber Feinschliff oder Zusatzframes. |
|
||||
| ADV-S01 Validation / Publish | Arbeitsentwurf in ADV-S01 ergaenzt und als D09 gebaut. | David prueft Blocker-Copy, Warnungen und Sprungziele. |
|
||||
| ADV-S01 Conditional Logic | Arbeitsentwurf in ADV-S01 ergaenzt. | V1-Grenzen final bestaetigen. |
|
||||
| ADV-S01 Sharing | Arbeitsentwurf in ADV-S01 ergaenzt. | iFrame/QR/URL-Darstellung finalisieren. |
|
||||
| ADV-S01 Post-Submit-Actions | Arbeitsentwurf in ADV-S01 ergaenzt. | Action-Typen und Mapping-Tiefe final reviewen. |
|
||||
| ADV-S01 Permissions | Arbeitsentwurf in ADV-S01 ergaenzt. | Read-only/No-Permission-Zustand final entscheiden. |
|
||||
| S04 Public Form | Arbeitsentwurf in S04 ergaenzt. | David validiert Public Layout, Mobile, Submit und Branding. |
|
||||
| V01/V02/V03 Public-Varianten | Arbeitsentwurf in Varianten ergaenzt. | David validiert Copy und Public-Fehlerlogik. |
|
||||
| Canvas/Tracker/Handoff | Nach P2-Auth-Referenz synchronisiert: Hauptflow plus ADV-S01-Zustaende/Case-Matrix im Canvas sichtbar. | Vor Subframe nur noch David-Freigabe bzw. Auswahl moeglicher Zusatzframes. |
|
||||
|
||||
---
|
||||
## 3d. David-Feedback 2026-07-06
|
||||
|
||||
Review-Ergebnis: Der grobe fachliche Scope ist gut. D-FORM bleibt Builder plus oeffentliches Formular. Nicht nach D-FORM gehoeren Forms-Liste, Submissions, Booking, Kalender, Signatur und HR.
|
||||
|
||||
Nacharbeit: In S01 fehlte die Interaktionslogik fuer konkrete Aktionen. Die wichtigsten Klicks sind jetzt entschieden:
|
||||
|
||||
| Bereich | Entscheidung |
|
||||
|---|---|
|
||||
| Feld bearbeiten | Im rechten Inspector, kein Modal. |
|
||||
| Feld duplizieren | Feldkarte oder 3-Punkte-Menue; kein Confirm. |
|
||||
| Feld loeschen | 3-Punkte-Menue/Gefahrenzone; Confirm bei Abhaengigkeiten oder public-wirksamen Folgen. |
|
||||
| Logic-Regel anlegen | Logic-Panel/Detailbereich im selben S01, kein Modal. |
|
||||
| Post-Submit-Action hinzufuegen | Typauswahl als Popover/kleines Auswahlpanel, Konfiguration im Action-Panel/Drawer. |
|
||||
| Sharing oeffnen | Sharing-Panel/Modus im ADV-S01, kein Modal. |
|
||||
| Publish | Inline-Check mit Summary/Popover; Blocker springen zu Feld, Logic, Action oder Settings. |
|
||||
| Unpublish | Confirm-Dialog, weil Public-Link danach nicht mehr erreichbar ist. |
|
||||
|
||||
Bewertung: Die 5 Hauptframes bleiben bestehen. Nach Empfehlung wurden zusaetzlich D07 Logic Regel Detail, D08 Action Detail mit Mapping und D09 Publish Blocker Summary als Subframe-Zustaende gebaut. M01/M02 und die restlichen D-/M-Zustaende bleiben vorerst dokumentiert.
|
||||
|
||||
Nachgezogene Vor-Subframe-Dateien: [[Screens/D01 Sharing Panel URL QR iFrame]], [[Screens/D02 Post-Submit Actions]], [[Screens/D03 Conditional Logic Editor]], [[Screens/D06 Feldkarten Menue]], [[Screens/M01 Feld loeschen Confirm]], [[Screens/91 D07 Logic Regel Detail|D07 Logic Regel Detail]], [[Screens/92 D08 Action Detail mit Mapping|D08 Action Detail mit Mapping]], [[Screens/93 D09 Publish Blocker Summary|D09 Publish Blocker Summary]], [[Screens/D10 Builder Interaktionsfaelle]], [[Screens/M02 Unpublish Confirm]], [[Screens/M03 Archive Confirm]], [[Screens/M04 Unsaved Changes Confirm]].
|
||||
|
||||
Nach weiterer Rueckmeldung wurde D10 als Case-Matrix ergaenzt: Was passiert, wenn Nutzer etwas auswaehlen, eine Checkbox setzen, einen mittleren Pflichtschritt vergessen, Bild/Datei hinzufuegen, Optionen loeschen, Mapping halb setzen oder eine public-wirksame Aktion ausloesen.
|
||||
|
||||
---
|
||||
|
||||
## 3e. P2-Auth-Dbgleich 2026-07-06
|
||||
|
||||
P2 Auth ist als Referenz fuer Reifegrad genutzt worden. Dort sind nicht nur Hauptscreens, sondern auch D-/M-Zustaende, Modal-Inhalte, Subframe-Grid, Canvas-Notizen und Handoff-Checks konsequent dokumentiert.
|
||||
|
||||
Nachgezogen fuer D-FORM:
|
||||
|
||||
| P2-Muster | D-FORM-Umsetzung |
|
||||
|---|---|
|
||||
| Screen-Dateien mit Ziel, Daten, Aktionen, Verhalten, Zustaenden und Subframe-Hinweis | ADV-S01/S02/S04/V01-V03 sowie D01-D10 und M01-M04 entsprechend ausgearbeitet. |
|
||||
| D-/M-Zustaende als eigene Dateien, auch wenn sie nicht gebaut werden | ADV-S01-Zustaende liegen als eigene Vor-Subframe-Dateien im `Screens`-Ordner; D07/D08/D09 sind als zusaetzliche Subframe-Zustaende gebaut. |
|
||||
| Canvas zeigt Hauptflow plus dokumentierte Zustaende/Notizen | `WF-D-FORM Form Builder.canvas` wurde erweitert: Hauptflow, D-/M-Zustaende, D10 Case-Matrix, Public Flow und Scope-Notizen. |
|
||||
| Tracker fuehrt dokumentierte Zustaende als eigene Zeilen | Tracker enthaelt D01-D10 und M01-M04; D07/D08/D09 stehen auf `Bauen`, M01/M02/M03/M04 bleiben dokumentiert. |
|
||||
|
||||
Bewertung: D-FORM ist auf dem gleichen Vor-Subframe-Dokumentationsniveau wie die besser ausgearbeiteten P2 Auth Pakete. Subframe ist als Draft gebaut und verlinkt; Review und Feinschliff folgen.
|
||||
|
||||
---
|
||||
|
||||
## 4. Brainstorming
|
||||
|
||||
### Flow-Frage
|
||||
|
||||
Wie bekommt David den Builder so vorbereitet, dass er nicht in zehn Unterseiten zerfaellt, aber trotzdem alle schweren Entscheidungen sichtbar sind?
|
||||
|
||||
### UX-Varianten
|
||||
|
||||
| Option | Beschreibung | Vorteil | Nachteil | Empfehlung |
|
||||
|---|---|---|---|---|
|
||||
| D | Ein grosser Builder-Screen mit Palette, Canvas, Properties, Preview und Tabs/Panels fuer Sharing/Actions/Logic. | Ein Arbeitsort, weniger Navigation, passt zum Bespoke-Canvas. | Kann sehr dicht werden. | Genommen fuer v1-Draft. |
|
||||
| B | Mehrere Unterseiten: Felder, Design, Logic, Sharing, Actions, Preview. | Uebersichtlicher pro Thema. | Wirkt eher Settings als Canvas; mehr Route- und Handoff-Last. | Raus fuer v1-Draft. |
|
||||
| C | Minimaler Builder plus separate Modals fuer jedes Feature. | Reduziert Hauptscreen. | Modal-Kaskade wird schwer wartbar; Field-Mapping leidet. | Nur fuer einzelne Confirm-/Blocker-Zustaende. |
|
||||
|
||||
### Entscheidung
|
||||
|
||||
| Entscheidung | Status | Notiz |
|
||||
|---|---|---|
|
||||
| Builder als ein Hauptscreen | genommen | Die Route `/forms/:id/edit` ist der Arbeitsort. |
|
||||
| Public Form als eigener Screen | genommen | Extern sichtbar, eigener Polish, eigene Zustaende. |
|
||||
| Sharing in Builder integrieren | genommen | URL, QR, iFrame als Panel/Tab im Builder. |
|
||||
| Post-Submit-Actions in Builder integrieren | genommen | Field-Mapping gehoert zur Form-Konfiguration, kein eigener Screen. |
|
||||
| Conditional Logic in v1 eng schneiden | genommen | Nur Anzeige/Ausblenden: Wenn Feld Y = Z, zeige Feld X. |
|
||||
| 12 Feldtypen nach A4 verwenden | Empfehlung genommen | Text, Textarea, Zahl, Waehrung, Datum, Datum-Range, Select, Multi-Select, Boolean, Email, Telefon, Datei. |
|
||||
| Code-Stand nicht als Design-Grenze nehmen | genommen | Der vorhandene Form-Widget-Code ist kleiner als D-FORM; Design folgt Planning/D4. |
|
||||
| Personalisierte Links | raus fuer v1 | Laut Ticket v2. |
|
||||
| JS-Snippet | raus fuer v1 | Laut Ticket v2, iFrame bleibt. |
|
||||
|
||||
### Arbeitsentscheidung: 12 Feldtypen
|
||||
|
||||
Fuer Davids D-FORM-Draft nehmen wir die A4-Liste als verbindliche v1-Designbasis:
|
||||
|
||||
| Feldtyp | Design-Hinweis |
|
||||
|---|---|
|
||||
| Text | Einzeiliger Text. |
|
||||
| Textarea | Mehrzeiliger Text, optional Markdown-Anmutung fuer interne/langformatige Antworten. |
|
||||
| Zahl | Ganze Zahl oder Dezimalwert. |
|
||||
| Waehrung | Zahl mit Waehrungsformat, z. B. Auftragswert. |
|
||||
| Datum | Einzelnes Datum. |
|
||||
| Datum-Range | Start-/Enddatum oder Zeitraum. |
|
||||
| Select | Eine Auswahl aus Optionen; Radio kann als Darstellungsvariante davon gelten. |
|
||||
| Multi-Select | Mehrere Optionen, z. B. Chips oder Checkbox-Liste. |
|
||||
| Boolean | Ja/Nein, Checkbox oder Toggle. |
|
||||
| Email | Email mit Formatvalidierung. |
|
||||
| Telefon | Telefonnummer mit Format-/Normalisierungs-Hinweis. |
|
||||
| Datei | Datei-Upload; Foto ist fuer v1 eine Upload-/Kamera-Variante, kein eigener Feldtyp. |
|
||||
|
||||
Nicht als normale Feldtypen zaehlen: Honeypot/mCaptcha (Anti-Spam), Section Header/Description (Darstellungsbloecke), Signature (Abnahme/Signatur-Kontext), Hidden Field, Address-Autocomplete. Diese koennen spaeter als v2 oder Spezialbausteine dazukommen.
|
||||
|
||||
### Arbeitsentscheidung: Post-Submit-Actions
|
||||
|
||||
Der Builder zeigt Actions, aber baut keinen zweiten Automation-Editor.
|
||||
|
||||
| Tiefe | Inhalt | Entscheidung |
|
||||
|---|---|---|
|
||||
| Action-Liste | Reihenfolge, Typ, aktiv/inaktiv, kurzer Status, Warnungen. | In S01 sichtbar. |
|
||||
| Action-Konfiguration | Ziel, Bedingung optional, Empfaenger/URL/Entity, Field-Mapping-Zeilen. | In S01 als Panel/Drawer/Tab sichtbar. |
|
||||
| Field-Mapping | Form-Feld -> Ziel-Feld, Pflichtfeldwarnungen, fehlende Zuordnung. | In S01 sichtbar. |
|
||||
| Test/Validation | Webhook-URL pruefen, Mapping-Warnungen, Preview was erzeugt wird. | In S01 dokumentieren. |
|
||||
| ActionLog voll | Submission-bezogene Ausfuehrungen, Re-Run, Fehlerverlauf. | Nicht eigener D-FORM-Screen; gehoert zu Submissions-Compose. |
|
||||
|
||||
### Arbeitsentscheidung: Builder-Arbeitsbereiche
|
||||
|
||||
Der Form-Builder bleibt ein Hauptscreen, aber nicht alles muss gleichzeitig im Vordergrund sein.
|
||||
|
||||
| Arbeitsbereich | Gewichtung | Empfehlung fuer David |
|
||||
|---|---|---|
|
||||
| Header / Status | dauerhaft sichtbar | Name, Status Draft/Published, Save, Preview, Publish, Share. |
|
||||
| Feld-Palette | Primaerbereich | 12 Feldtypen schnell scanbar, Drag + Klick. |
|
||||
| Canvas | Primaerbereich | Reihenfolge der Felder, Drag-and-Drop, Empty State, Feldfehler. |
|
||||
| Feld-Inspector | Primaerbereich | Ausgewaehltes Feld bearbeiten: Label, Key, Pflicht, Validation, Optionen. |
|
||||
| Logic | Sekundaerbereich | Eigener Tab/Panel/Drawer; einfache Wenn-Dann-Regeln. |
|
||||
| Actions | Sekundaerbereich | Eigener Tab/Panel/Drawer; Action-Liste + Mapping. |
|
||||
| Sharing | Sekundaerbereich | Eigener Tab/Panel/Drawer; URL, QR, iFrame. |
|
||||
| Preview | Umschaltbereich | Public-nahe Vorschau, ideal als eigener View/Tab oder rechte Preview-Fläche. |
|
||||
| Settings | Sekundaerbereich | Slug, Success Message, Redirect, Branding/Theme, Allowed Origins. |
|
||||
|
||||
Empfehlung: David sollte **Palette + Canvas + Inspector** als Kernarbeit verstehen. Logic, Actions, Sharing, Preview und Settings sind eigene Arbeitsmodi um denselben Form-Datensatz herum.
|
||||
|
||||
### Happy Path
|
||||
|
||||
1. Nutzer oeffnet den Form-Builder.
|
||||
2. Nutzer waehlt ein Feld aus der Palette und zieht es in den Canvas.
|
||||
3. Nutzer konfiguriert Label, Pflichtfeld, Optionen und Validierung.
|
||||
4. Nutzer setzt bei Bedarf Conditional Logic.
|
||||
5. Nutzer prueft die Live-Vorschau.
|
||||
6. Nutzer definiert Post-Submit-Actions mit Field-Mapping.
|
||||
7. Nutzer published das Formular.
|
||||
8. Nutzer kopiert Public URL, QR oder iFrame.
|
||||
9. Externer Submitter oeffnet das Public Form, fuellt es aus und sendet ab.
|
||||
10. System zeigt Erfolgstext oder leitet weiter.
|
||||
|
||||
### Varianten / Branches
|
||||
|
||||
- Feld ohne Label oder ungueltige Konfiguration.
|
||||
- Conditional Logic referenziert ein geloeschtes Feld.
|
||||
- Pflichtfeld ohne passende Validation.
|
||||
- Webhook-URL ungueltig.
|
||||
- Publish blockiert wegen fehlendem Namen, Slug oder sichtbaren Feldern.
|
||||
- Public Form ist nicht veroeffentlicht, archiviert, geschlossen oder nicht erreichbar.
|
||||
- Captcha oder Submit schlaegt fehl.
|
||||
|
||||
### Roadblocks
|
||||
|
||||
- Zu viele Funktionen im Builder koennen David ueberladen.
|
||||
- 12 Feldtypen muessen aus A4 kommen, aber Builder braucht Feld-spezifische Properties.
|
||||
- Post-Submit-Actions koennen sehr komplex werden; im Design sollte Field-Mapping sichtbar sein, ohne einen Automations-Editor nachzubauen.
|
||||
- Public Form muss wiederverwendbar fuer HR, Booking-Intake, Urlaub/Krank und Requests sein.
|
||||
|
||||
### Meldungs-/Error-State-Brainstorming
|
||||
|
||||
| Ereignis | UI-Form | Blockiert? | Bauen? | Copy/Notiz |
|
||||
|---|---|---|---|---|
|
||||
| Keine Felder im Formular | Empty State im Canvas | nein | ja, in S01 | Klarer CTD: Feld aus Palette hinzufuegen. |
|
||||
| Ungueltiges Feld | Inline + Summary-Banner | ja, fuer Publish | dokumentieren | Feldname nennen, nicht nur generisch. |
|
||||
| Logic-Regel kaputt | Inline im Logic-Panel | ja, fuer Publish | dokumentieren | Ursache zeigen: referenziertes Feld fehlt. |
|
||||
| Publish nicht moeglich | Banner im Builder | ja | dokumentieren | Liste der fehlenden Voraussetzungen. |
|
||||
| Kopieren erfolgreich | Toast | nein | dokumentieren | URL/iFrame kopiert. |
|
||||
| Public Form nicht verfuegbar | Public Blocker Screen | ja | ja, V02 | Externe Nutzer brauchen klare Erklaerung. |
|
||||
| Captcha fehlgeschlagen | Inline/Banner im Public Form | ja, temporar | ja, V03 | Erneut versuchen. |
|
||||
| Submit erfolgreich | Public Success State | nein | ja, V01 | Erfolgstext oder Redirect. |
|
||||
|
||||
### Offene Fragen
|
||||
|
||||
- Soll `date`, `datetime`, `time` spaeter als Varianten des Datumsfelds oder als eigene v2-Feldtypen behandelt werden?
|
||||
- Soll `signature` im Form-Builder v1 als normales Feld verfuegbar sein oder nur im Abnahme-/Signatur-Kontext?
|
||||
- Wie tief soll Field-Mapping fuer `create_projekt` in v1 sichtbar sein?
|
||||
- Soll der Public Form Renderer mehrere Branding-Level haben oder nur Tenant-Logo plus einfache Theme-Werte?
|
||||
|
||||
---
|
||||
|
||||
## 5. Screen-Kandidaten nach Entscheidung
|
||||
|
||||
| Kandidat | Warum eventuell noetig? | Erste Einschaetzung |
|
||||
|---|---|---|
|
||||
| Form-Builder Canvas | Hauptarbeitsort, komplexe Sonder-UI. | Bauen |
|
||||
| Oeffentliches Formular | Extern sichtbar, eigener Polish, eigener Renderer. | Bauen |
|
||||
| Public Erfolg oder Redirect | Submit-Ende ist copy- und vertrauenskritisch. | Bauen |
|
||||
| Public Formular nicht verfuegbar | Externer Blocker braucht klare Loesung. | Bauen |
|
||||
| Public Captcha oder Submit Fehler | Hauefiger Public-Fehler, muss sauber wirken. | Bauen oder dokumentieren |
|
||||
| Sharing-Panel | URL/QR/iFrame gehoeren in Builder. | In ADV-S01 integrieren |
|
||||
| Post-Submit-Actions | Field-Mapping muss sichtbar sein. | In ADV-S01 integrieren |
|
||||
| Conditional-Logic-Editor | v1-Pflicht, aber eng schneiden. | In ADV-S01 integrieren |
|
||||
| Forms-Liste | Compose aus D2, nicht D-FORM. | Raus |
|
||||
| Submissions | Compose aus A2/A3, nicht D-FORM. | Raus |
|
||||
| Booking-Intake | Eigenes Ticket `D-BOOK`. | Raus |
|
||||
| Signatur-Wizard | Eigenes Paket/Compose. | Raus |
|
||||
|
||||
---
|
||||
|
||||
## 6. Screen Validation Gate
|
||||
|
||||
| ID | Screen/Zustand | Ist eigener Arbeitsmoment? | Neue Struktur/Entscheidung/Risiko? | Entscheidung | Begruendung |
|
||||
|---|---|---|---|---|---|
|
||||
| ADV-S01 | [[Screens/90 ADV Form-Builder Canvas|ADV-S01 Form-Builder Canvas]] | ja | ja, schwerste P16-UI | Referenz behalten | Nicht mehr Hauptfluss; S02 ist die einfache Richtung. |
|
||||
| S04 | [[Screens/07 S04 Oeffentliches Formular|S04 Oeffentliches Formular]] | ja | ja, Public Renderer und Branding | Bauen | Extern sichtbar, hoher Polish. |
|
||||
| V01 | [[Screens/08 V01 Public Erfolg oder Redirect|V01 Public Erfolg oder Redirect]] | teilweise | ja, Submit-Ende und Copy | Bauen | Public Dbschluss soll nicht Dev-Default sein. |
|
||||
| V02 | [[Screens/09 V02 Public Formular nicht verfuegbar|V02 Public Formular nicht verfuegbar]] | ja | ja, blockierender Public-State | Bauen | Nutzer kann nicht fortfahren. |
|
||||
| V03 | [[Screens/10 V03 Public Captcha oder Submit Fehler|V03 Public Captcha oder Submit Fehler]] | teilweise | ja, Public Trust | Bauen | Fehler darf nicht technisch wirken. |
|
||||
| D01 | [[Screens/D01 Sharing Panel URL QR iFrame]] | nein | nein, Bereich in S01 | Nur dokumentieren | Kein eigener Screen, aber UI-Bereich. |
|
||||
| D02 | [[Screens/D02 Post-Submit Actions]] | nein | ja, Mapping-Komplexitaet | Nur dokumentieren | In S01 als Panel/Tab dokumentieren. |
|
||||
| D03 | [[Screens/D03 Conditional Logic Editor]] | nein | ja, Regel-Editor | Nur dokumentieren | In S01 als Panel/Tab dokumentieren. |
|
||||
| D06 | [[Screens/D06 Feldkarten Menue]] | nein | ja, Klick-Logik nach David-Feedback | Nur dokumentieren | 3-Punkte-Menue fuer Duplizieren, Loeschen, ggf. Deaktivieren. |
|
||||
| M01 | [[Screens/M01 Feld loeschen Confirm]] | nein | ja, Abhaengigkeiten in Logic/Actions | Nur dokumentieren | Confirm nur bei Risiko, kein normaler Bearbeitungsdialog. |
|
||||
| D07 | [[Screens/91 D07 Logic Regel Detail|D07 Logic Regel Detail]] | teilweise | ja, Regelbearbeitung | Referenz behalten | Fuer S02 nicht Hauptfluss; bei Advanced-Bedarf pruefen. |
|
||||
| D08 | [[Screens/92 D08 Action Detail mit Mapping|D08 Action Detail mit Mapping]] | teilweise | ja, Field-Mapping | Referenz behalten | Fuer S02 nicht Hauptfluss; Mapping bleibt verborgen. |
|
||||
| D09 | [[Screens/93 D09 Publish Blocker Summary|D09 Publish Blocker Summary]] | ja | ja, Publish-Entscheidung | Referenz behalten | In S02 reicht Banner/Popover im selben Screen. |
|
||||
| D10 | [[Screens/D10 Builder Interaktionsfaelle]] | nein | ja, Auswahlfolgen und Edge Cases | Nur dokumentieren | Case-Matrix fuer Dropdowns, Checkboxen, vergessene Zwischenschritte, Datei/Bild und Modal-Inhalte. |
|
||||
| M02 | [[Screens/M02 Unpublish Confirm]] | nein | ja, public-wirksam | Nur dokumentieren | Confirm-Dialog wegen Public-Link. |
|
||||
| M03 | [[Screens/M03 Archive Confirm]] | nein | ja, destruktiv/Statuswechsel | Nur dokumentieren | Confirm aus More-Menue. |
|
||||
| M04 | [[Screens/M04 Unsaved Changes Confirm]] | nein | ja, Datenverlust-Risiko | Nur dokumentieren | Standard-Guard beim Verlassen mit Dirty State. |
|
||||
| D04 | Forms-Liste | nein | nein | Raus | Compose, nicht Teil von D-FORM. |
|
||||
| D05 | Submissions | nein | nein | Raus | Compose, nicht Teil von D-FORM. |
|
||||
|
||||
Entscheidung: `Bauen`, `Wiederverwenden`, `Nur dokumentieren`, `Spaeter`, `Raus`
|
||||
|
||||
### Validation-Ergebnis fuer David
|
||||
|
||||
Der urspruengliche Advanced-Subframe-Fokus lag auf diesen **8 Frames/Zustaenden**:
|
||||
|
||||
- ADV-S01 Form-Builder Canvas
|
||||
- S04 Oeffentliches Formular
|
||||
- V01 Public Erfolg oder Redirect
|
||||
- V02 Public Formular nicht verfuegbar
|
||||
- V03 Public Captcha oder Submit Fehler
|
||||
- D07 Logic Regel Detail
|
||||
- D08 Action Detail mit Mapping
|
||||
- D09 Publish Blocker Summary
|
||||
|
||||
Nach der Simple-Builder-Neuausrichtung sind zusaetzlich gebaut und fuer Review nach vorne gezogen:
|
||||
|
||||
- S00 Formulare verwalten
|
||||
- S01 Formularart auswaehlen
|
||||
- S02 Einfacher Fragen Editor
|
||||
- S01B Gefuehrter Fragen Editor
|
||||
- S01C Website Formular Editor
|
||||
- S01D Umfrage Editor
|
||||
- S01E Internes Formular Editor
|
||||
- S03 Formular Design
|
||||
- S05 Antworten Tabelle
|
||||
|
||||
Nicht als eigene Frames bauen:
|
||||
|
||||
- Kein Sharing/Teilen als eigener Hauptreiter im Simple Builder; Public-Link/QR/Einbettung gehoeren in Veroeffentlichen/Public-Link-Kontext.
|
||||
- Actions, Logic, Preview und Settings als Arbeitsbereiche von S01 bzw. einfache Zusatzoptionen im Simple Builder.
|
||||
- Feldkarten-Menue, allgemeine Panels, D10 Case-Matrix und Confirm-Dialoge als dokumentierte ADV-S01-Zustaende.
|
||||
- Vollstaendige Forms-Liste und Submissions, weil diese Compose aus A2/A3 sind. S00/S05 sind nur schlanke D-FORM-Einstiegs-/Antwortansichten.
|
||||
- Booking/Kalender/Signatur, weil diese eigene Tickets haben.
|
||||
|
||||
Als zusaetzliche S01-Zustandsframes bauen:
|
||||
|
||||
- D07 Logic Regel Detail
|
||||
- D08 Action Detail mit Mapping
|
||||
- D09 Publish Blocker Summary
|
||||
|
||||
### Copy-kritische Zustaende
|
||||
|
||||
| Zustand | Bauen? | Warum / Copy-Entscheidung |
|
||||
|---|---|---|
|
||||
| Publish blockiert | dokumentieren | Interner Nutzer braucht konkrete fehlende Punkte. |
|
||||
| Public Erfolg | ja | Externer Nutzer muss sicher wissen, dass die Anfrage angekommen ist. |
|
||||
| Public nicht verfuegbar | ja | Externer Nutzer ist blockiert. |
|
||||
| Captcha/Submit Fehler | ja | Vertrauen erhalten, einfache naechste Aktion. |
|
||||
|
||||
### Blockierende Error States
|
||||
|
||||
| Zustand | UI-Form | Primaeraktion | Sekundare Aktion | Inhalt/Copy-Richtung |
|
||||
|---|---|---|---|---|
|
||||
| Public Form nicht veroeffentlicht | Screen | Zur Website zurueck | Anbieter kontaktieren | Formular ist aktuell nicht verfuegbar. |
|
||||
| Public Form geschlossen | Screen | Anbieter kontaktieren | - | Dnnahmezeitraum ist beendet. |
|
||||
| Public Submit scheitert dauerhaft | Banner/Screen | Erneut versuchen | Anbieter kontaktieren | Keine technischen Details. |
|
||||
| Builder Publish blockiert | Banner im Builder | Fehler beheben | Vorschau weiter nutzen | Konkrete Liste: Name, Slug, Feldfehler. |
|
||||
|
||||
---
|
||||
|
||||
## 7. Validierte Screen-Liste
|
||||
|
||||
| ID | Screen/Zustand | Typ | Umsetzung | Ort | Status |
|
||||
|---|---|---|---|---|---|
|
||||
| S00 | [[Screens/01 S00 Formulare verwalten|S00 Formulare verwalten]] | Formular-Zentrale | Bauen | `/forms` | Subframe Draft / Review offen |
|
||||
| E01 | [[Screens/02 E01 S00 Keine Formulare|E01 S00 Keine Formulare]] | Empty State | Bauen | `/forms` | Subframe Draft / Review offen |
|
||||
| E02 | [[Screens/03 E02 S00 Keine Treffer|E02 S00 Keine Treffer]] | Empty State | Bauen | `/forms` | Subframe Draft / Review offen |
|
||||
| S01 | [[Screens/04 S01 Formularart auswaehlen|S01 Formularart auswaehlen]] | Einstieg / Auswahl | Bauen | `/forms/new` | Subframe Draft / Review offen |
|
||||
| S02 | [[Screens/05 S02 Einfacher Fragen Editor|S02 Einfacher Fragen Editor]] | Simple Builder | Bauen | `/forms/:id/edit` | Subframe Draft / Review offen |
|
||||
| S02L | [[Screens/05b S02L Lead Felder zuweisen|S02L Lead Felder zuweisen]] | Lead-Zustand | Bauen | `/forms/:id/edit` | Subframe Draft / Review offen |
|
||||
| E05 | [[Screens/05c E05 S02 Lead Zuweisung pruefen|E05 S02 Lead Zuweisung pruefen]] | Lead Error State | Bauen | `/forms/:id/edit` | Subframe Draft / Review offen |
|
||||
| S03 | [[Screens/06 S03 Formular Design|S03 Formular Design]] | Builder Tab | Bauen | `/forms/:id/edit` | Subframe Draft / Review offen |
|
||||
| S04 | [[Screens/07 S04 Oeffentliches Formular|S04 Oeffentliches Formular]] | Public Form | Bauen | `/f/{tenant}/{slug}` | Subframe Draft / Review offen |
|
||||
| V01 | [[Screens/08 V01 Public Erfolg oder Redirect|V01 Public Erfolg oder Redirect]] | Public Feedback | Bauen | nach Submit | Subframe Draft / Review offen |
|
||||
| V02 | [[Screens/09 V02 Public Formular nicht verfuegbar|V02 Public Formular nicht verfuegbar]] | Public Blocker | Bauen | Variante von S04 | Subframe Draft / Review offen |
|
||||
| V03 | [[Screens/10 V03 Public Captcha oder Submit Fehler|V03 Public Captcha oder Submit Fehler]] | Public Error | Bauen | Variante von S04 | Subframe Draft / Review offen |
|
||||
| S05 | [[Screens/11 S05 Antworten Tabelle|S05 Antworten Tabelle]] | Builder Tab | Bauen | `/forms/:id/edit` | Subframe Draft / Review offen |
|
||||
| E03 | [[Screens/12 E03 S05 Keine Antworten|E03 S05 Keine Antworten]] | Empty State | Bauen | `/forms/:id/edit` | Subframe Draft / Review offen |
|
||||
| E04 | [[Screens/13 E04 S05 Export Fehler|E04 S05 Export Fehler]] | Error State | Bauen | `/forms/:id/edit` | Subframe Draft / Review offen |
|
||||
| S01B | [[Screens/80 S01B Gefuehrter Fragen Editor|S01B Gefuehrter Fragen Editor]] | Spaeter / Referenz | Bauen | `/forms/:id/edit` | Subframe Draft / Referenz |
|
||||
| S01C | [[Screens/81 S01C Website Formular Editor|S01C Website Formular Editor]] | Spaeter / Referenz | Bauen | `/forms/:id/edit` | Subframe Draft / Referenz |
|
||||
| S01D | [[Screens/82 S01D Umfrage Editor|S01D Umfrage Editor]] | Spaeter / Referenz | Bauen | `/forms/:id/edit` | Subframe Draft / Referenz |
|
||||
| S01E | [[Screens/83 S01E Internes Formular Editor|S01E Internes Formular Editor]] | Spaeter / Referenz | Bauen | `/forms/:id/edit` | Subframe Draft / Referenz |
|
||||
| ADV-S01 | [[Screens/90 ADV Form-Builder Canvas|ADV-S01 Form-Builder Canvas]] | Advanced Builder / Referenz | Bauen | `/forms/:id/edit` | Subframe Draft / Referenz |
|
||||
| S01 | [[Screens/90b ADV Form-Builder Canvas 2|ADV-S01-2 Form-Builder Canvas 2]] | Advanced Builder / Referenz | Bauen | `/forms/:id/edit` | Subframe Draft / Referenz |
|
||||
|
||||
### ADV-S01-Zustaende und Zusatzframes vor Subframe
|
||||
|
||||
Diese Eintraege sind ausgearbeitet. D07/D08/D09 wurden nach Empfehlung als zusaetzliche Subframe-Zustaende gebaut; die restlichen bleiben dokumentiert.
|
||||
|
||||
| ID | Zustand | Typ | Umsetzung |
|
||||
|---|---|---|---|
|
||||
| D01 | [[Screens/D01 Sharing Panel URL QR iFrame]] | Panel-Zustand | Nur dokumentieren |
|
||||
| D02 | [[Screens/D02 Post-Submit Actions]] | Panel-Zustand | Nur dokumentieren |
|
||||
| D03 | [[Screens/D03 Conditional Logic Editor]] | Panel-Zustand | Nur dokumentieren |
|
||||
| D06 | [[Screens/D06 Feldkarten Menue]] | Inline-Zustand | Nur dokumentieren |
|
||||
| M01 | [[Screens/M01 Feld loeschen Confirm]] | Confirm Modal | Nur dokumentieren |
|
||||
| D07 | [[Screens/91 D07 Logic Regel Detail|D07 Logic Regel Detail]] | Panel-Zustand | Bauen |
|
||||
| D08 | [[Screens/92 D08 Action Detail mit Mapping|D08 Action Detail mit Mapping]] | Panel-Zustand | Bauen |
|
||||
| D09 | [[Screens/93 D09 Publish Blocker Summary|D09 Publish Blocker Summary]] | Inline-Zustand | Bauen |
|
||||
| D10 | [[Screens/D10 Builder Interaktionsfaelle]] | Case-Matrix | Nur dokumentieren |
|
||||
| M02 | [[Screens/M02 Unpublish Confirm]] | Confirm Modal | Nur dokumentieren |
|
||||
| M03 | [[Screens/M03 Archive Confirm]] | Confirm Modal | Nur dokumentieren |
|
||||
| M04 | [[Screens/M04 Unsaved Changes Confirm]] | Confirm Modal / Browser Guard | Nur dokumentieren |
|
||||
|
||||
---
|
||||
|
||||
## 8. Subframe-Grid
|
||||
|
||||
Interner Hauptarbeitsort:
|
||||
|
||||
```text
|
||||
ADV-S01 Form-Builder Canvas
|
||||
- Header / Status / Save / Publish
|
||||
- Feld-Palette
|
||||
- Canvas
|
||||
- Feld-Inspector
|
||||
- Arbeitsmodi: Logic, Actions, Sharing, Preview, Settings
|
||||
```
|
||||
|
||||
Dokumentierte ADV-S01-Zustaende:
|
||||
|
||||
```text
|
||||
S01 -> D01 Sharing Panel
|
||||
S01 -> D02 Post-Submit Actions -> D08 Action Detail mit Mapping
|
||||
S01 -> D03 Conditional Logic Editor -> D07 Logic Regel Detail
|
||||
S01 -> D06 Feldkarten Menue -> M01 Feld loeschen Confirm
|
||||
S01 -> D09 Publish Blocker Summary -> M02 Unpublish Confirm
|
||||
S01 -> M03 Archive Confirm
|
||||
S01 -> M04 Unsaved Changes Confirm
|
||||
S01 -> D10 Builder Interaktionsfaelle
|
||||
```
|
||||
|
||||
Public Flow:
|
||||
|
||||
```text
|
||||
S04 Oeffentliches Formular
|
||||
|
|
||||
+--> V01 Public Erfolg oder Redirect
|
||||
|
|
||||
+--> V02 Public Formular nicht verfuegbar
|
||||
|
|
||||
+--> V03 Public Captcha oder Submit Fehler
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 9. Screen-Pakete
|
||||
|
||||
- [[David Review Checkliste]]
|
||||
- [[Screens/01 S00 Formulare verwalten|S00 Formulare verwalten]]
|
||||
- [[Screens/02 E01 S00 Keine Formulare|E01 S00 Keine Formulare]]
|
||||
- [[Screens/03 E02 S00 Keine Treffer|E02 S00 Keine Treffer]]
|
||||
- [[Screens/04 S01 Formularart auswaehlen|S01 Formularart auswaehlen]]
|
||||
- [[Screens/05 S02 Einfacher Fragen Editor|S02 Einfacher Fragen Editor]]
|
||||
- [[Screens/06 S03 Formular Design|S03 Formular Design]]
|
||||
- [[Screens/07 S04 Oeffentliches Formular|S04 Oeffentliches Formular]]
|
||||
- [[Screens/08 V01 Public Erfolg oder Redirect|V01 Public Erfolg oder Redirect]]
|
||||
- [[Screens/09 V02 Public Formular nicht verfuegbar|V02 Public Formular nicht verfuegbar]]
|
||||
- [[Screens/10 V03 Public Captcha oder Submit Fehler|V03 Public Captcha oder Submit Fehler]]
|
||||
- [[Screens/11 S05 Antworten Tabelle|S05 Antworten Tabelle]]
|
||||
- [[Screens/12 E03 S05 Keine Antworten|E03 S05 Keine Antworten]]
|
||||
- [[Screens/13 E04 S05 Export Fehler|E04 S05 Export Fehler]]
|
||||
- [[Screens/80 S01B Gefuehrter Fragen Editor|S01B Gefuehrter Fragen Editor]]
|
||||
- [[Screens/81 S01C Website Formular Editor|S01C Website Formular Editor]]
|
||||
- [[Screens/82 S01D Umfrage Editor|S01D Umfrage Editor]]
|
||||
- [[Screens/83 S01E Internes Formular Editor|S01E Internes Formular Editor]]
|
||||
- [[Screens/90 ADV Form-Builder Canvas|ADV-S01 Form-Builder Canvas]]
|
||||
- [[Screens/90b ADV Form-Builder Canvas 2|ADV-S01-2 Form-Builder Canvas 2]]
|
||||
- [[Screens/D01 Sharing Panel URL QR iFrame]]
|
||||
- [[Screens/D02 Post-Submit Actions]]
|
||||
- [[Screens/D03 Conditional Logic Editor]]
|
||||
- [[Screens/D06 Feldkarten Menue]]
|
||||
- [[Screens/M01 Feld loeschen Confirm]]
|
||||
- [[Screens/91 D07 Logic Regel Detail|D07 Logic Regel Detail]]
|
||||
- [[Screens/92 D08 Action Detail mit Mapping|D08 Action Detail mit Mapping]]
|
||||
- [[Screens/93 D09 Publish Blocker Summary|D09 Publish Blocker Summary]]
|
||||
- [[Screens/D10 Builder Interaktionsfaelle]]
|
||||
- [[Screens/M02 Unpublish Confirm]]
|
||||
- [[Screens/M03 Archive Confirm]]
|
||||
- [[Screens/M04 Unsaved Changes Confirm]]
|
||||
|
||||
---
|
||||
|
||||
## 10. Handoff-Check
|
||||
|
||||
- [x] Jeder Screen ist mit Umsetzung markiert.
|
||||
- [x] Jedes sichtbare Feld hat eine Datenquelle. Als Detail-Brainstorming dokumentiert.
|
||||
- [x] Jeder Button hat eine Aktion. Nach David-Feedback um Interaktionslogik ergaenzt.
|
||||
- [x] Die wichtigsten ADV-S01-Klickzustaende sind als eigene Vor-Subframe-Dateien dokumentiert.
|
||||
- [x] Die wichtigsten Was-passiert-wenn-Faelle sind in D10 als Case-Matrix dokumentiert.
|
||||
- [x] Canvas ist nach P2-Auth-Referenz erweitert: Hauptflow, ADV-S01-Zustaende, D10, Public Flow und Scope-Notizen.
|
||||
- [x] Banner/Inline-Meldungen sind dokumentiert.
|
||||
- [x] Toasts/Action-Feedback sind dokumentiert.
|
||||
- [x] Meldungs-/Error-State-Matrix ist ausgefuellt.
|
||||
- [x] Blockierende Error States sind mit naechster Aktion definiert.
|
||||
- [x] Relevante Zustaende sind beschrieben.
|
||||
- [x] Offene Fragen sind sichtbar.
|
||||
- [x] Ticket-Handoff-Entwurf ist in `Tickets/Fertige Tickets/` angelegt.
|
||||
- [x] Detail-Brainstorming fuer ADV-S01/S02/S04/V01/V02/V03 ist abgeschlossen.
|
||||
- [x] David-Review-Rueckmeldung ist erfolgt.
|
||||
- [x] S01-Interaktionslogik nach David-Feedback ist eingearbeitet.
|
||||
- [ ] David-Freigabe nach S01-Nacharbeit ist erfolgt.
|
||||
- [x] Subframe-Link fuer Flow, Hauptfluss 01-13 und Referenzseiten 80-93 ist eingetragen.
|
||||
@@ -48,6 +48,7 @@ Diese Datei ist der erste Ort, um zu sehen:
|
||||
| WF-P9 Abnahme | D-ABN | Auftrag | Validiert | [MD](<P9 Auftrag/WF-P9 Abnahme/WF-P9 Abnahme.md>) | [Canvas](<P9 Auftrag/WF-P9 Abnahme/WF-P9 Abnahme.canvas>) | - | Subframe nach explizitem OK | Screens validiert 2026-07-09; mehrstufiger Mobile-Workflow; immutable nach Abschluss |
|
||||
| WF-P12 Flow-Editor | D-FLOW | Automationen | Validiert | [MD](<P12 Automationen/WF-P12 Flow-Editor/WF-P12 Flow-Editor.md>) | [Canvas](<P12 Automationen/WF-P12 Flow-Editor/WF-P12 Flow-Editor.canvas>) | - | Subframe nach explizitem OK | Screens validiert 2026-07-09; Katalog links/Canvas Mitte/Konfig rechts; Start-Auswahl mit Vorlagen; Langlaeufer |
|
||||
| WF-P12 Verwaltung | D-P12 | Automationen | Validiert | [MD](<P12 Automationen/WF-P12 Verwaltung/WF-P12 Verwaltung.md>) | [Canvas](<P12 Automationen/WF-P12 Verwaltung/WF-P12 Verwaltung.canvas>) | - | Subframe nach explizitem OK | Screens validiert 2026-07-09; Klartext-Timeline + 24h-Undo; Konfig-Panels hier, Editor bettet ein |
|
||||
| WF-D-FORM Form Builder | D-FORM | Termine & Formulare | Review | [MD](<D-FORM Formulare/WF-D-FORM Form Builder/WF-D-FORM Form Builder.md>) | [Canvas](<D-FORM Formulare/WF-D-FORM Form Builder/WF-D-FORM Form Builder.canvas>) | [Subframe](<https://app.subframe.com/f023064a5ca0/flow/afb1c257-46f0-4b23-aaed-d75f4773f1a9/edit?tab=ai&conversationId=02d948da-f9aa-4ab5-8352-2745789bb9ad>) | David Review / Handoff | Mitarbeiterinnen-Paket eingebaut 2026-07-09; S02 Simple Builder ist empfohlener Hauptfluss; Advanced-Canvas bleibt Referenz |
|
||||
|
||||
---
|
||||
|
||||
@@ -188,6 +189,39 @@ Diese Datei ist der erste Ort, um zu sehen:
|
||||
| S03 | Lauf-Detail (Timeline, 24h-Undo) | WF-P12 Verwaltung | Detail | Bauen | Validiert | `.../executions/:id` | [MD](<P12 Automationen/WF-P12 Verwaltung/Screens/S03 Lauf-Detail.md>) | - | [Canvas](<P12 Automationen/WF-P12 Verwaltung/WF-P12 Verwaltung.canvas>) |
|
||||
| S04 | Vorlagen-Katalog | WF-P12 Verwaltung | Karten-Liste | Bauen | Validiert | `/automations/templates` | [MD](<P12 Automationen/WF-P12 Verwaltung/Screens/S04 Vorlagen-Katalog.md>) | - | [Canvas](<P12 Automationen/WF-P12 Verwaltung/WF-P12 Verwaltung.canvas>) |
|
||||
| S05 | Baustein-Konfig-Panels (Muster) | WF-P12 Verwaltung | Compose-Panel | Bauen | Validiert | im Flow-Editor | [MD](<P12 Automationen/WF-P12 Verwaltung/Screens/S05 Baustein-Konfig-Panels.md>) | - | [Canvas](<P12 Automationen/WF-P12 Verwaltung/WF-P12 Verwaltung.canvas>) |
|
||||
| S00 | Formulare verwalten | WF-D-FORM Form Builder | Formular-Zentrale | Bauen | Subframe Draft / Review offen | `/forms` | [MD](<D-FORM Formulare/WF-D-FORM Form Builder/Screens/01 S00 Formulare verwalten.md>) | [Subframe](<https://app.subframe.com/f023064a5ca0/design/2325aa7a-d968-4028-8282-0823b15bf964/edit>) | [Canvas](<D-FORM Formulare/WF-D-FORM Form Builder/WF-D-FORM Form Builder.canvas>) |
|
||||
| E01 | S00 Keine Formulare | WF-D-FORM Form Builder | Empty State | Bauen | Subframe Draft / Review offen | `/forms` | [MD](<D-FORM Formulare/WF-D-FORM Form Builder/Screens/02 E01 S00 Keine Formulare.md>) | [Subframe](<https://app.subframe.com/f023064a5ca0/design/136c11b3-8310-4165-b4ba-9cf099ee0873/edit>) | [Canvas](<D-FORM Formulare/WF-D-FORM Form Builder/WF-D-FORM Form Builder.canvas>) |
|
||||
| E02 | S00 Keine Treffer | WF-D-FORM Form Builder | Empty State | Bauen | Subframe Draft / Review offen | `/forms` | [MD](<D-FORM Formulare/WF-D-FORM Form Builder/Screens/03 E02 S00 Keine Treffer.md>) | [Subframe](<https://app.subframe.com/f023064a5ca0/design/ccf8d2f7-e7b4-4ffd-87f6-1785edc1b2f7/edit>) | [Canvas](<D-FORM Formulare/WF-D-FORM Form Builder/WF-D-FORM Form Builder.canvas>) |
|
||||
| S01 | Formularart auswaehlen | WF-D-FORM Form Builder | Einstieg / Auswahl | Alternative bauen | Subframe Draft / Review offen | `/forms/new` | [MD](<D-FORM Formulare/WF-D-FORM Form Builder/Screens/04 S01 Formularart auswaehlen.md>) | [Subframe](<https://app.subframe.com/f023064a5ca0/design/c423ebcd-914f-4038-ab9f-7c2a745a8bec/edit>) | [Canvas](<D-FORM Formulare/WF-D-FORM Form Builder/WF-D-FORM Form Builder.canvas>) |
|
||||
| S02 | Einfacher Fragen Editor | WF-D-FORM Form Builder | Simple Builder Alternative | Alternative bauen | Subframe Draft / Review offen | `/forms/:id/edit` | [MD](<D-FORM Formulare/WF-D-FORM Form Builder/Screens/05 S02 Einfacher Fragen Editor.md>) | [Subframe](<https://app.subframe.com/f023064a5ca0/design/181aaa0f-5ae7-4f74-acf7-8273fbbe4dd5/edit>) | [Canvas](<D-FORM Formulare/WF-D-FORM Form Builder/WF-D-FORM Form Builder.canvas>) |
|
||||
| S02L | Lead Felder zuweisen | WF-D-FORM Form Builder | S02-Zustand / Lead Editor | Subframe Draft | Subframe Draft / Review offen | `/forms/:id/edit` | [MD](<D-FORM Formulare/WF-D-FORM Form Builder/Screens/05b S02L Lead Felder zuweisen.md>) | [Subframe](<https://app.subframe.com/f023064a5ca0/design/c8aa80cb-0cc8-473f-9fac-a09d395e6571/edit>) | [Canvas](<D-FORM Formulare/WF-D-FORM Form Builder/WF-D-FORM Form Builder.canvas>) |
|
||||
| E05 | S02 Lead Zuweisung pruefen | WF-D-FORM Form Builder | Lead Mapping Error State | Subframe Draft | Subframe Draft / Review offen | `/forms/:id/edit` | [MD](<D-FORM Formulare/WF-D-FORM Form Builder/Screens/05c E05 S02 Lead Zuweisung pruefen.md>) | [Subframe](<https://app.subframe.com/f023064a5ca0/design/26600ce4-7baf-4ffb-9955-7c7d1eef99d1/edit>) | [Canvas](<D-FORM Formulare/WF-D-FORM Form Builder/WF-D-FORM Form Builder.canvas>) |
|
||||
| S03 | Formular Design | WF-D-FORM Form Builder | Builder Tab | Bauen | Subframe Draft / Review offen | `/forms/:id/edit` | [MD](<D-FORM Formulare/WF-D-FORM Form Builder/Screens/06 S03 Formular Design.md>) | [Subframe](<https://app.subframe.com/f023064a5ca0/design/090f06a9-3fa7-4442-b8bc-035e95de7329/edit>) | [Canvas](<D-FORM Formulare/WF-D-FORM Form Builder/WF-D-FORM Form Builder.canvas>) |
|
||||
| S04 | Oeffentliches Formular | WF-D-FORM Form Builder | Public Form | Bauen | Subframe Draft / Review offen | `/f/{tenant}/{slug}` | [MD](<D-FORM Formulare/WF-D-FORM Form Builder/Screens/07 S04 Oeffentliches Formular.md>) | [Subframe](<https://app.subframe.com/f023064a5ca0/design/caef9ddd-03d6-4a26-8dc1-16aa198a7304/edit>) | [Canvas](<D-FORM Formulare/WF-D-FORM Form Builder/WF-D-FORM Form Builder.canvas>) |
|
||||
| V01 | Public Erfolg oder Redirect | WF-D-FORM Form Builder | Public Feedback | Bauen | Subframe Draft / Review offen | `/f/:slug` | [MD](<D-FORM Formulare/WF-D-FORM Form Builder/Screens/08 V01 Public Erfolg oder Redirect.md>) | [Subframe](<https://app.subframe.com/f023064a5ca0/design/c06ecfc3-1f86-4dfe-9cfd-cec8b8629253/edit>) | [Canvas](<D-FORM Formulare/WF-D-FORM Form Builder/WF-D-FORM Form Builder.canvas>) |
|
||||
| V02 | Public Formular nicht verfuegbar | WF-D-FORM Form Builder | Public Blocker | Bauen | Subframe Draft / Review offen | `/f/:slug` | [MD](<D-FORM Formulare/WF-D-FORM Form Builder/Screens/09 V02 Public Formular nicht verfuegbar.md>) | [Subframe](<https://app.subframe.com/f023064a5ca0/design/f96ec12a-5e6a-471d-9a9c-6babcb57c74c/edit>) | [Canvas](<D-FORM Formulare/WF-D-FORM Form Builder/WF-D-FORM Form Builder.canvas>) |
|
||||
| V03 | Public Captcha oder Submit Fehler | WF-D-FORM Form Builder | Public Error | Bauen | Subframe Draft / Review offen | `/f/:slug` | [MD](<D-FORM Formulare/WF-D-FORM Form Builder/Screens/10 V03 Public Captcha oder Submit Fehler.md>) | [Subframe](<https://app.subframe.com/f023064a5ca0/design/95c96bc9-35d4-47ce-b510-7d8ea1f41936/edit>) | [Canvas](<D-FORM Formulare/WF-D-FORM Form Builder/WF-D-FORM Form Builder.canvas>) |
|
||||
| S05 | Antworten Tabelle | WF-D-FORM Form Builder | Builder Tab | Bauen | Subframe Draft / Review offen | `/forms/:id/edit` | [MD](<D-FORM Formulare/WF-D-FORM Form Builder/Screens/11 S05 Antworten Tabelle.md>) | [Subframe](<https://app.subframe.com/f023064a5ca0/design/9e8eeab7-44ea-4b77-85e6-0818d97e1ac3/edit>) | [Canvas](<D-FORM Formulare/WF-D-FORM Form Builder/WF-D-FORM Form Builder.canvas>) |
|
||||
| E03 | S05 Keine Antworten | WF-D-FORM Form Builder | Empty State | Bauen | Subframe Draft / Review offen | `/forms/:id/edit` | [MD](<D-FORM Formulare/WF-D-FORM Form Builder/Screens/12 E03 S05 Keine Antworten.md>) | [Subframe](<https://app.subframe.com/f023064a5ca0/design/6f56c14f-d66e-4734-8a29-a900ac74a8a7/edit>) | [Canvas](<D-FORM Formulare/WF-D-FORM Form Builder/WF-D-FORM Form Builder.canvas>) |
|
||||
| E04 | S05 Export Fehler | WF-D-FORM Form Builder | Error State | Bauen | Subframe Draft / Review offen | `/forms/:id/edit` | [MD](<D-FORM Formulare/WF-D-FORM Form Builder/Screens/13 E04 S05 Export Fehler.md>) | [Subframe](<https://app.subframe.com/f023064a5ca0/design/00553ea4-9839-4d22-b540-9b9ef0bf014f/edit>) | [Canvas](<D-FORM Formulare/WF-D-FORM Form Builder/WF-D-FORM Form Builder.canvas>) |
|
||||
| S01B | Gefuehrter Fragen Editor | WF-D-FORM Form Builder | Simple Builder Alternative | Alternative bauen | Subframe Draft / Review offen | `/forms/:id/edit` | [MD](<D-FORM Formulare/WF-D-FORM Form Builder/Screens/80 S01B Gefuehrter Fragen Editor.md>) | [Subframe](<https://app.subframe.com/f023064a5ca0/design/d0fb9c3d-4b03-4d59-bd98-9f668ab018eb/edit>) | [Canvas](<D-FORM Formulare/WF-D-FORM Form Builder/WF-D-FORM Form Builder.canvas>) |
|
||||
| S01C | Website Formular Editor | WF-D-FORM Form Builder | Simple Builder Beispiel | Alternative bauen | Subframe Draft / Review offen | `/forms/:id/edit` | [MD](<D-FORM Formulare/WF-D-FORM Form Builder/Screens/81 S01C Website Formular Editor.md>) | [Subframe](<https://app.subframe.com/f023064a5ca0/design/d7d33e94-5c12-48e8-8ec6-1e94590ee89c/edit>) | [Canvas](<D-FORM Formulare/WF-D-FORM Form Builder/WF-D-FORM Form Builder.canvas>) |
|
||||
| S01D | Umfrage Editor | WF-D-FORM Form Builder | Simple Builder Beispiel | Alternative bauen | Subframe Draft / Review offen | `/forms/:id/edit` | [MD](<D-FORM Formulare/WF-D-FORM Form Builder/Screens/82 S01D Umfrage Editor.md>) | [Subframe](<https://app.subframe.com/f023064a5ca0/design/5abd7799-7058-40b3-9772-884cbda97b9c/edit>) | [Canvas](<D-FORM Formulare/WF-D-FORM Form Builder/WF-D-FORM Form Builder.canvas>) |
|
||||
| S01E | Internes Formular Editor | WF-D-FORM Form Builder | Simple Builder Beispiel | Alternative bauen | Subframe Draft / Review offen | `/forms/:id/edit` | [MD](<D-FORM Formulare/WF-D-FORM Form Builder/Screens/83 S01E Internes Formular Editor.md>) | [Subframe](<https://app.subframe.com/f023064a5ca0/design/ea08fd1c-1a76-4e2c-b27c-1091baa0586a/edit>) | [Canvas](<D-FORM Formulare/WF-D-FORM Form Builder/WF-D-FORM Form Builder.canvas>) |
|
||||
| ADV-S01 | Form-Builder Canvas | WF-D-FORM Form Builder | Bespoke Builder | Bauen | Subframe Draft / Review offen | `/forms/:id/edit` | [MD](<D-FORM Formulare/WF-D-FORM Form Builder/Screens/90 ADV Form-Builder Canvas.md>) | [Subframe](<https://app.subframe.com/f023064a5ca0/design/e5502f88-9858-460e-abae-671f28464270/edit>) | [Canvas](<D-FORM Formulare/WF-D-FORM Form Builder/WF-D-FORM Form Builder.canvas>) |
|
||||
| ADV-S01-2 | Form-Builder Canvas 2 | WF-D-FORM Form Builder | Advanced / Referenz | Referenz behalten | Subframe Draft / aktuell nicht Hauptfluss | `/forms/:id/edit` | [MD](<D-FORM Formulare/WF-D-FORM Form Builder/Screens/90b ADV Form-Builder Canvas 2.md>) | [Subframe](<https://app.subframe.com/f023064a5ca0/design/9529ac6f-eb71-4e5c-8774-7cebe9c8162c/edit>) | [Canvas](<D-FORM Formulare/WF-D-FORM Form Builder/WF-D-FORM Form Builder.canvas>) |
|
||||
| D07 | Logic Regel Detail | WF-D-FORM Form Builder | Panel-Zustand in S01 | Bauen | Subframe Draft / Review offen | in S01 Logic-Modus, kein eigener Screen | [MD](<D-FORM Formulare/WF-D-FORM Form Builder/Screens/91 D07 Logic Regel Detail.md>) | [Subframe](<https://app.subframe.com/f023064a5ca0/design/07b60457-8151-46b9-ba34-34eceffc08bb/edit>) | [Canvas](<D-FORM Formulare/WF-D-FORM Form Builder/WF-D-FORM Form Builder.canvas>) |
|
||||
| D08 | Action Detail mit Mapping | WF-D-FORM Form Builder | Panel-Zustand in S01 | Bauen | Subframe Draft / Review offen | in S01 Actions-Modus, kein eigener Screen | [MD](<D-FORM Formulare/WF-D-FORM Form Builder/Screens/92 D08 Action Detail mit Mapping.md>) | [Subframe](<https://app.subframe.com/f023064a5ca0/design/0759d779-91f5-4e06-b1d6-7cd0095461ea/edit>) | [Canvas](<D-FORM Formulare/WF-D-FORM Form Builder/WF-D-FORM Form Builder.canvas>) |
|
||||
| D09 | Publish Blocker Summary | WF-D-FORM Form Builder | Inline-Zustand in S01 | Bauen | Subframe Draft / Review offen | in S01 nach Klick auf Publish | [MD](<D-FORM Formulare/WF-D-FORM Form Builder/Screens/93 D09 Publish Blocker Summary.md>) | [Subframe](<https://app.subframe.com/f023064a5ca0/design/211e8ca7-fc0b-4c52-a4a4-a1e660209e58/edit>) | [Canvas](<D-FORM Formulare/WF-D-FORM Form Builder/WF-D-FORM Form Builder.canvas>) |
|
||||
| D01 | Sharing Panel URL QR iFrame | WF-D-FORM Form Builder | Panel-Zustand in S01 | Nur dokumentieren | Vor Subframe / dokumentiert | in ADV-S01 Form-Builder Canvas, kein eigener Screen | [MD](<D-FORM Formulare/WF-D-FORM Form Builder/Screens/D01 Sharing Panel URL QR iFrame.md>) | - | [Canvas](<D-FORM Formulare/WF-D-FORM Form Builder/WF-D-FORM Form Builder.canvas>) |
|
||||
| D02 | Post-Submit Actions | WF-D-FORM Form Builder | Panel-Zustand in S01 | Nur dokumentieren | Vor Subframe / dokumentiert | in ADV-S01 Form-Builder Canvas, kein eigener Screen | [MD](<D-FORM Formulare/WF-D-FORM Form Builder/Screens/D02 Post-Submit Actions.md>) | - | [Canvas](<D-FORM Formulare/WF-D-FORM Form Builder/WF-D-FORM Form Builder.canvas>) |
|
||||
| D03 | Conditional Logic Editor | WF-D-FORM Form Builder | Panel-Zustand in S01 | Nur dokumentieren | Vor Subframe / dokumentiert | in ADV-S01 Form-Builder Canvas, kein eigener Screen | [MD](<D-FORM Formulare/WF-D-FORM Form Builder/Screens/D03 Conditional Logic Editor.md>) | - | [Canvas](<D-FORM Formulare/WF-D-FORM Form Builder/WF-D-FORM Form Builder.canvas>) |
|
||||
| D06 | Feldkarten Menue | WF-D-FORM Form Builder | Inline-Zustand in S01 | Nur dokumentieren | Vor Subframe / dokumentiert | in ADV-S01 Form-Builder Canvas, kein eigener Screen | [MD](<D-FORM Formulare/WF-D-FORM Form Builder/Screens/D06 Feldkarten Menue.md>) | - | [Canvas](<D-FORM Formulare/WF-D-FORM Form Builder/WF-D-FORM Form Builder.canvas>) |
|
||||
| D10 | Builder Interaktionsfaelle | WF-D-FORM Form Builder | Case-Matrix in S01 | Nur dokumentieren | Vor Subframe / dokumentiert | in ADV-S01 Form-Builder Canvas, kein eigener Screen | [MD](<D-FORM Formulare/WF-D-FORM Form Builder/Screens/D10 Builder Interaktionsfaelle.md>) | - | [Canvas](<D-FORM Formulare/WF-D-FORM Form Builder/WF-D-FORM Form Builder.canvas>) |
|
||||
| M01 | Feld loeschen Confirm | WF-D-FORM Form Builder | Confirm Modal | Nur dokumentieren | Vor Subframe / dokumentiert | von S01 Feldkarte oder Inspector | [MD](<D-FORM Formulare/WF-D-FORM Form Builder/Screens/M01 Feld loeschen Confirm.md>) | - | [Canvas](<D-FORM Formulare/WF-D-FORM Form Builder/WF-D-FORM Form Builder.canvas>) |
|
||||
| M02 | Unpublish Confirm | WF-D-FORM Form Builder | Confirm Modal | Nur dokumentieren | Vor Subframe / dokumentiert | von S01 Header oder More-Menue | [MD](<D-FORM Formulare/WF-D-FORM Form Builder/Screens/M02 Unpublish Confirm.md>) | - | [Canvas](<D-FORM Formulare/WF-D-FORM Form Builder/WF-D-FORM Form Builder.canvas>) |
|
||||
| M03 | Archive Confirm | WF-D-FORM Form Builder | Confirm Modal | Nur dokumentieren | Vor Subframe / dokumentiert | von S01 More-Menue | [MD](<D-FORM Formulare/WF-D-FORM Form Builder/Screens/M03 Archive Confirm.md>) | - | [Canvas](<D-FORM Formulare/WF-D-FORM Form Builder/WF-D-FORM Form Builder.canvas>) |
|
||||
| M04 | Unsaved Changes Confirm | WF-D-FORM Form Builder | Confirm Modal / Browser Guard | Nur dokumentieren | Vor Subframe / dokumentiert | beim Verlassen von S01 mit Dirty State | [MD](<D-FORM Formulare/WF-D-FORM Form Builder/Screens/M04 Unsaved Changes Confirm.md>) | - | [Canvas](<D-FORM Formulare/WF-D-FORM Form Builder/WF-D-FORM Form Builder.canvas>) |
|
||||
|
||||
---
|
||||
|
||||
@@ -273,7 +307,10 @@ Diese Datei ist der erste Ort, um zu sehen:
|
||||
| WF-P9 Projekt-Akte | Board-Auftragsoptionen | Genommen | Abnahme-Pflicht je Spalte, Vorlagen-Zuweisung, Auto-Archiv -> erweitern WF-P8 S04 (kein neuer Screen). | Validiert 2026-07-09 |
|
||||
| WF-P12 Flow-Editor | Editor-Anordnung | Genommen | Katalog links, Canvas Mitte, Konfig-Panel rechts (n8n-Muster); Katalog einklappbar. | Validiert 2026-07-09 |
|
||||
| WF-P12 Flow-Editor | Anlegen-Flow | Genommen | Start-Auswahl-Modal: leer ODER Vorlage (Katalog eingebettet). | Validiert 2026-07-09 |
|
||||
| WF-D-FORM | Formulare zurueckgestellt | Offen | Davids Mitarbeiter:in arbeitet daran; Infos folgen von David. | 2026-07-09 |
|
||||
| WF-D-FORM Form Builder | Paket eingebaut | Genommen | Mitarbeiterinnen-Paket wurde als `WF-D-FORM Form Builder` in den Vault uebernommen. | Ursprungsname war `WF-P16 Form Builder`; wegen bestehendem `P16 Termine` bewusst auf D-FORM normalisiert |
|
||||
| WF-D-FORM Form Builder | Simple Builder als Hauptfluss | Review | S02 ist der empfohlene Google-Forms-nahe Haupteditor fuer Handwerksbetriebe; ADV-S01/ADV-S01-2 bleiben Referenz. | David prueft Richtung und Subframe-Feinschliff |
|
||||
| WF-D-FORM Form Builder | Lead-Feldzuweisung | Review | S02L ordnet Formularfragen per Dropdown Lead-Feldern zu; E05 deckt fehlende oder unmoegliche Zuweisungen ab. | Davids Feedback aus dem Mitarbeiterinnen-Paket uebernommen |
|
||||
| WF-D-FORM Form Builder | Scope-Abgrenzung | Genommen | D-FORM umfasst Builder, Public Form, Public States, Design und Antworten-Tabelle; Booking, Kalender, Signatur und HR bleiben eigene Pakete. | Handoff-Datei angelegt |
|
||||
|
||||
---
|
||||
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
{"id":"88792c50986c93db","type":"group","x":1950,"y":960,"width":2587,"height":740,"color":"2","label":"VERTRIEB — vom Anruf zum Auftrag"},
|
||||
{"id":"77c19412215a977c","type":"group","x":5037,"y":960,"width":2260,"height":740,"color":"2","label":"AUFTRAG & BAUSTELLE"},
|
||||
{"id":"41b8d85d3bb8d47d","type":"group","x":-160,"y":0,"width":1850,"height":740,"color":"6","label":"BASIS — gilt für alle Features"},
|
||||
{"id":"ca7223940f6e1d29","type":"group","x":2520,"y":2080,"width":2317,"height":520,"label":"TERMINE & FORMULARE"},
|
||||
{"id":"ca7223940f6e1d29","type":"group","x":2520,"y":2080,"width":2317,"height":740,"label":"TERMINE & FORMULARE"},
|
||||
{"id":"e97e13901e405fcd","type":"group","x":5037,"y":2080,"width":1540,"height":740,"label":"KOMMUNIKATION"},
|
||||
{"id":"8acc5d7d61317076","type":"group","x":2110,"y":3020,"width":1450,"height":740,"label":"AUTOMATIONEN"},
|
||||
{"id":"070f258760fab4e9","type":"group","x":760,"y":3020,"width":1190,"height":740,"label":"AUFGABEN & DATEIEN — stecken in jedem Feature"},
|
||||
@@ -22,7 +22,8 @@
|
||||
{"id":"a-leads-pkg","type":"file","file":"02 Wireframes/P7 Leads/WF-P7 Leads/WF-P7 Leads.canvas","x":2007,"y":1440,"width":460,"height":220},
|
||||
{"id":"77ebfde5a3a05b8a","type":"text","text":"## Online-Terminbuchung 🌐\n**Ticket:** `D-BOOK` + `D-P16` (Teil) · **Status:** ⬜ offen\n**Wo:** 🌐 Buchungslink + `/bookings`\n\n**Was drin ist:** 🌐 Buchungs-Seite für Kunden (freien Termin wählen → Formular → Bestätigung mit Kalender-Datei), intern: Buchungs-Liste (verschieben, stornieren, No-Show), Buchungsseiten-Editor, Verfügbarkeits-Zeiten\n\n**So funktioniert's:** Kunde bucht selbst, der erste freie Mitarbeiter bekommt den Termin, die Anfrage landet im Lead-Eingang. Muss am schönsten aussehen — ist öffentlich.","x":3067,"y":2160,"width":460,"height":360,"color":"2"},
|
||||
{"id":"28bd46ecb4eaa069","type":"text","text":"## Kalender\n**Ticket:** `D-BOOK` + `D-P16` (Teil) · **Status:** ⬜ offen\n**Wo:** `/calendar` + Einstellungen\n\n**Was drin ist:** Monats-/Wochen-Ansicht mit allen Terminen (Google-Kalender + Buchungen + Plantafel, je mit Herkunfts-Marker), Google-Kalender verbinden, Konflikt-Übersicht\n\n**So funktioniert's:** Läuft in beide Richtungen mit Google (Outlook kommt in v2). Fremde private Termine erscheinen nur als »belegt«.","x":3837,"y":2160,"width":460,"height":360,"color":"2"},
|
||||
{"id":"6b8c7d3bc3ee7449","type":"text","text":"## Formulare (Baukasten) 🌐\n**Ticket:** `D-FORM` + `D-P16` (Teil) · **Status:** ⬜ zurückgestellt (Davids Mitarbeiter:in arbeitet daran, Infos folgen)\n**Wo:** `/forms` + öffentlicher Link\n\n**Was drin ist:** Formular-Baukasten (Felder per Ziehen anordnen, Wenn-Dann-Logik »zeige Feld X wenn …«, Live-Vorschau), 🌐 öffentliches Formular zum Teilen (Link, QR-Code, Einbetten), Antworten-Übersicht\n\n**So funktioniert's:** Was nach dem Absenden passiert, ist einstellbar: Anfrage/Aufgabe anlegen, Mail senden, Automation starten. Dieselben Formulare stecken auch in HR-Anträgen und der Terminbuchung.","x":2560,"y":2160,"width":460,"height":360,"color":"1"},
|
||||
{"id":"6b8c7d3bc3ee7449","type":"text","text":"## Formulare (Baukasten) 🌐\n**Ticket:** `D-FORM` + `D-P16` (Teil) · **Status:** 🟡 Review-Draft (Mitarbeiterinnen-Paket eingebaut, David Review offen)\n**Wo:** `/forms` + öffentlicher Link\n\n**Was drin ist:** Formular-Zentrale, einfacher Google-Forms-naher Builder S02, Lead-Feldzuweisung S02L/E05, Design, Antworten-Tabelle, 🌐 öffentliches Formular mit Erfolg/Blocker/Submit-Fehler\n\n**So funktioniert's:** S02 ist der Hauptfluss für Handwerksbetriebe; Advanced-Canvas, Logic/Actions und Publish-Blocker bleiben als Referenz/Power-User-Richtung. D-FORM kann später in Terminbuchung, HR und Abnahme-Vorlagen eingesteckt werden.","x":2560,"y":2160,"width":460,"height":360,"color":"2"},
|
||||
{"id":"a-d-form-pkg","type":"file","file":"02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/WF-D-FORM Form Builder.canvas","x":2560,"y":2560,"width":460,"height":220},
|
||||
{"id":"4cce52e2e3bd8823","type":"text","text":"## Versand-Technik & Statistiken 🌐\n**Ticket:** `D-P14` · **Status:** ⬜ offen\n**Wo:** `/email-marketing` + Einstellungen\n\n**Was drin ist:** Eigene Absender-Domain einrichten (mit Copy-Paste-Anleitung), Kampagnen-Übersicht + Statistiken (zugestellt/geöffnet/geklickt), gesperrte Empfänger, Vorlagen, 🌐 Abmelde-Seite\n\n**So funktioniert's:** Mails an Kunden tauchen automatisch am Kontakt auf (BCC-Trick, kein Postfach-Anschluss nötig — der kommt in v2).","x":1850,"y":2160,"width":460,"height":360,"color":"2"},
|
||||
{"id":"b789fc765f833f45","type":"text","text":"## Digital unterschreiben (E-Signatur)\n**Ticket:** `D-P16` (Teil) · **Status:** ⬜ offen\n**Wo:** im Projekt-Detail\n\n**Was drin ist:** Angebot als PDF hochladen → Unterzeichner festlegen → Kunde unterschreibt per Link (mit SMS/Mail-Code) oder direkt auf dem Gerät → Status je Unterzeichner, Erinnerung, Widerruf\n\n**So funktioniert's:** Hängt direkt am Projekt (»Angebot zur Signatur senden«). Eigene Lösung, kein Pflicht-Drittanbieter.","x":4337,"y":2160,"width":460,"height":360,"color":"5"},
|
||||
{"id":"903e3384b0a5e623","type":"text","text":"**Detail-Flows:** 9 Wireframe-Pakete mit eigenen Canvases in `02 Wireframes/P2 Auth/` (Login, Signup, Reset, Set Password, 2FA, RBAC …) — siehe Tracker","x":2777,"y":480,"width":460,"height":220},
|
||||
|
||||
@@ -51,7 +51,7 @@ Gesamtkarte aller HiveGrid-v1-Features. Eine Karte = **ein Feature** (so benannt
|
||||
| Abnahme (Baustellen-Protokoll) 📱 | Auftrag & Baustelle | D-ABN | 🔴 | 🟡 vorgeplant |
|
||||
| Kampagnen & Empfängerlisten | E-Mail-Marketing | D-KAMP | 🟠 | ⬜ offen |
|
||||
| Versand-Technik & Statistiken 🌐 | E-Mail-Marketing | D-P14 | 🟠 | ⬜ offen |
|
||||
| Formulare (Baukasten) 🌐 | Termine & Formulare | D-FORM + D-P16 (Teil) | 🔴 | ⬜ zurückgestellt |
|
||||
| Formulare (Baukasten) 🌐 | Termine & Formulare | D-FORM + D-P16 (Teil) | 🔴 | 🟡 Review-Draft |
|
||||
| Online-Terminbuchung 🌐 | Termine & Formulare | D-BOOK + D-P16 (Teil) | 🟠 | ⬜ offen |
|
||||
| Kalender | Termine & Formulare | D-BOOK + D-P16 (Teil) | 🔴 mittel | ⬜ offen |
|
||||
| Digital unterschreiben (E-Signatur) | Termine & Formulare | D-P16 (Teil) | 🔵 | ⬜ offen |
|
||||
@@ -284,14 +284,14 @@ Abhaken = in der groben Planung berücksichtigt (Screens/Flow verortet). Quelle:
|
||||
|
||||
### Termine & Formulare
|
||||
|
||||
#### Formulare (Baukasten) 🌐 — `D-FORM` + `D-P16` (Teil) — ⬜ zurückgestellt (2026-07-09: Davids Mitarbeiter:in arbeitet daran; Infos folgen von David)
|
||||
- [ ] Formular-Baukasten: Felder per Ziehen anordnen (12 Feld-Typen), Feld-Einstellungen, Live-Vorschau
|
||||
- [ ] Wenn-Dann-Logik (»zeige Feld X, wenn Y = Z«)
|
||||
- [ ] Veröffentlichen + Teilen: Link, QR-Code, Website-Einbettung
|
||||
- [ ] Nach dem Absenden: Anfrage/Kontakt/Projekt/Aufgabe anlegen, Mail senden, Webhook, Automation starten (mit Feld-Zuordnung)
|
||||
- [ ] 🌐 Öffentliches Formular (Logik live, Spam-Schutz, Firmen-Logo, alle Zustände)
|
||||
- [ ] Formular-Liste + Antworten-Übersicht (Tabelle, Filter, CSV, PDF-Export, Aktions-Protokoll mit »nochmal ausführen«)
|
||||
- [ ] Renderer wiederverwendbar (steckt auch in HR-Anträgen, Buchungs-Fragen, Abnahme-Vorlagen)
|
||||
#### Formulare (Baukasten) 🌐 — `D-FORM` + `D-P16` (Teil) — 🟡 Review-Draft (2026-07-09)
|
||||
- [x] Formular-Zentrale, Formularart-Auswahl und einfacher Google-Forms-naher Haupteditor S02 als Subframe-Draft vorbereitet.
|
||||
- [x] Lead-Feldzuweisung ergänzt: S02L ordnet Formularfragen per Dropdown Lead-Feldern zu; E05 deckt fehlende oder unmögliche Zuweisungen ab.
|
||||
- [x] Advanced-Canvas, Logic, Actions und Publish-Blocker als Referenz-/Power-User-Richtung dokumentiert und verlinkt.
|
||||
- [x] 🌐 Öffentliches Formular mit Erfolg, nicht verfügbar und Captcha-/Submit-Fehler als Public States vorbereitet.
|
||||
- [x] Formular-Design und Antworten-Tabelle inklusive Empty-/Export-Fehlerzuständen vorbereitet.
|
||||
- [ ] David Review und Feinschliff der Subframe-Frames abschließen.
|
||||
- Paket: `02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/` (Mitarbeiterinnen-Paket eingebaut; Handoff erstellt)
|
||||
|
||||
#### Online-Terminbuchung 🌐 — `D-BOOK` + `D-P16` (Teil) — ⬜ offen
|
||||
- [ ] 🌐 Buchungs-Seite: freien Termin wählen (Zeitzonen-fest) → Fragen-Formular → Bestätigung + Kalender-Datei (.ics); einbettbar
|
||||
|
||||
@@ -0,0 +1,78 @@
|
||||
---
|
||||
kind: ticket-handoff
|
||||
project: HiveGrid Screen Project
|
||||
ticket: D-FORM
|
||||
area: Termine & Formulare / Form Builder / Public Forms
|
||||
status: Review / Handoff
|
||||
repo: https://git.tool-ctrl.de/david/Hivegrid-Wireframes
|
||||
stand: 2026-07-09
|
||||
---
|
||||
|
||||
# D-FORM Form Builder
|
||||
|
||||
Repo: https://git.tool-ctrl.de/david/Hivegrid-Wireframes
|
||||
|
||||
Zentrale Tracker-Datei: [Screen Paket Tracker](../../02%20Wireframes/Screen%20Paket%20Tracker.md)
|
||||
|
||||
Arbeitsbereich im Repo: [02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder](../../02%20Wireframes/D-FORM%20Formulare/WF-D-FORM%20Form%20Builder)
|
||||
|
||||
Start fuer Review: [00 Start hier - David](../../02%20Wireframes/D-FORM%20Formulare/WF-D-FORM%20Form%20Builder/00%20Start%20hier%20-%20David.md)
|
||||
|
||||
Uebergabe: [D-FORM David Uebergabe 2026-07-09](../../02%20Wireframes/D-FORM%20Formulare/WF-D-FORM%20Form%20Builder/D-FORM%20David%20Uebergabe%202026-07-09.md)
|
||||
|
||||
Canvas: [WF-D-FORM Form Builder.canvas](../../02%20Wireframes/D-FORM%20Formulare/WF-D-FORM%20Form%20Builder/WF-D-FORM%20Form%20Builder.canvas)
|
||||
|
||||
Subframe Flow: [WF-D-FORM Form Builder](https://app.subframe.com/f023064a5ca0/flow/afb1c257-46f0-4b23-aaed-d75f4773f1a9/edit?tab=ai&conversationId=02d948da-f9aa-4ab5-8352-2745789bb9ad)
|
||||
|
||||
## Kurzfassung
|
||||
|
||||
Das D-FORM-Mitarbeiterinnen-Paket wurde in den Haupt-Vault uebernommen und auf `WF-D-FORM Form Builder` normalisiert. Es enthaelt einen reviewfaehigen Subframe-Draft fuer Formular-Zentrale, einfachen Form-Builder, Lead-Feldzuweisung, Public Form, Public States, Design und Antworten-Tabelle.
|
||||
|
||||
Der empfohlene Hauptfluss ist der einfache Google-Forms-nahe Editor `S02`. Der alte Advanced-Canvas bleibt als Referenz/Power-User-Richtung erhalten.
|
||||
|
||||
## Gemacht
|
||||
|
||||
- Paket unter `02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/` eingebaut.
|
||||
- Paket-MD, Screens, Varianten, Canvas, Review-Checkliste, Bauplan, Bau-Log und David-Uebergabe uebernommen.
|
||||
- Paketname von `WF-P16 Form Builder` auf `WF-D-FORM Form Builder` normalisiert, weil `P16` im Vault bereits Termine/Kalender/Signatur belegt.
|
||||
- Canvas-Datei auf die neuen D-FORM-Pfade umgeschrieben und als JSON validiert.
|
||||
- `Screen Paket Tracker` um Flow, Screen-/State-Zeilen und D-FORM-Entscheidungen erweitert.
|
||||
- `HiveGrid Map` von `zurueckgestellt` auf `Review-Draft` aktualisiert.
|
||||
|
||||
## Review-Punkte
|
||||
|
||||
- Pruefen, ob `S02 Einfacher Fragen Editor` als Haupteditor fuer Handwerksbetriebe die richtige Richtung ist.
|
||||
- Pruefen, ob `S02L Lead Felder zuweisen` und `E05 S02 Lead Zuweisung pruefen` fuer Davids Lead-Mapping-Anforderung reichen.
|
||||
- Public-Strecke `S04`, `V01`, `V02`, `V03` auf Copy, mobile Nutzbarkeit und Trust pruefen.
|
||||
- Entscheiden, ob `ADV-S01`, `ADV-S01-2`, `D07`, `D08`, `D09` nur Referenz bleiben oder spaeter als Power-User-Flow nachgezogen werden.
|
||||
- Klaeren, ob die dokumentierten Modale `M01` bis `M04` als echte Dialog-Screens gebaut werden muessen.
|
||||
|
||||
## Flow-Paket
|
||||
|
||||
| Flow | Status | Repo | Canvas | Subframe |
|
||||
|---|---|---|---|---|
|
||||
| WF-D-FORM Form Builder | Review / Subframe Draft | [MD](../../02%20Wireframes/D-FORM%20Formulare/WF-D-FORM%20Form%20Builder/WF-D-FORM%20Form%20Builder.md) | [Canvas](../../02%20Wireframes/D-FORM%20Formulare/WF-D-FORM%20Form%20Builder/WF-D-FORM%20Form%20Builder.canvas) | [Flow](https://app.subframe.com/f023064a5ca0/flow/afb1c257-46f0-4b23-aaed-d75f4773f1a9/edit?tab=ai&conversationId=02d948da-f9aa-4ab5-8352-2745789bb9ad) |
|
||||
|
||||
## Hauptscreens
|
||||
|
||||
| ID | Screen | Subframe |
|
||||
|---|---|---|
|
||||
| S00 | Formulare verwalten | [Subframe](https://app.subframe.com/f023064a5ca0/design/2325aa7a-d968-4028-8282-0823b15bf964/edit) |
|
||||
| E01 | S00 Keine Formulare | [Subframe](https://app.subframe.com/f023064a5ca0/design/136c11b3-8310-4165-b4ba-9cf099ee0873/edit) |
|
||||
| E02 | S00 Keine Treffer | [Subframe](https://app.subframe.com/f023064a5ca0/design/ccf8d2f7-e7b4-4ffd-87f6-1785edc1b2f7/edit) |
|
||||
| S01 | Formularart auswaehlen | [Subframe](https://app.subframe.com/f023064a5ca0/design/c423ebcd-914f-4038-ab9f-7c2a745a8bec/edit) |
|
||||
| S02 | Einfacher Fragen Editor | [Subframe](https://app.subframe.com/f023064a5ca0/design/181aaa0f-5ae7-4f74-acf7-8273fbbe4dd5/edit) |
|
||||
| S02L | Lead Felder zuweisen | [Subframe](https://app.subframe.com/f023064a5ca0/design/c8aa80cb-0cc8-473f-9fac-a09d395e6571/edit) |
|
||||
| E05 | S02 Lead Zuweisung pruefen | [Subframe](https://app.subframe.com/f023064a5ca0/design/26600ce4-7baf-4ffb-9955-7c7d1eef99d1/edit) |
|
||||
| S03 | Formular Design | [Subframe](https://app.subframe.com/f023064a5ca0/design/090f06a9-3fa7-4442-b8bc-035e95de7329/edit) |
|
||||
| S04 | Oeffentliches Formular | [Subframe](https://app.subframe.com/f023064a5ca0/design/caef9ddd-03d6-4a26-8dc1-16aa198a7304/edit) |
|
||||
| V01 | Public Erfolg oder Redirect | [Subframe](https://app.subframe.com/f023064a5ca0/design/c06ecfc3-1f86-4dfe-9cfd-cec8b8629253/edit) |
|
||||
| V02 | Public Formular nicht verfuegbar | [Subframe](https://app.subframe.com/f023064a5ca0/design/f96ec12a-5e6a-471d-9a9c-6babcb57c74c/edit) |
|
||||
| V03 | Public Captcha oder Submit Fehler | [Subframe](https://app.subframe.com/f023064a5ca0/design/95c96bc9-35d4-47ce-b510-7d8ea1f41936/edit) |
|
||||
| S05 | Antworten Tabelle | [Subframe](https://app.subframe.com/f023064a5ca0/design/9e8eeab7-44ea-4b77-85e6-0818d97e1ac3/edit) |
|
||||
| E03 | S05 Keine Antworten | [Subframe](https://app.subframe.com/f023064a5ca0/design/6f56c14f-d66e-4734-8a29-a900ac74a8a7/edit) |
|
||||
| E04 | S05 Export Fehler | [Subframe](https://app.subframe.com/f023064a5ca0/design/00553ea4-9839-4d22-b540-9b9ef0bf014f/edit) |
|
||||
|
||||
## Hinweis fuer Ticket-System
|
||||
|
||||
Diese Datei ist der kompakte Handoff fuer `D-FORM`. Fuer Detailentscheidungen, zusaetzliche Referenzscreens, dokumentierte D-/M-Zustaende und offene Review-Fragen sind der [Screen Paket Tracker](../../02%20Wireframes/Screen%20Paket%20Tracker.md) und das Paket [WF-D-FORM Form Builder](../../02%20Wireframes/D-FORM%20Formulare/WF-D-FORM%20Form%20Builder/WF-D-FORM%20Form%20Builder.md) massgeblich.
|
||||
@@ -20,3 +20,4 @@ Die Detailwahrheit bleibt in den Wireframe-Paketen und im `Screen Paket Tracker`
|
||||
|---|---|
|
||||
| D-P2 | [D-P2 Auth Wireframes](<Fertige Tickets/D-P2 Auth Wireframes.md>) |
|
||||
| D-D0b | [D-D0b Layout Standards](<Fertige Tickets/D-D0b Layout Standards.md>) |
|
||||
| D-FORM | [D-FORM Form Builder](<Fertige Tickets/D-FORM Form Builder.md>) |
|
||||
Reference in new issue
Block a user