Metainformationen zur Seite
  •  

Dies ist eine alte Version des Dokuments!


Screencasts als WebM

Komplexere Sachverhalte kann man am Bildschirm gut vorführen und dabei erklären:

  • Screencasts sind mit Audio (per Mikrophon) kommentierte Videos von meinem Bildschirm, in denen ich klickend etwas erkläre.
  • WebM ist ein Videoformat
    • ohne Patentschutz
    • alle großen Browser und weitere Software können es problemlos darstellen
    • man kann es mit freier (und damit auch kostenloser) Software herstellen
    • es benötigt vergleichsweise wenig Speicherplatz

Mein Workflow unter Ubuntu 18.04:

  • In Firefox die Webentwickleroption „Bildschirmgröße testen“ auf 1280×720 einstellen und dort etwas zeigen.
  • Aufnahme dieses Bildschirmbereichs mit vokoscreen
    • speichern mit seinen Standardeinstellungen außer auf 50Hz erhöhte Bildfrequenz
    • Mikrophon auswählen
    • Bildschirmbereich wählen - hier den verkleinerten Bereich in Firefox
  • Bearbeiten mit AVIdemux:
    • Zusammenfügen solcher Videos in Avidemux
    • Heraustrennen unnötiger Passagen, ggf. nach Sprung zu Iframes
    • Speichern im Copymodus - also ohne Neukomprimierung - als beispiel.mkv
  • Aufruf eines Shellskripts mit ./mach_webm.sh beispiel.mkv
    • Aufruf des ffmpeg-Programms mit vielen Parametern, erzeugt beispiel.mkv.webm
    • 2-Pass-Vorgang für bessere Qualität
    • Overlay eines bspw. halbtransparenten PNG-Bilds (im RGB-Modus) als Wasserzeichen oder Logo

Der letzte Konvertiervorgang dauert auf meinem älteren Rechner fünfmal so lange wie das Video dauert.

Quelltext von mach_webm.sh:

mach_webm.sh
#!/bin/bash
# Quellen: https://stackoverflow.com/questions/10918907/how-to-add-transparent-watermark-in-center-of-a-video-with-ffmpeg
#          https://trac.ffmpeg.org/wiki/Encode/VP9
 
original=$1 
logo=/pfad/zum/logo.png
 
ffmpeg -i ${original} -vf "movie=${logo} [watermark]; [in][watermark] overlay=main_w-overlay_w-5:main_h-overlay_h-5 [out]" -c:v libvpx-vp9 -b:v 1M -pass 1 -an -f webm /dev/null -y && \
ffmpeg -i ${original} -vf "movie=${logo} [watermark]; [in][watermark] overlay=main_w-overlay_w-5:main_h-overlay_h-5 [out]" -c:v libvpx-vp9 -b:v 1M -pass 2 -c:a libopus ${original}.webm

Quellen