Karussell

Bilderkarussell

Der Stil orientiert sich an den Referenzkarussellen:

• Keine Sprecher: Karusselle verwenden niemals Aufnahmen oder Fotos der Hosts. Sie verwenden ausschließlich Text, selbst erstellte Grafiken und nicht-personenbezogene Bilder wie Diagramme und Screenshots.
• Fotofolien: Ein randfüllendes Bild, unten abgedunkelt, mit einer fetten Kapitälchen-Schlagzeile. Die Schlüsselwörter sind in der Akzentfarbe.
• Deckblatt: Ein dünner Strich mit einem Brand-Kicker.
• Reine Textfolien: Dunkler Farbverlauf, Titel in Akzentfarbe, fetter weißer Untertitel, normaler Fließtext. Die Schriftgröße ist bewusst größer als in der Referenz (Titel 92, Untertitel 60, Fließtext 52 px bei 1080 Breite).

Komponenten:

• Template: pipeline/remotion/src/Carousel.tsx, die Remotion Carousel-Komposition, gerendert als Standbilder.
• Build: pipeline/build_carousel.py.
• Jedes Karussell lebt in einem eigenen Ordner carousels/<slug>/ mit einer carousel.json und einem images/-Unterordner.
• Ausgabe: out/carousels/<slug>/01.png … sowie <slug>.pdf, bereit zum Hochladen als LinkedIn-Dokumentbeitrag.

1. Geschichte planen (7–10 Folien)

1. Deckblatt: Ein Versprechen oder eine Neugierlücke, z. B. „5 KI-Signale aus dieser Woche, die die meisten Teams übersehen“ oder „Gute Nachrichten aus der ganzen Welt, über die niemand spricht“. Schreibe es in 8–14 Wörtern.
2. Eine Idee pro Folie: Eine Tatsache, eine Erkenntnis oder ein Schritt. Die Schlagzeile muss auch ohne Bildunterschrift sinnvoll sein.
3. Folientypen mischen. Lasse nicht drei Fotos oder drei Textfolien hintereinander. Typisches Muster: Deckblatt → Foto → Foto/Diagramm → Grafik → Text → Foto → Text → CTA.
4. CTA am Ende: „Folge Fringe Lines“, „Speichere dies für dein nächstes Planungstreffen“.

Akzente: Setze 1–4 Wörter pro Schlagzeile in *…*, üblicherweise das Subjekt oder die Zahl. Maximal zwei Akzentgruppen pro Folie.

2. Visuelle Gestaltung: niemals Sprecher

Karusselle zeigen niemals die Hosts oder Gäste. Das bedeutet keine Kamerabilder, keine Porträts und kein „Foto der sprechenden Person“, selbst wenn unscharf. Jede Folie besteht aus Text, selbst erstellten Grafiken und nicht-personenbezogenen Bildern.

Bilder kommen in den Ordner carousels/<slug>/images/. Quellen, in der Reihenfolge der Präferenz:

• Selbst erstellte Grafiken:
  • graphic-Folien (Statistik / Personen / Linien / Zitat / Schlagzeile / Liste aus Graphics.tsx);
  • ein typografisches cover, das kein Bild benötigt;
  • ein cover mit einer graphic-Karte;
  • eine fertige Infografik-PNG, die als image-Folie eingefügt wird (siehe Infografik-Skill).
• Bildschirmfreigaben der Episode: Diagramme, Folien und Produktbildschirme, niemals die Kamera.
  • Erfassen mit ffmpeg -ss <sec> -i "<raw>/Quinn's screen-3.mp4" -frames:v 1 -vf "crop=iw:ih*0.895:0:ih*0.105" images/chart.png; der Crop entfernt die Browserleiste.
  • Auf den relevanten Teil zuschneiden, mit fit: "contain" anzeigen und den ursprünglichen Herausgeber des Diagramms nennen.
  • Für kommerzielle Beiträge erwägen, Diagramme Dritter als eigene lines- oder stat-Grafiken aus den zugrunde liegenden Zahlen neu zu zeichnen.
• Eigene nicht-personenbezogene Bilder des Benutzers: Produkt-Screenshots, Logos, Orts- oder Objektfotos, die sie bereitstellen.
• KI-generierte oder Stock-Bilder: Nur wenn der Benutzer darum bittet.
  • Keine echten Personen (einschließlich der Hosts) und keine gefälschten „Fotos“ realer Ereignisse.
  • Stock-Fotos kennzeichnen und nur lizenzierte verwenden.

Zitate sind als Text in Ordnung (quote-Grafik, namentlich zugeordnet). Sie nur nicht mit dem Bild des Sprechers kombinieren.

3. carousels/<slug>/carousel.json schreiben

