pisakhov/x-motion-orbit

X Motion · Orbit

Orbit erweitert x-motion; es ersetzt es nicht. Führe die Kernmethode (Kurzbeschreibung, These, Storyboard, Kritik) aus und verwende diese Datei für die künstlerische Richtung und die Rezepte. Es wurde für 8–12 Sekunden lange Filme mit 1920×1080 Pixeln und 30 fps geschrieben, die deterministisch aus renderFrame(t) in einem kopflosen Chromium mit Software-WebGL gerendert werden.

Visuelle These

Der Weltraum ist schwarz, und Licht ist das Ereignis. Eine Quelle (die Sonne) und die Materialien, die sie berührt: Atmosphäre, Ozean, Wolke, Metall. Jeder Film ist um den einzigen Moment herum aufgebaut, in dem Licht ankommt, eine Kante überquert oder sich befreit.

Stille Zuversicht vor Spektakel. Das Bild ist meist echtes Schwarz; das Motiv ist eine große, langsame Masse (ein Planet, ein Mond, eine Tresortür) und eine dünne helle Kante. Wenn ein Bild wie ein Hintergrundbild oder ein Spielmenü aussieht, entferne Dinge, bis es wie ein Foto einer geduldigen Kamera wirkt.

Palette

Arbeite in linearem HDR und tonemappe am Ende; dies sind anzeigebezogene Ziele für das, worauf das Auge landen soll.

Rolle	Hex	Verwendung
Echtes Schwarz	#000000	60–80 % der meisten Bilder. Niemals mit Dunst anheben.
Leeres Navy	#050b18	Tiefraum-Verlauf, weit entfernt von jeglichem Licht.
Tiefes Navy	#0b1a33	Nachtmeer, beschattetes Metall, dunkler Himmel nach einem „Aufschwung“.
Rayleigh-Blau	#2f6fd8	Atmosphärenkörper auf der Tagseite.
Atmosphärisches Cyan	#8fd3ff	Fresnel-Rand, dünne Limbuslinie.
Sonnenaufgangs-Gold	#ffc46b	Sonnenkern-Abfall, Terminator, erstes Licht auf Wolkenoberseiten.
Glut-Amber	#ffa448	Stadtlichter (Natrium) auf der Nachtseite.
Korona-Perlmutt	#ece8de	Korona, Sterne, glockenförmige Glanzlichter.
Titan	#8a8f96	Gebürstete Metalloberfläche.
Nickel	#c3c6c8	Metallglanzlichter, Facettenflächen.
Champagner	#e9d4a6	Warmer, spiegelnder Rand auf Metall; höchstens eine 2-Px-Linie.
Aurora-Grün	#4ff0a0	Sauerstoff-Aurora; unter 20 % seines vollen Wertes halten.
H-Alpha-Rosa	#ff4a6e	Nur für Sonnenprotuberanzen und Chromosphäre.

Licht und Material

• Ein Licht. Die Sonne ist die einzige Quelle. Glühen, Ränder und Glanzlichter müssen durch ihre Position erklärt werden. Städte und Aurora sind die einzigen Emitter und befinden sich auf der Nachtseite.
• Limb-Verdunkelung für jede Sternscheibe: I(mu) = 1 - 0.6*(1 - mu) mit mu = sqrt(1 - r*r); ein Gold-Weiß-Kern wirkt heiß, eine flache Scheibe wirkt wie ein Aufkleber.
• Atmosphäre ist Streuung, kein Strich. Blau (Rayleigh) auf dem beleuchteten Rand, Gold, wo Licht den Terminator streift, vorwärts gestreute Helligkeit, wenn die Sonne hinter dem Planeten steht. Der Rand ist dünn: etwa 1,5 % des Planetenradius.
• Nachtseite ist nicht schwarz: eine kühle, mondbeschienene Füllung hält den Ozean tiefblau (nie oliv), Land einen neutralen Farbton dunkler, Wolken silbrig-weiß, einen cyanfarbenen Fresnel-Rand an der Scheibenkante, bernsteinfarbene Stadtcluster, die den Küsten folgen, und eine schwache grüne Luftglühlinie am Limbus. Warmes Gold erscheint nur dort, wo die Sonne tatsächlich hinkommt.
• Ozeanglanz: ein weicher, spiegelnder Lappen, wo die Sonne reflektiert, zum Rand hin verlängert; nur Ozean.
• Metall: gebürstetes Titan ist anisotrop. Glanzlichter erstrecken sich quer zur Bürstrichtung, Fasen fangen eine dünne Champagnerkante ein, Nähte erhalten Okklusion. Kein Chromspiegel, keine Bump-Map-Störungen.
• Linse: ein anamorphotischer Streak (horizontal, dünn, cyan-getönt), zwei bis vier schwache Geister entlang der Linie durch die Bildmitte. Geister-Transparenz unter 4 %. Tonemappe mit einer ACES-ähnlichen Kurve; niemals ein Glanzlicht für mehr als ein paar Pixel auf flaches Weiß beschneiden.

