diff --git a/post2.html b/post2.html index 2afc0b2..95e0b95 100644 --- a/post2.html +++ b/post2.html @@ -1146,8 +1146,8 @@ layouts: [{ id: "standard", label: "Standard" }], eyebrow: "Wechseln", head: 'Und wechseln?
Kannst du vergessen.', - body: "Da hängen Jahre an Stammdaten, Aufträgen und Buchhaltung drin. Und die Leute, die es kennen.", - vis: "ersetzen", visW: 896, visLeft: 92, visBottom: 120, + body: "Da hängen Jahre an Stammdaten, Aufträgen und Buchhaltung drin. Ein Wechsel führt ins Chaos.", + vis: "ersetzen", visW: 896, visLeft: 92, visBottom: 190, }, { key: "mehr", type: "feature", @@ -1916,101 +1916,91 @@ } /* ─── Slide 3: wechseln kannst du vergessen ────────────────────────────── - Der Fliesstext hat zwei Haelften, und beide brauchen ein Bild: "Jahre an - Daten und Wissen haengen drin" wird zu Wurzeln im Boden, "am Ende - dasselbe, nur woanders" zu demselben Kasten noch einmal, nur gestrichelt. - Dazwischen eine gerissene Leine. + Eine Leserichtung statt einer Anordnung: Wechsel-Symbol, Pfeil, Chaos. + Was drinhaengt, steht im Symbol; wohin es fuehrt, steht rechts. - Das Kreuz der alten Fassung lag auf dem Pfeil und nicht auf dem Ziel, aus - gutem Grund: nicht das neue System scheitert, sondern der Wechsel. Das - bleibt so. Aus dem Kreuz ist eine gerissene Leine geworden und aus dem - leeren Ziel ein gleiches, denn leer war die falsche Aussage. */ - function wurzeln(x, w, oben, tief) { - let raus = ""; - const n = 8; - for (let i = 0; i < n; i++) { - const t = (i + 0.5) / n; - const sx = x + w * (0.07 + 0.86 * t); - const laenge = tief * (0.5 + rnd() * 0.5); - const drift = (t - 0.5) * 165 + zit(26); - raus += zug(glatt([[sx, oben], - [sx + drift * 0.18 + zit(9), oben + laenge * 0.3], - [sx + drift * 0.62 + zit(11), oben + laenge * 0.66], - [sx + drift, oben + laenge]], false), - { w: 3.1 - Math.abs(t - 0.5) * 1.7 }); - const az = oben + laenge * 0.5, ax = sx + drift * 0.28; - const seite = t < 0.5 ? -1 : 1; - raus += zug(glatt([[ax, az], - [ax + seite * 20 + zit(7), az + laenge * 0.2], - [ax + seite * 33 + zit(9), az + laenge * 0.33]], false), { w: 1.8 }); - } - return raus; - } - - /* Erdreich: ungleich lange Schraegstriche. Die gleichmaessige Schraffur aus - schraff() sah nach technischer Zeichnung aus, nicht nach Boden. */ - function erdreich(x1, x2, y) { - let d = ""; - for (let x = x1; x < x2; x += 13 + rnd() * 6) { - const l = 11 + rnd() * 13; - d += strich(x, y + 2, x - l * 0.55, y + 2 + l, { j: .8, b: .8 }); - } - return d; - } + Vier Fassungen liegen dahinter. Ein verwurzelter Kasten mit gerissener + Leine und eine beladene Sackkarre erzaehlten je eine kleine Szene. Eine + dritte reihte Block, Pfeile und eine schraffierte Wand nebeneinander, und + die Wand las niemand als Wand. Die vierte war ein durchgestrichenes + Symbol, aber der Strich lief quer durch die Woerter. + Was jede von ihnen nicht hatte: eine Richtung. Drei Stationen von links + nach rechts liest man in einer Sekunde, drei Teile nebeneinander nicht. */ function visWechseln() { keim(20260815); - const W = 896, H = 730, GRAU = "#A9AFB7"; - const BY = 100, BH = 360, BW = 320, LX = 30, RX = 555; - const zeilen = ["Stammdaten", "Aufträge", "Buchhaltung", "Wissen im Kopf"]; - const mitte = BY + BH / 2; + /* Die Flaeche ist niedriger als bei den anderen Slides: drei Formen + nebeneinander duerfen in 896 Breite hoechstens rund 200 Radius haben, + und eine 730 hohe Box waere dann zu drei Vierteln leer. Sie sitzt + stattdessen mittig in der freien Hoehe unter dem Text. */ + const W = 896, H = 520, MY = 258; + const ZX = 200, RX = 190, RY = 200; + const zeilen = ["Stammdaten", "Aufträge", "Buchhaltung"]; - const inhalt = (x, farbe) => zeilen.map((z, i) => - '' + z + '').join(""); - const striche = x => zeilen.map((z, i) => - strich(x + 28, BY + 87 + i * 66, x + 48, BY + 87 + i * 66, { j: .8, b: .8 })).join(""); - - let raus = ""; - - // Der Bestand: schwerer Strich, doppelte Unterkante. - raus += zug(rechteck(LX, BY, BW, BH, { ue: 4.5 }), { w: 3.8 }); - raus += zug(strich(LX + 6, BY + BH + 6, LX + BW - 6, BY + BH + 6, { ue: 2 }), { w: 3 }); - raus += zug(striche(LX), { w: 2.6 }); - - /* Die Erdoberflaeche liegt dicht unter dem Kasten, nicht am unteren Rand. - Im ersten Wurf lag sie 120 px tiefer, dadurch endeten die Wurzeln in der - Luft und sahen aus wie Beine. Sie muessen die Linie kreuzen, sonst - stecken sie nicht drin. */ - const boden = BY + BH + 18; - raus += zug(strich(0, boden, 500, boden, { ue: 4 }), { w: 3 }); - raus += zug(erdreich(6, 494, boden), { w: 1.9, op: .45 }); - raus += wurzeln(LX, BW, BY + BH + 6, 142); - - /* Die Leine reisst, und der Akzent sitzt genau dort, wo die Aussage sitzt. - Entscheidend ist, dass beide Enden nach unten haengen und die Fasern in - dieselbe Richtung weiter ausfransen. Im ersten Wurf zeigten sie - aufeinander zu: das ergab zwei Pfeilspitzen, also die gegenteilige - Aussage. Eine gerissene Leine faellt, sie zielt nicht. */ - const endL = [418, mitte + 62], endR = [496, mitte + 48]; - raus += zug(glatt([[LX + BW, mitte - 8], [388, mitte + 2], [412, mitte + 28], - endL], false), { f: GELB, w: 4.4 }); - raus += zug(glatt([[RX, mitte - 8], [528, mitte + 0], [502, mitte + 22], - endR], false), { f: GELB, w: 4.4 }); - let fransen = ""; - [endL, endR].forEach(e => { - [-0.42, -0.05, 0.36].forEach(o => { - fransen += strich(e[0], e[1] - 4, - e[0] + Math.sin(o) * 26, e[1] + Math.cos(o) * 26, { j: .9, b: 1.1 }); + /* Das Wechsel-Symbol: zwei Boegen mit Luecken links und rechts. Ein + geschlossener Ring waere kein Symbol mehr, sondern eine Ellipse. */ + function bogen(a1, a2) { + const n = 18, p = []; + for (let i = 0; i <= n; i++) { + const a = (a1 + (a2 - a1) * i / n) * Math.PI / 180; + p.push([ZX + Math.cos(a) * RX + zit(1.8), MY + Math.sin(a) * RY + zit(1.8)]); + } + return p; + } + function mitSpitze(p, laenge) { + const e = p[p.length - 1], v = p[p.length - 2]; + const w = Math.atan2(e[1] - v[1], e[0] - v[0]); + let d = glatt(p, false); + [-0.44, 0.44].forEach(o => { + d += strich(e[0], e[1], e[0] - Math.cos(w + o) * laenge, + e[1] - Math.sin(w + o) * laenge, { j: .9, b: .9 }); }); - }); - raus += zug(fransen, { f: GELB, w: 2.8 }); + return d; + } - // Dasselbe noch einmal, nur woanders: gleiche Groesse, gleiche Zeilen. - raus += zug(rechteck(RX, BY, BW, BH, { ue: 3 }), { w: 3, op: .6, strichel: "14 13", f: GRAU }); - raus += zug(striche(RX), { w: 2.4, f: GRAU }); - raus += inhalt(LX, TINTE) + inhalt(RX, GRAU); + let raus = zug(mitSpitze(bogen(204, 336), 30) + + mitSpitze(bogen(24, 156), 30), { w: 7 }); + zeilen.forEach((t, i) => { + raus += '' + t + ''; + }); + + /* Der Pfeil dazwischen, gebaut wie die anderen im Beitrag: Umriss + gezeichnet, innen mit Schraegstrichen ausgemalt. */ + const px1 = 420, pkopf = 500, pspitze = 548; + const pHalb = x => x <= pkopf ? 19 : Math.max(2, 36 * (1 - (x - pkopf) / (pspitze - pkopf))); + raus += zug(kritzel(px1 + 4, pspitze - 6, MY, pHalb, 11), { w: 4.2, op: .92 }); + raus += zug(linienzug([[px1, MY - 19], [px1 + 40, MY - 21], [pkopf, MY - 19], + [pkopf, MY - 36], [pspitze, MY], [pkopf, MY + 36], + [pkopf, MY + 19], [px1 + 40, MY + 21], [px1, MY + 19], + [px1, MY - 19]]), { w: 3.4 }); + + /* Das Chaos: eine Bahn durch lauter zufaellige Punkte, weich gezogen. Sie + kreuzt sich dadurch staendig selbst. Zwei Durchgaenge, damit es dicht + wird, dazu ein paar lose Enden nach aussen -- ein Knaeuel ohne Enden + sieht aus wie eine Wolke. */ + function knaeuel(cx, cy, rx, ry, n) { + const p = []; + for (let i = 0; i < n; i++) { + const a = rnd() * 6.283, r = 0.18 + rnd() * 0.82; + p.push([cx + Math.cos(a) * rx * r, cy + Math.sin(a) * ry * r]); + } + return glatt(p, false); + } + const CX = 726, CRX = 162, CRY = 196; + raus += zug(knaeuel(CX, MY, CRX, CRY, 26), { w: 3.4 }); + raus += zug(knaeuel(CX, MY, CRX * 0.78, CRY * 0.78, 20), { w: 2.8, op: .85 }); + let enden = ""; + [[-0.7, 1], [0.4, 1], [2.3, 1], [3.6, 1], [4.9, 1]].forEach(v => { + const a = v[0]; + enden += glatt([[CX + Math.cos(a) * CRX * 0.9, MY + Math.sin(a) * CRY * 0.9], + [CX + Math.cos(a) * CRX * 1.12 + zit(10), + MY + Math.sin(a) * CRY * 1.12 + zit(10)], + [CX + Math.cos(a) * CRX * 1.3 + zit(14), + MY + Math.sin(a) * CRY * 1.3 + zit(14)]], false); + }); + raus += zug(enden, { w: 2.6, op: .8 }); return '' + raus + ''; diff --git a/state/post2.json b/state/post2.json index 70da03e..f4690ab 100644 --- a/state/post2.json +++ b/state/post2.json @@ -39,9 +39,7 @@ }, { "ref": "wechseln", - "werte": { - "body": "Da hängen Jahre an Stammdaten, Aufträgen und Buchhaltung drin und die Leute, die es kennen." - } + "werte": {} }, { "ref": "mehr",