posts/POST-5.md

Post 5 · Projektmanagement

Vierter Beitrag der Produktreihe, Termin Fr 21.08. laut Redaktionsplan, Stichwort dort: „Der Überblick, den jeder Betrieb vermisst."

Hell, Theme modern, Punktgrund, Text zentriert — dieselbe Anlage wie Post 4, damit die Reihe als Reihe erkennbar bleibt. Datei post5.html, Stand in state/post5.json, erreichbar über das Projektmenü jeder Seite und über uebersicht.html.

Fünf Slides, und jede zeigt einen anderen Bildschirm. Das Demo-Projekt hat für die Pipeline vier davon — Schablone, Board, Liste, Detail — und die tragen zusammen mehr als ein einzelner. Die fünfte Slide ist die Karte aus der Nähe.

---

1. Die fünf Slides

#	Tag	Überschrift	Screen	Was zu sehen ist
1	Projektmanagement	Von der Anfrage bis zur Abnahme.	4A	Das Board: drei Phasen mit Anzahl, Summe und Karten
2	Die Karte	Alles Wichtige auf einer Karte.	4A	Eine Karte groß
3	Zwei Pipelines	Vom Verkauf in die Abwicklung.	4B	Ein Projekt in „Auftragsabwicklung SHK", mit dem Knopf für den Pipelinewechsel
4	Die Liste	Board oder Liste.	4C	Dieselben Projekte als Tabelle, mit gesperrten Auftragswerten
5	Die Schablone	Deine Felder, deine Regeln.	3	Der Feldeditor, offen auf „Aufmaß erledigt"

Slide 3 ist die Pointe. Das Demo hat nicht eine Pipeline, sondern zwei: Vertrieb: Anlagen-Verkauf und Auftragsabwicklung SHK. Ein Projekt liegt in einer davon und wechselt über den Knopf Pipeline in die andere. Das ist der Unterschied zwischen Vertriebs- und Abwicklungs-Projektmanagement, und er ist keine Auslegung: die beiden Namen stehen in PipelineBoardInteractive.tsx und S02PipelinesDetailansicht.tsx.

Slide 5 erklärt, warum das eine Software sein kann. Die Felder hängen an der Pipeline, nicht am Programm. Siebzehn Feldtypen, dazu drei Stufen unter Pflicht ab Board-Spalte. Ein SHK-Betrieb legt sich „Aufmaß erledigt" an, ein anderer etwas anderes.

Slide 1 trägt das Board, weil sie im Profilraster eine Kachel von rund 150 px ist. Dort ist kein Wort lesbar; was ankommt, sind Säulen aus Kärtchen.

Sie trägt keinen Fließtext, wie die Titelbilder von Post 3 und Post 4. „Jedes Projekt im Griff" stand zuerst als Überschrift da: zwei Zeilen von dreizehn und neun Zeichen liegen als schmaler Block in einer breiten Fläche, und die Slide wirkte dadurch leer. Jetzt trägt sie die zweite Hälfte derselben Überschrift aus lib/produkt-daten.ts. Die Lücke über dem Board schließt visBottom: 215 statt eines Satzes.

---

2. Die Bildunterschrift

Die häufigste Frage im Handwerksbüro ist keine fachliche. Sie lautet: wo steht das eigentlich gerade?

In HiveGrid steht jedes Projekt in genau einer Phase. Auf der Karte siehst du Gewerk, Auftragswert, Priorität, wer zuständig ist und was als Nächstes ansteht, ohne sie zu öffnen.

Sobald der Auftrag steht, wechselt das Projekt die Pipeline. Aus dem Verkauf wird die Abwicklung, mit denselben Daten. Verkauft ist nicht fertig.

Ob Board oder Liste, entscheidest du. Welche Felder eine Pipeline trägt, ebenfalls: ein SHK-Betrieb legt sich ein Häkchen fürs Aufmaß an, ein anderer Betrieb etwas anderes.

Kein Suchen, kein Nachfragen, kein Zettelchaos.

#handwerk #shk #handwerksbetrieb #digitalisierungimhandwerk #projektmanagement #auftragsabwicklung #vertrieb #hivegrid

Vorgabe	Ist
Haken in den ersten 125 Zeichen	erster Absatz, 101 Zeichen
300 bis 800 Zeichen	651
5 bis 10 Hashtags, unten abgesetzt	8
Suchwörter zusätzlich im Fließtext	Handwerk, Projekt, Phase, Auftrag, Vertrieb, Abwicklung, Pipeline, Aufmaß

„Kein Suchen, kein Nachfragen, kein Zettelchaos" steht wörtlich so schon im Fließtext der Projektmanagement-Slide von Post 1. Dieselbe Reihe darf denselben Satz zweimal benutzen.

