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

Post 2 Alternative: spitz auf Workflow-Engine, CRM, Vertrieb, Marketing

Browse Source 
Rueckmeldung aus dem Team: "Wenn ich das als Handwerker sehe, sehe ich zu
viele Dinge die meine Handwerkersoftware schon kann. Wir muessen ganz spitz
auf die Workflow-Engine, dass das ERP bleibt und CRM/Vertrieb/Marketing
gehen. Die Nische besetzen dann nur wir."

Genau das stand bisher auf Slide 4 und 5: Projektmanagement, Chat,
Mitarbeiter-Management, Projekte, Formulare. Das kann ein
Branchenprogramm alles schon, und damit las sich der Beitrag als
Konkurrenz zu ihm -- im Widerspruch zur eigenen Ueberschrift "Dein
Branchenprogramm bleibt, wo es ist".

Slide 4 nennt jetzt Workflow-Engine, CRM, Vertrieb, Marketing. Slide 5
zeigt dieselben vier plus Automatisierung und KI/MCP, und in der Mitte
steht "Dein Programm" statt HiveGrid: der Kern bleibt, aussen kommt dazu.
Das Wort ERP taucht weiterhin nicht auf, die Aussage ist seine, das Wort
unseres.

Dafuer drei neue Formen: Workflow als Knoten mit Verzweigung, Vertrieb als
Trichter, Marketing als Megafon. Jede nimmt einen Massstab entgegen und
taugt damit als kleines Listenzeichen und als grosser Satellit.

Nur die Alternative ist geaendert. post2.html bleibt unangetastet, damit
sich die beiden Fassungen in Stil und Zuspitzung vergleichen lassen.

