diff --git a/POST-6.md b/POST-6.md index bba6c98..57e62b9 100644 --- a/POST-6.md +++ b/POST-6.md @@ -264,12 +264,16 @@ Ein Zwischenstand hatte hier einen selbst erfundenen gelben Aufkleber Band ein flaches Rechteck mit durchlaufender Schrift; hier lag es damit als Aufkleber auf der Fläche statt als Band darüber. -*Die Enden knicken nach hinten weg.* Die Außenkanten laufen zur Mitte zusammen -(10 % der Bandhöhe je Kante), die Knickflächen sind dunkler (`#D6A11E`), an der -Knickstelle steht eine Kante, und die dunklen Längskanten folgen dem Knick mit -statt darüber zu schweben. Ein erster Anlauf knickte bei 21 % der Länge und mit -17 % Verjüngung — das sah aus wie eine Schleife. Bei 12 % und 10 % bleibt die -Mitte flach und nur die Enden führen weg. +*Die Tiefe kommt aus Licht, nicht aus Geometrie.* Quer über die Höhe liegt ein +Verlauf von `#F8C64A` über `#F1B729` nach `#D89F1B`, knapp unter der Oberkante +ein Glanzlicht, und zu beiden Enden hin dunkelt es um 20 % ab. Die untere +Längskante ist einen Pixel dicker als die obere, weil sie im Schatten der +Wölbung liegt. Die Form bleibt das Rechteck, das sie auf der Website ist. + +Zwei Anläufe davor haben stattdessen die Form verbogen: erst die Enden zur +Spitze verjüngt, dann um eine Knickstelle gekippt. Das erste sah aus wie eine +Schleife, das zweite wie eine Welle. Ein Absperrband ist flach und straff — +was ihm gefehlt hat, war Wölbung, nicht ein Knick. *Helm und Schrift stehen einmal, mittig auf der geraden Fläche.* Wiederholt und am linken Rand beginnend passte der Satz zu einem endlosen Band; auf einem, diff --git a/post6.html b/post6.html index 6c50b51..d7b3cc8 100644 --- a/post6.html +++ b/post6.html @@ -3332,35 +3332,44 @@ if (location.search.indexOf("nur=anim") >= 0) const bL = (W + 2 * UEBER - bh * Math.sin(bogen)) / Math.cos(bogen); const bA = (W - bL) / 2, bE = bA + bL; - // Wo geknickt wird, und wie stark die Enden zusammenlaufen. - const kL = bA + bL * 0.12, kR = bE - bL * 0.12; - const ein = bh * 0.10; // Verjuengung je Kante am Ende - const oT = ty, uT = ty + bh; // Ober- und Unterkante in der Mitte - const oA = ty + ein, uA = ty + bh - ein; // dieselben an der Spitze - - const flaeche = (x1, o1, u1, x2, o2, u2, f) => - ''; - + /* Die Tiefe kommt aus Licht und nicht aus Geometrie. Zwei Anlaeufe + haben die Form verbogen -- erst die Enden zur Spitze verjuengt, dann um + die Knickstelle gekippt. Beides sah nach Schleife oder Welle aus, weil + ein Absperrband nun einmal flach und straff ist. Was ihm gefehlt hat, + war Rundung: quer ueber die Hoehe ein Verlauf von hell nach dunkel, wie + auf einem Band, das leicht gewoelbt ueber der Flaeche liegt, und zu den + Enden hin ein Abdunkeln, weil sie weiter weg sind. Die Form bleibt das + Rechteck, das sie auf der Website ist. */ + const oT = ty, uT = ty + bh; + const gid = "bandLicht", eid = "bandEnden"; let band = - flaeche(bA, oA, uA, kL, oT, uT, WEB.bandKnick) + - flaeche(kL, oT, uT, kR, oT, uT, WEB.band) + - flaeche(kR, oT, uT, bE, oA, uA, WEB.bandKnick); + '' + + '' + + '' + + '' + + '' + + '' + + '' + + '' + + '' + + '' + + '' + + '' + + '' + + '' + + ''; - /* Die dunklen Laengskanten folgen dem Knick mit, sonst schwebten sie ueber - der Form. */ - const kante = (a1, a2, a3, a4) => - ''; - band += kante(oA, oT, oT, oA) + kante(uA, uT, uT, uA); - - // Die Knickkanten selbst: eine Spur dunkler als die Flaeche daneben. - [kL, kR].forEach(kx => { - band += ''; - }); + /* Die dunklen Laengskanten. Die untere sitzt eine Spur dicker: dort liegt + die Kante im Schatten der Woelbung. */ + band += ''; + band += ''; + // Ein heller Streifen knapp unter der Oberkante: das Glanzlicht. + band += ''; /* Schrift und Helm einmal, mittig auf der geraden Flaeche. Vorher lief der Satz wiederholt ueber das ganze Band und begann links am Rand --