apply feedback to termin 1: wtf theme, 50/50 images, speaker notes

IMAGE_LIST.md

@@ -26,56 +26,57 @@ This document lists all images needed for the lecture slides. Each image include
 
 ## Termin 1: Grundlagen, Text & Audio
 
-### ⬚ matrix-code.png
+### ✅ matrix-code.png
-- **Context**: Opening visual for "Mysterium" hex dump slide
+- **Context**: Opening visual for "WTF!?" hex dump slide
 - **AI Prompt**: Matrix-style green digital rain code falling on black background, glowing green characters, cyberpunk hacker aesthetic, mysterious data visualization
 
-### ⬚ lightbulb-onoff.png
+### ✅ lightbulb-onoff.png
 - **Context**: Explaining the bit concept (0 or 1, on or off)
 - **AI Prompt**: Simple lightbulb comparison: one lit bright yellow, one dark/off, side by side, clean minimal style, binary concept visualization, white background
 
-### ⬚ grayscale-gradient.png
+### ✅ grayscale-gradient.png ⚠️ NEEDS REGENERATION
 - **Context**: Explaining 256 grayscale values (0=black to 255=white)
-- **AI Prompt**: Smooth horizontal grayscale gradient from pure black on left to pure white on right, demonstrating 256 shades, clean minimal style, technical demonstration
+- **AI Prompt**: Horizontal grayscale gradient bar on a neutral gray background (#808080), gradient goes from pure black (left) to pure white (right), add visible value labels "0" on left and "255" on right, ensure edges are clearly visible against background, clean educational diagram style, 16:9 aspect ratio
+- **Issue**: Current image has barely visible edges on left (black) and right (white) sides
 
-### ⬚ rgb-color-model.png
+### ✅ rgb-color-model.png
 - **Context**: Explaining RGB color model (3 bytes per pixel)
 - **AI Prompt**: RGB color model visualization showing three overlapping circles (red, green, blue) creating cyan, magenta, yellow, and white in overlaps, clean educational diagram style
 
-### ⬚ ascii-table.png
+### ✅ ascii-table.png
-- **Context**: Showing ASCII character encoding
+- **Context**: Showing ASCII character encoding (7-bit, 128 characters total)
-- **AI Prompt**: Clean ASCII table showing characters 0-127 with their decimal and hex values, vintage computer terminal aesthetic, green on black or clean white background, educational reference chart
+- **AI Prompt**: Clean ASCII table showing printable characters 32-126 with their decimal and hex values, vintage computer terminal aesthetic, green on black or clean white background, educational reference chart. Note: ASCII is 7-bit encoding with 128 total characters (0-127), not 256. First 32 (0-31) are control characters, 127 is DEL.
 
-### ⬚ hex-binary-table.png
+### ✅ hex-binary-table.png
 - **Context**: Hex to binary conversion reference
 - **AI Prompt**: Clean conversion table showing hexadecimal digits 0-F with their 4-bit binary equivalents, educational reference style, programmer cheat sheet aesthetic
 
-### ⬚ hexeditor-screenshot.png
+### ✅ hexeditor-screenshot.png
 - **Context**: Showing what a hex editor looks like
 - **AI Prompt**: Screenshot of hex editor software showing file bytes in hexadecimal with ASCII representation on the right side, typical hex editor layout, technical software interface
 
-### ⬚ cassette-ipod.png
+### ✅ cassette-ipod.png
 - **Context**: Audio format evolution intro
 - **AI Prompt**: Vintage audio cassette tape next to modern iPod or MP3 player, technology evolution comparison, nostalgic meets modern, clean product photography style
 
-### ⬚ compression-types.png
+### ✅ compression-types.png
 - **Context**: Lossless vs lossy compression comparison
 - **AI Prompt**: Split diagram comparing lossless (ZIP icon, identical files) vs lossy (JPEG/MP3 icon, smaller but different), educational infographic style, clear visual distinction
 
-### ⬚ karlheinz-brandenburg.jpg
+### ✅ karlheinz-brandenburg.jpg
-- **Context**: MP3 inventor portrait/reference
+- **Context**: MP3 inventor portrait/reference (Fraunhofer IIS)
 - **AI Prompt**: Professional portrait style of a German scientist/engineer in academic setting, Fraunhofer institute aesthetic, 1990s technology pioneer look (or use real photo)
 
-### ⬚ suzanne-vega.jpg
+### ✅ suzanne-vega.jpg
-- **Context**: "Tom's Diner" - the song used to test MP3
+- **Context**: "Tom's Diner" - the song used to test MP3 compression
 - **AI Prompt**: Female singer-songwriter aesthetic, acoustic guitar, 1980s folk music style, intimate cafe performance setting (or use real photo)
 
-### ⬚ audio-spectrogram.png
+### ✅ audio-spectrogram.png
-- **Context**: Visualizing audio frequencies
+- **Context**: Visualizing audio frequencies and MP3 compression effects
 - **AI Prompt**: Colorful audio spectrogram visualization showing frequency spectrum over time, rainbow gradient from low (red) to high (blue) frequencies, scientific audio analysis display
 
-### ⬚ napster-interface.png
+### ✅ napster-interface.png
-- **Context**: MP3 piracy era / file sharing history
+- **Context**: MP3 piracy era / file sharing history (1999-2001)
 - **AI Prompt**: Late 1990s peer-to-peer file sharing interface aesthetic, Windows 98/2000 style dialog boxes, music file listings, nostalgic internet era, retro software UI
 
 ---
@@ -301,11 +302,13 @@ This document lists all images needed for the lecture slides. Each image include
 | Lecture | Total | ✅ Done | ⬚ Todo |
 |---------|-------|--------|--------|
 | Intro | 1 | 1 | 0 |
-| Termin 1 (Grundlagen/Text/Audio) | 13 | 0 | 13 |
+| Termin 1 (Grundlagen/Text/Audio) | 13 | 13 | 0 |
 | Termin 2 (Bild/Audio/Video) | 10 | 10 | 0 |
 | Termin 3 (Speichermedien) | 16 | 0 | 16 |
 | Termin 4 (Distribution/APIs) | 25 | 0 | 25 |
-| **Total** | **65** | **11** | **54** |
+| **Total** | **65** | **24** | **41** |
+
+**Note:** grayscale-gradient.png is marked ⚠️ NEEDS REGENERATION due to visibility issues at edges.
 
 ## Generation Tips
 

slides/2025-12-19-termin-0-intro.md

@@ -1,3 +1,24 @@
+---
+marp: true
+theme: gaia
+paginate: true
+backgroundColor: #fff
+header: "Dateiformate, Schnittstellen, Speichermedien & Distributionswege"
+footer: "Michael Czechowski – HdM Stuttgart – WS 2025/26"
+title: Dateiformate, Schnittstellen, Speichermedien & Distributionswege
+---
+
+<style>
+section {
+  font-size: 1.7rem;
+}
+h2 {
+  color: var(--color-dimmed);
+}
+</style>
+
+<!-- _class: invert -->
+
 ![bg fit](./assets/digital-landscape.png)
 
 <!-- Startbild: Futuristisches Netzwerk, Datenströme, oder digitale Landschaft -->
@@ -21,7 +42,7 @@ Hochschule der Medien Stuttgart
 - Softwareentwickler & IT-Berater
 - Schwerpunkte: Cloud, AI, Web-Technologien, Systemarchitektur, Open Source
 - Hintergrund: Philosophie & Informatik
-- Kontakt: czechowski@hdm-stuttgart.de
+- Kontakt: michael.czechowski@lehre.dhbw-stuttgart.de
 
 <!--
 Kurze Vorstellung
@@ -54,18 +75,22 @@ Fragen jederzeit willkommen
 3. Wer weiß, was der Unterschied zwischen JPEG und PNG ist?
 4. Wer hat schon mal mit APIs gearbeitet?
 5. Wer weiß, was UTF-8 bedeutet?
+6. **Wer hat schon mal HTML oder CSS gemacht?** (Hex-Farben wie `#FF0000`?)
 
 <!--
 Niveau der Gruppe einschätzen
 Keine falschen Antworten
 Zeigt, wo wir starten
+HTML/CSS-Frage: Viele kennen Hex-Codes aus Webdesign
 -->
 
 ---
 
 # Kursübersicht
 
-**Ziel:** Verstehen, wie digitale Medien technisch funktionieren – von Bits bis zu globalen Distributionsnetzwerken
+**Ziel:** Technische Grundlagen verstehen, um mit Entwicklungsteams, Kunden und Projektpartnern auf Augenhöhe zusammenarbeiten zu können.
+
+Die Digitalisierung verändert alle Branchen. Kaum ein Projekt in der Medienwelt kommt ohne digitale Technik aus – als Produkt, Kollaborationsplattform oder Marketing-/Verkaufskanal.
 
 **5 Termine:**
 - **19.12.** Bits, Bytes, Zeichenkodierung & Audio-Kompression
@@ -75,9 +100,10 @@ Zeigt, wo wir starten
 - **TBA** Vertiefung & offene Fragen
 
 <!--
+Aus dem Modulhandbuch "Internettechnologien 1":
+Grundkenntnisse der Internettechnologien sind unabdingbar für gemeinsames Verständnis von Projektanforderungen.
 Medienwissenschaftler:innen, nicht Informatiker:innen
 Fokus: Warum funktionieren Dinge so? Welche Konflikte stecken dahinter?
 Hands-On jede Woche (30-40 Min)
-Narrative statt Faktenlisten
 -->
 

slides/2025-12-19-termin-1-grundlagen-text-audio.md

@@ -1,3 +1,26 @@
+---
+marp: true
+theme: gaia
+paginate: true
+backgroundColor: #fff
+header: "Dateiformate, Schnittstellen, Speichermedien & Distributionswege"
+footer: "Michael Czechowski – HdM Stuttgart – WS 2025/26"
+title: Dateiformate, Schnittstellen, Speichermedien & Distributionswege
+---
+
+<style>
+section {
+  font-size: 1.7rem;
+}
+h2 {
+  color: var(--color-dimmed);
+}
+</style>
+
+<!-- _class: invert -->
+
+![bg fit](./assets/digital-landscape.png)
+
 ---
 
 <!-- _class: lead -->
@@ -9,7 +32,7 @@
 
 ![bg right:40%](./assets/matrix-code.png)
 
-# Mysterium
+# WTF!?
 
 ```
 89 50 4E 47 0D 0A 1A 0A
@@ -28,6 +51,18 @@ Fragen in den Raum: "Was seht ihr?"
 
 ---
 
+<!-- _header: '' -->
+<!-- _footer: '' -->
+
+![bg](./assets/lightbulb-onoff.png)
+
+<!--
+Bit = Binary Digit
+Demonstration: Glühbirne AN/AUS = 1 Bit
+-->
+
+---
+
 # Das Bit
 
 **Kleinste Informationseinheit**
@@ -36,11 +71,8 @@ Fragen in den Raum: "Was seht ihr?"
 - AN oder AUS
 - Strom fließt oder nicht
 
-![bg right:50%](./assets/lightbulb-onoff.png)
-
 <!--
-Bit = Binary Digit
+BIT = Binary Digit (Binärziffer) – 1948 von Claude Shannon geprägt
-Demonstration: Glühbirne AN/AUS = 1 Bit
 Alles Digitale basiert darauf
 Transistoren in CPUs: Milliarden Bits schalten Millionen Mal pro Sekunde
 -->
@@ -59,9 +91,22 @@ Transistoren in CPUs: Milliarden Bits schalten Millionen Mal pro Sekunde
 2⁸ = **256 Möglichkeiten** (0-255)
 
 <!--
-Rechnung gemeinsam: 2×2×2×2×2×2×2×2 = 256
+BYTE = Wortspiel aus "Bit" + "Bite" (Bissen)
-Jedes Bit kann 0 oder 1 sein
+Warum 8 Bits? Historisch: IBM System/360 (1964) setzte Standard
-256 verschiedene Werte mit 8 Bits darstellbar
+Vorher: 6-Bit, 7-Bit Systeme (z.B. ASCII = 7 Bit)
+8 Bit = 2 Hex-Ziffern = praktisch für Hardware
+Rechnung: 2×2×2×2×2×2×2×2 = 256
+-->
+
+---
+
+<!-- _header: '' -->
+<!-- _footer: '' -->
+
+![bg](./assets/grayscale-gradient.png)
+
+<!--
+256 Graustufen: 0 = Schwarz, 255 = Weiß
 -->
 
 ---
@@ -73,8 +118,6 @@ Jedes Bit kann 0 oder 1 sein
 - **256 Lautstärkestufen**
 - **Zahlen 0-255** (oder -128 bis +127)
 
-![bg left:40%](./assets/grayscale-gradient.png)
-
 <!--
 1 Byte ist extrem limitiert
 Für Farbbild: 3 Bytes pro Pixel (RGB)
@@ -83,6 +126,17 @@ R=0-255, G=0-255, B=0-255 → 256³ = 16,7 Millionen Farben
 
 ---
 
+<!-- _header: '' -->
+<!-- _footer: '' -->
+
+![bg](./assets/rgb-color-model.png)
+
+<!--
+RGB = Additive Farbmischung (Bildschirme)
+-->
+
+---
+
 # Farben: RGB-Modell
 
 **1 Pixel = 3 Bytes**
@@ -91,18 +145,16 @@ R=0-255, G=0-255, B=0-255 → 256³ = 16,7 Millionen Farben
 - **Grün:** 0-255
 - **Blau:** 0-255
 
-**Beispiel:**
+**Beispiele:**
-`FF 00 00` = Rot
+`FF 00 00` = Rot | `00 FF 00` = Grün
-`00 FF 00` = Grün
+`00 00 00` = Schwarz | `FF FF FF` = Weiß
-`FF FF FF` = Weiß
-
-![bg right:40%](./assets/rgb-color-model.png)
 
 <!--
-RGB = Additive Farbmischung (Bildschirme)
 CMYK = Subtraktive Farbmischung (Druck)
 Hex-Notation: FF = 255 in Dezimal
 CSS-Farben nutzen Hex: #FF0000 = Rot
+Wer HTML/CSS gemacht hat, kennt das schon!
+background-color: #FF0000; = Rot
 -->
 
 ---
@@ -130,6 +182,9 @@ Chaos: Verschiedene Standards für verschiedene Sprachen
 
 ---
 
+<!-- _header: '' -->
+<!-- _footer: '' -->
+
 ![bg](./assets/ascii-table.png)
 
 <!--
@@ -191,6 +246,18 @@ UTF-8-Kodierung: Variable Länge spart Speicher bei ASCII
 
 ---
 
+<!-- _header: '' -->
+<!-- _footer: '' -->
+
+![bg](./assets/hex-binary-table.png)
+
+<!--
+Hex-Binär-Umrechnungstabelle
+Jede Hex-Ziffer = 4 Bits
+-->
+
+---
+
 # Hexadezimal: Lesbarkeit
 
 **Binär ist unleserlich:**
@@ -199,15 +266,15 @@ UTF-8-Kodierung: Variable Länge spart Speicher bei ASCII
 **Hexadezimal (Base 16):**
 `4D 50 33` (= "MP3" in ASCII)
 
-**Jede Hex-Ziffer = 4 Bits**
+**Jede Hex-Ziffer = 4 Bits (ein "Nibble")**
 0-9, A-F (10=A, 11=B, ..., 15=F)
 
-![bg right:40%](./assets/hex-binary-table.png)
-
 <!--
+Warum genau 4 Bits? 2⁴ = 16 Werte = eine Hex-Ziffer (0-F)
 Hex = Shortcut für Menschen, nicht für Computer
 Computer denken binär, wir lesen hex
 1 Byte = 2 Hex-Ziffern (00-FF)
+"Nibble" = halb Byte = 4 Bits (Wortspiel!)
 Hex-Editor: Standard-Tool für Dateianalyse
 -->
 
@@ -222,17 +289,24 @@ Hex-Editor: Standard-Tool für Dateianalyse
 | PNG | `89 50 4E 47 0D 0A 1A 0A` | `.PNG` |
 | JPEG | `FF D8 FF` | `ÿØÿ` |
 | PDF | `25 50 44 46` | `%PDF` |
-| ZIP | `50 4B 03 04` | `PK` |
+| ZIP/DOCX/ODT | `50 4B 03 04` | `PK` |
+
+**Achtung:** TXT, HTML, CSS haben **keine** Magic Number!
 
 <!--
 Magic Number = Signature am Dateianfang
-Computer schauen in erste Bytes (nicht auf .jpg/.png)
 "PK" = Phil Katz (Erfinder von PKZip)
+DOCX, XLSX, ODT = ZIP-Archive mit XML-Inhalt!
 Dateiendungen können lügen, Magic Numbers nicht
+→ FAKE CHECK: virus.exe → bild.jpg umbenennen täuscht nur Menschen
+Computer erkennt echten Typ an Magic Number
 -->
 
 ---
 
+<!-- _header: '' -->
+<!-- _footer: '' -->
+
 ![bg](./assets/hexeditor-screenshot.png)
 
 <!--
@@ -245,11 +319,12 @@ Tool: HxD (Windows), Hex Fiend (Mac), xxd (Linux)
 
 ---
 
-# Hands-On: Mystery Files
+# Hands-On: WTF Files
 
 **Aufgabe (30 Min):**
 
-1. Drei Dateien ohne Extension: `mystery1`, `mystery2`, `mystery3`
+1. Drei Dateien ohne Extension: `wtf1`, `wtf2`, `wtf3`
+   → Download: `materials/` Ordner
 2. Öffne im Hex-Editor
 3. Lies erste 16 Bytes
 4. Identifiziere Format (Magic Number)
@@ -259,14 +334,17 @@ Tool: HxD (Windows), Hex Fiend (Mac), xxd (Linux)
 
 <!--
 Praktische Phase: Studierende arbeiten selbst
-Dateien: PNG, JPEG, TXT (vorbereitet)
+Dateien im materials/ Ordner:
+- wtf1: Plaintext (keine Magic Number)
+- wtf2: PNG (89 50 4E 47)
+- wtf3: JPEG (FF D8 FF)
 Gruppenarbeit: 3-4 Personen
 Ziel: Hex-Dump lesen lernen, Dateiformate verstehen
 -->
 
 ---
 
-# Aufgabe bis nächste Woche
+# Fleißaufgabe bis nächste Woche
 
 **Finde eine Datei auf deinem Computer**
 
@@ -292,6 +370,9 @@ Bonus: Spornt Neugierige an
 
 ---
 
+<!-- _header: '' -->
+<!-- _footer: '' -->
+
 ![bg](./assets/cassette-ipod.png)
 
 <!--
@@ -326,9 +407,19 @@ Streaming? Unmöglich.
 
 ---
 
-# Zwei Philosophien
+<!-- _header: '' -->
+<!-- _footer: '' -->
 
-![bg right:50%](./assets/compression-types.png)
+![bg](./assets/compression-types.png)
+
+<!--
+Lossless vs. Lossy Kompression
+Visualisierung der beiden Philosophien
+-->
+
+---
+
+# Zwei Philosophien
 
 **Lossless (Verlustfrei):**
 - Original exakt wiederherstellbar
@@ -349,6 +440,7 @@ Trade-off: Größe vs. Qualität
 ---
 
 # Lossless: Run-Length Encoding
+## Lauflängenkodierung
 
 **Original:**
 ```
@@ -363,7 +455,8 @@ AAAAABBBCCCCCCCC
 **Ersparnis:** 16 → 6 Zeichen (62% Reduktion)
 
 <!--
-RLE = Simplest Compression Algorithm
+RLE = Run-Length Encoding = Lauflängenkodierung
+Simplest Compression Algorithm
 Gut für repetitive Daten (Fax, simple Grafiken)
 Schlecht für chaotische Daten (Fotos, Audio)
 -->
@@ -392,12 +485,21 @@ Kompression = Modell der menschlichen Wahrnehmung
 
 ---
 
-![bg](./assets/karlheinz-brandenburg.jpg)
+![bg right:50%](./assets/karlheinz-brandenburg.jpg)
+
+# Karlheinz Brandenburg
+
+**"Vater der MP3"**
+
+- Diplom-Ingenieur, Universität Erlangen-Nürnberg
+- Fraunhofer IIS (Institut für Integrierte Schaltungen)
+- Forschung ab 1982, Patent 1988
+- Hörte "Tom's Diner" über 10.000 Mal
 
 <!--
-Foto: Karlheinz Brandenburg
 Fraunhofer IIS Erlangen
-"Vater der MP3"
+Forschung dauerte über 10 Jahre
+Perfektionist: Jeder Hörtest musste bestehen
 -->
 
 ---
@@ -424,12 +526,22 @@ Patent lief 2017 aus
 
 ---
 
-![bg](./assets/suzanne-vega.jpg)
+![bg right:50%](./assets/suzanne-vega.jpg)
+
+# Suzanne Vega
+
+**"Tom's Diner" (1987)**
+
+- A cappella (keine Instrumente)
+- Klare, hohe Frequenzen
+- Perfekter Stresstest für Kompression
+- Der erste Song, der als MP3 kodiert wurde
 
 <!--
 Suzanne Vega – "Tom's Diner" (1987)
-Der erste Song, der als MP3 kodiert wurde
+A cappella = einfacher zu analysieren (nur Stimme)
-Karlheinz Brandenburg hörte ihn tausende Male
+Hohe Frequenzen = Herausforderung für Kompression
+Brandenburg hörte den Song über 10.000 Mal
 -->
 
 ---
@@ -499,6 +611,9 @@ Aber: Diminishing Returns ab 256 kbps
 
 ---
 
+<!-- _header: '' -->
+<!-- _footer: '' -->
+
 ![bg](./assets/audio-spectrogram.png)
 
 <!--
@@ -531,13 +646,22 @@ Das Pferd war aus dem Stall
 
 ---
 
-![bg](./assets/napster-interface.png)
+![bg right:50%](./assets/napster-interface.png)
+
+# Napster (1999)
+
+**P2P-Filesharing für MP3s**
+
+- Shawn Fanning, 19 Jahre alt
+- 80 Millionen User in 2 Jahren
+- Musikindustrie verklagt (2001)
+- Pandora's Box: Nicht mehr aufzuhalten
 
 <!--
-Napster-Screenshot (1999)
+P2P = Peer-to-Peer
-P2P-Filesharing für MP3s
+Shawn Fanning gründete Napster als Student
-Shawn Fanning, 19 Jahre alt
+RIAA verklagte Napster, Schließung 2001
-80 Millionen User in 2 Jahren
+Aber: LimeWire, Kazaa, BitTorrent folgten
 -->
 
 ---
@@ -601,22 +725,23 @@ Vinyl-Revival: 2020er Gegenbewegung
 1. Lade Lied runter (eigenes oder CC)
 2. Konvertiere in verschiedene Bitraten:
    - 320 kbps, 128 kbps, 64 kbps
-3. Tool: Audacity (kostenlos)
+3. Tool: **Audacity** (kostenlos)
 4. Höre Unterschiede (Kopfhörer!)
 5. Vergleiche Dateigrößen
 
-**Optional:** Spektrogramm-Ansicht
+**Spektrogramm:** Track-Menü → Spektrogramm
 
 <!--
-Audacity: FOSS Audio-Editor
+Audacity: FOSS Audio-Editor (audacityteam.org)
 Export: Datei → Exportieren → MP3 → Bitrate wählen
-Spektrogramm: Analysieren → Spektrogramm
+Spektrogramm-Ansicht: Track-Name klicken → "Spektrogramm"
-Hohe Frequenzen verschwinden bei niedriger Bitrate
+Hohe Frequenzen (oben im Bild) verschwinden bei niedriger Bitrate
+Alternative: Spek (spek.cc) – reiner Spektrogramm-Viewer
 -->
 
 ---
 
-# Aufgabe bis nächste Woche
+# Fleißaufgabe bis nächste Woche
 
 **Nimm ein Lied (eigenes oder CC)**
 
@@ -632,3 +757,23 @@ Goldenes Ohr: Manche hören Unterschied, manche nicht
 Psychoakustik in Aktion: Subjektive Wahrnehmung
 -->
 
+---
+
+<!-- _class: lead -->
+
+# Fragen & Diskussion
+
+**Kontakt:** michael.czechowski@lehre.dhbw-stuttgart.de
+**Folien:** Online verfügbar unter https://hdm.librete.ch
+
+---
+
+# Lizenz & Attribution
+
+Diese Präsentation ist lizenziert unter **Creative Commons Attribution-ShareAlike 4.0 International (CC BY-SA 4.0)**
+
+- Erlaubt Teilen & Anpassen mit Namensnennung
+- Adaptionen müssen unter gleicher Lizenz geteilt werden
+
+Vollständige Lizenz: https://creativecommons.org/licenses/by-sa/4.0/
+

slides/2026-01-09-termin-2-bild-audio-video.md

@@ -1,3 +1,26 @@
+---
+marp: true
+theme: gaia
+paginate: true
+backgroundColor: #fff
+header: "Dateiformate, Schnittstellen, Speichermedien & Distributionswege"
+footer: "Michael Czechowski – HdM Stuttgart – WS 2025/26"
+title: Dateiformate, Schnittstellen, Speichermedien & Distributionswege
+---
+
+<style>
+section {
+  font-size: 1.7rem;
+}
+h2 {
+  color: var(--color-dimmed);
+}
+</style>
+
+<!-- _class: invert -->
+
+![bg fit](./assets/digital-landscape.png)
+
 ---
 
 <!-- _class: lead -->
@@ -7,6 +30,9 @@
 
 ---
 
+<!-- _header: '' -->
+<!-- _footer: '' -->
+
 ![bg](./assets/photo-comparison.png)
 
 <!--
@@ -80,6 +106,9 @@ Dateierweiterungen: .jpg, .jpeg, .jfif (alle gleich)
 
 ---
 
+<!-- _header: '' -->
+<!-- _footer: '' -->
+
 ![bg](./assets/jpeg-artifacts.png)
 
 <!--
@@ -153,6 +182,9 @@ Photoshop "Save for Web": Standard ist 60
 
 ---
 
+<!-- _header: '' -->
+<!-- _footer: '' -->
+
 ![bg](./assets/gif-animation.png)
 
 <!--
@@ -236,6 +268,9 @@ JPEG bleibt dominant (Kompatibilität!)
 
 ---
 
+<!-- _header: '' -->
+<!-- _footer: '' -->
+
 ![bg](./assets/instagram-quality-loss.png)
 
 <!--
@@ -318,6 +353,9 @@ Forum: Austausch über Ergebnisse
 
 ---
 
+<!-- _header: '' -->
+<!-- _footer: '' -->
+
 ![bg](./assets/netflix-4k.png)
 
 <!-- 
@@ -370,6 +408,9 @@ Ein MP4 kann H.264, H.265 oder AV1 enthalten
 
 ---
 
+<!-- _header: '' -->
+<!-- _footer: '' -->
+
 ![bg](./assets/container-codec-diagram.png)
 
 <!-- 
@@ -430,6 +471,9 @@ Wenn du vorspulst: Sucht nach nächstem I-Frame
 
 ---
 
+<!-- _header: '' -->
+<!-- _footer: '' -->
+
 ![bg](./assets/iframe-pframe-diagram.png)
 
 <!-- 
@@ -512,6 +556,9 @@ Fragmentierung verzögert Adoption
 
 ---
 
+<!-- _header: '' -->
+<!-- _footer: '' -->
+
 ![bg](./assets/youtube-vp9.png)
 
 <!-- 
@@ -545,6 +592,9 @@ Hardware-Decoder erst ab ~2016 (langsame Adoption)
 
 ---
 
+<!-- _header: '' -->
+<!-- _footer: '' -->
+
 ![bg](./assets/av1-logo.png)
 
 <!-- 
@@ -606,6 +656,9 @@ Player misst Bandbreite, wechselt live
 
 ---
 
+<!-- _header: '' -->
+<!-- _footer: '' -->
+
 ![bg](./assets/streaming-quality-switch.png)
 
 <!-- 
@@ -684,3 +737,23 @@ Encoding-Zeit: H.265 ~5x langsamer, AV1 ~50x langsamer
 Qualität: Bei gleicher Bitrate H.265 > H.264
 -->
 
+---
+
+<!-- _class: lead -->
+
+# Fragen & Diskussion
+
+**Kontakt:** czechowski@hdm-stuttgart.de
+**Folien:** Online verfügbar unter https://hdm.librete.ch
+
+---
+
+# Lizenz & Attribution
+
+Diese Präsentation ist lizenziert unter **Creative Commons Attribution-ShareAlike 4.0 International (CC BY-SA 4.0)**
+
+- Erlaubt Teilen & Anpassen mit Namensnennung
+- Adaptionen müssen unter gleicher Lizenz geteilt werden
+
+Vollständige Lizenz: https://creativecommons.org/licenses/by-sa/4.0/
+

slides/2026-01-23-termin-3-speichermedien-schnittstellen.md

@@ -1,3 +1,26 @@
+---
+marp: true
+theme: gaia
+paginate: true
+backgroundColor: #fff
+header: "Dateiformate, Schnittstellen, Speichermedien & Distributionswege"
+footer: "Michael Czechowski – HdM Stuttgart – WS 2025/26"
+title: Dateiformate, Schnittstellen, Speichermedien & Distributionswege
+---
+
+<style>
+section {
+  font-size: 1.7rem;
+}
+h2 {
+  color: var(--color-dimmed);
+}
+</style>
+
+<!-- _class: invert -->
+
+![bg fit](./assets/digital-landscape.png)
+
 ---
 
 <!-- _class: lead -->
@@ -7,6 +30,9 @@
 
 ---
 
+<!-- _header: '' -->
+<!-- _footer: '' -->
+
 ![bg](./assets/hdd-ssd-comparison.png)
 
 <!--
@@ -58,6 +84,9 @@ Windows: NTFS, macOS: APFS, Linux: ext4
 
 ---
 
+<!-- _header: '' -->
+<!-- _footer: '' -->
+
 ![bg](./assets/directory-tree.png)
 
 <!-- 
@@ -221,6 +250,9 @@ Sicherheit: APFS/NTFS für Verschlüsselung
 
 ---
 
+<!-- _header: '' -->
+<!-- _footer: '' -->
+
 ![bg](./assets/backup-disaster.png)
 
 <!-- 
@@ -313,6 +345,9 @@ Syncthing: P2P-Sync, kein zentraler Server
 
 ---
 
+<!-- _header: '' -->
+<!-- _footer: '' -->
+
 ![bg](./assets/bit-rot.png)
 
 <!-- 
@@ -343,6 +378,9 @@ Offene Standards: PDF/A, TIFF, TXT überleben
 
 ---
 
+<!-- _header: '' -->
+<!-- _footer: '' -->
+
 ![bg](./assets/lto-tape.png)
 
 <!-- 
@@ -374,6 +412,9 @@ Cold Storage: Daten, die selten gebraucht werden
 
 ---
 
+<!-- _header: '' -->
+<!-- _footer: '' -->
+
 ![bg](./assets/m-disc.png)
 
 <!-- 
@@ -401,6 +442,9 @@ Nachteil: Teurer (~5€ vs. 0,50€ normale Blu-ray)
 
 ---
 
+<!-- _header: '' -->
+<!-- _footer: '' -->
+
 ![bg](./assets/dna-helix.png)
 
 <!-- 
@@ -481,6 +525,9 @@ Bonus: Wer's macht, hat echten Nutzen
 
 ---
 
+<!-- _header: '' -->
+<!-- _footer: '' -->
+
 ![bg](./assets/cable-mess.png)
 
 <!-- 
@@ -510,6 +557,9 @@ Ohne Standards: Jedes Gerät braucht eigenes Kabel
 
 ---
 
+<!-- _header: '' -->
+<!-- _footer: '' -->
+
 ![bg](./assets/pc-back-1990s.png)
 
 <!-- 
@@ -565,6 +615,9 @@ USB 4 basiert auf Thunderbolt 3 (Intel spendete Spec)
 
 ---
 
+<!-- _header: '' -->
+<!-- _footer: '' -->
+
 ![bg](./assets/usb-c-cables.png)
 
 <!-- 
@@ -651,6 +704,9 @@ EU-Regulierung: Beschriftung gefordert (aber nicht umgesetzt)
 
 ---
 
+<!-- _header: '' -->
+<!-- _footer: '' -->
+
 ![bg](./assets/thunderbolt-logo.png)
 
 <!-- 
@@ -684,6 +740,9 @@ Zertifizierung: Blitz-Logo = echt Thunderbolt
 
 ---
 
+<!-- _header: '' -->
+<!-- _footer: '' -->
+
 ![bg](./assets/hdmi-cable.png)
 
 <!-- 
@@ -722,6 +781,9 @@ Lizenzgebühren: ~$10.000 Jahresgebühr + $0,15/Gerät
 
 ---
 
+<!-- _header: '' -->
+<!-- _footer: '' -->
+
 ![bg](./assets/displayport-cable.png)
 
 <!-- 
@@ -778,6 +840,9 @@ Politik & Marketing entscheiden
 
 ---
 
+<!-- _header: '' -->
+<!-- _footer: '' -->
+
 ![bg](./assets/hdcp-warning.png)
 
 <!-- 
@@ -814,6 +879,9 @@ Classic DRM-Problem: Nervt Zahlende, nicht Piraten
 
 ---
 
+<!-- _header: '' -->
+<!-- _footer: '' -->
+
 ![bg](./assets/ethernet-cable.png)
 
 <!-- 
@@ -849,6 +917,9 @@ PoE = Power over Ethernet (Strom + Daten)
 
 ---
 
+<!-- _header: '' -->
+<!-- _footer: '' -->
+
 ![bg](./assets/vintage-ports.png)
 
 <!-- 
@@ -916,3 +987,23 @@ Viele Lade-Kabel: USB-C, aber nur USB 2.0 (langsam!)
 Forum: Erfahrungsaustausch, lustige Fundstücke
 -->
 
+---
+
+<!-- _class: lead -->
+
+# Fragen & Diskussion
+
+**Kontakt:** czechowski@hdm-stuttgart.de
+**Folien:** Online verfügbar unter https://hdm.librete.ch
+
+---
+
+# Lizenz & Attribution
+
+Diese Präsentation ist lizenziert unter **Creative Commons Attribution-ShareAlike 4.0 International (CC BY-SA 4.0)**
+
+- Erlaubt Teilen & Anpassen mit Namensnennung
+- Adaptionen müssen unter gleicher Lizenz geteilt werden
+
+Vollständige Lizenz: https://creativecommons.org/licenses/by-sa/4.0/
+

slides/2026-01-30-termin-4-distribution-apis-zukunft.md

@@ -1,3 +1,26 @@
+---
+marp: true
+theme: gaia
+paginate: true
+backgroundColor: #fff
+header: "Dateiformate, Schnittstellen, Speichermedien & Distributionswege"
+footer: "Michael Czechowski – HdM Stuttgart – WS 2025/26"
+title: Dateiformate, Schnittstellen, Speichermedien & Distributionswege
+---
+
+<style>
+section {
+  font-size: 1.7rem;
+}
+h2 {
+  color: var(--color-dimmed);
+}
+</style>
+
+<!-- _class: invert -->
+
+![bg fit](./assets/digital-landscape.png)
+
 ---
 
 <!-- _class: lead -->
@@ -1816,3 +1839,23 @@ Kritische Perspektive (Patent-Kriege, Vendor Lock-in)
 Evaluation: Feedback ernst nehmen, Kurs verbessern
 -->
 
+---
+
+<!-- _class: lead -->
+
+# Fragen & Diskussion
+
+**Kontakt:** czechowski@hdm-stuttgart.de
+**Folien:** Online verfügbar unter https://hdm.librete.ch
+
+---
+
+# Lizenz & Attribution
+
+Diese Präsentation ist lizenziert unter **Creative Commons Attribution-ShareAlike 4.0 International (CC BY-SA 4.0)**
+
+- Erlaubt Teilen & Anpassen mit Namensnennung
+- Adaptionen müssen unter gleicher Lizenz geteilt werden
+
+Vollständige Lizenz: https://creativecommons.org/licenses/by-sa/4.0/
+

slides/2026-xx-xx-termin-5-vertiefung-offene-fragen.md

@@ -1,3 +1,26 @@
+---
+marp: true
+theme: gaia
+paginate: true
+backgroundColor: #fff
+header: "Dateiformate, Schnittstellen, Speichermedien & Distributionswege"
+footer: "Michael Czechowski – HdM Stuttgart – WS 2025/26"
+title: Dateiformate, Schnittstellen, Speichermedien & Distributionswege
+---
+
+<style>
+section {
+  font-size: 1.7rem;
+}
+h2 {
+  color: var(--color-dimmed);
+}
+</style>
+
+<!-- _class: invert -->
+
+![bg fit](./assets/digital-landscape.png)
+
 ---
 
 <!-- _class: lead -->
@@ -22,3 +45,23 @@ Flexibler Termin für Nachholbedarf
 Themen nach Interesse der Studierenden
 -->
 
+---
+
+<!-- _class: lead -->
+
+# Fragen & Diskussion
+
+**Kontakt:** czechowski@hdm-stuttgart.de
+**Folien:** Online verfügbar unter https://hdm.librete.ch
+
+---
+
+# Lizenz & Attribution
+
+Diese Präsentation ist lizenziert unter **Creative Commons Attribution-ShareAlike 4.0 International (CC BY-SA 4.0)**
+
+- Erlaubt Teilen & Anpassen mit Namensnennung
+- Adaptionen müssen unter gleicher Lizenz geteilt werden
+
+Vollständige Lizenz: https://creativecommons.org/licenses/by-sa/4.0/
+

slides/_frontmatter.md

@@ -1,19 +0,0 @@
----
-marp: true
-theme: gaia
-paginate: true
-backgroundColor: #fff
-header: "Dateiformate, Schnittstellen, Speichermedien & Distributionswege"
-footer: "Michael Czechowski – HdM Stuttgart – WS 2025/26"
-title: Dateiformate, Schnittstellen, Speichermedien & Distributionswege
----
-
-<style>
-section {
-  font-size: 1.7rem;
-}
-h2 {
-  color: var(--color-dimmed);
-}
-</style>
-

slides/_outro.md

@@ -1,27 +0,0 @@
----
-
-<!-- _class: lead -->
-
-# Fragen & Diskussion
-
-**Kontakt:** czechowski@hdm-stuttgart.de
-**Folien:** Online verfügbar unter https://hdm.librete.ch
-
----
-
-# Lizenz & Attribution
-
-Diese Präsentation ist lizenziert unter **Creative Commons Attribution-ShareAlike 4.0 International (CC BY-SA 4.0)**
-
-- Erlaubt Teilen & Anpassen mit Namensnennung
-- Adaptionen müssen unter gleicher Lizenz geteilt werden
-
-Vollständige Lizenz: https://creativecommons.org/licenses/by-sa/4.0/
-
-<!-- 
-Open Educational Resources (OER)
-Studierende können Folien nutzen, remixen, teilen
-CC BY-SA: Wikipedia-Lizenz (Share-Alike)
-Attribution: "Michaล‚ Czechowski, HdM Stuttgart"
--->
-

slides/materials/wtf1

@@ -0,0 +1 @@
+Dies ist eine einfache Textdatei. Keine Magic Number hier! Plaintext hat keinen Standard-Header.