---

3. Woher die Angaben kommen

Quelle ist durchgehend das Pitch-Paket (fertig bombo · Kundentermin 30.07.2026), Ordner hivegrid-pitch.

Was	Woher
Die zehn Phasennamen und ihre Reihenfolge	PipelineBoardInteractive.tsx, STAGES
Board / Liste	die ToggleGroup in der Kopfzeile, sie kennt genau diese zwei
„Vertrieb: Anlagen-Verkauf"	Seitentitel desselben Screens
Alle Projekte auf Slide 1 und 2	INITIAL_PROJECTS, wörtlich
Anzahl und Summe je Spalte	aus denselben 41 Datensätzen gezählt und addiert
Gewerk zu Farbton	CATEGORY_TONES
Hoch / Mittel / Niedrig, Balkenzahl, Farbrollen	ProjectCard.tsx, PriorityBadge und PriorityIndicator
Aufbau der Karte, Umbruch auf zwei Zeilen, getönter Fuß	ProjectCardRoot, Klasse für Klasse
Farbe des Kürzels	avatarColor je Projekt, aufgelöst über Avatar.tsx
Projekt, Pipeline, Nummer und Rubriken auf Slide 3	S02PipelinesDetailansicht.tsx
Zeilen und Spaltenköpfe auf Slide 4	S03ProjektListe.tsx
Feldtypen und Pflicht ab Board-Spalte auf Slide 5	S05DetailSchabloneEditMode.tsx
Plättchen-, Rand- und Textfarben	ui/theme.css
Alle Symbole	@subframe/core, Pfade aus dem Paket kopiert
„Jedes Projekt im Griff"	Überschrift in lib/produkt-daten.ts der Website

---

4. Wo bewusst abgewichen wird

Slide 1 zeigt nur das Board selbst. Seitentitel, der Umschalter Board/Liste und die Filterleiste standen einmal darüber und sind alle drei wieder entfallen: ein Titelbild soll in einem Blick sagen, worum es geht, und was im Profilraster ankommt, sind Säulen aus Kärtchen. Drei Reihen Bedienoberfläche darüber liest niemand. Wie die Pipeline heißt, sagt Slide 3; dass es auch eine Liste gibt, sagt Slide 4.

Zwei bis drei Karten je Spalte, der Kopf zählt vier. Außen zwei, in der Mitte drei. So ist es im Werkzeug auch: eine Spalte zeigt, was aufs Bild passt, der Rest kommt beim Scrollen. Gleich hohe Säulen sahen aus wie eine Tabelle, ungleiche sehen aus wie ein Board, auf dem gearbeitet wird.

Slide 4 zeigt vier von neun Tabellenspalten und sieben von elf Zeilen. Die Tabelle hat Projekt-Nr., Projektname, Board, Spalte, Auftragswert, Kunde / Kontaktrolle, Termin / Hinweis, Tags und Sachbearbeiter. Neun nebeneinander wären auf 1080 px unter zehn Pixel Schrift.

Die Spalte Sachbearbeiter ist zuletzt noch entfallen, damit „Auftragswert gesperrt" ungekürzt hineinpasst. Der Wortlaut ist der Grund, warum diese Spalte überhaupt auf der Slide steht — ihn auf „gesperrt" zu stutzen wäre der bequeme Weg gewesen und kein Zitat mehr. Weggelassen ist nur Vorhandenes, dazugedichtet nichts.

Slide 3 stellt die Rubriken untereinander, das Werkzeug stellt sie nebeneinander. Hochkant ist untereinander lesbar, die Reihenfolge bleibt.

Zwei Rubriken fehlen auf Slide 3. PDS-INTEGRATION, weil der Beitrag sich an Betriebe allgemein richtet und nicht an die, die zufällig dieses eine Branchenprogramm fahren — dieselbe Entscheidung wie bei Post 4. Und ADRESSDATEN · TEST A (ZUSATZADRESSEN AN), weil das ein Arbeitstitel aus der Entwicklung ist und kein Bildschirmtext.

Die Karte ist 320 breit wie im Original (w-80), der Betrag steht auf 26 statt größer. Bei „Niedrig" ist das Prioritätsplättchen breiter als bei „Hoch", und der Betrag stieß dagegen.

Die Maßstäbe sind aufeinander abgestimmt. Slide 1, 3, 4 und 5 zeigen ihre Schrift zwischen 16 und 23 px; nur Slide 2 ist als Nahaufnahme gedacht und liegt bei 47 px. Vorher stand sie auf 59 bis 73 px — eine einzelne Karte wirkte damit größer als das ganze Board davor, und die Reihe kippte. Wer an einer Zeichnung dreht, sollte die Tabelle in §6 danach nachrechnen.

