ye4wzp/zifeiyu-ppt-skill

PPT Skill

Inhalt in 13 registrierte Layouts packen, eine einseitige Web-PPT erstellen; HTML ist die einzige Quelle, PPTX / PNG sind einmalige Ableitungen.

Harte Einschränkungen (Verstoß gegen eine führt zu Nacharbeit)

1. HTML nicht von Grund auf neu schreiben. Das Deck darf nur aus templates/seed.html kopiert werden; Folien dürfen nur die registrierten Gerüste aus references/layouts.md kopieren und den Textinhalt ersetzen.
2. Keine eigenen Klassennamen erfinden. Es dürfen nur die in base.css definierten Klassen verwendet werden; der Validator lehnt Klassennamen außerhalb der Whitelist ab.
3. Keine direkten Farbwerte oder Schriftdeklarationen. Farben nur über Token; Inline-Style erlaubt nur parametrisierte Werte für top/left/width/height/font-size/line-height.
4. Jede Seite muss data-layout="Lxx" deklarieren (L01–L13).
5. Text nur in h1/h2/h3/p; Dekorationselemente hängen an div[data-shape="rect|ellipse"]; Bilder mit <img>, keine background-image für inhaltsrelevante Bilder.
6. Daten ehrlich halten: Bei datengesteuerten Layouts wie L07/L11 müssen die echten vom Benutzer bereitgestellten Werte verwendet werden, keine Erfindungen; falls keine echten Daten vorliegen, auf konzeptionelle Layouts ausweichen.
7. Dichte pro Seite einhalten: 1 Kerninformation + maximal 4 unterstützende Punkte; bei Überschreitung Seite aufteilen; benachbarte Seiten nicht dasselbe Layout wiederholen.
8. Thema als Ganzes verwenden, ein Deck, eine Themendatei, keine Mischung von Seite zu Seite.

Arbeitsablauf

Schritt 1 · Klärung & Festlegung (einmalige Abfrage, maximal 5 Fragen)

• F1 Lieferformat (zwingend, legt den Pfad fest, später nicht mehr wechselbar): Nur Web-Präsentation → Web-Pfad; bearbeitbare .pptx → Office-Pfad.
• F2 Zielgruppe & Anlass → 2–3 Themen basierend auf der Mapping-Tabelle in references/themes.md empfehlen.
• F3 Seitenanzahl oder Dauer.
• F4 Vorhandene Materialien (Gliederung / Dokumente / Daten / Bilder / Logo).
• F5 Harte Einschränkungen. Markenfarben nur akzeptieren, wenn der Benutzer explizite Markenrichtlinien hat, sonst voreingestellte Themen verwenden.

Schritt 2 · Asset- & Faktenprüfung (zwingend bei realen Institutionen/Produkten/Daten)

• Fakten zuerst: Alle nach außen gerichteten Aussagen (Zahlen, Daten, Namen) müssen eine Quelle haben – vom Benutzer bereitgestelltes Primärmaterial oder offizielle Veröffentlichungen, die über das Internet verifiziert wurden; einzeln nachverfolgbar, KPI-Fußnoten geben die Quelle an. Nicht auffindbare harte Daten durch konzeptionelle Layouts ersetzen, nichts erfinden.
• Fotoauswahl: Bei mehr als 10 Kandidatenfotos zuerst ein Contact-Sheet (eine Rastervorschau) erstellen, dann auswählen, nicht jedes Bild einzeln betrachten.
• Text-auf-Bild-Vermeidung: Bei Layouts mit Bildern (L09/L14/L01) nach der Bildauswahl zuerst die Bildposition (Logo, Gesicht, Produkt) überprüfen, Titel und Überlagerung müssen in ruhigen Bildzonen liegen; wenn das Hauptmotiv abgeschnitten wird, anderes Bild wählen, nicht erzwingen.

Schritt 3 · Deck erstellen

mkdir -p <deck-dir>/assets && cp templates/seed.html <deck-dir>/index.html
cp -r assets/base.css assets/runtime.js assets/themes <deck-dir>/assets/

<link id="theme"> gemäß gewähltem Thema ändern; <title> ersetzen. Deck ist in sich geschlossen und kann als ganzes Verzeichnis verteilt werden.

Schritt 4 · Muster-Prüfung (zwingend bei Deck ≥ 5 Seiten)

Zuerst nur zwei Seiten erstellen: Titelseite (L01) + die inhaltlich typischste Seite. Rendering-Screenshot dem Benutzer zur Bestätigung vorlegen, erst dann in die Massenproduktion gehen. Richtungsfehler korrigieren auf 2 Seiten, nicht auf 13 Seiten nacharbeiten.

