update slides: add course numbers to headers, widen stripe pattern

- add course number (223015b/c) to all slide headers
- widen klausur diagonal stripes from 20/40px to 40/80px
- expand termin-1 with analog vs digital media content
- rename wtf files exercise to hex files
This commit is contained in:
2026-01-09 11:09:13 +01:00
parent ee4d5435ed
commit fc3f3a73f5
9 changed files with 356 additions and 175 deletions

View File

@@ -3,7 +3,7 @@ marp: true
theme: gaia theme: gaia
paginate: true paginate: true
backgroundColor: #fff backgroundColor: #fff
header: "Dateiformate, Schnittstellen, Speichermedien & Distributionswege" header: "Dateiformate, Schnittstellen, Speichermedien & Distributionswege (223015b)"
footer: "Michael Czechowski HdM Stuttgart WS 2025/26" footer: "Michael Czechowski HdM Stuttgart WS 2025/26"
title: Dateiformate, Schnittstellen, Speichermedien & Distributionswege title: Dateiformate, Schnittstellen, Speichermedien & Distributionswege
--- ---
@@ -52,9 +52,9 @@ section.klausur {
background: repeating-linear-gradient( background: repeating-linear-gradient(
135deg, 135deg,
#e3f2fd, #e3f2fd,
#e3f2fd 20px, #e3f2fd 40px,
#fff 20px, #fff 40px,
#fff 40px #fff 80px
) !important; ) !important;
} }
section.klausur footer { section.klausur footer {

View File

@@ -3,7 +3,7 @@ marp: true
theme: gaia theme: gaia
paginate: true paginate: true
backgroundColor: #fff backgroundColor: #fff
header: "Dateiformate, Schnittstellen, Speichermedien & Distributionswege" header: "Dateiformate, Schnittstellen, Speichermedien & Distributionswege (223015b)"
footer: "Michael Czechowski HdM Stuttgart WS 2025/26" footer: "Michael Czechowski HdM Stuttgart WS 2025/26"
title: Dateiformate, Schnittstellen, Speichermedien & Distributionswege title: Dateiformate, Schnittstellen, Speichermedien & Distributionswege
--- ---
@@ -52,9 +52,9 @@ section.klausur {
background: repeating-linear-gradient( background: repeating-linear-gradient(
135deg, 135deg,
#e3f2fd, #e3f2fd,
#e3f2fd 20px, #e3f2fd 40px,
#fff 20px, #fff 40px,
#fff 40px #fff 80px
) !important; ) !important;
} }
section.klausur footer { section.klausur footer {
@@ -92,7 +92,7 @@ Hochschule der Medien Stuttgart
<!-- _class: lead --> <!-- _class: lead -->
# Termin 1 19.12.2025 # Teil 1: Einführung
## Grundlagen, Text & Audio ## Grundlagen, Text & Audio
--- ---
@@ -767,12 +767,12 @@ Windows vertraut der Endung, aber "file" (Linux) liest Magic Number
![bg contain right:22%](./assets/qr/hexed-it.png) ![bg contain right:22%](./assets/qr/hexed-it.png)
# Hands-On: WTF Files # Hands-On: HEX Files
**Aufgabe (30 Min):** **Aufgabe (30 Min):**
1. Drei Dateien ohne Dateiendung: 1. Drei Dateien ohne Dateiendung:
<a href="../materials/wtf1"/>`wtf1`</a> <a href="../materials/wtf2"/>`wtf2`</a> <a href="../materials/wtf3"/>`wtf3`</a> <a href="../materials/wtf1"/>`hex1`</a> <a href="../materials/wtf2"/>`hex2`</a> <a href="../materials/wtf3"/>`hex3`</a>
3. Lies erste 16 Bytes aus und identifiziere Dateiformat (Magic Number) 3. Lies erste 16 Bytes aus und identifiziere Dateiformat (Magic Number)
5. *Optional: Datei umbenennen und korrekte Dateiendung anhängen (bspw. `.jpg`)* 5. *Optional: Datei umbenennen und korrekte Dateiendung anhängen (bspw. `.jpg`)*
@@ -812,11 +812,105 @@ Visueller Kontrast: Analog vs. Digital
--- ---
# Warum digital? Das Speicherproblem <!-- _class: klausur -->
**Analog → Digital:** Kopieren ohne Qualitätsverlust, aber... # Analoge Medien
### Distribution: physisch (Kauf, Verleih, Kopie)
* **Text**
* Bücher, Zeitungen, Zeitschriften, Lochkarten
* **Bild**
* Fotografie (Negativ, Dia, Polaroid), Mikrofilm
* **Audio:**
* Schallplatte (Vinyl, Schellack), Tonband, Musikkassette
* **Video:**
* Film (35mm, Super 8), VHS, Betamax
---
# Analoge Medien: Vor- und Nachteile
| Vorteile | Nachteile |
|----------|-----------|
| Kein Abspielgerät nötig (Buch, Foto) | Qualitätsverlust bei jeder Kopie |
| Haptisches Erlebnis | Physischer Verschleiß |
| Unabhängig von Strom/Internet | Begrenzte Haltbarkeit |
| Keine Formatkonvertierung | Platzbedarf bei Lagerung |
| Eindeutiges Original | Aufwendige Durchsuchbarkeit |
<!--
GENERATIONSVERLUST:
Kassette → Kassette = jede Kopie schlechter
VHS → VHS = Rauschen nimmt zu
Schallplatte: Jedes Abspielen = minimaler Verschleiß
ABER: Analoges Original bleibt "das Original"
Digitale Kopie = identisch mit Original (kein Unterschied!)
-->
---
# Von Analog zu Digital: Die Kopier-Revolution
**Das Problem analoger Kopien:**
Kassette → Kassette → Kassette = immer schlechter
**Was Digital anders macht:**
- **Identische Kopien** kein Qualitätsverlust, nie
- **Einfache Massenproduktion** Copy & Paste
- **Perfekte Archivierung** Bits verändern sich nicht
**Daher: "Raubkopien"**
Der Begriff entstand, weil digitale Kopien *tatsächlich identisch* mit dem Original waren nicht wie bei Kassetten eine schlechtere Version.
<small>Quelle: [c64-wiki.de/wiki/Raubkopie](https://www.c64-wiki.de/wiki/Raubkopie)</small>
<!--
RAUBKOPIE: Begriff aus der Musikindustrie
Analog: Kopie war immer erkennbar schlechter
Digital: Kopie = Original (bit-identisch)
Das machte der Industrie Angst → "Raub"
Paradox: Gerade die Perfektion wurde zum "Problem"
-->
---
<!-- _class: klausur -->
# Digitale Medien
### Distribution: Datenträger (CD, USB), Download, Streaming, P2P
* **Text**
* E-Book (PDF, EPUB), Dokumente (TXT, DOCX)
* **Bild**
* Digitalfoto (JPEG, PNG, RAW, WebP, GIF)
* **Audio**
* Audiodatei (MP3, FLAC, WAV, AAC, OGG)
* **Video**
* Videodatei (MP4, MKV, AVI, WebM)
---
<!-- _class: klausur -->
# Digitale Speichermedien
* **Optische Speicher**
* CD, DVD, Blue-Ray
* **Magnetische Speicher**
* Festplatte (HDD), Magnetband (LTO)
* **Flash-Speicher**
* SSD, USB-Stick, SD-Karte
* **Cloud-Speicher**
* Dropbox, Google Drive, iCloud, AWS S3
---
# Das Speicherproblem der Digitalisierung
**CD-Qualität (1982):** **CD-Qualität (1982):**
Ziel: Analoge Schallwelle möglichst originalgetreu rekonstruieren
44.100 Hz × 16 Bit × 2 Kanäle = **10,6 MB/Minute** 44.100 Hz × 16 Bit × 2 Kanäle = **10,6 MB/Minute**
| Inhalt | Größe | Problem (1990er) | | Inhalt | Größe | Problem (1990er) |
@@ -827,10 +921,24 @@ Visueller Kontrast: Analog vs. Digital
**→ Digital ist super, aber zu groß für Speicher & Internet** **→ Digital ist super, aber zu groß für Speicher & Internet**
<!-- <!--
WARUM DIGITAL? "Springen wir nochmal zurück in die 90er, bevor das Internet den Globus umspann ..."
- Kopieren ohne Generationsverlust (Kassette → Kassette = schlechter)
- Perfekte Archivierung CD-QUALITÄT ERKLÄRT:
- Bearbeitung möglich ZIEL: Die analoge Schallwelle möglichst originalgetreu digital rekonstruieren.
Dafür brauchen wir genug "Messpunkte" (Samples) und genug Genauigkeit (Bits).
- 44.100 Hz = Sample Rate (Abtastrate)
→ 44.100 Messungen pro Sekunde
→ Nyquist-Theorem: 2× höchste hörbare Frequenz (22 kHz)
- 16 Bit = Bit Depth (Auflösung pro Sample)
→ 65.536 mögliche Lautstärkestufen
→ Dynamikumfang: ~96 dB
- 2 Kanäle = Stereo (links + rechts)
RECHNUNG:
44.100 × 16 × 2 = 1.411.200 Bit/Sekunde
= 176.400 Byte/Sekunde = ~172 KB/s
= ~10,3 MB/Minute (gerundet 10,6 MB)
DAS PROBLEM: DAS PROBLEM:
- CD = unkomprimiert, riesig - CD = unkomprimiert, riesig
@@ -858,7 +966,7 @@ Fangfrage: "Wie hoch ist die Sample Rate von Vinyls?" -> *Vinyl has no sample ra
--- ---
# Was ist Sample Rate? # Die Abtastrate (Sample Rate)
**Analog → Digital ≙ Kontinuierlich → Diskret** **Analog → Digital ≙ Kontinuierlich → Diskret**
``` ```
Analog (Vinyl): Digital (CD): Analog (Vinyl): Digital (CD):
@@ -873,7 +981,7 @@ Fangfrage: "Wie hoch ist die Sample Rate von Vinyls?" -> *Vinyl has no sample ra
(Mensch hört: ~20 Hz bis ~20.000 Hz → passt!) (Mensch hört: ~20 Hz bis ~20.000 Hz → passt!)
<!-- <!--
SAMPLE RATE = Wie oft "fotografieren" wir die Schallwelle? ABTASTRATE (Sample Rate) = Wie oft "fotografieren" wir die Schallwelle?
Stellt euch vor: Schallwelle = fahrendes Auto Stellt euch vor: Schallwelle = fahrendes Auto
- Analog: Videokamera läuft durchgehend - Analog: Videokamera läuft durchgehend
- Digital: Fotokamera macht 44.100 Fotos pro Sekunde - Digital: Fotokamera macht 44.100 Fotos pro Sekunde
@@ -897,6 +1005,47 @@ DAS SPEKTROGRAMM zeigt es:
--- ---
# Die Bittiefe (Bit Depth)
**Wie genau messen wir jeden Punkt?**
| Bittiefe | Stufen | Dynamikumfang |
|----------|--------|---------------|
| 8 Bit | 256 | ~48 dB |
| 16 Bit (CD) | 65.536 | ~96 dB |
| 24 Bit (Studio) | 16.777.216 | ~144 dB |
**16 Bit = 2¹⁶ = 65.536 Lautstärkestufen**
(von absoluter Stille bis maximaler Lautstärke)
<!--
BITTIEFE = Wie genau messen wir jeden einzelnen Punkt?
- Mehr Bits = feinere Abstufungen
- 16 Bit reicht für menschliches Hören (96 dB Dynamik)
- 24 Bit im Studio: mehr Headroom für Bearbeitung
-->
---
# Abtastrate (Sample Rate) × Bittiefe (Bit Depth)
**Zwei Dimensionen der Digitalisierung:**
| Dimension | Was bedeutet es? | CD-Qualität |
|-----------|------------------|-------------|
| **Abtastrate** (Sample Rate) | Messungen pro Sekunde (horizontal) | 44.100 Hz |
| **Bittiefe** (Bit Depth) | Genauigkeit pro Messung (vertikal) | 16 Bit |
**44.100 Hz × 16 Bit** × 2 Kanäle
<!--
Analogie: Digitalisierung = Raster über Schallwelle legen
HORIZONTAL (Abtastrate): Welche FREQUENZEN wir erfassen können
VERTIKAL (Bittiefe): DYNAMIKUMFANG (leise bis laut)
-->
---
<!-- _class: lead --> <!-- _class: lead -->
# Kompression # Kompression
@@ -904,138 +1053,62 @@ DAS SPEKTROGRAMM zeigt es:
--- ---
<!-- _header: '' --> # Wo liegt der Hebel für Kompression?
<!-- _footer: '' -->
![bg fit](./assets/compression-types.png) **CD-Qualität:** 44.100 Hz × 16 Bit × 2 Kanäle = **10,6 MB/Min**
**MP3 (128 kbps):** = **~1 MB/Min** (Faktor 10!)
**Container-Parameter (das Raster):**
| Parameter | Reduzieren → | Konsequenz |
|-----------|--------------|------------|
| Abtastrate | Weniger Messpunkte/Sek | Max. Frequenz sinkt |
| Bittiefe | Weniger Lautstärkestufen | Mehr Rauschen |
| Kanäle | Mono statt Stereo | Kein Raumklang |
<!-- <!--
Lossless vs. Lossy Kompression CONTAINER-PARAMETER:
Visualisierung der beiden Philosophien Container-Parameter bestimmen das "Raster" - wie viele Messpunkte, wie genau, wie viele Kanäle.
Wenn man diese reduziert, verliert man Qualität auf technischer Ebene.
BEISPIEL Abtastrate:
- Abtastrate 22 kHz → ALLES über 11 kHz ist physisch unmöglich zu speichern
- Das ist ein "harter" Schnitt - alles darüber ist weg
--> -->
--- ---
# Sample Rate vs. Bit Depth # Psychoakustik: Der MP3-Trick
**Zwei Dimensionen der Digitalisierung:** **Inhalt (was durchs Raster geht):**
| Dimension | Was bedeutet es? | CD-Qualität | | Methode | Reduzieren → | Konsequenz |
|-----------|------------------|-------------| |---------|--------------|------------|
| **Sample Rate** | Messungen pro Sekunde (horizontal) | 44.100 Hz | | Psychoakustik | Unhörbare Frequenzen | Kaum wahrnehmbar |
| **Bit Depth** | Genauigkeit pro Messung (vertikal) | 16 Bit |
**16 Bit = 2¹⁶ = 65.536 Lautstärkestufen** **MP3 nutzt hauptsächlich Psychoakustik**
(von absoluter Stille bis maximaler Lautstärke) → Container bleibt ähnlich, Inhalt wird "ausgedünnt"
<!-- <!--
Analogie: Digitalisierung = Raster über Schallwelle legen Psychoakustik arbeitet anders als Container-Parameter:
- Der Container (44.1 kHz, 16 Bit, Stereo) kann gleich bleiben
- Aber der INHALT wird "ausgedünnt" - nur das was wir hören können bleibt
- Das ist der Trick von MP3: Nicht das Raster verkleinern, sondern intelligent weglassen
HORIZONTAL (Sample Rate): BEISPIEL Abtastrate vs. Psychoakustik:
- Wie oft messen wir pro Sekunde? - Abtastrate 22 kHz → ALLES über 11 kHz ist physisch unmöglich zu speichern
- 44.100 Hz = 44.100 Messpunkte pro Sekunde - Psychoakustik bei 44.1 kHz → 0-22 kHz möglich, aber maskierte Frequenzen werden entfernt
- Bestimmt, welche FREQUENZEN wir erfassen können
- Nyquist-Theorem: Sample Rate ≥ 2× höchste Frequenz
- 44.100 Hz → max. ~22.050 Hz (Mensch hört bis ~20.000 Hz)
VERTIKAL (Bit Depth): MASKIERUNG:
- Wie genau messen wir jeden Punkt? - Frequenzmaskierung: Lauter Ton bei 1 kHz "überdeckt" leise Töne bei 1.1 kHz
- 16 Bit = 65.536 mögliche Werte (-32.768 bis +32.767) - Zeitliche Maskierung: Kurz vor/nach lautem Ton hören wir leise Töne nicht
- Bestimmt den DYNAMIKUMFANG (leise bis laut) - Absolute Hörschwelle: Sehr leise Töne hören wir generell nicht
- 16 Bit ≈ 96 dB Dynamik (Flüstern bis Rockkonzert)
- Mehr Bits = feinere Abstufungen = weniger Quantisierungsrauschen
KOMPRESSION nutzt beide Achsen: WARUM funktioniert MP3 so gut?
- Sample Rate reduzieren = weniger Punkte horizontal (spart Daten, verliert hohe Frequenzen) - Unser Gehör ist kein lineares Messgerät
- Bit Depth reduzieren = gröbere Stufen vertikal (spart Daten, mehr Rauschen) - Wir hören nicht alle Frequenzen gleich gut
- MP3: Wirft unhörbare Frequenzen weg + quantisiert grober wo es nicht auffällt - MP3 nutzt ein Modell des menschlichen Hörens
--> - Spart Bits dort wo wir es nicht merken
---
<!-- _class: klausur -->
# Verlustfrei vs. Verlustbehaftet
| | Verlustfrei (Lossless) | Verlustbehaftet (Lossy) |
|---|---|---|
| **Prinzip** | **Redundanz** entfernen | **Irrelevanz** entfernen |
| **Reversibel** | Ja (Original wiederherstellbar) | Nein (Daten unwiederbringlich weg) |
| **Reduktion** | 30-50% | 80-99% |
| **Formate** | ZIP, PNG, FLAC, GIF | JPEG, MP3, H.264/H.265 |
**Faustregel:**
* **Medien** → (tendenziell) verlustbehaftet
* **Vektorgrafiken**, Textdokumente, Archive, Programmcode → verlustfrei
<!--
REDUNDANZ: Wiederholende Muster kompakter darstellen (z.B. "AAAA" → "4×A")
IRRELEVANZ: Für Menschen nicht wahrnehmbar (Psychoakustik, Psychovisuell)
KLAUSURRELEVANT:
- Verlustfrei = Original 1:1 wiederherstellbar
- Verlustbehaftet = Information geht verloren, aber kaum wahrnehmbar
- Redundanz vs. Irrelevanz ist der Kernunterschied!
-->
---
# Verlustfrei: Lauflängenkodierung (RLE)
**Original:** `AAAAABBBCCCCCCCC` (16 Zeichen)
**Komprimiert:** `5A3B8C` (6 Zeichen) → **62% kleiner**
**Prinzip:** Wiederholungen zählen statt wiederholen
<!--
RLE = Run-Length Encoding = Lauflängenkodierung
Einfachster Kompressionsalgorithmus
Gut für: Fax, einfache Grafiken, Icons
Schlecht für: Fotos, Audio (zu chaotisch)
-->
---
# Verlustbehaftet: Der Trick
**Kernidee:** Entferne, was Menschen nicht wahrnehmen
| Format | Nutzt Schwächen von... | Fachbegriff |
|--------|------------------------|-------------|
| **JPEG** | Auge (Farbe < Helligkeit) | Psychovisuell |
| **MP3** | Ohr (Maskierungseffekte) | Psychoakustik |
<!--
PSYCHOVISUELL (JPEG):
- Auge nimmt Helligkeit besser wahr als Farbe
- Große Flächen besser als feine Details
- Daher: Farbinformation stärker komprimiert
PSYCHOAKUSTIK (MP3):
- Mittlere Frequenzen besser als hohe/tiefe
- Laute Töne "maskieren" leise Töne in der Nähe
- Auditory Masking: Lauter 1000 Hz-Ton leise 950 Hz unhörbar
KERNKONZEPT: Kompression = Modell der menschlichen Wahrnehmung
-->
---
![bg right:40%](./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
<!--
Fraunhofer IIS Erlangen
Forschung dauerte über 10 Jahre
Perfektionist: Jeder Hörtest musste bestehen
--> -->
--- ---
@@ -1062,6 +1135,24 @@ Patent lief 2017 aus
--- ---
![bg right:40%](./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
<!--
Fraunhofer IIS Erlangen
Forschung dauerte über 10 Jahre
Perfektionist: Jeder Hörtest musste bestehen
-->
---
![bg right:50%](./assets/suzanne-vega.jpg) ![bg right:50%](./assets/suzanne-vega.jpg)
# Suzanne Vega # Suzanne Vega
@@ -1080,6 +1171,7 @@ A cappella = einfacher zu analysieren (nur Stimme)
Hohe Frequenzen = Herausforderung für Kompression Hohe Frequenzen = Herausforderung für Kompression
Brandenburg hörte den Song über 10.000 Mal Brandenburg hörte den Song über 10.000 Mal
--> -->
<!--
--- ---
@@ -1094,7 +1186,6 @@ Brandenburg hörte den Song über 10.000 Mal
> Wenn ich Suzanne Vegas Stimme kodieren könnte, kann ich alles kodieren. > Wenn ich Suzanne Vegas Stimme kodieren könnte, kann ich alles kodieren.
— Karlheinz Brandenburg — Karlheinz Brandenburg
<!--
Brandenburg hörte Song 10.000+ Mal Brandenburg hörte Song 10.000+ Mal
A cappella = einfacher zu analysieren (nur Stimme) A cappella = einfacher zu analysieren (nur Stimme)
Hohe Frequenzen = Herausforderung für Kompression Hohe Frequenzen = Herausforderung für Kompression
@@ -1158,7 +1249,7 @@ MP3 ist KEIN einfaches "Kleiner machen"
**Original CD:** 1.411 kbps (unkomprimiert) **Original CD:** 1.411 kbps (unkomprimiert)
<!-- <!--
kbps = Kilobit pro Sekunde kbps = Kilobit pro Sekunde
128 kbps = Standard in 2000ern (Napster-Ära) 128 kbps = Standard in 2000ern (Napster-Ära)
320 kbps = Maximum für MP3 320 kbps = Maximum für MP3
@@ -1168,6 +1259,89 @@ Aber: Diminishing Returns ab 256 kbps
--- ---
<!-- _header: '' -->
<!-- _footer: '' -->
![bg fit](./assets/compression-types.png)
<!--
Lossless vs. Lossy Kompression
Visualisierung der beiden Philosophien
-->
---
<!-- _class: klausur -->
# Verlustfrei vs. Verlustbehaftet
| | Verlustfrei (Lossless) | Verlustbehaftet (Lossy) |
|---|---|---|
| **Prinzip** | **Redundanz** entfernen | **Irrelevanz** entfernen |
| **Reversibel** | Ja (Original wiederherstellbar) | Nein (Daten unwiederbringlich weg) |
| **Reduktion** | 30-50% | 80-99% |
| **Formate** | ZIP, PNG, FLAC, GIF | JPEG, MP3, H.264/H.265 |
**Faustregel:**
* **Medien**, Bilder, Videos, Audio → (tendenziell) verlustbehaftet
* **Vektorgrafiken**, Textdokumente, Archive, Programmcode → verlustfrei
<!--
REDUNDANZ: Wiederholende Muster kompakter darstellen (z.B. "AAAA" → "4×A")
IRRELEVANZ: Für Menschen nicht wahrnehmbar (Psychoakustik, Psychovisuell)
KLAUSURRELEVANT:
- Verlustfrei = Original 1:1 wiederherstellbar
- Verlustbehaftet = Information geht verloren, aber kaum wahrnehmbar
- Redundanz vs. Irrelevanz ist der Kernunterschied!
-->
---
# Beispiel: Verlustbehaftet (lossy)
**Kernidee:** Entferne, was Menschen nicht wahrnehmen
| Format | Nutzt Schwächen von... | Fachbegriff |
|--------|------------------------|-------------|
| **JPEG** | Auge (Farbe < Helligkeit) | Psychovisuell |
| **MP3** | Ohr (Maskierungseffekte) | Psychoakustik |
<!--
PSYCHOVISUELL (JPEG):
- Auge nimmt Helligkeit besser wahr als Farbe
- Große Flächen besser als feine Details
- Daher: Farbinformation stärker komprimiert
PSYCHOAKUSTIK (MP3):
- Mittlere Frequenzen besser als hohe/tiefe
- Laute Töne "maskieren" leise Töne in der Nähe
- Auditory Masking: Lauter 1000 Hz-Ton leise 950 Hz unhörbar
KERNKONZEPT: Kompression = Modell der menschlichen Wahrnehmung
-->
---
# Beispiel: Verlustfrei (lossless)
### Lauflängenkodierung (RLE)
**Original:** `AAAAABBBCCCCCCCC` (16 Zeichen)
**Komprimiert:** `5A3B8C` (6 Zeichen) → **62% kleiner**
**Prinzip:** Wiederholungen zählen statt wiederholen
<!--
RLE = Run-Length Encoding = Lauflängenkodierung
Einfachster Kompressionsalgorithmus
Gut für: Fax, einfache Grafiken, Icons
Schlecht für: Fotos, Audio (zu chaotisch)
-->
---
<!-- _header: '' --> <!-- _header: '' -->
<!-- _footer: '' --> <!-- _footer: '' -->
<!-- _backgroundColor: #000 --> <!-- _backgroundColor: #000 -->
@@ -1233,10 +1407,10 @@ Aber: LimeWire, Kazaa, BitTorrent folgten
**Musikindustrie:** **Musikindustrie:**
- CDs kosten $15-20 - CDs kosten $15-20
- MP3s gratis (illegal, aber egal) - MP3s gratis (illegal, aber yolo)
- Einzelne Songs statt Alben - Einzelne Songs statt Alben
**2001:** Napster verklagt, geschlossen **2001:** Napster wird verklagt und schließt
**Aber:** Pandora's Box offen **Aber:** Pandora's Box offen
→ LimeWire, Kazaa, BitTorrent, später Spotify → LimeWire, Kazaa, BitTorrent, später Spotify
@@ -1259,10 +1433,10 @@ Spotify (2008): Streaming-Ära beginnt
✓ Musik wurde portabel (Walkman → iPod) ✓ Musik wurde portabel (Walkman → iPod)
✓ Alben wurden irrelevant (Playlists) ✓ Alben wurden irrelevant (Playlists)
✓ Musikkonsum explodierte (kostenlos/billig) ✓ Musikkonsum explodierte (kostenlos/billig)
✓ Künstler verloren Kontrolle ✓ KünstlerInnen verloren Kontrolle
**Aber auch:** **Aber auch:**
❌ Künstler verdienen weniger pro Stream ❌ KünstlerInnen verdienen weniger pro Stream
❌ Audio-Qualität sank (Loudness War) ❌ Audio-Qualität sank (Loudness War)
❌ Physische Medien starben ❌ Physische Medien starben
@@ -1278,6 +1452,8 @@ Vinyl-Revival: 2020er Gegenbewegung
--- ---
<!-- _class: aufgabe -->
# Hands-On: Audio-Spektrogram # Hands-On: Audio-Spektrogram
**Aufgabe (30 Min):** **Aufgabe (30 Min):**

View File

@@ -3,7 +3,7 @@ marp: true
theme: gaia theme: gaia
paginate: true paginate: true
backgroundColor: #fff backgroundColor: #fff
header: "Dateiformate, Schnittstellen, Speichermedien & Distributionswege" header: "Dateiformate, Schnittstellen, Speichermedien & Distributionswege (223015b)"
footer: "Michael Czechowski HdM Stuttgart WS 2025/26" footer: "Michael Czechowski HdM Stuttgart WS 2025/26"
title: Dateiformate, Schnittstellen, Speichermedien & Distributionswege title: Dateiformate, Schnittstellen, Speichermedien & Distributionswege
--- ---
@@ -52,9 +52,9 @@ section.klausur {
background: repeating-linear-gradient( background: repeating-linear-gradient(
135deg, 135deg,
#e3f2fd, #e3f2fd,
#e3f2fd 20px, #e3f2fd 40px,
#fff 20px, #fff 40px,
#fff 40px #fff 80px
) !important; ) !important;
} }
section.klausur footer { section.klausur footer {
@@ -96,7 +96,7 @@ Hochschule der Medien Stuttgart
<!-- _class: lead --> <!-- _class: lead -->
# Termin 2 09.01.2026 # Teil 1: Dateiformate
## Bild-, Audio- & Videoformate ## Bild-, Audio- & Videoformate
--- ---
@@ -707,9 +707,10 @@ Quelle: https://www.canon.com.hk/cpx/en/technical/va_EOS_Movie_Compression_Optio
--- ---
# H.264: Der König <!-- _class: klausur -->
**H.264 / AVC (2003)** # H.264 / AVC Codec (2003)
### Der bisherige Platzhirsch
**Warum dominant?** **Warum dominant?**
✓ Exzellente Kompression (100:1 möglich) ✓ Exzellente Kompression (100:1 möglich)
@@ -755,9 +756,8 @@ Patent-Pool: Firmen teilen Patente, gemeinsame Lizenzierung
--- ---
# H.265 / HEVC # H.265 / HEVC Codec (2013)
**H.265 (2013):**
50% bessere Kompression als H.264 50% bessere Kompression als H.264
**ABER:** Patent-Desaster **ABER:** Patent-Desaster
@@ -827,6 +827,8 @@ Alliance for Open Media
--- ---
<!-- _class: klausur -->
# AV1: Die Open-Source-Revolution # AV1: Die Open-Source-Revolution
**AV1 (2018):** **AV1 (2018):**
@@ -838,6 +840,7 @@ Alliance for Open Media: Google, Netflix, Amazon, Microsoft, Apple, Mozilla...
✓ 30% besser als H.265 ✓ 30% besser als H.265
✓ Royalty-free, Open Source ✓ Royalty-free, Open Source
✓ 8K, HDR, hohe Frame-Rates ✓ 8K, HDR, hohe Frame-Rates
✓ Erster Codec, der einen Grammy gewonnen hat (2025)
**Stand 2025:** **Stand 2025:**
YouTube, Netflix nutzen AV1 für 4K/8K YouTube, Netflix nutzen AV1 für 4K/8K
@@ -848,6 +851,8 @@ Alle Big-Tech-Player vereint (historisch!)
"Fuck you" an Patent-Mafia "Fuck you" an Patent-Mafia
Problem: Encoding SEHR langsam (10-100x vs. H.264) Problem: Encoding SEHR langsam (10-100x vs. H.264)
Hardware-Encoder kommen (ab 2020er-GPUs) Hardware-Encoder kommen (ab 2020er-GPUs)
Source: https://blog.mozilla.org/en/mozilla/av1-video-codec-wins-emmy/
--> -->
--- ---

View File

@@ -3,7 +3,7 @@ marp: true
theme: gaia theme: gaia
paginate: true paginate: true
backgroundColor: #fff backgroundColor: #fff
header: "Dateiformate, Schnittstellen, Speichermedien & Distributionswege" header: "Dateiformate, Schnittstellen, Speichermedien & Distributionswege (223015b)"
footer: "Michael Czechowski HdM Stuttgart WS 2025/26" footer: "Michael Czechowski HdM Stuttgart WS 2025/26"
title: Dateiformate, Schnittstellen, Speichermedien & Distributionswege title: Dateiformate, Schnittstellen, Speichermedien & Distributionswege
--- ---
@@ -52,9 +52,9 @@ section.klausur {
background: repeating-linear-gradient( background: repeating-linear-gradient(
135deg, 135deg,
#e3f2fd, #e3f2fd,
#e3f2fd 20px, #e3f2fd 40px,
#fff 20px, #fff 40px,
#fff 40px #fff 80px
) !important; ) !important;
} }
section.klausur footer { section.klausur footer {

View File

@@ -3,7 +3,7 @@ marp: true
theme: gaia theme: gaia
paginate: true paginate: true
backgroundColor: #fff backgroundColor: #fff
header: "Dateiformate, Schnittstellen, Speichermedien & Distributionswege" header: "Dateiformate, Schnittstellen, Speichermedien & Distributionswege (223015b)"
footer: "Michael Czechowski HdM Stuttgart WS 2025/26" footer: "Michael Czechowski HdM Stuttgart WS 2025/26"
title: Dateiformate, Schnittstellen, Speichermedien & Distributionswege title: Dateiformate, Schnittstellen, Speichermedien & Distributionswege
--- ---
@@ -52,9 +52,9 @@ section.klausur {
background: repeating-linear-gradient( background: repeating-linear-gradient(
135deg, 135deg,
#e3f2fd, #e3f2fd,
#e3f2fd 20px, #e3f2fd 40px,
#fff 20px, #fff 40px,
#fff 40px #fff 80px
) !important; ) !important;
} }
section.klausur footer { section.klausur footer {

View File

@@ -3,7 +3,7 @@ marp: true
theme: gaia theme: gaia
paginate: true paginate: true
backgroundColor: #fff backgroundColor: #fff
header: "Dateiformate, Schnittstellen, Speichermedien & Distributionswege" header: "Dateiformate, Schnittstellen, Speichermedien & Distributionswege (223015b)"
footer: "Michael Czechowski HdM Stuttgart WS 2025/26" footer: "Michael Czechowski HdM Stuttgart WS 2025/26"
title: Dateiformate, Schnittstellen, Speichermedien & Distributionswege title: Dateiformate, Schnittstellen, Speichermedien & Distributionswege
--- ---
@@ -52,9 +52,9 @@ section.klausur {
background: repeating-linear-gradient( background: repeating-linear-gradient(
135deg, 135deg,
#e3f2fd, #e3f2fd,
#e3f2fd 20px, #e3f2fd 40px,
#fff 20px, #fff 40px,
#fff 40px #fff 80px
) !important; ) !important;
} }
section.klausur footer { section.klausur footer {

View File

@@ -3,7 +3,7 @@ marp: true
theme: gaia theme: gaia
paginate: true paginate: true
backgroundColor: #fff backgroundColor: #fff
header: "Grundlagen IT- und Internettechnik" header: "Grundlagen IT- und Internettechnik (223015c)"
footer: "Michael Czechowski HdM Stuttgart WS 2025/26" footer: "Michael Czechowski HdM Stuttgart WS 2025/26"
title: "Termin 1: Geschichte, Grundlagen & HTML" title: "Termin 1: Geschichte, Grundlagen & HTML"
--- ---
@@ -52,9 +52,9 @@ section.klausur {
background: repeating-linear-gradient( background: repeating-linear-gradient(
135deg, 135deg,
#fce4ec, #fce4ec,
#fce4ec 20px, #fce4ec 40px,
#fff 20px, #fff 40px,
#fff 40px #fff 80px
) !important; ) !important;
} }
section.klausur footer { section.klausur footer {

View File

@@ -3,7 +3,7 @@ marp: true
theme: gaia theme: gaia
paginate: true paginate: true
backgroundColor: #fff backgroundColor: #fff
header: "Grundlagen IT- und Internettechnik" header: "Grundlagen IT- und Internettechnik (223015c)"
footer: "Michael Czechowski HdM Stuttgart WS 2025/26" footer: "Michael Czechowski HdM Stuttgart WS 2025/26"
title: "Termin 2: Netzwerke, Protokolle & CSS" title: "Termin 2: Netzwerke, Protokolle & CSS"
--- ---
@@ -52,9 +52,9 @@ section.klausur {
background: repeating-linear-gradient( background: repeating-linear-gradient(
135deg, 135deg,
#fce4ec, #fce4ec,
#fce4ec 20px, #fce4ec 40px,
#fff 20px, #fff 40px,
#fff 40px #fff 80px
) !important; ) !important;
} }
section.klausur footer { section.klausur footer {

View File

@@ -3,7 +3,7 @@ marp: true
theme: gaia theme: gaia
paginate: true paginate: true
backgroundColor: #fff backgroundColor: #fff
header: "Grundlagen IT- und Internettechnik" header: "Grundlagen IT- und Internettechnik (223015c)"
footer: "Michael Czechowski HdM Stuttgart WS 2025/26" footer: "Michael Czechowski HdM Stuttgart WS 2025/26"
title: "Termin 3: Interaktivität & JavaScript" title: "Termin 3: Interaktivität & JavaScript"
--- ---
@@ -52,9 +52,9 @@ section.klausur {
background: repeating-linear-gradient( background: repeating-linear-gradient(
135deg, 135deg,
#fce4ec, #fce4ec,
#fce4ec 20px, #fce4ec 40px,
#fff 20px, #fff 40px,
#fff 40px #fff 80px
) !important; ) !important;
} }
section.klausur footer { section.klausur footer {