# HiveGrid Social — Design-Library & Post-Generator Eigenständige Werkbank für HiveGrid-Social-Grafiken. Slides werden im Browser als HTML gebaut, im Canvas bearbeitet und pixelgenau als Instagram-taugliche PNGs exportiert. **Das Repo ist bewusst autark.** Keine CDN-Verweise, keine Google-Fonts zur Laufzeit, keine Pfade in andere Repos. Alles, was ein Post braucht — Schrift, Logos, Mockups, Screenshots, Bibliotheken — liegt hier. ## Starten ```sh ./serve.sh # http://127.0.0.1:4321 ``` Downloads landen direkt in `~/Downloads`, ohne Browser-Dialog. ## Projekte | Projekt | Datei | Inhalt | |---|---|---| | Post 1 · Lösung | `post1.html` | Carousel, 5 Slides | | Post 2 · Statement | `index.html` | Einzelbild | Oben im Bedienfeld wechselt man zwischen ihnen. **Jedes Projekt speichert seinen Stand** — Einstellungen, Layouts, Muster und alle Verschiebungen aus dem Canvas überleben einen Reload. „Projekt zurücksetzen" wirft ihn weg. ## Bedienung | Taste | Wirkung | |---|---| | `←` `→` | Slide wechseln (im Bearbeiten-Modus: Element verschieben) | | `E` | Bearbeiten an/aus | | `W` | Streifen ⇄ Einzelansicht | | `V` | Variante hell/dunkel | | `L` `M` `I` | Layout · Muster · Intensität | | `C` `G` `T` | Durchgehend · Tag-Ausrückung · Perspektive | | `D` `A` | Slide laden · alle als ZIP | Im Bearbeiten-Modus lassen sich Elemente ziehen, mit den Pfeiltasten pixelweise schieben (`⇧` = 10 px) und über `A−`/`A+` in der Größe ändern. ## Aufbau ``` assets/ ├── brand/ Wortmarke hell/dunkel, G-Marke (SVG + PNG), Wabe, Geerkens ├── partner/ DATEV, KWP, Google Calendar, Google Drive, MS Outlook, MS Teams ├── mockups/ Geräte-Mockups (Display ausgeknockt, Screenshot liegt dahinter) ├── screens/ Software-Screenshots └── fonts/ Manrope 400–800, lokal vendor/ html-to-image, JSZip serve.py Statischer Server + /save-Endpunkt rules.md Gestaltungsregeln, Farbwerte, Export-Wissen ``` ## Regeln **`rules.md` ist die Arbeitsgrundlage.** Farbwerte, Geometrie, Typografie, Layout-Template, Instagram-Export und die Liste der Fallen, in die wir schon getappt sind. Vor jeder Änderung an der Gestaltung dort nachsehen. Marken-Werte stammen aus der Website (`HiveGrid-Website`) und sind hier **gespiegelt**, nicht verlinkt. Ändert sich dort etwas, muss es hier nachgezogen werden.