Werkstattbericht · Generative Reihe · Maierzone 2026
Was der Mzone Publisher für generative Arbeiten hergibt — und was beim Bauen von Morphogenesis, Dispersion Cathedral und Chladni tatsächlich wehgetan hat. Dreiundzwanzig Einträge, jeder aus einem konkreten Fehlschlag.
console.error im catch bleibt stehen.CONSOLE_ERROR, obwohl die Seite genau das tut, was sie soll.try/catch, im Fehlerfall den Ersatz zeigen — und im catch schweigen.
Jeder Fallstrick trägt das Zeichen der Arbeit, an der er gelernt wurde. Die
Kur-Zeile
ist der Fix, nichts sonst.
Fünf Bibliotheken liegen unter /lib/ — selbst gehostet, ohne CDN, ohne Netzabhängigkeit. Ein Bundle bindet sie mit relativen Pfaden ein und läuft offline im Prüf-Browser genauso wie im Netz.
| Bibliothek | Version | Einstieg |
|---|---|---|
| three | 0.170.0 | /lib/three@0.170.0/three.module.js |
| d3 | 7.9.0 | /lib/d3@7.9.0/d3.min.js |
| chart.js | 4.4.6 | /lib/chart.js@4.4.6/chart.umd.js |
| mzone-ui | 1.8.0 | /lib/mzone-ui@1.8.0/mzone.css |
| fonts-maierzone | 1.0.0 | Space Grotesk · Inter · Instrument Serif · IBM Plex Mono |
fonts.css vier selbst gehostete Familien (SIL OFL);
in mzone.css ist --mz-font nur ein
System-Stack. Für einen eigenen Auftritt beide Dateien verlinken — Instrument Serif
trägt Werktexte spürbar besser als der System-Serif.
fluidField, glass,
particleField, glyphRain,
dither, asciify … — für eigenständige
Arbeiten zu generisch. Eigenes GLSL schreiben; die Bibliothek nur fürs Gerüst
(mz-body, mz-page) und die
Barrierefreiheit (mz-sr-only) nutzen.
Vier eigenständige Profile stehen bereit. nightline — Petrol
#2F6F63, Gold #E8B34C, Surface
#14181B — ist als Ops-Dashboard gedacht, trägt aber als
Kunstpalette überraschend weit; alle drei bisherigen Arbeiten stehen darauf.
Die Profile sind laut Publisher ausdrücklich eine Basis, kein Regelwerk:
einzelne Tokens dürfen verstellt werden.
#CE6B44) für die Stufe error — genau die Freiheit,
die das Profil einräumt.
Dreiundzwanzig Einträge in fünf Gruppen. error heißt: der Render-Check schlägt an oder das Bild bleibt schwarz. warn heißt: es rendert, sieht aber falsch aus. info ist ein Kniff, der Arbeit spart.
FloatType mit linearer Filterung braucht eine Extension und ist nicht überall da.0.001; kleinere Simulationsschritte verschwinden ersatzlos.THREE.HalfFloatType. Schrittweiten nicht unter etwa 0.005.renderer.outputColorSpace = THREE.LinearSRGBColorSpace setzen und Farben direkt in sRGB schreiben.min(farbe, vec3(6.0)) am Ende jedes Strahlengangs.length(max(q, 0.0)) ist innerhalb des Rechtecks überall exakt null.length(max(q,0.0)) + min(max(q.x,q.y), 0.0) — der Innenterm fehlt sonst.class="mz-body" am <body> greifen Hintergrund und Grundschrift nicht.prefers-color-scheme: light — eine Arbeit braucht zwei Paletten.mz-body setzen. Erzwingen mit <html data-theme="light">; darauf per MutationObserver reagieren.mz--Klassen beim Publish.UNKNOWN_STYLE_CLASS statt gestyltem HTML.getCapabilities().styling. Eigene Klassen ohne mz--Präfix sind unproblematisch.verbosity: 'compact' Konsolenfehler und Erreichbarkeit weg — die erste Veröffentlichung lief blind.compact den vollen render-Block (clean, consoleErrors, findings) und die reachability weiter; weg fallen nur Datei-Liste, libReferences und INFO-Hinweise.verbosity: 'compact' darf jetzt von Anfang an gesetzt sein.console.error im catch bleibt stehen.CONSOLE_ERROR, obwohl die Seite sich korrekt verhält.try/catch, statischen Ersatz zeigen — und im catch nichts loggen.PAGE_EXCEPTION — auch wenn erst das 200. Bild betroffen ist.boot(); try { boot(); } catch {}. Den Schleifenkörper ebenso.publishArtifact nimmt je Datei contentBase64 mit encoding: 'br'.md5sum der ausgelieferten Datei gegen die lokale — die Übertragung läuft durch den Modellkontext.canonical und die og:/twitter:-Tags beim Ausliefern in den <head>.index.html ist immer länger als die lokale.md5sum vergleichen. Fürs HTML diff nehmen und sehen, dass nur der eingespritzte Block übrig bleibt. Oder die Injektion abschalten: metadataJson.socialPreview: false — dann ist die ausgelieferte index.html byte-gleich zur lokalen.MISSING_REFERENCE-Warnung des ersten Schritts ist dann erwartet.index.html publizieren, dann mit mode: 'patch' die app.js nachlegen — kein overwrite nötig, Unerwähntes bleibt.Was ein gebrochener Strahl beim Austritt findet, ist das Bild.
F·13 · EMPTY_ENVIRONMENT
render().renderer.autoClear = false; neue Puffer einmal von Hand mit renderer.clear(true, false, false) räumen.blendSrc: ZeroFactor, blendDst: SrcColorFactor → Ergebnis dst × srcColor, je Kanal ein eigener Abklingfaktor.v *= 0.88 verhält sich auf 30 und 144 fps völlig verschieden.v *= pow(damp, dt * 60.0) macht die Terminalgeschwindigkeit von der Bildrate unabhängig. Erst danach Parameter suchen.(now - start) / ms nehmen.Ein Faktor, der pro Bild wächst, misst die Hardware — nicht die Zeit.
F·18 · FADE_BY_FRAME
?q=0..3, das die Stufe festnagelt, macht die Prüfung im Headless-Browser überhaupt erst möglich.dispose().--use-gl=egl oder --use-angle=vulkan starten zwar, liefern aber kein WebGL 2.--virtual-time-budget; ein Bild kann eine Minute Realzeit brauchen.--virtual-time-budget laufen Dutzende Bilder, aber die Seitenzeit wächst kaum.?q= Stufe, ?m= Startmotiv, ?t=light|dark — je ein fester Einstieg, einzeln zu fotografieren.
HTTP 200 heißt nicht, dass WebGL etwas zeichnet. Für Konsolenfehler,
unbehandelte Ausnahmen und tote Ressourcen reicht der Publisher selbst:
validateArtifact
lädt die Preview in einem echten Browser und meldet
CONSOLE_ERROR /
PAGE_EXCEPTION /
RESOURCE_FAILED
schon vor dem Publish — publishArtifact ebenso, danach.
Ein eigener Browser bleibt für den visuellen Blick auf einen teuren
Shader nötig — und für wiki--Slugs,
wo der Render-Check hinter der Zugriffssperre entfällt. Der
chrome-devtools-MCP-Server
sucht Chrome unter /opt/google/chrome/chrome
und findet auf diesem Rechner nichts — installiert ist
/usr/bin/chromium. Direkt aufrufen:
chromium --headless=new --no-sandbox --disable-dev-shm-usage \ --hide-scrollbars --window-size=1280,800 \ --use-gl=angle --use-angle=swiftshader --enable-unsafe-swiftshader \ --enable-logging=stderr --v=0 \ --virtual-time-budget=9000 \ --screenshot=shot.png \ "https://publisher.maierzone.de/published/<slug>/" 2>console.log
--use-angle=swiftshader plus
--enable-unsafe-swiftshader
gibt WebGL 2 in Software — langsam, aber es rendert; auf diesem Rechner der einzige Weg.
--virtual-time-budget
lässt die Simulation vor dem Screenshot ein paar Sekunden laufen, sonst fotografiert man das Startrauschen.
console.log ist fast alles Chrome-Eigenrauschen
(PHONE_REGISTRATION_ERROR, D-Bus,
sqlite_persistent_store, Sandbox-Warnungen).
Danach filtern, sonst übersieht man den echten Fehler.
Jeder Fallstrick oben stammt aus einer dieser drei Arbeiten. Sie laufen live.
getCapabilities des Publishers — die maßgebliche SelbstbeschreibungsearchBranding — die vier ProfileWerkstattbericht zur generativen Reihe auf dem Mzone Publisher. Beschreibt den ausgelieferten Bibliotheks-Stack, die vier Branding-Profile und dreiundzwanzig konkrete Fallstricke beim Bauen von WebGL-Arbeiten — geordnet nach Präzision und Farbe, Publisher und Render-Check, Raum und Objekt, Akkumulation und Zeit sowie Headless-Prüfung.