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';