{
  "brand": "Fringe Lines",
  "accent": "#FF5A1F",
  "slides": [
    {"type": "cover", "kicker": "Fringe Lines · Oct 30",
     "headline": "*5 KI-Signale* aus dieser Woche, die die meisten Teams übersehen"},
    {"type": "cover", "kicker": "Fringe Lines", "headline": „Umsatz gestiegen. *Personalbestand flach.*“,
     "graphic": {"type": "lines", "series": [{"label": "Umsatz", "shape": "up"}, {"label": "Personalbestand", "shape": "flat"}]}},
    {"type": "photo", "image": "images/horses.jpg", "focus": [0.4, 0.4], "credit": "Foto: …",
     "headline": „*Przewalski-Pferde* sind nach Jahrzehnten des *Artenschutzes* in die Wildnis zurückgekehrt“},
    {"type": "photo", "image": "images/chart.png", "fit": "contain", "credit": "Diagramm: …",
     "headline": "Microsofts *Umsatz stieg weiter*, während der Personalbestand flach blieb“},
    {"type": "graphic", "headline": „Anthropics S-1, *in einer Zahl*“,
     "graphic": {"type": "stat", "kicker": "Netto-Umsatzbindung", "value": 900, "suffix": "%", "label": „…“}},
    {"type": "text", "number": "04", "title": „Führe eine Nachbesprechung durch“,
     "subtitle": „Die US-Armee beendet jede Übung mit vier Fragen:“,
     "body": „Was sollte passieren, was ist tatsächlich passiert, warum und was soll beim nächsten Mal anders gemacht werden.“},
    {"type": "cta", "headline": „Folge *Fringe Lines*“, "sub": „Neue Episoden jede Woche“}
  ]
}

Typ	Felder	Hinweise
cover	headline, kicker?, graphic?, image?, focus?	Der Kicker sitzt zwischen zwei Linien; „WISCHE →“ unten rechts. Ohne image: ein dunkles Cover mit Akzent-Leuchten, das nur Text (größere Schlagzeile) oder eine graphic-Karte über der Schlagzeile enthält. image ist nur für nicht-personenbezogene Fotos
photo	image, focus?, fit?, headline, credit?	Keine Personen. focus = [x, y] 0–1, der Teil des Bildes, der erhalten bleiben soll. fit: "contain" für Diagramme und Screenshots (ganzes Bild über einer unscharfen Kopie seiner selbst)
text	title, subtitle?, body?, number?	Große Schrift. Der Fließtext sollte 20–45 Wörter umfassen; längerer Text wird etwas kleiner, daher auf mehrere Folien verteilen
graphic	graphic, headline?, credit?	Jeder Graphics.tsx-Typ, vollständig animiert eingeblendet; Serifen-Schlagzeile. Für echte Zahlen bars verwenden: {"type":"bars","kicker","signed":true,"suffix":"%","rows":[{"label","value","from?","note?","hi?"}]} (Negative wachsen in Blau nach links; hi-Zeilen in Akzentfarbe). Eigene Diagramme als bars neu zeichnen ist Screenshots vorzuziehen
cta	headline, sub?	Tuschehintergrund, Markenlogo
image	image	Ein fertiges 4:5-Bild (z. B. eine Infografik-PNG) wird unverändert angezeigt

• Akzentfarbe: accent standardmäßig Fringe Lines Orange. "#E2A85A" ergibt den Gold-Look der Referenz.
• Foliennummern: Foto- und Textfolien zeigen automatisch n/Gesamtzahl oben rechts an.

Ehrlichkeit:

• Fakten und Zahlen müssen aus der Episode oder einer namentlich genannten Quelle stammen. Die Quelle in credit angeben.
• „Wie in der Sendung zitiert“ schreiben, wenn die Hosts die Quelle nicht nannten.
• Keine Statistiken erfinden. Wenn eine Zahl überprüft werden muss, den Benutzer informieren.

4. Rendern

~/.shorts-skill/bin/python pipeline/build_carousel.py carousels/<slug>

Dies dauert etwa 30–60 s für 8–10 Folien und schreibt PNGs sowie eine PDF nach out/carousels/<slug>/.

YouTube-Beiträge: --youtube hinzufügen, um 1080×1080 Quadrate nach out/carousels/<slug>-youtube/ zu rendern. YouTube zeigt Beitragsbilder quadratisch an, daher werden 4:5-Folien beschnitten. Die gleiche carousel.json funktioniert; das v1-Template passt seine Layouts für das Quadrat an. Wird für "template": "v2" noch nicht unterstützt.

5. Qualitätssicherung

Erstelle ein Kontaktblatt und betrachte es:

ffmpeg -v error -y -pattern_type glob -i "out/carousels/<slug>/*.png" -vf "scale=360:-1,tile=4x3" -frames:v 1 /tmp/sheet.png

Überprüfe:

• Keine Folie zeigt einen Host, Gast oder eine reale Person.
• Keine Schlagzeile läuft über 5 Zeilen oder kollidiert mit dem Credit.
• Gesichter und Motive sind nicht abgeschnitten. Gegebenenfalls focus anpassen.
• Diagramme sind lesbar. fit: "contain" verwenden und den Screenshot bei Bedarf enger zuschneiden.
• Akzente erscheinen als Farbe, niemals als wörtliches *.
• Textfolien haben kein einzelnes Wort in der letzten Zeile. Gegebenenfalls umformulieren oder aufteilen.

Melde dem Benutzer:

• die Folienliste;
• die Herkunft jedes Bildes (Bildschirmfreigabe, bereitgestellt oder selbst erstellt);
• jede Zahl, die überprüft werden muss.