Steuerungstasten

→ nächste Folie (auch Enter oder Spacebar).
← vorherige Folie
 d  schaltet das Zeichnen auf Folien ein/aus
 p  wechselt zwischen Druck- und Präsentationsansicht
CTRL  +  vergrößert die Folien
CTRL  -  verkleinert die Folien
CTRL  0  setzt die Größenänderung zurück

Das Weiterschalten der Folien kann ebenfalls durch das Klicken auf den rechten bzw. linken Folienrand erfolgen.

Audio

Audio-Daten

  • Ein Audio-Signal, wie Sprache oder Musik, liegt typischerweise zunächst in Form von Luftschall vor und kann durch ein Mikrofon in ein analoges elektrisches Signal umsetzt werden
  • Heutzutage werden diese analogen Signale nicht mehr direkt gespeichert (z.B. als Rillen in eine Schallplatte eingraviert, oder als Magnetisierung eines Tonbands), sondern in digitaler Form gespeichert
  • Dazu wird das analoge elektrische Signal digitalisiert (d.h. abgetastet und quantisiert)

Digitalisierung von Audio

  • Die benötigte Datenmenge, um das Signal zu speichern (bzw. Datenrate, um es zu übertragen), ergibt sich aus
    • Abtastrate (wie oft wird ein Messwert genommen)
    • Quantisierung des Signals (wie viele Bits werden zur Binärkodierung eines Abtastwerts verwendet)
sampling
Signal
digitalisiertes Signal
Zeit

Digitalisierung von Audio

  • Beispiele
    • Abtastrate: 48000 Hz, Quantisierung: 16 Bits, Datenrate: 768 kbit/s
      Male Voice Concert
    • Abtastrate: 48000 Hz, Quantisierung: 8 Bits, Datenrate: 384 kbit/s
      Male Voice Concert
    • Abtastrate: 6000 Hz, Quantisierung: 16 Bits, Datenrate: 96 kbit/s
      Male Voice Concert
Quelle: Sound Quality Assessment Material CD, European Broadcasting Union (EBU), non-commerical usage only

Audiokompression

  • Durch Audiokompression kann die benötigte Datenrate stark reduziert werden
  • Beispiel: MP3-Kodierung (MPEG 1, Layer 3), ca. Faktor 10 reduzierte Datenrate bei gleicher Qualität
    • Original (Datenrate: 768 kbit/s)
      Male Voice Concert
    • MP3 (Datenrate: 64 kbit/s)
      Male Voice Concert
Quelle: Sound Quality Assessment Material CD, European Broadcasting Union (EBU), non-commerical usage only

Video

Video

  • Zeitlich veränderliche ("bewegte") Bilder wurden früher mit analogen Filmkameras aufgenommen, in denen nacheinander einzelne Bilder eines Filmstreifens belichtet wurden
  • Durch schnelles Abspielen der Einzelbilder entsteht für einen menschlichen Betrachter der Eindruck einer kontinuierlichen ("flüssigen") Bewegung
  • Heutzutage werden statt Filmstreifen die Bilder in der Regel direkt mit einer Pixelmatrix auf einem CCD- oder CMOS-Bildsensor aufgenommen

Video Datenmenge

  • Die benötigte Datenmenge, um eine Video-Signal zu speichern ergibt sich aus
    • Der Auflösung der Einzelbilder
    • Quantisierung (wie viele Bits werden zur Binärkodierung eines Pixels verwendet)
    • Der zeitlichen Abtastrate (FPS = "frames per second")
video

Video Datenmenge

  • Rechenbeispiel:
    • Auflösung: 1920 x 1080 Pixel
    • Quantisierung: 24 Bits (je 8 Bit pro Farbkanal)
    • zeitlichen Abtastrate: 24 FPS
  • Ein Video von 90 Minuten würde damit ca. 800 GB benötigen
  • Daher werden digitale Videos fast immer komprimiert abgespeichert bzw. übertragen

Zeitliche Abtastrate von Video

  • Die Frage ist, welche zeitliche Abtastrate benötigt wird, damit für einen menschlichen Betrachter der Eindruck einer kontinuierlichen ("flüssigen") Bewegung entsteht
  • Reicht 1 FPS?
Quelle: Big Buck Bunny; Creative Commons License

Zeitliche Abtastrate von Video

  • Oder reichen 4 FPS?
Quelle: Big Buck Bunny; Creative Commons License

Zeitliche Abtastrate von Video

  • 12 FPS?
  • 12 FPS ist schon einigermaßen "flüssig"
  • Es kommt jedoch stark auf die gezeigten Inhalte an
Quelle: Big Buck Bunny; Creative Commons License

Zeitliche Abtastrate von Video

  • Hier die 24 FPS Version:
  • 24 FPS ist bei Kinofilmen üblich
  • Aktuelle Filme werden vereinzelt mit 48 FPS gezeigt (z.B. The Hobbit, Avatar)
Quelle: Big Buck Bunny; Creative Commons License

Video und Audio in Webseiten

  • Seit HTML5 gibt es das <audio> und <video> Tag
  • Die Browser unterstützen nicht alle Video-Formate:
    • Die meisten aktuelle Browser (Safari, Chrome, Edge, Firefox etc.) können MP4-Video (H.264) wiedergeben
    • Die älteren Version der Browser spielen teilweise nur OGV-Video oder VP8 (WebM)
  • Das <video> bzw. <audio>-Tag erlaubt, mehrere alternative Quellen anzugeben

HTML5 <audio> / <video> Tag 

<!doctype html>
<html>
<head>
  <meta charset="utf-8">
  <title>Audio and Video</title>
</head>
<body>
  <h1>Video</h1>
  <video preload controls>
    <source src="./bunny.ogv" type='video/ogg; codecs="theora, vorbis"'>
    <source src="./bunny.webm" type='video/webm; codecs="vp8, vorbis"'>
    <source src="./bunny.mp4" type='video/mp4; codecs="avc1.58A01E, mp4a.40.2"'>
    <p> HTML5 video tag not supported </p> 
  </video> 
  <h1>Audio</h1>
  <audio controls> 
    <source src="./song.m4a" type="audio/x-aac" />
    <source src="./song.mp3" type="audio/mpeg" />
    <source src="./song.ogg" type="audio/ogg" /> 
    <p> HTML5 audio tag not supported </p> 
  </audio>
</body>
</html>

Gibt es Fragen?

questions

Anregungen oder Verbesserungsvorschläge können auch gerne per E-mail an mich gesendet werden: Kontakt

Weitere Vorlesungsfolien

Folien auf Englisch (Slides in English)

Impressum, Datenschutz,