Neun Buehnen statt einer - jede Seite hat ihre eigene Szene
Filipe hat neun Bilder geschickt, damit es VERSCHIEDENE Hintergruende gibt. Benutzt wurde davon genau eines (das Studio), die uebrigen acht lagen unbenutzt im Ordner -- lounge.png und skyline.png sogar schon fertig kopiert. Zu Recht beanstandet. Jetzt wird aus jeder Szene eine Buehne, breit und schmal, und jede Seite bekommt die, die zu ihr passt: studio Startseite der neutrale Ort, alles beginnt hier showbuehne Dashboard, Review die grosse Buehne, alles im Blick garage Aufgaben, Technik Werkstatt, hier wird gearbeitet skyline Kalender Nacht ueber der Stadt, Zeit lounge Calls, Community Sitzecke, hier wird geredet arena Dateien, Wissen Archiv hinter dem Portal halle Profil, Personen die Halle, in der jemand steht wald Start-Check, Scouting der Weg, den man erst sucht portal Content, LIVE Durchgang, hier entsteht etwas Die Zuordnung steht in bereiche.js -- derselben Liste, aus der schon Zeichen und Farbton kommen. Eine Seite traegt damit dreierlei aus einer einzigen Quelle: Farbe, Zeichen und Buehne. Sie koennen nicht auseinanderlaufen. Alle neun bekommen dieselbe Behandlung (abgedunkelt auf 0.42, Vignette in der Mitte, wo der Text steht, oben ausgeblendet, wo die Kopfleiste sitzt). Sie sehen verschieden aus und verhalten sich gleich -- eine Buehne, die je Seite anders hell waere, waere Unruhe statt Vielfalt. Der schmale Ausschnitt ist je Szene ein anderer, weil ein auf 9:16 gequetschtes Breitbild nur noch Wand zeigt; genommen wird der Bereich, in dem die Figuren stehen. 18 Dateien, zusammen 580 KB -- pro Seite werden davon zwei geladen (breit ODER schmal), also 16 bis 48 KB. Die Rohbilder waren 2,4 MB je Stueck. Kontrast auf allen sechs geprueften Seiten an echten Bildpunkten nachgemessen: haelt (schlechtester Wert 4,59:1). FUND: Die Buehnenpruefung suchte nach "buehne-breit" und fand die neuen Namen nicht mehr -- sie meldete "die Buehne liegt im Hintergrund: FEHL", obwohl sie da war. Die Seitenpruefung sieht jetzt nach, dass jede Seite ihre Szene hat UND dass das Bild wirklich ankommt: Ein data-buehne ohne passende CSS-Regel waere still wirkungslos. Co-Authored-By: Claude Opus 5 <[email protected]>
This commit is contained in:
Claude Opus 5
+69
-27
@@ -40,34 +40,76 @@ const QUELLE = join(WURZEL, "assets", "img", "marke");
|
||||
const ZIEL = join(WURZEL, "workspace", "assets", "img");
|
||||
if (!existsSync(ZIEL)) mkdirSync(ZIEL, { recursive: true });
|
||||
|
||||
/* ---------------------------------------------------------------------
|
||||
NEUN SZENEN, NICHT EINE.
|
||||
|
||||
Bis zum 01.09.2026 wurde aus den Bildern, die Filipe geschickt hat,
|
||||
genau eines benutzt (das Studio) -- die uebrigen acht lagen unbenutzt
|
||||
im Ordner. Zu Recht beanstandet: Er hatte sie ausdruecklich geschickt,
|
||||
damit es VERSCHIEDENE Hintergruende gibt.
|
||||
|
||||
Jetzt wird aus jeder Szene eine Buehne, breit und schmal, und jede
|
||||
Seite bekommt die, die zu ihr passt (Zuordnung in bereiche.js):
|
||||
|
||||
studio Startseite -- der neutrale Ort, alles beginnt hier
|
||||
showbuehne Dashboard -- die grosse Buehne, alles im Blick
|
||||
garage Aufgaben -- Werkstatt, hier wird gearbeitet
|
||||
skyline Kalender -- Nacht ueber der Stadt, Zeit
|
||||
lounge Calls -- Sitzecke, hier wird geredet
|
||||
arena Dateien/Wissen -- Archiv hinter dem Portal
|
||||
halle Profil/Personen -- die Halle, in der jemand steht
|
||||
wald Start-Check/Scouting -- der Weg, den man erst sucht
|
||||
portal Content/Reports -- Durchgang, hier entsteht etwas
|
||||
|
||||
Alle bekommen dieselbe Behandlung: abgedunkelt, Vignette in der Mitte
|
||||
(dort steht der Text), oben ausgeblendet (dort sitzt die Kopfleiste).
|
||||
Dadurch sehen sie verschieden aus und verhalten sich doch gleich --
|
||||
was der eigentliche Punkt ist. Eine Buehne, die je Seite anders hell
|
||||
ist, waere Unruhe statt Vielfalt.
|
||||
--------------------------------------------------------------------- */
|
||||
|
||||
const SZENEN = [
|
||||
/* [Name, Ausschnitt breit, Ausschnitt schmal]
|
||||
Der schmale Ausschnitt ist je Szene ein anderer: Ein auf 9:16
|
||||
gequetschtes Breitbild zeigt nur noch Wand. Gewaehlt wird jeweils
|
||||
der Bereich, in dem die Figuren stehen. */
|
||||
["studio", [0, 0, 1, 1], [0.17, 0, 0.66, 1]],
|
||||
["showbuehne", [0, 0, 1, 1], [0.20, 0, 0.62, 1]],
|
||||
["garage", [0, 0, 1, 1], [0.02, 0, 0.60, 1]],
|
||||
["skyline", [0, 0, 1, 1], [0.00, 0, 0.58, 1]],
|
||||
["lounge", [0, 0, 1, 1], [0.15, 0, 0.68, 1]],
|
||||
["arena", [0, 0, 1, 1], [0.20, 0, 0.62, 1]],
|
||||
["halle", [0, 0, 1, 1], [0.24, 0, 0.60, 1]],
|
||||
["wald", [0, 0, 1, 1], [0.30, 0, 0.62, 1]],
|
||||
["portal", [0, 0, 1, 1], [0.20, 0, 0.62, 1]],
|
||||
];
|
||||
|
||||
const AUFTRAEGE = [
|
||||
{
|
||||
/* Die Buehne fuer breite Schirme. Studio, beide Figuren aussen,
|
||||
dunkle Mitte. */
|
||||
quelle: "studio.png",
|
||||
ziel: "buehne-breit.webp",
|
||||
breite: 1800, hoehe: 1013,
|
||||
ausschnitt: [0, 0, 1, 1],
|
||||
helligkeit: 0.42, saettigung: 0.95, kontrast: 1.02,
|
||||
/* Die Vignette macht genau den Streifen dunkel, in dem der Inhalt
|
||||
steht -- ohne sie waere Text ueber dem Logo unlesbar. */
|
||||
vignette: { x: 0.5, y: 0.42, rx: 0.46, ry: 0.62, staerke: 0.72 },
|
||||
/* Oben ausblenden: dort sitzt die Kopfleiste. */
|
||||
verlauf: [{ von: [0, 0], nach: [0, 0.14], stopps: [[0, 0.55], [1, 0]] }],
|
||||
guete: 0.72,
|
||||
},
|
||||
{
|
||||
/* Fuer schmale Schirme ein hochkant-Ausschnitt aus derselben Szene --
|
||||
ein auf 9:16 gequetschtes Breitbild zeigt nur noch Wand. */
|
||||
quelle: "studio.png",
|
||||
ziel: "buehne-schmal.webp",
|
||||
breite: 800, hoehe: 1400,
|
||||
ausschnitt: [0.17, 0, 0.66, 1],
|
||||
helligkeit: 0.34, saettigung: 0.9, kontrast: 1.02,
|
||||
vignette: { x: 0.5, y: 0.45, rx: 0.7, ry: 0.6, staerke: 0.78 },
|
||||
verlauf: [{ von: [0, 0], nach: [0, 0.12], stopps: [[0, 0.55], [1, 0]] }],
|
||||
guete: 0.68,
|
||||
},
|
||||
...SZENEN.flatMap(([name, breitA, schmalA]) => [
|
||||
{
|
||||
quelle: `szene-${name}.png`,
|
||||
ziel: `buehne-${name}-breit.webp`,
|
||||
breite: 1800, hoehe: 1013,
|
||||
ausschnitt: breitA,
|
||||
helligkeit: 0.42, saettigung: 0.95, kontrast: 1.02,
|
||||
/* Die Vignette macht genau den Streifen dunkel, in dem der Inhalt
|
||||
steht -- ohne sie waere Text ueber dem Logo unlesbar. */
|
||||
vignette: { x: 0.5, y: 0.42, rx: 0.46, ry: 0.62, staerke: 0.72 },
|
||||
/* Oben ausblenden: dort sitzt die Kopfleiste. */
|
||||
verlauf: [{ von: [0, 0], nach: [0, 0.14], stopps: [[0, 0.55], [1, 0]] }],
|
||||
guete: 0.72,
|
||||
},
|
||||
{
|
||||
quelle: `szene-${name}.png`,
|
||||
ziel: `buehne-${name}-schmal.webp`,
|
||||
breite: 800, hoehe: 1400,
|
||||
ausschnitt: schmalA,
|
||||
helligkeit: 0.34, saettigung: 0.9, kontrast: 1.02,
|
||||
vignette: { x: 0.5, y: 0.45, rx: 0.7, ry: 0.6, staerke: 0.78 },
|
||||
verlauf: [{ von: [0, 0], nach: [0, 0.12], stopps: [[0, 0.55], [1, 0]] }],
|
||||
guete: 0.68,
|
||||
},
|
||||
]),
|
||||
{
|
||||
/* DogFather selbst -- der RICHTIGE Husky, im blauen Hoodie. Steht
|
||||
unten rechts. */
|
||||
|
||||
Reference in New Issue
Block a user