Schritt 5 · Massenbefüllung

Zuerst nach references/narratives.md eine Erzählvorlage (Pitch/Bericht/Werbung) auswählen und Seitenreihenfolge festlegen, dann Seite für Seite: Gerüst aus references/layouts.md kopieren → nur Text/Bilder ersetzen → Dichte selbst prüfen. Bilder unter <deck-dir>/assets/img/ ablegen, Benennung {Seitenzahl}-{Semantik}.{ext}.

Schritt 6 · Maschinelle Validierung (erste Qualitätssicherung)

node scripts/validate.mjs <deck-dir>          # Web-Pfad
node scripts/validate.mjs <deck-dir> --office # Office-Pfad

Fehler müssen auf null gesenkt werden. Überlauf-Reihenfolge: Text straffen → parametrisierte Inline-Styles leicht anpassen → Layout wechseln; Schriftgröße nicht unter 16px reduzieren.

Schritt 7 · Visuelle Selbstprüfung (zweite Qualitätssicherung)

node scripts/render-png.mjs <deck-dir>

Jede Seite im Rendering anzeigen, nach der P0–P3-Klassifizierung in references/checklist.md prüfen; P0/P1 müssen repariert werden.

Schritt 8 · Auslieferung

Web-Pfad liefert das Deck-Verzeichnis (index.html im Browser öffnen, Pfeiltasten zum Blättern, F für Vollbild, S für Sprecherkonsole – duale Fenster-Synchronisation, nächste Seitenvorschau, Timer, Notizen). Schreibweise der Notizen: Am Ende jeder Seite kann <aside class="notes"><p>Stichpunkt</p></aside> hinzugefügt werden, nur für den Sprecher sichtbar, nie im Rendering oder Export; schreibe "Hinweissignale" (≤3 kurze Sätze pro Seite), keine wörtlichen Manuskripte. Bei Bedarf hinzufügen:

node scripts/export-pdf.mjs <deck-dir>                            # Vektor-PDF (beide Pfade akzeptiert)
node scripts/export-pptx.mjs <deck-dir> --cjk-font "Microsoft YaHei"  # Office-Pfad

Nach dem Export muss die dritte Qualitätssicherung durchgeführt werden: Mit Präsentationssoftware .pptx und HTML-Rendering Seite für Seite vergleichen (Details siehe references/pptx-export.md).

Layout-Schnellübersicht

Nummer	Layout	Verwendungszweck
L01	Titelseite	Einstieg: Kicker + Haupttitel + Untertitel + Metainformation
L02	Inhaltsverzeichnis	3–5 Tagesordnungspunkte
L03	Kapiteltrenner	Große Nummer + Kapitelname, Rhythmuswechsel
L04	Standpunkt	Ein Satz in großer Schrift, Einzelpunkt-Betonung
L05	Zweispaltiger Vergleich	Zwei Optionen / vorher-nachher Vergleich, zwei Panels
L06	Drei-Punkt-Argumentation	Drei parallele Argumente
L07	KPI in großer Schrift	2–3 echte Datenkennzahlen
L08	Zeitleiste	4 Knoten horizontale Entwicklung
L09	Bild als visuelle Hauptansicht	Vollbild + Überlagerungstitel
L10	Fließtext + Aufzählungspunkte	Links Text, rechts drei Punkte, Standard-Inhaltsseite
L11	Tabellenzeile	4 Zeilen strukturierte Informationen: Label–Wert–Notiz
L12	Prozessschritte	4-Schritt-Prozess
L13	Endseite	Abschlusswort + Metainformation

Themen

paper (Standard, warmes Papierweiß) · graphite (dunkel) · forest (kühles Papiergrün). Auswahlgrund siehe references/themes.md.

Referenzdokumente (bei Bedarf lesen, nicht vollständig laden)

• references/layouts.md — Vollständige kopierbare Gerüste der 14 Layouts + Verwendung von Rhythmus-Dekorationen
• references/narratives.md — Drei Erzähl-Seitenfolge-Vorlagen: Pitch/Bericht/Werbung
• references/themes.md — Themenverzeichnis & Zielgruppen-Mapping
• references/authoring.md — Textdichte, Schriftgrößenregeln für Chinesisch
• references/pptx-export.md — Office-Pfad-Einschränkungen, Schriftstrategie, Export-Fehlerbehebung
• references/checklist.md — P0–P3 visuelle Selbstprüfungs-Checkliste
• references/animations.md — Semantische Animationsrezepte für den Präsentationsmodus (automatisch wirksam, Export bleibt unbeeinflusst)