From 64f057a7c007ebd796233e5853fd6f3f954ea081 Mon Sep 17 00:00:00 2001 From: Erik Thiele Date: Fri, 31 Jul 2026 10:36:34 +0200 Subject: [PATCH] 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. --- .dockerignore | 12 +++ Dockerfile | 23 ++++++ README.md | 34 ++++++++- docker-compose.yml | 16 ++++ ki-verstehen.html | 177 +++++++++++++++++++++++++++++++++++---------- nginx.conf | 39 ++++++++++ slides-manifest.js | 8 +- 7 files changed, 265 insertions(+), 44 deletions(-) create mode 100644 .dockerignore create mode 100644 Dockerfile create mode 100644 docker-compose.yml create mode 100644 nginx.conf diff --git a/.dockerignore b/.dockerignore new file mode 100644 index 0000000..895d367 --- /dev/null +++ b/.dockerignore @@ -0,0 +1,12 @@ +# Nichts davon gehört ins Image — schützt vor versehentlichem Ausliefern +# der Sprechernotizen und hält den Build-Context klein. +.git +.gitignore +.DS_Store +*.md +ki-verstehen.backup-*.html +ki-verstehen-bearbeitet.html +deck-template.html +docker-compose.yml +Dockerfile +.dockerignore diff --git a/Dockerfile b/Dockerfile new file mode 100644 index 0000000..7ff2079 --- /dev/null +++ b/Dockerfile @@ -0,0 +1,23 @@ +# Statisches Deck via nginx ausliefern — kein Build-Schritt, kein Node. +FROM nginx:alpine + +# Eigene Server-Config (macht ki-verstehen.html zur Startseite, schaltet gzip an) +COPY nginx.conf /etc/nginx/conf.d/default.conf + +# nginx-Willkommensseite entfernen, sonst liegt sie unter /index.html im Webroot +RUN rm -f /usr/share/nginx/html/index.html + +# WICHTIG: Dateien einzeln kopieren, NICHT `COPY . .` — +# Sprecher.md enthält die Sprechernotizen und darf nicht im Web landen. +# Dasselbe gilt für DESIGN.md/PATTERNS.md und die lokalen Backup-Dateien. +COPY ki-verstehen.html /usr/share/nginx/html/ +COPY config.html /usr/share/nginx/html/ +COPY slides-manifest.js /usr/share/nginx/html/ +COPY font-vorschau.html /usr/share/nginx/html/ + +EXPOSE 80 + +# Bewusst 127.0.0.1 statt localhost: nginx lauscht hier nur auf IPv4, +# "localhost" löst im Container aber zuerst auf ::1 auf -> Connection refused. +HEALTHCHECK --interval=30s --timeout=3s --start-period=5s --retries=3 \ + CMD wget -qO- http://127.0.0.1/ >/dev/null || exit 1 diff --git a/README.md b/README.md index a4cf102..62a3c55 100644 --- a/README.md +++ b/README.md @@ -7,13 +7,15 @@ per Doppelklick lauffähig, per Mail/Teams/SharePoint verteilbar. | Datei | Zweck | |---|---| -| `ki-verstehen.html` | Das eigentliche Deck. 36 Slides, 1920×1080, per `E` editierbar. | +| `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 @@ -47,6 +49,36 @@ Titelfolie und Closing sind fest verankert und lassen sich nicht abwählen. 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. diff --git a/docker-compose.yml b/docker-compose.yml new file mode 100644 index 0000000..598a1b8 --- /dev/null +++ b/docker-compose.yml @@ -0,0 +1,16 @@ +services: + deck: + build: . + image: ki-verstehen-deck + container_name: ki-verstehen-deck + ports: + # Host:Container — Deck läuft dann auf http://localhost:8080 + - "8080:80" + restart: unless-stopped + + # Für's Weiterbauen am Deck: Zeilen einkommentieren, dann werden die + # Dateien live aus dem Projektordner gelesen (kein Rebuild nötig, nur Reload). + # volumes: + # - ./ki-verstehen.html:/usr/share/nginx/html/ki-verstehen.html:ro + # - ./config.html:/usr/share/nginx/html/config.html:ro + # - ./slides-manifest.js:/usr/share/nginx/html/slides-manifest.js:ro diff --git a/ki-verstehen.html b/ki-verstehen.html index 71befec..42c39fb 100644 --- a/ki-verstehen.html +++ b/ki-verstehen.html @@ -221,8 +221,8 @@ img, video, canvas, svg { max-width: 100%; max-height: 100%; } .counter-item { text-align: left; } .counter-value { font-family: var(--font-display); font-weight: 700; font-size: 180px; line-height: 0.9; letter-spacing: -0.05em; color: var(--cancom-red); text-shadow: 0 0 60px var(--cancom-red-glow); display: block; } .counter-value .unit { font-size: 64px; color: var(--paper); text-shadow: none; } -.counter-label { font-family: var(--font-mono); font-size: 18px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--paper-mute); margin-top: 16px; line-height: 1.5; } -.counter-caption { font-size: 20px; color: var(--paper-dim); margin-top: 12px; max-width: 380px; line-height: 1.4; } +.counter-label { font-family: var(--font-mono); font-size: 16px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--paper-mute); margin-top: 12px; line-height: 1.45; } +.counter-caption { font-size: 18px; color: var(--paper-dim); margin-top: 10px; max-width: 460px; line-height: 1.4; } /* =========================================== CODE SLIDE @@ -496,6 +496,17 @@ img, video, canvas, svg { max-width: 100%; max-height: 100%; } display: block; font-family: var(--font-mono); font-weight: 700; font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--cancom-red); margin-bottom: 8px; } +/* EU AI Act — Eckdaten-Leiste */ +.aiact-facts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; } +.aiact-fact { + border-left: 2px solid var(--cancom-red); padding: 4px 0 4px 18px; + font-size: 16px; color: var(--paper-dim); line-height: 1.4; +} +.aiact-fact strong { + display: block; font-family: var(--font-mono); font-weight: 700; font-size: 13px; + letter-spacing: 0.12em; text-transform: uppercase; color: var(--paper); margin-bottom: 5px; +} + .mcp-node .term { border-bottom-color: rgba(255,255,255,0.7); } .mcp-node .term::after { border-color: rgba(255,255,255,0.7); } .mcp-node .term:hover, .mcp-node .term.term-active { color: #fff; opacity: 0.85; } @@ -586,9 +597,11 @@ img, video, canvas, svg { max-width: 100%; max-height: 100%; }
- 01 / 42 + 01 / 44 · KI verstehen - Erik Thiele + · +
@@ -620,7 +633,7 @@ img, video, canvas, svg { max-width: 100%; max-height: 100%; }
-
+
Einstieg