---

5. Eine Richtigstellung

Ein früherer Stand dieses Beitrags behauptete, die Detailansicht sei nur ein Entwurfs-PNG. Das war falsch. Geprüft worden waren die Beschriftungen des Bildes 07_Screen-4b_Karten-Detail.png — KUNDENDATEN, OBJEKTDATEN, AUFTRAG & FÖRDERUNG, Wahrscheinlichkeit, Heizlast, Lead-Quelle —, und die kommen im Code tatsächlich nirgends vor. Daraus wurde der falsche Schluss gezogen, es gebe den Bildschirm nicht.

Es gibt ihn: app/(screens)/4b/page.tsx rendert S02PipelinesDetailansicht.tsx, 3150 Zeilen, mit den Rubriken GRUNDDATEN, PLANUNG & VERANTWORTLICHE, PROJEKTKONTAKTDATEN, KONTAKTE, FIRMENDATEN, ANSPRECHPARTNER, PROJEKTADRESSE und ZUSATZADRESSEN. Das PNG ist ein älterer Entwurf desselben Bildschirms, nicht sein Beleg.

Die Lehre ist nicht „Screenshots lügen", sondern: die Abwesenheit einer Zeichenkette beweist die Abwesenheit eines Bildschirms nicht. Für die zweite Frage muss man die Routen ansehen, nicht die Wörter.

---

6. Stand der Dinge

Slides	5
Format	1080 × 1350, Ausgabe zweifach: 2160 × 2700
Luft zwischen Text und Zeichnung	224 / 239 / 123 / 187 / 133 px (Grenze 40)
Zeichnung ragt über die Seite	nein, alle innerhalb der 92-px-Schutzzone
Stylesheet vollständig	214 Regeln, [data-edit] vorhanden
Konsole	keine Fehler
Ausgabeweg	geprüft, 01-board-hell.png bis 05-schablone-hell.png

Geprüft wird mit den Hilfsskripten aus dem Sitzungsordner: flaeche.mjs misst über getBBox() die tatsächlich gezeichnete Fläche je Slide, kopf5.mjs die Breite jeder Überschriftzeile (sie ist nowrap, eine zu lange Zeile bricht nicht um, sondern läuft über den Rand), css5.mjs zählt die Regeln im Stylesheet und liest die Konsole mit, export.mjs fährt den echten Ausgabeweg und fängt /save ab, damit beim Prüfen nichts in Downloads landet.

---

7. Zwei Fallen aus diesem Bau

Ein Screenshot ist keine Quelle. Die Karte war zuerst aus pipelines.png abgemalt. Drei Sachen lagen daneben, und keine davon war im Bild zu erkennen: Priorität, Balken und Kürzel stehen im Original als Gruppe rechts und hängen über die Kante des Fußes, im Fuß steht über dem Termin die Zeitspanne des Projekts, und die Balken sitzen in einem eigenen umrandeten Kasten. Erst ProjectCard.tsx hat das gezeigt.

Ein Prüfskript hat den Projektstand verstellt. export.mjs schaltet die Slides mit der Pfeiltaste weiter. Die Seite startet aber im Bearbeiten-Modus (editMode = "an"), und dort verschieben Pfeiltasten das gewählte Element, statt die Slide zu wechseln. Jeder Prüflauf hat die Zeichnungen also ein Stück gerückt und das in state/post5.json geschrieben: am Ende stand dort vis: {dx: 3, dy: -69} auf Slide 1 und auf Slide 2 sogar ein size: 762, das die im Code eingestellten 720 überschrieb.

Gemerkt habe ich es an Messwerten, die im Code nirgends standen — eine Slide meldete 89 px Rand rechts bei eingestellten 92, eine andere 177 px unten bei eingestellten 120. Zahlen, die man sich nicht erklären kann, sind ein Befund und keine Messungenauigkeit. export.mjs verlässt jetzt vor dem Blättern den Bearbeiten-Modus und schreibt den Stand am Ende zurück, falls er sich doch verändert hat.

SVG bricht keinen Text um, und Breite schätzen geht schief. Die Plättchenbreite war anfangs aus der Zeichenzahl mal 0,52 em gerechnet. Das stimmt für „Heizung" und geht bei „Wärmepumpe" daneben; das Wort stand über dem Rand seines Plättchens. Gemessen wird jetzt mit einem Canvas in derselben Schrift, die das SVG später zeichnet. Aus derselben Messung kommt der Zeilenumbruch der Titel, der im Original line-clamp-2 heißt.