Beide Projekte werden nicht mehr gebraucht. Weg sind post1-alt.html,
index.html und state/post2.json, dazu der lokale state/post1-alt.json.
Mitgezogen, damit nichts ins Leere zeigt: die Projektumschaltung im
Bedienfeld samt ihrer CSS-Regeln, die Projekttabelle und die Liste der
Stand-Dateien in der README, die Startzeile und der Aufbau in rules.md.
Achtung: Ohne index.html liefert http://127.0.0.1:4321/ nur noch die
Verzeichnisliste. Der Einstieg ist /post1.html.
Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Der Export staucht nicht mehr auf 1080 x 1350. Die Slide entstand bei
Renderqualitaet k longst in 1080k x 1350k und wurde unmittelbar vor dem
Speichern wieder heruntergerechnet -- eine Vorlage mit 2390 px kam so mit
916 px an, obwohl sie bereits in 2748 px gerendert vorlag. Gespeichert wird
jetzt, was gerendert wurde; bei 3x sind das 3240 x 4050. Die Statuszeile
nennt die Groesse, und wer exakt 1080 will, stellt die Stufe auf 1x.
Die Kontrolle vor dem Speichern hat ihren Zweck verfehlt. Sie prueft, ob
jede Bildflaeche im Ergebnis Pixel traegt, sah dafuer aber das
achsenparallele Umrechteck an. Die Szenen-Displays stehen per matrix3d
schraeg im Raum, in ihrem Umrechteck liegen Rasterlinien, Hintergrund und
das Nachbargeraet -- deren Kontrast reichte immer, um durchzukommen. Eine
Slide mit voellig leerem Display wurde deshalb stumm gespeichert.
Jetzt werden die echten vier Ecken ausgemessen (ueber 1-px-Marken, Chrome
kennt getBoxQuads nicht) und nur die Ueberlappung von Bild und Rahmen
abgetastet. Beides einzeln fuehrt in die Irre: das Szenen-Display ist
groesser als der sichtbare Ausschnitt, das Feature-Mockup umgekehrt. Die
Geraeterahmen stehen neu mit auf der Liste, geprueft ueber den aus der
Vorlage geeichten Dunkelanteil. Nachgestellt mit opacity 0: vorher still
gespeichert, jetzt Abbruch mit Nennung der Flaeche. 11 von 11 echten
Ausfuhren laufen ohne Fehlalarm und ohne Wiederholung durch.
Die Szenen-Screenshots fuellen ihr Display randlos. Sie lagen als kleinere
Rechtecke an handgemessenen Prozentwerten darin, die nicht aus der
Glasflaeche des Mockups stammten: 656 px blieben rechts frei, 470 px unten,
und die Werkzeugleiste des Boards verschwand oben trotzdem unter der
Blende. Weil Prozentwerte in translate() an der Bildkante haengen, loesten
Vorschau und Export sie unterschiedlich auf -- die Luecke war im Export
groesser als im Canvas. object-fit uebernimmt das jetzt, es bleibt kein
Versatz, der auseinanderlaufen koennte.
Dazu behoben: post1-alt.html konnte vier Laptop-Layouts und Slide 2
ueberhaupt nicht exportieren. workflow.png haengt an keiner Slide mehr und
fehlte in der Ladeliste, im Bild stand src="undefined".
Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Die Aufnahmen lagen auf dem Design-Rechteck des Smart-Objekts. Davon ist aber
nicht alles zu sehen: oben verdeckt die Blende des Deckels samt
Kameraaussparung, unten die Tastaturschale, rechts das davorstehende iPad.
Aus den Ecken geschaetzt kam oben 3,8 % heraus, tatsaechlich sind es 6,9 %,
und die Kopfzeile der Anwendung verschwand.
Jetzt wird gemessen: die Deckung der Screen-Ebene per Umkehr-Homographie in
den Design-Raum zurueckgerechnet, darin das groesste achsenparallele Rechteck
gesucht. Es misst 2726 x 1682 bei (74, 154), also 78,9 Prozent der Breite. Die
Aufnahme liegt darin zentriert eingepasst, nicht formatfuellend: nichts wird
abgeschnitten und nichts gezoomt.
Die freie Flaeche traegt den aus den Bildecken gemessenen Hintergrundton der
jeweiligen Aufnahme. Fuenf Stufen Unterschied reichen, damit sie sich als Rand
abzeichnet.
Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Drei Aenderungen am Generator, im selben Bereich der Datei verzahnt.
Notizzettel: die StickyNote aus dem Pitch-Projekt als HTML nachgebaut,
Variante purple, Farbwerte uebernommen und die Masse auf das 1080er Blatt
hochskaliert. Liegt auf der Workflow-Slide und ist wie jedes andere Element
verschiebbar.
Schatten: raus, ueberall. Kein box-shadow, kein drop-shadow. Tiefe entsteht
ueber Ueberlappung, Rahmenfarbe und Versatz. Der Umschalter faellt mit weg,
er haette nichts mehr zu schalten gehabt. Die Blaetter im Stapel-Rahmen
bekommen eine Haarlinie, sonst laege auf der hellen Variante Weiss auf Weiss.
Szenen-Mockup: Macbook Air und iPad Pro in Perspektive, aus einem Pixeden-PSD
freigestellt. Beide Displays sind ausgeknockt, die Screenshots liegen dahinter
und werden per matrix3d in die Flaechen projiziert. Die Eckpunkte sind
gemessen, nicht geschaetzt: beim Macbook aus dem transform_box des
Smart-Objekts, beim iPad ueber Ausgleichsgeraden auf den vier Glaskanten, weil
das Smart-Object dort zu hoch sitzt. Der Spalt zur weggefallenen Glasplatte
wird spaltenweise aus den Nachbarfarben interpoliert, damit am Displayrand
Schwarz und am Gehaeuse Metallic steht.
Das PSD selbst bleibt draussen: Pixeden erlaubt die Nutzung, nicht die
Weitergabe.
Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
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
dejanandClaude Opus 5
raffael