Wer hat heute schon
KI benutzt?

@@ -651,7 +664,7 @@ img, video, canvas, svg { max-width: 100%; max-height: 100%; }
-
+
Wie alles begann

70 Jahre Auf
und Ab.

KI ist kein Blitz aus heiterem Himmel – der Durchbruch kam durch mehr Daten, mehr Rechenleistung und eine bessere Architektur.

@@ -669,7 +682,7 @@ img, video, canvas, svg { max-width: 100%; max-height: 100%; }
-
+
Begriffe entwirren

KI ist der Oberbegriff.

@@ -768,7 +781,7 @@ img, video, canvas, svg { max-width: 100%; max-height: 100%; }
-
+
Mitmach-Spiel

Vervollständigen Sie
den Satz.

Rufen Sie mir zu, wie es weitergeht – genau das macht gleich ein LLM. Nur eben mit Milliarden Beispielen statt einem Kinderlied.

@@ -813,7 +826,7 @@ img, video, canvas, svg { max-width: 100%; max-height: 100%; }
-
+
Zwei Fachbegriffe

Token und Parameter.

Nicht überfrachten – aber diese zwei Begriffe erklären später auch typische Schwächen.

@@ -838,7 +851,7 @@ img, video, canvas, svg { max-width: 100%; max-height: 100%; }
-
+
Beispiel