Komposition

• Horizonte liegen auf einem Drittel, niemals durch die Mitte. Planetenscheiben sind große Bögen (Radius 1,5–4 Bildhöhen); eine ganze kleine Kugel sieht aus wie ein Spielzeug.
• Das Lichtereignis (Sonnenaufgang, Diamantring, erstes Licht) landet auf einem Drittel, nicht genau in der Mitte, es sei denn, der Schuss handelt von Symmetrie (eine Tresortür, eine Finsternis).
• Halte Sterne spärlich (einige hundert sichtbar), 1–2 Px groß mit weichem Abfall, je nach Temperatur leicht warm oder kühl. Sie erscheinen, wenn das Bild dunkel wird, und verblassen, wenn es hell wird, wie es die Belichtung tun würde.
• Kein Text, Logos, HUDs, Nebel-Hintergrundbilder oder Linsenschmutz. Ein Motiv nach dem anderen.

Bewegungsvokabular und Timing

Verben: versiegeln, entriegeln, teilen, fallen, steigen, kämmen, gleiten, schlucken, entfalten, befreien, heben. Die Kamera wackelt nie und schneidet selten; Masse bewegt sich langsam, Licht bewegt sich schnell.

Takt	Typische Länge	Kurve
Halten auf einem versiegelten oder dunklen Bild	1,0–1,5 s	statisch, nur Lichtwisch
Mechanisches Entriegeln	0,10–0,20 s	schnelles Auslaufen, winziges Einpendeln
Türen öffnen / Durchfallen	0,8–1,4 s	langsamer Start, exponentielle Beschleunigung
Warp (Streifen)	1,2–2,0 s	früher Höhepunkt, sanftes Abklingen zur Ruhe; spärlich, Bild bleibt meist schwarz
Planetenaufgang / Orbitalgleiten	3–6 s	langes Ein-Auslaufen, niemals linear
Sonnenaufgang oder Diamantring	0,3–0,6 s bis zur vollen Helligkeit	scharfer Beginn, langsames Aufblühen
Auflösen und Halten	≥ 1,5 s	fast still; den Akkord nachklingen lassen

Die Bewegung wird in geschlossener Form aus t berechnet: Positionen sind Integrale von autorisierten Geschwindigkeitskurven, niemals pro Bild akkumuliert. Warpreisen ist s(t) = integral von v, also ist die Streifenlänge s(t) - s(t - shutter). Halte die Streifen spärlich (zig pro Ebene, nicht hunderte), lang und weich, mit weiter entfernten Ebenen, die dunkler und dünner sind als nahe; eine dichte, gleichmäßige Explosion wirkt wie ein Standard-Hyperraum.

Klangpalette und Mix

• Sub (30–60 Hz Sinustöne mit langsamen Schwellungen) trägt die Masse. Hochpassfilter den Master bei etwa 25 Hz (in JS nach dem Rendern; siehe Audio-Master-Rezept).
• Metall: modale Synthese. Ein 5–10 ms bandpassgefilterter Rauschklick plus 4–6 in-harmonische Sinus-Partials (z.B. 1,00, 2,32, 3,86, 5,40 mal f0) mit Abklingzeiten von 0,1–0,8 s.
• Luft und Reise: gesätes Rauschen durch einen beweglichen Bandpass, mit dem Bild geschwenkt. Keine Standard-Wuschgeräusche.
• Harmonie: schwebende Pads (sus2, sus4) unter Spannung; auflösen zu einem Dur-Add9 beim Lichtereignis. Pads sind 3 verstimmte Sägezähne pro Note durch einen Tiefpass von 600–1800 Hz.
• Glocken: additive in-harmonische Partials (1, 2,0, 2,76, 4,07, 5,4) mit einem 3–8 ms Angriff und Abklingzeiten, die mit dem Partialindex kürzer werden.
• Hall: ein ConvolverNode mit einem gesäten Stereo-Impuls (2,5–4,5 s exponentieller Abfall, 20 ms Vorverzögerung, dunklerer Nachhall).
• Stille ist ein Hinweis. Verdünne den Klang, wenn das Bild dunkel wird; lass das Lichtereignis den ersten lauten Moment besitzen.
• Ziele: integrierte −18 LUFS, True Peak ≤ −1,5 dBFS, Nachhall vollständig 0,3 s vor dem Ende abgeklungen. Im Code messen, normalisieren, dann begrenzen.

