Files
AI-Vortrag/README.md
Erik Thiele 64f057a7c0 Add Docker deployment, EU AI Act slide, and chapter name in HUD
Serves the deck via a small nginx container (docker compose up -d).
The Dockerfile copies files individually rather than COPY . . so the
speaker notes, design docs and local backups stay out of the image.

Deck grows to 44 slides: adds a Vibe Coding slide covering AI-assisted
programming, an EU AI Act slide with the four risk tiers, and expands
the outlook from three to six trends. The HUD now also shows the
current chapter name, resolved from the slide manifest.
2026-07-31 10:36:34 +02:00

86 lines
4.3 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
# KI verstehen von den Anfängen bis zu Agenten-Schwärmen
CANCOM-Vortragsdeck im HTML-Format. Ein File, kein Build, kein Bundler
per Doppelklick lauffähig, per Mail/Teams/SharePoint verteilbar.
## Dateien
| Datei | Zweck |
|---|---|
| `ki-verstehen.html` | Das eigentliche Deck. 44 Slides, 1920×1080, per `E` editierbar. |
| `config.html` | Präsentations-Konfigurator: Slides für den Vortrag ein-/ausblenden. |
| `slides-manifest.js` | Gemeinsame Titel-/Reihenfolge-Liste, von Deck **und** Konfigurator geladen. |
| `Sprecher.md` | Sprecherkarten je Folie **nicht** Teil des Docker-Images. |
| `font-vorschau.html` | Vergleichsseite für Headline-Schriften (Rückblick auf die Font-Auswahl). |
| `DESIGN.md` | Design-System: Tokens, Typografie, Layout, Motion verbindlich für Umbauten. |
| `PATTERNS.md` | Copy-Paste-Bausteine für einzelne Slide-Typen. |
| `deck-template.html` | Leerer Startpunkt für ein neues Deck im selben Look. |
| `Dockerfile`, `docker-compose.yml`, `nginx.conf` | Deck als Webdienst ausliefern (siehe unten). |
## Präsentieren
```bash
open ki-verstehen.html
```
- `→` / Leertaste / Mausrad / Swipe: nächste Slide · `←`: vorherige · `Home`/`End`: Anfang/Ende
- `E`: Live-Editor (Text direkt auf der Bühne korrigieren, z. B. bei Kundenwunsch „anderes Wort")
- `C` oder das ⚙-Symbol oben links (Hotzone): zum Konfigurator
- 🔈-Symbol unten rechts auf der Titelfolie: erzeugter Ambient-Sound (Web Audio, keine externe Datei)
## Slides für einen Vortrag auswählen
`config.html` öffnen, Häkchen setzen/entfernen, auf „Speichern & zur Präsentation" klicken.
Die Auswahl wird als URL-Parameter ans Deck übergeben (zuverlässig auch bei `file://`, wo
`localStorage` zwischen einzelnen HTML-Dateien nicht immer geteilt wird v. a. Safari).
Titelfolie und Closing sind fest verankert und lassen sich nicht abwählen.
## Aufbau des Decks (36 Slides in 7 Kapiteln)
1. **Titel** + **Hook** (Handzeichen-Frage)
2. **Kapitel 1 · Wie alles begann** Zeitstrahl, verschachtelte Kreise (KI/ML/DL/GenAI), wie eine Maschine lernt, ANI vs. AGI
3. **Kapitel 2 · Wie ein LLM funktioniert** Mitmach-Spiel „Alle meine Entchen …", Autovervollständigung, Token & Parameter, Reasoning-Modelle, System-/User-Prompt & Context, Kontext-Limit & Compact
4. **Kapitel 3 · Die Modell-Landschaft** woher das Wissen kommt, Anbieter-Übersicht, Geschäftsmodelle, SEO vs. GEO, wo man Modelle findet
5. **Kapitel 4 · Vom Chatbot zum Agenten** Eskalationsleiter, MCP
6. **Kapitel 5 · Die Grenzen der KI** Schwächen-Übersicht, Halluzination im Detail
7. **Kapitel 6 · Sicherheit im Umgang mit KI** Prompt Injection, weitere Security-Punkte
8. **Kapitel 7 · Praxis & Ausblick** Tipps, Ausblick, Glossar, Closing
Begriffe wie *Token*, *LLM*, *MCP*, *GPT*, *ANI/AGI* u. a. sind im Fließtext anklickbar
(gepunktete Unterstreichung) und öffnen eine kurze Erklärung.
## Als Webdienst betreiben (Docker)
Statt die Datei zu verteilen, kann das Deck auch als kleiner Webdienst laufen
praktisch für Präsentationsrechner, Intranet oder Teilnehmer-Zugriff im Nachgang.
```bash
docker compose up -d --build
```
Danach: **http://localhost:8080** → öffnet direkt das Deck, `…/config.html` den Konfigurator.
```bash
docker compose down # stoppen
docker compose logs -f deck # Logs ansehen
```
Ein schlanker `nginx:alpine` liefert die statischen Dateien aus (gzip halbiert die
Übertragung auf ~44 KB). Port lässt sich in `docker-compose.yml` ändern.
**Was bewusst NICHT im Image liegt:** `Sprecher.md` (Sprechernotizen!), `DESIGN.md`,
`PATTERNS.md`, `deck-template.html` und die lokalen Backup-Dateien. Das Dockerfile
kopiert einzelne Dateien statt `COPY . .` beim Ergänzen neuer Assets muss die Liste
im `Dockerfile` mitgepflegt werden, sonst fehlen sie im Container.
Zum Weiterbauen am Deck ohne Rebuild: die `volumes:`-Zeilen in `docker-compose.yml`
einkommentieren, dann werden die Dateien live aus dem Projektordner gelesen.
Nebeneffekt gegenüber `file://`: Über `http://localhost` gilt die Seite als sicherer
Kontext der 💾-Button im Edit-Modus kann dort direkt in den gewählten Ordner speichern.
## Neues Deck bauen
Siehe `DESIGN.md` Abschnitt 8 und `PATTERNS.md` für Copy-Paste-Bausteine.
`deck-template.html` kopieren, umbenennen, Slides zusammenstellen.