Token an einem
ganz normalen Satz.

Ein LLM zerlegt Text in Wortbausteine – oft mehr, als man denkt.

@@ -861,7 +874,7 @@ img, video, canvas, svg { max-width: 100%; max-height: 100%; }
-
+
Beispiel

Parameter: die
Stellschrauben wachsen.

Parameter (Gewichte) sind Zahlen, die das Modell beim Training lernt. Sie bestimmen, wie stark eine Information die nächste beeinflusst.

@@ -887,7 +900,7 @@ img, video, canvas, svg { max-width: 100%; max-height: 100%; }
-
+
Drei Beispiele

Was sind diese
Stellschrauben konkret?

@@ -943,7 +956,7 @@ Jeder Kilometer weiter von der Innenstadt entfernt senkt den Preis um 5.000.
-
+
Eine neue Modell-Generation

Reasoning-Modelle:
wenn die KI erst nachdenkt.

Ein klassisches LLM antwortet sofort. Reasoning-Modelle wie GPT-5 Thinking, Claude mit Extended Thinking oder DeepSeek-R1 schalten einen Zwischenschritt davor.

@@ -976,7 +989,7 @@ Jeder Kilometer weiter von der Innenstadt entfernt senkt den Preis um 5.000.
-
+
Was die KI bei jeder Anfrage sieht

System-Prompt,
User-Prompt, Context.

Ein LLM hat kein eigenes Gedächtnis. Bei jeder einzelnen Anfrage wird der komplette bisherige Verlauf neu mitgeschickt.

@@ -1084,7 +1097,7 @@ Du bist ein hilfsbereiter Kundenservice-Assistent für
-
+
Die entscheidende Klarstellung

Ein LLM schlägt
nichts in einer Datenbank nach.

Das Wissen ist nicht abgelegt wie in einem Lexikon, sondern komprimiert in den Parametern – ungefähr so, wie Sie den groben Inhalt eines Buches wiedergeben können, ohne die exakten Seiten vor sich zu haben.

@@ -1094,7 +1107,7 @@ Du bist ein hilfsbereiter Kundenservice-Assistent für
-
+
Modell-Landschaft

Nicht nur ein LLM.

Hinter dem Begriff „KI-Chatbot" stecken ganz unterschiedliche Modelle – gebaut von unterschiedlichen Firmen, mit unterschiedlichen Stärken.

@@ -1113,7 +1126,7 @@ Du bist ein hilfsbereiter Kundenservice-Assistent für
-
+
Wettbewerb & Vielfalt

Wer baut sie – und was
macht den Unterschied?

@@ -1144,7 +1157,7 @@ Du bist ein hilfsbereiter Kundenservice-Assistent für
-
+
Geschäftsmodell

Womit verdienen die
großen KI-Firmen ihr Geld?

Über mehrere Kanäle gleichzeitig – aber kaum eine Firma ist damit heute schon profitabel.

@@ -1221,7 +1234,7 @@ Du bist ein hilfsbereiter Kundenservice-Assistent für
-
+
Portale & Zugänge

Wo Sie diese Modelle
finden.

@@ -1249,7 +1262,7 @@ Du bist ein hilfsbereiter Kundenservice-Assistent für
-
+
Vom Chatbot zum Agenten

Eine Eskalationsleiter.

Ein einzelner Agent ist ein Mitarbeiter. Ein Schwarm ist eine kleine Abteilung – mit Chef, Rechercheur und Qualitätskontrolle.

@@ -1264,7 +1277,7 @@ Du bist ein hilfsbereiter Kundenservice-Assistent für
-
+
Model Context Protocol

