Szenendeck: Ein Bild, eine Kamera

Was macht Szenendeck: Ein Bild, eine Kamera?

Ein Szenendeck ist ein Vortrag, der in einer einzigen Illustration lebt. Jede Seite ist eine Kameraposition über demselben Bild. Die Kamera fährt in ein Detail hinein, gleitet entlang eines gezeichneten Pfads zum nächsten Objekt, springt über den Raum und zoomt am Ende auf die Totale zurück. Die Worte stehen auf Karten, die im Bildschirmraum gezeichnet werden, und sie erscheinen einen Moment, nachdem die Kamera zum Stillstand gekommen ist, sodass das Publikum den Ort sieht, bevor es darüber liest.

Dieser Skill ist die Methode, die einen 22-Einstellungen-, 20-minütigen Konferenzvortrag in @open-slide/core 2.2 hervorgebracht hat. open-slide hat keine Kamera-API, daher wird die Kamera innerhalb der Seitenkomponente gesteuert. template/index.tsx ist die gesamte Engine plus sieben Beispiel-Einstellungen; kopieren Sie es und ersetzen Sie die Szene, die Ankerpunkte und die Karten.

Wann man ihn verwenden sollte

• Der Vortrag hat einen Ort: ein Klassenzimmer, ein OP-Saal, eine Fabrikhalle, ein Stadtblock. Objekte an diesem Ort bilden die Stationen der Geschichte ab.
• Der Sprecher möchte das Prezi-Gefühl (hineinzoomen, um zu sprechen, herauszoomen, um das Ganze zu sehen, zum nächsten Punkt gleiten), ohne Prezi.
• 15 bis 25 Einstellungen. Bei weniger reicht ein normales Deck; bei mehr werden die Kamerabewegungen zur Hintergrundberieselung.

Nicht verwenden für datenlastige Decks, Live-Demos oder alles, was von jemand anderem in PowerPoint bearbeitet werden muss. Es ist eine Webseite; sie läuft in Chrome.

Die Arbeiten in der Reihenfolge

1. Zuerst das Storyboard. Eine Szene, eine Liste von Stationen, eine Kameraposition und eine Karte pro Station, und eine Liste des realen Materials, das Sie noch benötigen (Screenshots, Logs, Fotos). Schreiben Sie es auf, bevor Sie Kunst oder Code erstellen. references/storyboard.md enthält die Tabelle und die Fragen, die mit dem Sprecher geklärt werden müssen.
2. Die Szene erstellen. Generieren Sie drei Stil-Kandidaten der Totalen, lassen Sie den Sprecher auswählen, korrigieren Sie dann das Bild mit Bild-zu-Bild-Bearbeitungen (Objekte entfernen, das eine Element hinzufügen, das die Geschichte benötigt, den Bildschirm leer lassen). Generieren Sie Nahaufnahme-Platten nur dort, wo die Kamera auf wenige hundert Welt-Pixel herankommt. references/art.md.
3. Die Ankerpunkte mit einem Raster messen, niemals mit dem Auge an einer Totalen. scripts/measure-grid.sh beschneidet einen Bereich des Bildes mit einem 100-Pixel-Raster; verwenden Sie einen 3×-Eckenausschnitt für alles, in das ein Screenshot hineinpassen muss. references/art.md.
4. Das Deck aus der Vorlage bauen. Fügen Sie einen ViewKey, einen VIEWS-Eintrag (Kamera, HUD-Modus, Blur, Hold), einen HudBody-Fall, eine Seite und eine Notiz hinzu. Die Engine ändert sich nicht. references/engine.md erklärt jeden Regler.
5. Überprüfen, nicht schätzen. Führen Sie scripts/perf-probe.cjs in einem headed Chrome aus: Null lange Tasks und kein Frame-Gap über 50 ms bei allen Seitenwechseln ist die Messlatte. Messen Sie ohne Screenshots zu machen; Screenshots kosten 300 ms pro Stück und sehen aus wie Ruckler. references/verification.md.
6. Einen Rundgang aufnehmen und auf einem Telefon ansehen. scripts/record-walkthrough.cjs spielt das Deck mit einer Verweildauer pro Einstellung ab und zeichnet es auf; konvertieren Sie es in mp4 und senden Sie es an das Telefon des Sprechers. Jede Feedback-Runde im ursprünglichen Projekt kam aus dieser Schleife, nicht aus dem Browser.
7. Aus einem Build heraus präsentieren. scripts/present.command erstellt den Build, bedient dist/ und öffnet das Deck und das Präsentationsfenster (Notizen, Timer, nächste Seite). Testen Sie auf dem Projektor des Veranstaltungsortes mit dem eigenen Laptop des Sprechers. references/presenting.md.

