Premium Video Skill — v3.3 (Anchor Grid + Sound)

Was macht Premium Video Skill — v3.3 (Anchor Grid + Sound)?

==================================================

Eine Senior-Agent-Orchestrierungs-Skill, die ein Sprachskript in ein hochwertiges HyperFrames-Kurzvideo umwandelt mit:

• Anchor Grid (Kicker → Hero → Body → Chip → Presenter, unten fixiert)
• Kinetischer Typografie (wortweise gestaffelte Animation)
• SVG-Animationen (technische Diagramme mit beweglichen Elementen)
• Glasmorphismus-Belegekarten + Einblendungen + Endbildschirme
• Bewegungsunschärfe-Wischübergänge
• Vollständiges Soundsystem (SFX-Synthese, Cue-Sheet, Audiomischung)
• Design-Validierungs-Gate (prepare.py)
• Reproduzierbare Pipeline (scenes.sh → prepare.py → build_index.py)

---

Pipeline (Reihenfolge ist nicht verhandelbar)

Sprachskript
    │
    ▼
generate.py  →  new_scene.py  →  prepare.py  →  build_index.py
  (Parsen)      (Szenendateien)  (Validieren)    (Root HTML + Wipes)
    │                                         │
    ▼                                         ▼
npx hyperframes lint  →  npx hyperframes render
  (0 Fehler Gate)         (MP4-Ausgabe)
    │
    ▼
python3 scripts/gen_sfx.py       # SFX synthetisieren (einmalig)
python3 scripts/mix_audio.py     # VO + Cues + Bed → master.wav
ffmpeg mux → final.mp4

Schritt für Schritt

# 1. Szenenkompositionen + Root HTML aus Sprachskript erzeugen
python3 generate.py --script my_script.txt --topic Tor --output index.html

# 2. Validierungs-Gate (Kontrast, Typografie, Safe Zone, Feldrhythmus)
python3 scripts/prepare.py

# 3. Linting (muss 0 Fehler sein)
npx hyperframes lint

# 4. Vorschau und Rendern
npx hyperframes preview
npx hyperframes render

# 5. Audio-Pipeline
python3 scripts/gen_sfx.py              # 14 SFX von Grund auf synthetisieren
python3 scripts/mix_audio.py            # VO + Cues + Bed → master.wav
ffmpeg -i rendered.mp4 -i renders/master.wav \
  -c:v copy -c:a aac -shortest final.mp4

---

Anchor Grid (unten fixiert, invariant)

Jede Szene verwendet dieselbe untere Hälfte – nur die obere Hälfte wird neu zusammengesetzt:

Anker	Element	Position	Animation
1	Kicker	Oben links	Hochschieben von y:-26, Einblenden 0.32s
2	Hero	Oberer Streifen (1–3 Wörter)	Skalieren 1.3→1, Drift 44px→0, langsamer Aufwärtsdrift
3	Body	Karte / Tacho / Zeilen	Hochschieben 56px→0, Skalieren .95→1
4	Chip	Unterer Bereich (3–6 Wörter)	Hochschieben 30px→0, Einblenden 0.26s
5	Presenter	Unten rechts, durch Rahmen beschnitten	Skalieren .92→1, y:46→0, Einblenden 0.34s

Frame 0 ist ein Poster – Szene 1 (data-cover="1") öffnet vollständig komponiert.

---

Sechsfarbiger Feldwechsel

Keine zwei benachbarten Szenen teilen sich ein Hintergrundfeld:

accent → ground → ink → secondary → tertiary → quaternary

prepare.py schlägt fehl, wenn zwei aufeinanderfolgende Szenen dasselbe Feld verwenden.

Alle Text-/Hintergrund-Paare erfüllen WCAG ≥ 4.5:1 Kontrast.

---

Soundsystem

SFX-Synthese (keine Downloads, keine Lizenzierung)

python3 scripts/gen_sfx.py erstellt 14 Soundeffekte:

SFX	Verwendung
pop.wav	Jeder Szenenschnitt
click.wav / key.wav	UI-Elemente, Listenabtickung
chime.wav	Enthüllung / Punktzahl
ping.wav	Benachrichtigung
notify.wav	Handlungsaufforderung (CTA)
riser.wav	Große Wendungen vor dem Schnitt
impact.wav	Starker visueller Treffer
whoosh.wav	Schnelle Bewegung
error.wav	Falsch / Abgelehnt

Cue-Sheet — assets/sfx/cues.json

Abschnittsrelative Offsets (überleben VO-Neuaufnahmen):

{ "at": "scenes", "file": "pop.wav", "gain": 0.5 }
{ "at": "vo2-0.30", "file": "riser.wav", "gain": 0.3 }
{ "at": "vo9+0.55", "file": "notify.wav", "gain": 0.4 }

Audiomischung — scripts/mix_audio.py

• VO + SFX-Cues + Musikbett → renders/master.wav
• Misst Lautstärke mit ebur128, korrigiert auf −14 LUFS
• True-Peak ≤ −1 dBTP
• alimiter mit level=false (vermeidet Auto-Level-Falle)
• Bett bei 0,15 Lautstärke → −29 LUFS (~13 LU unter −16 LUFS VO)
• Kein Sidechain-Ducking – der Pegelabstand ist das Ducking

---

Technische Themen (automatische Animation + Belege)

Wenn das Skript ein erkanntes Schlüsselwort enthält, fügt der Orchestrator ein:

Komponente	Behandlung
SVG-Diagramm	Knoten-Link-Fluss mit beweglichem Element + animateMotion
Belege-Overlay	Glasmorphismus-Karte mit Quellenabzeichen
Übergang	Bewegungsunschärfe-Wipe vor der Animation
Audio-Cue	"Whoosh"-SFX zu Animationsbeginn

Erkannte Begriffe: tor, onion, vpn, proxy, isp, relay, network, packet, encryption, cybersecurity, dns, cdn, blockchain, ai, machine learning, und mehr.

---

Eingabeskript-Formate

Klartext (automatisch getimed ~145 Wörter pro Minute)

Überall die gleiche Bewerbung? Deshalb wirst du abgelehnt.
Passe sie pro Unternehmen an.
Lies die **Stellenbeschreibung**.
Eine Bewerbung passt nicht zu jedem Unternehmen. Passe sie an und komme in die engere Auswahl.

Zeitgestempelte Segmente

[0-4s] Überall die gleiche Bewerbung? Deshalb wirst du abgelehnt.
[4-10s] Passe sie pro Unternehmen an.
[10-14s] Lies die **Stellenbeschreibung**.

Betonung: **Wort** → rechtsbündig, Markenfarbe, Schriftstärke 950, Pop-Animation.

---

Dateien

Datei	Zweck
generate.py	CLI-Einstiegspunkt
orchestrator.py	Pipeline: Parsen → Erkennen → Zerlegen → Szenen erzeugen → Root bauen
design_system.py	Design-Tokens, Ausrichtungsregeln, Validierung
PARAMS.json	Die EINZIGE Designdatei, die du bearbeitest
scripts/prepare.py	Validierungs-Gate + Token-Injektion
scripts/new_scene.py	Anchor-Grid-Szenen-Kompositionsgenerator
scripts/build_index.py	Root HTML mit durchgehendem Timing + adaptiven Wipes
scripts/gen_sfx.py	SFX-Synthese von Grund auf
scripts/mix_audio.py	VO + Cues + Bed → master.wav
assets/sfx/cues.json	Abschnittsrelatives Cue-Sheet
scenes.sh	Reproduzierbare Szenenliste-Vorlage
compositions/_scene-base.html.tmpl	Anchor-Grid-Skelett
compositions/wipe.html	Bewegungsunschärfe-Übergang
skill.md · skill.json	Dokumentation + Schema

---

Anforderungen

• Python 3 (Standardbibliothek)
• HyperFrames CLI: npx hyperframes init / preview / render / lint
• Node.js ≥ 22, FFmpeg
• ffprobe (für Audiomessung)

---

Lizenz

MIT – baue darauf auf, teile es, verkaufe Videos damit.