toolctrl-labs/HiveGrid-Wireframes
9
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

P12 Flow-Editor Neuausrichtung + alle 30 Baustein-Konfig-Modale

Browse Source 
- Flow-Editor auf n8n-Stil umgestellt: V1 Vollbild minimal als Basis (Vollbild-Canvas, Umschalter Bauen/Aktivität/Auswertung, Probelauf unten Mitte, Aktiv-Toggle + History im Header)
- Baustein-Konfig als Modal entschieden (Dialog-Komponente); S05a Vorplanung mit allen 31 Panels, 30 v1-Panels in Subframe gebaut (K-Seiten, Nacht-Build 2026-07-12)
- Subframe-Links + Abgleich-Notizen in P12-Screens und Tracker nachgetragen
- D-FORM Form Builder: Review-Stand, Simple-Builder-Neuausrichtung, aufgeräumte Varianten
- P15 Kommunikation + P16 Termine Pakete, Map/Canvas-Pflege

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
davidandClaude Fable 5 committed 2026-07-13 19:45:43 +02:00
1 parent ef07e3d005
commit 04220c1431
100 files changed
+10937 -2185
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

.obsidian/community-plugins.json
Vendored
+3 -1
View File
@@ -1,3 +1,5 @@
[
"editor-width-slider"
"editor-width-slider",
"better-embedded-canvas",
"advanced-canvas"
]
.obsidian/plugins/advanced-canvas/main.js
Vendored
+7770
View File
File diff suppressed because it is too large. Load diff
.obsidian/plugins/advanced-canvas/manifest.json
Vendored
+11
View File
@@ -0,0 +1,11 @@
{
"id": "advanced-canvas",
"name": "Advanced Canvas",
"version": "6.4.0",
"minAppVersion": "1.7.2",
"description": "Supercharge your canvas experience! Create presentations, flowcharts and more!",
"author": "Developer-Mike",
"authorUrl": "https://github.com/Developer-Mike",
"fundingUrl": "https://ko-fi.com/X8X27IA08",
"isDesktopOnly": false
}
.obsidian/plugins/advanced-canvas/styles.css
Vendored
+536
View File
@@ -0,0 +1,536 @@
/* src/styles.scss */
.ac-settings .properties-field > .setting-item-info {
flex: 0;
margin: 0;
padding: var(--size-4-1) var(--size-4-2);
border: var(--input-border-width) solid var(--background-modifier-border);
border-radius: var(--input-radius) 0 0 var(--input-radius);
}
.ac-settings .properties-field > .setting-item-control > input {
width: 100%;
border-radius: 0 var(--input-radius) var(--input-radius) 0;
}
.ac-settings .ac-settings-heading:not(:first-child) {
margin-top: var(--size-4-10) !important;
}
.ac-settings .ac-settings-heading:has(.checkbox-container:not(.is-enabled)) {
border-bottom-color: var(--background-modifier-border-hover);
}
.ac-settings .ac-settings-heading .setting-item-description {
margin-inline-end: 20px;
}
.ac-settings .settings-header-children {
transform-origin: top center;
transform: scaleY(1);
transition: transform 0.2s ease-in-out;
}
.ac-settings .ac-settings-heading:has(.checkbox-container:not(.is-enabled)) + .settings-header-children {
opacity: 0.5;
pointer-events: none;
height: 0;
transform: scaleY(0);
}
.ac-settings .setting-item > .setting-item-control input[type=text] {
width: 75px;
}
.ac-settings details.setting-item {
flex-direction: column;
align-items: initial;
}
.ac-settings details.setting-item:not([open]) {
row-gap: 0;
}
.ac-settings details.setting-item[open] {
padding-bottom: var(--size-4-2);
}
.ac-settings details.setting-item[open] > summary {
margin-bottom: var(--size-4-2);
}
.ac-settings details.setting-item > *:not(summary) {
border: 1px solid var(--background-primary);
}
.ac-settings .kofi-banner {
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
padding: var(--size-4-3);
background-color: var(--background-primary-alt);
border-radius: var(--radius-m);
}
.ac-settings .kofi-banner .ac-kofi-banner-title {
margin: 0;
font-size: var(--font-ui-small);
font-weight: 600;
}
.ac-settings .kofi-banner .ac-kofi-button {
width: min-content;
height: min-content;
line-height: 0;
}
.ac-settings .kofi-banner .ac-kofi-button img {
min-width: 75px;
width: 25%;
max-width: 100px;
}
.canvas-wrapper > .document-search-container {
transform: translateZ(0);
margin: 0;
}
.canvas-wrapper:not(.mod-readonly) .show-while-readonly {
display: none;
}
.canvas-control-item[data-toggled=true] {
background-color: var(--color-accent);
}
.canvas-control-item[data-toggled=true] svg {
stroke: var(--text-on-accent);
}
.reactive-node,
.canvas-node[data-shape=database],
.canvas-node[data-shape=document],
.canvas-node[data-shape=predefined-process],
.canvas-node[data-shape=diamond] {
--border-color: rgb(var(--canvas-color));
--border-width: 3px;
--box-shadow: none;
}
.reactive-node.is-focused,
.is-focused.canvas-node[data-shape=database],
.is-focused.canvas-node[data-shape=document],
.is-focused.canvas-node[data-shape=predefined-process],
.is-focused.canvas-node[data-shape=diamond],
.reactive-node.is-selected,
.is-selected.canvas-node[data-shape=database],
.is-selected.canvas-node[data-shape=document],
.is-selected.canvas-node[data-shape=predefined-process],
.is-selected.canvas-node[data-shape=diamond] {
--border-color: var(--color-accent);
--border-width: 5px;
--box-shadow: var(--shadow-border-accent);
}
.reactive-node.is-themed,
.is-themed.canvas-node[data-shape=database],
.is-themed.canvas-node[data-shape=document],
.is-themed.canvas-node[data-shape=predefined-process],
.is-themed.canvas-node[data-shape=diamond] {
--border-color: rgba(var(--canvas-color), 0.7);
}
.reactive-node.is-themed.is-focused,
.is-themed.is-focused.canvas-node[data-shape=database],
.is-themed.is-focused.canvas-node[data-shape=document],
.is-themed.is-focused.canvas-node[data-shape=predefined-process],
.is-themed.is-focused.canvas-node[data-shape=diamond],
.reactive-node.is-themed.is-selected,
.is-themed.is-selected.canvas-node[data-shape=database],
.is-themed.is-selected.canvas-node[data-shape=document],
.is-themed.is-selected.canvas-node[data-shape=predefined-process],
.is-themed.is-selected.canvas-node[data-shape=diamond] {
--border-color: rgb(var(--canvas-color));
--box-shadow: var(--shadow-border-themed);
}
.canvas-node[data-text-align=center] .markdown-preview-view {
scrollbar-gutter: auto;
}
.canvas-node[data-text-align=center] .markdown-preview-view .markdown-preview-section {
display: flex;
flex-direction: column;
justify-content: center;
text-align: center;
vertical-align: middle;
}
.canvas-node[data-text-align=right] {
text-align: right;
}
.canvas-node[data-shape] .canvas-node-container .markdown-preview-view.markdown-rendered {
transform: unset;
}
.canvas-node[data-shape=pill] .canvas-node-container {
border-radius: 5000px;
}
.canvas-node[data-shape=diamond] {
}
.canvas-node[data-shape=diamond].is-focused,
.canvas-node[data-shape=diamond].is-selected {
border-radius: var(--radius-m);
outline: 2px solid var(--color-accent);
outline-offset: 5px;
}
.canvas-node[data-shape=diamond] .canvas-node-container {
border: none;
box-shadow: none !important;
}
.canvas-node[data-shape=diamond] .canvas-node-container:not(:has(.embed-iframe)) {
mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 141.42135624 141.42135624' preserveAspectRatio='none'%3E%3Cstyle%3E rect %7B transform-origin: center; transform: rotate(45deg) scale(1.05); %7D %3C/style%3E%3Crect rx='8' x='20.71067812' y='20.71067812' width='100' height='100' /%3E%3C/svg%3E");
-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 141.42135624 141.42135624' preserveAspectRatio='none'%3E%3Cstyle%3E rect %7B transform-origin: center; transform: rotate(45deg) scale(1.05); %7D %3C/style%3E%3Crect rx='8' x='20.71067812' y='20.71067812' width='100' height='100' /%3E%3C/svg%3E");
mask-repeat: no-repeat;
-webkit-mask-repeat: no-repeat;
mask-size: 100%;
-webkit-mask-size: 100%;
}
.canvas-node[data-shape=diamond] .canvas-node-container .canvas-node-placeholder::after {
mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 141.42135624 141.42135624' preserveAspectRatio='none'%3E%3Cstyle%3E rect %7B transform-origin: center; transform: rotate(45deg) scale(1.05); %7D %3C/style%3E%3Crect rx='8' x='20.71067812' y='20.71067812' width='100' height='100' /%3E%3C/svg%3E");
-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 141.42135624 141.42135624' preserveAspectRatio='none'%3E%3Cstyle%3E rect %7B transform-origin: center; transform: rotate(45deg) scale(1.05); %7D %3C/style%3E%3Crect rx='8' x='20.71067812' y='20.71067812' width='100' height='100' /%3E%3C/svg%3E");
mask-repeat: no-repeat;
-webkit-mask-repeat: no-repeat;
mask-size: 100%;
-webkit-mask-size: 100%;
}
.canvas-node[data-shape=diamond]::before {
mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 141.42135624 141.42135624' preserveAspectRatio='none'%3E%3Cstyle%3E rect %7B transform-origin: center; transform: rotate(45deg) scale(1.05); %7D %3C/style%3E%3Crect rx='8' x='20.71067812' y='20.71067812' width='100' height='100' /%3E%3C/svg%3E");
-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 141.42135624 141.42135624' preserveAspectRatio='none'%3E%3Cstyle%3E rect %7B transform-origin: center; transform: rotate(45deg) scale(1.05); %7D %3C/style%3E%3Crect rx='8' x='20.71067812' y='20.71067812' width='100' height='100' /%3E%3C/svg%3E");
mask-repeat: no-repeat;
-webkit-mask-repeat: no-repeat;
mask-size: 100%;
-webkit-mask-size: 100%;
content: "";
position: absolute;
top: calc(var(--border-width) * -1);
left: calc(var(--border-width) * -1);
width: calc(100% + var(--border-width) * 2);
height: calc(100% + var(--border-width) * 2);
background-color: var(--border-color);
}
.canvas-node[data-shape=parallelogram] .canvas-node-container {
transform: skewX(-20deg);
backface-visibility: hidden;
}
.canvas-node[data-shape=parallelogram] .canvas-node-container .canvas-node-content > .markdown-embed-content {
transform: skewX(20deg);
}
.canvas-node[data-shape=circle] .canvas-node-container {
border-radius: 50%;
}
.canvas-node[data-shape=circle] .canvas-node-container .markdown-preview-view {
overflow-y: initial;
}
.canvas-node[data-shape=predefined-process] .canvas-node-container .canvas-node-content {
padding: 0 10px;
}
.canvas-node[data-shape=predefined-process] .canvas-node-container::before,
.canvas-node[data-shape=predefined-process] .canvas-node-container::after {
content: "";
z-index: 1;
position: absolute;
top: 0;
width: 0;
height: 100%;
border-left: var(--border-width) solid var(--border-color);
}
.canvas-node[data-shape=predefined-process] .canvas-node-container::before {
left: calc(10px - var(--border-width));
}
.canvas-node[data-shape=predefined-process] .canvas-node-container::after {
right: calc(10px - var(--border-width));
}
.canvas-node[data-shape=document] {
--border-width: 2.5px;
filter: drop-shadow(0 var(--border-width) 0 var(--border-color)) drop-shadow(0 calc(var(--border-width) * -1) 0 var(--border-color));
}
.canvas-node[data-shape=document] .canvas-node-container {
mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 75 45' preserveAspectRatio='none'%3E%3Cpath d='M75 0 75 39.375Q56.25 29.25 37.5 39.375 18.75 49.5 0 39.375L0 0Z' /%3E%3C/svg%3E");
-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 75 45' preserveAspectRatio='none'%3E%3Cpath d='M75 0 75 39.375Q56.25 29.25 37.5 39.375 18.75 49.5 0 39.375L0 0Z' /%3E%3C/svg%3E");
mask-repeat: no-repeat;
-webkit-mask-repeat: no-repeat;
mask-size: 100%;
-webkit-mask-size: 100%;
border: var(--border-width) solid var(--border-color);
border-top: none;
border-bottom: none;
}
.canvas-node[data-shape=document].is-focused,
.canvas-node[data-shape=document].is-selected {
--border-width: 4px;
}
.canvas-node[data-shape=database] {
}
.canvas-node[data-shape=database] .canvas-node-container {
border: var(--border-width) solid var(--border-color);
border-bottom: 0;
border-top: 0;
border-radius: 0;
box-shadow: none !important;
}
.canvas-node[data-shape=database] .canvas-node-container .canvas-node-placeholder {
transform: translateY(25px);
}
.canvas-node[data-shape=database]::before,
.canvas-node[data-shape=database]::after {
content: "";
position: absolute;
left: 0;
box-sizing: border-box;
width: 100%;
height: 50px;
border-radius: 50%;
border: var(--border-width) solid var(--border-color);
background-color: var(--background-primary);
}
.canvas-node[data-shape=database]::after {
top: -25px;
}
.canvas-node[data-shape=database]::before {
bottom: -25px;
}
.canvas-node[data-shape=database].is-themed .canvas-node-content {
background-color: transparent;
}
.canvas-node[data-shape=database].is-themed:not(:has(.embed-iframe)) .canvas-node-container,
.canvas-node[data-shape=database].is-themed:not(:has(.embed-iframe))::after,
.canvas-node[data-shape=database].is-themed:not(:has(.embed-iframe))::before {
box-shadow: inset 0 0 0 1000px rgba(var(--canvas-color), 0.07) !important;
}
.canvas-node[data-shape=database] .canvas-node-content:not(:has(.embed-iframe)) {
transform: translateY(20px);
}
.canvas-node[data-shape=database]:has(.embed-iframe)::after {
z-index: -1;
}
.canvas-node[data-border=dashed] .canvas-node-container {
box-shadow: none;
border-style: dashed;
}
.canvas-node[data-border=dotted] .canvas-node-container {
box-shadow: none;
border-style: dotted;
}
.canvas-node[data-border=invisible] {
box-shadow: none;
}
.canvas-node[data-border=invisible]:not(.is-focused):not(.is-selected) .canvas-node-container {
border-color: transparent !important;
}
.canvas-node[data-border=invisible] .canvas-node-label {
display: none;
}
.canvas-node[data-border=invisible] .canvas-node-container {
background-color: transparent;
box-shadow: none;
}
.canvas-node[data-border][data-shape=predefined-process] {
--border-width: 2px;
}
.canvas-node[data-border][data-shape=predefined-process] .is-focused,
.canvas-node[data-border][data-shape=predefined-process] .is-selected {
--border-width: 2px;
}
.canvas-node[data-border=dashed][data-shape=predefined-process] .canvas-node-container::before,
.canvas-node[data-border=dashed][data-shape=predefined-process] .canvas-node-container::after {
border-left: var(--border-width) dashed var(--border-color);
}
.canvas-node[data-border=dotted][data-shape=predefined-process] .canvas-node-container::before,
.canvas-node[data-border=dotted][data-shape=predefined-process] .canvas-node-container::after {
border-left: var(--border-width) dotted var(--border-color);
}
.canvas-node[data-border][data-shape=document] .canvas-node-container {
border-top: none;
border-bottom: none;
}
.canvas-edges path[data-path=dotted] {
stroke-dasharray: calc(3px * var(--zoom-multiplier));
}
.canvas-edges path[data-path=short-dashed] {
stroke-dasharray: 9px;
}
.canvas-edges path[data-path=long-dashed] {
stroke-dasharray: 18px;
}
.canvas-edges [data-arrow=triangle-outline] polygon,
.canvas-edges [data-arrow=diamond-outline] polygon,
.canvas-edges [data-arrow=circle-outline] polygon {
fill: var(--canvas-background);
stroke: rgb(var(--canvas-color));
stroke-width: calc(3px * var(--zoom-multiplier));
}
.canvas-edges [data-arrow=thin-triangle] polygon {
fill: transparent;
stroke: rgb(var(--canvas-color));
stroke-width: calc(4px * var(--zoom-multiplier));
}
.icon-modal-suggestion {
display: flex;
align-items: center;
gap: var(--size-4-4);
}
.icon-modal-suggestion .icon-modal-suggestion-icon {
line-height: 0;
}
.icon-modal-suggestion .icon-modal-suggestion-id {
font-size: var(--font-ui-smaller);
color: var(--text-muted);
}
.canvas.is-exporting {
--zoom-multiplier: 1;
}
.canvas.is-exporting * {
pointer-events: none !important;
transition: none !important;
}
.canvas.is-exporting .collapse-button {
display: none;
}
.canvas.is-exporting #watermark-ac {
z-index: 9999999;
position: absolute;
}
.canvas-wrapper[data-collapsible-groups-feature-enabled=true] .canvas.is-exporting .canvas-node .canvas-group-label {
left: 0;
}
.progress-bar-modal-ac {
margin-top: 0.75em;
}
.progress-bar-modal-ac.error .setting-progress-bar {
color: var(--color-error);
}
.canvas-wrapper[data-disable-font-size-relative-to-zoom=true] {
--zoom-multiplier: 1 !important;
}
.canvas-wrapper.mod-readonly .canvas-controls .canvas-control-group:nth-child(3),
.canvas-wrapper.mod-readonly .canvas-card-menu {
display: none;
}
.canvas-wrapper.mod-readonly[data-hide-background-grid-when-in-readonly=true] .canvas-background {
visibility: hidden;
}
.collapse-button {
position: absolute;
left: 0;
top: calc(-1 * var(--size-4-1) * var(--zoom-multiplier));
padding: var(--size-4-1) var(--size-4-2);
transform-origin: bottom left;
transform: translate(0, -100%) scale(var(--zoom-multiplier));
border-radius: var(--radius-s);
color: var(--text-muted);
background-color: rgba(var(--canvas-color), 0.1);
font-size: 1.5em;
line-height: 1;
pointer-events: initial;
cursor: pointer;
transition: transform 500ms cubic-bezier(0.16, 1, 0.3, 1);
}
.canvas-wrapper[data-collapsible-groups-feature-enabled=true] .canvas-node .canvas-group-label {
left: calc(40px * var(--zoom-multiplier));
}
.canvas-node[data-collapsed] .canvas-node-container {
display: none;
}
.canvas-node[data-collapsed] .canvas-group-label {
max-width: initial;
}
.canvas-wrapper[data-collapsed-group-preview-on-drag=true][data-is-dragging] .canvas-node[data-collapsed] .canvas-node-container {
display: block;
opacity: 0.5;
border-style: dashed;
}
.canvas-wrapper[data-collapsed-group-preview-on-drag=true][data-is-dragging] .canvas-node[data-collapsed] .canvas-node-container .canvas-node-content {
background-color: transparent;
}
.canvas-node-interaction-layer[data-target-collapsed] .canvas-node-resizer {
pointer-events: none;
cursor: inherit;
}
.canvas-node-interaction-layer[data-target-collapsed] .canvas-node-resizer .canvas-node-connection-point {
display: none;
pointer-events: none;
}
.canvas-wrapper[data-allow-floating-edge-creation=true] .canvas.is-connecting .canvas-node:not(.canvas-node-group)::after {
all: unset;
content: "";
z-index: 100;
position: absolute;
top: 50%;
left: 50%;
width: max(10px, 100% - 50px * var(--zoom-multiplier) * 2);
height: max(10px, 100% - 50px * var(--zoom-multiplier) * 2);
transform: translate(-50%, -50%);
border-radius: var(--radius-m);
outline: calc(4px * var(--zoom-multiplier)) dashed hsla(var(--color-accent-hsl), 0.5);
}
.canvas-wrapper[data-allow-floating-edge-creation=true] .canvas.is-connecting .canvas-node:not(.canvas-node-group).hovering-floating-edge-zone::after {
outline-color: var(--color-accent);
outline-style: solid;
background-color: hsla(var(--color-accent-hsl), 0.1);
}
.canvas-wrapper[data-focus-mode-enabled=true] .canvas:has(.canvas-node.is-focused) .canvas-node:not(.is-focused) {
filter: blur(5px);
}
.canvas-wrapper[data-focus-mode-enabled=true] .canvas:has(.canvas-node.is-focused) .canvas-edges > g:not(.is-focused) {
filter: blur(5px);
}
.canvas-wrapper[data-focus-mode-enabled=true] .canvas:has(.canvas-node.is-focused) .canvas-path-label-wrapper > .canvas-path-label:not(.is-focused) {
filter: blur(5px);
}
.canvas-wrapper.presentation-mode .canvas-controls {
visibility: hidden;
}
.canvas-wrapper.presentation-mode .canvas-card-menu {
visibility: hidden;
}
.canvas-wrapper:not(.presentation-mode) .canvas-node[data-is-start-node=true]::before {
content: "Start";
position: absolute;
top: calc(-1 * var(--size-4-1) * var(--zoom-multiplier));
right: 0;
transform: translate(0, -100%) scale(var(--zoom-multiplier));
transform-origin: bottom right;
max-width: calc(100% / var(--zoom-multiplier));
padding: var(--size-4-1) var(--size-4-2);
font-size: 1em;
border-radius: var(--radius-s);
color: var(--color-green);
background-color: rgba(var(--color-green-rgb), 0.1);
}
.canvas-node[data-is-portal-loaded=true] {
pointer-events: all;
}
.canvas-node[data-is-portal-loaded=true]:not(.is-focused) {
pointer-events: none;
}
.canvas-node[data-is-portal-loaded=true]:not(.is-focused) .canvas-node-label {
pointer-events: all;
}
.canvas-node[data-is-portal-loaded=true] .canvas-node-container {
background-color: transparent;
border-style: dashed;
}
.canvas-node[data-is-portal-loaded=true] .canvas-node-container .canvas-node-content {
display: none;
}
.canvas-node-interaction-layer[data-is-from-portal=true] .canvas-node-resizer {
pointer-events: none;
cursor: inherit;
}
.canvas-node-interaction-layer[data-is-from-portal=true] .canvas-node-resizer .canvas-node-connection-point {
pointer-events: all;
}
.ac-card-embed {
display: flex;
flex-direction: column;
overflow: hidden;
background-color: var(--background-primary);
border: 1px solid rgb(var(--canvas-color));
border-radius: var(--radius-m);
box-shadow: var(--shadow-stationary);
}
.ac-card-embed.is-themed {
background-color: rgba(var(--canvas-color), 0.07);
border-color: rgba(var(--canvas-color), 0.7);
box-shadow: inset 0 0 0 1px rgba(var(--canvas-color), 0.7), var(--shadow-stationary);
}
.ac-card-embed > .markdown-content {
position: relative;
overflow-y: auto;
overflow-wrap: break-word;
display: flex;
flex-direction: column;
width: 100%;
height: 100%;
padding: 0 var(--size-4-4);
font-size: var(--font-text-size);
font-family: var(--font-text);
line-height: var(--line-height-normal);
color: var(--text-normal);
user-select: text;
-webkit-user-select: text;
scrollbar-gutter: stable;
}
.obsidian/plugins/better-embedded-canvas/main.js
Vendored
+9
View File
@@ -0,0 +1,9 @@
/*
THIS IS A GENERATED/BUNDLED FILE BY ESBUILD
if you want to view the source, please visit the github repository of this plugin:
https://github.com/kotaindah55/better-embedded-canvas
*/
var P=Object.defineProperty;var _=Object.getOwnPropertyDescriptor;var q=Object.getOwnPropertyNames;var G=Object.prototype.hasOwnProperty;var j=(n,e)=>{for(var t in e)P(n,t,{get:e[t],enumerable:!0})},w=(n,e,t,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let s of q(e))!G.call(n,s)&&s!==t&&P(n,s,{get:()=>e[s],enumerable:!(i=_(e,s))||i.enumerable});return n},k=(n,e,t)=>(w(n,e,"default"),t&&w(t,e,"default"));var Q=n=>w(P({},"__esModule",{value:!0}),n);var te={};j(te,{BetterEmbeddedCanvasPlugin:()=>C,default:()=>ee});module.exports=Q(te);var a={};k(a,require("obsidian"));function U(n){return{app:n,containerEl:createDiv(),history:{backHistory:[],forwardHistory:[]}}}function D(n){let e=n.internalPlugins.getPluginById("canvas").views.canvas;u=e(U(n)).canvas.constructor}var u;function O(n){let e=new u(n);return e.quickSettingsButton.parentElement?.detach(),e.undoBtnEl.parentElement?.detach(),a.Platform.isMobile||e.canvasControlsEl.lastElementChild?.detach(),e.cardMenuEl.detach(),e.setReadonly(!0),e.wrapperEl.addEventListener("drop",t=>t.preventDefault(),!0),e}function I(n,e,t){let i=n.embedRegistry,s=i.embedByExtension[e]??null;return i.unregisterExtension(e),i.registerExtension(e,t),s}function g(n,e){return n.internalPlugins.getPluginById(e)}function x(n){return n.matches("body > div.print *")}var S={A3:{width:1123,height:1587},A4:{width:794,height:1123},A5:{width:559,height:794},Legal:{width:816,height:1344},Letter:{width:816,height:1054},Tabloid:{width:1056,height:1632}},A=37;var L={tooltipOpenCanvas:"Open canvas",tooltipEnableInteraction:"Enable interaction",tooltipDisableInteraction:"Disable interaction",reloadNotesPrompt:{title:"Reload notes",desc:"Select \u201CReload\u201D to reload all open notes and revert embedded canvases to their default (your data is preserved).",buttonReload:"Reload"},settings:{showCanvasName:{name:"Show canvas name",desc:"Show canvas name as embed title."}}};var M={tooltipOpenCanvas:"Buka kanvas",tooltipEnableInteraction:"Nyalakan interaksi",tooltipDisableInteraction:"Matikan interaksi",reloadNotesPrompt:{title:"Muat ulang catatan",desc:"Pilih \u201CMuat ulang\u201D untuk memuat ulang catatan yang terbuka dan mengembalikan kanvas yang disematkan pada tampilan bawaan (data Anda tetap terjaga).",buttonReload:"Muat ulang"},settings:{showCanvasName:{name:"Tampilkan nama kanvas",desc:"Tampilkan nama kanvas sebagai judul sematan."}}};var T=i18next.createInstance({lng:(0,a.getLanguage)(),fallbackLng:"en",resources:{en:{translation:L},id:{translation:M}}});T.init();var l=T.t.bind(T);var c=new Map,p=new Map;function X(n){let{wrapperEl:e}=n,t=e.getBoundingClientRect(),i=t.left+e.clientLeft,s=t.top+e.clientTop,r=e.clientWidth,o=e.clientHeight;n.canvasRect={left:i,top:s,width:r,height:o,cx:i+r/2,cy:s+o/2,minX:-r/2,minY:-o/2,maxX:r/2,maxY:r/2}}function B(){p.has(this)||p.set(this,(0,a.debounce)(()=>{c.get(this)?.forEach(n=>X(n.canvas)),p.delete(this)},20)())}function R(n){c.forEach(e=>e.forEach(n))}function N(n){let e=n.contentEl.win,t=c.get(e);t?t.add(n):(c.set(e,new Set([n])),e.addEventListener("scroll",B,{capture:!0,passive:!0}))}function z(n){let e=n.contentEl.win,t=c.get(e);t?.delete(n),t&&!t.size&&(p.get(e)?.cancel(),p.delete(e),c.delete(e),e.removeEventListener("scroll",B,!0))}function H(){p.forEach(n=>n.cancel()),p.clear(),c.forEach((n,e)=>{e.removeEventListener("scroll",B,!0),n.forEach(t=>t.unload())}),c.clear()}var K=300;function $(n){return n.matches(".canvas-node *")}var h=class n extends a.Component{app;canvas;contentEl;plugin;file;ctx;subpath;becPlugin;containerEl;headerEl;mainControlsEl;zoomControlsEl;openCanvasBtnEl;toggleInteractionBtnEl;resizeObserver;mutationObserver;constructor(e,t,i,s){super(),this.app=t.app,this.plugin=g(this.app,"canvas").instance,this.becPlugin=e,this.ctx=t,this.file=i,this.subpath=s,this.containerEl=t.containerEl,this.containerEl.addClass("canvas-embed","better-canvas-embed"),this.containerEl.toggleClass("inline-embed",t.showInline??!1),this.headerEl=this.containerEl.createDiv("embed-title",r=>{r.createSpan("file-embed-icon",o=>(0,a.setIcon)(o,"lucide-layout-dashboard")),r.appendText(" "+i.basename),r.addEventListener("click",o=>this.openOnClick(o)),r.toggle(e.settings.get("showCanvasName"))}),this.contentEl=this.containerEl.createDiv("canvas-content"),this.resizeObserver=new ResizeObserver(()=>this.canvas.onResize()),this.mutationObserver=new MutationObserver(()=>this.updateHeight()),this.canvas=O(this),this.zoomControlsEl=this.canvas.canvasControlsEl.firstElementChild,this.mainControlsEl=this.canvas.canvasControlsEl.createDiv({cls:["canvas-control-group","mod-raised"],prepend:!0}),this.openCanvasBtnEl=this.mainControlsEl.createDiv("canvas-control-item",r=>{(0,a.setIcon)(r,"lucide-maximize-2"),(0,a.setTooltip)(r,l("tooltipOpenCanvas"),{placement:"left"}),r.addEventListener("click",o=>this.openOnClick(o))}),this.toggleInteractionBtnEl=this.mainControlsEl.createDiv("canvas-control-item",r=>{(0,a.setIcon)(r,"pointer"),(0,a.setTooltip)(r,l("tooltipLine truncated
/* nosourcemap */
.obsidian/plugins/better-embedded-canvas/manifest.json
Vendored
+10
View File
@@ -0,0 +1,10 @@
{
"id": "better-embedded-canvas",
"name": "Better Embedded Canvas",
"version": "0.2.4",
"minAppVersion": "1.10.0",
"description": "Give your embedded canvas better display and interactivity.",
"author": "Kotaindah55",
"authorUrl": "https://github.com/kotaindah55",
"isDesktopOnly": false
}
.obsidian/plugins/better-embedded-canvas/styles.css
Vendored
+1
View File
@@ -0,0 +1 @@
body{--embedded-canvas-min-height: 300px;--embedded-canvas-border-width: 1px;--embedded-canvas-border-color: var(--background-modifier-border)}.canvas-embed.better-canvas-embed.internal-embed>.canvas-content>.canvas-wrapper{position:relative}.canvas-embed.better-canvas-embed>.embed-title{width:fit-content;cursor:pointer}.canvas-embed.better-canvas-embed>.canvas-content{height:var(--embedded-canvas-min-height);border:var(--embedded-canvas-border-width) solid var(--embedded-canvas-border-color);border-radius:var(--radius-m);overflow:hidden}.canvas-embed.better-canvas-embed>.canvas-content>.canvas-wrapper>.canvas-controls{visibility:hidden}.canvas-embed.better-canvas-embed>.canvas-content:hover>.canvas-wrapper>.canvas-controls{visibility:visible}.canvas-embed.better-canvas-embed .canvas-wrapper.mod-readonly[data-hide-background-grid-when-in-readonly=true] .canvas-background{visibility:visible}.canvas-embed.better-canvas-embed .canvas-node-content.markdown-embed>.markdown-embed-content>.markdown-preview-view>.markdown-preview-sizer{margin-left:unset;margin-right:unset}.canvas-embed.better-canvas-embed .inline-title{display:block}
02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/00 Start hier - David.md
+1 -7
View File
@@ -29,7 +29,7 @@ Nach Davids Feedback wurde die Lead-Zuweisung ergaenzt:
- `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.
- Die alten Advanced-Screens und S01B sind aus dem Obsidian-Handoff entfernt; S01C/S01D/S01E bleiben nur als Referenz-Beispiele.
## Review-Reihenfolge
@@ -51,15 +51,9 @@ Nach Davids Feedback wurde die Lead-Zuweisung ergaenzt:
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
02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/D-FORM David Uebergabe 2026-07-09.md
+9 -26
View File
@@ -48,7 +48,7 @@ Die erste Builder-Richtung war fachlich vollstaendig, aber fuer normale Handwerk
| 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.
Empfehlung: S02 ist der Haupteditor. S01B und die alten Advanced-Screens sind aus dem Obsidian-Handoff entfernt, damit der Review nicht mehr doppelt wirkt.
## 3. Aktueller Hauptfluss
@@ -85,21 +85,15 @@ S00 Formulare verwalten
| 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
## 5. Spaetere Varianten
Diese Seiten sind gebaut oder dokumentiert, aber nicht Teil des aktuellen Hauptflusses:
Diese Seiten liegen noch als optionale Beispiele im Subframe-Flow, sind 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
@@ -171,12 +165,7 @@ Fuer den einfachen Haupteditor:
- 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.
Als reine Markdown-Notizen bleiben D01/D02/D03/D06/D10 und M01-M04 dokumentiert. Sie sind keine Subframe-Hauptscreens und nicht Teil der Review-Reihenfolge.
## 10. Public Formular
@@ -224,7 +213,7 @@ Bitte David pruefen lassen:
- 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?
- Sollen S01C/S01D/S01E als spaetere Beispielvarianten im Subframe-Flow 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.
@@ -248,15 +237,9 @@ Bitte David pruefen lassen:
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
16. S01C Website Formular Editor
17. S01D Umfrage Editor
18. S01E Internes Formular Editor
## 14. Lokale Detaildateien
@@ -279,4 +262,4 @@ Wichtige Detailnotizen im Paket:
## 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?
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. Die alten Advanced-Screens und S01B sind aus dem Obsidian-Handoff raus, damit der Review nur noch den aktuellen Hauptfluss zeigt. Kannst du bitte einmal pruefen, ob die Richtung und die offenen Punkte fuer dich passen?
02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/David Review Checkliste.md
+11 -14
View File
@@ -17,11 +17,11 @@ Startpunkt fuer die weitergebbare Version: [[00 Start hier - David]] und [[D-FOR
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.
Wichtige Nacharbeit aus dem Review: Die Interaktionslogik wurde in den einfachen S02-Hauptfluss uebersetzt. Logic bleibt als `Bedingung` an der Frage, Actions als `Nach Absenden`/Lead-Card und Publish-Blocker als Banner/Popover im selben Editor.
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.
Subframe ist als Draft gebaut und verlinkt. Der aktuelle Hauptfluss ist S00, E01/E02, S01, S02, S02L/E05, S03, S04/V01/V02/V03, S05 und E03/E04. S01C/S01D/S01E bleiben spaetere Varianten bzw. Referenz. S01B und die alten Advanced-Screens wurden aus dem Obsidian-Handoff entfernt.
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.
Aktuelle Arbeitsentscheidung: Fuer normale Handwerksbetriebe wird S02 als einfache Google-Forms-nahe Richtung empfohlen. Alle Formulararten starten in S02 mit anderer Vorlage/Startfragen. Als Kunden-/Handwerker-Wording wird `Bereich` statt `Gewerk` verwendet.
## 0b. David-Feedback Lead-Zuweisung
@@ -44,7 +44,7 @@ Ergebnis: Die Abgrenzung `D-FORM = Form-Builder-Canvas + oeffentliches Formular`
| 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. |
| `ticket-docs/D-FORM.md` | D-FORM deckt Form-Builder 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. |
| `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. |
@@ -55,7 +55,7 @@ Ergebnis: Die Abgrenzung `D-FORM = Form-Builder-Canvas + oeffentliches Formular`
| Punkt | Empfehlung | David-Entscheidung |
|---|---|---|
| D-FORM umfasst den Builder; aktuell S02 als Haupteditor und ADV-S01 als Advanced-Referenz. | Ja. | angenommen |
| D-FORM umfasst den Builder; aktuell S02 als Haupteditor. | 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 |
@@ -144,12 +144,9 @@ Ergebnis: Die Abgrenzung `D-FORM = Form-Builder-Canvas + oeffentliches Formular`
| 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 |
| Hauptfluss bauen: S00, S01, S02, S02L/E05, S03, S04/V01/V02/V03, S05 und E01-E04. | Ja. | angenommen |
| 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 |
| Sharing, Logic, Actions, Preview und Settings nicht als eigene Subframe-Screens, sondern einfach im S02-Kontext halten. | Ja. | angenommen |
| Nach Subframe-Bau Links in Paket, Screen-Dateien, Tracker und Handoff eintragen. | Ja. | erledigt |
## 11. David-Feedback: S01 Nacharbeit
@@ -169,14 +166,14 @@ Arbeitsentscheidung fuer S01:
| 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.
Damit reicht S02 als Haupteditor. 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]].
Vor-Subframe-Nacharbeit erledigt: Die wichtigsten Detailzustaende sind als 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/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.
Aktueller Subframe-Stand: Der Hauptfluss S00/E01/E02/S01/S02/S02L/E05/S03/S04/V01/V02/V03/S05/E03/E04 ist gebaut und verlinkt. S01C/S01D/S01E 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.`
`D-FORM ist fachlich passend abgegrenzt und der Subframe-Draft ist gebaut. Der aktuelle Hauptfluss ist S00, S01, S02, S02L/E05, 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. S01C/S01D/S01E sind nur spaetere Varianten bzw. Referenz. S05 bleibt ohne Kennzahl-Kacheln und ohne extra Link-teilen-Button.`
02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/01 S00 Formulare verwalten.md
+1 -1
View File
@@ -41,7 +41,7 @@ Der Screen ist nicht der Builder selbst, sondern die Formular-Zentrale vor dem B
- 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.
- Die Formularart bestimmt in S02 nur Vorlage, Startfragen und Hinweise. 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.
02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/04 S01 Formularart auswaehlen.md
+2 -2
View File
@@ -50,7 +50,7 @@ Entscheidung 2026-07-08: Weniger ist hier besser. Keine separate Vorlagenzeile u
| 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.
Arbeitsentscheidung 2026-07-08: S02 ist der Haupt-Editor fuer alle vier Formulararten. S01C/S01D/S01E bleiben nur spaetere Varianten bzw. Referenzseiten.
## Lead-Formular Verhalten
@@ -81,5 +81,5 @@ 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`.
- Liegt im D-FORM-Flow neben S02/S02L/E05, S03, S04 und S05.
- Ersetzt nicht S04 Public Form, sondern liegt vor dem Builder.
02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/05 S02 Einfacher Fragen Editor.md
+2 -2
View File
@@ -159,7 +159,7 @@ S02 ist der Haupt-Editor fuer normale Nutzer. Deshalb werden Logic, Actions und
| 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.
Die alten Advanced-Detailframes sind aus dem Obsidian-Handoff entfernt. Fuer den aktuellen S02-Hauptfluss sind sie nicht notwendig. Die Lead-Zuweisung ist aber nicht mehr nur Hintergrundlogik, sondern ein eigener S02-Zustand.
## Publish
@@ -180,6 +180,6 @@ 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`.
- Liegt im D-FORM-Flow neben S02L/E05, S03, S04 und S05.
- 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.
02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/80 S01B Gefuehrter Fragen Editor.md
-110
View File
@@ -1,110 +0,0 @@
---
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.
02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/81 S01C Website Formular Editor.md
+1 -1
View File
@@ -53,5 +53,5 @@ 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`.
- Liegt im D-FORM-Flow als optionale Referenzvariante.
- Wiederhergestellte Layout-Version vom 2026-07-07; alte kaputte Subframe-ID wurde ersetzt.
02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/82 S01D Umfrage Editor.md
+1 -1
View File
@@ -51,5 +51,5 @@ 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`.
- Liegt im D-FORM-Flow als optionale Referenzvariante.
- Korrigierte Version; die falsch generierte Variante ohne Layout wurde geloescht.
02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/83 S01E Internes Formular Editor.md
+1 -1
View File
@@ -52,5 +52,5 @@ 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`.
- Liegt im D-FORM-Flow als optionale Referenzvariante.
- Wiederhergestellte Layout-Version vom 2026-07-07; alte kaputte Subframe-ID wurde ersetzt.
02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/90 ADV Form-Builder Canvas.md
-661
View File
@@ -1,661 +0,0 @@
---
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.
02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/90b ADV Form-Builder Canvas 2.md
-34
View File
@@ -1,34 +0,0 @@
---
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
02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/91 D07 Logic Regel Detail.md
-98
View File
@@ -1,98 +0,0 @@
---
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.
02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/92 D08 Action Detail mit Mapping.md
-112
View File
@@ -1,112 +0,0 @@
---
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.
02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/93 D09 Publish Blocker Summary.md
-114
View File
@@ -1,114 +0,0 @@
---
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.
02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/D01 Sharing Panel URL QR iFrame.md
+1 -1
View File
@@ -8,7 +8,7 @@ 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
route: Detailnotiz, kein eigener Screen
subframe: "-"
---
02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/D02 Post-Submit Actions.md
+8 -8
View File
@@ -5,10 +5,10 @@ ticket: D-FORM
package: WF-D-FORM Form Builder
id: D02
screen: Post-Submit Actions
typ: Panel-Zustand in S01
typ: Detailnotiz im S02-Kontext
umsetzung: Nur dokumentieren
status: Vor Subframe / dokumentiert
route: in ADV-S01 Form-Builder Canvas, kein eigener Screen
route: Detailnotiz, kein eigener Screen
subframe: "-"
---
@@ -20,7 +20,7 @@ Interne Nutzer legen fest, was nach dem Absenden eines Public Forms passieren so
## Pattern / Archetyp
Action-Liste plus Detailpanel innerhalb von S01.
Action-Liste plus Detailbereich innerhalb des einfachen Builders.
## Daten
@@ -46,9 +46,9 @@ Action-Liste plus Detailpanel innerhalb von S01.
## Verhalten
- Klick auf `Actions` wechselt in den Actions-Modus im selben S01-Screen.
- Klick auf `Nach Absenden` zeigt die Action-/Lead-Optionen im selben S02-Kontext.
- `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]].
- Nach Auswahl eines Action-Typs oeffnet sich die Detailkonfiguration im selben Bereich.
- 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]].
@@ -61,7 +61,7 @@ Action-Liste plus Detailpanel innerhalb von S01.
| 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]]. |
| Kein Modal | Das Popover waehlt nur den Typ; Detailarbeit passiert im selben Builder-Kontext. |
## Zustaende
@@ -79,12 +79,12 @@ Action-Liste plus Detailpanel innerhalb von S01.
|---|---|
| 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 erstellt aktive Action ohne Pflichtmapping | Publish blockiert und springt zur betroffenen Zuweisung. |
| 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.
Kein eigener Hauptscreen. Actions bleiben Arbeitsbereich im einfachen Builder. Ein extra Frame ist nur noetig, wenn David die geoeffnete Action-Liste separat sehen will.
## Notizen
02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/D03 Conditional Logic Editor.md
+5 -5
View File
@@ -5,10 +5,10 @@ ticket: D-FORM
package: WF-D-FORM Form Builder
id: D03
screen: Conditional Logic Editor
typ: Panel-Zustand in S01
typ: Detailnotiz im S02-Kontext
umsetzung: Nur dokumentieren
status: Vor Subframe / dokumentiert
route: in ADV-S01 Form-Builder Canvas, kein eigener Screen
route: Detailnotiz, kein eigener Screen
subframe: "-"
---
@@ -20,7 +20,7 @@ Interne Nutzer koennen einfache Anzeige-/Ausblende-Regeln fuer Formularfelder er
## Pattern / Archetyp
Regel-Liste plus Detailpanel innerhalb von S01.
Einfache Bedingung direkt an der Frage; komplexere Regel-Liste bleibt nur dokumentiert.
## Daten
@@ -44,8 +44,8 @@ Regel-Liste plus Detailpanel innerhalb von S01.
## 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]].
- Klick auf `Bedingung` oeffnet die einfache Logik direkt an der Frage.
- `Neue Regel` oeffnet kein Modal, sondern bleibt inline im Builder-Kontext.
- 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.
02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/D06 Feldkarten Menue.md
+1 -1
View File
@@ -8,7 +8,7 @@ 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
route: Detailnotiz, kein eigener Screen
subframe: "-"
---
02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/D10 Builder Interaktionsfaelle.md
+2 -5
View File
@@ -5,10 +5,10 @@ ticket: D-FORM
package: WF-D-FORM Form Builder
id: D10
screen: Builder Interaktionsfaelle
typ: Case-Matrix in S01
typ: Case-Matrix im S02-Kontext
umsetzung: Nur dokumentieren
status: Vor Subframe / dokumentiert
route: in ADV-S01 Form-Builder Canvas, kein eigener Screen
route: Detailnotiz, kein eigener Screen
subframe: "-"
---
@@ -130,8 +130,5 @@ Nicht jedes Detail muss ein eigener Frame werden. Dber vor Subframe muss klar se
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]]
02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Simple Builder Neuausrichtung.md
+2 -4
View File
@@ -45,7 +45,7 @@ Neue Richtung: einfacher Formular-Editor nach Google-Forms-Gefuehl, aber mit Hiv
| 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.
S01C/S01D/S01E sind gebaut, aber nicht Hauptfluss. Sie bleiben als spaetere Varianten bzw. Referenz bei 81-83. S01B wurde aus dem Obsidian-Handoff entfernt.
## Einfacher Ablauf
@@ -100,11 +100,9 @@ Bewusst nicht im aktuellen S02-Hauptdropdown: Lineare Skala, Bewertung, Multiple
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.
Die alten Advanced-Screens wurden aus dem Obsidian-Handoff entfernt, damit S02 als klare Empfehlung stehen bleibt.
## Ergaenzung: Lead Felder zuweisen
02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Subframe Bau Log.md
+8 -37
View File
@@ -35,22 +35,12 @@ Flow-Link: https://app.subframe.com/f023064a5ca0/flow/afb1c257-46f0-4b23-aaed-d7
| 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.
@@ -59,16 +49,13 @@ Flow-Link: https://app.subframe.com/f023064a5ca0/flow/afb1c257-46f0-4b23-aaed-d7
- 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.
- Arbeitsentscheidung: S02 ist aktuell der Haupt-Editor fuer alle Formulararten. S01C/S01D/S01E bleiben spaetere Varianten bzw. Referenz; S01B ist aus dem Obsidian-Handoff entfernt.
- 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.
@@ -87,17 +74,7 @@ Flow-Link: https://app.subframe.com/f023064a5ca0/flow/afb1c257-46f0-4b23-aaed-d7
- 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.
- Die alten Advanced-Screens und D07-D09 wurden aus dem Obsidian-Handoff entfernt, weil S02 der aktuelle Review-Hauptfluss ist.
## Qualitaetscheck Public
@@ -128,7 +105,7 @@ 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.
S01C/S01D/S01E sind gebaut, aber aktuell nicht relevant fuer den Hauptfluss. Sie bleiben als spaetere Varianten bzw. Referenzseiten erhalten. S01B und die alten Advanced-Screens wurden aus dem Obsidian-Handoff entfernt.
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.
@@ -149,15 +126,9 @@ Empfohlene sichtbare Sortierung:
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`
16. `81 S01C Website Formular Editor`
17. `82 S01D Umfrage Editor`
18. `83 S01E Internes Formular Editor`
M01-M04 bleiben dokumentierte Confirm-Zustaende und werden nur gebaut, wenn David sie explizit anfordert.
@@ -177,7 +148,7 @@ Falls spaeter D-FORM-M-Zustaende gebaut werden, muessen sie als `Dialog`-Kompone
- 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.
Die alten Advanced-Detailframes D07/D08/D09 sind nicht mehr Teil dieses Obsidian-Handoffs.
## Naechster Subframe-Schritt
@@ -199,4 +170,4 @@ Review in Subframe in dieser Reihenfolge:
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.
Danach nur bei Bedarf die spaeteren Referenzseiten pruefen: S01C/S01D/S01E.
02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Subframe Bauplan.md
+10 -126
View File
@@ -53,19 +53,13 @@ Empfehlung fuer Review und Weiterarbeit: zuerst den aktuellen Hauptfluss pruefen
| 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]].
Stand 2026-07-09: Die einfachen Builder-Screens sind gebaut. S02L und E05 wurden nach Davids Lead-Feedback ergaenzt. S01B und die alten Advanced-Screens wurden aus dem Obsidian-Handoff entfernt. 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
@@ -128,15 +122,9 @@ Frames / Designs:
| 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`.
@@ -158,10 +146,10 @@ 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. |
| Layout | Default Page Layout | S00/S01/S02/S03/S05/E01-E04 als interne Hauptseiten im vorhandenen Subframe Page Layout. S01C-E 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. |
| Navigation | Tabs | S02 Tabs: Fragen, Design, Antworten. |
| 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. |
@@ -211,10 +199,8 @@ Wenn einer dieser M-Zustaende spaeter in Subframe gebaut wird, muss die vorhande
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.
- D-/M-Detailnotizen sind Markdown-Anforderungen und nicht Teil der aktuellen Subframe-Review-Reihenfolge.
## 6. S04: fertiges Kundenformular
@@ -310,115 +296,19 @@ Default Page Layout
### 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.
S00, S01, S02, S03, S05 und E01-E04 muessen in Subframe das vorhandene `Default Page Layout` verwenden. S01C-E 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
### 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. |
S02 nutzt nur die Review-relevanten Tabs: Fragen, Design und Antworten. Logic, Actions und Publish bleiben in S02 bewusst einfach und inline.
## 8. D07 Logic Regel Detail
## 8. Entfernte Advanced-Detailframes
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.
S01B, ADV-S01, ADV-S01-2 und die Detailframes D07/D08/D09 wurden aus dem Obsidian-Handoff entfernt. Die fachlichen Detailnotizen zu Sharing, Actions, Logic, Feldmenue, Interaktionsfaellen und Confirm-Dialogen bleiben als Markdown-Anforderungen liegen, sind aber keine Review-Screens.
## 11. Was NICHT passieren soll
@@ -427,7 +317,7 @@ Wichtig:
- 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.
- Confirm-Dialoge nicht vor dem S02-Hauptfluss priorisieren.
- Keine neuen globalen Subframe Standards aus D-FORM ableiten.
## 12. Umsetzungsstand in Subframe
@@ -453,15 +343,9 @@ Gebaut und verlinkt:
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:
02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Varianten/V01 Public Erfolg oder Redirect.md
-106
View File
@@ -1,106 +0,0 @@
---
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.
02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Varianten/V02 Public Formular nicht verfuegbar.md
-115
View File
@@ -1,115 +0,0 @@
---
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.
02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Varianten/V03 Public Captcha oder Submit Fehler.md
-117
View File
@@ -1,117 +0,0 @@
---
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.
02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/WF-D-FORM Form Builder.canvas
+45 -78
View File
@@ -1,87 +1,54 @@
{
"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}
{"id":"group-simple","type":"group","x":-80,"y":160,"width":3900,"height":1060,"label":"D-FORM Hauptflow - Interner Builder"},
{"id":"group-public","type":"group","x":1160,"y":1340,"width":2320,"height":640,"label":"Public Formular und States"},
{"id":"group-notes","type":"group","x":-80,"y":-280,"width":3040,"height":360,"label":"Review-Fokus / Scope"},
{"id":"package","type":"file","file":"02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/WF-D-FORM Form Builder.md","x":0,"y":-150,"width":360,"height":160},
{"id":"s03","type":"file","file":"02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/01 S00 Formulare verwalten.md","x":0,"y":380,"width":420,"height":190},
{"id":"note-subframe-focus","type":"text","text":"# Review-Fokus\n\nAktueller Hauptfluss:\n- 01 S00 Verwaltung\n- 02/03 Empty States\n- 04 S01 Formularart\n- 05 S02 Haupteditor\n- 05b/05c Lead-Zuweisung\n- 06 S03 Design\n- 07-10 Public Form/States\n- 11-13 Antworten/States\n\n81-83 sind nur spaetere Referenz-Beispiele.","x":520,"y":-190,"width":760,"height":240},
{"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\nS00 ist nur die schlanke Formular-Zentrale. S05 ist nur die Antwortenansicht im Formular.","x":1480,"y":-190,"width":760,"height":240},
{"id":"s00","type":"file","file":"02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/04 S01 Formularart auswaehlen.md","x":670,"y":385,"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":1240,"y":860,"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":2600,"y":200,"width":420,"height":170},
{"id":"s01d","type":"file","file":"02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/82 S01D Umfrage Editor.md","x":2600,"y":400,"width":420,"height":170},
{"id":"s01e","type":"file","file":"02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/83 S01E Internes Formular Editor.md","x":2600,"y":600,"width":420,"height":170},
{"id":"s04","type":"file","file":"02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/06 S03 Formular Design.md","x":2120,"y":765,"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":2120,"y":1005,"width":420,"height":190},
{"id":"note-simple-builder","type":"text","text":"# Aktueller Builder-Flow\n\nS00 ist die Formular-Zentrale.\nS01 waehlt die Formularart.\nS02 ist der Haupteditor.\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\nS01C/D/E bleiben Referenz-Beispiele, nicht Review-Pfad.","x":3260,"y":285,"width":500,"height":360},
{"id":"simple-direction","type":"file","file":"02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Simple Builder Neuausrichtung.md","x":3300,"y":765,"width":420,"height":160},
{"id":"v01","type":"file","file":"02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/08 V01 Public Erfolg oder Redirect.md","x":1870,"y":1420,"width":420,"height":190},
{"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":2350,"y":1420,"width":420,"height":250},
{"id":"s02","type":"file","file":"02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/07 S04 Oeffentliches Formular.md","x":1240,"y":1540,"width":420,"height":190},
{"id":"v02","type":"file","file":"02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/Screens/09 V02 Public Formular nicht verfuegbar.md","x":1870,"y":1660,"width":420,"height":190},
{"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":2350,"y":1700,"width":420,"height":190},
{"id":"note-public-reuse","type":"text","text":"# Public Renderer\n\nD-FORM baut das Public Form.\n\nAndere Bereiche wie HR oder Booking koennen den Renderer spaeter wiederverwenden, sind aber keine D-FORM-Screens.","x":3000,"y":1550,"width":420,"height":220}
],
"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-v01","fromNode":"s02","fromSide":"right","toNode":"v01","toSide":"left","label":"Submit erfolgreich"},
{"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-v03","fromNode":"s02","fromSide":"right","toNode":"v03","toSide":"left","label":"Fehler beim Submit"},
{"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-public-reuse","fromNode":"note-public","fromSide":"right","toNode":"note-public-reuse","toSide":"left","label":"Wiederverwendung"},
{"id":"edge-focus-out","fromFloating":false,"toFloating":false,"fromNode":"note-subframe-focus","fromSide":"right","toNode":"note-out-of-scope","toSide":"left","label":"Grenzen"},
{"id":"edge-package-focus","fromNode":"package","fromSide":"right","toNode":"note-subframe-focus","toSide":"left","label":"Review"},
{"id":"edge-package-simple","fromNode":"package","fromSide":"bottom","toNode":"s03","toSide":"top","label":"Hauptfluss"},
{"id":"edge-s00-s01a","fromNode":"s00","fromSide":"right","toNode":"s01a","toSide":"left","label":"Weiter zu S02"},
{"id":"edge-s00-s01c","fromNode":"s00","fromSide":"right","toNode":"s01c","toSide":"left","label":"Referenz: Website"},
{"id":"edge-s00-s01d","fromNode":"s00","fromSide":"right","toNode":"s01d","toSide":"left","label":"Referenz: Umfrage"},
{"id":"edge-s00-s01e","fromNode":"s00","fromSide":"right","toNode":"s01e","toSide":"left","label":"Referenz: Intern"},
{"id":"edge-s03-s00","fromNode":"s03","fromSide":"right","toNode":"s00","toSide":"left","label":"Neues Formular"},
{"id":"edge-s03-s01a","toFloating":false,"fromNode":"s03","fromSide":"right","toNode":"s01a","toSide":"left","label":"Bearbeiten"},
{"id":"edge-s01a-s04","fromNode":"s01a","fromSide":"right","toNode":"s04","toSide":"left","label":"Tab Design"},
{"id":"edge-s01a-s05","fromNode":"s01a","fromSide":"right","toNode":"s05","toSide":"left","label":"Tab 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"}
]
}
{"id":"edge-s01e-note","fromNode":"s01e","fromSide":"right","toNode":"note-simple-builder","toSide":"left","label":"Beispiel"},
{"id":"edge-s01a-s02-public","fromNode":"s01a","fromSide":"bottom","toNode":"s02","toSide":"top","label":"Public Vorschau"},
{"id":"edge-note-simple-direction","fromNode":"note-simple-builder","fromSide":"bottom","toNode":"simple-direction","toSide":"top","label":"Entscheidung"}
],
"metadata":{
"version":"1.0-1.0",
"frontmatter":{}
}
}
02 Wireframes/D-FORM Formulare/WF-D-FORM Form Builder/WF-D-FORM Form Builder.md
+43 -75
View File
@@ -26,22 +26,22 @@ 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.
Dieses Paket bereitet `D-FORM` fuer David vor: den einfachen internen Formular-Editor und das oeffentliche Formular.
Der Fokus liegt bewusst auf den zwei Bespoke-Erlebnissen:
- Form-Builder-Canvas fuer interne Nutzer
- S02 Fragen-Editor 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.
Fuer den eigentlichen Subframe-Bau gilt [[Subframe Bauplan]] als konkrete Bau-Reihenfolge und Komponenten-Zuordnung. Interne Builder-Screens wie S00/S01/S02/S03/S05 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.
**Wichtig:** Dieses Paket ist jetzt auf den einfachen S02-Hauptfluss ausgerichtet. D-FORM ist in Subframe als Draft gebaut: S00 bis S05, S02L/E05 fuer Lead-Zuweisung und die Public-Screens S04/V01/V02/V03.
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-07:** Fuer Handwerksbetriebe wirkt der bisherige Builder 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. Hauptvariante ist [[Screens/05 S02 Einfacher Fragen Editor|S02 Einfacher 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]] bleiben spaetere Beispiele. Ergaenzt wurden ausserdem [[Screens/06 S03 Formular Design|S03 Formular Design]] und [[Screens/11 S05 Antworten Tabelle|S05 Antworten Tabelle]].
**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.
@@ -49,6 +49,8 @@ Vor einer echten Fertig-Markierung muss David die Subframe-Frames final reviewen
**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.
**Cleanup 2026-07-10:** S01B, die alten Advanced-Screens 90/90b/91/92/93 und die doppelten Dateien unter `Varianten/` wurden aus Obsidian entfernt. Der Handoff zeigt nur noch den aktuellen Hauptfluss plus S01C/S01D/S01E als optionale Beispiele.
---
## 2. Intent Check
@@ -133,19 +135,11 @@ Merksatz: D-FORM hat wenige eigene Routen, aber einen riesigen Detailumfang inne
| 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. |
| S02 Haupteditor | Simple Builder mit Fragekarten, Fragetypen, Bedingung und Lead-Hinweis gebaut. | David prueft die einfache Richtung. |
| S02L/E05 Lead-Zuweisung | Lead-Felder werden per Dropdown zugewiesen; Fehlerzustand ist gebaut. | David prueft, ob die Zuordnung reicht. |
| 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. |
| V01/V02/V03 Public-States | Public Success, Nicht-verfuegbar und Captcha/Submit-Fehler gebaut. | David validiert Copy und Public-Fehlerlogik. |
| Canvas/Tracker/Handoff | Auf aktuellen Hauptfluss bereinigt; alte Advanced-Frames aus Obsidian entfernt. | Vor Subframe nur noch David-Freigabe bzw. gezielte Korrekturen. |
---
## 3d. David-Feedback 2026-07-06
@@ -161,13 +155,13 @@ Nacharbeit: In S01 fehlte die Interaktionslogik fuer konkrete Aktionen. Die wich
| 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. |
| Sharing oeffnen | Public-Link-/Teilen-Kontext im einfachen Builder, kein eigener Review-Screen. |
| 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.
Bewertung: Der aktuelle Review konzentriert sich auf den S02-Hauptfluss. 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]].
Dokumentierte Detaildateien: [[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/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.
@@ -181,10 +175,10 @@ 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. |
| Screen-Dateien mit Ziel, Daten, Aktionen, Verhalten, Zustaenden und Subframe-Hinweis | S02/S02L/E05/S04/V01-V03 sowie D-/M-Notizen entsprechend ausgearbeitet. |
| D-/M-Zustaende als eigene Dateien, auch wenn sie nicht gebaut werden | Detailnotizen liegen im `Screens`-Ordner, sind aber nicht Teil der aktuellen Subframe-Review-Reihenfolge. |
| 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. |
| Tracker fuehrt dokumentierte Zustaende als eigene Zeilen | Tracker enthaelt die D-/M-Notizen als Dokumentation ohne Canvas-Link. |
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.
@@ -330,9 +324,9 @@ Empfehlung: David sollte **Palette + Canvas + Inspector** als Kernarbeit versteh
| 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 |
| Sharing-Panel | URL/QR/iFrame gehoeren in den Public-Link-Kontext. | Dokumentieren |
| Post-Submit-Actions | Lead-Feldzuweisung muss sichtbar sein. | In S02L/E05 abgebildet |
| Conditional-Logic-Editor | v1 eng schneiden. | Als einfache Bedingung an der Frage |
| 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 |
@@ -344,7 +338,6 @@ Empfehlung: David sollte **Palette + Canvas + Inspector** als Kernarbeit versteh
| 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. |
@@ -354,9 +347,6 @@ Empfehlung: David sollte **Palette + Canvas + Inspector** als Kernarbeit versteh
| 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. |
@@ -370,21 +360,16 @@ Entscheidung: `Bauen`, `Wiederverwenden`, `Nur dokumentieren`, `Spaeter`, `Raus`
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
@@ -395,15 +380,11 @@ 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.
- Feldkarten-Menue, allgemeine Panels, D10 Case-Matrix und Confirm-Dialoge als dokumentierte Detailnotizen.
- 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
Keine zusaetzlichen Advanced-Zustandsframes im aktuellen Handoff bauen.
### Copy-kritische Zustaende
@@ -444,16 +425,12 @@ Als zusaetzliche S01-Zustandsframes bauen:
| 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 |
### Detailnotizen ohne eigene Review-Screens
### 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.
Diese Eintraege sind ausgearbeitet, bleiben aber Dokumentation und sind nicht Teil der aktuellen Subframe-Review-Reihenfolge.
| ID | Zustand | Typ | Umsetzung |
|---|---|---|---|
@@ -462,9 +439,6 @@ Diese Eintraege sind ausgearbeitet. D07/D08/D09 wurden nach Empfehlung als zusae
| 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 |
@@ -477,25 +451,25 @@ Diese Eintraege sind ausgearbeitet. D07/D08/D09 wurden nach Empfehlung als zusae
Interner Hauptarbeitsort:
```text
ADV-S01 Form-Builder Canvas
- Header / Status / Save / Publish
- Feld-Palette
- Canvas
- Feld-Inspector
- Arbeitsmodi: Logic, Actions, Sharing, Preview, Settings
S02 Einfacher Fragen Editor
- Fragen
- Lead-Hinweis / Felder zuweisen
- Bedingung direkt an der Frage
- Design-Tab S03
- Antworten-Tab S05
```
Dokumentierte ADV-S01-Zustaende:
Dokumentierte Detailnotizen:
```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
S02 -> D01 Sharing Panel
S02 -> D02 Post-Submit Actions
S02 -> D03 Conditional Logic Editor
S02 -> D06 Feldkarten Menue -> M01 Feld loeschen Confirm
S02 Publish-Kontext -> M02 Unpublish Confirm
S02 -> M03 Archive Confirm
S02 -> M04 Unsaved Changes Confirm
S02 -> D10 Builder Interaktionsfaelle
```
Public Flow:
@@ -528,20 +502,14 @@ S04 Oeffentliches Formular
- [[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]]
@@ -554,9 +522,9 @@ S04 Oeffentliches Formular
- [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 Klickzustaende sind als Markdown-Detailnotizen 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] Canvas ist auf Hauptflow, Public Flow und Scope-Notizen bereinigt.
- [x] Banner/Inline-Meldungen sind dokumentiert.
- [x] Toasts/Action-Feedback sind dokumentiert.
- [x] Meldungs-/Error-State-Matrix ist ausgefuellt.
@@ -564,8 +532,8 @@ S04 Oeffentliches Formular
- [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] Detail-Brainstorming fuer 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.
- [x] Subframe-Link fuer Flow und Hauptfluss 01-13 ist eingetragen.
02 Wireframes/P12 Automationen/WF-P12 Flow-Editor/Screens/M01 Probelauf.md
+7 -2
View File
@@ -9,7 +9,7 @@ typ: Modal
umsetzung: Bauen
status: Validiert
route: "aus S01 (Probelauf-Knopf / vor Aktivierung)"
subframe: ""
subframe: "https://app.subframe.com/f023064a5ca0/design/ea231a78-eddb-4c04-97a8-7574d45d8576/edit"
---
# M01 — Probelauf (Dry-Run)
@@ -38,4 +38,9 @@ A5 Modal + Simulations-Liste.
## Subframe
- (erst nach explizitem OK)
- [M01 Probelauf Dialog](https://app.subframe.com/f023064a5ca0/design/ea231a78-eddb-4c04-97a8-7574d45d8576/edit)
### Abgleich Subframe vs. Spec (2026-07-10)
- Spec abgedeckt: »Trifft 143 Datensätze«, erste 5 Beispiele, Klartext-Simulation, Schwellen-Bestätigung, aktivieren/zurück
- Abweichung: Bestätigung als **Checkbox statt Bestätigungs-Phrase**; »Aktivieren«-Button ist nicht disabled, solange die Checkbox leer ist
02 Wireframes/P12 Automationen/WF-P12 Flow-Editor/Screens/M02 Schleifen-Warnung.md
+9 -2
View File
@@ -9,7 +9,7 @@ typ: Modal
umsetzung: Bauen
status: Validiert
route: "aus S01 bei Schleifen-Verdacht"
subframe: ""
subframe: "https://app.subframe.com/f023064a5ca0/design/8e8943a5-36ea-4792-a3e0-590cb88fd9df/edit"
---
# M02 — Schleifen-/Raten-Warnung
@@ -31,4 +31,11 @@ A5 Modal + Mini-Graph.
## Subframe
- (erst nach explizitem OK)
- [M02 Schleifen-Warnung Dialog](https://app.subframe.com/f023064a5ca0/design/8e8943a5-36ea-4792-a3e0-590cb88fd9df/edit)
### Abgleich Subframe vs. Spec (2026-07-10)
- Spec abgedeckt: Mini-Graph mit markiertem Kreis, Klartext-Erklärung, »Beheben«-Knopf, Anomalie-Copy (2.000-mal/5 Min, typisch 5–10/Tag)
- Abweichung: Schleife und Raten-Anomalie **in einem Dialog kombiniert** (Spec: Anomalie als eigene Variante)
- Abweichung: **»Trotzdem aktivieren«-Button** widerspricht der Fehlermatrix (Schleife blockiert) — klären
- Kreis als Text-Pill markiert statt als sichtbare Rück-Kante im Graph
02 Wireframes/P12 Automationen/WF-P12 Flow-Editor/Screens/M03 Start-Auswahl.md
+8 -2
View File
@@ -9,7 +9,7 @@ typ: Modal
umsetzung: Bauen
status: Validiert
route: "»+ Neue Automation« (aus der Automation-Liste)"
subframe: ""
subframe: "https://app.subframe.com/f023064a5ca0/design/8b398273-682e-4cf2-851b-3b1a89da4d90/edit"
---
# M03 — Start-Auswahl
@@ -29,4 +29,10 @@ A5 Dialog (echtes Modal).
## Subframe
- (erst nach explizitem OK)
- [M03 Start-Auswahl Dialog](https://app.subframe.com/f023064a5ca0/design/8b398273-682e-4cf2-851b-3b1a89da4d90/edit)
### Abgleich Subframe vs. Spec (2026-07-10)
- Spec vollständig abgedeckt: leer ODER Vorlage, SHK + eigene, Kategorien, Use-Case-Beschreibungen, eingebetteter Vorlagen-Katalog
- Zusätzlich: Suchfeld, Flow-Vorschau-Chips, Nutzungszahlen (»38-mal verwendet«)
- Abweichung: **doppelter CTA** (»Verwenden« pro Karte UND »Mit Auswahl weiter« im Footer) — Interaktionsmodell klären
02 Wireframes/P12 Automationen/WF-P12 Flow-Editor/Screens/S01 Flow-Editor.md
+13 -2
View File
@@ -9,7 +9,7 @@ typ: BESPOKE (schwerste UI)
umsetzung: Bauen
status: Validiert
route: "/automations/:id/edit"
subframe: ""
subframe: "https://app.subframe.com/f023064a5ca0/design/a42ecf81-5d6e-4fa1-9076-b22010cd5ecf/edit"
---
# S01 — Flow-Editor ⭐
@@ -41,4 +41,15 @@ Automationen zusammenklicken wie ein Diagramm — verständlich für Büro-Mensc
## Subframe
- (erst nach explizitem OK)
Zwei Varianten gebaut (Flow »(MCP) HiveGrid Workflow Engine / Automationen P12«) — **Richtungs-Entscheidung offen**:
- [Variante A — Dreispalten kompakt](https://app.subframe.com/f023064a5ca0/design/a42ecf81-5d6e-4fa1-9076-b22010cd5ecf/edit): klassisches Konfig-Formular rechts (näher an der validierten Spec »Klick auf Baustein → Panel«)
- [Variante B — Geführter Inspector](https://app.subframe.com/f023064a5ca0/design/ce6a73d8-ae0c-4d1c-b8f8-f426dfe19d32/edit): rechts durchgängiger Schritt-Wizard mit Fortschritt, Prüfliste und »So liest es sich«-Klartext — weicht vom validierten Klick-Muster ab, passt aber zu Klartext-First
### Abgleich Subframe vs. Spec (2026-07-10)
- Beide Varianten halten die Grundanordnung Katalog · Canvas · Konfig ein (Katalog einklappbar, Undo/Redo, Auto-Anordnen, Zoom, Mini-Map vorhanden)
- Inline-Validierung zeigt nur »Pflichtfeld fehlt« und »Nicht verbunden« — Fall **»Schleifen-Verdacht« fehlt** am Baustein
- Kein **»Deaktivieren«** im Kopf (Spec: Aktivieren/Deaktivieren) — nur disabled »Aktivieren«
- D01 (Aktivieren-Blocker-Liste) und D02 (Anomalie-Banner) sind voll ausgebaut, obwohl laut Screen-Liste »Nur dokumentieren« — inhaltlich Spec-konform
- Kanten nur gerade vertikale Linien (linearer Flow, keine Verzweigung dargestellt)
02 Wireframes/P12 Automationen/WF-P12 Flow-Editor/WF-P12 Flow-Editor.canvas
+25 -4
View File
@@ -11,9 +11,30 @@
{"id":"note-embed","type":"text","text":"# Einbettung\n\nBaustein-Konfig-Panels (rechtes Panel) kommen aus WF-P12 Verwaltung (S05).\n\nAnordnung validiert: Katalog links · Canvas Mitte · Konfig rechts.","x":0,"y":560,"width":460,"height":240}
],
"edges":[
{"id":"e-entry","fromNode":"note-entry","fromSide":"right","toNode":"m03","toSide":"left","toEnd":"arrow","styleAttributes":{"path":"dotted"}},
{
"id":"e-entry",
"fromNode":"note-entry",
"fromSide":"right",
"toNode":"m03",
"toSide":"left",
"toEnd":"arrow",
"styleAttributes":{"path":"dotted"}
},
{"id":"e-start","fromNode":"m03","fromSide":"right","toNode":"s01","toSide":"left","toEnd":"arrow","label":"leer oder Vorlage"},
{"id":"e-dryrun","fromNode":"s01","fromSide":"bottom","toNode":"m01","toSide":"top","toEnd":"arrow","label":"Probelauf / vor Aktivierung"},
{"id":"e-loop","fromNode":"s01","fromSide":"bottom","toNode":"m02","toSide":"top","toEnd":"arrow","label":"bei Schleifen-Verdacht","styleAttributes":{"path":"long-dashed"}}
]
}
{
"id":"e-loop",
"fromNode":"s01",
"fromSide":"bottom",
"toNode":"m02",
"toSide":"top",
"toEnd":"arrow",
"label":"bei Schleifen-Verdacht",
"styleAttributes":{"path":"long-dashed"}
}
],
"metadata":{
"version":"1.0-1.0",
"frontmatter":{}
}
}
02 Wireframes/P12 Automationen/WF-P12 Flow-Editor/WF-P12 Flow-Editor.md
+8 -5
View File
@@ -5,16 +5,16 @@ ticket: D-FLOW
package: WF-P12 Flow-Editor
typ: Flow
status: Validiert
subframe: ""
subframe: "https://app.subframe.com/f023064a5ca0/design/a42ecf81-5d6e-4fa1-9076-b22010cd5ecf/edit"
canvas: "WF-P12 Flow-Editor.canvas"
---
# WF-P12 Flow-Editor
Status: Validiert (Screen-Liste)
Subframe-Link: -
Status: Validiert (Screen-Liste), Subframe-Erstentwürfe vorhanden
Subframe-Link: Flow »(MCP) HiveGrid Workflow Engine / Automationen P12« — [S01 Variante A](https://app.subframe.com/f023064a5ca0/design/a42ecf81-5d6e-4fa1-9076-b22010cd5ecf/edit) · [S01 Variante B](https://app.subframe.com/f023064a5ca0/design/ce6a73d8-ae0c-4d1c-b8f8-f426dfe19d32/edit) · [M01](https://app.subframe.com/f023064a5ca0/design/ea231a78-eddb-4c04-97a8-7574d45d8576/edit) · [M02](https://app.subframe.com/f023064a5ca0/design/8e8943a5-36ea-4792-a3e0-590cb88fd9df/edit) · [M03](https://app.subframe.com/f023064a5ca0/design/8b398273-682e-4cf2-851b-3b1a89da4d90/edit)
Canvas: [Canvas](<WF-P12 Flow-Editor.canvas>)
Stand: 2026-07-09
Stand: 2026-07-10 (Subframe-Abgleich, Links eingetragen)
---
@@ -113,9 +113,12 @@ S01 bettet ein: Baustein-Konfig-Panels (WF-P12 Verwaltung S05)
- Kanten-Interaktion (Klick-Verbinden vs. nur Ziehen) + Auto-Layout-Verhalten → Subframe-Iterationen
- Dry-Run-Schwelle: Default-Wert → Dev
- **S01-Variante entscheiden** (Abgleich 2026-07-10): A »Dreispalten kompakt« (klassisches Konfig-Panel, näher an validierter Spec) vs. B »Geführter Inspector« (Schritt-Wizard rechts) — David
- M02: »Trotzdem aktivieren«-Button widerspricht Blockier-Regel der Fehlermatrix — David
- M03: doppelter CTA (»Verwenden« je Karte + »Mit Auswahl weiter« im Footer) — Interaktionsmodell klären
## Handoff-Check
- [x] Jeder Screen ist mit Umsetzung markiert.
- [x] Meldungs-/Error-State-Matrix ist ausgefüllt.
- [ ] Subframe-Link ist eingetragen. *(Subframe erst nach explizitem OK)*
- [x] Subframe-Link ist eingetragen. *(Erstentwürfe, Abgleich s. Screen-Dateien; Varianten-Entscheidung offen)*
02 Wireframes/P12 Automationen/WF-P12 Verwaltung/Screens/S01 Automation-Liste.md
+9 -2
View File
@@ -9,7 +9,7 @@ typ: Liste
umsetzung: Bauen
status: Validiert
route: "/automations"
subframe: ""
subframe: "https://app.subframe.com/f023064a5ca0/design/336ccdfb-80f9-45bf-a158-e74cabb70a20/edit"
---
# S01 — Automation-Liste
@@ -38,4 +38,11 @@ A2 Liste.
## Subframe
- (erst nach explizitem OK)
- [S01 Automation-Liste](https://app.subframe.com/f023064a5ca0/design/336ccdfb-80f9-45bf-a158-e74cabb70a20/edit)
### Abgleich Subframe vs. Spec (2026-07-10)
- Spec abgedeckt: Zeilen-Anatomie, »nur meine«-Filter, Anomalie-Banner, »+ Neue Automation«, Läufe-Zugang, »Als Vorlage speichern«
- Zusätzlich: KPI-Kacheln, Suchfeld, Status-/Auslöser-Filter, Spalten »Verantwortlich« + »Aktionen«, »Vorlagen«-Button
- **Copy-Bug**: Spalte »Läufe (30 Tage)« zeigt »143 Datensätze« statt Lauf-Anzahl
- Status-Pill hat zusätzlich Wert »Fehler« (Spec: nur aktiv/pausiert/Entwurf)
02 Wireframes/P12 Automationen/WF-P12 Verwaltung/Screens/S02 Lauf-Liste.md
+8 -2
View File
@@ -9,7 +9,7 @@ typ: Liste
umsetzung: Bauen
status: Validiert
route: "/automations/:id/executions"
subframe: ""
subframe: "https://app.subframe.com/f023064a5ca0/design/0fab5d8c-1e6a-4220-863d-7e46aba0f06c/edit"
---
# S02 — Lauf-Liste
@@ -37,4 +37,10 @@ A2 Liste.
## Subframe
- (erst nach explizitem OK)
- [S02 Lauf-Liste](https://app.subframe.com/f023064a5ca0/design/0fab5d8c-1e6a-4220-863d-7e46aba0f06c/edit)
### Abgleich Subframe vs. Spec (2026-07-10)
- Spec abgedeckt: Zeit/Status/Klartext-Summary/Probelauf-Marker/Dauer, alle drei Filter, Zeile → Detail
- Zusätzlich: StatsCard-Reihe, Suchfeld, »Nur Probeläufe«-Switch, Spalte »Betroffene Datensätze«, Status »Läuft«, Pagination
- **Ohne DefaultPageLayout** (App-Sidebar fehlt — anders als S01)
02 Wireframes/P12 Automationen/WF-P12 Verwaltung/Screens/S03 Lauf-Detail.md
+10 -2
View File
@@ -9,7 +9,7 @@ typ: Detail + Timeline
umsetzung: Bauen
status: Validiert
route: "/automations/:id/executions/:exec_id"
subframe: ""
subframe: "https://app.subframe.com/f023064a5ca0/design/9997a3c4-d18b-449f-bbbd-4fe6dd24f3df/edit"
---
# S03 — Lauf-Detail
@@ -39,4 +39,12 @@ A3 + Timeline.
## Subframe
- (erst nach explizitem OK)
- [S03 Lauf-Detail](https://app.subframe.com/f023064a5ca0/design/9997a3c4-d18b-449f-bbbd-4fe6dd24f3df/edit)
### Abgleich Subframe vs. Spec (2026-07-10)
- Spec vollständig abgedeckt: lesbare Auslöser-Daten, Probelauf-Marker, Klartext-Timeline mit Input/Output, 24-h-Countdown, Retry + »ab Schritt X fortsetzen«
- Zusätzlich: rechte Sidebar (Laufdaten/Ergebnis/»Aktion erforderlich«), Quick-Fix »Person zuweisen«
- Redundanz: Countdown doppelt (Banner + Sidebar) plus dritter »Rückgängig«-Header-Button — straffen
- **Demo-Widerspruch**: Lauf als »Probelauf« markiert, bietet aber Rückgängig an (Probeläufe schreiben laut S02-Copy nichts)
- Ohne DefaultPageLayout
02 Wireframes/P12 Automationen/WF-P12 Verwaltung/Screens/S04 Vorlagen-Katalog.md
+9 -2
View File
@@ -9,7 +9,7 @@ typ: Liste/Karten
umsetzung: Bauen
status: Validiert
route: "/automations/templates"
subframe: ""
subframe: "https://app.subframe.com/f023064a5ca0/design/46e04956-4903-4733-9345-81b18f34e858/edit"
---
# S04 — Vorlagen-Katalog
@@ -36,4 +36,11 @@ A2 Karten-Liste.
## Subframe
- (erst nach explizitem OK)
- [S04 Vorlagen-Katalog](https://app.subframe.com/f023064a5ca0/design/46e04956-4903-4733-9345-81b18f34e858/edit)
### Abgleich Subframe vs. Spec (2026-07-10)
- Spec abgedeckt: Karten nach Kategorie mit Name/Beschreibung/Nutzungs-Anzahl/»Verwenden«, SHK + eigene unterscheidbar
- Copy-Abweichung: Button heißt »Eigene Vorlage erstellen« statt »aus Automation erstellen«
- Zusätzlich: Suchfeld, Modul-/Kategorie-Filter, »Beliebt«-Tab, Flow-Schritt-Chips, Hinweise »Variable/Verbindung erforderlich«
- Einbettung in Start-Auswahl (M03) nur dort dargestellt, hier eigenständige Seite · Ohne DefaultPageLayout
02 Wireframes/P12 Automationen/WF-P12 Verwaltung/Screens/S05 Baustein-Konfig-Panels.md
+10 -2
View File
@@ -9,7 +9,7 @@ typ: Compose-Panel (eingebettet)
umsetzung: Bauen
status: Validiert
route: "eingebettet im Flow-Editor (rechtes Panel)"
subframe: ""
subframe: "https://app.subframe.com/f023064a5ca0/design/83599a34-97b4-4881-beb4-8b7e35d11aa0/edit"
---
# S05 — Baustein-Konfig-Panels
@@ -37,8 +37,16 @@ Compose — Formular-Bausteine (A4) im Editor-Panel.
## Subframe
- (erst nach explizitem OK)
- [S05 Baustein-Konfig-Panels](https://app.subframe.com/f023064a5ca0/design/83599a34-97b4-4881-beb4-8b7e35d11aa0/edit)
### Abgleich Subframe vs. Spec (2026-07-10)
- Spec abgedeckt: genau die beiden Muster-Panels (Auslöser »Neue Anfrage« + Aktion »Aufgabe anlegen«), Klartext-Labels, Inline-Validierung mit Badge am Baustein
- Strukturabweichung: beide Panels untereinander auf einer Seite statt je Baustein; ToggleGroup Auslöser/Aktion ohne aktiven Wert (Code-Fehler)
- Zusätzlich: Beispielkontakt-Vorschau, »So liest es sich«-Zusammenfassung, »Kontakt verknüpfen«-Switch
- Tippfehler in Copy: »Bauhow-Analyse«
## Notizen
- KWP-Push: nur Registry-Eintrag, kein Konfig-UI (v1-Grenze).
- Vorplanung aller 31 Panels (Archetypen + Feld-Katalog): [[S05a Baustein-Konfig Vorplanung]] (2026-07-11).
02 Wireframes/P12 Automationen/WF-P12 Verwaltung/Screens/S05a Baustein-Konfig Vorplanung.md
+140
View File
@@ -0,0 +1,140 @@
---
kind: screen
project: HiveGrid Screen Project
ticket: D-P12
package: WF-P12 Verwaltung
id: S05a
screen: Baustein-Konfig Vorplanung (Katalog aller Panels)
typ: Vorplanung / Katalog
umsetzung: Planen
status: Subframe Draft / Review offen
route: "Modal über dem Flow-Editor (Dialog-Komponente, Klick auf Baustein)"
---
# S05a — Baustein-Konfig Vorplanung
Vorplanung für **alle 31 Bausteine** aus der Baustein-Bibliothek (Stand Planung 2026-07-11, Screenshot-Abgleich).
Ziel: je Baustein ein eigenes Konfig-Panel in Subframe ablegen, das später einzeln angepasst wird.
Statt 31 Panels von null zu bauen: **9 Muster-Archetypen** definieren, je Archetyp ein Muster-Panel bauen, die restlichen Panels als Kopien mit angepassten Feldern ableiten.
Verwandt: [[S05 Baustein-Konfig-Panels]] (die zwei existierenden Muster), [[S01 Flow-Editor]].
---
## Farbschema der Kategorien (aus der Planung)
| Kategorie | Farbe | Anzahl |
|---|---|---|
| Auslöser | Grün | 16 |
| Aktionen: Daten & CRM | Rot | 2 |
| Aktionen: Kommunikation | Blau | 1 |
| Aktionen: Aufgaben | Gelb | 2 |
| Logik | Violett | 8 |
| Integration | Grau | 2 |
> ⚠️ Abweichung: Die Subframe-Entwürfe von Baustein-Picker/Konfig (2026-07-11) nutzen Orange für Auslöser und Blau für alle Aktionen. Vor dem Weiterbauen auf dieses Schema (Grün/Rot/Blau/Gelb/Violett/Grau) vereinheitlichen.
---
## Archetypen (Muster-Panels)
| # | Archetyp | Grundaufbau des Panels |
|---|---|---|
| T1 | Datensatz-Auslöser | Filter-Abschnitt: welche Datensätze zählen (Quelle, Pipeline, Feld). Kein Pflichtfeld nötig — läuft auch ungefiltert. |
| T2 | Zeit-/Termin-Auslöser | Zeitbezug: Vorlauf (»3 Tage vorher«), Terminart, bzw. Wiederholungsregel beim Zeitplan. |
| T3 | Eingangs-Auslöser (E-Mail/Formular/Webhook) | Quelle wählen (Postfach, Formular, Webhook-URL anzeigen) + Vorschau der ankommenden Daten (Payload-Felder als Chips für spätere Schritte). |
| A1 | Datensatz-Aktion | Ziel-Datensatz wählen + Feld-Zuordnung (welches Feld bekommt welchen Wert, mit Platzhalter-Chips). |
| A2 | Kommunikations-Aktion | Kanal (E-Mail/Push/intern), Empfänger, Betreff/Text mit Platzhalter-Chips. |
| A3 | Aufgaben-Aktion | Muster existiert (S05): Titel, Verantwortlich (Pflicht), Fälligkeit, Priorität, Notiz. |
| L1 | Bedingungs-Logik | Bedingungszeilen: Feld · Operator · Wert (+ Zeile hinzufügen). Klartext-Zusammenfassung. |
| L2 | Ablauf-Logik | Ein Hauptwert: Dauer (Warten), Liste (Schleife), Variable + Wert (Wert setzen). |
| I1 | Integration | Technischer: URL, Methode, Kopfzeilen/Payload — bewusst als »Profi-Baustein« gekennzeichnet. |
Jedes Panel hat einheitlich: Kopf (Kategorie-farbiges Icon, Name, Klartext-Untertitel, Schließen), Suchfeld entfällt, Pflichtfeld-Validierung inline + Badge am Baustein, »So liest es sich«-Satz unten, Fuß mit Übernehmen/Abbrechen.
---
## Katalog: alle 31 Panels
### Auslöser (Grün)
| Baustein | Kurzbeschreibung (Karte) | Ausgänge | Archetyp | Konfig-Felder (Panel) |
|---|---|---|---|---|
| Neuer Kontakt | Wenn ein Kontakt angelegt wird | 1 | T1 | Quelle (alle/manuell/Import/Formular), optional Tag-Filter |
| Kontakt geändert | Wenn sich Kontaktdaten ändern | 1 | T1 | Welche Felder beobachten (alle oder Auswahl) |
| Neue Anfrage | Wenn eine Anfrage eingeht | 1 | T1 | Quelle (Website-Formular/E-Mail/manuell), optional Bereich |
| Lead qualifiziert | Wenn ein Lead qualifiziert wird | 1 | T1 | Pipeline, Qualifizierungs-Stufe |
| Projekt gewonnen | Wenn ein Projekt gewonnen wird | 1 | T1 | Pipeline/Board, optional Mindestwert |
| Status gewechselt | Wenn eine Karte die Spalte wechselt | 1 | T1 | Board, von Spalte (optional), nach Spalte |
| Projekt angelegt | Wenn ein Projekt erstellt wird | 1 | T1 | Projektart/Board, optional Quelle |
| Deadline naht | Wenn eine Frist bald abläuft | 1 | T2 | Fristtyp (Aufgabe/Projekt/Zahlungsziel), Vorlauf (z. B. 3 Tage vorher) |
| E-Mail eingegangen | Wenn eine E-Mail ankommt | 1 | T3 | Postfach, optional Betreff-/Absender-Filter |
| E-Mail unzustellbar | Wenn eine Kampagnen-Mail bounct | 1 | T3 | Kampagne (alle oder Auswahl), Bounce-Art (hart/weich) |
| Formular abgeschickt | Wenn ein Formular eingeht | 1 | T3 | Formular wählen (aus D-FORM), Felder-Vorschau als Chips |
| Termin gebucht | Wenn ein Termin gebucht wird | 1 | T2 | Terminart/Kalender, optional Mitarbeiter |
| Termin storniert | Wenn ein Termin abgesagt wird | 1 | T2 | Terminart/Kalender, Storno durch (Kunde/intern/beide) |
| Ereignis erstellt | Wenn ein Kalender-Eintrag entsteht | 1 | T2 | Kalender, Ereignisart |
| Zeitplan | Zu festen Zeiten, z. B. montags 8 Uhr | 1 | T2 | Wiederholung (täglich/wöchentlich/monatlich), Wochentag(e), Uhrzeit |
| Webhook empfangen | Wenn ein externes System ruft | 1 | T3 | Webhook-URL (generiert, kopierbar), Secret, Beispiel-Payload-Vorschau |
### Aktionen: Daten & CRM (Rot)
| Baustein | Kurzbeschreibung | Ausgänge | Archetyp | Konfig-Felder |
|---|---|---|---|---|
| Kontakt ändern | Datensatz aktualisieren | 1 | A1 | Welcher Kontakt (aus Auslöser/suchen), Feld-Zuordnungen (Feld → neuer Wert, Platzhalter) |
| Notiz anlegen | Notiz am Datensatz speichern | 1 | A1 | Ziel-Datensatz, Notiztext (Platzhalter), optional sichtbar für |
### Aktionen: Kommunikation (Blau)
| Baustein | Kurzbeschreibung | Ausgänge | Archetyp | Konfig-Felder |
|---|---|---|---|---|
| Benachrichtigung senden | E-Mail, Push oder intern | 1 | A2 | Kanal (Pflicht), Empfänger (Person/Team/Kontakt aus Auslöser), Betreff, Text mit Platzhalter-Chips |
### Aktionen: Aufgaben (Gelb)
| Baustein | Kurzbeschreibung | Ausgänge | Archetyp | Konfig-Felder |
|---|---|---|---|---|
| Aufgabe anlegen | Neue Aufgabe erstellen | 1 | A3 | Titel (Platzhalter), Verantwortlich (Pflicht), Fälligkeit, Priorität, Notiz — Muster existiert |
| Aufgabe zuweisen | Person oder Team zuordnen | 1 | A3 | Welche Aufgabe (aus vorherigem Schritt), neue Person/Team (Pflicht), optional Benachrichtigung an |
### Logik (Violett)
| Baustein | Kurzbeschreibung | Ausgänge | Archetyp | Konfig-Felder |
|---|---|---|---|---|
| Wenn-Dann | Verzweigt nach Bedingung | Ja / Nein | L1 | Bedingungszeilen (Feld · Operator · Wert) |
| Oder | Wenn mind. eine Bedingung zutrifft | Ja / Nein | L1 | Bedingungszeilen, Hinweis »eine reicht« |
| Und | Wenn alle Bedingungen zutreffen | Ja / Nein | L1 | Bedingungszeilen, Hinweis »alle nötig« |
| Switch | Mehrere Pfade verzweigen | 1 / 2 / 3 … | L1 | Feld wählen + je Pfad ein Wert (+ Pfad hinzufügen, Sonst-Pfad) |
| Filter | Datensätze filtern | 1 | L1 | Bedingungszeilen; Klartext »nur weiter, wenn …« |
| Warten | Pausiert, z. B. 3 Tage | 1 | L2 | Dauer (Zahl + Einheit) oder bis Datum/Uhrzeit aus Feld |
| Schleife | Für jedes Element wiederholen | Weiter / Fertig | L2 | Liste wählen (z. B. alle Aufgaben des Projekts), max. Durchläufe |
| Wert setzen | Variable setzen oder lesen | 1 | L2 | Variablenname, Wert (Platzhalter erlaubt) |
### Integration (Grau)
| Baustein | Kurzbeschreibung | Ausgänge | Archetyp | Konfig-Felder |
|---|---|---|---|---|
| HTTP-Anfrage | Externen Dienst aufrufen | 1 | I1 | URL (Pflicht), Methode, Kopfzeilen, Payload (Platzhalter), Antwort-Vorschau |
| An KWP übergeben | Projekt an KWP senden | 1 | — | **ab v2** — nur Registry-Eintrag, kein Konfig-UI (v1-Grenze, s. S05-Notiz) |
---
## Vorgehen für Subframe
1. Farbschema im Picker/Konfig-Entwurf auf das Planungs-Schema angleichen (Grün/Rot/Blau/Gelb/Violett/Grau).
2. Je Archetyp **ein** Muster-Panel als eigene Subframe-Seite bauen (9 Seiten; A3 existiert als Basis aus der Konfig-Runde 2026-07-11).
3. Danach die restlichen 21 v1-Panels als Kopien der Muster-Seiten ablegen und Felder gemäß Katalog oben anpassen (30 Seiten gesamt, KWP entfällt in v1).
4. Benennung in Subframe: »K-T1 Neuer Kontakt«, »K-A2 Benachrichtigung senden« … (K = Konfig-Panel), eigener Flow oder Gruppe, damit der Editor-Flow übersichtlich bleibt.
## Umsetzungsstand Subframe (2026-07-12)
- **Entscheidung (David, 2026-07-12): Konfig als MODAL** (Dialog-Komponente), nicht rechtes Panel/Drawer — n8n-Muster: Klick auf Baustein öffnet Dialog.
- **Alle 30 v1-Panels gebaut** (Nacht-Build 02:37–03:00 Uhr, KWP entfällt v1-gemäß): Benennung »K-<Archetyp> <Name>« im Flow [(MCP) HiveGrid Workflow Engine / Automationen P12](https://app.subframe.com/f023064a5ca0/flow/22d511a9-1d8f-4554-89ad-86729b8d7738/edit).
- Muster/Blaupause: **K-T1 Neuer Kontakt** (Dialog.Content ohne Overrides = 560 px/16 px/24 px laut Layout-Regeln, Labels + Helptexte über Komponenten-Props, jede Feld-Erklärung als helpText, Erklärungs-Box mit Fragezeichen in Kategoriefarbe, Fuß rechts: Abbrechen/Übernehmen). Größere Panels (Kontakt ändern, Benachrichtigung, Aufgabe anlegen, Wenn-Dann, Switch, HTTP) mit `size="medium"` = 720 px.
- Readback-Check aller 30 Seiten bestanden (Dialog.Content, keine p-0/gap-0-Overrides, helpTexts, Erklärungs-Box). **Händisches Review durch David steht aus.**
## Offene Fragen
- Ausgänge-Darstellung im Panel (zeigt das Panel die Ausgänge Ja/Nein bzw. 1/2/3 als Info an?) — David
- Switch: wie viele Pfade maximal in v1?
- Webhook/HTTP: wie viel Technik zeigen wir Handwerkern (Profi-Kennzeichnung reicht?)
02 Wireframes/P12 Automationen/WF-P12 Verwaltung/WF-P12 Verwaltung.canvas
+7 -9
View File
@@ -1,8 +1,8 @@
{
"nodes":[
{"id":"md-paket","type":"file","file":"02 Wireframes/P12 Automationen/WF-P12 Verwaltung/WF-P12 Verwaltung.md","x":-80,"y":-440,"width":460,"height":280},
{"id":"group-verw","type":"group","x":-80,"y":-100,"width":2500,"height":380,"label":"Übersicht und Verläufe"},
{"id":"group-extra","type":"group","x":-80,"y":460,"width":1820,"height":380,"label":"Vorlagen + Konfig-Panels"},
{"id":"md-paket","type":"file","file":"02 Wireframes/P12 Automationen/WF-P12 Verwaltung/WF-P12 Verwaltung.md","x":-80,"y":-440,"width":460,"height":280},
{"id":"note-entry","type":"text","text":"# Einstieg\n\nSidebar → Automation.","x":0,"y":0,"width":300,"height":200},
{"id":"s01","type":"file","file":"02 Wireframes/P12 Automationen/WF-P12 Verwaltung/Screens/S01 Automation-Liste.md","x":500,"y":0,"width":420,"height":200},
{"id":"s02","type":"file","file":"02 Wireframes/P12 Automationen/WF-P12 Verwaltung/Screens/S02 Lauf-Liste.md","x":1140,"y":0,"width":420,"height":200},
@@ -14,24 +14,22 @@
"edges":[
{
"id":"e-entry",
"styleAttributes":{"path":"dotted"},
"fromNode":"note-entry",
"fromSide":"right",
"toNode":"s01",
"toSide":"left",
"toEnd":"arrow",
"styleAttributes":{"path":"dotted"}
"toSide":"left"
},
{"id":"e-runs","fromNode":"s01","fromSide":"right","toNode":"s02","toSide":"left","toEnd":"arrow","label":"Läufe"},
{"id":"e-detail","fromNode":"s02","fromSide":"right","toNode":"s03","toSide":"left","toEnd":"arrow","label":"Lauf öffnen"},
{"id":"e-runs","fromNode":"s01","fromSide":"right","toNode":"s02","toSide":"left","label":"Läufe"},
{"id":"e-detail","fromNode":"s02","fromSide":"right","toNode":"s03","toSide":"left","label":"Lauf öffnen"},
{
"id":"e-template",
"styleAttributes":{"path":"long-dashed"},
"fromNode":"s01",
"fromSide":"bottom",
"toNode":"s04",
"toSide":"top",
"toEnd":"arrow",
"label":"als Vorlage speichern",
"styleAttributes":{"path":"long-dashed"}
"label":"als Vorlage speichern"
}
],
"metadata":{
02 Wireframes/P12 Automationen/WF-P12 Verwaltung/WF-P12 Verwaltung.md
+9 -6
View File
@@ -5,16 +5,16 @@ ticket: D-P12
package: WF-P12 Verwaltung
typ: Flow
status: Validiert
subframe: ""
subframe: "https://app.subframe.com/f023064a5ca0/design/336ccdfb-80f9-45bf-a158-e74cabb70a20/edit"
canvas: "WF-P12 Verwaltung.canvas"
---
# WF-P12 Verwaltung
Status: Validiert (Screen-Liste)
Subframe-Link: -
Status: Validiert (Screen-Liste), Subframe-Erstentwürfe vorhanden
Subframe-Link: Flow »(MCP) HiveGrid Workflow Engine / Automationen P12« — [S01](https://app.subframe.com/f023064a5ca0/design/336ccdfb-80f9-45bf-a158-e74cabb70a20/edit) · [S02](https://app.subframe.com/f023064a5ca0/design/0fab5d8c-1e6a-4220-863d-7e46aba0f06c/edit) · [S03](https://app.subframe.com/f023064a5ca0/design/9997a3c4-d18b-449f-bbbd-4fe6dd24f3df/edit) · [S04](https://app.subframe.com/f023064a5ca0/design/46e04956-4903-4733-9345-81b18f34e858/edit) · [S05](https://app.subframe.com/f023064a5ca0/design/83599a34-97b4-4881-beb4-8b7e35d11aa0/edit)
Canvas: [Canvas](<WF-P12 Verwaltung.canvas>)
Stand: 2026-07-09
Stand: 2026-07-10 (Subframe-Abgleich, Links eingetragen)
---
@@ -101,10 +101,13 @@ S05 (Konfig-Panels) -> eingebettet in Flow-Editor S01
## 10. Offene Fragen
- Welche zwei Muster-Panels für S05 (Vorschlag: Auslöser »Neue Anfrage« + Aktion »Aufgabe anlegen«) → beim Subframe-Bau
- ~~Welche zwei Muster-Panels für S05~~ → umgesetzt wie vorgeschlagen: Auslöser »Neue Anfrage« + Aktion »Aufgabe anlegen« (Abgleich 2026-07-10)
- S02–S05 stehen in Subframe ohne DefaultPageLayout (App-Shell) — vereinheitlichen?
- S01: Copy-Bug Spalte »Läufe (30 Tage)« zeigt »143 Datensätze« → fixen
- S03: Demo-Widerspruch Probelauf-Marker + Rückgängig-Angebot → Demo-Daten korrigieren
## Handoff-Check
- [x] Jeder Screen ist mit Umsetzung markiert.
- [x] Meldungs-/Error-State-Matrix ist ausgefüllt.
- [ ] Subframe-Link ist eingetragen. *(Subframe erst nach explizitem OK)*
- [x] Subframe-Link ist eingetragen. *(Erstentwürfe, Abgleich s. Screen-Dateien)*
02 Wireframes/P15 Kommunikation/WF-P15 Team-Chat/Screens/M01 Neuer Channel DM.md
+37
View File
@@ -0,0 +1,37 @@
---
kind: screen
project: HiveGrid Screen Project
ticket: D-CHAT + AK-P15b
package: WF-P15 Team-Chat
id: M01
screen: Neuer Channel / DM
typ: Modal
umsetzung: Bauen
status: Entwurf
route: "aus S01/S02"
subframe: ""
---
# M01 — Neuer Channel / DM
## Ziel
Ein neuer Gruppen-Channel oder eine Direktnachricht ist schnell erstellt, mit klarer Privatsphäre.
## Was das Tool können muss
- Umschalter: Gruppe / Direktnachricht
- Gruppe: Name, Beschreibung, öffentlich/privat, Mitglieder wählen
- DM: eine oder mehrere Personen suchen; bestehende DM erkennen und öffnen statt Duplikat
- Optional: Projekt verknüpfen nur, wenn aus Projekt-Kontext geöffnet
- Vorschau, wer Zugriff bekommt
- Validierung: Name fehlt, private Gruppe ohne Mitglieder, DM mit sich selbst, fehlende Berechtigung
- Nach Anlegen direkt zu S02
## Pattern / Archetyp
A5 Modal.
## Subframe
- (erst nach explizitem OK)
02 Wireframes/P15 Kommunikation/WF-P15 Team-Chat/Screens/M02 DM-Audit-Begruendung.md
+37
View File
@@ -0,0 +1,37 @@
---
kind: screen
project: HiveGrid Screen Project
ticket: D-CHAT + AK-P15b
package: WF-P15 Team-Chat
id: M02
screen: DM-Audit-Begründung
typ: Modal
umsetzung: Bauen
status: Entwurf
route: "aus S08"
subframe: ""
---
# M02 — DM-Audit-Begründung
## Ziel
Admin-Einsicht in Direktnachrichten ist eine Ausnahmehandlung, nicht normales Browsing.
## Was das Tool können muss
- Zeigt betroffene DM, Mitglieder und Zweck der Einsicht
- Pflichtfeld: Begründung
- Hinweis: Einsicht wird audit-geloggt und im DM sichtbar markiert
- Optional: Session-Dauer anzeigen
- Bestätigen öffnet S02 mit Admin-Audit-Banner
- Abbrechen zurück zu S08
- Validierung: Begründung fehlt/zu kurz, keine `read_all_channels`-Berechtigung
## Pattern / Archetyp
A5 Confirm-/Reason-Modal.
## Subframe
- (erst nach explizitem OK)
02 Wireframes/P15 Kommunikation/WF-P15 Team-Chat/Screens/S01 Chat-Index.md
+40
View File
@@ -0,0 +1,40 @@
---
kind: screen
project: HiveGrid Screen Project
ticket: D-CHAT + AK-P15b
package: WF-P15 Team-Chat
id: S01
screen: Chat-Index
typ: BESPOKE
umsetzung: Bauen
status: Entwurf
route: "/chat"
subframe: ""
---
# S01 — Chat-Index
## Ziel
Der Nutzer sieht sofort, wo etwas Neues passiert ist: ungelesene Channels, @Mentions, Projekt-Chats und DMs.
## Was das Tool können muss
- Channel-Liste mit Name, Avatar/Typ, Snippet, Zeitstempel, Unread-Badge, Mention-Marker, Pin-/Mute-Indikator
- Typen: Projekt-Channel, öffentliche Gruppe, private Gruppe, DM
- Projekt-Channels zeigen Projekt-Status/Stage und Link zum Projekt
- Filter: Alle, Ungelesen, Mentions, Projekt, Gruppen, DMs, Archiviert
- Suche innerhalb der Channel-Liste + Link zur globalen Suche S06
- Channel-Browser/Discover für öffentliche Gruppen
- Schnell-Aktionen je Zeile: anpinnen, stummschalten, als gelesen markieren, archivieren/verlassen je Berechtigung
- CTA: Neuer Channel / DM → M01
- Link: Meine Mentions → S05
- Zustände: keine Channels, nur archivierte Channels, laden, offline/reconnect, keine Berechtigung
## Pattern / Archetyp
BESPOKE-Chat-Index; kompakter, scannbarer Arbeitsbereich statt Marketing-Layout.
## Subframe
- (erst nach explizitem OK)
02 Wireframes/P15 Kommunikation/WF-P15 Team-Chat/Screens/S02 Channel-Detail.md
+41
View File
@@ -0,0 +1,41 @@
---
kind: screen
project: HiveGrid Screen Project
ticket: D-CHAT + AK-P15b
package: WF-P15 Team-Chat
id: S02
screen: Channel-Detail
typ: BESPOKE
umsetzung: Bauen
status: Entwurf
route: "/chat/:id"
subframe: ""
---
# S02 — Channel-Detail
## Ziel
Hier wird wirklich gearbeitet: Nachrichten lesen, antworten, Dateien teilen, Threads öffnen, Aufgaben erzeugen.
## Was das Tool können muss
- Header: Channel-Name, Typ, Member-Anzahl, Projekt-Link falls Projekt-Channel, Suche, Settings-Link S07
- Pinned-Preview: max. 3 angepinnte Nachrichten inline + »alle anzeigen« → S04
- Verlauf mit Datums-Trennern und System-Messages
- Nachricht: Avatar, Name, Zeit, Markdown-Body, Mentions, Anhänge, Link-Preview, Edited-/Lösch-Marker
- Reactions: Emoji + Anzahl + wer reagiert hat
- Thread-Indikator: Anzahl Antworten, letzter Reply, Klick → S03
- Read-Receipt: »X von Y gelesen«; DM zeigt gelesen/zugestellt kompakt
- Composer: Markdown, Emoji, @Mention-Autocomplete, Datei-Dropzone, Foto/Anhang, Draft-Autosave
- Typing-Indikator und Reconnect-Banner
- Per-Message-Menü: reagieren, Thread, pinnen, als Aufgabe markieren (WF-P4 M01), Link kopieren, bearbeiten, löschen
- Rechte/States: read-only archiviert, muted, reconnect, Upload-Fehler, pending message, keine Berechtigung
## Pattern / Archetyp
BESPOKE Real-Time-Chat. Stable Composer und Verlauf ohne Layoutsprünge sind wichtiger als dekorative Flächen.
## Subframe
- (erst nach explizitem OK)
02 Wireframes/P15 Kommunikation/WF-P15 Team-Chat/Screens/S03 Thread-Detail.md
+37
View File
@@ -0,0 +1,37 @@
---
kind: screen
project: HiveGrid Screen Project
ticket: D-CHAT + AK-P15b
package: WF-P15 Team-Chat
id: S03
screen: Thread-Detail
typ: BESPOKE Panel/Route
umsetzung: Bauen
status: Entwurf
route: "/chat/:id/thread/:thread_id"
subframe: ""
---
# S03 — Thread-Detail
## Ziel
Eine Nebendiskussion bleibt bei der Ausgangsnachricht, ohne den Hauptverlauf zu überfrachten.
## Was das Tool können muss
- Eltern-Nachricht oben vollständig anzeigen (inkl. Anhänge/Reactions)
- Replies chronologisch, mit denselben Message-Elementen wie S02
- Eigener Composer für Replies mit @Mentions, Emoji, Anhängen, Draft
- Link zurück zum Kontext im Channel
- Aktionen: reagieren, pinnen, als Aufgabe markieren, Link kopieren, bearbeiten/löschen je Recht
- Read-Receipt/Seen-Info für Thread-Replies
- Zustände: Thread gelöscht, Ausgangsnachricht gelöscht, keine Berechtigung, reconnect, leerer Thread
## Pattern / Archetyp
BESPOKE-Teilfläche. Kann als Side-Panel oder eigene Route gebaut werden; für die Planung eigener Nachweis-Frame.
## Subframe
- (erst nach explizitem OK)
02 Wireframes/P15 Kommunikation/WF-P15 Team-Chat/Screens/S04 Angepinnte Nachrichten.md
+36
View File
@@ -0,0 +1,36 @@
---
kind: screen
project: HiveGrid Screen Project
ticket: D-CHAT + AK-P15b
package: WF-P15 Team-Chat
id: S04
screen: Angepinnte Nachrichten
typ: A2 Liste
umsetzung: Bauen
status: Entwurf
route: "/chat/:id/pinned"
subframe: ""
---
# S04 — Angepinnte Nachrichten
## Ziel
Wichtige Entscheidungen, Dateien und Hinweise im Channel sind schnell wieder auffindbar.
## Was das Tool können muss
- Liste aller Pins im Channel, max. 50
- Zeile: Nachrichtenausschnitt, Autor, Datum, Pin-Ersteller, Anhänge, Link zum Kontext
- Filter/Suche innerhalb der Pins
- Aktionen: entpinnen, Link kopieren, als Aufgabe markieren
- Hinweis, wenn Pin-Limit erreicht ist
- Zustände: keine Pins, Nachricht gelöscht, keine Berechtigung
## Pattern / Archetyp
A2 Liste als Nebenfläche aus dem Channel.
## Subframe
- (erst nach explizitem OK)
02 Wireframes/P15 Kommunikation/WF-P15 Team-Chat/Screens/S05 Meine Mentions.md
+36
View File
@@ -0,0 +1,36 @@
---
kind: screen
project: HiveGrid Screen Project
ticket: D-CHAT + AK-P15b
package: WF-P15 Team-Chat
id: S05
screen: Meine Mentions
typ: A2 Liste
umsetzung: Bauen
status: Entwurf
route: "/chat/mentions"
subframe: ""
---
# S05 — Meine Mentions
## Ziel
Alle @Erwähnungen über Channels hinweg an einem Ort, damit nichts untergeht.
## Was das Tool können muss
- Liste kanalübergreifender Mentions an mich
- Spalten/Zeile: Channel, Projekt falls vorhanden, Nachrichtenausschnitt, Autor, Zeitpunkt, gelesen/ungelesen
- Filter: ungelesen, Projekt, Gruppe, DM, Zeitraum
- Aktionen: öffnen im Kontext, als gelesen markieren, als Aufgabe markieren
- Gruppierung nach Heute / Gestern / Älter
- Zustände: keine Mentions, keine Berechtigung für Channel inzwischen verloren, laden, Fehler
## Pattern / Archetyp
A2 Liste, ähnlich Benachrichtigungen/Aufgaben, aber mit Chat-Kontext.
## Subframe
- (erst nach explizitem OK)
02 Wireframes/P15 Kommunikation/WF-P15 Team-Chat/Screens/S06 Chat-Suche.md
+36
View File
@@ -0,0 +1,36 @@
---
kind: screen
project: HiveGrid Screen Project
ticket: D-CHAT + AK-P15b
package: WF-P15 Team-Chat
id: S06
screen: Chat-Suche
typ: A2 Suche
umsetzung: Bauen
status: Entwurf
route: "/chat/search"
subframe: ""
---
# S06 — Chat-Suche
## Ziel
Nachrichten, Dateien und Entscheidungen über alle erlaubten Channels hinweg finden.
## Was das Tool können muss
- Suchfeld mit Ergebnisliste und Treffer-Kontext
- Filter: Channel, Typ, Projekt, Autor, Zeitraum, mit Anhang, nur Pins
- Ergebnis zeigt Snippet mit hervorgehobener Fundstelle, Channel, Autor, Datum, Anhänge
- Klick öffnet S02 an der richtigen Nachricht oder S03 im Thread
- Permission-sicher: nur erlaubte Channels durchsuchen
- Zustände: keine Treffer, zu kurze Suche, Suche läuft, Fehler
## Pattern / Archetyp
A2 Suche mit Chat-spezifischem Kontext.
## Subframe
- (erst nach explizitem OK)
02 Wireframes/P15 Kommunikation/WF-P15 Team-Chat/Screens/S07 Channel-Einstellungen.md
+37
View File
@@ -0,0 +1,37 @@
---
kind: screen
project: HiveGrid Screen Project
ticket: D-CHAT + AK-P15b
package: WF-P15 Team-Chat
id: S07
screen: Channel-Einstellungen
typ: A6 Settings
umsetzung: Bauen
status: Entwurf
route: "/chat/:id/settings"
subframe: ""
---
# S07 — Channel-Einstellungen
## Ziel
Channel-Mitglieder, Privatsphäre und Archivierung werden kontrolliert, ohne den Chatverlauf zu beschädigen.
## Was das Tool können muss
- Grunddaten: Name, Beschreibung, Typ (öffentlich/privat/Projekt/DM), Projekt-Verknüpfung falls vorhanden
- Mitgliederliste mit Rolle, Status, zuletzt aktiv; hinzufügen/entfernen je Recht
- Projekt-Channel: Hinweis, dass Mitglieder aus dem Projekt synchronisiert werden
- Privacy-Einstellung für Gruppen (public/private) wenn erlaubt
- Optionen: stummschalten, anpinnen, verlassen, archivieren, wiederherstellen
- Gefahrenbereich: Channel archivieren mit Grund; DM nicht manuell erweiterbar
- Zustände: keine Admin-Rechte, Projekt-Sync überschreibt manuelle Änderung, archivierter Channel read-only
## Pattern / Archetyp
A6 Settings. DM-Settings bewusst reduziert.
## Subframe
- (erst nach explizitem OK)
02 Wireframes/P15 Kommunikation/WF-P15 Team-Chat/Screens/S08 Admin-Chat.md
+37
View File
@@ -0,0 +1,37 @@
---
kind: screen
project: HiveGrid Screen Project
ticket: D-CHAT + AK-P15b
package: WF-P15 Team-Chat
id: S08
screen: Admin-Chat-Übersicht
typ: A2/A3 Admin
umsetzung: Bauen
status: Entwurf
route: "/admin/chat"
subframe: ""
---
# S08 — Admin-Chat-Übersicht
## Ziel
Admins können Channels verwalten und im Ausnahmefall auditierbar prüfen, ohne heimliche DM-Einsicht zu ermöglichen.
## Was das Tool können muss
- Tabelle aller Channels: Name, Typ, Mitglieder, Projekt, letzte Nachricht, Status, Archiviert
- Filter: Typ, Projekt, archiviert, private Gruppen, DMs
- Aktionen: öffnen, Mitglieder korrigieren, archivieren, Force-Delete nur mit Berechtigung
- DM öffnen immer nur über M02 (Begründungspflicht)
- Nach Audit-Freigabe: S02 mit sichtbarem **Admin-Einsicht aktiv**-Banner
- Audit-Info: wer, wann, welche Begründung, Session-Ablauf
- Zustände: keine Admin-Berechtigung, Audit-Session abgelaufen, Channel gelöscht
## Pattern / Archetyp
A2/A3 Admin-Fläche mit explizitem Audit-Guard.
## Subframe
- (erst nach explizitem OK)
02 Wireframes/P15 Kommunikation/WF-P15 Team-Chat/Screens/V01 Monteur-Handy-Chat.md
+38
View File
@@ -0,0 +1,38 @@
---
kind: screen
project: HiveGrid Screen Project
ticket: D-CHAT + AK-P15b
package: WF-P15 Team-Chat
id: V01
screen: Monteur-Handy-Chat
typ: BESPOKE-Mobile
umsetzung: Bauen
status: Entwurf
route: "Variante von S02"
subframe: ""
---
# V01 — Monteur-Handy-Chat 📱
## Ziel
Monteurinnen und Monteure schreiben im Projekt-Chat schnell vom Handy: lesen, antworten, Foto senden.
## Was das Tool können muss
- Mobile Channel-Detail-Ansicht mit Fokus auf Projekt-Chat
- Vereinfachter Header: Projekt/Channel, Zurück, Info
- Verlauf touch-tauglich, Anhänge/Fotos groß genug
- Composer mit Text, Foto-Direktupload, @Mention, Senden
- Push-/Unread-Hinweis, Scroll-to-bottom, neue Nachrichten
- Offline/Reconnect: Entwurf bleibt erhalten, Foto wartet auf Upload
- Reduzierte Aktionen: reagieren, Thread öffnen, Foto senden, als Aufgabe markieren
- Keine Admin-/Settings-Komplexität im Mobile-Hauptframe
## Pattern / Archetyp
BESPOKE-Mobile. Dicht und robust, optimiert für Baustelle statt Desktop-Vollumfang.
## Subframe
- (erst nach explizitem OK)
02 Wireframes/P15 Kommunikation/WF-P15 Team-Chat/WF-P15 Team-Chat.canvas
+35
View File
@@ -0,0 +1,35 @@
{
"nodes": [
{"id":"md-paket","type":"file","file":"02 Wireframes/P15 Kommunikation/WF-P15 Team-Chat/WF-P15 Team-Chat.md","x":-80,"y":-440,"width":460,"height":280},
{"id":"group-main","type":"group","x":-80,"y":-100,"width":1740,"height":660,"label":"Chat Hauptfläche"},
{"id":"group-side","type":"group","x":1840,"y":-100,"width":1700,"height":660,"label":"Nebenflächen"},
{"id":"group-admin","type":"group","x":3720,"y":-100,"width":1180,"height":660,"label":"Admin & Modals"},
{"id":"note-entry","type":"text","text":"# Einstieg\n\nSidebar → Chat oder Projekt-Detail → Projekt-Channel.\n\nTelefonie bleibt eigenes Paket; dieser Flow ist nur Team-Chat.","x":0,"y":0,"width":360,"height":200},
{"id":"s01","type":"file","file":"02 Wireframes/P15 Kommunikation/WF-P15 Team-Chat/Screens/S01 Chat-Index.md","x":560,"y":0,"width":420,"height":200},
{"id":"s02","type":"file","file":"02 Wireframes/P15 Kommunikation/WF-P15 Team-Chat/Screens/S02 Channel-Detail.md","x":1120,"y":0,"width":420,"height":200},
{"id":"s03","type":"file","file":"02 Wireframes/P15 Kommunikation/WF-P15 Team-Chat/Screens/S03 Thread-Detail.md","x":1120,"y":300,"width":420,"height":200},
{"id":"v01","type":"file","file":"02 Wireframes/P15 Kommunikation/WF-P15 Team-Chat/Screens/V01 Monteur-Handy-Chat.md","x":560,"y":300,"width":420,"height":200},
{"id":"s04","type":"file","file":"02 Wireframes/P15 Kommunikation/WF-P15 Team-Chat/Screens/S04 Angepinnte Nachrichten.md","x":1920,"y":0,"width":420,"height":200},
{"id":"s05","type":"file","file":"02 Wireframes/P15 Kommunikation/WF-P15 Team-Chat/Screens/S05 Meine Mentions.md","x":2480,"y":0,"width":420,"height":200},
{"id":"s06","type":"file","file":"02 Wireframes/P15 Kommunikation/WF-P15 Team-Chat/Screens/S06 Chat-Suche.md","x":3040,"y":0,"width":420,"height":200},
{"id":"s07","type":"file","file":"02 Wireframes/P15 Kommunikation/WF-P15 Team-Chat/Screens/S07 Channel-Einstellungen.md","x":2480,"y":300,"width":420,"height":200},
{"id":"note-task","type":"text","text":"# Wiederverwendet\n\n»Als Aufgabe markieren« öffnet WF-P4 Aufgaben M01 vorbefüllt mit Nachricht, Channel und Link zum Kontext.","x":3040,"y":300,"width":420,"height":200},
{"id":"m01","type":"file","file":"02 Wireframes/P15 Kommunikation/WF-P15 Team-Chat/Screens/M01 Neuer Channel DM.md","x":3800,"y":0,"width":420,"height":200},
{"id":"s08","type":"file","file":"02 Wireframes/P15 Kommunikation/WF-P15 Team-Chat/Screens/S08 Admin-Chat.md","x":4360,"y":0,"width":420,"height":200},
{"id":"m02","type":"file","file":"02 Wireframes/P15 Kommunikation/WF-P15 Team-Chat/Screens/M02 DM-Audit-Begruendung.md","x":4360,"y":300,"width":420,"height":200}
],
"edges": [
{"id":"e-entry","fromNode":"note-entry","fromSide":"right","toNode":"s01","toSide":"left","toEnd":"arrow","styleAttributes":{"path":"dotted"}},
{"id":"e-open","fromNode":"s01","fromSide":"right","toNode":"s02","toSide":"left","toEnd":"arrow","label":"öffnen"},
{"id":"e-thread","fromNode":"s02","fromSide":"bottom","toNode":"s03","toSide":"top","toEnd":"arrow","label":"Thread"},
{"id":"e-mobile","fromNode":"s02","fromSide":"bottom","toNode":"v01","toSide":"top","toEnd":"arrow","label":"Handy"},
{"id":"e-pins","fromNode":"s02","fromSide":"right","toNode":"s04","toSide":"left","toEnd":"arrow","label":"Pins"},
{"id":"e-mentions","fromNode":"s01","fromSide":"right","toNode":"s05","toSide":"left","toEnd":"arrow","label":"Mentions"},
{"id":"e-search","fromNode":"s01","fromSide":"right","toNode":"s06","toSide":"left","toEnd":"arrow","label":"Suche"},
{"id":"e-settings","fromNode":"s02","fromSide":"right","toNode":"s07","toSide":"left","toEnd":"arrow","label":"Settings"},
{"id":"e-new","fromNode":"s01","fromSide":"right","toNode":"m01","toSide":"left","toEnd":"arrow","label":"neu"},
{"id":"e-admin-reason","fromNode":"s08","fromSide":"bottom","toNode":"m02","toSide":"top","toEnd":"arrow","label":"DM öffnen"},
{"id":"e-admin-open","fromNode":"m02","fromSide":"left","toNode":"s02","toSide":"right","toEnd":"arrow","label":"Audit-Banner"},
{"id":"e-task-note","fromNode":"note-task","fromSide":"left","toNode":"s02","toSide":"right","toEnd":"arrow","styleAttributes":{"path":"dotted"}}
]
}
02 Wireframes/P15 Kommunikation/WF-P15 Team-Chat/WF-P15 Team-Chat.md
+144
View File
@@ -0,0 +1,144 @@
---
kind: wireframe-package
project: HiveGrid Screen Project
ticket: D-CHAT + AK-P15b
package: WF-P15 Team-Chat
typ: Flow
status: Entwurf
subframe: ""
canvas: "WF-P15 Team-Chat.canvas"
---
# WF-P15 Team-Chat
Status: Entwurf (nicht mit David validiert)
Subframe-Link: -
Canvas: [Canvas](<WF-P15 Team-Chat.canvas>)
Stand: 2026-07-09
---
## 1. Kurzfassung
Der interne Team-Chat: Channel-Liste, Echtzeit-Verlauf, Threads, Reaktionen, Pins, Anhänge, @-Erwähnungen, kanalübergreifende Suche und eine vereinfachte Monteur-Handy-Ansicht. Projekt-Channels hängen am Projekt und synchronisieren die Projektmitglieder. Admins können DMs nur über einen begründeten Audit-Modus einsehen; der Zugriff wird sichtbar markiert und protokolliert.
---
## 2. Intent Check
| Frage | Antwort |
|---|---|
| Ticket/Modul | D-CHAT, Dev-Pendant AK-P15b |
| Nutzer-Ziel | Schnell im Team, Projekt oder 1:1 schreiben, Kontext finden und nichts durch Mentions/Ungelesenheit verpassen |
| Quellen geprüft | `ticket-docs/D-CHAT.md`, `ticket-docs/AK-P15b.md`, HiveGrid Map, Aufgaben-Muster für Mark-as-Task |
| Sicher im Scope | Chat-Index, Channel-Detail, Thread, Pins, Mentions, Suche, Channel anlegen/settings, Admin-Audit, Mobile-Monteur |
| Sicher nicht im Scope | Telefonie/AirCall (WF-P15 Telefonie), HalloPetra, WhatsApp/Unified Inbox, Whisper-Diktat |
| Unsichere Annahmen | Projekt-Chat ist im Projekt-Detail eingebettet, aber die eigentliche Channel-View bleibt dieser Flow |
---
## 3. Scope
| Punkt | Inhalt |
|---|---|
| Startpunkt | Sidebar »Chat« oder Projekt-Detail »Chat« |
| Ziel | Nachricht gesendet/gelesen, Thread beantwortet, Channel gefunden/angelegt, Admin-Audit sauber begründet |
| Haupt-Archetyp | **BESPOKE** Real-Time-Chat + A2/A6 Nebenflächen + A5 Modals |
| Out of scope | Telefonie, externe Kundenkommunikation, WhatsApp, KI-Hilfe-Chat |
---
## 4. Entscheidungsentwurf (nicht validiert)
| Entscheidung | Status | Notiz |
|---|---|---|
| Chat als eigener Bespoke-Flow | Entwurf | Real-Time-Layout ist kein Standard-A2/A3 |
| Channel-Detail ist die Hauptarbeitsfläche | Entwurf | Header, Pinned-Preview, Verlauf, Composer, Thread/Info-Seitenflächen |
| Thread als eigener nachweisbarer Screen | Entwurf | Kann später als Side-Panel oder Route umgesetzt werden; UX muss sichtbar sein |
| Pins, Mentions und Suche als eigene Nebenflächen | Entwurf | Diese sind schnelle Arbeitslisten, nicht nur Filter im Channel |
| Projekt-Channel ist entity-linked | Entwurf | Projektmitglieder werden synchronisiert; Einstieg im Projekt-Detail, View bleibt S02 |
| Admin-DM-Audit ist kein normaler Admin-Browse | Entwurf | Pflicht-Begründung je Session + Banner im geöffneten DM + Audit-Log |
| Monteur-Handy-Ansicht eigener Frame | Entwurf | Vereinfachte Navigation, Foto-Direktupload, Push/Offline-Hinweis |
| Telefonie bleibt eigenes Paket | Entwurf | D-CHAT enthält keinen AirCall-Setup/Calls-Flow |
### Happy Path
1. Nutzer öffnet `/chat`, sieht Channels nach Ungelesenheit, Mentions und Pins sortiert.
2. Er öffnet einen Projekt-Channel, liest neue Nachrichten, antwortet mit @Mention und hängt ein Foto an.
3. Eine Nachricht braucht Nacharbeit → Hover-Menü »als Aufgabe markieren« öffnet den P4-Aufgaben-Dialog vorbefüllt.
4. Auf dem Handy nutzt der Monteur die vereinfachte Ansicht: Projekt-Chat öffnen, Foto hochladen, kurze Antwort senden.
### Meldungs-/Error-States (Entwurf)
| Ereignis | UI-Form | Blockiert? | Bauen? | Copy/Notiz |
|---|---|---|---|---|
| Reconnect / WebSocket weg | Banner in S02/V01 | nein | Nur dokumentieren | »Verbindung unterbrochen — wir verbinden neu.« |
| Nachricht noch nicht gesendet | Optimistic-Zustand in S02/V01 | nein | Nur dokumentieren | Uhr/Retry, kein Layoutsprung |
| Upload fehlgeschlagen | Inline am Anhang | nein | Nur dokumentieren | erneut versuchen / entfernen |
| Keine Channel-Berechtigung | 404/Permission-State | ja | Wiederverwenden | keine Channel-Details leaken |
| Projekt-Channel ohne Projektzugriff | Permission-State | ja | Nur dokumentieren | Projektrechte gewinnen |
| Zu viele Pins | Inline-Hinweis in S02/S04 | nein | Nur dokumentieren | max. 50 Pins je Channel |
| DM-Audit ohne Begründung | M02 blockiert | ja | Bauen (M02) | Pflichtbegründung |
| Admin liest DM | sichtbarer Banner in S02/S08 | nein | Bauen in S08/S02 | »Admin-Einsicht aktiv« |
| Mobile offline | Banner in V01 | nein | Nur dokumentieren | Entwurf bleibt lokal |
---
## 7. Screen-Liste (Entwurf)
| ID | Screen/Zustand | Typ | Umsetzung | Ort | Status |
|---|---|---|---|---|---|
| S01 | Chat-Index | BESPOKE | Bauen | `/chat` | Entwurf |
| S02 | Channel-Detail | BESPOKE | Bauen | `/chat/:id` | Entwurf |
| S03 | Thread-Detail | BESPOKE Panel/Route | Bauen | `/chat/:id/thread/:thread_id` | Entwurf |
| S04 | Angepinnte Nachrichten | A2 Liste | Bauen | `/chat/:id/pinned` | Entwurf |
| S05 | Meine Mentions | A2 Liste | Bauen | `/chat/mentions` | Entwurf |
| S06 | Chat-Suche | A2 Suche | Bauen | `/chat/search` | Entwurf |
| S07 | Channel-Einstellungen | A6 Settings | Bauen | `/chat/:id/settings` | Entwurf |
| S08 | Admin-Chat-Übersicht | A2/A3 Admin | Bauen | `/admin/chat` | Entwurf |
| V01 | Monteur-Handy-Chat | BESPOKE-Mobile | Bauen | Variante von S02 | Entwurf |
| M01 | Neuer Channel / DM | Modal | Bauen | aus S01/S02 | Entwurf |
| M02 | DM-Audit-Begründung | Modal | Bauen | aus S08 | Entwurf |
| D01–D09 | Reconnect / Pending / Upload / Permission / Pins / Offline (s. Tabelle) | Inline/Zustand | Nur dokumentieren | — | Entwurf |
---
## 8. Grid
```text
Sidebar -> S01 (Chat-Index)
S01 -> S02 (Channel öffnen)
S02 -> S03 (Thread öffnen)
S02 -> S04 (Pins)
S01/S02 -> S05 (Meine Mentions)
S01/S02 -> S06 (Suche)
S02 -> S07 (Channel-Einstellungen)
S01/S02 -> M01 (neuer Channel / DM)
S02 -> V01 (Handy-Variante)
S08 Admin -> M02 (Begründung) -> S02 mit Audit-Banner
S02 Hover-Menü -> WF-P4 Aufgaben M01 (Mark-as-Task, vorbefüllt)
Projekt-Detail -> S02 (entity-linked Projekt-Channel)
```
---
## 9. Screen-Pakete
- [[S01 Chat-Index]] · [[S02 Channel-Detail]] · [[S03 Thread-Detail]] · [[S04 Angepinnte Nachrichten]]
- [[S05 Meine Mentions]] · [[S06 Chat-Suche]] · [[S07 Channel-Einstellungen]] · [[S08 Admin-Chat]]
- [[V01 Monteur-Handy-Chat]] · [[M01 Neuer Channel DM]] · [[M02 DM-Audit-Begruendung]]
---
## 10. Offene Fragen
- Thread-Detail als Side-Panel oder eigene Route: Paket lässt beides zu; Subframe entscheidet nach Layout-Test.
- Channel-Browser/Discover: v1 im Chat-Index als Bereich/Overlay, kein eigener Screen.
- Read-Receipt-Kopie: »X von Y gelesen« reicht im Verlauf; Detail-Liste erst bei Bedarf.
- Push-Verhalten für Monteure: mit Benachrichtigungen P3 abstimmen.
## Handoff-Check
- [ ] Screen-Liste mit David validieren.
- [ ] Meldungs-/Error-State-Matrix mit David validieren.
- [ ] Subframe-Link ist eingetragen. *(Subframe erst nach explizitem OK)*
02 Wireframes/P16 Termine/WF-P16 E-Signatur/Screens/M01 Zurueckziehen.md
+36
View File
@@ -0,0 +1,36 @@
---
kind: screen
project: HiveGrid Screen Project
ticket: D-P16 (Teil) + AK-P16d
package: WF-P16 E-Signatur
id: M01
screen: Signatur zurückziehen
typ: Confirm-Modal
umsetzung: Bauen
status: Validiert
route: "aus S03"
subframe: ""
---
# M01 — Signatur zurückziehen
## Ziel
Das Büro kann einen laufenden Signaturvorgang bewusst stoppen, ohne den Verlauf zu verlieren.
## Was das Tool können muss
- Zeigt Dokumenttitel, betroffene Unterzeichner und aktuellen Status
- Pflichtfeld: Grund für das Zurückziehen
- Hinweis: Signatur-Link wird ungültig; bereits erzeugte Nachweise/Verläufe bleiben sichtbar
- Option: Unterzeichner per E-Mail informieren
- Bestätigen/Abbrechen; danach Status »zurückgezogen« in S03 und Link-Zustand in S04
- Bulk nicht nötig in v1
## Pattern / Archetyp
A5 Confirm-Modal.
## Subframe
- (erst nach explizitem OK)
02 Wireframes/P16 Termine/WF-P16 E-Signatur/Screens/S01 Signaturen im Projekt.md
+38
View File
@@ -0,0 +1,38 @@
---
kind: screen
project: HiveGrid Screen Project
ticket: D-P16 (Teil) + AK-P16d
package: WF-P16 E-Signatur
id: S01
screen: Signaturen im Projekt
typ: A3/A2 eingebettet
umsetzung: Bauen
status: Validiert
route: "Projekt-Detail, Reiter/Aktion"
subframe: ""
---
# S01 — Signaturen im Projekt
## Ziel
Im Projekt ist sofort sichtbar, welche Dokumente zur Unterschrift raus sind, was offen ist und was abgeschlossen wurde.
## Was das Tool können muss
- Reiter/Sektion im Projekt-Detail: **Signaturen**
- Liste der Signatur-Dokumente: Titel, Status, Unterzeichner-Fortschritt, zuletzt geändert, Ablaufdatum
- Primäraktion: **Zur Signatur senden** → S02
- Zeilen-Klick → S03 (Detail & Status)
- Schnell-Aktionen: erinnern, zurückziehen (M01), Downloads wenn abgeschlossen
- Status-Badges: Entwurf, gesendet, angesehen, teilweise signiert, signiert, abgelehnt, zurückgezogen, abgelaufen, Fehler
- Hinweis: Artefakte liegen in den Projekt-Dateien (Original, signiertes PDF, Abschluss-Nachweis)
- Zustände: leer (CTA »Erstes Dokument senden«), laden, Fehler, keine Berechtigung
## Pattern / Archetyp
A3 Projekt-Detail-Sektion mit A2-Listenmuster; passt in das Karteikarten-Muster aus WF-P9 Projekt-Akte.
## Subframe
- (erst nach explizitem OK)
02 Wireframes/P16 Termine/WF-P16 E-Signatur/Screens/S02 Signatur-Wizard.md
+39
View File
@@ -0,0 +1,39 @@
---
kind: screen
project: HiveGrid Screen Project
ticket: D-P16 (Teil) + AK-P16d
package: WF-P16 E-Signatur
id: S02
screen: Signatur-Wizard
typ: A5 Wizard
umsetzung: Bauen
status: Validiert
route: "aus Projekt-Detail / S01"
subframe: ""
---
# S02 — Signatur-Wizard
## Ziel
Das Büro verschickt ein PDF zur Unterschrift, ohne sich mit Technik, Provider-Details oder manueller Ablage zu beschäftigen.
## Was das Tool können muss
- Schritt 1: **PDF wählen** aus Projekt-Dateien ODER neues PDF hochladen (Dropzone), Dateiname/Titel prüfen
- Schritt 2: **Unterzeichner**: Name, E-Mail, Rolle, Kontakt-Verknüpfung, Reihenfolge; Kunde aus Projekt/Kontakt vorausgefüllt
- Reihenfolge: parallel oder sequenziell; bei sequenziell klar zeigen, wer zuerst dran ist
- Schritt 3: **Signaturmodus**: Fern-Link + Code (OTP) ODER Vor Ort auf diesem Gerät (V01)
- Optional: PandaDoc BYOK nur anzeigen, wenn verbunden; sonst Default **SES-Eigenbau**
- Nachricht an Unterzeichner: Betreff, kurzer Text, Ablaufdatum
- Zusammenfassung vor dem Senden: Dokument, Unterzeichner, Modus, Reihenfolge, Ablauf
- Senden → S03; Vor-Ort-Modus → V01
- Validierung: PDF fehlt, Fern-Link ohne E-Mail, doppelte E-Mail, ungültige Reihenfolge, Datei nicht PDF
## Pattern / Archetyp
A5 Wizard, bewusst kompakt; technische Provider-Details bleiben im Hintergrund.
## Subframe
- (erst nach explizitem OK)
02 Wireframes/P16 Termine/WF-P16 E-Signatur/Screens/S03 Signatur-Detail.md
+38
View File
@@ -0,0 +1,38 @@
---
kind: screen
project: HiveGrid Screen Project
ticket: D-P16 (Teil) + AK-P16d
package: WF-P16 E-Signatur
id: S03
screen: Signatur-Detail & Status
typ: A3 Detail
umsetzung: Bauen
status: Validiert
route: "Signatur öffnen"
subframe: ""
---
# S03 — Signatur-Detail & Status
## Ziel
Alles zu einem Signaturvorgang an einem Ort: wer hat schon unterschrieben, was ist offen, welche Nachweise gibt es.
## Was das Tool können muss
- Kopf: Dokument-Titel, Projekt, Gesamtstatus, Ablaufdatum, Provider (SES Default / PandaDoc BYOK)
- Linke Spalte: Dokumentdaten, Versandtext, Routing-Modus, Datei-Verknüpfungen
- Rechte Spalte: **Unterzeichner-Status** je Person (gesendet, angesehen, signiert, abgelehnt, zurückgezogen), Zeitpunkte, letzte Erinnerung
- Aktionen: Erinnerung senden, Link erneut senden, zurückziehen (M01), Download Original-PDF, signiertes PDF, Abschluss-Nachweis
- Verlauf: erstellt, gesendet, Link geöffnet, OTP bestätigt, signiert, abgelehnt, zurückgezogen, Versiegelung abgeschlossen/fehlgeschlagen
- Wenn abgeschlossen: klare Download-Leiste + Hinweis, dass das signierte PDF in den Projekt-Dateien liegt
- Wenn abgelehnt: Grund anzeigen, erneutes Senden als neuer Vorgang
- Zustände: wartend auf Unterzeichner, abgelaufen, zurückgezogen, Versiegelung fehlgeschlagen, keine Berechtigung
## Pattern / Archetyp
A3 Detail nach Karteikarten-Muster: Daten links, Status/Verlauf rechts, Aktionen im Kopf.
## Subframe
- (erst nach explizitem OK)
02 Wireframes/P16 Termine/WF-P16 E-Signatur/Screens/S04 Signieren per Link.md
+38
View File
@@ -0,0 +1,38 @@
---
kind: screen
project: HiveGrid Screen Project
ticket: D-P16 (Teil) + AK-P16d
package: WF-P16 E-Signatur
id: S04
screen: Signieren per Link
typ: BESPOKE-Public
umsetzung: Bauen
status: Validiert (Delta)
route: "/sign/:token"
subframe: ""
---
# S04 — 🌐 Signieren per Link
## Ziel
Der Kunde kann das Dokument sicher und verständlich unterschreiben, ohne Login und ohne App-Installation.
## Was das Tool können muss
- Firmen-Branding oben, Dokumenttitel, Projekt-/Angebotsbezug in Klartext ohne interne Details
- Schritt 1: Code-Bestätigung (OTP aus Mail) mit »Code erneut senden«
- Schritt 2: PDF ansehen/prüfen, Seiten-Navigation, Download des Original-PDF optional
- Schritt 3: Zustimmung/Intent-Text bestätigen + Unterschrift zeichnen oder tippen
- Abschluss: klare Bestätigung, Hinweis auf E-Mail/Download, keine internen Projektlinks
- Ablehnen: optionaler Grund, Status geht zurück nach S03, Büro bekommt Benachrichtigung
- Zustände: Link ungültig, Link abgelaufen, bereits signiert, zurückgezogen, falscher/abgelaufener Code, PDF lädt nicht, Signatur-Abschluss fehlgeschlagen
- Mobile-first: Unterschrift muss auf Handy sauber funktionieren
## Pattern / Archetyp
BESPOKE-Public. Das ist der öffentliche Trust-Touchpoint; höherer Polish als interne Verwaltungsflächen.
## Subframe
- (erst nach explizitem OK)
02 Wireframes/P16 Termine/WF-P16 E-Signatur/Screens/V01 Vor Ort unterschreiben.md
+38
View File
@@ -0,0 +1,38 @@
---
kind: screen
project: HiveGrid Screen Project
ticket: D-P16 (Teil) + AK-P16d
package: WF-P16 E-Signatur
id: V01
screen: Vor Ort unterschreiben
typ: BESPOKE-Mobile
umsetzung: Bauen
status: Validiert
route: "aus S02, Touch-Modus"
subframe: ""
---
# V01 — Vor Ort unterschreiben 📱
## Ziel
Der Mitarbeiter kann dem Kunden vor Ort das Gerät geben und die Unterschrift direkt aufnehmen.
## Was das Tool können muss
- Vollbild-/Tablet-tauglicher Modus ohne interne Navigation
- Dokumenttitel + kurze Bestätigung, dass der Kunde gerade unterschreibt
- PDF-Vorschau oder Pflicht-Hinweis »Dokument wurde geprüft« je nach Platz
- Name des Unterzeichners editierbar, Rolle sichtbar
- Touch-Signaturfeld groß genug für Finger/Stift, mit Löschen/Neu zeichnen
- Abschlussknopf mit bewusstem Intent-Text
- Nach Abschluss: Bestätigung und Rückgabe-Hinweis an Mitarbeiter; zurück zu S03
- Zustände: offline/Sync steht aus, Signaturfeld leer, Versiegelung noch ausstehend
## Pattern / Archetyp
BESPOKE-Mobile, verwandt mit WF-P9 Abnahme-Unterschriften, aber für Dokument-Signatur am Projekt.
## Subframe
- (erst nach explizitem OK)
02 Wireframes/P16 Termine/WF-P16 E-Signatur/WF-P16 E-Signatur.canvas
+29
View File
@@ -0,0 +1,29 @@
{
"nodes": [
{"id":"md-paket","type":"file","file":"02 Wireframes/P16 Termine/WF-P16 E-Signatur/WF-P16 E-Signatur.md","x":-80,"y":-440,"width":460,"height":280},
{"id":"group-intern","type":"group","x":-80,"y":-100,"width":1740,"height":660,"label":"Projekt-Team (intern)"},
{"id":"group-public","type":"group","x":1840,"y":-100,"width":1180,"height":660,"label":"Kunde unterschreibt"},
{"id":"group-actions","type":"group","x":3200,"y":-100,"width":620,"height":380,"label":"Aktionen"},
{"id":"note-entry","type":"text","text":"# Einstieg\n\nProjekt-Detail → Reiter »Signaturen« oder Aktion »Zur Signatur senden«.\n\nSignatur hängt am Projekt-Kern, nicht an Deal.","x":0,"y":0,"width":360,"height":200},
{"id":"s01","type":"file","file":"02 Wireframes/P16 Termine/WF-P16 E-Signatur/Screens/S01 Signaturen im Projekt.md","x":560,"y":0,"width":420,"height":200},
{"id":"s02","type":"file","file":"02 Wireframes/P16 Termine/WF-P16 E-Signatur/Screens/S02 Signatur-Wizard.md","x":1120,"y":0,"width":420,"height":200},
{"id":"s03","type":"file","file":"02 Wireframes/P16 Termine/WF-P16 E-Signatur/Screens/S03 Signatur-Detail.md","x":560,"y":300,"width":420,"height":200},
{"id":"note-assets","type":"text","text":"# Artefakte\n\nOriginal-PDF, signiertes PDF und Abschluss-Nachweis landen in den Projekt-Dateien.\n\nDefault: SES-Eigenbau. PandaDoc nur BYOK-Opt-in.","x":1120,"y":300,"width":420,"height":200},
{"id":"s04","type":"file","file":"02 Wireframes/P16 Termine/WF-P16 E-Signatur/Screens/S04 Signieren per Link.md","x":1920,"y":0,"width":420,"height":200},
{"id":"v01","type":"file","file":"02 Wireframes/P16 Termine/WF-P16 E-Signatur/Screens/V01 Vor Ort unterschreiben.md","x":2480,"y":0,"width":420,"height":200},
{"id":"note-public","type":"text","text":"# Public-Delta\n\nD-P16 nennt den Wizard, aber nicht den Kunden-Signierframe. S04 ist trotzdem Pflicht, weil hier Vertrauen + OTP + Signatur passieren.","x":1920,"y":300,"width":460,"height":200},
{"id":"m01","type":"file","file":"02 Wireframes/P16 Termine/WF-P16 E-Signatur/Screens/M01 Zurueckziehen.md","x":3280,"y":0,"width":420,"height":200}
],
"edges": [
{"id":"e-entry","fromNode":"note-entry","fromSide":"right","toNode":"s01","toSide":"left","toEnd":"arrow","styleAttributes":{"path":"dotted"}},
{"id":"e-new","fromNode":"s01","fromSide":"right","toNode":"s02","toSide":"left","toEnd":"arrow","label":"Zur Signatur senden"},
{"id":"e-open","fromNode":"s01","fromSide":"bottom","toNode":"s03","toSide":"left","toEnd":"arrow","label":"öffnen"},
{"id":"e-send","fromNode":"s02","fromSide":"right","toNode":"s04","toSide":"left","toEnd":"arrow","label":"Fern-Link + OTP"},
{"id":"e-local","fromNode":"s02","fromSide":"right","toNode":"v01","toSide":"left","toEnd":"arrow","label":"Vor Ort"},
{"id":"e-status","fromNode":"s04","fromSide":"bottom","toNode":"s03","toSide":"right","toEnd":"arrow","label":"Status"},
{"id":"e-local-status","fromNode":"v01","fromSide":"bottom","toNode":"s03","toSide":"right","toEnd":"arrow","label":"Status"},
{"id":"e-assets","fromNode":"note-assets","fromSide":"left","toNode":"s03","toSide":"right","toEnd":"arrow","styleAttributes":{"path":"dotted"}},
{"id":"e-public-note","fromNode":"note-public","fromSide":"top","toNode":"s04","toSide":"bottom","toEnd":"arrow","styleAttributes":{"path":"dotted"}},
{"id":"e-revoke","fromNode":"s03","fromSide":"right","toNode":"m01","toSide":"left","toEnd":"arrow","label":"zurückziehen"}
]
}
02 Wireframes/P16 Termine/WF-P16 E-Signatur/WF-P16 E-Signatur.md
+132
View File
@@ -0,0 +1,132 @@
---
kind: wireframe-package
project: HiveGrid Screen Project
ticket: D-P16 (Teil) + AK-P16d
package: WF-P16 E-Signatur
typ: Flow
status: Validiert
subframe: ""
canvas: "WF-P16 E-Signatur.canvas"
---
# WF-P16 E-Signatur
Status: Validiert (Screen-Liste)
Subframe-Link: -
Canvas: [Canvas](<WF-P16 E-Signatur.canvas>)
Stand: 2026-07-09
---
## 1. Kurzfassung
Digital unterschreiben am Projekt: Das Büro wählt ein PDF aus den Projekt-Dateien oder lädt eines hoch, legt Unterzeichner, Reihenfolge und Versandtext fest und sendet den Signatur-Link. Kunden unterschreiben per 🌐 öffentlichem Link mit Code-Bestätigung oder direkt vor Ort auf dem Gerät. Intern sieht das Team pro Unterzeichner den Status, kann erinnern oder zurückziehen und lädt am Ende Original-PDF, signiertes PDF und Abschluss-Nachweis herunter. Default ist der gehärtete **SES-Eigenbau**; PandaDoc bleibt nur optionaler BYOK-Adapter.
---
## 2. Intent Check
| Frage | Antwort |
|---|---|
| Ticket/Modul | D-P16 (Signatur-Wizard), Dev-Pendant AK-P16d |
| Nutzer-Ziel | Angebot/Projekt-Dokument ohne Medienbruch zur Unterschrift bringen und den Nachweis sauber am Projekt ablegen |
| Quellen geprüft | `ticket-docs/D-P16.md`, `ticket-docs/AK-P16d.md`, Signature-Modelle, HiveGrid Map |
| Sicher im Scope | Projekt-Einstieg, Signatur-Wizard, Status/Detail, 🌐 Kunden-Signierseite, Vor-Ort-Signatur, Erinnerung, Widerruf, Downloads |
| Sicher nicht im Scope | PDF-Editor/Vorlagenbau, qualifizierte elektronische Signatur (QES), PandaDoc als Pflichtprovider, Deal-Objekt |
| Unsichere Annahmen | Öffentliche Signierseite ist als eigener Screen nötig: Dev hat den Flow, D-P16 nennt ihn nicht als separates Screen-Delta |
---
## 3. Scope
| Punkt | Inhalt |
|---|---|
| Startpunkt | Projekt-Detail, Aktion »Zur Signatur senden« oder Reiter »Signaturen« |
| Ziel | Dokument ist versendet oder abgeschlossen; Artefakte liegen am Projekt in Dateien |
| Haupt-Archetyp | A5 Wizard + A3 Detail + BESPOKE-Public |
| Out of scope | Dokument inhaltlich bearbeiten, Unterschriftenfelder frei im PDF platzieren, QES/D-Trust |
---
## 4. Entscheidungen (validiert 2026-07-09)
| Entscheidung | Status | Notiz |
|---|---|---|
| Signatur hängt am Projekt-Kern | genommen | `ProjektSignatureDocument`/`Signer`; kein Deal-Objekt |
| Eigener SES-Flow ist Default | genommen | Fern-Link mit OTP + Touch vor Ort + PAdES/Certificate; PandaDoc nur BYOK-Opt-in |
| Eigene 🌐 Kunden-Signierseite | genommen (Delta) | Als eigener Frame S04, weil sonst der wichtigste externe Touchpoint fehlt |
| Projekt-Reiter/Liste vor Wizard | genommen | Nutzer braucht Überblick über laufende und abgeschlossene Signaturen am Projekt |
| Status-Detail als eigene Karteikarte | genommen | Download, Signer-Status, Reminder, Widerruf und Verlauf gehören an einen Ort |
| Vor-Ort-Signatur als eigener Mobile-/Tablet-Nachweis | genommen | Gleiche Signatur-Engine, aber ohne Mail-Link als Übergabe auf dem Gerät |
| PandaDoc nur optional sichtbar | genommen | Nur zeigen, wenn BYOK verbunden; sonst kein UI-Zwang |
### Happy Path
1. Mitarbeiter öffnet ein Projekt und klickt »Zur Signatur senden«.
2. Im Wizard: PDF auswählen/hochladen, Unterzeichner prüfen, Reihenfolge wählen, Modus »Fern-Link + Code« oder »Vor Ort« einstellen, Nachricht senden.
3. Kunde öffnet den Link, bestätigt den Code, prüft das PDF, setzt die Signatur und schließt ab.
4. Im Projekt springt der Status auf signiert; Original, signiertes PDF und Abschluss-Nachweis sind herunterladbar und in Dateien abgelegt.
### Meldungs-/Error-States (validiert)
| Ereignis | UI-Form | Blockiert? | Bauen? | Copy/Notiz |
|---|---|---|---|---|
| Kein PDF gewählt | Wizard-Validierung in S02 | ja | Nur dokumentieren | »Wähle ein PDF aus oder lade eins hoch.« |
| Unterzeichner ohne E-Mail bei Fern-Link | Inline-Fehler in S02 | ja | Nur dokumentieren | Vor-Ort-Modus darf ohne Mail gehen, Fern-Link nicht |
| Link abgelaufen/ungültig | 🌐 Klartext-Zustand in S04 | ja | Nur dokumentieren | Keine Projekt-Interna verraten |
| OTP falsch/abgelaufen | Inline-Fehler in S04 | ja | Nur dokumentieren | Neuer Code anfordern |
| Unterzeichner lehnt ab | Status in S03 + Benachrichtigung | nein | Nur dokumentieren | Grund optional, Dokument läuft nicht weiter |
| Dokument zurückgezogen | M01 + Status in S03/S04 | ja | Bauen (M01) | Link wird ungültig, Verlauf bleibt |
| PandaDoc nicht verbunden | Hinweis in S02/S03 | nein | Nur dokumentieren | Default SES bleibt nutzbar |
| PAdES/Versiegelung schlägt fehl | Fehlerzustand in S03 | ja (Abschluss) | Nur dokumentieren | Klartext + Support/erneut versuchen |
---
## 7. Validierte Screen-Liste
| ID | Screen/Zustand | Typ | Umsetzung | Ort | Status |
|---|---|---|---|---|---|
| S01 | Signaturen im Projekt | A3/A2 eingebettet | Bauen | Projekt-Detail, Reiter/Aktion | Validiert |
| S02 | Signatur-Wizard | A5 Wizard | Bauen | aus S01 / Projekt-Aktion | Validiert |
| S03 | Signatur-Detail & Status | A3 Detail | Bauen | Signatur öffnen | Validiert |
| S04 | 🌐 Signieren per Link | BESPOKE-Public | Bauen | `/sign/:token` | Validiert (Delta) |
| V01 | Vor Ort unterschreiben 📱 | BESPOKE-Mobile | Bauen | aus S02, Touch-Modus | Validiert |
| M01 | Signatur zurückziehen | Confirm-Modal | Bauen | aus S03 | Validiert |
| D01–D07 | PDF fehlt / Mail fehlt / Link ungültig / OTP / Ablehnung / Provider / Versiegelung | Inline/Zustand | Nur dokumentieren | — | Validiert |
---
## 8. Grid
```text
Projekt-Detail -> S01 (Signaturen im Projekt) -> S02 (Wizard: PDF, Unterzeichner, Reihenfolge, Modus, Nachricht)
S02 -> S04 (Fern-Link + OTP: PDF prüfen, Signatur, Abschluss)
S02 -> V01 (Vor Ort: Gerät übergeben, Touch-Signatur, Abschluss)
S01 -> S03 (Detail: Signer-Status, Verlauf, Downloads)
S03 -> M01 (zurückziehen)
S03: erinnern / signed PDF / Completion Certificate herunterladen
Artefakte: Original-PDF + signiertes PDF + Abschluss-Nachweis -> Projekt-Dateien
Optional: PandaDoc BYOK nur anzeigen, wenn verbunden; Default bleibt SES-Eigenbau
```
---
## 9. Screen-Pakete
- [[S01 Signaturen im Projekt]] · [[S02 Signatur-Wizard]] · [[S03 Signatur-Detail]] · [[S04 Signieren per Link]]
- [[V01 Vor Ort unterschreiben]] · [[M01 Zurueckziehen]]
---
## 10. Offene Fragen
- **Design-Delta:** D-P16 nennt nur den internen Signatur-Wizard; die 🌐 Kunden-Signierseite S04 ist als eigener Screen ergänzt, weil sie für den Flow zwingend sichtbar sein muss.
- PDF-Feldplatzierung: v1 platziert Signatur/Certificate standardisiert; ein frei editierbarer PDF-Tagger bleibt v2.
- Erinnerungsregeln: manuell in v1, automatische Reminder später mit Benachrichtigungen/Automationen klären.
- PandaDoc BYOK: nur zeigen, wenn eine Verbindung existiert; genauer Einstiegsort über WF-P5 Integrationen prüfen.
## Handoff-Check
- [x] Jeder Screen ist mit Umsetzung markiert.
- [x] Meldungs-/Error-State-Matrix ist ausgefüllt.
- [ ] Subframe-Link ist eingetragen. *(Subframe erst nach explizitem OK)*
02 Wireframes/P16 Termine/WF-P16 Kalender/Screens/M01 Termin-Dialog.md
+39
View File
@@ -0,0 +1,39 @@
---
kind: screen
project: HiveGrid Screen Project
ticket: D-BOOK + D-P16 (Teil)
package: WF-P16 Kalender
id: M01
screen: Termin anlegen/bearbeiten
typ: Modal
umsetzung: Bauen
status: Validiert
route: "aus S01 (Slot-Klick / + Termin)"
subframe: ""
---
# M01 — Termin anlegen/bearbeiten
## Ziel
Einen Termin planen wie in Google Calendar — mit Teilnehmern, und ohne jemanden doppelt zu verplanen.
## Was das Tool können muss
- **Grunddaten:** Titel, Datum + Uhrzeit (von–bis), optional ganztägig, Ort, Beschreibung/Notiz
- **Teilnehmer-Feld** (ein Feld, drei Arten):
- **Team-Mitglieder** (@-Vorschläge) — sehen den Termin sofort in ihrem HiveGrid-Kalender
- **Kontakte** (aus dem CRM) — bekommen E-Mail mit Kalender-Datei (.ics)
- **freie E-Mail-Adressen** — ebenfalls Mail + .ics, ohne Kontakt-Anlage
- **Verfügbarkeits-Check:** beim Hinzufügen interner Teilnehmer zeigt der Dialog belegt/frei im gewählten Zeitraum (»Max ist 9–12 Uhr belegt«) — Warnung, kein Block; Link »Kalender einblenden« aktiviert das Overlay in S01
- Optionale **Projekt-Verknüpfung** (Termin erscheint dann auch in der Projekt-Akte)
- Bearbeiten nutzt denselben Dialog (nur bei eigenen Terminen); Änderung informiert Teilnehmer
- Speichern → zurück in S01, Termin sichtbar; bei Google-Sync geht der Termin auch extern raus
## Pattern / Archetyp
A5 Dialog + A4 Formular-Felder. Teilnehmer-Feld = @-Erwähnungs-Muster aus dem UI-Baukasten.
## Subframe
- (erst nach explizitem OK)
02 Wireframes/P16 Termine/WF-P16 Kalender/Screens/M02 Termin-Detail.md
+35
View File
@@ -0,0 +1,35 @@
---
kind: screen
project: HiveGrid Screen Project
ticket: D-BOOK + D-P16 (Teil)
package: WF-P16 Kalender
id: M02
screen: Termin-Detail
typ: Popover
umsetzung: Bauen
status: Validiert
route: "Termin-Klick in S01"
subframe: ""
---
# M02 — Termin-Detail (Popover)
## Ziel
Schnell sehen, was das für ein Termin ist, wer kommt — und mit einem Klick zur Quelle springen.
## Was das Tool können muss
- Titel, Zeit, Ort, Beschreibung, **Quelle-Badge** (Google / Buchung / Plantafel / Projekt / eigener Termin)
- **Teilnehmer-Liste mit Zu-/Absage-Status** (zugesagt / abgesagt / offen); Bounce-Marker wenn Einladungs-Mail unzustellbar (+ erneut senden)
- **Absprung zur Quelle:** Buchung → Buchungs-Detail · Einsatz → Plantafel · Projekt-Termin → Projekt-Akte · Google-Termin → nur lesen (Hinweis »kommt aus Google«)
- **Aktionen je nach Quelle:** eigene Termine → Bearbeiten (M01) + Löschen (mit Teilnehmer-Info); fremde Quellen → nur Absprung
- Für eingeladene interne Nutzer: **Zusagen/Absagen** direkt im Popover
## Pattern / Archetyp
Popover (leichtgewichtig, kein volles Modal) — Muster: Termin-Klick wie in Google Calendar.
## Subframe
- (erst nach explizitem OK)
02 Wireframes/P16 Termine/WF-P16 Kalender/Screens/S01 Kalender.md
+40
View File
@@ -0,0 +1,40 @@
---
kind: screen
project: HiveGrid Screen Project
ticket: D-BOOK + D-P16 (Teil)
package: WF-P16 Kalender
id: S01
screen: Kalender
typ: BESPOKE Kalender-Grid
umsetzung: Bauen
status: Validiert
route: "/calendar"
subframe: ""
---
# S01 — Kalender (Monat/Woche) ⭐
## Ziel
Alle Termine an einem Ort — egal ob aus Google, einer Online-Buchung, der Plantafel, einem Projekt oder von Hand angelegt. Und: neue Termine direkt hier planen.
## Was das Tool können muss
- **Monats- und Wochen-Ansicht** mit Umschalter, Heute-Knopf, Zeitraum-Navigation (Pfeile)
- **Quell-Marker je Termin** (Farbe/Icon): Google · Buchung · Plantafel-Einsatz · Projekt-Termin · eigener Termin
- **Kollegen einblenden (Overlay):** Mitarbeiter-Auswahl (Avatare/Checkboxen) — deren HiveGrid-Termine erscheinen normal, private Google-Termine nur als **»belegt«** ohne Titel/Details
- **Termin anlegen:** Klick auf freien Slot oder »+ Termin«-Knopf → M01
- **Termin öffnen:** Klick auf Termin → M02 (Detail-Popover)
- **Verbinden-Hinweis** solange kein Google-Konto verbunden ist (dismissbar, mit »Verbinden«-Knopf → S02); Kalender ist auch ohne Verbindung voll nutzbar
- **Re-Connect-Banner** bei kaputter Verbindung (Klartext + Lösungs-Knopf)
- Dezenter Hinweis bei frischen Sync-Konflikten mit Link zum Konflikt-Verlauf (S02)
- Zahnrad → Kalender-Einstellungen (S02)
- Zustände: leer (CTA Termin anlegen / Google verbinden), laden, Fehler
## Pattern / Archetyp
BESPOKE (Kalender-Grid, mittlerer Aufwand laut Ticket). Zustands-Set A7.
## Subframe
- (erst nach explizitem OK)
02 Wireframes/P16 Termine/WF-P16 Kalender/Screens/S02 Kalender-Einstellungen.md
+38
View File
@@ -0,0 +1,38 @@
---
kind: screen
project: HiveGrid Screen Project
ticket: D-BOOK + D-P16 (Teil)
package: WF-P16 Kalender
id: S02
screen: Kalender-Einstellungen & Sync
typ: Settings (A6)
umsetzung: Bauen
status: Validiert
route: "/calendar/settings"
subframe: ""
---
# S02 — Kalender-Einstellungen & Sync
## Ziel
Sein eigenes Google-Konto verbinden und den Abgleich steuern — pro Mitarbeiter, ohne Admin-Umweg. Erreichbar direkt aus dem Kalender (Zahnrad / Verbinden-Hinweis).
## Was das Tool können muss
- **Provider-Auswahl:** Google (aktiv) · Outlook (**ausgegraut, »bald verfügbar«** — v2); UI bleibt provider-neutral
- **Verbinden:** startet den OAuth-Assistenten im WF-P5-Muster (M01) → danach Connect-Card mit Status-Ampel, verbundenem Konto (E-Mail), letzter Sync-Zeit
- **Kalender-Auswahl:** welche Google-Kalender abgeglichen werden (Checkbox-Liste)
- **Sync-Richtung:** beide Richtungen · nur HiveGrid → Google · nur Google → HiveGrid
- **Trennen** mit »auch extern entfernen?«-Wahl (Trennen-Modal aus WF-P5 M03, erweitert um die Extern-Wahl) — kein Hard-Delete
- **Re-Connect-Banner** bei kaputter Verbindung (Token abgelaufen o. ä.)
- **Konflikt-Verlauf-Sektion:** letzte 50 automatische Auflösungen in Klartext — »Termin ›Wartung Müller‹ wurde in Google auf 14:00 verschoben — HiveGrid hat übernommen« (Last-Write-Wins); jede Auflösung erzeugt zusätzlich eine Benachrichtigung
- Hinweis: Verbindung ist **pro Mitarbeiter** — jeder verwaltet hier nur sein eigenes Konto; fremde Termin-Inhalte bleiben privat (nur »belegt«)
## Pattern / Archetyp
A6 Settings/Connection — Connection-Card-Muster aus WF-P5 Integrationen; Konflikt-Verlauf analog Abgleich-Verlauf (WF-P5 S03), hier nur als Sektion.
## Subframe
- (erst nach explizitem OK)
02 Wireframes/P16 Termine/WF-P16 Kalender/WF-P16 Kalender.canvas
+42
View File
@@ -0,0 +1,42 @@
{
"nodes":[
{"id":"md-paket","type":"file","file":"02 Wireframes/P16 Termine/WF-P16 Kalender/WF-P16 Kalender.md","x":-80,"y":-440,"width":460,"height":280},
{"id":"group-kalender","type":"group","x":-80,"y":-100,"width":1140,"height":380,"label":"Kalender (Desktop, Bespoke)"},
{"id":"group-dialoge","type":"group","x":-80,"y":460,"width":1140,"height":380,"label":"Termin-Dialoge"},
{"id":"group-sync","type":"group","x":1300,"y":-100,"width":1120,"height":380,"label":"Einstellungen & Sync (pro Nutzer)"},
{"id":"note-entry","type":"text","text":"# Einstieg\n\nSidebar → Kalender.\n\nQuellen: Google · Buchung · Plantafel · Projekt · eigene Termine. Kollegen als Overlay einblendbar (fremde private Google-Termine nur »belegt«).","x":0,"y":0,"width":360,"height":200},
{"id":"s01","type":"file","file":"02 Wireframes/P16 Termine/WF-P16 Kalender/Screens/S01 Kalender.md","x":560,"y":0,"width":420,"height":200},
{"id":"m01","type":"file","file":"02 Wireframes/P16 Termine/WF-P16 Kalender/Screens/M01 Termin-Dialog.md","x":0,"y":560,"width":420,"height":200},
{"id":"m02","type":"file","file":"02 Wireframes/P16 Termine/WF-P16 Kalender/Screens/M02 Termin-Detail.md","x":580,"y":560,"width":420,"height":200},
{"id":"s02","type":"file","file":"02 Wireframes/P16 Termine/WF-P16 Kalender/Screens/S02 Kalender-Einstellungen.md","x":1340,"y":0,"width":420,"height":200},
{"id":"note-sync","type":"text","text":"# Wiederverwendet aus WF-P5\n\nOAuth-Assistent (M01) + Trennen-Modal (M03, + »auch extern entfernen?«).\n\nOutlook als Teaser »bald verfügbar« (v2). Konflikt-Verlauf als Sektion hier.","x":1900,"y":0,"width":460,"height":200}
],
"edges":[
{
"id":"e-entry",
"fromNode":"note-entry",
"fromSide":"right",
"toNode":"s01",
"toSide":"left",
"toEnd":"arrow",
"styleAttributes":{"path":"dotted"}
},
{"id":"e-new","fromNode":"s01","fromSide":"bottom","toNode":"m01","toSide":"top","toEnd":"arrow","label":"Slot-Klick / + Termin"},
{"id":"e-open","fromNode":"s01","fromSide":"bottom","toNode":"m02","toSide":"top","toEnd":"arrow","label":"Termin-Klick"},
{"id":"e-edit","fromNode":"m02","fromSide":"left","toNode":"m01","toSide":"right","toEnd":"arrow","label":"Bearbeiten"},
{"id":"e-settings","fromNode":"s01","fromSide":"right","toNode":"s02","toSide":"left","toEnd":"arrow","label":"Zahnrad / Verbinden"},
{
"id":"e-sync-note",
"fromNode":"note-sync",
"fromSide":"left",
"toNode":"s02",
"toSide":"right",
"toEnd":"arrow",
"styleAttributes":{"path":"dotted"}
}
],
"metadata":{
"version":"1.0-1.0",
"frontmatter":{}
}
}
02 Wireframes/P16 Termine/WF-P16 Kalender/WF-P16 Kalender.md
+130
View File
@@ -0,0 +1,130 @@
---
kind: wireframe-package
project: HiveGrid Screen Project
ticket: D-BOOK + D-P16 (Teil)
package: WF-P16 Kalender
typ: Flow
status: Validiert
subframe: ""
canvas: "WF-P16 Kalender.canvas"
---
# WF-P16 Kalender
Status: Validiert (Screen-Liste)
Subframe-Link: -
Canvas: [Canvas](<WF-P16 Kalender.canvas>)
Stand: 2026-07-09
---
## 1. Kurzfassung
Der HiveGrid-Kalender: Monats-/Wochen-Ansicht mit allen Terminen (Google-Sync, Buchungen, Plantafel, Projekt-Termine — je mit Herkunfts-Marker). **Davids Delta: ein vollwertiger Kalender**, nicht nur eine Lese-Sicht — Termine anlegen, Personen einladen (Team, Kontakte, freie E-Mails), Kollegen-Kalender als Verfügbarkeits-Overlay einblenden. Funktioniert eigenständig ohne Google; Google-Sync ist optional (Outlook → v2, in der UI als »bald verfügbar« sichtbar).
---
## 2. Intent Check
| Frage | Antwort |
|---|---|
| Ticket/Modul | D-BOOK (Kalender-View) + D-P16 (Kalender-Verbindungen), Dev-Pendant AK-P16a |
| Nutzer-Ziel | Alle Termine an einem Ort sehen, neue Termine planen ohne Doppelbelegung, Google bleibt synchron |
| Quellen geprüft | `ticket-docs/D-BOOK.md`, `ticket-docs/D-P16.md`, `designer-briefs/P16-…md`, HiveGrid Map |
| Sicher im Scope | Kalender-Grid (Monat/Woche), Termin anlegen/bearbeiten + Einladen, Termin-Detail, Sync-Einstellungen inkl. Konflikt-Verlauf |
| Sicher nicht im Scope | Buchungsseiten + Verfügbarkeits-Editor (WF-P16 Terminbuchung); Plantafel (WF-P9); Outlook-Sync (v2) |
| Unsichere Annahmen | Termin-Objekt + Einladungen sind NICHT im Dev-Ticket — Change-Request nötig (s. Offene Fragen) |
---
## 3. Scope
| Punkt | Inhalt |
|---|---|
| Startpunkt | Sidebar »Kalender« |
| Ziel | Termin geplant (mit Teilnehmern, ohne Kollision) · Google verbunden und synchron |
| Haupt-Archetyp | **BESPOKE** (Kalender-Grid) + A6 (Einstellungen) |
| Out of scope | Booking-Pages, Plantafel-Einsätze (nur als Quelle sichtbar), Outlook |
---
## 4. Entscheidungen (validiert 2026-07-09)
| Entscheidung | Status | Notiz |
|---|---|---|
| Vollwertiger Kalender statt reiner Lese-Sicht | genommen (Delta) | Termine anlegen/bearbeiten/löschen, »alles was man für einen Kalender braucht« — **Change-Request an Dev** (Ticket sah nur Grid + Marker vor) |
| Einladen: Team + Kontakte + freie E-Mails | genommen (Delta) | Interne sehen den Termin in ihrem HiveGrid-Kalender; Externe bekommen E-Mail mit Kalender-Datei (.ics); Zu-/Absagen sichtbar |
| Kollegen-Kalender einblendbar (Overlay) | genommen (Delta) | Vor dem Einladen prüfen, ob jemand Zeit hat; fremde private Google-Termine nur als »belegt« ohne Details |
| Eigener + fremde Kalender in einer Ansicht | genommen | Plantafel bleibt die Baustellen-/Einsatz-Sicht — der Kalender ist die Termin-Sicht |
| Verbinden-Einstieg direkt im Kalender | genommen | Hinweis-Karte solange nichts verbunden ist; danach über Zahnrad → Einstellungen. Kalender ist auch ohne Google voll nutzbar |
| Provider-Auswahl mit Outlook-Teaser | genommen | Google aktiv (v1), Outlook ausgegraut »bald verfügbar« — UI bleibt provider-neutral |
| Sync-Konflikt-Verlauf in den Einstellungen | genommen | Kleine Sektion (letzte 50, Klartext: was kollidierte, wie gelöst) — Muster wie Abgleich-Verlauf WF-P5; im Kalender nur dezenter Hinweis bei frischen Konflikten |
| OAuth-Assistent + Trennen-Modal aus WF-P5 wiederverwenden | genommen | Trennen mit »auch extern entfernen?«-Wahl |
### Happy Path
1. Mitarbeiter öffnet Kalender (Woche), sieht eigene Termine quell-farbig (Google / Buchung / Plantafel / Projekt / eigene).
2. Klick auf freien Slot → Termin-Dialog: Titel, Zeit, Teilnehmer (Kollege @Max, Kontakt Müller, freie E-Mail) — beim Hinzufügen zeigt der Dialog, wer belegt ist; optional Kollegen-Kalender als Overlay einblenden.
3. Speichern → Interne sehen den Termin sofort, Externe bekommen Mail mit .ics; Zu-/Absagen laufen am Termin auf.
4. Einmalig: »Google verbinden« → OAuth (P5-Muster) → Kalender auswählen, Sync-Richtung — ab da läuft alles synchron.
### Meldungs-/Error-States (validiert)
| Ereignis | UI-Form | Blockiert? | Bauen? | Copy/Notiz |
|---|---|---|---|---|
| Kein Google verbunden | Hinweis-Karte in S01 (dismissbar) + Bereich in S02 | nein | Nur dokumentieren | »Verbinde deinen Google-Kalender …« — Kalender funktioniert trotzdem |
| Verbindung kaputt (Token abgelaufen) | Re-Connect-Banner in S01 + S02 | nein | Nur dokumentieren | Klartext + »Neu verbinden«-Knopf |
| Sync-Konflikt (beidseitige Änderung) | Benachrichtigung (Glocke) + Eintrag im Konflikt-Verlauf (S02) | nein | Nur dokumentieren | »Termin X wurde in Google auf 14:00 verschoben — HiveGrid hat übernommen« (Last-Write-Wins) |
| Teilnehmer belegt | Inline-Warnung im Termin-Dialog | nein (bewusst buchbar) | in M01 enthalten | »Max ist 9–12 Uhr belegt« — analog Plantafel-Konflikt, aber ohne Block |
| Fremder privater Google-Termin | nur »belegt«-Block ohne Titel/Details | nein | Nur dokumentieren | Datenschutz-Vorgabe aus dem Ticket |
| Einladungs-Mail unzustellbar | Hinweis am Teilnehmer in M02 | nein | Nur dokumentieren | Bounce-Marker + erneut senden |
| Leerer Kalender | Leer-Zustand + CTA (Termin anlegen / Google verbinden) | nein | Nur dokumentieren | — |
---
## 7. Validierte Screen-Liste
| ID | Screen/Zustand | Typ | Umsetzung | Ort | Status |
|---|---|---|---|---|---|
| S01 | Kalender (Monat/Woche, Quell-Marker, Kollegen-Overlay) ⭐ | BESPOKE | Bauen | `/calendar` | Validiert |
| M01 | Termin anlegen/bearbeiten (Teilnehmer + Verfügbarkeits-Check) | Modal | Bauen | aus S01 (Slot-Klick / + Termin) | Validiert |
| M02 | Termin-Detail (Quelle + Absprung, Zu-/Absagen) | Popover | Bauen | Termin-Klick in S01 | Validiert |
| S02 | Kalender-Einstellungen & Sync (Provider, Kalender-Auswahl, Richtung, Konflikt-Verlauf) | Settings (A6) | Bauen | `/calendar/settings` | Validiert |
| D01 | OAuth-Assistent | Wiederverwenden | Wiederverwenden | WF-P5 M01 | Validiert |
| D02 | Trennen-Bestätigung (»auch extern entfernen?«) | Wiederverwenden | Wiederverwenden | WF-P5 M03 (+ Extern-Wahl) | Validiert |
| D03–D07 | Verbinden-Hinweis / Re-Connect / Konflikt / »belegt« / Leer (s. Tabelle) | Inline | Nur dokumentieren | — | Validiert |
---
## 8. Grid
```text
Sidebar -> S01 (Monat/Woche, Quellen: Google + Buchung + Plantafel + Projekt + eigene)
S01 -> M01 (Slot-Klick / »+ Termin«: anlegen mit Teilnehmern + Verfügbarkeits-Check)
S01 -> M02 (Termin-Klick: Detail-Popover, Quelle-Absprung, Zu-/Absagen)
M02 -> M01 (Bearbeiten, nur bei eigenen Terminen)
S01 -> S02 (Zahnrad / Verbinden-Hinweis: Provider, Kalender-Auswahl, Sync-Richtung, Konflikt-Verlauf)
S02 nutzt WF-P5: OAuth-Assistent (M01) + Trennen-Modal (M03)
Quell-Absprünge: Buchung -> WF-P16 Terminbuchung · Einsatz -> WF-P9 Plantafel · Projekt-Termin -> WF-P9 Projekt-Akte
```
---
## 9. Screen-Pakete
- [[S01 Kalender]] · [[M01 Termin-Dialog]] · [[M02 Termin-Detail]] · [[S02 Kalender-Einstellungen]]
---
## 10. Offene Fragen
- **Change-Request an Dev (groß):** Eigenes Termin-Objekt + Einladungen (Team/Kontakt/freie E-Mail, .ics-Versand, Zu-/Absage-Tracking) + Free/Busy-Overlay — Ticket AK-P16a sah nur Lese-Grid + Sync vor; ENTITY-MODEL Domäne 9 braucht Ergänzung
- Zu-/Absage-Tracking bei internen Teilnehmern: eigener Status oder reicht angenommen/abgelehnt wie extern? → Dev
- Erinnerungen vor Terminen (Push/Mail)? → v2-Kandidat, mit Benachrichtigungen (P3) klären
- Tages-Ansicht zusätzlich zu Monat/Woche? → beim Subframe-Bau entscheiden
## Handoff-Check
- [x] Jeder Screen ist mit Umsetzung markiert.
- [x] Meldungs-/Error-State-Matrix ist ausgefüllt.
- [ ] Subframe-Link ist eingetragen. *(Subframe erst nach explizitem OK)*
02 Wireframes/P16 Termine/WF-P16 Terminbuchung/Screens/M01 Verschieben.md
+34
View File
@@ -0,0 +1,34 @@
---
kind: screen
project: HiveGrid Screen Project
ticket: D-BOOK + D-P16 (Teil)
package: WF-P16 Terminbuchung
id: M01
screen: Verschieben (interner Slot-Picker)
typ: Modal
umsetzung: Bauen
status: Validiert
route: "aus S06"
subframe: ""
---
# M01 — Verschieben (interner Slot-Picker)
## Ziel
Das Büro verschiebt eine Buchung auf einen neuen freien Slot — der Kunde wird automatisch informiert.
## Was das Tool können muss
- Kompakter Slot-Picker (gleiche Logik wie die öffentliche Slot-Wahl: nur echte freie Zeiten)
- Alter Termin sichtbar durchgestrichen, neuer Termin zur Bestätigung
- Hinweis: »Der Kunde bekommt automatisch eine E-Mail mit dem neuen Termin«
- Optional: anderer Mitarbeiter zusammen mit neuem Slot (wenn der bisherige nicht kann)
## Pattern / Archetyp
A5 Modal; Reschedule-Slot-Picker aus dem Ticket.
## Subframe
- (erst nach explizitem OK)
02 Wireframes/P16 Termine/WF-P16 Terminbuchung/Screens/M02 Stornieren.md
+34
View File
@@ -0,0 +1,34 @@
---
kind: screen
project: HiveGrid Screen Project
ticket: D-BOOK + D-P16 (Teil)
package: WF-P16 Terminbuchung
id: M02
screen: Stornieren
typ: Modal
umsetzung: Bauen
status: Validiert
route: "aus S05/S06 (auch Bulk)"
subframe: ""
---
# M02 — Stornieren (Grund + Auto-Mail)
## Ziel
Bewusst absagen: mit Grund, und der Kunde erfährt es automatisch.
## Was das Tool können muss
- **Grund** (Pflicht, Freitext oder Auswahl) — landet im Verlauf der Buchung
- Hinweis: »Der Kunde bekommt automatisch eine Absage-Mail« (mit Grund-Vorschau)
- **Bulk-Variante** aus S05: zeigt Anzahl der Buchungen, ein Grund für alle, eine Mail je Kunde
- Bestätigen/Abbrechen; danach Status »storniert« + Termin verschwindet aus dem Kalender
## Pattern / Archetyp
A5 Confirm-Modal.
## Subframe
- (erst nach explizitem OK)
02 Wireframes/P16 Termine/WF-P16 Terminbuchung/Screens/S01 Termin waehlen.md
+37
View File
@@ -0,0 +1,37 @@
---
kind: screen
project: HiveGrid Screen Project
ticket: D-BOOK + D-P16 (Teil)
package: WF-P16 Terminbuchung
id: S01
screen: Termin waehlen (Slot-Picker)
typ: BESPOKE-Public
umsetzung: Bauen
status: Validiert
route: "/b/{firma}/{slug}"
subframe: ""
---
# S01 — 🌐 Termin wählen (Slot-Picker) ⭐
## Ziel
Der Kunde findet in Sekunden einen freien Termin — Calendly-Erlebnis, höchster Polish, mit dem Branding des Betriebs.
## Was das Tool können muss
- **Monats-Kalender** mit freien/belegten Tagen + **Zeitslot-Liste** zum gewählten Tag
- Nur echte freie Slots: berechnet aus Verfügbarkeit (S09), bestehenden Buchungen, Google-Kalender der Mitarbeiter, Puffer und Vorlauf — Vergabe v1: »erster freier Mitarbeiter«
- **Zeitzonen-fest** + Zeitzonen-Wechsler (Anzeige »Zeiten in deiner Zeitzone«)
- Kopf: Firmen-Logo/Branding, Name der Buchungsseite, Dauer, Beschreibung
- **iFrame-Embed-Variante** (gleiche Strecke ohne Seiten-Rahmen)
- Slot wählen → weiter zu S02 (Fragen)
- Zustände: keine freien Termine (Klartext), laden, Fehler, Seite nicht veröffentlicht (404 mit Branding)
## Pattern / Archetyp
BESPOKE-Public (höchster Polish laut Ticket). Bekommt in W4 die finale Politur (D-POLISH).
## Subframe
- (erst nach explizitem OK)
02 Wireframes/P16 Termine/WF-P16 Terminbuchung/Screens/S02 Fragen.md
+35
View File
@@ -0,0 +1,35 @@
---
kind: screen
project: HiveGrid Screen Project
ticket: D-BOOK + D-P16 (Teil)
package: WF-P16 Terminbuchung
id: S02
screen: Fragen (Kunden-Formular)
typ: BESPOKE-Public
umsetzung: Bauen
status: Validiert
route: "Schritt 2 nach Slot-Wahl"
subframe: ""
---
# S02 — 🌐 Fragen (Kunden-Formular)
## Ziel
Der Kunde gibt seine Daten ein — genau die Felder, die der Betrieb im Editor (S08) festgelegt hat.
## Was das Tool können muss
- Zusammenfassung des gewählten Slots oben (Datum, Zeit, Dauer) + »Termin ändern«-Link zurück zu S01
- **Felder aus dem Editor** (Name, E-Mail Pflicht; weitere je Konfiguration — Text, Telefon, Auswahl, …), Pflichtfeld-Markierung, Klartext-Validierung
- **Spam-Schutz** (mCaptcha) vor dem Absenden
- Absenden = verbindlich buchen → S03; **Race-Schutz:** ist der Slot inzwischen weg → Klartext-Hinweis + zurück zur Slot-Wahl (kein Datenverlust der Eingaben)
- Datenschutz-Hinweis (kurz, Klartext)
## Pattern / Archetyp
BESPOKE-Public. Feld-Rendering v1 als einfache Feld-Liste (D-FORM liegt als Review-Draft vor und wird später nur eingesteckt).
## Subframe
- (erst nach explizitem OK)
02 Wireframes/P16 Termine/WF-P16 Terminbuchung/Screens/S03 Bestaetigung.md
+35
View File
@@ -0,0 +1,35 @@
---
kind: screen
project: HiveGrid Screen Project
ticket: D-BOOK + D-P16 (Teil)
package: WF-P16 Terminbuchung
id: S03
screen: Bestaetigung
typ: BESPOKE-Public
umsetzung: Bauen
status: Validiert
route: "Schritt 3 nach Buchung"
subframe: ""
---
# S03 — 🌐 Bestätigung
## Ziel
Der Kunde weiß: Termin steht. Und er kriegt ihn in seinen eigenen Kalender.
## Was das Tool können muss
- Große Bestätigung mit allen Termin-Daten (Datum, Zeit, Dauer, ggf. Ort/Hinweise aus der Buchungsseite)
- **Add-to-Calendar-Knopf (.ics)** — funktioniert auf Handy und Desktop
- Hinweis auf die **Bestätigungs-Mail** (mit Absage-/Verschiebe-Link → S04)
- Firmen-Branding wie in S01/S02
- Was im Hintergrund passiert (nicht sichtbar, aber geplant): Anfrage im Lead-Eingang **oder** Aktivität am bekannten Kontakt (E-Mail-Match), Termin im Mitarbeiter-Kalender, Bestätigungs-Mail raus
## Pattern / Archetyp
BESPOKE-Public.
## Subframe
- (erst nach explizitem OK)
02 Wireframes/P16 Termine/WF-P16 Terminbuchung/Screens/S04 Absagen Verschieben.md
+35
View File
@@ -0,0 +1,35 @@
---
kind: screen
project: HiveGrid Screen Project
ticket: D-BOOK + D-P16 (Teil)
package: WF-P16 Terminbuchung
id: S04
screen: Absagen/Verschieben per Link
typ: BESPOKE-Public
umsetzung: Bauen
status: Validiert (Davids Delta)
route: "Link aus der Bestaetigungs-Mail"
subframe: ""
---
# S04 — 🌐 Absagen/Verschieben per Link (Davids Delta)
## Ziel
»Wie bei Calendly«: Der Kunde verwaltet seinen Termin selbst — ohne anzurufen. **Change-Request an Dev** (steht nicht in AK-P16b).
## Was das Tool können muss
- Zeigt die Buchung (Datum, Zeit, Buchungsseite, Firmen-Branding)
- **Verschieben:** öffnet den Slot-Picker (wie S01) → neuer Slot → Bestätigung; alte Zeit wird frei, Büro + Kalender automatisch aktuell
- **Absagen:** mit optionalem Grund → Bestätigung; Büro bekommt Benachrichtigung, Termin verschwindet aus dem Kalender
- Zustände: Link abgelaufen/ungültig, Termin liegt in der Vergangenheit, Termin wurde bereits storniert — je Klartext ohne Interna
- Sicherheit: signierter Link aus der Mail (kein Login nötig)
## Pattern / Archetyp
BESPOKE-Public, nutzt den Slot-Picker aus S01 wieder.
## Subframe
- (erst nach explizitem OK)
02 Wireframes/P16 Termine/WF-P16 Terminbuchung/Screens/S05 Buchungen-Liste.md
+37
View File
@@ -0,0 +1,37 @@
---
kind: screen
project: HiveGrid Screen Project
ticket: D-BOOK + D-P16 (Teil)
package: WF-P16 Terminbuchung
id: S05
screen: Buchungen-Liste
typ: A2 Liste
umsetzung: Bauen
status: Validiert
route: "/bookings"
subframe: ""
---
# S05 — Buchungen-Liste
## Ziel
Der Überblick: Was ist gebucht, was war, was wurde abgesagt.
## Was das Tool können muss
- **Reiter:** Anstehend · Vergangen · Storniert · Alle
- Spalten: Termin (Datum/Zeit), Endkunde (Name/E-Mail), Buchungsseite, zuständiger Mitarbeiter, Status
- **Filter:** Status, Mitarbeiter, Buchungsseite, Zeitraum
- **Mehrfach-Aktion:** Bulk-Storno (öffnet M02, eine Auto-Mail je Kunde)
- **CSV-Export**
- Zeilen-Klick → S06 (Detail); Schnell-Aktionen in der Zeile (stornieren, verschieben)
- Zustände: leer (Klartext + Link zu den Buchungsseiten), laden, Fehler
## Pattern / Archetyp
A2 Liste (sortierbar, paginiert) + Filter-Bar + Bulk-Toolbar — wie Lead-Inbox/Aufgaben-Liste.
## Subframe
- (erst nach explizitem OK)
02 Wireframes/P16 Termine/WF-P16 Terminbuchung/Screens/S06 Buchungs-Detail.md
+34
View File
@@ -0,0 +1,34 @@
---
kind: screen
project: HiveGrid Screen Project
ticket: D-BOOK + D-P16 (Teil)
package: WF-P16 Terminbuchung
id: S06
screen: Buchungs-Detail
typ: A3 Detail (Karteikarten-Muster)
umsetzung: Bauen
status: Validiert
route: "/bookings/:id"
subframe: ""
---
# S06 — Buchungs-Detail (Karteikarte)
## Ziel
Alles zu einer Buchung an einem Ort — nach dem validierten P6-Karteikarten-Muster.
## Was das Tool können muss
- **Links:** Termin-Daten (Datum, Zeit, Dauer, Buchungsseite), zuständiger Mitarbeiter, **verknüpfter Kontakt/Anfrage** (klickbar), Kalender-Sync-Badge (synchronisiert / steht aus / Fehler)
- **Rechts:** die **Antworten des Kunden** (Frage → Antwort, in Reihenfolge), **interne Notizen**, Verlauf (gebucht/verschoben/storniert mit wann + von wem)
- **Aktionen im Kopf:** als »stattgefunden« / »nicht erschienen« (No-Show) markieren · **Stornieren** (M02) · **Verschieben** (M01) · **anderem Mitarbeiter zuweisen** (Auswahl mit Verfügbarkeits-Hinweis)
- Status-Anzeige: gebucht / verschoben / storniert (mit Grund) / stattgefunden / No-Show
## Pattern / Archetyp
A3 Detail — Karteikarten-Grundgerüst aus WF-P6 (Zweispalter + Aktionen im Kopf).
## Subframe
- (erst nach explizitem OK)
02 Wireframes/P16 Termine/WF-P16 Terminbuchung/Screens/S07 Buchungsseiten-Liste.md
+34
View File
@@ -0,0 +1,34 @@
---
kind: screen
project: HiveGrid Screen Project
ticket: D-BOOK + D-P16 (Teil)
package: WF-P16 Terminbuchung
id: S07
screen: Buchungsseiten-Liste
typ: A2 Liste
umsetzung: Bauen
status: Validiert
route: "/bookings/pages"
subframe: ""
---
# S07 — Buchungsseiten-Liste
## Ziel
Alle Buchungslinks des Betriebs auf einen Blick — mit dem Link zum Kopieren direkt in der Zeile.
## Was das Tool können muss
- Spalten: Titel, Link (Slug) mit **Kopier-Knopf**, zugewiesene Mitarbeiter, Buchungen (gesamt / letzte 30 Tage), Status (veröffentlicht / Entwurf)
- »+ Neue Buchungsseite« → S08 (Editor)
- Zeilen-Aktionen: bearbeiten (S08), Link kopieren, veröffentlichen/zurückziehen, duplizieren
- Zustände: leer (Klartext + CTA »Erste Buchungsseite anlegen«), laden, Fehler
## Pattern / Archetyp
A2 Liste.
## Subframe
- (erst nach explizitem OK)
02 Wireframes/P16 Termine/WF-P16 Terminbuchung/Screens/S08 Buchungsseiten-Editor.md
+38
View File
@@ -0,0 +1,38 @@
---
kind: screen
project: HiveGrid Screen Project
ticket: D-BOOK + D-P16 (Teil)
package: WF-P16 Terminbuchung
id: S08
screen: Buchungsseiten-Editor
typ: A6 + A4
umsetzung: Bauen
status: Validiert
route: "/bookings/pages/:id + /new"
subframe: ""
---
# S08 — Buchungsseiten-Editor
## Ziel
Hier entsteht der Buchungslink: alles einstellen, »was da auch bei Calendly stehen würde« (Davids Vorgabe).
## Was das Tool können muss
- **Grunddaten:** Name, Link (Slug), Beschreibung (sieht der Kunde)
- **Termin-Logik:** Dauer · **Puffer** (Mindestabstand zwischen Terminen) · **Vorlauf** (frühestens buchbar ab) · wie weit im Voraus buchbar
- **Mitarbeiter-Auswahl:** wer kommt in Frage (v1-Vergabe: erster freier — Hinweis im UI)
- **Kunden-Fragen:** Felder festlegen (Name + E-Mail Pflicht, weitere frei: Text, Telefon, Auswahl, …) und je Feld die **Zuordnung zum Lead-Eingang** (welches Kunden-Feld → welches Lead-Feld) — Davids Punkt: nichts abtippen
- **Bestätigungs-Mail:** Text bearbeiten (Markdown + Platzhalter wie {Vorname}, {Termin}); enthält automatisch den Absage-/Verschiebe-Link (S04)
- **Veröffentlichen:** Publish-Schalter · öffentliche URL mit Kopier-Knopf · **Embed-Code (iFrame)** · **QR-Code**
- Hinweis, welche Verfügbarkeits-Zeiten (S09) greifen
- Zustände: unveröffentlichte Änderungen, Validierungs-Fehler in Klartext
## Pattern / Archetyp
A6 Settings + A4 Formular; Embed/QR/Copy-Muster wie im Ticket. Fragen-Felder v1 als einfache Feld-Liste (D-FORM liegt als Review-Draft vor und wird später eingesteckt).
## Subframe
- (erst nach explizitem OK)
02 Wireframes/P16 Termine/WF-P16 Terminbuchung/Screens/S09 Verfuegbarkeit.md
+37
View File
@@ -0,0 +1,37 @@
---
kind: screen
project: HiveGrid Screen Project
ticket: D-BOOK + D-P16 (Teil)
package: WF-P16 Terminbuchung
id: S09
screen: Verfuegbarkeit
typ: A6 + A4
umsetzung: Bauen
status: Validiert
route: "/availability"
subframe: ""
---
# S09 — Verfügbarkeit (»Wann bin ich buchbar?«)
## Ziel
Jeder Mitarbeiter pflegt seine eigenen buchbaren Zeiten; Admins können alle einsehen und ändern.
## Was das Tool können muss
- **Wochen-Regeln:** je Wochentag mehrere Zeitfenster (z. B. Mo 8–12 + 13–17), an/aus je Tag
- **Ausnahme-Tage:** Datum wählen → ganz frei ODER Sonder-Zeitfenster (z. B. 24.12. nur 8–12)
- **Zeitzone** der Zeiten
- **Admin-Sicht:** Mitarbeiter-Wechsler oben — Admin sieht und bearbeitet alle, jeder andere nur sich selbst
- Hinweis: **welche Buchungsseiten** diese Zeiten nutzen (mit Links)
- Klartext-Zusammenspiel: »Buchbar = diese Zeiten MINUS bestehende Termine (inkl. Google-Kalender) MINUS Puffer«
- Zustände: noch nichts gepflegt (Leer-Zustand mit Standard-Vorschlag Mo–Fr 8–17), Validierungs-Fehler
## Pattern / Archetyp
A6 Settings + A4; Wochen-Verfügbarkeits-Editor + Ausnahmen-Editor (UI-Elemente aus dem Ticket).
## Subframe
- (erst nach explizitem OK)
02 Wireframes/P16 Termine/WF-P16 Terminbuchung/Screens/V01 Termin waehlen Handy.md
+33
View File
@@ -0,0 +1,33 @@
---
kind: screen
project: HiveGrid Screen Project
ticket: D-BOOK + D-P16 (Teil)
package: WF-P16 Terminbuchung
id: V01
screen: Termin waehlen — Handy
typ: BESPOKE-Public 📱
umsetzung: Bauen
status: Validiert
route: "Variante von S01"
subframe: ""
---
# V01 — 🌐 Termin wählen — Handy 📱
## Ziel
Kunden buchen oft am Handy — die wichtigste öffentliche Seite muss dort genauso gut funktionieren.
## Was das Tool können muss
- Gleiche Logik wie S01, gestapelt: erst Tag wählen (kompakter Monats-Kalender), dann Zeitslot-Liste
- Zeitzonen-Wechsler erreichbar, Branding oben
- Fragen (S02) und Bestätigung (S03) sind auf dem Handy dieselben Screens (einspaltig) — nur der Slot-Picker braucht den eigenen Nachweis-Frame
## Pattern / Archetyp
BESPOKE-Public, Mobile-Variante von S01.
## Subframe
- (erst nach explizitem OK)
02 Wireframes/P16 Termine/WF-P16 Terminbuchung/WF-P16 Terminbuchung.canvas
+34
View File
@@ -0,0 +1,34 @@
{
"nodes":[
{"id":"md-paket","type":"file","file":"02 Wireframes/P16 Termine/WF-P16 Terminbuchung/WF-P16 Terminbuchung.md","x":-80,"y":-440,"width":460,"height":280},
{"id":"group-public","type":"group","x":-80,"y":-100,"width":2260,"height":660,"label":"Kunde 🌐 (Calendly-Stil, höchster Polish)"},
{"id":"group-intern","type":"group","x":2360,"y":-100,"width":1700,"height":940,"label":"Büro (intern)"},
{"id":"group-modals","type":"group","x":4160,"y":-100,"width":1180,"height":380,"label":"Aktionen (Modals)"},
{"id":"note-entry","type":"text","text":"# Einstieg Kunde\n\nBuchungslink / QR / iFrame-Embed.\n\nJede Buchung → Anfrage im Lead-Eingang ODER Aktivität am bekannten Kontakt (E-Mail-Match) + Termin im Mitarbeiter-Kalender.","x":0,"y":0,"width":360,"height":200},
{"id":"s01","type":"file","file":"02 Wireframes/P16 Termine/WF-P16 Terminbuchung/Screens/S01 Termin waehlen.md","x":560,"y":0,"width":420,"height":200},
{"id":"s02","type":"file","file":"02 Wireframes/P16 Termine/WF-P16 Terminbuchung/Screens/S02 Fragen.md","x":1120,"y":0,"width":420,"height":200},
{"id":"s03","type":"file","file":"02 Wireframes/P16 Termine/WF-P16 Terminbuchung/Screens/S03 Bestaetigung.md","x":1680,"y":0,"width":420,"height":200},
{"id":"v01","type":"file","file":"02 Wireframes/P16 Termine/WF-P16 Terminbuchung/Screens/V01 Termin waehlen Handy.md","x":560,"y":280,"width":420,"height":200},
{"id":"s04","type":"file","file":"02 Wireframes/P16 Termine/WF-P16 Terminbuchung/Screens/S04 Absagen Verschieben.md","x":1680,"y":280,"width":420,"height":200},
{"id":"s05","type":"file","file":"02 Wireframes/P16 Termine/WF-P16 Terminbuchung/Screens/S05 Buchungen-Liste.md","x":2440,"y":0,"width":420,"height":200},
{"id":"s06","type":"file","file":"02 Wireframes/P16 Termine/WF-P16 Terminbuchung/Screens/S06 Buchungs-Detail.md","x":3000,"y":0,"width":420,"height":200},
{"id":"s07","type":"file","file":"02 Wireframes/P16 Termine/WF-P16 Terminbuchung/Screens/S07 Buchungsseiten-Liste.md","x":2440,"y":280,"width":420,"height":200},
{"id":"s08","type":"file","file":"02 Wireframes/P16 Termine/WF-P16 Terminbuchung/Screens/S08 Buchungsseiten-Editor.md","x":3000,"y":280,"width":420,"height":200},
{"id":"s09","type":"file","file":"02 Wireframes/P16 Termine/WF-P16 Terminbuchung/Screens/S09 Verfuegbarkeit.md","x":2440,"y":560,"width":420,"height":200},
{"id":"note-intern","type":"text","text":"# Slot-Berechnung\n\nBuchbar = Verfügbarkeit (S09) − bestehende Termine (inkl. Google-Kalender aus WF-P16 Kalender) − Puffer/Vorlauf.\n\nVergabe v1: erster freier Mitarbeiter.","x":3000,"y":560,"width":460,"height":200},
{"id":"m01","type":"file","file":"02 Wireframes/P16 Termine/WF-P16 Terminbuchung/Screens/M01 Verschieben.md","x":4240,"y":0,"width":420,"height":200},
{"id":"m02","type":"file","file":"02 Wireframes/P16 Termine/WF-P16 Terminbuchung/Screens/M02 Stornieren.md","x":4820,"y":0,"width":420,"height":200}
],
"edges":[
{"id":"e-entry","fromNode":"note-entry","fromSide":"right","toNode":"s01","toSide":"left","toEnd":"arrow","styleAttributes":{"path":"dotted"}},
{"id":"e-s1s2","fromNode":"s01","fromSide":"right","toNode":"s02","toSide":"left","toEnd":"arrow","label":"weiter"},
{"id":"e-s2s3","fromNode":"s02","fromSide":"right","toNode":"s03","toSide":"left","toEnd":"arrow","label":"buchen"},
{"id":"e-handy","fromNode":"s01","fromSide":"bottom","toNode":"v01","toSide":"top","toEnd":"arrow","label":"Handy"},
{"id":"e-mail","fromNode":"s03","fromSide":"bottom","toNode":"s04","toSide":"top","toEnd":"arrow","label":"Link in der Mail"},
{"id":"e-open","fromNode":"s05","fromSide":"right","toNode":"s06","toSide":"left","toEnd":"arrow","label":"öffnen"},
{"id":"e-editor","fromNode":"s07","fromSide":"right","toNode":"s08","toSide":"left","toEnd":"arrow","label":"öffnen"},
{"id":"e-m01","fromNode":"s06","fromSide":"right","toNode":"m01","toSide":"left","toEnd":"arrow","label":"verschieben"},
{"id":"e-m02","fromNode":"s06","fromSide":"right","toNode":"m02","toSide":"left","toEnd":"arrow","label":"stornieren"},
{"id":"e-avail","fromNode":"note-intern","fromSide":"left","toNode":"s09","toSide":"right","toEnd":"arrow","styleAttributes":{"path":"dotted"}}
]
}
02 Wireframes/P16 Termine/WF-P16 Terminbuchung/WF-P16 Terminbuchung.md
+136
View File
@@ -0,0 +1,136 @@
---
kind: wireframe-package
project: HiveGrid Screen Project
ticket: D-BOOK + D-P16 (Teil)
package: WF-P16 Terminbuchung
typ: Flow
status: Validiert
subframe: ""
canvas: "WF-P16 Terminbuchung.canvas"
---
# WF-P16 Terminbuchung
Status: Validiert (Screen-Liste)
Subframe-Link: -
Canvas: [Canvas](<WF-P16 Terminbuchung.canvas>)
Stand: 2026-07-09
---
## 1. Kurzfassung
Online-Terminbuchung »wie bei Calendly« (Davids Vorgabe): Der Betrieb erstellt Buchungslinks (Dauer, Puffer, Vorlauf, Mitarbeiter, Kunden-Fragen inkl. **Feld-Zuordnung zum Lead-Eingang**), der Kunde bucht sich über eine 🌐 öffentliche Seite selbst einen freien Slot (Zeitzonen-fest, einbettbar, höchster Polish) und kann per Link in der Bestätigungs-Mail **selbst absagen/verschieben** (Davids Delta). Intern: Buchungen-Liste + Detail mit Notizen, Stornieren mit Grund + Auto-Mail, Verschieben, Neu-Zuweisen. Jede Buchung landet als Anfrage im Lead-Eingang oder hängt sich an den bestehenden Kontakt.
---
## 2. Intent Check
| Frage | Antwort |
|---|---|
| Ticket/Modul | D-BOOK (öffentliche Booking-Page) + D-P16 (Buchungen-Verwaltung, Editor, Verfügbarkeit), Dev-Pendant AK-P16b |
| Nutzer-Ziel | Kunde: Termin buchen ohne Anruf · Büro: Buchungslinks pflegen, Buchungen verwalten, nichts abtippen |
| Quellen geprüft | `ticket-docs/D-BOOK.md`, `ticket-docs/D-P16.md`, `designer-briefs/P16-…md`, HiveGrid Map |
| Sicher im Scope | 🌐 Buchungsstrecke (3 Schritte + Handy), 🌐 Absagen/Verschieben (Delta), Buchungen-Liste/-Detail, Buchungsseiten-Liste/-Editor, Verfügbarkeit |
| Sicher nicht im Scope | Formular-Baukasten selbst (D-FORM liegt als Review-Draft vor; Fragen hier bleiben als einfache Feld-Liste); Kalender-Grid (WF-P16 Kalender); Round-Robin/Wunsch-Mitarbeiter (v2) |
| Unsichere Annahmen | Self-Service-Absage/Verschieben ist NICHT im Dev-Ticket — Change-Request nötig (s. Offene Fragen) |
---
## 3. Scope
| Punkt | Inhalt |
|---|---|
| Startpunkt | 🌐 Buchungslink (`/b/{firma}/{slug}`) · Sidebar »Buchungen« (intern) |
| Ziel | Kunde hat gebucht (ohne Doppel-Buchung) · Buchung ist im Lead-Eingang/am Kontakt · Büro hat den Überblick |
| Haupt-Archetyp | **BESPOKE-Public** (höchster Polish) + A2/A3 Listen/Detail + A6/A4 Editor/Settings |
| Out of scope | v2: Wunsch-Mitarbeiter/Round-Robin, personalisierte Links |
---
## 4. Entscheidungen (validiert 2026-07-09)
| Entscheidung | Status | Notiz |
|---|---|---|
| Buchungsstrecke = 3 eigene Screens + 1 Handy-Frame | genommen | Termin wählen → Fragen → Bestätigung; Handy-Frame vom Slot-Picker (Kunden buchen oft mobil) |
| Kunde kann per Mail-Link selbst absagen/verschieben | genommen (Delta) | »Wie Calendly« — eigene 🌐 Seite S04; **Change-Request an Dev** (AK-P16b kennt nur internes Cancel/Reschedule) |
| Buchungs-Detail als eigene Detailseite | genommen | Karteikarten-Muster (P6): links Termin + Verknüpfungen, rechts Antworten/Notizen, Aktionen im Kopf |
| Verfügbarkeit pflegt jeder selbst, Admin alle | genommen | Passt zur Pro-Nutzer-Kalender-Verbindung; Admin hat Mitarbeiter-Auswahl in S09 |
| Fragen-Felder mit Feld-Zuordnung zum Lead-Eingang | genommen | Davids Punkt: im Editor festlegen, welches Kunden-Feld in welches Lead-Feld wandert — nichts abtippen |
| Slot-Vergabe v1: »erster freier Mitarbeiter« | genommen | Ticket-Schnitt; Kunde wählt keinen Mitarbeiter |
| Slot-Berechnung nutzt Kalender + Verfügbarkeit | genommen | Arbeitszeiten (S09) + bestehende Buchungen + Google-Sync (WF-P16 Kalender) + Puffer + Vorlauf |
### Happy Path
1. Büro legt Buchungsseite »Wartungstermin (30 Min)« an: Dauer, Puffer, Vorlauf, Mitarbeiter, 3 Kunden-Fragen (+ Zuordnung zum Lead), Bestätigungs-Mail — veröffentlichen, Link/QR teilen.
2. Kunde öffnet den Link (oft am Handy): freie Slots, wählt einen, beantwortet die Fragen, bucht — Bestätigung + Kalender-Datei.
3. Die Buchung erscheint intern (Liste + Lead-Eingang bzw. am bekannten Kontakt); der Termin steht im Kalender des Mitarbeiters.
4. Kunde kann's doch nicht einrichten → klickt »verschieben« in seiner Mail, wählt neuen Slot — Büro und Kalender bleiben automatisch aktuell.
### Meldungs-/Error-States (validiert)
| Ereignis | UI-Form | Blockiert? | Bauen? | Copy/Notiz |
|---|---|---|---|---|
| Slot gerade vergeben (Race-Schutz) | Klartext-Hinweis in S02/S03-Übergang + zurück zur Slot-Wahl | ja | Nur dokumentieren | »Dieser Termin wurde gerade vergeben — bitte wähle einen anderen.« |
| Keine freien Termine | Leer-Zustand in S01 mit Klartext | nein | Nur dokumentieren | »Aktuell sind keine Termine frei …« + ggf. Kontakt-Hinweis |
| Seite nicht veröffentlicht / Link falsch | 🌐 404-Seite mit Branding | ja | Nur dokumentieren | keine Interna verraten |
| Spam-Schutz | mCaptcha in S02 | ja (Submit) | Nur dokumentieren | wie öffentliche Formulare |
| Absage-/Verschiebe-Link abgelaufen oder Termin vorbei | Klartext-Zustand in S04 | ja | Nur dokumentieren | »Dieser Termin liegt in der Vergangenheit …« |
| Storno intern | M02 mit Pflicht-Grund + Hinweis auf Auto-Mail | ja (Aktion) | Bauen (M02) | auch als Bulk aus S05 |
| Kalender-Sync-Status je Buchung | Badge in S06 | nein | Nur dokumentieren | synchronisiert / steht aus / Fehler |
---
## 7. Validierte Screen-Liste
| ID | Screen/Zustand | Typ | Umsetzung | Ort | Status |
|---|---|---|---|---|---|
| S01 | 🌐 Termin wählen (Slot-Picker) ⭐ | BESPOKE-Public | Bauen | `/b/{firma}/{slug}` | Validiert |
| S02 | 🌐 Fragen (Kunden-Formular) | BESPOKE-Public | Bauen | Schritt 2 | Validiert |
| S03 | 🌐 Bestätigung (+ Kalender-Datei) | BESPOKE-Public | Bauen | Schritt 3 | Validiert |
| V01 | 🌐 Termin wählen — Handy | BESPOKE-Public 📱 | Bauen | Variante von S01 | Validiert |
| S04 | 🌐 Absagen/Verschieben per Link | BESPOKE-Public | Bauen | Link aus Bestätigungs-Mail | Validiert (Delta) |
| S05 | Buchungen-Liste | A2 Liste | Bauen | `/bookings` | Validiert |
| S06 | Buchungs-Detail (Karteikarte) | A3 Detail | Bauen | `/bookings/:id` | Validiert |
| S07 | Buchungsseiten-Liste | A2 Liste | Bauen | `/bookings/pages` | Validiert |
| S08 | Buchungsseiten-Editor | A6 + A4 | Bauen | `/bookings/pages/:id`, `/new` | Validiert |
| S09 | Verfügbarkeit (Wochen-Zeiten + Ausnahmen) | A6 + A4 | Bauen | `/availability` | Validiert |
| M01 | Verschieben (interner Slot-Picker) | Modal | Bauen | aus S06 | Validiert |
| M02 | Stornieren (Grund + Auto-Mail) | Modal | Bauen | aus S05/S06 | Validiert |
| D01–D05 | Race/leer/404/Spam/Link-abgelaufen (s. Tabelle) | Inline/Zustand | Nur dokumentieren | — | Validiert |
---
## 8. Grid
```text
🌐 Kunde: Link/QR/Embed -> S01 (Slots, Zeitzone) -> S02 (Fragen + Spam-Schutz) -> S03 (Bestätigung + .ics)
S01 -> V01 (Handy-Variante) · Bestätigungs-Mail -> S04 (absagen/verschieben -> zurück zu S01-Slots)
Buchung erzeugt: Anfrage im Lead-Eingang ODER Activity am bekannten Kontakt (E-Mail-Match) + Termin im Kalender (WF-P16 Kalender)
Intern: Sidebar -> S05 (Liste, Tabs) -> S06 (Detail: Antworten, Notizen, stattgefunden/No-Show)
S06 -> M01 (verschieben) / M02 (stornieren, Grund + Auto-Mail) / neu zuweisen
S07 (Buchungsseiten) -> S08 (Editor: Dauer/Puffer/Vorlauf/Fragen+Lead-Zuordnung/Mail/Publish/QR+Embed)
S09 Verfügbarkeit (jeder selbst, Admin alle) — speist die Slot-Berechnung
```
---
## 9. Screen-Pakete
- [[S01 Termin waehlen]] · [[S02 Fragen]] · [[S03 Bestaetigung]] · [[V01 Termin waehlen Handy]] · [[S04 Absagen Verschieben]]
- [[S05 Buchungen-Liste]] · [[S06 Buchungs-Detail]] · [[S07 Buchungsseiten-Liste]] · [[S08 Buchungsseiten-Editor]] · [[S09 Verfuegbarkeit]] · [[M01 Verschieben]] · [[M02 Stornieren]]
---
## 10. Offene Fragen
- **Change-Request an Dev:** 🌐 Self-Service-Absage/Verschieben per Mail-Link (S04) — AK-P16b kennt nur internes Cancel/Reschedule
- Fragen-Formular: v1 als einfache Feld-Liste im Editor (12 Feld-Typen) — der volle Formular-Baukasten (D-FORM) liegt als Review-Draft vor und wird hier später nur eingesteckt → mit Dev klären, dass die Schnittstelle passt
- Bulk-Storno: eine Mail je Kunde (automatisch) — Grenzen/Limits? → Dev
- Vorlauf-Feinheiten (max. wie weit im Voraus buchbar) → Standardwerte beim Subframe-Bau festlegen
## Handoff-Check
- [x] Jeder Screen ist mit Umsetzung markiert.
- [x] Meldungs-/Error-State-Matrix ist ausgefüllt.
- [ ] Subframe-Link ist eingetragen. *(Subframe erst nach explizitem OK)*
02 Wireframes/P2 Auth/WF-P2 2FA Verwalten/WF-P2 2FA Verwalten.canvas
+1 -1
View File
@@ -18,4 +18,4 @@
{"id":"edge-m02-inline","fromNode":"m02","fromSide":"bottom","toNode":"note-inline","toSide":"top","label":"Codefehler"},
{"id":"edge-m03-inline","fromNode":"m03","fromSide":"bottom","toNode":"note-inline","toSide":"top","label":"Codefehler"}
]
}
}
02 Wireframes/P2 Auth/WF-P2 Admin RBAC/WF-P2 Admin RBAC.canvas
+6 -6
View File
@@ -4,18 +4,18 @@
{"id":"group-notes","type":"group","x":-120,"y":900,"width":4280,"height":430,"label":"Dokumentierte Zustaende und Backlog"},
{"id":"s02","type":"file","file":"02 Wireframes/P2 Auth/WF-P2 Admin RBAC/Screens/S02 Rollen und Berechtigungen.md","x":1560,"y":440,"width":440,"height":230},
{"id":"s01","type":"file","file":"02 Wireframes/P2 Auth/WF-P2 Admin RBAC/Screens/S01 Mitarbeiterliste.md","x":0,"y":45,"width":440,"height":230},
{"id":"note-seed","type":"text","text":"# Rollenmodell\n\nAdmin ist die einzige Start-/Systemrolle.\n\nWeitere Rollen werden vom Admin selbst angelegt.\n\nRollen-Vorlagen sind Work in Progress und werden nicht als feste Rollen in der Liste gezeigt.","x":1520,"y":1020,"width":520,"height":240},
{"id":"m04a","type":"file","file":"02 Wireframes/P2 Auth/WF-P2 Admin RBAC/Screens/M04A Rolle anlegen.md","x":2120,"y":-110,"width":440,"height":230},
{"id":"m04b","type":"file","file":"02 Wireframes/P2 Auth/WF-P2 Admin RBAC/Screens/M04B Rolle duplizieren.md","x":2980,"y":-110,"width":440,"height":230},
{"id":"d03","type":"file","file":"02 Wireframes/P2 Auth/WF-P2 Admin RBAC/Screens/D03 Rolle in Nutzung blockiert.md","x":3600,"y":440,"width":440,"height":230},
{"id":"note-navigation","type":"text","text":"# Navigation\n\nS01 ist der Einstieg unter `Settings -> Mitarbeiter`.\n\nDer Rollen-Tab S02 ist direkt ueber die Settings-Tabs erreichbar und zusaetzlich ueber den Dropdown-Eintrag `Rollen und Berechtigungen bearbeiten`.","x":-40,"y":1020,"width":520,"height":240},
{"id":"m02","type":"file","file":"02 Wireframes/P2 Auth/WF-P2 Admin RBAC/Screens/M02 Rolle bearbeiten.md","x":2680,"y":440,"width":440,"height":230},
{"id":"note-d01","type":"text","text":"# D01 Rollen-Dropdown\n\nKein eigener Screen.\n\nDas Dropdown ist direkt in S01 enthalten:\n- Rolle wechseln\n- `Rollen und Berechtigungen bearbeiten` fuehrt zu S02\n- letzter Admin wird ueber V01 blockiert","x":720,"y":1015,"width":500,"height":250},
{"id":"note-backlog","type":"text","text":"# Backlog / V2\n\nReassign beim Deaktivieren, Rollen-Loeschen mit Ersatzrolle, Gruppen, Rechtekatalog, Rollen-Audit, Review-Zyklus, Rechte-Matrix, Bulk-Aktionen, erweiterter Admin-Schutz.","x":3520,"y":1020,"width":600,"height":240},
{"id":"note-permission","type":"text","text":"# Permission-Muster\n\nIm Rollen-Modal wird eine konkrete Permission-Zeile vorgebaut:\n\n`Mitarbeiter ansehen`\nBeschreibung darunter\nControl: Toggle `An/Aus`\n\nRead-only/Bearbeiten bleibt spaeteres Advanced Control, falls ein Recht nicht binaer ist.\n\nFinaler Rechtekatalog liegt bei Development.","x":2620,"y":1000,"width":560,"height":280},
{"id":"v01","type":"file","file":"02 Wireframes/P2 Auth/WF-P2 Admin RBAC/Screens/V01 Letzter Admin blockiert.md","x":2120,"y":-440,"width":440,"height":230},
{"id":"m01","type":"file","file":"02 Wireframes/P2 Auth/WF-P2 Admin RBAC/Screens/M01 Mitarbeiter einladen.md","x":1000,"y":-360,"width":440,"height":230},
{"id":"m03","type":"file","file":"02 Wireframes/P2 Auth/WF-P2 Admin RBAC/Screens/M03 Mitarbeiter deaktivieren.md","x":1000,"y":5,"width":440,"height":230}
{"id":"m03","type":"file","file":"02 Wireframes/P2 Auth/WF-P2 Admin RBAC/Screens/M03 Mitarbeiter deaktivieren.md","x":1000,"y":5,"width":440,"height":230},
{"id":"note-seed","type":"text","text":"# Rollenmodell\n\nAdmin ist die einzige Start-/Systemrolle.\n\nWeitere Rollen werden vom Admin selbst angelegt.\n\nRollen-Vorlagen sind Work in Progress und werden nicht als feste Rollen in der Liste gezeigt.","x":1520,"y":1020,"width":520,"height":240},
{"id":"note-navigation","type":"text","text":"# Navigation\n\nS01 ist der Einstieg unter `Settings -> Mitarbeiter`.\n\nDer Rollen-Tab S02 ist direkt ueber die Settings-Tabs erreichbar und zusaetzlich ueber den Dropdown-Eintrag `Rollen und Berechtigungen bearbeiten`.","x":-40,"y":1020,"width":520,"height":240},
{"id":"note-d01","type":"text","text":"# D01 Rollen-Dropdown\n\nKein eigener Screen.\n\nDas Dropdown ist direkt in S01 enthalten:\n- Rolle wechseln\n- `Rollen und Berechtigungen bearbeiten` fuehrt zu S02\n- letzter Admin wird ueber V01 blockiert","x":720,"y":1015,"width":500,"height":250},
{"id":"note-backlog","type":"text","text":"# Backlog / V2\n\nReassign beim Deaktivieren, Rollen-Loeschen mit Ersatzrolle, Gruppen, Rechtekatalog, Rollen-Audit, Review-Zyklus, Rechte-Matrix, Bulk-Aktionen, erweiterter Admin-Schutz.","x":3520,"y":1020,"width":600,"height":240},
{"id":"note-permission","type":"text","text":"# Permission-Muster\n\nIm Rollen-Modal wird eine konkrete Permission-Zeile vorgebaut:\n\n`Mitarbeiter ansehen`\nBeschreibung darunter\nControl: Toggle `An/Aus`\n\nRead-only/Bearbeiten bleibt spaeteres Advanced Control, falls ein Recht nicht binaer ist.\n\nFinaler Rechtekatalog liegt bei Development.","x":2620,"y":1000,"width":560,"height":280}
],
"edges":[
{"id":"edge-s01-m01","fromNode":"s01","fromSide":"right","toNode":"m01","toSide":"left","label":"Mitarbeiter einladen"},
02 Wireframes/P2 Auth/WF-P2 Passwort Reset/WF-P2 Passwort Reset.md
+9 -9
View File
@@ -161,15 +161,15 @@ Wie viel Sicherheit braucht der Passwort-Reset, bevor der Nutzer ein neues Passw
## 7. Validierte Screen-Liste
| ID | Screen/Zustand | Typ | Umsetzung | Ort | Status |
|---|---|---|---|---|---|
| S01 | [[Screens/S01 Passwort Reset anfordern]] | Auth Form | Bauen | `/forgot-password` | Validiert |
| S02 | [[Screens/S02 Reset-Link gesendet]] | Auth Feedback | Bauen | nach S01 | Validiert |
| S03 | [[Screens/S03 2FA bestaetigen]] | Auth Security | Bauen | nach Reset-Link, falls 2FA aktiv | Validiert |
| V01 | [[Varianten/V01 Reset-Link ungueltig]] | Auth Blocker | Bauen | Link-Fehler | Validiert |
| V02 | [[Varianten/V02 2FA nicht verfuegbar]] | Auth Blocker | Bauen | Variante von S03 | In Subframe |
| M01 | [[Screens/M01 Admin kontaktieren]] | Auth Modal | Bauen | von V02 | In Subframe |
| M02 | [[Screens/M02 Wiederherstellungscode eingeben]] | Auth Modal | Bauen | von V02 | In Subframe |
| ID | Screen/Zustand | Typ | Umsetzung | Ort | Status |
| --- | ----------------------------------------------- | ------------- | --------- | -------------------------------- | ----------- |
| S01 | [[Screens/S01 Passwort Reset anfordern]] | Auth Form | Bauen | `/forgot-password` | Validiert |
| S02 | [[Screens/S02 Reset-Link gesendet]] | Auth Feedback | Bauen | nach S01 | Validiert |
| S03 | [[Screens/S03 2FA bestaetigen]] | Auth Security | Bauen | nach Reset-Link, falls 2FA aktiv | Validiert |
| V01 | [[Varianten/V01 Reset-Link ungueltig]] | Auth Blocker | Bauen | Link-Fehler | Validiert |
| V02 | [[Varianten/V02 2FA nicht verfuegbar]] | Auth Blocker | Bauen | Variante von S03 | In Subframe |
| M01 | [[Screens/M01 Admin kontaktieren]] | Auth Modal | Bauen | von V02 | In Subframe |
| M02 | [[Screens/M02 Wiederherstellungscode eingeben]] | Auth Modal | Bauen | von V02 | In Subframe |
---
02 Wireframes/P3 Querschnitt/WF-P3 Audit Log/WF-P3 Audit Log.canvas
+34 -159
View File
@@ -1,161 +1,36 @@
{
"nodes": [
{
"id": "group-main",
"type": "group",
"x": -80,
"y": -100,
"width": 1875,
"height": 420,
"label": "Hauptflow (ein Screen, zwei Reiter)"
},
{
"id": "group-drawer",
"type": "group",
"x": -80,
"y": 460,
"width": 1875,
"height": 420,
"label": "Drawer und Modals"
},
{
"id": "group-notes",
"type": "group",
"x": 1935,
"y": -100,
"width": 460,
"height": 980,
"label": "Regeln"
},
{
"id": "note-entry",
"type": "text",
"text": "# Einstieg\n\nVerwaltung → Aktivitäts-Protokoll (`/admin/audit`).\n\nNur mit Recht `audit.read` sichtbar.",
"x": 0,
"y": 0,
"width": 360,
"height": 200
},
{
"id": "s01",
"type": "file",
"file": "02 Wireframes/P3 Querschnitt/WF-P3 Audit Log/Screens/S01 Protokoll-Ansicht.md",
"x": 595,
"y": 0,
"width": 420,
"height": 200
},
{
"id": "s02",
"type": "file",
"file": "02 Wireframes/P3 Querschnitt/WF-P3 Audit Log/Screens/S02 Exporte.md",
"x": 1275,
"y": 0,
"width": 420,
"height": 200
},
{
"id": "m01",
"type": "file",
"file": "02 Wireframes/P3 Querschnitt/WF-P3 Audit Log/Screens/M01 Detail-Drawer.md",
"x": 0,
"y": 560,
"width": 420,
"height": 200
},
{
"id": "m03",
"type": "file",
"file": "02 Wireframes/P3 Querschnitt/WF-P3 Audit Log/Screens/M03 Objekt-Verlauf-Drawer.md",
"x": 655,
"y": 560,
"width": 420,
"height": 200
},
{
"id": "m02",
"type": "file",
"file": "02 Wireframes/P3 Querschnitt/WF-P3 Audit Log/Screens/M02 Export anlegen.md",
"x": 1275,
"y": 560,
"width": 420,
"height": 200
},
{
"id": "note-mask",
"type": "text",
"text": "# Regeln (nur Doku)\n\n- Sensible Werte im Diff: nur „Wert geändert\"\n- Zeitraum max. 24 Monate — ältere nur per Export\n- Sortierung/Filter: Mitarbeiter, Zeitraum, Bereich, Änderungs-Art (validiert)\n- Actor-Marker: Mensch / Automation / MCP-Agent / Admin\n- M03 ist das wiederverwendbare „Verlauf\"-Muster für alle Detailseiten (Einstieg je Feature-Paket)",
"x": 1975,
"y": 0,
"width": 380,
"height": 560
},
{
"id": "md-paket",
"type": "file",
"file": "02 Wireframes/P3 Querschnitt/WF-P3 Audit Log/WF-P3 Audit Log.md",
"x": -80,
"y": -440,
"width": 460,
"height": 280
}
],
"edges": [
{
"id": "e-entry",
"fromNode": "note-entry",
"fromSide": "right",
"toNode": "s01",
"toSide": "left",
"toEnd": "arrow"
},
{
"id": "e-tab",
"fromNode": "s01",
"fromSide": "right",
"toNode": "s02",
"toSide": "left",
"toEnd": "arrow",
"label": "Reiter Exporte"
},
{
"id": "e-row",
"fromNode": "s01",
"fromSide": "bottom",
"toNode": "m01",
"toSide": "top",
"toEnd": "arrow",
"label": "Zeile öffnen"
},
{
"id": "e-verlauf",
"fromNode": "m01",
"fromSide": "right",
"toNode": "m03",
"toSide": "left",
"toEnd": "arrow",
"label": "Verlauf dieses Objekts"
},
{
"id": "e-export",
"fromNode": "s02",
"fromSide": "bottom",
"toNode": "m02",
"toSide": "top",
"toEnd": "arrow",
"label": "Export anlegen"
},
{
"id": "e-job",
"fromNode": "m02",
"fromSide": "right",
"toNode": "s02",
"toSide": "right",
"toEnd": "arrow",
"label": "Job angelegt",
"styleAttributes": {
"path": "long-dashed"
}
}
]
"nodes":[
{"id":"group-main","type":"group","x":-80,"y":-100,"width":1875,"height":420,"label":"Hauptflow (ein Screen, zwei Reiter)"},
{"id":"group-drawer","type":"group","x":-80,"y":460,"width":1875,"height":420,"label":"Drawer und Modals"},
{"id":"group-notes","type":"group","x":1935,"y":-100,"width":460,"height":980,"label":"Regeln"},
{"id":"note-entry","type":"text","text":"# Einstieg\n\nVerwaltung → Aktivitäts-Protokoll (`/admin/audit`).\n\nNur mit Recht `audit.read` sichtbar.","x":0,"y":0,"width":360,"height":200},
{"id":"s01","type":"file","file":"02 Wireframes/P3 Querschnitt/WF-P3 Audit Log/Screens/S01 Protokoll-Ansicht.md","x":595,"y":0,"width":420,"height":200},
{"id":"s02","type":"file","file":"02 Wireframes/P3 Querschnitt/WF-P3 Audit Log/Screens/S02 Exporte.md","x":1275,"y":0,"width":420,"height":200},
{"id":"m01","type":"file","file":"02 Wireframes/P3 Querschnitt/WF-P3 Audit Log/Screens/M01 Detail-Drawer.md","x":0,"y":560,"width":420,"height":200},
{"id":"m03","type":"file","file":"02 Wireframes/P3 Querschnitt/WF-P3 Audit Log/Screens/M03 Objekt-Verlauf-Drawer.md","x":655,"y":560,"width":420,"height":200},
{"id":"m02","type":"file","file":"02 Wireframes/P3 Querschnitt/WF-P3 Audit Log/Screens/M02 Export anlegen.md","x":1275,"y":560,"width":420,"height":200},
{"id":"note-mask","type":"text","text":"# Regeln (nur Doku)\n\n- Sensible Werte im Diff: nur „Wert geändert\"\n- Zeitraum max. 24 Monate — ältere nur per Export\n- Sortierung/Filter: Mitarbeiter, Zeitraum, Bereich, Änderungs-Art (validiert)\n- Actor-Marker: Mensch / Automation / MCP-Agent / Admin\n- M03 ist das wiederverwendbare „Verlauf\"-Muster für alle Detailseiten (Einstieg je Feature-Paket)","x":1975,"y":0,"width":380,"height":560},
{"id":"md-paket","type":"file","file":"02 Wireframes/P3 Querschnitt/WF-P3 Audit Log/WF-P3 Audit Log.md","x":-80,"y":-440,"width":460,"height":280}
],
"edges":[
{"id":"e-entry","fromNode":"note-entry","fromSide":"right","toNode":"s01","toSide":"left","toEnd":"arrow"},
{"id":"e-tab","fromNode":"s01","fromSide":"right","toNode":"s02","toSide":"left","toEnd":"arrow","label":"Reiter Exporte"},
{"id":"e-row","fromNode":"s01","fromSide":"bottom","toNode":"m01","toSide":"top","toEnd":"arrow","label":"Zeile öffnen"},
{"id":"e-verlauf","fromNode":"m01","fromSide":"right","toNode":"m03","toSide":"left","toEnd":"arrow","label":"Verlauf dieses Objekts"},
{"id":"e-export","fromNode":"s02","fromSide":"bottom","toNode":"m02","toSide":"top","toEnd":"arrow","label":"Export anlegen"},
{
"id":"e-job",
"fromNode":"m02",
"fromSide":"right",
"toNode":"s02",
"toSide":"right",
"toEnd":"arrow",
"label":"Job angelegt",
"styleAttributes":{"path":"long-dashed"}
}
],
"metadata":{
"version":"1.0-1.0",
"frontmatter":{}
}
}
02 Wireframes/P7 Leads/WF-P7 Leads/WF-P7 Leads.canvas
+15 -3
View File
@@ -16,11 +16,23 @@
{"id":"s05","type":"file","file":"02 Wireframes/P7 Leads/WF-P7 Leads/Screens/S05 Spam-Schutz.md","x":2500,"y":560,"width":420,"height":200}
],
"edges":[
{"id":"e-entry","fromNode":"note-entry","fromSide":"right","toNode":"s01","toSide":"left","toEnd":"arrow","styleAttributes":{"path":"dotted"}},
{
"id":"e-entry",
"fromNode":"note-entry",
"fromSide":"right",
"toNode":"s01",
"toSide":"left",
"toEnd":"arrow",
"styleAttributes":{"path":"dotted"}
},
{"id":"e-open","fromNode":"s01","fromSide":"right","toNode":"s02","toSide":"left","toEnd":"arrow","label":"Anfrage öffnen"},
{"id":"e-stats","fromNode":"s01","fromSide":"top","toNode":"s03","toSide":"top","toEnd":"arrow","label":"Statistiken · Drill-Down zurück in gefilterte Inbox"},
{"id":"e-convert","fromNode":"s02","fromSide":"bottom","toNode":"m01","toSide":"top","toEnd":"arrow","label":"Zu Projekt (Freigabe = ja; aus S01 auch als Bulk)"},
{"id":"e-new","fromNode":"s01","fromSide":"bottom","toNode":"m02","toSide":"top","toEnd":"arrow","label":"+ Anfrage"},
{"id":"e-import","fromNode":"s01","fromSide":"bottom","toNode":"m03","toSide":"top","toEnd":"arrow","label":"Importieren (CSV)"}
]
}
],
"metadata":{
"version":"1.0-1.0",
"frontmatter":{}
}
}
02 Wireframes/P8 Pipelines/WF-P8 Pipelines/WF-P8 Pipelines.canvas
+34 -5
View File
@@ -19,14 +19,43 @@
{"id":"s06","type":"file","file":"02 Wireframes/P8 Pipelines/WF-P8 Pipelines/Screens/S06 Verlust-Gruende.md","x":1240,"y":1220,"width":420,"height":200}
],
"edges":[
{"id":"e-entry","fromNode":"note-entry","fromSide":"right","toNode":"s01","toSide":"left","toEnd":"arrow","styleAttributes":{"path":"dotted"}},
{
"id":"e-entry",
"fromNode":"note-entry",
"fromSide":"right",
"toNode":"s01",
"toSide":"left",
"toEnd":"arrow",
"styleAttributes":{"path":"dotted"}
},
{"id":"e-open","fromNode":"s01","fromSide":"right","toNode":"s02","toSide":"left","toEnd":"arrow","label":"Karte öffnen"},
{"id":"e-liste","fromNode":"s01","fromSide":"top","toNode":"s03","toSide":"top","toEnd":"arrow","label":"Umschalter Board ↔ Liste"},
{"id":"e-lost","fromNode":"s01","fromSide":"bottom","toNode":"m01","toSide":"top","toEnd":"arrow","label":"Verloren-Spalte (Grund Pflicht)"},
{"id":"e-won","fromNode":"s01","fromSide":"bottom","toNode":"m02","toSide":"top","toEnd":"arrow","label":"Gewonnen ohne Spalten-Regel"},
{"id":"e-verw","fromNode":"s02","fromSide":"bottom","toNode":"s04","toSide":"top","toEnd":"arrow","label":"Board verwalten (aus S01/S02)"},
{"id":"e-edit","fromNode":"s04","fromSide":"right","toNode":"s05","toSide":"left","toEnd":"arrow","label":"Edit-Mode öffnen"},
{"id":"e-link","fromNode":"s07","fromSide":"top","toNode":"s04","toSide":"bottom","toEnd":"arrow","label":"öffnet dieselbe Seite","styleAttributes":{"path":"long-dashed"}},
{"id":"e-set","fromNode":"note-settings","fromSide":"right","toNode":"s07","toSide":"left","toEnd":"arrow","styleAttributes":{"path":"dotted"}}
]
}
{
"id":"e-link",
"fromNode":"s07",
"fromSide":"top",
"toNode":"s04",
"toSide":"bottom",
"toEnd":"arrow",
"label":"öffnet dieselbe Seite",
"styleAttributes":{"path":"long-dashed"}
},
{
"id":"e-set",
"fromNode":"note-settings",
"fromSide":"right",
"toNode":"s07",
"toSide":"left",
"toEnd":"arrow",
"styleAttributes":{"path":"dotted"}
}
],
"metadata":{
"version":"1.0-1.0",
"frontmatter":{}
}
}
02 Wireframes/Screen Paket Tracker.md
+92 -27
View File
@@ -46,9 +46,13 @@ Diese Datei ist der erste Ort, um zu sehen:
| WF-P9 Projekt-Akte | D-P9 | Auftrag | Validiert | [MD](<P9 Auftrag/WF-P9 Projekt-Akte/WF-P9 Projekt-Akte.md>) | [Canvas](<P9 Auftrag/WF-P9 Projekt-Akte/WF-P9 Projekt-Akte.canvas>) | - | Subframe nach explizitem OK | Screens validiert 2026-07-09; Rechnung v1 neu; Board-Auftragsoptionen erweitern WF-P8 S04 |
| WF-P9 Plantafel | D-PLAN | Auftrag | Validiert | [MD](<P9 Auftrag/WF-P9 Plantafel/WF-P9 Plantafel.md>) | [Canvas](<P9 Auftrag/WF-P9 Plantafel/WF-P9 Plantafel.canvas>) | - | Subframe nach explizitem OK | Screens validiert 2026-07-09; Monteur-Modus = 1 Frame Heute<->Woche; Konflikt-Dialog wird gebaut |
| 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-P12 Flow-Editor | D-FLOW | Automationen | Subframe Draft | [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](<https://app.subframe.com/f023064a5ca0/flow/22d511a9-1d8f-4554-89ad-86729b8d7738/edit>) | David Review / Varianten-Entscheidung | Screens validiert 2026-07-09; Subframe-Abgleich 2026-07-10: 2 S01-Varianten (Dreispalten kompakt vs. Gefuehrter Inspector), Entscheidung offen; Langlaeufer |
| WF-P12 Verwaltung | D-P12 | Automationen | Subframe Draft | [MD](<P12 Automationen/WF-P12 Verwaltung/WF-P12 Verwaltung.md>) | [Canvas](<P12 Automationen/WF-P12 Verwaltung/WF-P12 Verwaltung.canvas>) | [Subframe](<https://app.subframe.com/f023064a5ca0/flow/22d511a9-1d8f-4554-89ad-86729b8d7738/edit>) | David Review | Screens validiert 2026-07-09; Subframe-Abgleich 2026-07-10: alle 5 Screens gebaut, Details in Screen-MDs; Klartext-Timeline + 24h-Undo |
| 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 |
| WF-P16 Kalender | D-BOOK + D-P16 | Termine | Validiert | [MD](<P16 Termine/WF-P16 Kalender/WF-P16 Kalender.md>) | [Canvas](<P16 Termine/WF-P16 Kalender/WF-P16 Kalender.canvas>) | - | Subframe nach explizitem OK | Screens validiert 2026-07-09; Davids Delta: vollwertiger Kalender (anlegen + einladen inkl. freie E-Mails, Kollegen-Overlay) = CR an Dev; Sync im P5-Muster |
| WF-P16 Terminbuchung | D-BOOK + D-P16 | Termine | Validiert | [MD](<P16 Termine/WF-P16 Terminbuchung/WF-P16 Terminbuchung.md>) | [Canvas](<P16 Termine/WF-P16 Terminbuchung/WF-P16 Terminbuchung.canvas>) | - | Subframe nach explizitem OK | Screens validiert 2026-07-09; Calendly-Stil; Davids Delta: Kunde kann per Mail-Link absagen/verschieben (S04) = CR an Dev; Feld-Zuordnung zum Lead im Editor |
| WF-P16 E-Signatur | D-P16 + AK-P16d | Termine | Validiert | [MD](<P16 Termine/WF-P16 E-Signatur/WF-P16 E-Signatur.md>) | [Canvas](<P16 Termine/WF-P16 E-Signatur/WF-P16 E-Signatur.canvas>) | - | Subframe nach explizitem OK | Screens validiert 2026-07-09; Projekt-Kern statt Deal; SES-Eigenbau Default; Davids Delta: eigene Kunden-Signierseite S04 |
| WF-P15 Team-Chat | D-CHAT + AK-P15b | Kommunikation | Entwurf | [MD](<P15 Kommunikation/WF-P15 Team-Chat/WF-P15 Team-Chat.md>) | [Canvas](<P15 Kommunikation/WF-P15 Team-Chat/WF-P15 Team-Chat.canvas>) | - | Mit David validieren | Entwurf angelegt 2026-07-09; noch nicht gemeinsam geplant/validiert |
---
@@ -180,15 +184,15 @@ Diese Datei ist der erste Ort, um zu sehen:
| S02 | Abnahme Schritt 1: Pruefungen | WF-P9 Abnahme | BESPOKE-Mobile | Bauen | Validiert | `/projects/:id/acceptance/new` | [MD](<P9 Auftrag/WF-P9 Abnahme/Screens/S02 Schritt Pruefungen.md>) | - | [Canvas](<P9 Auftrag/WF-P9 Abnahme/WF-P9 Abnahme.canvas>) |
| S03 | Abnahme Schritt 2: Maengel | WF-P9 Abnahme | BESPOKE-Mobile | Bauen | Validiert | Workflow | [MD](<P9 Auftrag/WF-P9 Abnahme/Screens/S03 Schritt Maengel.md>) | - | [Canvas](<P9 Auftrag/WF-P9 Abnahme/WF-P9 Abnahme.canvas>) |
| S04 | Abnahme Schritt 3: Unterschriften | WF-P9 Abnahme | BESPOKE-Mobile | Bauen | Validiert | Workflow | [MD](<P9 Auftrag/WF-P9 Abnahme/Screens/S04 Schritt Unterschriften.md>) | - | [Canvas](<P9 Auftrag/WF-P9 Abnahme/WF-P9 Abnahme.canvas>) |
| S01 | Flow-Editor (Katalog/Canvas/Konfig) | WF-P12 Flow-Editor | BESPOKE | Bauen | Validiert | `/automations/:id/edit` | [MD](<P12 Automationen/WF-P12 Flow-Editor/Screens/S01 Flow-Editor.md>) | - | [Canvas](<P12 Automationen/WF-P12 Flow-Editor/WF-P12 Flow-Editor.canvas>) |
| M01 | Probelauf (Dry-Run) | WF-P12 Flow-Editor | Modal | Bauen | Validiert | aus S01 | [MD](<P12 Automationen/WF-P12 Flow-Editor/Screens/M01 Probelauf.md>) | - | [Canvas](<P12 Automationen/WF-P12 Flow-Editor/WF-P12 Flow-Editor.canvas>) |
| M02 | Schleifen-Warnung | WF-P12 Flow-Editor | Modal | Bauen | Validiert | aus S01 | [MD](<P12 Automationen/WF-P12 Flow-Editor/Screens/M02 Schleifen-Warnung.md>) | - | [Canvas](<P12 Automationen/WF-P12 Flow-Editor/WF-P12 Flow-Editor.canvas>) |
| M03 | Start-Auswahl (leer/Vorlage) | WF-P12 Flow-Editor | Modal | Bauen | Validiert | + Neue Automation | [MD](<P12 Automationen/WF-P12 Flow-Editor/Screens/M03 Start-Auswahl.md>) | - | [Canvas](<P12 Automationen/WF-P12 Flow-Editor/WF-P12 Flow-Editor.canvas>) |
| S01 | Automation-Liste | WF-P12 Verwaltung | Liste | Bauen | Validiert | `/automations` | [MD](<P12 Automationen/WF-P12 Verwaltung/Screens/S01 Automation-Liste.md>) | - | [Canvas](<P12 Automationen/WF-P12 Verwaltung/WF-P12 Verwaltung.canvas>) |
| S02 | Lauf-Liste | WF-P12 Verwaltung | Liste | Bauen | Validiert | `.../executions` | [MD](<P12 Automationen/WF-P12 Verwaltung/Screens/S02 Lauf-Liste.md>) | - | [Canvas](<P12 Automationen/WF-P12 Verwaltung/WF-P12 Verwaltung.canvas>) |
| 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>) |
| S01 | Flow-Editor (Katalog/Canvas/Konfig) | WF-P12 Flow-Editor | BESPOKE | Bauen | Subframe Draft / Varianten-Entscheidung offen | `/automations/:id/edit` | [MD](<P12 Automationen/WF-P12 Flow-Editor/Screens/S01 Flow-Editor.md>) | [Subframe A](<https://app.subframe.com/f023064a5ca0/design/a42ecf81-5d6e-4fa1-9076-b22010cd5ecf/edit>) · [B](<https://app.subframe.com/f023064a5ca0/design/ce6a73d8-ae0c-4d1c-b8f8-f426dfe19d32/edit>) | [Canvas](<P12 Automationen/WF-P12 Flow-Editor/WF-P12 Flow-Editor.canvas>) |
| M01 | Probelauf (Dry-Run) | WF-P12 Flow-Editor | Modal | Bauen | Subframe Draft / Review offen | aus S01 | [MD](<P12 Automationen/WF-P12 Flow-Editor/Screens/M01 Probelauf.md>) | [Subframe](<https://app.subframe.com/f023064a5ca0/design/ea231a78-eddb-4c04-97a8-7574d45d8576/edit>) | [Canvas](<P12 Automationen/WF-P12 Flow-Editor/WF-P12 Flow-Editor.canvas>) |
| M02 | Schleifen-Warnung | WF-P12 Flow-Editor | Modal | Bauen | Subframe Draft / Review offen | aus S01 | [MD](<P12 Automationen/WF-P12 Flow-Editor/Screens/M02 Schleifen-Warnung.md>) | [Subframe](<https://app.subframe.com/f023064a5ca0/design/8e8943a5-36ea-4792-a3e0-590cb88fd9df/edit>) | [Canvas](<P12 Automationen/WF-P12 Flow-Editor/WF-P12 Flow-Editor.canvas>) |
| M03 | Start-Auswahl (leer/Vorlage) | WF-P12 Flow-Editor | Modal | Bauen | Subframe Draft / Review offen | + Neue Automation | [MD](<P12 Automationen/WF-P12 Flow-Editor/Screens/M03 Start-Auswahl.md>) | [Subframe](<https://app.subframe.com/f023064a5ca0/design/8b398273-682e-4cf2-851b-3b1a89da4d90/edit>) | [Canvas](<P12 Automationen/WF-P12 Flow-Editor/WF-P12 Flow-Editor.canvas>) |
| S01 | Automation-Liste | WF-P12 Verwaltung | Liste | Bauen | Subframe Draft / Review offen | `/automations` | [MD](<P12 Automationen/WF-P12 Verwaltung/Screens/S01 Automation-Liste.md>) | [Subframe](<https://app.subframe.com/f023064a5ca0/design/336ccdfb-80f9-45bf-a158-e74cabb70a20/edit>) | [Canvas](<P12 Automationen/WF-P12 Verwaltung/WF-P12 Verwaltung.canvas>) |
| S02 | Lauf-Liste | WF-P12 Verwaltung | Liste | Bauen | Subframe Draft / Review offen | `.../executions` | [MD](<P12 Automationen/WF-P12 Verwaltung/Screens/S02 Lauf-Liste.md>) | [Subframe](<https://app.subframe.com/f023064a5ca0/design/0fab5d8c-1e6a-4220-863d-7e46aba0f06c/edit>) | [Canvas](<P12 Automationen/WF-P12 Verwaltung/WF-P12 Verwaltung.canvas>) |
| S03 | Lauf-Detail (Timeline, 24h-Undo) | WF-P12 Verwaltung | Detail | Bauen | Subframe Draft / Review offen | `.../executions/:id` | [MD](<P12 Automationen/WF-P12 Verwaltung/Screens/S03 Lauf-Detail.md>) | [Subframe](<https://app.subframe.com/f023064a5ca0/design/9997a3c4-d18b-449f-bbbd-4fe6dd24f3df/edit>) | [Canvas](<P12 Automationen/WF-P12 Verwaltung/WF-P12 Verwaltung.canvas>) |
| S04 | Vorlagen-Katalog | WF-P12 Verwaltung | Karten-Liste | Bauen | Subframe Draft / Review offen | `/automations/templates` | [MD](<P12 Automationen/WF-P12 Verwaltung/Screens/S04 Vorlagen-Katalog.md>) | [Subframe](<https://app.subframe.com/f023064a5ca0/design/46e04956-4903-4733-9345-81b18f34e858/edit>) | [Canvas](<P12 Automationen/WF-P12 Verwaltung/WF-P12 Verwaltung.canvas>) |
| S05 | Baustein-Konfig-Panels (Muster) | WF-P12 Verwaltung | Compose-Panel | Bauen | Subframe Draft / Review offen | im Flow-Editor | [MD](<P12 Automationen/WF-P12 Verwaltung/Screens/S05 Baustein-Konfig-Panels.md>) | [Subframe](<https://app.subframe.com/f023064a5ca0/design/83599a34-97b4-4881-beb4-8b7e35d11aa0/edit>) | [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>) |
@@ -204,24 +208,53 @@ Diese Datei ist der erste Ort, um zu sehen:
| 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>) |
| D01 | Sharing Panel URL QR iFrame | WF-D-FORM Form Builder | Detailnotiz | Nur dokumentieren | Dokumentiert / nicht im Review-Canvas | Public-Link/Teilen-Kontext, kein eigener Screen | [MD](<D-FORM Formulare/WF-D-FORM Form Builder/Screens/D01 Sharing Panel URL QR iFrame.md>) | - | - |
| D02 | Post-Submit Actions | WF-D-FORM Form Builder | Detailnotiz | Nur dokumentieren | Dokumentiert / nicht im Review-Canvas | Nach-Absenden-Kontext, kein eigener Screen | [MD](<D-FORM Formulare/WF-D-FORM Form Builder/Screens/D02 Post-Submit Actions.md>) | - | - |
| D03 | Conditional Logic Editor | WF-D-FORM Form Builder | Detailnotiz | Nur dokumentieren | Dokumentiert / nicht im Review-Canvas | einfache Bedingungen, kein eigener Screen | [MD](<D-FORM Formulare/WF-D-FORM Form Builder/Screens/D03 Conditional Logic Editor.md>) | - | - |
| D06 | Feldkarten Menue | WF-D-FORM Form Builder | Detailnotiz | Nur dokumentieren | Dokumentiert / nicht im Review-Canvas | Fragekarten-Menue, kein eigener Screen | [MD](<D-FORM Formulare/WF-D-FORM Form Builder/Screens/D06 Feldkarten Menue.md>) | - | - |
| D10 | Builder Interaktionsfaelle | WF-D-FORM Form Builder | Case-Matrix | Nur dokumentieren | Dokumentiert / nicht im Review-Canvas | Klick-/Edge-Cases, kein eigener Screen | [MD](<D-FORM Formulare/WF-D-FORM Form Builder/Screens/D10 Builder Interaktionsfaelle.md>) | - | - |
| M01 | Feld loeschen Confirm | WF-D-FORM Form Builder | Confirm Modal | Nur dokumentieren | Dokumentiert / nicht im Review-Canvas | von Fragekarte oder Inspector | [MD](<D-FORM Formulare/WF-D-FORM Form Builder/Screens/M01 Feld loeschen Confirm.md>) | - | - |
| M02 | Unpublish Confirm | WF-D-FORM Form Builder | Confirm Modal | Nur dokumentieren | Dokumentiert / nicht im Review-Canvas | von Publish/Public-Link-Kontext | [MD](<D-FORM Formulare/WF-D-FORM Form Builder/Screens/M02 Unpublish Confirm.md>) | - | - |
| M03 | Archive Confirm | WF-D-FORM Form Builder | Confirm Modal | Nur dokumentieren | Dokumentiert / nicht im Review-Canvas | von More-Menue | [MD](<D-FORM Formulare/WF-D-FORM Form Builder/Screens/M03 Archive Confirm.md>) | - | - |
| M04 | Unsaved Changes Confirm | WF-D-FORM Form Builder | Confirm Modal / Browser Guard | Nur dokumentieren | Dokumentiert / nicht im Review-Canvas | beim Verlassen mit Dirty State | [MD](<D-FORM Formulare/WF-D-FORM Form Builder/Screens/M04 Unsaved Changes Confirm.md>) | - | - |
| S01 | Kalender (Monat/Woche, Kollegen-Overlay) | WF-P16 Kalender | BESPOKE Grid | Bauen | Validiert | `/calendar` | [MD](<P16 Termine/WF-P16 Kalender/Screens/S01 Kalender.md>) | - | [Canvas](<P16 Termine/WF-P16 Kalender/WF-P16 Kalender.canvas>) |
| M01 | Termin anlegen/bearbeiten | WF-P16 Kalender | Modal | Bauen | Validiert | Slot-Klick / + Termin in S01 | [MD](<P16 Termine/WF-P16 Kalender/Screens/M01 Termin-Dialog.md>) | - | [Canvas](<P16 Termine/WF-P16 Kalender/WF-P16 Kalender.canvas>) |
| M02 | Termin-Detail (Popover) | WF-P16 Kalender | Popover | Bauen | Validiert | Termin-Klick in S01 | [MD](<P16 Termine/WF-P16 Kalender/Screens/M02 Termin-Detail.md>) | - | [Canvas](<P16 Termine/WF-P16 Kalender/WF-P16 Kalender.canvas>) |
| S02 | Kalender-Einstellungen & Sync | WF-P16 Kalender | Settings (A6) | Bauen | Validiert | `/calendar/settings` | [MD](<P16 Termine/WF-P16 Kalender/Screens/S02 Kalender-Einstellungen.md>) | - | [Canvas](<P16 Termine/WF-P16 Kalender/WF-P16 Kalender.canvas>) |
| D01 | OAuth-Assistent (aus WF-P5 M01) | WF-P16 Kalender | Wizard | Wiederverwenden | Validiert | aus S02 | [MD](<P16 Termine/WF-P16 Kalender/Screens/S02 Kalender-Einstellungen.md>) | - | - |
| D02 | Trennen-Bestaetigung + Extern-Wahl (aus WF-P5 M03) | WF-P16 Kalender | Modal | Wiederverwenden | Validiert | aus S02 | [MD](<P16 Termine/WF-P16 Kalender/Screens/S02 Kalender-Einstellungen.md>) | - | - |
| S01 | Termin waehlen (Slot-Picker) 🌐 | WF-P16 Terminbuchung | BESPOKE-Public | Bauen | Validiert | `/b/{firma}/{slug}` | [MD](<P16 Termine/WF-P16 Terminbuchung/Screens/S01 Termin waehlen.md>) | - | [Canvas](<P16 Termine/WF-P16 Terminbuchung/WF-P16 Terminbuchung.canvas>) |
| S02 | Fragen (Kunden-Formular) 🌐 | WF-P16 Terminbuchung | BESPOKE-Public | Bauen | Validiert | Schritt 2 | [MD](<P16 Termine/WF-P16 Terminbuchung/Screens/S02 Fragen.md>) | - | [Canvas](<P16 Termine/WF-P16 Terminbuchung/WF-P16 Terminbuchung.canvas>) |
| S03 | Bestaetigung (+ .ics) 🌐 | WF-P16 Terminbuchung | BESPOKE-Public | Bauen | Validiert | Schritt 3 | [MD](<P16 Termine/WF-P16 Terminbuchung/Screens/S03 Bestaetigung.md>) | - | [Canvas](<P16 Termine/WF-P16 Terminbuchung/WF-P16 Terminbuchung.canvas>) |
| V01 | Termin waehlen — Handy 🌐📱 | WF-P16 Terminbuchung | BESPOKE-Public Mobile | Bauen | Validiert | Variante von S01 | [MD](<P16 Termine/WF-P16 Terminbuchung/Screens/V01 Termin waehlen Handy.md>) | - | [Canvas](<P16 Termine/WF-P16 Terminbuchung/WF-P16 Terminbuchung.canvas>) |
| S04 | Absagen/Verschieben per Link 🌐 | WF-P16 Terminbuchung | BESPOKE-Public | Bauen | Validiert (Delta) | Link aus Bestaetigungs-Mail | [MD](<P16 Termine/WF-P16 Terminbuchung/Screens/S04 Absagen Verschieben.md>) | - | [Canvas](<P16 Termine/WF-P16 Terminbuchung/WF-P16 Terminbuchung.canvas>) |
| S05 | Buchungen-Liste | WF-P16 Terminbuchung | Liste | Bauen | Validiert | `/bookings` | [MD](<P16 Termine/WF-P16 Terminbuchung/Screens/S05 Buchungen-Liste.md>) | - | [Canvas](<P16 Termine/WF-P16 Terminbuchung/WF-P16 Terminbuchung.canvas>) |
| S06 | Buchungs-Detail (Karteikarte) | WF-P16 Terminbuchung | Detail | Bauen | Validiert | `/bookings/:id` | [MD](<P16 Termine/WF-P16 Terminbuchung/Screens/S06 Buchungs-Detail.md>) | - | [Canvas](<P16 Termine/WF-P16 Terminbuchung/WF-P16 Terminbuchung.canvas>) |
| S07 | Buchungsseiten-Liste | WF-P16 Terminbuchung | Liste | Bauen | Validiert | `/bookings/pages` | [MD](<P16 Termine/WF-P16 Terminbuchung/Screens/S07 Buchungsseiten-Liste.md>) | - | [Canvas](<P16 Termine/WF-P16 Terminbuchung/WF-P16 Terminbuchung.canvas>) |
| S08 | Buchungsseiten-Editor | WF-P16 Terminbuchung | Settings/Form | Bauen | Validiert | `/bookings/pages/:id` + `/new` | [MD](<P16 Termine/WF-P16 Terminbuchung/Screens/S08 Buchungsseiten-Editor.md>) | - | [Canvas](<P16 Termine/WF-P16 Terminbuchung/WF-P16 Terminbuchung.canvas>) |
| S09 | Verfuegbarkeit (Wochen-Zeiten + Ausnahmen) | WF-P16 Terminbuchung | Settings/Form | Bauen | Validiert | `/availability` | [MD](<P16 Termine/WF-P16 Terminbuchung/Screens/S09 Verfuegbarkeit.md>) | - | [Canvas](<P16 Termine/WF-P16 Terminbuchung/WF-P16 Terminbuchung.canvas>) |
| M01 | Verschieben (interner Slot-Picker) | WF-P16 Terminbuchung | Modal | Bauen | Validiert | aus S06 | [MD](<P16 Termine/WF-P16 Terminbuchung/Screens/M01 Verschieben.md>) | - | [Canvas](<P16 Termine/WF-P16 Terminbuchung/WF-P16 Terminbuchung.canvas>) |
| M02 | Stornieren (Grund + Auto-Mail) | WF-P16 Terminbuchung | Modal | Bauen | Validiert | aus S05/S06 (auch Bulk) | [MD](<P16 Termine/WF-P16 Terminbuchung/Screens/M02 Stornieren.md>) | - | [Canvas](<P16 Termine/WF-P16 Terminbuchung/WF-P16 Terminbuchung.canvas>) |
| S01 | Signaturen im Projekt | WF-P16 E-Signatur | Projekt-Sektion | Bauen | Validiert | Projekt-Detail | [MD](<P16 Termine/WF-P16 E-Signatur/Screens/S01 Signaturen im Projekt.md>) | - | [Canvas](<P16 Termine/WF-P16 E-Signatur/WF-P16 E-Signatur.canvas>) |
| S02 | Signatur-Wizard | WF-P16 E-Signatur | Wizard | Bauen | Validiert | aus Projekt-Detail/S01 | [MD](<P16 Termine/WF-P16 E-Signatur/Screens/S02 Signatur-Wizard.md>) | - | [Canvas](<P16 Termine/WF-P16 E-Signatur/WF-P16 E-Signatur.canvas>) |
| S03 | Signatur-Detail & Status | WF-P16 E-Signatur | Detail | Bauen | Validiert | Signatur öffnen | [MD](<P16 Termine/WF-P16 E-Signatur/Screens/S03 Signatur-Detail.md>) | - | [Canvas](<P16 Termine/WF-P16 E-Signatur/WF-P16 E-Signatur.canvas>) |
| S04 | Signieren per Link 🌐 | WF-P16 E-Signatur | BESPOKE-Public | Bauen | Validiert (Delta) | `/sign/:token` | [MD](<P16 Termine/WF-P16 E-Signatur/Screens/S04 Signieren per Link.md>) | - | [Canvas](<P16 Termine/WF-P16 E-Signatur/WF-P16 E-Signatur.canvas>) |
| V01 | Vor Ort unterschreiben 📱 | WF-P16 E-Signatur | BESPOKE-Mobile | Bauen | Validiert | Touch-Modus aus S02 | [MD](<P16 Termine/WF-P16 E-Signatur/Screens/V01 Vor Ort unterschreiben.md>) | - | [Canvas](<P16 Termine/WF-P16 E-Signatur/WF-P16 E-Signatur.canvas>) |
| M01 | Signatur zurueckziehen | WF-P16 E-Signatur | Confirm-Modal | Bauen | Validiert | aus S03 | [MD](<P16 Termine/WF-P16 E-Signatur/Screens/M01 Zurueckziehen.md>) | - | [Canvas](<P16 Termine/WF-P16 E-Signatur/WF-P16 E-Signatur.canvas>) |
| S01 | Chat-Index | WF-P15 Team-Chat | BESPOKE | Bauen | Entwurf | `/chat` | [MD](<P15 Kommunikation/WF-P15 Team-Chat/Screens/S01 Chat-Index.md>) | - | [Canvas](<P15 Kommunikation/WF-P15 Team-Chat/WF-P15 Team-Chat.canvas>) |
| S02 | Channel-Detail | WF-P15 Team-Chat | BESPOKE | Bauen | Entwurf | `/chat/:id` | [MD](<P15 Kommunikation/WF-P15 Team-Chat/Screens/S02 Channel-Detail.md>) | - | [Canvas](<P15 Kommunikation/WF-P15 Team-Chat/WF-P15 Team-Chat.canvas>) |
| S03 | Thread-Detail | WF-P15 Team-Chat | BESPOKE Panel/Route | Bauen | Entwurf | `/chat/:id/thread/:thread_id` | [MD](<P15 Kommunikation/WF-P15 Team-Chat/Screens/S03 Thread-Detail.md>) | - | [Canvas](<P15 Kommunikation/WF-P15 Team-Chat/WF-P15 Team-Chat.canvas>) |
| S04 | Angepinnte Nachrichten | WF-P15 Team-Chat | Liste | Bauen | Entwurf | `/chat/:id/pinned` | [MD](<P15 Kommunikation/WF-P15 Team-Chat/Screens/S04 Angepinnte Nachrichten.md>) | - | [Canvas](<P15 Kommunikation/WF-P15 Team-Chat/WF-P15 Team-Chat.canvas>) |
| S05 | Meine Mentions | WF-P15 Team-Chat | Liste | Bauen | Entwurf | `/chat/mentions` | [MD](<P15 Kommunikation/WF-P15 Team-Chat/Screens/S05 Meine Mentions.md>) | - | [Canvas](<P15 Kommunikation/WF-P15 Team-Chat/WF-P15 Team-Chat.canvas>) |
| S06 | Chat-Suche | WF-P15 Team-Chat | Suche/Liste | Bauen | Entwurf | `/chat/search` | [MD](<P15 Kommunikation/WF-P15 Team-Chat/Screens/S06 Chat-Suche.md>) | - | [Canvas](<P15 Kommunikation/WF-P15 Team-Chat/WF-P15 Team-Chat.canvas>) |
| S07 | Channel-Einstellungen | WF-P15 Team-Chat | Settings | Bauen | Entwurf | `/chat/:id/settings` | [MD](<P15 Kommunikation/WF-P15 Team-Chat/Screens/S07 Channel-Einstellungen.md>) | - | [Canvas](<P15 Kommunikation/WF-P15 Team-Chat/WF-P15 Team-Chat.canvas>) |
| S08 | Admin-Chat-Uebersicht | WF-P15 Team-Chat | Admin Liste/Detail | Bauen | Entwurf | `/admin/chat` | [MD](<P15 Kommunikation/WF-P15 Team-Chat/Screens/S08 Admin-Chat.md>) | - | [Canvas](<P15 Kommunikation/WF-P15 Team-Chat/WF-P15 Team-Chat.canvas>) |
| V01 | Monteur-Handy-Chat 📱 | WF-P15 Team-Chat | BESPOKE-Mobile | Bauen | Entwurf | Variante von S02 | [MD](<P15 Kommunikation/WF-P15 Team-Chat/Screens/V01 Monteur-Handy-Chat.md>) | - | [Canvas](<P15 Kommunikation/WF-P15 Team-Chat/WF-P15 Team-Chat.canvas>) |
| M01 | Neuer Channel / DM | WF-P15 Team-Chat | Modal | Bauen | Entwurf | aus S01/S02 | [MD](<P15 Kommunikation/WF-P15 Team-Chat/Screens/M01 Neuer Channel DM.md>) | - | [Canvas](<P15 Kommunikation/WF-P15 Team-Chat/WF-P15 Team-Chat.canvas>) |
| M02 | DM-Audit-Begruendung | WF-P15 Team-Chat | Modal | Bauen | Entwurf | aus S08 | [MD](<P15 Kommunikation/WF-P15 Team-Chat/Screens/M02 DM-Audit-Begruendung.md>) | - | [Canvas](<P15 Kommunikation/WF-P15 Team-Chat/WF-P15 Team-Chat.canvas>) |
---
@@ -308,9 +341,30 @@ Diese Datei ist der erste Ort, um zu sehen:
| 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 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 | Simple Builder als Hauptfluss | Review | S02 ist der empfohlene Google-Forms-nahe Haupteditor fuer Handwerksbetriebe; S01B und die alten Advanced-Screens wurden aus dem Obsidian-Handoff entfernt. | 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 |
| WF-P16 Kalender | Vollwertiger Kalender | Genommen (Delta) | Termine anlegen/bearbeiten/loeschen statt reiner Lese-Sicht; eigenes Termin-Objekt noetig. | Change-Request an Dev (AK-P16a); validiert 2026-07-09 |
| WF-P16 Kalender | Einladen: Team + Kontakte + freie E-Mails | Genommen (Delta) | Interne sehen Termin im HiveGrid-Kalender, Externe bekommen Mail + .ics; Zu-/Absagen sichtbar. | Teil des CR an Dev |
| WF-P16 Kalender | Kollegen-Overlay (Verfuegbarkeit) | Genommen (Delta) | Andere Kalender einblendbar; fremde private Google-Termine nur als »belegt«. | Teil des CR an Dev |
| WF-P16 Kalender | Verbinden-Einstieg im Kalender | Genommen | Hinweis-Karte solange nichts verbunden, danach Zahnrad -> `/calendar/settings`; kein Admin-Umweg (Verbindung pro Nutzer). | OAuth/Trennen aus WF-P5 wiederverwendet |
| WF-P16 Kalender | Konflikt-Verlauf-Ort | Genommen | Sektion in den Kalender-Einstellungen (letzte 50, Klartext); zusaetzlich Benachrichtigung je Aufloesung. | Muster wie Abgleich-Verlauf WF-P5 |
| WF-P16 Kalender | Outlook-Teaser | Genommen | Provider-Auswahl zeigt Outlook ausgegraut »bald verfuegbar« (v1 nur Google aktiv). | UI bleibt provider-neutral |
| WF-P16 Terminbuchung | Kunden-Strecke als 3 Screens + Handy-Frame | Genommen | Termin waehlen -> Fragen -> Bestaetigung als eigene Frames; Handy-Frame vom Slot-Picker. | Validiert 2026-07-09 |
| WF-P16 Terminbuchung | Self-Service absagen/verschieben per Mail-Link | Genommen (Delta) | »Wie Calendly«: eigene oeffentliche Seite S04, signierter Link, kein Login. | Change-Request an Dev (AK-P16b) |
| WF-P16 Terminbuchung | Buchungs-Detail als eigene Detailseite | Genommen | Karteikarten-Muster (P6): links Termin + Verknuepfungen, rechts Antworten + Notizen. | Validiert 2026-07-09 |
| WF-P16 Terminbuchung | Verfuegbarkeit: jeder selbst + Admin alle | Genommen | Passt zur Pro-Nutzer-Kalender-Verbindung; Admin-Mitarbeiter-Wechsler in S09. | Validiert 2026-07-09 |
| WF-P16 Terminbuchung | Kunden-Fragen mit Feld-Zuordnung zum Lead | Genommen | Im Editor je Feld festlegen, wohin es im Lead-Eingang wandert (nichts abtippen). | Davids Punkt 2026-07-09 |
| WF-P16 Terminbuchung | Fragen-Felder v1 ohne Formular-Baukasten | Genommen | Einfache Feld-Liste im Editor; D-FORM liegt jetzt als Review-Draft vor und wird spaeter ueber eine klare Schnittstelle eingesteckt. | Schnittstelle mit Dev klaeren |
| WF-P16 E-Signatur | Signatur haengt am Projekt-Kern | Genommen | `ProjektSignatureDocument`/`Signer`; kein Deal-Objekt. | Pivot aus AK-P16d |
| WF-P16 E-Signatur | SES-Eigenbau als Default | Genommen | Fern-Link + OTP und Touch vor Ort; PandaDoc nur BYOK-Opt-in, wenn verbunden. | Validiert 2026-07-09 |
| WF-P16 E-Signatur | Kunden-Signierseite als eigener Screen | Genommen (Delta) | S04 `/sign/:token` mit Branding, OTP, PDF-Pruefung, Intent und Signatur. | D-P16 Screen-Luecke geschlossen |
| WF-P16 E-Signatur | Vor-Ort-Signatur als eigener Mobile-Frame | Genommen | Geraet wird dem Kunden uebergeben; keine interne Navigation sichtbar. | Verwandschaft zu WF-P9 Abnahme |
| WF-P15 Team-Chat | Chat als eigener Bespoke-Flow | Entwurf | Real-Time-Verlauf, Composer, Presence, Threads und Reconnect passen nicht in Standard-A2/A3. | Mit David validieren |
| WF-P15 Team-Chat | Thread als eigener Nachweis-Frame | Entwurf | Umsetzung spaeter als Side-Panel oder Route moeglich; Planung braucht einen Frame. | Mit David validieren |
| WF-P15 Team-Chat | Projekt-Channels entity-linked | Entwurf | Projektmitglieder werden synchronisiert; Einstieg im Projekt-Detail, View bleibt S02. | Schnittstelle zu P8/P9 klaeren |
| WF-P15 Team-Chat | Admin-DM-Audit mit Begruendung | Entwurf | DM-Einsicht nur ueber M02, Banner im geoeffneten DM, Audit-Log. | AK-P15b Vorgabe; mit David validieren |
| WF-P15 Team-Chat | Monteur-Handy-Frame | Entwurf | Vereinfachte mobile View mit Foto-Direktupload, Push/Offline-Hinweis. | Mit David validieren |
---
@@ -337,6 +391,17 @@ Diese Liste sammelt Punkte, die in einzelnen Paketen als `Backlog`, `Spaeter` od
| WF-P2 Konto/Workspace loeschen | Voller DSGVO-/Export-Wizard | Backlog | Datenexport-Step, Reauth, Confirm Phrase, Countdown und Legal/Billing-Details spaeter |
| WF-P2 Workspace Settings | Workspace-Settings ausbauen | Backlog | Voraussetzung fuer Konto-/Workspace-Loeschflows; Bereich ist noch nicht gebaut |
| WF-P2 Admin RBAC | V2-Backlog | Dokumentiert | Reassign, Rollen-Loeschen mit Ersatzrolle, Gruppen, Rechtekatalog, Rollen-Audit, Rollen-Review, Templates, Rechte-Matrix, Bulk-Aktionen, erweiterter Admin-Schutz |
| WF-P16 Kalender | Outlook-Sync | Backlog (v2) | Interface bleibt provider-agnostisch; in der UI als Teaser sichtbar |
| WF-P16 Kalender | Termin-Erinnerungen (Push/Mail) | Backlog/Klaeren | Mit Benachrichtigungen (P3) klaeren; v2-Kandidat |
| WF-P16 Kalender | Tages-Ansicht | Backlog/Klaeren | Zusaetzlich zu Monat/Woche? Beim Subframe-Bau entscheiden |
| WF-P16 Terminbuchung | Wunsch-Mitarbeiter / Round-Robin | Backlog (v2) | v1 nur »erster freier Mitarbeiter«; Kunde waehlt keinen Mitarbeiter |
| WF-P16 Terminbuchung | Personalisierte Buchungslinks | Backlog (v2) | v1 nur URL + QR + iFrame |
| WF-P16 E-Signatur | Freier PDF-Feldplatzierer | Backlog (v2) | v1 nutzt standardisierte Signatur-/Certificate-Platzierung; kein PDF-Tagger |
| WF-P16 E-Signatur | QES/D-Trust | Backlog (v2) | v1 SES reicht fuer SHK; QES nur spaeter fuer Sonderfaelle |
| WF-P16 E-Signatur | Automatische Reminder-Regeln | Backlog/Klaeren | v1 manuelle Erinnerung; spaeter mit Benachrichtigungen/Automationen klaeren |
| WF-P15 Team-Chat | WhatsApp / Unified Inbox | Backlog (v2) | Team-Chat ist intern; externe Kundenkommunikation bleibt ausserhalb v1 |
| WF-P15 Team-Chat | HalloPetra / KI-Chat | Backlog (v2) | Nicht Teil von D-CHAT; Hilfe-Chat/Telefonassistent sind eigene Themen |
| WF-P15 Team-Chat | Voller Read-Receipt-Detaildialog | Backlog/Klaeren | v1 zeigt »X von Y gelesen«; Detail-Liste nur bei Bedarf |
---
05 HiveGrid Map/HiveGrid Map.canvas
+41 -36
View File
@@ -2,57 +2,53 @@
"nodes":[
{"id":"904c5ece127e2e4c","type":"group","x":5497,"y":3020,"width":1540,"height":1400,"label":"VERWALTUNG (WORKSPACE-EINSTELLUNGEN)"},
{"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":740,"label":"TERMINE & FORMULARE"},
{"id":"77c19412215a977c","type":"group","x":5037,"y":960,"width":2260,"height":740,"color":"2","label":"AUFTRAG & BAUSTELLE"},
{"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"},
{"id":"db7d9db3cd7939b0","type":"group","x":3997,"y":0,"width":1040,"height":740,"label":"SUCHE & DASHBOARD"},
{"id":"c3172228336521df","type":"group","x":7197,"y":3020,"width":540,"height":1400,"label":"PLATTFORM-ADMIN — unsere interne Verwaltung"},
{"id":"00d6b92d3845c185","type":"group","x":1160,"y":2080,"width":1190,"height":520,"label":"E-MAIL-MARKETING"},
{"id":"41b8d85d3bb8d47d","type":"group","x":-160,"y":0,"width":1850,"height":740,"color":"6","label":"BASIS — gilt für alle Features"},
{"id":"db7d9db3cd7939b0","type":"group","x":3997,"y":0,"width":1040,"height":740,"label":"SUCHE & DASHBOARD"},
{"id":"c3172228336521df","type":"group","x":7297,"y":3020,"width":540,"height":1400,"label":"PLATTFORM-ADMIN — unsere interne Verwaltung"},
{"id":"7a26f88c260892eb","type":"group","x":1950,"y":0,"width":557,"height":740,"color":"3","label":"WEBSITE 🌐"},
{"id":"2025c7621bb63c98","type":"group","x":2737,"y":0,"width":540,"height":740,"color":"4","label":"LOGIN & ZUGÄNGE"},
{"id":"3c6e5b1ea4a27913","type":"group","x":7977,"y":3020,"width":540,"height":740,"label":"HR (MITARBEITER)"},
{"id":"d9868dadb782f253","type":"text","text":"## Kontakte & Organisationen\n**Ticket:** `D-CRM` · **Status:** 🟡 vorgeplant (Screens validiert, Subframe offen)\n**Wo:** `/contacts`\n\n**Was drin ist:** Kontakt-Liste, Organisations-Liste, Kontakt-Detailseite (die Vorlage für ALLE Detailseiten), eigene Felder, Tags, Duplikate zusammenführen\n\n**So funktioniert's:** Ein Kontakt ist Privatperson oder Organisation und hat einen Status (Kontakt → Kunde → Bestandskunde). Auf der Detailseite sieht man alles: Projekte, Mails, Anrufe, Aufgaben, Dateien, Notizen.","x":3077,"y":1040,"width":460,"height":360,"color":"5"},
{"id":"a-kontakte-pkg","type":"file","file":"02 Wireframes/P6 Kontakte/WF-P6 Kontakte und Organisationen/WF-P6 Kontakte und Organisationen.canvas","x":3077,"y":1440,"width":460,"height":220},
{"id":"e10a35560a461111","type":"text","text":"## Kanban-Board & Pipelines (Projekte)\n**Ticket:** `D-P8` + `D-KANBAN` · **Status:** 🟡 vorgeplant (Screens validiert, Subframe offen)\n**Wo:** `/projects` + Admin\n\n**Was drin ist:** Kanban-Board mit Spalten je Status (Karten ziehen = Status wechseln), Projekt-Liste, Projekt-Detailseite, Pipeline-Einstellungen (Spalten, Rechte, Pflichtfelder), Verlust-Gründe\n\n**So funktioniert's:** Ein Projekt wandert durch Boards — »Vertrieb« und »Auftrag« sind nur zwei Boards für denselben Datensatz. Gewonnen = wechselt aufs Auftrags-Board. Wer welche Felder sieht (z. B. Umsatz), ist einstellbar.","x":4037,"y":1040,"width":460,"height":360,"color":"2"},
{"id":"a-pipelines-pkg","type":"file","file":"02 Wireframes/P8 Pipelines/WF-P8 Pipelines/WF-P8 Pipelines.canvas","x":4037,"y":1440,"width":460,"height":220},
{"id":"3c6e5b1ea4a27913","type":"group","x":7297,"y":2080,"width":540,"height":740,"label":"HR (MITARBEITER)"},
{"id":"8272764aa65537b0","type":"text","text":"## Lead-Eingang (Anfragen)\n**Ticket:** `D-P7` · **Status:** 🟡 vorgeplant (Screens validiert, Subframe offen)\n**Wo:** `/leads`\n\n**Was drin ist:** Eingangs-Liste aller Anfragen (mit Quelle, Spam-Verdacht, Duplikat-Hinweis), Anfrage-Detail, »Zu Projekt machen«, Statistiken, Quellen-Verwaltung, Spam-Schutz-Einstellungen\n\n**So funktioniert's:** Alle Anfragen (Website, Formulare, Anrufe, Buchungen) landen hier. Wer sie bearbeiten darf (Freigabe = ja), macht daraus ein Projekt und hängt den Kontakt dran.","x":2007,"y":1040,"width":460,"height":360,"color":"5"},
{"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":"d9868dadb782f253","type":"text","text":"## Kontakte & Organisationen\n**Ticket:** `D-CRM` · **Status:** 🟡 vorgeplant (Screens validiert, Subframe offen)\n**Wo:** `/contacts`\n\n**Was drin ist:** Kontakt-Liste, Organisations-Liste, Kontakt-Detailseite (die Vorlage für ALLE Detailseiten), eigene Felder, Tags, Duplikate zusammenführen\n\n**So funktioniert's:** Ein Kontakt ist Privatperson oder Organisation und hat einen Status (Kontakt → Kunde → Bestandskunde). Auf der Detailseite sieht man alles: Projekte, Mails, Anrufe, Aufgaben, Dateien, Notizen.","x":3077,"y":1040,"width":460,"height":360,"color":"5"},
{"id":"a-kontakte-pkg","type":"file","file":"02 Wireframes/P6 Kontakte/WF-P6 Kontakte und Organisationen/WF-P6 Kontakte und Organisationen.canvas","x":3077,"y":1440,"width":460,"height":220},
{"id":"77ebfde5a3a05b8a","type":"text","text":"## Online-Terminbuchung 🌐\n**Ticket:** `D-BOOK` + `D-P16` (Teil) · **Status:** 🟡 vorgeplant (Screens validiert, Subframe 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 (Fragen mit Feld-Zuordnung zum Lead), Verfügbarkeits-Zeiten — Davids Delta: Kunde kann per Mail-Link selbst absagen/verschieben\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":"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},
{"id":"ab16fe58ff28c0ac","type":"text","text":"## Kampagnen & Empfängerlisten\n**Ticket:** `D-KAMP` · **Status:** ⬜ offen\n**Wo:** `/email-marketing`\n\n**Was drin ist:** Kampagne erstellen in 6 Schritten (Absender → Inhalt → Empfänger → Test-Mail → Zeitpunkt → Check) · Empfängerlisten (Segmente) mit Filtern bauen\n\n**So funktioniert's:** Vor dem Versand prüft eine Checkliste alles Rechtliche (Domain bestätigt? Abmelde-Link? Impressum?) — bei Rot wird nicht gesendet.","x":1200,"y":2160,"width":460,"height":360,"color":"2"},
{"id":"401d8270854bebac","type":"text","text":"## Team-Chat 📱\n**Ticket:** `D-CHAT` · **Status:** ⬜ offen\n**Wo:** `/chat`\n\n**Was drin ist:** Channel-Liste, Chat-Verlauf (Antwort-Threads, Emoji-Reaktionen, gelesen-von, Anhänge), Erwähnungen mit @, angepinnte Nachrichten, Suche, Direktnachrichten\n\n**So funktioniert's:** Jedes Projekt kann seinen eigenen Channel haben (Team wird automatisch synchron gehalten). Monteure: vereinfachte Handy-Ansicht mit Foto-Direktupload. Admin kann DMs nur mit Begründung einsehen.","x":5077,"y":2160,"width":460,"height":360,"color":"2"},
{"id":"4bb807ef5e3c8dee","type":"text","text":"## Projekt-Akte (Auftrag) 📱\n**Ticket:** `D-P9` · **Status:** 🟡 vorgeplant (Screens validiert, Subframe offen)\n**Wo:** im Projekt-Detail\n\n**Was drin ist:** Reiter am Projekt: Team-Mitglieder, Termine, **Rechnungen (neu in v1)**, Checklisten & Mängel, Aufgaben, Dateien, Abnahmen · dazu Projekt-Vorlagen und Abnahme-Formular-Vorlagen\n\n**So funktioniert's:** Alles zum Auftrag an einem Ort. Am Handy reduziert: Stammdaten, heutige Aufgaben, Abnahme-Knopf, Foto direkt hochladen.","x":5077,"y":1040,"width":460,"height":360,"color":"2"},
{"id":"28bd46ecb4eaa069","type":"text","text":"## Kalender\n**Ticket:** `D-BOOK` + `D-P16` (Teil) · **Status:** 🟡 vorgeplant (Screens validiert, Subframe 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 — Davids Delta: Termine anlegen + einladen (Team/Kontakte/freie E-Mails), Kollegen-Overlay\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":"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},
{"id":"d48196ed3e229be5","type":"text","text":"**Standards:** `04 Standards/Subframe UI Standards/` — validierte Layout-Regeln","x":690,"y":480,"width":460,"height":220},
{"id":"e10a35560a461111","type":"text","text":"## Kanban-Board & Pipelines (Projekte)\n**Ticket:** `D-P8` + `D-KANBAN` · **Status:** 🟡 vorgeplant (Screens validiert, Subframe offen)\n**Wo:** `/projects` + Admin\n\n**Was drin ist:** Kanban-Board mit Spalten je Status (Karten ziehen = Status wechseln), Projekt-Liste, Projekt-Detailseite, Pipeline-Einstellungen (Spalten, Rechte, Pflichtfelder), Verlust-Gründe\n\n**So funktioniert's:** Ein Projekt wandert durch Boards — »Vertrieb« und »Auftrag« sind nur zwei Boards für denselben Datensatz. Gewonnen = wechselt aufs Auftrags-Board. Wer welche Felder sieht (z. B. Umsatz), ist einstellbar.","x":4037,"y":1040,"width":460,"height":360,"color":"2"},
{"id":"a-pipelines-pkg","type":"file","file":"02 Wireframes/P8 Pipelines/WF-P8 Pipelines/WF-P8 Pipelines.canvas","x":4037,"y":1440,"width":460,"height":220},
{"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":"a-kalender-pkg","type":"file","file":"02 Wireframes/P16 Termine/WF-P16 Kalender/WF-P16 Kalender.canvas","x":3837,"y":2560,"width":460,"height":220},
{"id":"a-buchung-pkg","type":"file","file":"02 Wireframes/P16 Termine/WF-P16 Terminbuchung/WF-P16 Terminbuchung.canvas","x":3067,"y":2560,"width":460,"height":220},
{"id":"b789fc765f833f45","type":"text","text":"## Digital unterschreiben (E-Signatur)\n**Ticket:** `D-P16` (Teil) · **Status:** 🟡 vorgeplant (Screens validiert, Subframe offen)\n**Wo:** im Projekt-Detail\n\n**Was drin ist:** PDF aus Projekt-Dateien wählen/hochladen → Unterzeichner + Reihenfolge → Kunde unterschreibt per Link mit Code oder direkt vor Ort → Status je Unterzeichner, Erinnerung, Zurückziehen, Downloads\n\n**So funktioniert's:** Hängt direkt am Projekt (»Zur Signatur senden«). SES-Eigenbau ist Default; PandaDoc nur optional BYOK. Davids Delta: eigene Kunden-Signierseite als Frame.","x":4337,"y":2160,"width":460,"height":360,"color":"5"},
{"id":"3e27875daca5713d","type":"text","text":"## Login, Registrierung & Workspace\n**Ticket:** `D-P2` · **Status:** ✅ validiert / in Subframe\n**Wo:** Login-Seiten + Einstellungen\n\n**Was drin ist:** Registrierung, Login + 2FA, Passwort vergessen/ändern, Workspace-Auswahl + neuer Workspace, Profil & Sicherheit, Mitarbeiter & Rollen (Admin)\n\n**Stand:** 9 Wireframe-Pakete fertig gebaut. Konto/Workspace löschen bewusst geparkt. → `02 Wireframes/P2 Auth/`","x":2777,"y":80,"width":460,"height":360,"color":"4"},
{"id":"89c0813f7e139a88","type":"text","text":"## Dashboard (Startseite)\n**Ticket:** `D-DASH` (Teil) · **Status:** ⬜ offen\n**Wo:** `/dashboard`\n\n**Was drin ist:** 3 feste Ansichten je Rolle: Chef (Umsatz, Projekte, Auslastung) · Büro (Projekte, Aufgaben, Anrufe) · Monteur 📱 (meine Termine, Projekte, Aufgaben)\n\n**So funktioniert's:** Kacheln mit Zahlen, Listen und Trend-Charts, live aktualisiert. Kein freies Umbauen in v1 — nur Filter/Zeitraum einstellbar.","x":4037,"y":80,"width":460,"height":360,"color":"2"},
{"id":"4a4e5be847a54e5f","type":"text","text":"## Suche (Cmd+K)\n**Ticket:** `D-DASH` (Teil) · **Status:** ⬜ offen\n**Wo:** überall + `/search`\n\n**Was drin ist:** Such-Fenster per Tastenkürzel: tippen, Treffer nach Typ gruppiert, mit Pfeiltasten navigieren · dazu große Such-Seite mit Filtern\n\n**So funktioniert's:** Findet Kontakte, Projekte, Dateien usw. — zeigt nur, was man sehen darf.","x":4537,"y":80,"width":460,"height":360,"color":"1"},
{"id":"ce5632682989a6ca","type":"text","text":"## Website (Landing & Demo-Anfrage)\n**Ticket:** `D-WEB` · **Status:** ⬜ offen\n**Wo:** 🌐 hivegrid.de\n\n**Was drin ist:** Startseite, Features-Seite, Preise-Teaser, Demo-Anfrage-Formular\n\n**Warum wichtig:** Der erste Eindruck nach außen. Farben/Schriften sind dieselben wie in der App. Demo-Anfragen landen im Lead-Eingang.","x":2007,"y":80,"width":460,"height":360,"color":"2"},
{"id":"c02969250252a3ab","type":"text","text":"## Feinschliff vor Launch\n**Ticket:** `D-POLISH` · **Status:** ⬜ offen\n**Wo:** 🌐 alles öffentlich Sichtbare\n\n**Was drin ist:** Letzter Polier-Durchgang: Terminbuchungs-Seite, öffentliche Formulare, Marketing-Mails · danach Screenshots als »So muss es aussehen«-Referenz einfrieren\n\n**Warum wichtig:** Kommt ganz am Ende, direkt vor dem Launch. Braucht Terminbuchung + Dashboard fertig.","x":1190,"y":80,"width":460,"height":360,"color":"3"},
{"id":"d48196ed3e229be5","type":"text","text":"**Standards:** `04 Standards/Subframe UI Standards/` — validierte Layout-Regeln","x":690,"y":480,"width":460,"height":220},
{"id":"d53e7ea48a9b1e6c","type":"text","text":"## UI-Baukasten (Listen, Formulare, Modals …)\n**Ticket:** `D-D0b` · **Status:** ✅ validiert\n**Wo:** überall in der App\n\n**Was drin ist:** Fertige Bausteine: Listen mit Filter, Detail-Seiten, Formular-Felder (12 Typen), Dialoge/Wizards, Settings-Seiten, Leer-/Lade-/Fehler-Zustände + Kleinteile (Buttons, Tags, Charts, Unterschriften-Feld …)\n\n**Warum wichtig:** Einmal designen, überall wiederverwenden. Layout-Standards liegen in `04 Standards`. ✅ Bereits erledigt.","x":690,"y":80,"width":460,"height":360,"color":"4"},
{"id":"b3cad562971d30a5","type":"text","text":"## App-Gerüst (Sidebar, Topbar & Design)\n**Ticket:** `D-D0a` · **Status:** ✅ gebaut (David, in Subframe)\n**Wo:** überall in der App\n\n**Was drin ist:** Sidebar (Module ein-/ausblendbar je Abo, Handy-Variante 📱), Topbar (Workspace-Wechsler, Suche, Glocke, Profil-Menü), Breadcrumb, Warn-Banner (z. B. »Zahlung offen«), Erfolgs-/Fehlermeldungen\n\n**Stand:** Bereits gebaut und validiert. Der Rahmen, in dem jedes Feature steckt — inkl. Farben, Schriften, Hell/Dunkel.","x":-100,"y":80,"width":460,"height":360,"color":"4"},
{"id":"a-signatur-pkg","type":"file","file":"02 Wireframes/P16 Termine/WF-P16 E-Signatur/WF-P16 E-Signatur.canvas","x":4337,"y":2560,"width":460,"height":220},
{"id":"e21930b7073823f8","type":"text","text":"## Aufgaben\n**Ticket:** `D-P4` (Teil) · **Status:** 🟡 vorgeplant (Screens validiert, Subframe offen)\n**Wo:** `/tasks` + überall als Reiter\n\n**Was drin ist:** Aufgaben-Liste (Meine / von mir erstellt / Alle), Aufgabe mit Frist, Priorität, Zuständigem (Person oder Gruppe), Beobachtern und Verknüpfung (Kontakt/Projekt/…)\n\n**So funktioniert's:** Einmal gebaut, überall eingebettet — jede Detailseite hat einen Aufgaben-Reiter. Aufgaben können auch aus Chat, Formularen oder Automationen entstehen (Herkunft sichtbar). Erinnerung vor/nach Frist.","x":800,"y":3100,"width":460,"height":360,"color":"5"},
{"id":"036e2a807223753d","type":"text","text":"## Dateien\n**Ticket:** `D-P4` (Teil) · **Status:** 🟡 vorgeplant (Screens validiert, Subframe offen)\n**Wo:** `/files` + überall als Reiter\n\n**Was drin ist:** Datei-Übersicht (Tabelle oder Kacheln, Filter, Mehrfach-Aktionen inkl. ZIP), Upload per Drag&Drop (mehrere gleichzeitig, mit Fortschritt), Datei-Detail mit Vorschau\n\n**So funktioniert's:** Dateien hängen an Kontakten/Projekten/… mit Rolle (z. B. »Angebot«). iPhone-Fotos (HEIC) werden automatisch zu JPG. Versionen kommen in v2.","x":1450,"y":3100,"width":460,"height":360,"color":"5"},
{"id":"8f3127f03a5bab96","type":"text","text":"## Automations-Baukasten (Flow-Editor)\n**Ticket:** `D-FLOW` · **Status:** 🟡 vorgeplant (Screens validiert, Subframe offen)\n**Wo:** `/automations/:id/edit`\n\n**Was drin ist:** Zeichenfläche mit Bausteinen: Auslöser (neue Anfrage, Formular abgeschickt, Zeitplan …) und Aktionen (Aufgabe anlegen, Mail senden, Wenn-Dann, Warten …) per Ziehen verbinden\n\n**So funktioniert's:** Alles in verständlichem Deutsch beschriftet. Vor dem Aktivieren zeigt eine Probe-Vorschau »trifft X Datensätze« — erst bestätigen, dann läuft's. Warnt vor Endlos-Schleifen. **Aufwendigste UI der ganzen App.**","x":2150,"y":3100,"width":460,"height":360,"color":"1"},
{"id":"e6d8c36a0f89d954","type":"text","text":"## Automationen: Übersicht & Verläufe\n**Ticket:** `D-P12` · **Status:** 🟡 vorgeplant (Screens validiert, Subframe offen)\n**Wo:** `/automations`\n\n**Was drin ist:** Liste aller Automationen (aktiv/pausiert/Entwurf), Lauf-Protokolle Schritt für Schritt in Klartext, Vorlagen-Katalog (SHK-Vorlagen + eigene)\n\n**So funktioniert's:** Jeder Lauf ist nachvollziehbar; 24 h lang rückgängig machbar (Countdown-Knopf), fehlgeschlagene Schritte neu anstoßen.","x":3067,"y":3100,"width":460,"height":360,"color":"2"},
{"id":"401d8270854bebac","type":"text","text":"## Team-Chat 📱\n**Ticket:** `D-CHAT` · **Status:** ⬜ offen (Entwurf angelegt, nicht validiert)\n**Wo:** `/chat`\n\n**Entwurf enthält:** Channel-Liste, Chat-Verlauf mit Threads/Reactions/Anhängen/Read-Receipts, Composer mit @Mentions, Pins, Mentions-Aggregat, Suche, Channel-Settings, Admin-Audit, Monteur-Handy-Frame\n\n**Noch zu klären:** Paket-Schnitt gemeinsam mit David validieren. Projekt-Channel, Admin-DM-Audit und Mobile-Frame sind Vorschläge, nicht final entschieden.","x":5077,"y":2160,"width":460,"height":360,"color":"2"},
{"id":"4bb807ef5e3c8dee","type":"text","text":"## Projekt-Akte (Auftrag) 📱\n**Ticket:** `D-P9` · **Status:** 🟡 vorgeplant (Screens validiert, Subframe offen)\n**Wo:** im Projekt-Detail\n\n**Was drin ist:** Reiter am Projekt: Team-Mitglieder, Termine, **Rechnungen (neu in v1)**, Checklisten & Mängel, Aufgaben, Dateien, Abnahmen · dazu Projekt-Vorlagen und Abnahme-Formular-Vorlagen\n\n**So funktioniert's:** Alles zum Auftrag an einem Ort. Am Handy reduziert: Stammdaten, heutige Aufgaben, Abnahme-Knopf, Foto direkt hochladen.","x":5077,"y":1040,"width":460,"height":360,"color":"2"},
{"id":"a-akte-pkg","type":"file","file":"02 Wireframes/P9 Auftrag/WF-P9 Projekt-Akte/WF-P9 Projekt-Akte.canvas","x":5077,"y":1440,"width":460,"height":220},
{"id":"a-chat-pkg","type":"file","file":"02 Wireframes/P15 Kommunikation/WF-P15 Team-Chat/WF-P15 Team-Chat.canvas","x":5077,"y":2560,"width":460,"height":220},
{"id":"5c72e7b04059503a","type":"text","text":"## Integrationen (Apps verbinden)\n**Ticket:** `D-P5` · **Status:** 🟡 vorgeplant (Screens validiert, Subframe offen)\n**Wo:** `/admin/integrations`\n\n**Was drin ist:** App-Katalog (nach Kategorie, mit Status-Ampel), Verbindung einrichten per Schritt-für-Schritt-Assistent, Verbindungs-Zustand + Sync-Verlauf in Klartext\n\n**So funktioniert's:** Das gemeinsame Gerüst für alle Anbindungen — E-Mail, Telefonie, Kalender, Signatur nutzen alle dieselben Verbindungs-Karten.","x":5537,"y":3100,"width":460,"height":360,"color":"5"},
{"id":"29ca06733a9b243b","type":"text","text":"## Telefonie (Anrufe)\n**Ticket:** `D-P15` · **Status:** ⬜ offen\n**Wo:** `/calls` + Einstellungen\n\n**Was drin ist:** AirCall verbinden (Telefon-Nutzer zuordnen), Anruf-Liste + Detail (Notiz, Aufnahme), Anruf-Knopf direkt an Kontakt/Anfrage/Projekt\n\n**So funktioniert's:** Anrufe werden automatisch dem richtigen Kontakt zugeordnet. Unbekannte Nummer ruft an → wird automatisch eine Anfrage im Lead-Eingang.","x":5577,"y":2160,"width":460,"height":360,"color":"5"},
{"id":"3f83fa1a16ae69df","type":"text","text":"## Plantafel (Einsatzplanung) 📱\n**Ticket:** `D-PLAN` · **Status:** 🟡 vorgeplant (Screens validiert, Subframe offen)\n**Wo:** `/projects/plantafel`\n\n**Was drin ist:** Planungs-Raster: Zeilen = Mitarbeiter, Spalten = Zeit. Einsätze per Ziehen verschieben/verlängern, Klick auf freien Slot = neuer Einsatz\n\n**So funktioniert's:** Warnt bei Konflikten (doppelt verplant, Urlaub/krank, außerhalb Arbeitszeit) — zuweisen geht trotzdem. Monteure sehen am Handy »Meine Termine heute« mit Adresse + Navi, auch offline.","x":5897,"y":1040,"width":460,"height":360,"color":"1"},
{"id":"0f6acf7087283c0c","type":"text","text":"## Aktivitäts-Protokoll (Audit-Log)\n**Ticket:** `D-P3` (Teil) · **Status:** 🟡 vorgeplant (Screens validiert, Subframe offen)\n**Wo:** `/admin/audit`\n\n**Was drin ist:** Wer hat wann was geändert — als deutscher Klartext-Satz, mit Filter und Vorher/Nachher-Vergleich, Export mit Zweck-Angabe\n\n**So funktioniert's:** Der gleiche Verlauf ist auch an jedem Datensatz einblendbar (»Verlauf dieses Objekts«). Unterscheidet Mensch / Automation / Agent / Admin.","x":6037,"y":3100,"width":460,"height":360,"color":"5"},
{"id":"50945ed6e43505ce","type":"text","text":"## Benachrichtigungen\n**Ticket:** `D-P3` (Teil) · **Status:** 🟡 vorgeplant (Screens validiert, Subframe offen)\n**Wo:** Glocke oben + Einstellungen\n\n**Was drin ist:** Glocke mit Ungelesen-Zähler + aufklappbare Liste (Klick springt zur Sache), eigene Seite mit allen Meldungen, Einstellungen: pro Ereignis-Typ wählen ob In-App und/oder E-Mail\n\n**So funktioniert's:** Wird von allen Features gespeist (neue Anfrage, Aufgabe fällig, Antrag genehmigt …). Master-Schalter »alle E-Mails aus«.","x":6077,"y":2160,"width":460,"height":360,"color":"5"},
{"id":"43a26561f03f72da","type":"file","file":"02 Wireframes/P3 Querschnitt/WF-P3 Benachrichtigungen/WF-P3 Benachrichtigungen.canvas","x":6077,"y":2560,"width":460,"height":220},
{"id":"a1328943a7cef3b2","type":"file","file":"02 Wireframes/P4 Aufgaben und Dateien/WF-P4 Dateien/WF-P4 Dateien.canvas","x":1450,"y":3500,"width":460,"height":220},
{"id":"98798c9044c1d4bc","type":"file","file":"02 Wireframes/P4 Aufgaben und Dateien/WF-P4 Aufgaben/WF-P4 Aufgaben.canvas","x":800,"y":3500,"width":460,"height":220},
{"id":"a-integrationen-pkg","type":"file","file":"02 Wireframes/P5 Integrationen/WF-P5 Integrationen/WF-P5 Integrationen.canvas","x":5537,"y":3500,"width":460,"height":220},
{"id":"3864f1b74d665e1a","type":"file","file":"02 Wireframes/P3 Querschnitt/WF-P3 Audit Log/WF-P3 Audit Log.canvas","x":6037,"y":3500,"width":460,"height":220},
{"id":"6b3c0929759a607b","type":"text","text":"## Abo & Rechnungen (für HiveGrid)\n**Ticket:** `D-P20` (Teil) · **Status:** ⚠️ Ticket braucht Recut\n**Wo:** `/admin/subscription`\n\n**Was drin ist:** Abo-Übersicht (Plan, Plätze, gebuchte Module, Test-Countdown), Verbrauchs-Balken (Automations-Läufe, Speicher), Rechnungen + Zahlungsstatus\n\n**Achtung:** Das Ticket wird gerade umgeschnitten (neuer Abrechnungs-Unterbau) — erst planen, wenn der Brief neu steht. Kein Selbst-Upgrade in v1.","x":6537,"y":3100,"width":460,"height":360,"color":"5"},
{"id":"b3cad562971d30a5","type":"text","text":"## App-Gerüst (Sidebar, Topbar & Design)\n**Ticket:** `D-D0a` · **Status:** ✅ gebaut (David, in Subframe)\n**Wo:** überall in der App\n\n**Was drin ist:** Sidebar (Module ein-/ausblendbar je Abo, Handy-Variante 📱), Topbar (Workspace-Wechsler, Suche, Glocke, Profil-Menü), Breadcrumb, Warn-Banner (z. B. »Zahlung offen«), Erfolgs-/Fehlermeldungen\n\n**Stand:** Bereits gebaut und validiert. Der Rahmen, in dem jedes Feature steckt — inkl. Farben, Schriften, Hell/Dunkel.","x":-100,"y":80,"width":460,"height":360,"color":"4"},
{"id":"d5d3db1765287eef","type":"text","text":"# 🗺 HiveGrid Feature Map (v1)\nJede Karte = **ein Feature**. Das Ticket steht nur als Referenz dran. Übergreifende Sachen (App-Gerüst, UI-Baukasten, Feinschliff) liegen unter **Basis**.\n\n**Farben:**\n🟢 fertig/validiert · 🔴 Sonder-UI, wird von Hand designt (Tage) · 🔵 wird aus dem UI-Baukasten zusammengesteckt (Stunden) · 🟠 Mischung aus beidem · 🟣 Basis · 🟡 Feinschliff\n\n**Marker:** 🌐 öffentlich sichtbar (höchster Anspruch) · 📱 Monteur-Handy, teils offline\n\n**Unter jeder Karte:** Slot für die verknüpften Paket-Canvases (Detail-Flows aus `02 Wireframes`) — Karte anklicken öffnet den Flow.\n\n**Pfeile:** orange = Hauptkette (Anfrage → Auftrag → Geld) · grau = klare Querverbindung. Gilt etwas für **alle** Features (Automationen, Aufgaben/Dateien, Benachrichtigungen, Verbindungs-Gerüst), steht es als Text auf der Karte statt als Pfeil.\n\nAbhaklisten & Details: [[HiveGrid Map]]","x":-163,"y":-600,"width":1140,"height":380},
{
"id":"a4f86f7bfc24194b",
@@ -64,19 +60,27 @@
"width":820,
"height":420
},
{"id":"md-hivegrid-map","type":"file","file":"05 HiveGrid Map/HiveGrid Map.md","x":-683,"y":-600,"width":460,"height":300},
{"id":"3f83fa1a16ae69df","type":"text","text":"## Plantafel (Einsatzplanung) 📱\n**Ticket:** `D-PLAN` · **Status:** 🟡 vorgeplant (Screens validiert, Subframe offen)\n**Wo:** `/projects/plantafel`\n\n**Was drin ist:** Planungs-Raster: Zeilen = Mitarbeiter, Spalten = Zeit. Einsätze per Ziehen verschieben/verlängern, Klick auf freien Slot = neuer Einsatz\n\n**So funktioniert's:** Warnt bei Konflikten (doppelt verplant, Urlaub/krank, außerhalb Arbeitszeit) — zuweisen geht trotzdem. Monteure sehen am Handy »Meine Termine heute« mit Adresse + Navi, auch offline.","x":5897,"y":1040,"width":460,"height":360,"color":"1"},
{"id":"a1328943a7cef3b2","type":"file","file":"02 Wireframes/P4 Aufgaben und Dateien/WF-P4 Dateien/WF-P4 Dateien.canvas","x":1450,"y":3500,"width":460,"height":220},
{"id":"98798c9044c1d4bc","type":"file","file":"02 Wireframes/P4 Aufgaben und Dateien/WF-P4 Aufgaben/WF-P4 Aufgaben.canvas","x":800,"y":3500,"width":460,"height":220},
{"id":"a-integrationen-pkg","type":"file","file":"02 Wireframes/P5 Integrationen/WF-P5 Integrationen/WF-P5 Integrationen.canvas","x":5537,"y":3500,"width":460,"height":220},
{"id":"a-plantafel-pkg","type":"file","file":"02 Wireframes/P9 Auftrag/WF-P9 Plantafel/WF-P9 Plantafel.canvas","x":5897,"y":1440,"width":460,"height":220},
{"id":"a-flow-pkg","type":"file","file":"02 Wireframes/P12 Automationen/WF-P12 Flow-Editor/WF-P12 Flow-Editor.canvas","x":2150,"y":3500,"width":460,"height":220},
{"id":"a-autoverw-pkg","type":"file","file":"02 Wireframes/P12 Automationen/WF-P12 Verwaltung/WF-P12 Verwaltung.canvas","x":3067,"y":3500,"width":460,"height":220},
{"id":"0f6acf7087283c0c","type":"text","text":"## Aktivitäts-Protokoll (Audit-Log)\n**Ticket:** `D-P3` (Teil) · **Status:** 🟡 vorgeplant (Screens validiert, Subframe offen)\n**Wo:** `/admin/audit`\n\n**Was drin ist:** Wer hat wann was geändert — als deutscher Klartext-Satz, mit Filter und Vorher/Nachher-Vergleich, Export mit Zweck-Angabe\n\n**So funktioniert's:** Der gleiche Verlauf ist auch an jedem Datensatz einblendbar (»Verlauf dieses Objekts«). Unterscheidet Mensch / Automation / Agent / Admin.","x":6037,"y":3100,"width":460,"height":360,"color":"5"},
{"id":"50945ed6e43505ce","type":"text","text":"## Benachrichtigungen\n**Ticket:** `D-P3` (Teil) · **Status:** 🟡 vorgeplant (Screens validiert, Subframe offen)\n**Wo:** Glocke oben + Einstellungen\n\n**Was drin ist:** Glocke mit Ungelesen-Zähler + aufklappbare Liste (Klick springt zur Sache), eigene Seite mit allen Meldungen, Einstellungen: pro Ereignis-Typ wählen ob In-App und/oder E-Mail\n\n**So funktioniert's:** Wird von allen Features gespeist (neue Anfrage, Aufgabe fällig, Antrag genehmigt …). Master-Schalter »alle E-Mails aus«.","x":6077,"y":2160,"width":460,"height":360,"color":"5"},
{"id":"43a26561f03f72da","type":"file","file":"02 Wireframes/P3 Querschnitt/WF-P3 Benachrichtigungen/WF-P3 Benachrichtigungen.canvas","x":6077,"y":2560,"width":460,"height":220},
{"id":"3864f1b74d665e1a","type":"file","file":"02 Wireframes/P3 Querschnitt/WF-P3 Audit Log/WF-P3 Audit Log.canvas","x":6037,"y":3500,"width":460,"height":220},
{"id":"b334f15bdd19d9ad","type":"text","text":"## Erste Schritte & Demo-Daten\n**Ticket:** `D-P20` (Teil) · **Status:** ⬜ offen\n**Wo:** `/onboarding` + Admin\n\n**Was drin ist:** Erste-Schritte-Checkliste (mit Direkt-Links, abhakbar, ausblendbar), Beispieldaten-Knopf (anlegen, zählen, wieder löschen, »Demo ausblenden«-Filter), Hell/Dunkel-Umschalter\n\n**So funktioniert's:** Kein Einrichtungs-Assistent — beim Registrieren wird alles SHK-typisch vorbefüllt, die Checkliste führt danach durch.","x":5537,"y":3760,"width":460,"height":360,"color":"5"},
{"id":"6533d410b309a48f","type":"text","text":"## Datenschutz (Export & Löschung)\n**Ticket:** `D-P21` (Teil) · **Status:** ⬜ offen\n**Wo:** `/admin/privacy` + Einstellungen\n\n**Was drin ist:** Daten-Export als ZIP (für einen Nutzer oder den ganzen Workspace), Workspace-Löschung (mehrstufig, 30 Tage Schonfrist, Passwort + 2FA), Konto-Löschung, Liste der Unterauftragsverarbeiter, AVV-Vertrag\n\n**So funktioniert's:** Letzter Baustein vor dem Launch. DSGVO-Auskunftsanfragen laufen in v1 als manuelle Anleitung, ohne eigenen Assistenten.","x":6037,"y":3760,"width":460,"height":360,"color":"5"},
{"id":"6b3c0929759a607b","type":"text","text":"## Abo & Rechnungen (für HiveGrid)\n**Ticket:** `D-P20` (Teil) · **Status:** ⚠️ Ticket braucht Recut\n**Wo:** `/admin/subscription`\n\n**Was drin ist:** Abo-Übersicht (Plan, Plätze, gebuchte Module, Test-Countdown), Verbrauchs-Balken (Automations-Läufe, Speicher), Rechnungen + Zahlungsstatus\n\n**Achtung:** Das Ticket wird gerade umgeschnitten (neuer Abrechnungs-Unterbau) — erst planen, wenn der Brief neu steht. Kein Selbst-Upgrade in v1.","x":6537,"y":3100,"width":460,"height":360,"color":"5"},
{"id":"db76161d24fb0c1d","type":"text","text":"## Feedback & Hilfe\n**Ticket:** `D-P21` (Teil) · **Status:** ⬜ offen\n**Wo:** überall + `/help`\n\n**Was drin ist:** Schwebender Feedback-Knopf (Fehler melden / Idee / Frage, optional mit Screenshot), kleine FAQ-Seite\n\n**So funktioniert's:** Meldungen landen direkt in unserer Support-Inbox im Plattform-Admin.","x":6537,"y":3760,"width":460,"height":360,"color":"5"},
{"id":"d9ad572ae83b4d0a","type":"text","text":"## Abnahme (Baustellen-Protokoll) 📱\n**Ticket:** `D-ABN` · **Status:** 🟡 vorgeplant (Screens validiert, Subframe offen)\n**Wo:** im Projekt-Detail\n\n**Was drin ist:** Abnahme-Formular (Druckprobe, Funktionsprüfung, Zählerstände, übergebene Dokumente), Mängel mit Foto festhalten, Unterschrift Kunde + Monteur direkt am Handy, Liste aller Abnahmen je Projekt\n\n**So funktioniert's:** Nach dem Speichern unveränderbar (6 Jahre Aufbewahrung), PDF geht automatisch per Mail an den Kunden. Funktioniert offline, lädt später hoch. Mängel werden automatisch Aufgaben.","x":6767,"y":1040,"width":460,"height":360,"color":"1"},
{"id":"md-hivegrid-map","type":"file","file":"05 HiveGrid Map/HiveGrid Map.md","x":-683,"y":-600,"width":460,"height":300},
{"id":"c8d8914e45e1497e","type":"text","text":"## Plattform-Admin\n**Ticket:** `D-ADMIN` · **Status:** ⬜ offen\n**Wo:** admin.hivegrid.de\n\n**Was drin ist:** Eigener Login (2FA Pflicht), Übersichts-Dashboard (Kunden, Nutzer, Umsatz, System-Zustand), Kunden-Verwaltung (Module freischalten = Abo-Baukasten, Test verlängern, »als Kunde einloggen« mit Begründung), Nutzer-Hilfen (2FA-Reset), Feature-Schalter, Warteschlangen-Monitor, Support-Inbox, Protokoll\n\n**So funktioniert's:** Komplett eigene Welt für uns als Betreiber — Kunden sehen davon nichts. Muss funktionieren, nicht hübsch sein.","x":7237,"y":3100,"width":460,"height":360,"color":"5"},
{"id":"abf5f779c1463715","type":"text","text":"## Hinweis\nDieses eine Ticket enthält viele kleine Features (Kunden, Schalter, Support …).\n\nBeim atomaren Durchgehen behandeln wir es als eigenen Bereich und teilen es bei Bedarf in Unter-Pakete auf. Priorität liegt aber hinter der Vertriebs-/Auftrags-Kette.","x":7237,"y":3760,"width":460,"height":360,"color":"5"},
{"id":"03e8e03ef11606a0","type":"text","text":"## HR-Bereich 📱\n**Ticket:** `D-HR` · **Status:** ⬜ offen\n**Wo:** `/hr` + HR-Admin\n\n**Was drin ist:** Startseite (Ankündigungen, offene Anträge, wer ist heute da), Urlaub & Krankmeldung (mit Genehmigung), Lohnabrechnungen, Anträge (Spesen, Hardware …), Passwort-Safe, Umfragen, Mitarbeiter-Verzeichnis, Standorte, eigene Dokumente\n\n**So funktioniert's:** Mitarbeiter-Sicht und HR-Verwaltung sind strikt getrennt; sensible Daten verschlüsselt, jedes Aufdecken protokolliert. Urlaub/krank fließt direkt in die Plantafel-Konflikte.","x":8017,"y":3100,"width":460,"height":360,"color":"5"},
{"id":"a-akte-pkg","type":"file","file":"02 Wireframes/P9 Auftrag/WF-P9 Projekt-Akte/WF-P9 Projekt-Akte.canvas","x":5077,"y":1440,"width":460,"height":220},
{"id":"a-plantafel-pkg","type":"file","file":"02 Wireframes/P9 Auftrag/WF-P9 Plantafel/WF-P9 Plantafel.canvas","x":5897,"y":1440,"width":460,"height":220},
{"id":"a-abnahme-pkg","type":"file","file":"02 Wireframes/P9 Auftrag/WF-P9 Abnahme/WF-P9 Abnahme.canvas","x":6767,"y":1440,"width":460,"height":220},
{"id":"a-flow-pkg","type":"file","file":"02 Wireframes/P12 Automationen/WF-P12 Flow-Editor/WF-P12 Flow-Editor.canvas","x":2150,"y":3500,"width":460,"height":220},
{"id":"a-autoverw-pkg","type":"file","file":"02 Wireframes/P12 Automationen/WF-P12 Verwaltung/WF-P12 Verwaltung.canvas","x":3067,"y":3500,"width":460,"height":220}
{"id":"03e8e03ef11606a0","type":"text","text":"## HR-Bereich 📱\n**Ticket:** `D-HR` · **Status:** ⬜ offen\n**Wo:** `/hr` + HR-Admin\n\n**Was drin ist:** Startseite (Ankündigungen, offene Anträge, wer ist heute da), Urlaub & Krankmeldung (mit Genehmigung), Lohnabrechnungen, Anträge (Spesen, Hardware …), Passwort-Safe, Umfragen, Mitarbeiter-Verzeichnis, Standorte, eigene Dokumente\n\n**So funktioniert's:** Mitarbeiter-Sicht und HR-Verwaltung sind strikt getrennt; sensible Daten verschlüsselt, jedes Aufdecken protokolliert. Urlaub/krank fließt direkt in die Plantafel-Konflikte.","x":7337,"y":2160,"width":460,"height":360,"color":"5"},
{"id":"c8d8914e45e1497e","type":"text","text":"## Plattform-Admin\n**Ticket:** `D-ADMIN` · **Status:** ⬜ offen\n**Wo:** admin.hivegrid.de\n\n**Was drin ist:** Eigener Login (2FA Pflicht), Übersichts-Dashboard (Kunden, Nutzer, Umsatz, System-Zustand), Kunden-Verwaltung (Module freischalten = Abo-Baukasten, Test verlängern, »als Kunde einloggen« mit Begründung), Nutzer-Hilfen (2FA-Reset), Feature-Schalter, Warteschlangen-Monitor, Support-Inbox, Protokoll\n\n**So funktioniert's:** Komplett eigene Welt für uns als Betreiber — Kunden sehen davon nichts. Muss funktionieren, nicht hübsch sein.","x":7337,"y":3100,"width":460,"height":360,"color":"5"},
{"id":"abf5f779c1463715","type":"text","text":"## Hinweis\nDieses eine Ticket enthält viele kleine Features (Kunden, Schalter, Support …).\n\nBeim atomaren Durchgehen behandeln wir es als eigenen Bereich und teilen es bei Bedarf in Unter-Pakete auf. Priorität liegt aber hinter der Vertriebs-/Auftrags-Kette.","x":7337,"y":3760,"width":460,"height":360,"color":"5"}
],
"edges":[
{
@@ -303,6 +307,7 @@
],
"metadata":{
"version":"1.0-1.0",
"frontmatter":{}
"frontmatter":{},
"startNode":"306e93d5a09ecb25"
}
}
05 HiveGrid Map/HiveGrid Map.md
+41 -32
View File
@@ -3,7 +3,7 @@ kind: map
project: HiveGrid Screen Project
area: HiveGrid Map
status: active
stand: 2026-07-08
stand: 2026-07-09
---
# HiveGrid Map
@@ -52,9 +52,9 @@ Gesamtkarte aller HiveGrid-v1-Features. Eine Karte = **ein Feature** (so benannt
| 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) | 🔴 | 🟡 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 |
| Online-Terminbuchung 🌐 | Termine & Formulare | D-BOOK + D-P16 (Teil) | 🟠 | 🟡 vorgeplant |
| Kalender | Termine & Formulare | D-BOOK + D-P16 (Teil) | 🔴 mittel | 🟡 vorgeplant |
| Digital unterschreiben (E-Signatur) | Termine & Formulare | D-P16 (Teil) | 🔵 | 🟡 vorgeplant |
| Team-Chat 📱 | Kommunikation | D-CHAT | 🟠 | ⬜ offen |
| Telefonie (Anrufe) | Kommunikation | D-P15 | 🔵 | ⬜ offen |
| Benachrichtigungen | Kommunikation | D-P3 (Teil) | 🔵 | 🟡 vorgeplant |
@@ -293,39 +293,48 @@ Abhaken = in der groben Planung berücksichtigt (Screens/Flow verortet). Quelle:
- [ ] 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
- [ ] Buchung erzeugt Anfrage oder hängt sich an bestehenden Kontakt + Bestätigungs-Mail; kein Doppel-Buchen möglich
- [ ] Intern: Buchungs-Liste (Reiter anstehend/vergangen/storniert, CSV) + Detail (stattgefunden/No-Show, stornieren mit Grund + Auto-Mail, verschieben, anderen Mitarbeiter zuweisen)
- [ ] Buchungsseiten-Editor (Dauer, Puffer, Vorlauf, Mitarbeiter, Fragen-Formular, Bestätigungs-Mail, Einbett-Code)
- [ ] Verfügbarkeits-Zeiten (Wochen-Regeln + Ausnahme-Tage)
- v1: Vergabe nur »erster freier Mitarbeiter«.
#### Online-Terminbuchung 🌐 — `D-BOOK` + `D-P16` (Teil) — 🟡 vorgeplant (2026-07-09)
- [x] 🌐 Buchungs-Seite »wie Calendly«: freien Termin wählen (Zeitzonen-fest) → Fragen-Formular → Bestätigung + Kalender-Datei (.ics); einbettbar (iFrame + QR); eigener Handy-Frame für den Slot-Picker
- [x] Buchung erzeugt Anfrage oder hängt sich an bestehenden Kontakt + Bestätigungs-Mail; kein Doppel-Buchen möglich (Race-Schutz)
- [x] Intern: Buchungs-Liste (Reiter anstehend/vergangen/storniert, Bulk-Storno, CSV) + Detail nach Karteikarten-Muster (stattgefunden/No-Show, stornieren mit Grund + Auto-Mail, verschieben, anderen Mitarbeiter zuweisen, Notizen)
- [x] Buchungsseiten-Editor (Dauer, Puffer, Vorlauf, Mitarbeiter, Fragen-Formular **mit Feld-Zuordnung zum Lead-Eingang**, Bestätigungs-Mail, Einbett-Code + QR) + Buchungsseiten-Liste
- [x] Verfügbarkeits-Zeiten (Wochen-Regeln + Ausnahme-Tage) — jeder Mitarbeiter pflegt seine eigenen, Admin alle
- Davids Delta (Change-Request an Dev): 🌐 **Kunde kann per Mail-Link selbst absagen/verschieben** (eigene öffentliche Seite)
- v1: Vergabe nur »erster freier Mitarbeiter«; Fragen-Felder als einfache Liste. D-FORM liegt jetzt als Review-Draft vor und kann später über die Lead-Feldzuweisungs-Schnittstelle eingesteckt werden.
- Paket: `02 Wireframes/P16 Termine/WF-P16 Terminbuchung/` (Screens validiert; Subframe steht aus)
#### Kalender — `D-BOOK` + `D-P16` (Teil) — ⬜ offen
- [ ] Monats-/Wochen-Ansicht mit allen Terminen (Google + Buchungen + Plantafel, je mit Herkunfts-Marker)
- [ ] Google-Kalender verbinden (Kalender auswählen, Richtung des Abgleichs, sauber trennen)
- [ ] Konflikt-Übersicht in Klartext (was kollidierte, wie gelöst)
- [ ] Fremde private Termine nur als »belegt« sichtbar
- v2: Outlook.
#### Kalender — `D-BOOK` + `D-P16` (Teil) — 🟡 vorgeplant (2026-07-09)
- [x] Monats-/Wochen-Ansicht mit allen Terminen (Google + Buchungen + Plantafel + Projekt-Termine, je mit Herkunfts-Marker)
- [x] Google-Kalender verbinden (Einstieg direkt im Kalender, pro Mitarbeiter; Kalender auswählen, Richtung des Abgleichs, sauber trennen) — OAuth + Trennen im P5-Muster
- [x] Konflikt-Übersicht in Klartext (was kollidierte, wie gelöst) — als Sektion in den Kalender-Einstellungen + Benachrichtigung
- [x] Fremde private Termine nur als »belegt« sichtbar (Kollegen-Overlay)
- Davids Delta (Change-Request an Dev): **vollwertiger Kalender** — Termine anlegen/bearbeiten, Einladungen an Team/Kontakte/freie E-Mails (.ics, Zu-/Absagen), Kollegen-Kalender als Verfügbarkeits-Overlay; funktioniert auch ohne Google
- v2: Outlook (in der Provider-Auswahl als »bald verfügbar« sichtbar).
- Paket: `02 Wireframes/P16 Termine/WF-P16 Kalender/` (Screens validiert; Subframe steht aus)
#### Digital unterschreiben (E-Signatur) — `D-P16` (Teil) — ⬜ offen
- [ ] Assistent am Projekt: PDF hochladen → Unterzeichner + Reihenfolge → senden
- [ ] Kunde unterschreibt per Link (mit Code-Bestätigung) oder direkt auf dem Gerät vor Ort
- [ ] Status je Unterzeichner (gesendet/angesehen/unterschrieben/abgelehnt), Erinnerung, Zurückziehen
- [ ] Original-PDF, unterschriebenes PDF + Abschluss-Nachweis herunterladbar
- Eigene Lösung; PandaDoc nur optional mit eigenem Schlüssel.
#### Digital unterschreiben (E-Signatur) — `D-P16` (Teil) — 🟡 vorgeplant (2026-07-09)
- [x] Projekt-Einstieg/Reiter »Signaturen« + Assistent: PDF aus Projekt-Dateien wählen oder hochladen → Unterzeichner + Reihenfolge → Signaturmodus → senden
- [x] 🌐 Kunde unterschreibt per Link mit Code-Bestätigung (OTP), PDF-Prüfung, Intent und Signatur; direkter Vor-Ort-Modus auf dem Gerät als eigener Mobile-Frame
- [x] Status je Unterzeichner (gesendet/angesehen/unterschrieben/abgelehnt/zurückgezogen), manuelle Erinnerung, Zurückziehen mit Grund
- [x] Original-PDF, unterschriebenes PDF + Abschluss-Nachweis herunterladbar und in Projekt-Dateien abgelegt
- [x] Eigene Lösung als Default: gehärteter SES-Eigenbau; PandaDoc nur optional mit eigenem Schlüssel (BYOK)
- Davids Delta: 🌐 **Kunden-Signierseite als eigener Screen** ergänzt, weil D-P16 nur den internen Wizard nennt.
- v2: freier PDF-Feldplatzierer, automatische Reminder-Regeln, QES/D-Trust.
- Paket: `02 Wireframes/P16 Termine/WF-P16 E-Signatur/` (Screens validiert; Subframe steht aus)
### Kommunikation
#### Team-Chat 📱 — `D-CHAT` — ⬜ offen
- [ ] Channel-Liste (Ungelesen-Zähler, @-Marker, anpinnen/stummschalten, Projekt-Status bei Projekt-Chats)
- [ ] Chat-Verlauf (Antwort-Threads, Emoji-Reaktionen, Anhänge, bearbeitet-Marker, »gelesen von X von Y«)
- [ ] Schreibfeld (Formatierung, Emoji, @-Erwähnung mit Vorschlägen, Anhänge, Entwurf bleibt erhalten), »tippt gerade …«
- [ ] Angepinnte Nachrichten, alle meine Erwähnungen, Suche über alle Channels
- [ ] Neuer Channel / Direktnachricht; Channel-Einstellungen (Mitglieder, archivieren)
- [ ] Projekt-Channels: Team wird automatisch synchron gehalten, Chat erscheint im Projekt
- [ ] Admin-Einsicht in DMs nur mit Pflicht-Begründung + sichtbarem Hinweis-Banner
- [ ] Monteur-Handy-Ansicht (vereinfacht, Foto-Direktupload, Push)
#### Team-Chat 📱 — `D-CHAT` — ⬜ offen (Entwurf angelegt, nicht validiert)
- [ ] Channel-Liste (Ungelesen-Zähler, @-Marker, anpinnen/stummschalten, Projekt-Status bei Projekt-Chats) + Channel-Browser
- [ ] Chat-Verlauf (Antwort-Threads, Emoji-Reaktionen, Anhänge, bearbeitet-Marker, »gelesen von X von Y«), Reconnect/Pending/Upload-Zustände
- [ ] Schreibfeld (Markdown, Emoji, @-Erwähnung mit Vorschlägen, Anhänge, Entwurf bleibt erhalten), »tippt gerade …«
- [ ] Angepinnte Nachrichten, alle meine Erwähnungen, Suche über alle Channels als eigene Nebenflächen
- [ ] Neuer Channel / Direktnachricht; Channel-Einstellungen (Mitglieder, Privacy, archivieren)
- [ ] Projekt-Channels: Team wird automatisch synchron gehalten, Chat erscheint im Projekt; View bleibt `/chat/:id`
- [ ] Admin-Einsicht in DMs nur mit Pflicht-Begründung + sichtbarem Hinweis-Banner + Audit-Log
- [ ] Monteur-Handy-Ansicht (vereinfacht, Foto-Direktupload, Push/Offline-Hinweis)
- Entwurf vorhanden: `02 Wireframes/P15 Kommunikation/WF-P15 Team-Chat/` — muss mit David gemeinsam geplant/validiert werden.
- Noch nicht zählen als vorgeplant; Subframe steht aus.
#### Telefonie (Anrufe) — `D-P15` — ⬜ offen
- [ ] AirCall verbinden (Status-Ampel, Telefon-Nutzer ↔ HiveGrid-Nutzer zuordnen mit Auto-Vorschlag, »Verbindung testen«)
Tickets/Fertige Tickets/D-FORM Form Builder.md
+2 -2
View File
@@ -28,7 +28,7 @@ Subframe Flow: [WF-D-FORM Form Builder](https://app.subframe.com/f023064a5ca0/fl
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.
Der empfohlene Hauptfluss ist der einfache Google-Forms-nahe Editor `S02`. S01B und die alten Advanced-Screens wurden im Obsidian-Handoff entfernt, damit der Review fokussiert bleibt.
## Gemacht
@@ -44,7 +44,7 @@ Der empfohlene Hauptfluss ist der einfache Google-Forms-nahe Editor `S02`. Der a
- 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.
- Entscheiden, ob die spaeteren Beispielvarianten `S01C`, `S01D`, `S01E` im Subframe-Flow liegen bleiben sollen.
- Klaeren, ob die dokumentierten Modale `M01` bis `M04` als echte Dialog-Screens gebaut werden muessen.
## Flow-Paket