Post 3: Verbinden statt ersetzen, ein Einzelbild mit dem Wabenfeld
Nummer 2 im Redaktionsplan, im Generator das dritte Projekt. Kein Carousel: eine Haltung, die man durchwischen muss, ist keine. Das Bild ist das Wabenfeld der Startseite, uebernommen aus HoneycombSection.tsx und nicht nachempfunden -- derselbe Umkreisradius, dieselbe Achsrechnung, dieselben Zellnummern. Damit stimmen WABE_MARKEN und HONEYCOMB_DEFAULT_LOGO_PLACEMENTS ueber dieselben Nummern ueberein. Die vier Waben "In Arbeit" sind raus: auf der Startseite ein Versprechen, im Feed ein Eingestaendnis. Der Ausschnitt ist enger als die Slide (880 statt 1080), das Feld also um 1,227 vergroessert -- ein Ring leerer Waben rundherum kostete nur Platz. Text mittig wie in post2-alt.html. Sechs der 14 Marken sind PNG und damit dieselbe Wette wie ein Screenshot (rules.md 7). wabenZonen() prueft sie deshalb einzeln nach: ein Punktraster ueber den ganzen Markenkasten, dessen Ecken das Gelb der Wabe tragen. Fehlt die Marke, ist der Kasten einfarbig und der Export wiederholt. Gegengetestet, indem DATEV absichtlich weggelassen wurde. Die sechs Zeichnungen von Post 2 sind aus der Kopie raus, 5237 auf 4270 Zeilen. Die Band-Maschinerie bleibt, laeuft bei einer Slide aber leer -- im Kommentar steht jetzt, dass ihre Stuetzpunkte an Post 2 geeicht sind. Nebenbei: uebersicht.html schrieb "1 Slides", faellt erst mit dem ersten Einzelbild auf. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
This commit is contained in:
dejanandClaude Opus 5 committed
1 parent
06479c54b3
commit
a5ec0c565e
16 files changed
+4469
-4
No files matched your search
@@ -23,6 +23,7 @@ Downloads landen direkt in `~/Downloads`, ohne Browser-Dialog.
|
||||
| Post 1 · Lösung | `post1.html` | Carousel, Anzahl frei | |
|
||||
| Post 2 · Die Geschichte | `post2.html` | Carousel, 6 Slides, erscheint 12.08. | [`POST-2.md`](./POST-2.md) |
|
||||
| Post 2 · Alternative | `post2-alt.html` | Derselbe Beitrag im Theme `modern` | |
|
||||
| Post 3 · Verbinden statt ersetzen | `post3.html` | Einzelbild, Theme `modern`, erscheint 17.08. | |
|
||||
|
||||
**Alle Streifen nebeneinander** zeigt `uebersicht.html`, erreichbar über
|
||||
*Projekt → Alle Projekte im Streifen*. Die Seite baut die Slides nicht selbst
|
||||
@@ -42,6 +43,18 @@ Beide zeigen denselben Beitrag mit denselben Texten.
|
||||
Die Themes stehen in [`rules.md`](./rules.md) §1a mit ihren Unterschieden.
|
||||
Wer eine Visualisierung ändert, muss an beide Dateien denken.
|
||||
|
||||
**Post 3 ist ein Einzelbild**, keine Slidefolge: eine Haltung, die man
|
||||
durchwischen muss, ist keine. Sein Bild ist das **Wabenfeld der Startseite**,
|
||||
nachgebaut aus `HoneycombSection.tsx` — dieselbe Achsrechnung, dieselben
|
||||
Zellnummern, dieselbe Belegung, damit es wiedererkennbar bleibt und keine
|
||||
Anmutung davon ist. Die vier Waben „In Arbeit" fehlen: auf der Startseite sind
|
||||
sie ein Versprechen, im Beitrag wären sie ein Eingeständnis.
|
||||
|
||||
Die vierzehn Partner-Marken liegen unter `assets/partner/` und sind, wie alles
|
||||
andere hier, aus der Website **gespiegelt statt verlinkt**. Sechs davon sind
|
||||
PNG und damit dieselbe Wette wie ein Screenshot (§7 in `rules.md`), deshalb
|
||||
prüft der Export sie einzeln nach — `wabenZonen()` in `post3.html`.
|
||||
|
||||
Der Redaktionsplan für alle weiteren Beiträge liegt in
|
||||
[`redaktionsplan/`](./redaktionsplan/), gebaut mit `python3 redaktionsplan/bauen.py`.
|
||||
|
||||
@@ -169,7 +182,9 @@ Maßstab zurück.
|
||||
```
|
||||
assets/
|
||||
├── brand/ Wortmarke hell/dunkel, G-Marke (SVG + PNG), Wabe, Geerkens
|
||||
├── partner/ DATEV, KWP, Google Calendar, Google Drive, MS Outlook, MS Teams
|
||||
├── partner/ die 14 Marken des Wabenfelds (DATEV, KWP, pds, Bauhow, Aircall,
|
||||
│ Onepage, PandaDoc, Hallo Petra, Claude, OpenAI, Google Drive,
|
||||
│ Google Calendar, MS Outlook, MS Teams)
|
||||
├── mockups/ Geräte-Mockups (Displays ausgeknockt, Screenshot liegt dahinter)
|
||||
├── screens/ Software-Screenshots
|
||||
├── eigene/ selbst importierte Bilder
|
||||
|
||||
@@ -0,0 +1,31 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- Generator: Adobe Illustrator 23.0.3, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
viewBox="0 0 302 302" style="enable-background:new 0 0 302 302;" xml:space="preserve">
|
||||
<style type="text/css">
|
||||
.st0{fill-rule:evenodd;clip-rule:evenodd;fill:#00B388;}
|
||||
.st1{fill:#FFFFFF;}
|
||||
</style>
|
||||
<title>grid</title>
|
||||
<desc>Created with Sketch.</desc>
|
||||
<g id="book">
|
||||
<g id="slide_07" transform="translate(-230.000000, -233.000000)">
|
||||
<g id="logo" transform="translate(230.000000, 233.000000)">
|
||||
<g id="icon" transform="translate(51.000000, 51.000000)">
|
||||
<g id="bg">
|
||||
<path class="st0" d="M150.8,4.3C139.5,1.7,121,0,100,0S60.5,1.7,49.2,4.3C26.7,9,9,26.7,4.3,49.2C1.7,60.5,0,79,0,100
|
||||
s1.7,39.5,4.3,50.8C9,173.3,26.7,191,49.2,195.7C60.5,198.3,79,200,100,200s39.5-1.7,50.8-4.3c22.5-4.7,40.2-22.4,44.9-44.9
|
||||
c2.6-11.3,4.3-29.8,4.3-50.8s-1.7-39.5-4.3-50.8C191,26.7,173.3,9,150.8,4.3z"/>
|
||||
</g>
|
||||
<path id="Path" class="st1" d="M124,153.5c-1.9-4.5-5.9-7.9-10.8-8.9c-2.9-0.7-7.8-1.1-13.2-1.1s-10.3,0.4-13.2,1.1
|
||||
c-4.9,1-8.9,4.4-10.8,8.9l0,0l0,0c-0.7,1.6-2.3,2.5-3.9,2.3c-0.4,0-0.8-0.1-1.1-0.1c-7.8-0.8-14-1.9-17.6-3.1l0,0
|
||||
c-2.4-0.9-4.1-3.2-4.1-5.9c0-0.1,0-0.1,0-0.2c0-0.1,0-0.2,0-0.3v-0.1c0-0.1,0-0.1,0-0.2c0.6-8.2,5.6-27.3,13-49.1
|
||||
c8.5-24.9,17.3-45.1,21.3-49.1l0,0c0.6-0.7,1.4-1.2,2.2-1.6c0.3-0.2,0.7-0.4,1.2-0.5l0,0c2.6-0.9,7.5-1.5,13-1.5l0,0
|
||||
c5.5,0,10.4,0.6,13,1.5l0,0l0,0c0.5,0.2,0.9,0.3,1.2,0.5c0.8,0.4,1.5,1,2.2,1.6l0,0c4,3.9,12.8,24.1,21.3,49.1
|
||||
c7.4,21.8,12.4,40.9,13,49.1c0,0.1,0,0.1,0,0.2v0.1c0,0.1,0,0.2,0,0.3s0,0.1,0,0.2c0,2.7-1.7,5-4.1,5.9l0,0
|
||||
c-3.6,1.3-9.7,2.4-17.6,3.1c-0.3,0-0.8,0.1-1.2,0.1l0,0C126.2,155.9,124.7,155,124,153.5L124,153.5z"/>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 23 KiB |
@@ -0,0 +1,16 @@
|
||||
<svg width="128" height="128" viewBox="0 0 128 128" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_2124_86)">
|
||||
<rect width="128" height="128" rx="30" fill="url(#paint0_linear_2124_86)"/>
|
||||
<rect opacity="0.35" width="128" height="128" fill="#D97757"/>
|
||||
<path d="M35.0157 79.6937L53.4322 69.3667L53.7357 68.4622L53.4322 67.9585H52.5215L49.4352 67.7708L38.9115 67.4891L29.8045 67.1136L20.9504 66.6442L18.7243 66.1748L16.6499 63.4053L16.8523 62.044L18.7243 60.7766L21.4058 61.0113L27.3254 61.4337L36.23 62.044L42.6555 62.4195L52.2179 63.4053H53.7357L53.9381 62.795L53.4322 62.4195L53.0274 62.044L43.8192 55.8008L33.8521 49.2291L28.6408 45.4269L25.8581 43.5024L24.4415 41.7186L23.8343 37.7756L26.3641 34.9591L29.8045 35.1938L30.6646 35.4285L34.1556 38.1042L41.593 43.8779L51.3072 51.0129L52.7239 52.1864L53.2943 51.8014L53.3816 51.5292L52.7239 50.4496L47.462 40.9206L41.846 31.2039L39.3163 27.1669L38.6586 24.773C38.4038 23.7683 38.2538 22.9371 38.2538 21.9096L41.1377 17.9665L42.7567 17.4502L46.6525 17.9665L48.2715 19.3748L50.7001 24.9138L54.5958 33.5978L60.6672 45.4269L62.438 48.9475L63.3993 52.1864L63.7535 53.1722H64.3606V52.6089L64.8666 45.9433L65.7773 37.7756L66.688 27.2608L66.9915 24.3036L68.4588 20.7361L71.3933 18.8115L73.67 19.8911L75.542 22.5667L75.289 24.3036L74.176 31.5324L72.0004 42.8452L70.5837 50.4496H71.3933L72.3546 49.4638L76.1997 44.3942L82.6252 36.3204L85.4585 33.1284L88.7978 29.6079L90.9228 27.918H94.9703L97.9048 32.3304L96.5894 36.8837L92.4406 42.1411L89.0002 46.6004L84.0672 53.2095L81.0062 58.5234L81.2807 58.9618L82.0181 58.8989L93.1489 56.505L99.1697 55.4253L106.354 54.2049L109.592 55.707L109.946 57.256L108.681 60.401L100.991 62.2787L91.9853 64.1094L78.5744 67.2664L78.4259 67.3858L78.6012 67.6458L84.649 68.1932L87.2294 68.334H93.5537L105.342 69.2259L108.428 71.2444L110.25 73.7322L109.946 75.6568L105.19 78.0508L98.8155 76.5487L83.8901 72.9812L78.7801 71.7138H78.0717V72.1362L82.3217 76.314L90.1639 83.3551L99.9286 92.4616L100.435 94.7148L99.1697 96.4985L97.8542 96.3108L89.2532 89.8329L85.9139 86.9226L78.4259 80.5856H77.92V81.2428L79.6402 83.7776L88.7978 97.5312L89.2532 101.756L88.5954 103.117L86.2175 103.962L83.6371 103.493L78.2235 95.9352L72.7087 87.4859L68.2564 79.8815L67.7187 80.221L65.0689 108.515L63.8547 109.971L61.0214 111.05L58.6434 109.266L57.3786 106.356L58.6434 100.582L60.1613 93.0719L61.3755 87.1104L62.4886 79.6937L63.1684 77.2161L63.1083 77.0503L62.5653 77.1416L56.9738 84.8103L48.4739 96.3108L41.7448 103.493L40.1258 104.15L37.3431 102.695L37.5961 100.113L39.1645 97.8129L48.4739 85.9838L54.0899 78.6141L57.7094 74.3837L57.6742 73.7718L57.4744 73.7548L32.739 89.8799L28.3373 90.4432L26.4147 88.6594L26.6676 85.7491L27.5783 84.8103L35.0157 79.6937Z" fill="#FAF9F5"/>
|
||||
</g>
|
||||
<defs>
|
||||
<linearGradient id="paint0_linear_2124_86" x1="52.5" y1="128" x2="52.5" y2="0" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#DC6038"/>
|
||||
<stop offset="1" stop-color="#D97757"/>
|
||||
</linearGradient>
|
||||
<clipPath id="clip0_2124_86">
|
||||
<rect width="128" height="128" rx="30" fill="white"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 74 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 6.1 KiB |
@@ -0,0 +1,6 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="146 226 269 267" role="img" aria-label="OpenAI">
|
||||
<rect x="146" y="226" width="269" height="267" rx="62" fill="#111111"/>
|
||||
<g transform="translate(280.5 359.5) scale(.82) translate(-280.5 -359.5)">
|
||||
<path d="M249.176 323.434V298.276C249.176 296.158 249.971 294.569 251.825 293.509L302.406 264.381C309.29 260.409 317.5 258.555 325.973 258.555C357.75 258.555 377.877 283.185 377.877 309.399C377.877 311.253 377.877 313.371 377.611 315.49L325.178 284.771C322.001 282.919 318.822 282.919 315.645 284.771L249.176 323.434ZM367.283 421.415V361.301C367.283 357.592 365.694 354.945 362.516 353.092L296.048 314.43L317.763 301.982C319.617 300.925 321.206 300.925 323.058 301.982L373.639 331.112C388.205 339.586 398.003 357.592 398.003 375.069C398.003 395.195 386.087 413.733 367.283 421.412V421.415ZM233.553 368.452L211.838 355.742C209.986 354.684 209.19 353.095 209.19 350.975V292.718C209.19 264.383 230.905 242.932 260.301 242.932C271.423 242.932 281.748 246.641 290.49 253.26L238.321 283.449C235.146 285.303 233.555 287.951 233.555 291.659V368.455L233.553 368.452ZM280.292 395.462L249.176 377.985V340.913L280.292 323.436L311.407 340.913V377.985L280.292 395.462ZM300.286 475.968C289.163 475.968 278.837 472.259 270.097 465.64L322.264 435.449C325.441 433.597 327.03 430.949 327.03 427.239V350.445L349.011 363.155C350.865 364.213 351.66 365.802 351.66 367.922V426.179C351.66 454.514 329.679 475.965 300.286 475.965V475.968ZM237.525 416.915L186.944 387.785C172.378 379.31 162.582 361.305 162.582 343.827C162.582 323.436 174.763 305.164 193.563 297.485V357.861C193.563 361.571 195.154 364.217 198.33 366.071L264.535 404.467L242.82 416.915C240.967 417.972 239.377 417.972 237.525 416.915ZM234.614 460.343C204.689 460.343 182.71 437.833 182.71 410.028C182.71 407.91 182.976 405.792 183.238 403.672L235.405 433.863C238.582 435.715 241.763 435.715 244.938 433.863L311.407 395.466V420.622C311.407 422.742 310.612 424.331 308.758 425.389L258.179 454.519C251.293 458.491 243.083 460.343 234.611 460.343H234.614ZM300.286 491.854C332.329 491.854 359.073 469.082 365.167 438.892C394.825 431.211 413.892 403.406 413.892 375.073C413.892 356.535 405.948 338.529 391.648 325.552C392.972 319.991 393.766 314.43 393.766 308.87C393.766 271.003 363.048 242.666 327.562 242.666C320.413 242.666 313.528 243.723 306.644 246.109C294.725 234.457 278.307 227.042 260.301 227.042C228.258 227.042 201.513 249.815 195.42 280.004C165.761 287.685 146.694 315.49 146.694 343.824C146.694 362.362 154.638 380.368 168.938 393.344C167.613 398.906 166.819 404.467 166.819 410.027C166.819 447.894 197.538 476.231 233.024 476.231C240.172 476.231 247.058 475.173 253.943 472.788C265.859 484.441 282.278 491.854 300.286 491.854Z" fill="#FFFFFF"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.7 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.5 KiB |
@@ -0,0 +1,30 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 1181.705 585.818" role="img" aria-labelledby="pds-title">
|
||||
<title id="pds-title">pds</title>
|
||||
<g>
|
||||
<defs>
|
||||
<path id="pds-swoosh-left" d="M772.086 206.642l-105.035 8.411c45.016 41.834 87.543 75.766 127.371 102.59 27.018 8.992 62.736 12.163 104.491-4.697-30.703-25.227-50.565-48.661-86.763-88.302-16.24-17.811-39.056-18.002-40.03-18.002h-.034z"/>
|
||||
<clipPath id="pds-swoosh-left-clip">
|
||||
<use xlink:href="#pds-swoosh-left"/>
|
||||
</clipPath>
|
||||
<linearGradient id="pds-swoosh-left-gradient" x1="452.9609" x2="458.5785" y1="234.8403" y2="234.8403" gradientTransform="matrix(38.4954 22.2253 22.2253 -38.4954 -21983.3574 -822.2328)" gradientUnits="userSpaceOnUse">
|
||||
<stop offset="0" stop-color="#d50a3b"/>
|
||||
<stop offset=".2" stop-color="#d50a3b"/>
|
||||
<stop offset=".8" stop-color="#94190e"/>
|
||||
<stop offset="1" stop-color="#94190e"/>
|
||||
</linearGradient>
|
||||
<path id="pds-swoosh-right" d="M982.978 254.984c-78.122 76.53-144.787 77.232-188.556 62.659 44.006 27.159 103.202 56.553 159.283 60.762.938.077 1.883.125 2.826.158h5.46c80.146-2.82 188.527-127.453 213.695-229.967.229-.959.471-1.854.691-2.751 0-.051 0-.095.017-.219 5.311-21.627-2.354-38.337-6.048-44.743C1150.984 70.19 1109.181 0 1109.181 0c-7.671 61.885-53.602 183.874-126.203 254.984z"/>
|
||||
<clipPath id="pds-swoosh-right-clip">
|
||||
<use xlink:href="#pds-swoosh-right"/>
|
||||
</clipPath>
|
||||
<linearGradient id="pds-swoosh-right-gradient" x1="453.6846" x2="459.3051" y1="233.9976" y2="233.9976" gradientTransform="matrix(68.3072 0 0 -68.3072 -30195.5273 16172.9473)" gradientUnits="userSpaceOnUse">
|
||||
<stop offset="0" stop-color="#d50a3b"/>
|
||||
<stop offset=".3" stop-color="#d50a3b"/>
|
||||
<stop offset=".9" stop-color="#ea9893"/>
|
||||
<stop offset="1" stop-color="#ea9893"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
<polygon fill="url(#pds-swoosh-left-gradient)" points="725.021 106.244 952.239 237.433 840.945 430.206 613.72 299.015" clip-path="url(#pds-swoosh-left-clip)"/>
|
||||
<rect width="387.283" height="378.563" x="794.422" fill="url(#pds-swoosh-right-gradient)" clip-path="url(#pds-swoosh-right-clip)"/>
|
||||
</g>
|
||||
<path fill="#575656" d="M586.085 451.803c0-19.771-4.644-39.134-37.172-58.887l-50.756-30.985c-9.664-5.829-15.493-9.682-15.493-15.886 0-11.999 8.147-16.276 26.733-16.276 22.063 0 53.058 3.085 63.914 4.652h1.551c3.878 0 6.196-2.709 6.196-7.38v-22.438c0-4.662-2.318-7.764-6.979-8.914-19.754-4.262-37.556-7.772-68.942-7.772-49.197 0-73.595 19.396-73.595 58.128 0 22.464 13.558 41.825 32.537 53.45l53.066 32.536c12.399 7.737 17.053 12.408 17.053 19.771 0 10.447-3.486 18.577-27.5 18.577-11.641 0-46.496-1.926-65.099-4.262h-1.543c-3.869 0-6.596 3.103-6.596 6.205v23.247c0 4.652 2.727 7.755 7.372 8.896 21.688 5.813 54.225 7.772 69.334 7.772 50.756 0 75.939-26.742 75.939-60.437M341.66 467.67c-7.363 1.551-23.248 2.71-37.189 2.71-33.321 0-41.433-23.623-41.433-55.393v-29.826c0-31.753 8.112-55.393 41.433-55.393 9.297 0 26.35 1.177 37.189 2.727zm51.132 24.032V222.069c0-4.261-3.485-7.729-7.746-7.729h-35.639c-4.261 0-7.747 3.469-7.747 7.729v68.576c-14.334-1.942-27.892-2.728-37.189-2.728-62.363 0-92.59 36.807-92.59 97.244v29.826c0 60.421 30.227 97.252 92.59 97.252 24.798 0 53.858-3.886 77.873-10.09 8.897-2.334 10.448-4.651 10.448-10.447M129.763 414.988c0 31.77-8.13 55.393-41.451 55.393-9.297 0-26.333-1.159-37.189-2.71V332.496c7.363-1.55 23.248-2.727 37.189-2.727 33.321 0 41.451 23.64 41.451 55.393zm51.14 0v-29.826c0-60.438-30.21-97.244-92.591-97.244-24.782 0-53.841 3.895-77.856 10.09C1.534 300.326 0 302.653 0 308.463V578.08c0 4.244 3.477 7.738 7.729 7.738h35.665c4.252 0 7.729-3.494 7.729-7.738v-68.566c14.326 1.926 27.892 2.727 37.189 2.727 62.381 0 92.591-36.831 92.591-97.252"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.8 KiB |
@@ -793,6 +793,7 @@ if (location.search.indexOf("nur=streifen") >= 0)
|
||||
<button type="button" data-gehe="./post1.html">Post 1</button>
|
||||
<button type="button" data-gehe="./post2.html">Post 2</button>
|
||||
<button type="button" data-gehe="./post2-alt.html">Post 2 · Alternative</button>
|
||||
<button type="button" data-gehe="./post3.html">Post 3 · Verbinden statt ersetzen</button>
|
||||
<hr>
|
||||
<button type="button" data-gehe="./uebersicht.html">Alle Projekte im Streifen</button>
|
||||
<hr>
|
||||
|
||||
@@ -991,6 +991,7 @@ if (location.search.indexOf("nur=streifen") >= 0)
|
||||
<button type="button" data-gehe="./post1.html">Post 1</button>
|
||||
<button type="button" data-gehe="./post2.html">Post 2</button>
|
||||
<button type="button" data-gehe="./post2-alt.html">Post 2 · Alternative</button>
|
||||
<button type="button" data-gehe="./post3.html">Post 3 · Verbinden statt ersetzen</button>
|
||||
<hr>
|
||||
<button type="button" data-gehe="./uebersicht.html">Alle Projekte im Streifen</button>
|
||||
<hr>
|
||||
|
||||
@@ -884,6 +884,7 @@ if (location.search.indexOf("nur=streifen") >= 0)
|
||||
<button type="button" data-gehe="./post1.html">Post 1</button>
|
||||
<button type="button" data-gehe="./post2.html">Post 2</button>
|
||||
<button type="button" data-gehe="./post2-alt.html">Post 2 · Alternative</button>
|
||||
<button type="button" data-gehe="./post3.html">Post 3 · Verbinden statt ersetzen</button>
|
||||
<hr>
|
||||
<button type="button" data-gehe="./uebersicht.html">Alle Projekte im Streifen</button>
|
||||
<hr>
|
||||
|
||||
+4286
File diff suppressed because it is too large.
Load diff
@@ -1,7 +1,7 @@
|
||||
# Post-Generator — Regeln & Konventionen
|
||||
|
||||
Arbeitsgrundlage für alles, was in diesem Repo an Social-Grafiken entsteht.
|
||||
**Stand:** 31.07.2026
|
||||
**Stand:** 15.08.2026
|
||||
|
||||
Der Generator läuft lokal: `./serve.sh` → <http://127.0.0.1:4321/post1.html>
|
||||
(Post 1, Carousel).
|
||||
@@ -20,6 +20,7 @@ Alle Marken-Werte stammen aus der Website, nicht aus diesem Repo. Bei Zweifel
|
||||
| Schrift | `HiveGrid-Website/app/layout.tsx` |
|
||||
| Badge-Styling | `HiveGrid-Website/components/sections/ScreenshotAccordion.tsx` |
|
||||
| Feature-Texte | `HiveGrid-Website/app/playground/PlaygroundClient.tsx` → `solutionModules` |
|
||||
| Wabenfeld: Geometrie, Zellnummern, Belegung | `HiveGrid-Website/components/landing/HoneycombSection.tsx` |
|
||||
|
||||
Die Werte sind hier gespiegelt, weil der Export keine Tailwind-/oklch-Farben
|
||||
verträgt (siehe §7). Ändert sich die Website, müssen sie **hier nachgezogen
|
||||
@@ -42,7 +43,7 @@ und Kompositionen der Visualisierungen.
|
||||
| Theme | Erkennungszeichen | Datei |
|
||||
|---|---|---|
|
||||
| `notebook` | Rasterhintergrund, Zeichenblock-Optik, Marker in der Überschrift, handgezogene Formen | `post2.html` |
|
||||
| `modern` | Ruhiger Grund ohne Textur, sehr große Überschrift mit einem farbigen Wort, schwebende Karten mit Haarlinie, präzise Formen | `post2-alt.html` |
|
||||
| `modern` | Ruhiger Grund ohne Textur, sehr große Überschrift mit einem farbigen Wort, schwebende Karten mit Haarlinie, präzise Formen | `post2-alt.html`, `post3.html` |
|
||||
|
||||
Jede Datei trägt oben eine Konstante `THEME`. Sie steuert nichts, sie benennt
|
||||
nur — die Unterschiede stecken in den CSS-Werten und in den Zeichen-Primitiven.
|
||||
@@ -255,6 +256,38 @@ Spalten um ¾ der Breite, benachbarte Spalten sitzen eine halbe Reihe versetzt.
|
||||
Eine Kachel = zwei Spalten breit, eine Reihe hoch. **Die über den Kachelrand
|
||||
hinausragenden Kopien sind Pflicht** — ohne sie sieht man die Nähte.
|
||||
|
||||
### Wabenfeld
|
||||
|
||||
Nicht zu verwechseln mit dem Wabenraster: das ist die Textur im Hintergrund,
|
||||
das Wabenfeld ist die **Grafik von der Startseite** — die Marke als Nabe, die
|
||||
fremden Programme als Waben darum, verbunden über Stränge. Sie steht in
|
||||
`post3.html` als `visWabenfeld()` und ist aus `HoneycombSection.tsx`
|
||||
übernommen, nicht nachempfunden:
|
||||
|
||||
| | Wert | Warum genau der |
|
||||
|---|---|---|
|
||||
| Umkreisradius | 62 | alles andere leitet sich davon ab |
|
||||
| Flächenfaktor | 0,84 | lässt die Fuge zwischen zwei Waben offen |
|
||||
| Achsrechnung | `x = 1,5·R·q`, `y = √3·R·(r + q/2)` | flat-top |
|
||||
| Zellnummern | 1 Nabe, 2–7 innerer Ring, 8–19 Deko-Ring, dann das Feld | die Belegung hängt daran |
|
||||
| Marken-Größe | sichtbar 56,5 px | Claude und OpenAI sind die Eichmarken |
|
||||
|
||||
**Die Zellnummern sind die Schnittstelle.** Welche Marke wo sitzt, steht auf
|
||||
der Website in `HONEYCOMB_DEFAULT_LOGO_PLACEMENTS` und hier in `WABE_MARKEN`,
|
||||
beide über dieselben Nummern. Wer den Ringgang in `wabeRing()` umstellt,
|
||||
verschiebt damit stillschweigend jede Marke.
|
||||
|
||||
**Eine Marke wird über zwei Zahlen eingepasst**, nicht über eine: die
|
||||
Grundfläche ihres Renderpfads (Feld 59,52 px, Deko 50,44 px) mal ihre eigene
|
||||
Skalierung. Das Verhältnis 1,18 zwischen beiden Pfaden stammt aus der Website
|
||||
und ist der Grund, warum dieselbe sichtbare Größe zwei verschiedene Faktoren
|
||||
braucht. Für eine neue Marke gilt: `gr = Grundfläche / Anteil, den die Datei in
|
||||
ihrer eigenen Fläche ausfüllt` — eine Datei mit Luft ringsum braucht mehr.
|
||||
|
||||
**Die vier Waben „In Arbeit" gehören nicht in einen Beitrag.** Auf der
|
||||
Startseite sind sie ein Versprechen, im Feed wären sie ein Eingeständnis. Es
|
||||
sind die Zellen 29, 41, 46 und 59, und sie bleiben gewöhnliche leere Waben.
|
||||
|
||||
---
|
||||
|
||||
## 4. Typografie
|
||||
|
||||
@@ -0,0 +1,39 @@
|
||||
{
|
||||
"bandTon": "orange",
|
||||
"bgState": [
|
||||
{
|
||||
"bg": "raster",
|
||||
"int": "dezent"
|
||||
}
|
||||
],
|
||||
"current": 0,
|
||||
"deck": [
|
||||
{
|
||||
"ref": "verbinden",
|
||||
"werte": {}
|
||||
}
|
||||
],
|
||||
"edits": [
|
||||
{
|
||||
"body": {
|
||||
"dx": 33
|
||||
},
|
||||
"headline": {
|
||||
"dx": 0,
|
||||
"dy": 0
|
||||
}
|
||||
}
|
||||
],
|
||||
"frameStyle": "chamfer",
|
||||
"layoutState": [
|
||||
"standard"
|
||||
],
|
||||
"rasterAn": "aus",
|
||||
"superSample": 2,
|
||||
"tagOut": "an",
|
||||
"textMitte": "an",
|
||||
"tilt": "an",
|
||||
"v": 7,
|
||||
"variant": "hell",
|
||||
"view": "streifen"
|
||||
}
|
||||
+7
-1
@@ -106,6 +106,7 @@
|
||||
<button type="button" data-gehe="./post1.html">Post 1 · Lösung</button>
|
||||
<button type="button" data-gehe="./post2.html">Post 2 · Die Geschichte</button>
|
||||
<button type="button" data-gehe="./post2-alt.html">Post 2 · Alternative</button>
|
||||
<button type="button" data-gehe="./post3.html">Post 3 · Verbinden statt ersetzen</button>
|
||||
<hr>
|
||||
<button type="button" data-klick="neu">Streifen neu laden</button>
|
||||
</div>
|
||||
@@ -129,6 +130,7 @@
|
||||
{ datei: "./post1.html", name: "Post 1 · Lösung" },
|
||||
{ datei: "./post2.html", name: "Post 2 · Die Geschichte", theme: "notebook" },
|
||||
{ datei: "./post2-alt.html", name: "Post 2 · Alternative", theme: "modern" },
|
||||
{ datei: "./post3.html", name: "Post 3 · Verbinden statt ersetzen", theme: "modern" },
|
||||
];
|
||||
|
||||
const flaeche = document.getElementById("flaeche");
|
||||
@@ -194,7 +196,11 @@
|
||||
const offen = reihen.filter(r => r.da).length;
|
||||
meta.textContent = offen < reihen.length
|
||||
? "Lade Streifen ... " + offen + " von " + reihen.length
|
||||
: reihen.length + " Projekte · " + reihen.map(r => Math.round(r.w / 1080) + " Slides").join(" · ");
|
||||
// Seit Post 3 gibt es Einzelbilder: "1 Slides" stand vorher da.
|
||||
: reihen.length + " Projekte · " + reihen.map(r => {
|
||||
const n = Math.round(r.w / 1080);
|
||||
return n + (n === 1 ? " Slide" : " Slides");
|
||||
}).join(" · ");
|
||||
}
|
||||
|
||||
// Kein Ziehen, kein Rad-Zoom: die Seite scrollt wie eine gewoehnliche Seite.
|
||||
|
||||
Reference in new issue
Block a user