Technikrezepte

Pipeline. Software-WebGL ist langsam, also teile die Arbeit auf: Ein Durchlauf mit halber Auflösung rendert die weiche HDR-Szene (Planet, Atmosphäre, Korona) in eine RGBA16F-Textur; ein Durchlauf mit voller Auflösung hochskaliert sie und fügt scharfe Details hinzu (Sterne, Stadtlichter, Flares, Metallkanten), tonemappt und dithert. Miss Sekunden pro Bild; bleibe unter 1,5 s bei 1080p.

Ray–Kugel. Analytisch, kein Durchlaufen für die Oberfläche:

vec2 sphere(vec3 ro, vec3 rd, float R) {           // t nah, t fern; t < 0 bedeutet Fehlschlag
  float b = dot(ro, rd), c = dot(ro, ro) - R*R, h = b*b - c;
  if (h < 0.0) return vec2(-1.0);
  h = sqrt(h); return vec2(-b - h, -b + h);
}

Atmosphäre. Einfachstreuung entlang des Sichtstrahls innerhalb der Hülle (8–12 Schritte), wobei die optische Tiefe des Lichtpfades in 3–4 Schritten angenähert wird. Rayleigh-Koeffizienten vec3(5.8, 13.5, 33.1) (skaliert auf deinen Planetenradius), Mie mit einer Henyey–Greenstein-Phase g = 0,76. Überspringe Pixel, deren Strahl nie in die Hülle eintritt.

Stadtlichter. Cluster-Hash-Rauschen, maskiert durch Land und durch Nacht:

float night = smoothstep(0.05, -0.15, dot(n, sunDir));
float c = pow(max(fbm3(p*40.0) - 0.45, 0.0)*3.0, 2.0) * land * night;
col += c * vec3(1.0, 0.62, 0.28) * 6.0;           // amber, HDR

Sterne, bandbegrenzt. Ein Stern pro Gitterzelle, verjittert; zeichne mit einem Gauß von mindestens 0,8 Px Sigma, damit Bewegung nie flackert:

vec2 cell = floor(px / 24.0), f = px - (cell + hash22(cell)) * 24.0;
float star = exp(-dot(f, f) / 1.6) * pow(hash12(cell + 7.1), 18.0) * 3.0;

Sonnenaufgangs-Flare. Alles ist analytisch um die Bildschirmposition der Sonne s und ihren sichtbaren Anteil v (in JS berechnet):

vec2 d = uv - s;
float core = exp(-dot(d, d) * 9000.0), halo = 0.04 / (1.0 + dot(d, d) * 400.0);
float streak = exp(-abs(d.y) * 900.0) * exp(-abs(d.x) * 2.2);
vec3 flare = v * (core * vec3(1.0, .9, .75) * 40.0 + halo * gold + streak * cyan * 2.0);
for (int i = 0; i < 3; i++) { vec2 g = -s * kGhost[i]; /* weiche Scheibe bei g, 2–4 % */ }

Gebürstetes Titan. Anisotroper Glanzlicht mit der Tangente entlang der Bürstrichtung, plus schwache, bandbegrenzte Streifen (Wellenlänge ≥ 3 Px):

float TH = dot(T, H);
float aniso = pow(sqrt(max(1.0 - TH*TH, 0.0)), 60.0);
float grain = 0.92 + 0.08 * noise(vec2(r * 300.0, angle * 3.0));
vec3 metal = base * (0.25 + 0.75 * diffuse) * grain + champagne * aniso;

