Pascal Scholz
cbacc2fd97
- gemeinsame Bausteine nach src/baukasten/, Bibliothek nach public/bibliothek/, Orte nach public/orte/ - je Szene eine Komposition (F02-01-…), werkzeuge/render.mjs rendert nur geänderte Szenen und klebt sie zusammen; --entwurf mit halber Auflösung und eingeblendeter Zeit/Zeile - werkzeuge/stimmen.mts erzeugt ElevenLabs-Aufnahmen, Zeitplan übernimmt ihre Länge - Folge 2: Geh- und Hinsetz-Clips statt Standbild-Wechsel, neue Vögel, fallendes Blatt, Noa malt den Kalender (Blick von oben) - ANLEITUNG_PC.md für Studio und Rendern unter Windows Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
142 lines
7.2 KiB
Markdown
142 lines
7.2 KiB
Markdown
# Remotion – Szenen aus Figuren-Grafiken
|
||
|
||
Animiert die freigestellten Figuren (Pino, Noa, Lulu) per Code, ohne
|
||
Higgsfield-Clips. Erster Test: `LaterneTest` (14 s, Abendspaziergang mit
|
||
Noas Laterne, ohne Ton).
|
||
|
||
## Aufbau
|
||
| Pfad | Inhalt |
|
||
| --- | --- |
|
||
| `public/figuren/` | freigestellte PNGs der Figuren |
|
||
| `src/figuren.ts` | Bildmaße, Augenpositionen (fürs Blinzeln), Noas Hand |
|
||
| `src/teile/Figur.tsx` | Figur an den Füßen verankert: verschieben, drehen, stauchen, blinzeln |
|
||
| `src/teile/Laterne.tsx` | Laternenstab mit pendelnder Papierlaterne |
|
||
| `src/teile/Abendhuegel.tsx` | Hintergrund in Aquarell-Optik (SVG), Vordergrund, Papierstruktur |
|
||
| `src/szenen/LaterneTest.tsx` | die Testszene mit Zeitplan |
|
||
|
||
## Benutzen
|
||
```bash
|
||
npm install
|
||
npx remotion studio # Vorschau im Browser
|
||
npx remotion render src/index.ts LaterneTest /shared/youtube/tests/laterne-test.mp4
|
||
```
|
||
Fertige Videos gehören nach `/shared/youtube/`, nicht ins Git.
|
||
|
||
Im VPS-Container fehlen Chrome einige Systembibliotheken. Sie liegen ohne
|
||
Root-Rechte unter `~/.local/chrome-libs` (Debian-Pakete, nur entpackt) und
|
||
werden so eingebunden:
|
||
```bash
|
||
export LD_LIBRARY_PATH=$HOME/.local/chrome-libs/root/usr/lib/x86_64-linux-gnu
|
||
```
|
||
|
||
## Figuren freistellen
|
||
Mit `rembg` (Modell `isnet-general-use`), danach Maske härten, nur die größte
|
||
Fläche behalten, Rand um 2 px einziehen (sonst heller Saum vor dunklem
|
||
Hintergrund). Am besten funktionieren Einzelbilder vor hellem Papier.
|
||
|
||
## Körperteil-Masken (Rig)
|
||
`werkzeuge/rig.py` zerlegt jede Figur in Körperteile und erzeugt:
|
||
|
||
| Pfad | Inhalt |
|
||
| --- | --- |
|
||
| `public/figuren/<figur>/teile/<teil>.png` | harte Maske, genau an der Kontur |
|
||
| `public/figuren/<figur>/einfluss/<teil>.png` | weiche Maske für die Verformung: Teil + alles, was daran hängt, weicher Übergang am Gelenk, reicht über die Kontur hinaus |
|
||
| `public/figuren/<figur>/uebersicht.png` | alle Teile farbig, zum Prüfen |
|
||
| `src/rigs.ts` | Gelenkpunkte und Hierarchie (automatisch erzeugt) |
|
||
|
||
Teile: Lulu – kopf, hals, ohr_links/rechts, horn_links/rechts, rumpf,
|
||
bein_vorne_links/rechts, bein_hinten_links/rechts, schwanz, schal_schlinge,
|
||
schal_ende, schal_boden. Pino – koerper, kopf, ohr_links/rechts, bauch,
|
||
arm_links/rechts, fuss_links/rechts, muetze, bommel. Noa – kopf,
|
||
zopf_links/rechts, rumpf, arm_links/rechts, hand_links/rechts,
|
||
bein_links/rechts, stiefel_links/rechts.
|
||
|
||
Zuordnung: Accessoires über ihre Farbe, alles andere über Kernflächen pro
|
||
Teil, die bis zur Kontur wachsen – nur innerhalb der Figur, also nie über
|
||
Lücken (Schwanz ↔ Bein). Neue Figur oder neues Bild: Skelett und Flächen in
|
||
`rig.py` eintragen, dann
|
||
```bash
|
||
python3 werkzeuge/rig.py # braucht numpy, scipy, pillow
|
||
```
|
||
und `uebersicht.png` prüfen. In einer Szene: `gelenk('lulu', 'hals', grad)`
|
||
(siehe `src/szenen/VerformTest.tsx`).
|
||
|
||
## Folgen bauen (Baukasten)
|
||
Eine Folge besteht aus Szenen, jede Szene aus Sprechzeilen und Bewegungen,
|
||
die an diesen Zeilen hängen. Alles Wiederverwendbare liegt in
|
||
`src/baukasten/`, jede Folge hat einen eigenen Ordner (`src/folge02/`).
|
||
Untertitel stehen für die Stimmen, solange es keine Aufnahmen gibt;
|
||
Mitmach-Pausen zeigen ein „?“.
|
||
|
||
| Pfad | Inhalt |
|
||
| --- | --- |
|
||
| `src/baukasten/figur.tsx` | `Figur` (Standbilder mit Posenwechsel), `ClipFigur` (freigestellte Clips), `Kamera` |
|
||
| `src/baukasten/helfer.tsx` | Kamerafahrt, Atmen, Gehen, Hüpfen, Wackeln, Blenden, Ankerpunkte |
|
||
| `src/baukasten/natur.tsx` | Blätter, Nest, Vögel, Schnee, Zzz, Funkeln, große Rufe |
|
||
| `src/baukasten/orte.tsx` | Orte als SVG (Garten Tag/Nacht, Blick von oben, Noas Zimmer, Kalender); vorberechnet nach `public/orte/` |
|
||
| `src/baukasten/buch.tsx` | Bilderbuch-Intro und -Outro |
|
||
| `src/baukasten/zeit.ts` | Zeitplan aus den Zeilen (geschätzt oder aus den Aufnahmen) |
|
||
| `src/baukasten/untertitel.tsx` | Untertitel, Mitmach-Pause, Stimmen abspielen |
|
||
| `src/baukasten/folge.tsx` | macht aus der Szenenliste die Kompositionen |
|
||
| `src/baukasten/posen.ts` | automatisch erzeugt von `werkzeuge/posen.py` |
|
||
| `src/folge02/` | Folge 2: `Folge02.tsx` (Szenenliste), `szene2.tsx` … `szene7.tsx`, `lied.tsx`, `stimmen.json` |
|
||
| `public/bibliothek/figuren/` | freigestellte Standbilder (WebP, im Git) |
|
||
| `public/bibliothek/clips/` | freigestellte Clips (WebM mit Alpha, nicht im Git; VPS: Link auf `/shared/youtube/figuren_bibliothek/clips_frei/`) |
|
||
| `public/stimmen/` | Sprachaufnahmen (nicht im Git; VPS: Link auf `/shared/youtube/stimmen/`) |
|
||
|
||
**Kompositionen:** `F02` ist die ganze Folge, `F02-01-Intro`,
|
||
`F02-02-Gaehnen-ueberall` … jede Szene einzeln.
|
||
|
||
**Neue Folge:** Ordner `src/folgeNN/` anlegen, `plan.ts` und `stimmen.json`
|
||
(`{}`) aus Folge 2 kopieren und den Ordnernamen anpassen, Szenen nach dem
|
||
Muster von `szene2.tsx` schreiben (oben die Zeilen mit `plane('sX', [...])`,
|
||
darunter Posenfolgen und Kamerafahrt, die sich auf `z.<zeile>.start/ende`
|
||
beziehen), in `FolgeNN.tsx` auflisten und in `src/Root.tsx` eintragen.
|
||
|
||
### Rendern
|
||
```bash
|
||
node werkzeuge/render.mjs F02 --entwurf # schnelle Fassung zum Begutachten
|
||
node werkzeuge/render.mjs F02 # volle Qualität
|
||
node werkzeuge/render.mjs F02 --szene 3 # nur Szene 3 neu
|
||
```
|
||
Das Skript rendert jede Szene einzeln nach `out/F02/` und klebt sie
|
||
zusammen. Szenen, deren Code, Bilder oder Aufnahmen sich nicht geändert
|
||
haben, werden übersprungen. Im Entwurf stehen oben links Gesamtzeit, Szene,
|
||
Szenenzeit und Zeilen-ID – für Rückmeldungen einfach diese Angaben nennen
|
||
(z. B. „2:47, Szene 4, Zeile l1: Lulus Kopf zu weit links“).
|
||
Auf dem VPS: vorher `export LD_LIBRARY_PATH=$HOME/.local/chrome-libs/root/usr/lib/x86_64-linux-gnu`.
|
||
|
||
### Vorschau ohne Rendern
|
||
`npx remotion studio` öffnet alle Kompositionen im Browser; Änderungen am
|
||
Code sind sofort zu sehen. Anleitung für einen Windows-PC: `ANLEITUNG_PC.md`.
|
||
|
||
### Stimmen (ElevenLabs)
|
||
1. Stimmen-IDs je Sprecher in `werkzeuge/stimmen.config.json` eintragen
|
||
(`ALLE` und `NOA_LULU` verweisen auf einen anderen Sprecher).
|
||
2. `npx tsx werkzeuge/stimmen.mts F02 --probe` zeigt, welche Zeilen erzeugt
|
||
würden, und zählt die Zeichen (kostet nichts).
|
||
3. `ELEVENLABS_API_KEY=… npx tsx werkzeuge/stimmen.mts F02` erzeugt die
|
||
Aufnahmen nach `public/stimmen/folge02/` und trägt ihre Länge in
|
||
`src/folge02/stimmen.json` ein. Der Zeitplan richtet sich danach; ändert
|
||
sich ein Text, wird nur diese Zeile neu erzeugt.
|
||
|
||
Untertitel ausblenden: `--props='{"untertitel": false}'` (bzw. in
|
||
`render.mjs` die `props.json`).
|
||
|
||
### Neue Standbilder oder Clips
|
||
```bash
|
||
python3 werkzeuge/freistellen.py <zielordner> bild1.png … # ohne Zuschneiden
|
||
python3 werkzeuge/clip_freistellen.py <arbeitsordner> <clips_frei> clip1.mp4 …
|
||
python3 werkzeuge/posen.py <zielordner> <clips_frei> # Posen und Clips eintragen
|
||
```
|
||
Mit `pip install "rembg[gpu]"` nutzt `rembg` eine Nvidia-Grafikkarte
|
||
automatisch (auf dem VPS gibt es keine; dort ca. 3 s pro Bild).
|
||
Orte neu vorberechnen (nach Änderungen in `orte.tsx`):
|
||
`npx remotion still src/index.ts F2Ort-garten public/orte/garten.webp --image-format=webp`
|
||
|
||
## Bekannte Grenzen
|
||
- Die Figuren haben nur die Pose ihres Bildes. Neue Posen brauchen ein neues
|
||
Bild (z. B. aus Gemini).
|
||
- Die SVG-Filter im Hintergrund werden pro Frame neu berechnet und machen das
|
||
Rendern langsam. Für lange Folgen die Hintergrund-Ebenen einmal als PNG
|
||
vorberechnen.
|