HiveGrid Social: Design-Library und Post-Generator

Autarke Werkbank für Social-Grafiken: Slides als HTML, Bearbeitung im Canvas,
Export als Instagram-taugliche PNGs.

- Assets nach brand/partner/mockups/screens sortiert, Karteileichen entfernt
- G-Marke als eigene Datei statt nur als Polygon im Code
- Partner-Logos und Geerkens-Logo ergänzt
- Keine externen Referenzen: Schrift, Bibliotheken und Bilder liegen lokal
This commit is contained in:
raffael committed 2026-08-01 18:36:18 +02:00
commit 124524482b
34 files changed
+6129

No files matched your search

+67
View File
@@ -0,0 +1,67 @@
# 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.