MCP ist USB-C
für KI-Anwendungen.

Früher brauchte man für jedes Gerät ein eigenes Kabel; heute passt ein Anschluss für alles. Genauso muss man dank MCP nicht mehr für jedes Tool eine Extra-Bastellösung bauen.

@@ -1298,7 +1311,7 @@ Du bist ein hilfsbereiter Kundenservice-Assistent für
-
+
Das Herzstück

KI berechnet
Wahrscheinlichkeiten – sie versteht nicht.

@@ -1314,7 +1327,7 @@ Du bist ein hilfsbereiter Kundenservice-Assistent für
-
+
Halluzination im Detail

Man hat der KI doch
keine Lügen beigebracht?

Stimmt. Niemand hat der KI das Lügen beigebracht – und trotzdem erfindet sie Dinge. Der Grund liegt in dem, wofür sie überhaupt trainiert wurde.

@@ -1347,7 +1360,7 @@ Du bist ein hilfsbereiter Kundenservice-Assistent für
-
+
Die Antwort auf Halluzination

Grounding: die KI an der
Realität verankern.

Statt sich nur auf komprimiertes Trainings-Wissen zu verlassen, bekommt die KI aktuelle, geprüfte Fakten an die Hand – bevor sie antwortet.

@@ -1451,7 +1464,7 @@ Du bist ein hilfsbereiter Kundenservice-Assistent für
-
+
Security

Worauf Sie als
Anwender achten müssen.

@@ -1483,7 +1496,7 @@ Du bist ein hilfsbereiter Kundenservice-Assistent für
-
+
Für den Alltag

Fünf Praxis-Tipps.

@@ -1498,7 +1511,7 @@ Du bist ein hilfsbereiter Kundenservice-Assistent für
-
+
Agenten selbst bauen

Ein Agent, gebaut in
Microsoft Copilot.

Kein Code nötig — die Bausteine aus diesem Vortrag stecken direkt in der Oberfläche. Ein durchgängiges Beispiel: der HR-Agent.

@@ -1518,34 +1531,106 @@ Du bist ein hilfsbereiter Kundenservice-Assistent für
- +
-
+
+ Praxisbeispiel +

Vibe Coding: Programmieren
durch Beschreiben.

+

Statt Zeile für Zeile Code zu tippen, beschreibt man in natürlicher Sprache, was entstehen soll — die KI schreibt, testet, korrigiert.

