pascal/youtube
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Folge 9, Szene 2: Noa hält den Drachen an den Seitenspitzen vor der Brust

Browse source 
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
Lara 2026-11-07 21:31:08 +00:00
parent bd6aba7a02
commit 47015a5d1b
1 changed files with 23 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

35
remotion/src/folge09/szene2.tsx
View file

@ -8,10 +8,10 @@ import {Untertitel} from '../baukasten/untertitel';
import {plane} from './plan';
import {LuluImWind, PLATZ, WindGarten} from './teile';
// Szene 2: Mein Drachen. Windiger Nachmittag; Noa hält ihren roten Papierdrachen mit beiden Händen vor
// dem Bauch (Pose noa_A_klatschen, die Fäustlinge greifen die obere Spitze, der Drachen hängt darunter), die drei Schleifen am
// Schwanz leuchten beim Zählen nacheinander auf. Die Fäustlinge werden über dem Drachen noch einmal
// gezeichnet, damit sie ihn sichtbar festhalten.
// Szene 2: Mein Drachen. Windiger Nachmittag; Noa hält ihren roten Papierdrachen vor der Brust an den
// beiden Seitenspitzen (Pose noa_A_drachenschnur: die Hände stehen auseinander, der Drachen verdeckt die
// Spule). Die Fäustlinge werden über dem Drachen noch einmal gezeichnet, damit sie ihn sichtbar halten.
// Die drei Schleifen am Schwanz leuchten beim Zählen nacheinander auf.
export const S2 = plane('s2', [
{id: 'bild0', dauer: 2.6},
@ -28,16 +28,26 @@ export const S2 = plane('s2', [
const klemm = {extrapolateLeft: 'clamp', extrapolateRight: 'clamp'} as const;
// Fäustlinge in noa_A_klatschen (Leinwand, gemessen): Rahmen 707–791 × 366–441
const HAENDE = {cx: 749, cy: 403, rx: 48, ry: 42};
// Fäustlinge in noa_A_drachenschnur (Leinwand, gemessen)
const LINKS = {cx: 709, cy: 453, rx: 32, ry: 30};
const RECHTS = {cx: 806, cy: 423, rx: 20, ry: 30};
const POSE = 'noa_A_drachenschnur';
export const Szene2: React.FC = () => {
const f = useCurrentFrame();
const {z, dauer} = S2;
const d = punkt('noa', PLATZ.noa, BODEN, HAENDE.cx, HAENDE.cy);
const ecke = punkt('noa', PLATZ.noa, BODEN, HAENDE.cx + HAENDE.rx, HAENDE.cy + HAENDE.ry);
const haende = `ellipse(${ecke.x - d.x}px ${ecke.y - d.y}px at ${d.x}px ${d.y}px)`;
const noaPose = <Figur pose="noa_A_klatschen" x={PLATZ.noa} y={BODEN} />;
const hand = (h: typeof LINKS) => {
const m = punkt('noa', PLATZ.noa, BODEN, h.cx, h.cy);
const e = punkt('noa', PLATZ.noa, BODEN, h.cx + h.rx, h.cy + h.ry);
return {...m, clip: `ellipse(${e.x - m.x}px ${e.y - m.y}px at ${m.x}px ${m.y}px)`};
};
const l = hand(LINKS);
const r = hand(RECHTS);
// Leistenkreuz in der Mitte zwischen den Händen, Querleiste von Hand zu Hand (Drachen: ±40 px bei s = 1)
const d = {x: (l.x + r.x) / 2, y: (l.y + r.y) / 2};
const neigung = (Math.atan2(r.y - l.y, r.x - l.x) * 180) / Math.PI;
const groesse = Math.hypot(r.x - l.x, r.y - l.y) / 80;
const noaPose = <Figur pose={POSE} x={PLATZ.noa} y={BODEN} />;
const leuchte = (id: 'z1' | 'z2' | 'z3') => interpolate(f, [z[id].start, z[id].start + 6, z[id].frei, z[id].frei + 8], [0, 1, 1, 0.25], klemm);
const kam = kamFahrt(f, [
[0, 1060, 540, 1.0],
@ -54,8 +64,9 @@ export const Szene2: React.FC = () => {
<LuluImWind />
<Figur pose={[[0, 'pino_A4_staunen'], [z.n2.start, 'pino_A3_lachen']]} x={PLATZ.pino} y={BODEN + huepfer(f, z.p1.start, 14, 10)} stauchY={atmen(f, 1, 0.015)} />
{noaPose}
<Drachen x={d.x} y={d.y + 34} s={0.9} drehung={Math.sin(f * 0.07) * 2} schwanz={18} flattern={8} boden={BODEN} leuchten={[leuchte('z1'), leuchte('z2'), leuchte('z3')]} />
<div style={{position: 'absolute', inset: 0, clipPath: haende}}>{noaPose}</div>
<Drachen x={d.x} y={d.y} s={groesse} drehung={neigung} schwanz={18} flattern={8} boden={BODEN} leuchten={[leuchte('z1'), leuchte('z2'), leuchte('z3')]} />
<div style={{position: 'absolute', inset: 0, clipPath: l.clip}}>{noaPose}</div>
<div style={{position: 'absolute', inset: 0, clipPath: r.clip}}>{noaPose}</div>
</Kamera>
<Vignette />
<Untertitel zeilen={S2.liste} />