Regeln, die bezahlt wurden

• Halten Sie die Szene vor der Karte. Die Karte wartet, bis die Kamera gelandet ist, plus Hold ms (Standard 1 s). Eine Karte, die bei 70 % der Fahrt erscheint, macht die Szene zum Desktop-Hintergrund.
• Eine Nahaufnahme-Kamera muss innerhalb ihrer Platte sitzen. Wenn die Ansicht breiter als die Platte ist, blutet das vergrößerte Basisbild um sie herum ein und wirkt wie ein Schatten oder eine Geisterhand.
• Screenshots kommen über eine Homographie auf bemalte Bildschirme, abgebildet auf die innere Kante des Rahmens. Messen Sie die vier Ecken bei 3×.
• Lange Sprünge benötigen keine Zwischenseite. Der van-Wijk-Pfad zieht hoch und taucht von selbst ein; setzen Sie die entfernten Stationen an die entfernten Enden des Bildes und lassen Sie es fliegen.
• Klare Sprache auf den Karten. Das Bild macht die Hälfte der Arbeit; die Karte bekommt eine Idee und maximal vier Zeilen.
• Verwenden Sie dafür niemals MorphElement. Es kopiert die berechneten Styles aller Nachkommen im Hauptthread, bevor die Animation startet; ein echtes Deck fror für fünf Sekunden ein. Siehe docs/adr/0001-drive-the-camera-in-page.md.

Was sich in diesem Ordner befindet

Pfad	Was es ist
template/index.tsx	Die Engine und sieben Beispiel-Einstellungen. Kopieren Sie es nach slides/<id>/index.tsx.
template/assets/	Beispiel-Szene (2752 × 1536), Nahaufnahme-Platte, App-Screenshot. Ersetzen Sie sie.
references/engine.md	Wie Kamera, HUD, Hold, Platten und Perspektivbildschirm funktionieren; wie man eine Einstellung hinzufügt.
references/storyboard.md	Die Storyboard-Tabelle und die Entscheidungen, die vor der Kunst getroffen werden müssen.
references/art.md	Die Szene prompten, korrigieren, Ankerpunkte messen, Platten.
references/verification.md	Leistungsprobe, Rundgang-Aufzeichnung, Telefon-Review-Schleife.
references/presenting.md	Build, Vorschau, Präsentationsfenster, Starter, Fallbacks.
references/pitfalls.md	Alles, was einmal schiefgelaufen ist, damit es nicht wieder schiefgeht.
scripts/	perf-probe.cjs, record-walkthrough.cjs, measure-grid.sh, genimg.py, genedit.py, present.command.
docs/adr/	Warum die Kamera in der Seite lebt, warum das HUD wartet.

Zusammenarbeit mit dem Sprecher

Entscheiden Sie mit ihm in dieser Reihenfolge: die Reihenfolge der Stationen in der Geschichte; ob weite Sprünge über die Totale gehen sollen (sie tun es automatisch); welches reale Material er liefern wird und wann; der Kunststil (drei zeigen, einen auswählen); was nicht im Bild erscheinen darf. Schreiben Sie jede Entscheidung mit einem Datum in das Storyboard. Bauen Sie dann das gesamte Deck, zeichnen Sie es auf und senden Sie das Video. Erwarten Sie drei oder vier Runden Anmerkungen, die jeweils fünf Einstellungen betreffen.