+
+
Stufe 1
Autocomplete
Klassische Code-Vervollständigung (z. B. GitHub Copilot) — schlägt beim Tippen den nächsten Codeschnipsel vor.
BeispielTippt man function berechneRabatt(, schlägt die KI den Rest der Funktion vor.
→
+
Stufe 2
Chat-
Assistent
Im Chat beschreiben, was gebraucht wird — die KI liefert einzelne Code-Blöcke zum Einfügen.
Beispiel„Schreib mir eine Funktion, die eine Telefonnummer validiert."
→
+
Stufe 3
Agentic
Coding
Werkzeuge wie Claude Code oder Cursor bekommen ein Ziel, öffnen Dateien, schreiben Code, führen ihn aus und beheben Fehler eigenständig — der Agent aus Kapitel 4.
Beispiel„Baue eine Login-Seite mit Formularvalidierung" — Ergebnis ist direkt lauffähig.
+
+

Dieses Deck ist ein Beispiel: Mitmach-Spiel, Tooltips, Sound und Konfigurator entstanden Schritt für Schritt im Dialog mit einer KI — nicht von Hand programmiert.

+
+
+ + +
+
Ausblick -

Wohin die Reise
weiter geht.

-
+

Wohin die Reise
weiter geht.

+
- Agenten + Agenten
Von Assistent zu Akteur
-
Assistenten werden zunehmend zu Agenten, die selbstständig Aufgaben erledigen.
+
Assistenten werden zu Agenten, die Aufgaben selbstständig erledigen – und im Team als Schwarm.
-
- Multimodal +
+ Multimodal
Ein Modell, alle Formate
Text, Bild, Ton und Video werden zum Standard eines einzigen Modells.
-
- Lokal +
+ Lokal
Datenschutzfreundlich
-
Lokale Modelle werden für Firmen und Privatnutzer wichtiger.
+
Modelle laufen auf dem eigenen Rechner – Daten verlassen das Haus nicht mehr.
+
+
+ Überall +
Eingebaut statt aufgerufen
+
KI wandert ins Betriebssystem und in jede Anwendung – man „geht" nicht mehr zur KI.
+
+
+ Physisch +
Raus aus dem Bildschirm
+
Robotik und Fahrzeuge bekommen dieselben Modelle – KI beginnt zu handeln, nicht nur zu reden.
+
+
+ Reguliert +
EU AI Act & Nachweispflichten
+
Firmen müssen künftig belegen, wo und wie sie KI einsetzen – Compliance wird Pflichtprogramm.
+

Die offenen Fragen bleiben: Energiebedarf, Urheberrecht und die Frage, wem die Modelle eigentlich gehören.

+
+
+ + +
+
+ Regulierung +

Der EU AI Act:
KI nach Risiko sortiert.

+

Das weltweit erste umfassende KI-Gesetz. Es reguliert nicht die Technik, sondern den Anwendungsfall – je höher das Risiko für Menschen, desto strenger die Pflichten.

+
+
+ Stufe 1 · Verboten +
Inakzeptables
Risiko
+
Komplett untersagt in der EU – unabhängig davon, wie gut die Technik funktioniert.
+
BeispielSocial Scoring, manipulative Systeme, Emotionserkennung am Arbeitsplatz.
+
+
+ Stufe 2 · Streng geprüft +
Hohes
Risiko
+
Erlaubt, aber mit harten Auflagen: Dokumentation, Risikomanagement, menschliche Aufsicht.
+
BeispielKI in Bewerbungsverfahren, Kreditvergabe, Medizin, kritischer Infrastruktur.
+
+
+ Stufe 3 · Transparenz +
Begrenztes
Risiko
+
Hauptpflicht: offenlegen, dass KI im Spiel ist. Menschen sollen nicht getäuscht werden.
+
BeispielChatbots müssen sich zu erkennen geben, KI-Bilder und Deepfakes gekennzeichnet werden.
+
+
+ Stufe 4 · Frei +
Minimales
Risiko
+
Keine besonderen Auflagen – hier fällt der Großteil der heutigen Anwendungen hinein.
+
BeispielSpam-Filter, Produktempfehlungen, KI in Computerspielen.
+
+
+
+
Seit 08/2024in Kraft, Pflichten greifen gestaffelt bis 2027
+
Auch für Nicht-EU-Firmensobald KI in der EU angeboten oder genutzt wird
+
Bis 35 Mio. € Bußgeldoder 7 % des weltweiten Jahresumsatzes
+
+

Artikel 4 verlangt seit Februar 2025 KI-Kompetenz von Mitarbeitenden – genau deshalb sitzen Sie heute hier.

-
-
+
+
Handout

Glossar der
wichtigsten Abkürzungen.

@@ -1564,7 +1649,7 @@ Du bist ein hilfsbereiter Kundenservice-Assistent für
-
+
Take-away · KI verstehen

@@ -1685,6 +1770,8 @@ class SlidePresentation { this.stage = document.getElementById('deckStage'); this.progress = document.getElementById('progressBar'); this.hud = document.getElementById('hudCounter'); + this.hudChapter = document.getElementById('hudChapter'); + this.hudChapterSep = document.getElementById('hudChapterSep'); this.setupStageScale(); this.setupKeyboardNav(); this.setupTouchNav(); @@ -1807,6 +1894,16 @@ class SlidePresentation { this.hud.textContent = String(this.currentSlide + 1).padStart(2, '0') + ' / ' + String(total).padStart(2, '0'); + + if (this.hudChapter) { + const activeSlide = this.visibleSlides[this.currentSlide]; + const id = activeSlide ? parseInt(activeSlide.dataset.slideId, 10) : null; + const entry = (typeof SLIDE_MANIFEST !== 'undefined' && id) ? + SLIDE_MANIFEST.find((s) => s.id === id) : null; + const kapitel = entry && entry.kapitel !== '—' ? entry.kapitel : ''; + this.hudChapter.textContent = kapitel; + if (this.hudChapterSep) this.hudChapterSep.style.display = kapitel ? '' : 'none'; + } } } diff --git a/nginx.conf b/nginx.conf new file mode 100644 index 0000000..848e51c --- /dev/null +++ b/nginx.conf @@ -0,0 +1,39 @@ +server { + listen 80; + server_name _; + + root /usr/share/nginx/html; + + # Das Deck ist die Startseite — "/" öffnet direkt die Präsentation. + index ki-verstehen.html; + + # Redirects relativ halten. Sonst baut nginx sie absolut zusammen und + # verliert dabei den gemappten Port (localhost/... statt localhost:8080/...). + absolute_redirect off; + + # Das Deck ist eine einzige ~160 KB große HTML-Datei — gzip lohnt sich deutlich. + gzip on; + gzip_types text/html text/css application/javascript image/svg+xml; + gzip_min_length 1024; + + # HTML/JS nicht cachen: Nach einem Deck-Update soll ein Reload sofort + # die neue Fassung zeigen, nicht die vom letzten Vortrag. + location ~* \.(html|js)$ { + add_header Cache-Control "no-cache, must-revalidate"; + } + + # Wenn jemand /config aufruft, auf die Konfigurator-Seite auflösen + location = /config { + return 302 /config.html; + } + + location / { + try_files $uri $uri/ =404; + } + + # Sicherheits-Basics. Bewusst keine strikte CSP: Das Deck lädt die + # Fonts von api.fontshare.com, eine zu enge Policy würde die Typografie brechen. + add_header X-Content-Type-Options "nosniff" always; + add_header X-Frame-Options "SAMEORIGIN" always; + add_header Referrer-Policy "no-referrer-when-downgrade" always; +} diff --git a/slides-manifest.js b/slides-manifest.js index 4c3f672..f97f07b 100644 --- a/slides-manifest.js +++ b/slides-manifest.js @@ -44,9 +44,11 @@ const SLIDE_MANIFEST = [ { id: 37, title: "Kapitel 7 · Praxis & Ausblick", kapitel: "Praxis & Ausblick", type: "divider" }, { id: 38, title: "Praktische Tipps", kapitel: "Praxis & Ausblick", type: "content" }, { id: 39, title: "Agenten selbst bauen: Microsoft Copilot", kapitel: "Praxis & Ausblick", type: "content" }, - { id: 40, title: "Ausblick", kapitel: "Praxis & Ausblick", type: "content" }, - { id: 41, title: "Glossar", kapitel: "Praxis & Ausblick", type: "content" }, - { id: 42, title: "Closing", kapitel: "—", type: "content", locked: true }, + { id: 40, title: "Vibe Coding: KI-Unterstützung beim Programmieren", kapitel: "Praxis & Ausblick", type: "content" }, + { id: 41, title: "Ausblick", kapitel: "Praxis & Ausblick", type: "content" }, + { id: 42, title: "EU AI Act: KI nach Risiko sortiert", kapitel: "Praxis & Ausblick", type: "content" }, + { id: 43, title: "Glossar", kapitel: "Praxis & Ausblick", type: "content" }, + { id: 44, title: "Closing", kapitel: "—", type: "content", locked: true }, ]; const SLIDE_CONFIG_STORAGE_KEY = 'cancomDeckSlideConfig';