Finsternis. Mond etwas größer als die Sonne (1,04–1,08). Gib dem Mondrand ein wenig Rauschen, damit Bailey's Perlen und ein Diamantring bei Kontakt natürlich erscheinen. Korona: Helligkeit pow(r, -3) mal Streamer aus Rauschen in (Winkel, log r), plus feine Filamente aus hoher Winkelfrequenz, niedrigem radialem Frequenzrauschen.

Schreibe das Limbusprofil einmal als Summe von ganzzahligen Sinusfrequenzen und gaußschen Kerben, dann gib es sowohl als JS als auch als GLSL-String aus. JS kann dann die sichtbare Photosphäre pro Bild integrieren (eine Bisektion pro sonnenzentriertem Strahl, etwa 700 Strahlen), was den sichtbaren Anteil, den Perlen-Schwerpunkt für die Blendung und die genauen Kontaktzeiten für die Partitur liefert. Perlen-Blendung benötigt eine logarithmische Abbildung des Anteils, wie z.B. log(1 + f*1e6) / log(1 + 1e6). Breite Blendung, die aus groben Mipmaps gezeichnet wird, zeigt bei HDR-Quellen eine Treppenstufe; verwische daher jede Ebene mit vier bilinearen Abtastungen bei Halbtexel-Offsets.

Audio-Master (deterministisch). Nach startRendering() messe die integrierten LUFS (BS.1770 K-Gewichtung und Gating) in JS, skaliere auf −18, dann führe einen Lookahead-Peak-Limiter auf 4× überabgetasteten Peaks bei −1,5 dBFS aus. Säe jeden Rauschpuffer und Impuls mit mulberry32 ein.

In kopflosem Chromium schlagen diese einen bitgenauen Wiederholungstest fehl: ein Stereosignal durch einen Master-BiquadFilterNode oder DynamicsCompressorNode und jeden Knoten mit drei oder mehr Eingängen, weil die Summierungsreihenfolge um eine ULP variiert. Halte den Master-Bus knotenfrei (Gain auf Ziel). Führe den Hochpass und die Buskompression in JS nach dem Rendern durch. Backe den Hochpass eines Halls in seinen Impuls. Verkette jeden Fan-in durch 2-Eingangs-Gains, da a + b exakt und kommutativ ist.

function mulberry32(a){return()=>{a|=0;a=a+0x6D2B79F5|0;let t=Math.imul(a^a>>>15,1|a);
  t=t+Math.imul(t^t>>>7,61|t)^t;return((t^t>>>14)>>>0)/4294967296;};}

Deterministische Checkliste

• renderFrame(t) setzt jedes Uniform nur von t; kein Date, performance.now, Math.random oder bildweise Akkumulation im Rendermodus.
• Nur gesäte Hashes und PRNGs; der gleiche Seed für Bild und Ton, wenn sie übereinstimmen müssen.
• Rückwärtssuche reproduziert identische Pixel; teste t = 0 nach einem späten Bild.
• preserveDrawingBuffer: true, antialias: false; rufe gl.finish() am Ende von renderFrame auf.
• Vorschaumodus loopt mit requestAnimationFrame; ?render=1 zeichnet selbst nichts.
• renderAudio gibt bei jedem Aufruf denselben Puffer zurück, der bei zwei Durchgängen sampleweise verglichen wird; Lautstärke und True Peak werden gemessen, nicht geschätzt.
• Überprüfe Standbilder beim Lichtereignis, ein Bild davor und das letzte Bild; überprüfe das Timing pro Bild.

Zu vermeiden

• Cartoon-Konturen, leuchtende Striche um Planeten, gesättigte violette Nebel, Linsen-Flare-Voreinstellungen mit Ringen aus Sechsecken.
• Sich drehende Globen, schnelle Kamerafahrten, Wackeln oder Geschwindigkeitslinien ohne physikalische Ursache.
• Glanzlichter auf flaches Weiß beschneiden, angehobene Schwarze, Streifenbildung (vor der Ausgabe sub-LSB-Dither hinzufügen).
• Bildweites Vollbildrauschen oder 1-Px-Funkeln; sie flackern und blähen H.264 auf.
• Soundeffekte bei jeder Bewegung, kitschige Wuschgeräusche, Steigerungen, die nirgendwo hinführen, Klicks an Puffergrenzen, Hallnachläufe, die durch das Ende des Films abgeschnitten werden.
• Text, Logos oder Interface-Chrom, es sei denn, die Aufgabenstellung verlangt sie.