Das blanke Rad zoomt jetzt, die linke Maustaste zieht die Flaeche. Eine
gewoehnliche PC-Maus kam vorher nicht an den Ausschnitt heran: Zoomen ging
nur mit Strg/Cmd, Schieben nur ueber Leertaste oder mittlere Taste.
Die Radschritte laufen exponentiell ueber deltaY statt in festen Spruengen,
mit Umrechnung der deltaMode-Einheiten -- ohne die zoomt Firefox pro Rastung
um ein Vielfaches weniger als Chrome. Waagerechtes Wischen und Shift+Rad
schieben weiter, damit sich ein Trackpad nicht wie eine Zoomwippe anfuehlt.
Im Bearbeiten-Modus behaelt das Element unter dem Zeiger die linke Taste.
Nach einem echten Zug wird der Klick geschluckt, sonst sprang die Auswahl
auf die Slide, ueber der die Maus zufaellig losliess.
Dabei zwei aeltere Fehler mitgenommen:
setZoom rechnete den Zeigerpunkt per Dreisatz auf scrollLeft hoch und
uebersah das Polster der Flaeche. Der Inhalt lief pro Schritt um 60 x
(Faktor-1) px weg. Der Punkt wird jetzt gemessen statt gerechnet.
Der Bearbeiten-Zug leitete seinen Massstab aus der Border-Box von .strip ab.
Die misst Breite mal Massstab hoch zwei, weil .strip ein Flex-Kind der schon
skalierten Huelle ist -- geteilt wurde also durch das Quadrat, das Element
wanderte bei eingepasster Ansicht um das 5,6-fache der Mausbewegung.
Geprueft mit echten Rad- und Zieh-Ereignissen ueber das DevTools-Protokoll,
15 Pruefungen gegen beide Dateien.
Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Der Stand hing am localStorage und damit an einem Rechner. Wer das Projekt
woanders zog, sah einen anderen Stand.
Jede Aenderung geht jetzt zusaetzlich in state/<projekt>.json, gebuendelt nach
600 ms. Beim Laden gewinnt die Datei, der localStorage ist nur noch der
Rueckfall fuer den Fall, dass der Server nicht laeuft. Gibt es die Datei noch
nicht, wird der vorhandene Browser-Stand einmalig hineingeschrieben. Ein
Reload verschluckt nichts: was im Timer haengt, geht per sendBeacon raus.
Der Server nimmt den Stand unter POST /state entgegen und loescht ihn unter
DELETE /state. Der Projektname wird gegen ein enges Muster geprueft und der
Zielpfad zusaetzlich gegen state/ gegengerechnet. Geschrieben wird erst in
eine Nebendatei und dann umbenannt, eingerueckt und mit sortierten Schluesseln,
damit git einen lesbaren Unterschied zeigt.
state/*.json gehoeren ab jetzt in jeden Commit, sonst sieht die andere
Maschine die Aenderung nicht.
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>
Kopie von Post 1, in der die Workflow-Engine nicht als Screenshot liegt,
sondern als HTML gebaut wird: Ablauf-Knoten und Bausteinliste kommen aus
einer Datenstruktur statt aus einer Aufnahme. Damit bleiben Kanten und Schrift
beim Export scharf, und es gibt keine Scrollbalken oder Cursor-Reste im Bild.
Kanban, Chat und Form Builder liegen dort weiter als Screenshot.
Die Projektnavigation traegt den dritten Eintrag.
Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Kanban-Board, Workflow-Ablauf und Chat neu aufgenommen, dazu vier Ausschnitte,
die eine zweite Ebene je Slide tragen: Projekt-Detail, Listenansicht,
Bausteinliste und Anhang-Menue. Der Chat kommt zusaetzlich hochkant fuer das
Tablet-Display.
Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Screenshots werden hier laufend unter gleichem Dateinamen ausgetauscht. Der
Browser hat dann die alte Fassung gezeigt, obwohl die Datei auf der Platte
schon die neue war. Das ist ein Werkzeug, kein Auslieferungsserver: ein
erneuter Ladevorgang kostet weniger als die Suche nach dem Grund.
Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Der Generator ist von einer Vorschau zu einer Werkbank geworden: Slides lassen
sich direkt im Canvas verschieben und skalieren, der Stand bleibt erhalten.
- Streifenansicht mit allen Slides nebeneinander, Auswahl per Klick
- Durchlaufendes Blatt: jede Slide trägt die Inhalte ihrer Nachbarn, damit
verschobene Elemente über die Kante hinweg weiterlaufen
- Bearbeiten im Canvas: ziehen, Schriftgrößen und Bildbreiten, Reset je
Element oder komplett
- Projektstand pro Post im Browser gespeichert, Navigation zwischen den Posts
- Arbeitsfläche vom Bedienfeld getrennt, eigener Zoom und Panning
- Bildrahmen als Chamfer, rund, Stapel oder aus; Schatten schaltbar
- Screenshots zeigen den vollen Screen statt eines Ausschnitts
- Kategorien in der Sidebar standardmäßig zugeklappt
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