Zwei Kollisionen kamen dabei heraus. "Dein Programm" ist laenger als
"HiveGrid" und lief in die drei Fensterpunkte; die sind entfallen, in
dieser Formensprache ist Fensterchrom ohnehin fehl am Platz. Und die
laengeren Namen der beiden oberen Satelliten stiessen an ihre Knoten, sie
stehen jetzt seitlich versetzt.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
This commit is contained in:
dejanandClaude Opus 5 committed 2026-08-13 17:58:53 +02:00
1 parent e88afc61a4
commit 84b3905d71
1 file changed
+58 -15
Download Patch File Download Diff File Expand all files Collapse all files
post2-alt.html
+58 -15
View File
@@ -1181,7 +1181,7 @@
layouts: [{ id: "standard", label: "Standard" }],
eyebrow: "Mehr",
head: 'Wir wollten nicht weg.<br><span class="a">Wir wollten mehr.</span>',
body: "KI-Lösungen, Projektmanagement, Automatisierungen. Unsere Tools sollen endlich miteinander reden.",
body: "Ein CRM, Vertrieb, Marketing, Automatisierungen. Unsere Tools sollen endlich miteinander reden.",
vis: "lose", visW: 988, visLeft: 92, visBottom: 120,
},
{
@@ -1528,8 +1528,7 @@
const w = 216, h = 150, x = cx - w / 2, y = cy - h / 2, kopf = 40;
let d = rechteck(x, y, w, h, { ue: 4 });
d += strich(x, y + kopf, x + w, y + kopf, { ue: 3 });
let k = "";
[0, 1, 2].forEach(i => { k += kringel(x + 18 + i * 15, y + kopf / 2, 4.4, 4.4, { ueber: .1 }); });
const k = ""; // keine Fensterpunkte in dieser Fassung
let z = "";
for (let i = 0; i < 4; i++) {
const yy = y + kopf + 22 + i * 23;
@@ -1540,7 +1539,7 @@
return zug(d, { w: 3.6 }) + zug(k, { w: 2.4 }) + zug(z, { w: 2.2, op: .8 }) +
'<text x="' + cx + '" y="' + (y + kopf / 2 + 8) + '" text-anchor="middle" ' +
'font-family="Manrope, sans-serif" font-size="24" font-weight="800" ' +
'letter-spacing="-0.01em" fill="' + TINTE + '">HiveGrid</text>';
'letter-spacing="-0.01em" fill="' + TINTE + '">Dein Programm</text>';
}
/* ─── Aufbau ───────────────────────────────────────────────────────────── */
@@ -1964,6 +1963,50 @@
'" xmlns="http://www.w3.org/2000/svg">' + raus + '</svg>';
}
/* ─── Formen fuer die zugespitzte Fassung ───────────────────────────────
Rueckmeldung aus dem Team: als Handwerker sieht man zu viele Dinge, die
die eigene Handwerkersoftware schon kann. Projektmanagement, Chat und
Mitarbeiter-Verwaltung sind genau das. Diese Fassung zeigt stattdessen,
was das Branchenprogramm nicht hat: Workflow-Engine, CRM, Vertrieb,
Marketing, Automatisierung, KI.
Jede Form nimmt einen Massstab entgegen, damit dieselbe Zeichnung als
kleines Listenzeichen und als grosser Satellit taugt. */
function formWorkflow(cx, cy, s) {
const r = 7 * s, dx = 20 * s, dy = 14 * s;
return kringel(cx - dx, cy, r) + kringel(cx + dx, cy - dy, r) + kringel(cx + dx, cy + dy, r) +
strich(cx - dx + r, cy - r * 0.3, cx + dx - r, cy - dy + r * 0.5) +
strich(cx - dx + r, cy + r * 0.3, cx + dx - r, cy + dy - r * 0.5);
}
function formTrichter(cx, cy, s) {
const b = 20 * s, h = 15 * s;
return "M" + n1(cx - b) + "," + n1(cy - h) + "H" + n1(cx + b) +
"L" + n1(cx + b * 0.26) + "," + n1(cy + h * 0.2) +
"V" + n1(cy + h) + "L" + n1(cx - b * 0.26) + "," + n1(cy + h * 0.55) +
"V" + n1(cy + h * 0.2) + "Z";
}
function formMegafon(cx, cy, s) {
const b = 18 * s, h = 15 * s;
return "M" + n1(cx - b) + "," + n1(cy - h * 0.34) +
"L" + n1(cx + b * 0.28) + "," + n1(cy - h) +
"V" + n1(cy + h) + "L" + n1(cx - b) + "," + n1(cy + h * 0.34) + "Z" +
strich(cx + b * 0.56, cy - h * 0.46, cx + b * 0.94, cy - h * 0.72) +
strich(cx + b * 0.62, cy, cx + b * 1.02, cy) +
strich(cx + b * 0.56, cy + h * 0.46, cx + b * 0.94, cy + h * 0.72);
}
function ikonWorkflow(cx, cy) { return zug(formWorkflow(cx, cy, 2.0), { w: 3 }); }
ikonWorkflow.rad = 56; ikonWorkflow.unten = 84;
function ikonTrichter(cx, cy) { return zug(formTrichter(cx, cy, 2.4), { w: 3 }); }
ikonTrichter.rad = 56; ikonTrichter.unten = 86;
function ikonMegafon(cx, cy) { return zug(formMegafon(cx, cy, 2.4), { w: 3 }); }
ikonMegafon.rad = 56; ikonMegafon.unten = 86;
const glyWorkflow = (cx, cy) => formWorkflow(cx, cy, 0.95);
const glyTrichter = (cx, cy) => formTrichter(cx, cy, 1.05);
const glyMegafon = (cx, cy) => formMegafon(cx, cy, 1.05);
/* ─── Slide 4: wir wollten mehr ──────────────────────────────────────────
Die alte Fassung zeigte vier Kaesten mit "fehlt". Das ist der Mangel, die
Slide handelt aber vom Wunsch. Also ein Blatt mit einer Liste.
@@ -2024,10 +2067,10 @@
const LX = 60, RX = 800, OY = 70, UY = 650, KNICK = 58;
const wuensche = [
{ t: "Workflow-Engine", g: glyZahnrad },
{ t: "Projektmanagement", g: glyBoard },
{ t: "Chat", g: glyBlase },
{ t: "Mitarbeiter-Management", g: glyLeute },
{ t: "Workflow-Engine", g: glyWorkflow },
{ t: "CRM", g: glyLeute },
{ t: "Vertrieb", g: glyTrichter },
{ t: "Marketing", g: glyMegafon },
];
// Blatt mit abgeknickter Ecke unten rechts.
@@ -2141,12 +2184,12 @@
// Die Winkel sind nicht frei gewaehlt: sie sind die sechs Eckwinkel der
// Wabe. Dadurch sitzt jeder Knoten auf einer Ecke.
const sats = [
{ a: 240, name: "KI", ikon: ikonKi },
{ a: 300, name: "Chat", ikon: ikonChat },
{ a: 0, name: "Mitarbeiter", ikon: ikonCrm },
{ a: 60, name: "Automation", ikon: ikonAuto },
{ a: 120, name: "Projekte", ikon: ikonBoard },
{ a: 180, name: "Formulare", ikon: ikonFormular },
{ a: 240, name: "KI & MCP", ikon: ikonKi, vx: -46 },
{ a: 300, name: "Marketing", ikon: ikonMegafon, vx: 46 },
{ a: 0, name: "CRM", ikon: ikonCrm },
{ a: 60, name: "Vertrieb", ikon: ikonTrichter },
{ a: 120, name: "Automatisierung", ikon: ikonAuto },
{ a: 180, name: "Workflow-Engine", ikon: ikonWorkflow },
];
let speichen = "", knoten = "", bilder = "", schrift = "";
@@ -2161,7 +2204,7 @@
speichen += strich(ix + ux * 12, iy + uy * 12, ax - ux * 11, ay - uy * 11, { j: 1.2 });
knoten += kringel(ix, iy, 10.5, 10.5, { ueber: .1 }) + kringel(ax, ay, 10.5, 10.5, { ueber: .1 });
bilder += s.ikon(sx, sy);
schrift += '<text x="' + n1(sx) + '" y="' + n1(sy + s.ikon.unten) + '" text-anchor="middle" ' +
schrift += '<text x="' + n1(sx + (s.vx || 0)) + '" y="' + n1(sy + s.ikon.unten) + '" text-anchor="middle" ' +
'font-family="Manrope, sans-serif" font-size="28" font-weight="700" ' +
'letter-spacing="-0.01em" fill="' + TINTE + '">' + s.name + '</text>';
});