Wie erstellt man animierte GIF-Bilder eines Screencasts?

414

Ich habe animierte GIF-Bilder von Bildschirmdarstellungen (wie die unten stehende) einige Male auf dieser Seite als Möglichkeit gesehen, die Antworten zu verbessern.

Mit welcher Toolchain werden diese erstellt? Gibt es ein Programm, das dies automatisch macht, oder nehmen die Leute Screencasts, konvertieren sie in eine Reihe von statischen Frames und erstellen dann die GIF-Images?

    
andrewsomething 25.02.2012, 20:19
quelle

15 Antworten

165

Peek ist eine neue Anwendung, mit der Sie einfach GIFs von Ihrem Bildschirm aufnehmen können.

Beachten Sie, dass GIFs eine sehr begrenzte Farbpalette haben, daher ist es keine sehr gute Idee, sie zu verwenden.

Sie können die neuesten Versionen von Peek unter Ubuntu über die PPA .

sudo add-apt-repository ppa:peek-developers/stable
sudo apt update
sudo apt install peek

Weitere Informationen finden Sie im GitHub-Repo: Pfandrecht

    
Jop V. 06.10.2016, 23:36
quelle
257

Die beste Software, die ich jemals für die Aufnahme von GIF-Screencasts gefunden habe, ist Byzanz.

Byzanz ist großartig, weil es direkt in GIF aufnimmt, die Qualität und FPS ist beeindruckend, während die Größe der Dateien minimal gehalten wird.

Installation

Byzanz ist jetzt im Universe-Repository verfügbar:

sudo apt-get install byzanz

Verwendung

Wenn es installiert ist, können Sie es in einem Terminal ausführen.

Dies ist ein kleines Beispiel, das ich gerade mit

gemacht habe
byzanz-record --duration=15 --x=200 --y=300 --width=700 --height=400 out.gif

    
Bruno Pereira 19.04.2012 21:47
quelle
232

Installieren Sie zuerst:

sudo apt-get install imagemagick mplayer gtk-recordmydesktop

das sind die erforderlichen Sachen, ImageMagick, MPlayer und Desktop Recorder. Verwenden Sie dann Desktop Recorder , um einen Teil des Bildschirms / der Anwendung zu erfassen, der als Screencast verwendet werden soll. Nachdem der Desktop Recorder die Aufzeichnung in ein OGV-Video gespeichert hat, wird MPlayer verwendet, um JPEG-Screenshots zu erfassen und im Verzeichnis 'output' zu speichern.

An einem Terminal:

mplayer -ao null <video file name> -vo jpeg:outdir=output

Verwenden Sie ImageMagick , um die Screenshots in animierte Gifs umzuwandeln.

convert output/* output.gif

Sie können die Screenshots auf diese Weise optimieren:

convert output.gif -fuzz 10% -layers Optimize optimised.gif
    
maniat1k 25.02.2012 20:40
quelle
136

Überblick

Diese Antwort enthält drei Shell-Skripte:

  1. byzanz-record-window - Um ein Fenster für die Aufnahme auszuwählen.
  2. byzanz-record-region - Um einen Teil des Bildschirms für die Aufnahme auszuwählen.
  3. Ein einfaches GUI-Frontend für 1, von MHC .

Einführung

Danke Bruno Pereira für stellt mich vor byzanz ! Es ist sehr nützlich für die Erstellung von GIF-Animationen. Die Farben sind in einigen Fällen möglicherweise deaktiviert, aber die Dateigröße gleicht dies aus. Beispiel: 40 Sekunden, 3,7 MB .

Verwendung

Speichere eines / alle der folgenden zwei Skripte in einem Ordner in deinem $PATH . Hier ist ein Beispiel für die Verwendung des ersten Skripts, um einen Screencast eines bestimmten Fensters zu erstellen.

  1. Ausführen byzanz-record-window 30 -c output.gif
  2. Gehen Sie zu dem Fenster (Alt-Tab), das Sie aufnehmen möchten. Klicke darauf.
  3. Warten Sie 10 Sekunden (fest codiert in $DELAY ), in dem Sie die Aufnahme vorbereiten.
  4. Nach dem Piepton (in% beep definiert) beginnt byzanz .
  5. Nach 30 Sekunden (das ist die Bedeutung von 30 in Schritt 1) ​​endet byzanz . Ein Signalton wird erneut gesendet.

Ich habe das Flag -c in byzanz-record-window eingefügt, um zu verdeutlichen, dass alle Argumente für mein Shell-Skript an byzanz-record selbst angehängt werden. Das Flag -c weist byzanz zu, dass auch der Cursor in den Screencast einbezogen wird.
Weitere Informationen finden Sie unter man byzanz-record oder byzanz-record --help .

byzanz-record-window

#!/bin/bash

# Delay before starting
DELAY=10

# Sound notification to let one know when recording is about to start (and ends)
beep() {
    paplay /usr/share/sounds/KDE-Im-Irc-Event.ogg &
}

# Duration and output file
if [ $# -gt 0 ]; then
    D="--duration=$@"
else
    echo Default recording duration 10s to /tmp/recorded.gif
    D="--duration=10 /tmp/recorded.gif"
fi
XWININFO=$(xwininfo)
read X <<< $(awk -F: '/Absolute upper-left X/{print }' <<< "$XWININFO")
read Y <<< $(awk -F: '/Absolute upper-left Y/{print }' <<< "$XWININFO")
read W <<< $(awk -F: '/Width/{print }' <<< "$XWININFO")
read H <<< $(awk -F: '/Height/{print }' <<< "$XWININFO")

echo Delaying $DELAY seconds. After that, byzanz will start
for (( i=$DELAY; i>0; --i )) ; do
    echo $i
    sleep 1
done

beep
byzanz-record --verbose --delay=0 --x=$X --y=$Y --width=$W --height=$H $D
beep

byzanz-record-region

Abhängigkeit: xrectsel von xrectsel . Klonen Sie das Repository und führen Sie make aus, um die ausführbare Datei zu erhalten. (Wenn es keine Makefile gibt, führen Sie ./bootstrap und ./configure aus, bevor Sie 'make' ausführen).

#!/bin/bash

# Delay before starting
DELAY=10

# Sound notification to let one know when recording is about to start (and ends)
beep() {
    paplay /usr/share/sounds/KDE-Im-Irc-Event.ogg &
}

# Duration and output file
if [ $# -gt 0 ]; then
    D="--duration=$@"
else
    echo Default recording duration 10s to /tmp/recorded.gif
    D="--duration=10 /tmp/recorded.gif"
fi

# xrectsel from https://github.com/lolilolicon/xrectsel
ARGUMENTS=$(xrectsel "--x=%x --y=%y --width=%w --height=%h") || exit -1

echo Delaying $DELAY seconds. After that, byzanz will start
for (( i=$DELAY; i>0; --i )) ; do
    echo $i
    sleep 1
done
beep
byzanz-record --verbose --delay=0 ${ARGUMENTS} $D
beep

Gui-Version von byzanz-record-window

(Kommentar von MHC ): Ich habe mir die Freiheit genommen, das Skript mit einem einfachen GUI-Dialog zu ändern

#!/bin/bash

# AUTHOR:   (c) Rob W 2012, modified by MHC (https://askubuntu.com/users/81372/mhc)
# NAME:     GIFRecord 0.1
# DESCRIPTION:  A script to record GIF screencasts.
# LICENSE:  GNU GPL v3 (http://www.gnu.org/licenses/gpl.html)
# DEPENDENCIES:   byzanz,gdialog,notify-send (install via sudo add-apt-repository ppa:fossfreedom/byzanz; sudo apt-get update && sudo apt-get install byzanz gdialog notify-osd)

# Time and date
TIME=$(date +"%Y-%m-%d_%H%M%S")

# Delay before starting
DELAY=10

# Standard screencast folder
FOLDER="$HOME/Pictures"

# Default recording duration
DEFDUR=10

# Sound notification to let one know when recording is about to start (and ends)
beep() {
    paplay /usr/share/sounds/freedesktop/stereo/message-new-instant.oga &
}

# Custom recording duration as set by user
USERDUR=$(gdialog --title "Duration?" --inputbox "Please enter the screencast duration in seconds" 200 100 2>&1)

# Duration and output file
if [ $USERDUR -gt 0 ]; then
    D=$USERDUR
else
    D=$DEFDUR
fi

# Window geometry
XWININFO=$(xwininfo)
read X < <(awk -F: '/Absolute upper-left X/{print }' <<< "$XWININFO")
read Y < <(awk -F: '/Absolute upper-left Y/{print }' <<< "$XWININFO")
read W < <(awk -F: '/Width/{print }' <<< "$XWININFO")
read H < <(awk -F: '/Height/{print }' <<< "$XWININFO")

# Notify the user of recording time and delay
notify-send "GIFRecorder" "Recording duration set to $D seconds. Recording will start in $DELAY seconds."

#Actual recording
sleep $DELAY
beep
byzanz-record -c --verbose --delay=0 --duration=$D --x=$X --y=$Y --width=$W --height=$H "$FOLDER/GIFrecord_$TIME.gif"
beep

# Notify the user of end of recording.
notify-send "GIFRecorder" "Screencast saved to $FOLDER/GIFrecord_$TIME.gif"
    
Rob W 14.10.2012 17:44
quelle
48

ffmpeg

Eines der besten Tools, die ich verwende, ist ffmpeg . Es kann die meisten Videos aus einem Screencast-Tool wie kazam aufnehmen und in ein anderes Format konvertieren.

Installieren Sie dieses von software-center - es wird automatisch installiert, wenn Sie das ausgezeichnete ubuntu-restricted-extras -Paket installieren.

Kazam kann in den Videoformaten mp4 oder webm ausgeben. Im Allgemeinen erhalten Sie bessere Ergebnisse in mp4 format.

Beispiel GIF-Syntax

Die grundlegende Syntax zum Konvertieren von Videos in gif ist:

ffmpeg -i [inputvideo_filename] -pix_fmt rgb24 [output.gif]

Konvertierte GIFs - insbesondere solche mit einer Standard-Frame-Rate von 25/29 können sehr groß sein. Zum Beispiel - ein 800Kb Webm 15 Sekunden Video bei 25fps kann auf 435Mb ausgeben!

Sie können dies auf verschiedene Arten reduzieren:

Bildrate

Verwenden Sie die Option -r [frame-per-second]

zum Beispiel ffmpeg -i Untitled_Screencast.webm -r 1 -pix_fmt rgb24 out.gif

Größe reduziert von 435Mb auf 19Mb

Dateigrößenbeschränkung

Verwenden Sie die Option -fs [filesize]

zum Beispiel ffmpeg -i Untitled_Screencast.webm -fs 5000k -pix_fmt rgb24 out.gif

Hinweis: Dies ist eine ungefähre Ausgabedateigröße, daher kann die Größe etwas größer als angegeben sein.

Größe des ausgegebenen Videos

Verwenden Sie die Option -s [widthxheight]

zum Beispiel ffmpeg -i Untitled_Screencast.webm -s 320x200 -pix_fmt rgb24 out.gif

Dadurch wurde die Video-Größe des Beispiels 1366x768 auf 26 MB reduziert

Schleife für immer

Manchmal möchten Sie vielleicht, dass die GIF-Schleife für immer wiederholt wird.

Verwenden Sie die Option -loop_output 0

ffmpeg -i Untitled_Screencast.webm -loop_output 0 -pix_fmt rgb24 out.gif

weiter optimieren und verkleinern

Wenn Sie imagemagick convert mit einem Fuzz-Faktor zwischen 3% und 10% verwenden, können Sie die Bildgröße drastisch reduzieren

convert output.gif -fuzz 3% -layers Optimize finalgif.gif

schließlich

kombinieren Sie einige dieser Optionen, um etwas für Ask Ubuntu verwaltbar zu reduzieren.

ffmpeg -i Untitled_Screencast.webm -loop_output 0 -r 5 -s 320x200 -pix_fmt rgb24 out.gif

gefolgt von

convert output.gif -fuzz 8% -layers Optimize finalgif.gif
  

Beispiel

     

    
fossfreedom 05.03.2012 22:46
quelle
33

Silentcast

Silentcast ist ein weiteres großartiges GUI-basiertes Tool zum Erstellen animierter GIF-Bilder. Seine Eigenschaften umfassen:

  • 4 Aufnahmemodi:

    1. Gesamter Bildschirm

    2. Innenfenster

    3. Fenster mit Dekoration

    4. Benutzerdefinierte Auswahl

  • 3 Ausgabeformate:

    1. .gif

    2. .mp4

    3. .webm

    4. .png (Rahmen)

    5. .mkv

  • Keine Installation notwendig (portabel)

  • Benutzerdefiniertes Arbeitsverzeichnis

  • Benutzerdefinierte fps

Installation

Wenn Sie eine reguläre Installation wünschen und eine unterstützte Version von Ubuntu ausführen, können Sie Silentcast by PPA installieren:

sudo add-apt-repository ppa:sethj/silentcast  
sudo apt-get update  
sudo apt-get install silentcast  

Wenn Sie keine unterstützte Version von Ubuntu verwenden (Sie sollten wirklich upgraden!), müssen Sie die neueste Version von herunterladen die GitHub-Seite und erfülle die Abhängigkeiten manuell (Sie können yad und ffmpeg von hier und hier bzw.), wenn Sie eine etwas neuere Version wie z 13.10 Sie können das .deb direkt herunterladen .

Wenn Sie Gnome verwenden, können Sie die Erweiterung von Topicons installieren, um Silentcast einfacher zu beenden.

Verwendung

Starten Sie Silentcast über die GUI Ihrer Desktop-Umgebung oder führen Sie den Befehl silentcast in einem Terminal aus. Wählen Sie Ihre Einstellungen und folgen Sie den Anweisungen auf dem Bildschirm. Wenn Sie mit der Aufnahme fertig sind, wird ein Dialogfeld angezeigt, in dem Sie die endgültige Ausgabe optimieren können, indem Sie eine bestimmte Anzahl von Bildern entfernen.

Weitere detaillierte Anwendungsrichtlinien finden Sie in der README, entweder in der Online-GitHub-Version oder die lokale Version, die in /usr/share/doc/silentcast mit zless oder Ihrem Lieblings-Editor gespeichert ist.

Anmerkungen:

Silentcast befindet sich noch in der Entwicklungsphase und obwohl es ziemlich stabil ist, könnten Sie auf einige Fehler stoßen. Wenn Sie dies tun, melden Sie sie bitte auf dem GitHub-Issues-Tracker des Projekts . Wenn Sie Probleme bei der Installation von der PPA haben und eine unterstützte Version von Ubuntu ausführen, hinterlassen Sie unten einen Kommentar oder kontaktieren Sie den Maintainer (mich) Launchpad.

    
Seth 29.10.2014 02:27
quelle
7

Es gibt alle Arten von komplizierten und gut funktionierenden (vermutlich) Möglichkeiten, dies hier aufgelistet zu machen. Ich wollte diesen Prozess jedoch nie zuvor und auch nicht danach durchführen. Also benutze ich einfach einen Online-Konverter, der für meine Bedürfnisse die wenigen Male benötigt, die ich brauche. Ich habe diese Seite benutzt:

Pfandrecht

Es ist nicht meine Seite und ich bin in keiner Weise mit ihnen verbunden. Sie sind nur die eine in meinen Lesezeichen und es gibt viele mehr.

    
KGIII 17.10.2015 19:45
quelle
7

Ich habe record-gif.sh erstellt, eine verbesserte Version von Rob W's byzanz-record-region :

  

Eine lahme GUI für byzanz , verbesserte die Benutzerfreundlichkeit ( durch Maus auswählbarer Bereich ) Fortschrittsbalken aufnehmen, wiedergabefähige Aufnahme ).

  • set Aufnahme duration ;
  • set save_as destination;
  • Wählen Sie mit der Maus - den aufzuzeichnenden Bereich aus;
  • Erstellen Sie ein Skript, um die Aufzeichnung wiederzugeben (siehe $HOME/record.again ).

Installieren

Ich habe auch ein Installationsskript erstellt

curl --location https://git.io/record-gif.sh | bash -
    
Édouard Lopez 06.10.2016 22:27
quelle
3
  1. Installieren Sie diese 3 Pakete: imagemagick mplayer gtk-recordmydesktop
  2. Führen Sie Desktop Recorder aus, um einen Teil des Bildschirms / der Anwendung zu erfassen, der als Screencast verwendet werden soll
  3. Laden Sie ogv2gif.sh von Pfandrecht herunter
  4. Ausführen: ./ogv2gif.sh yourscreencast.ogv
  5. Die GIF-Datei wird in das gleiche Verzeichnis
  6. gestellt

100% inspiriert von maniat1ks Antwort .

    
Nicolas Raoul 30.06.2016 09:25
quelle
2

Wenn Sie noch schicker werden möchten, können Sie eine kompliziertere Methode als animierte GIFs verwenden, die HTMl5-Canvas-Screencasting verwenden. Das x11-canvas-screencast -Projekt erstellt eine html5-Canvas-animierte Bildschirmaufnahme.

Sie haben möglicherweise einige berühmte Beispiele dieser Technologie auf der Sublime Text Website gesehen.

x11-canvas-screencast bringt diese Methode einen Schritt weiter, indem das Tracking des Mauscursors integriert wird. Hier ist eine Demo von x11- canvas-screencast produziert

Das Ergebnis ist besser als ein animiertes GIF, da es nicht auf die Anzahl der Farben beschränkt ist und weniger Bandbreite benötigt.

    
gene_wood 22.09.2015 19:37
quelle
2

Ok, um also auch Mausklicks zu erfassen, habe ich nur key-mon gefunden (über die README von screenkey <) / a>):

Dann ich:

  • Start key-mon
  • Verwenden Sie xrectsel , um die Bildschirmkoordinaten in einen byzanz -Befehl
  • zu bringen
  • Führen Sie den Befehl byzanz
  • aus

... und es sieht so aus:

Beachten Sie, dass key-mon --visible_click beim Mausklick einen Kreis um den Mauszeiger ziehen würde - was ich bevorzugen würde, aber in Ubuntu 14.04.5 LTS ist dies etwas kaputt, da dieser Kreis nicht schnell genug erscheint und verschwindet die Klicks korrekt darstellen (dh Maus drücken und loslassen).

    
sdaau 24.08.2016 06:34
quelle
1

Ich habe kürzlich eine kombinierte Version von Skripten erstellt, die bereits hier veröffentlicht wurden.
Grundsätzlich erlaubt es Ihnen, Bildschirmbereich aufzuzeichnen, aber mit einfacher GUI.

Danke für Rob W für die Bereitstellung dieser coolen Skripts

Hier ist der Code (oder gist , wenn Sie möchten):

#!/bin/bash

#Records selected screen region, with GUI

#This is combined version of GIF recording scripts, that can be found here: https://uberubuntu.info/questions/67/wie-erstellt-man-animierte-gif-bilder-eines-screencasts"%Y-%m-%d_%H%M%S") #Timestamp
FOLDER="$HOME/Pictures/Byzanz" #Default output directory

#Sound notification to let one know when recording is about to start (and ends)
beep() {
    paplay /usr/share/sounds/freedesktop/stereo/message-new-instant.oga &
}

#Custom recording duration as set by user
USERDUR=$(gdialog --title "Duration?" --inputbox "Please enter the screencast duration in seconds" 200 100 2>&1)

#Duration and output file
if [ $USERDUR -gt 0 ]; then
    D=$USERDUR
else
    D=$DEFDUR
fi

#Get coordinates using xrectsel from https://github.com/lolilolicon/xrectsel
REGION=$(xrectsel "--x=%x --y=%y --width=%w --height=%h") || exit -1

notify-send "GIFRecorder" "Recording duration set to $D seconds. Recording will start in $DELAY seconds."

for (( i=$DELAY; i>0; --i )) ; do
    sleep 1
done

#Record
beep
byzanz-record --cursor --verbose --delay=0 ${REGION} --duration=$D "$FOLDER/byzanz-record-region-$TIME.gif"
beep

notify-send "GIFRecorder" "Screencast saved to $FOLDER/byzanz-record-region-$TIME.gif"
    
Jacajack 26.05.2016 22:17
quelle
1

Wenn Sie auch sichtbare Aufzeichnungen von Mausklicks oder Schlüsselstrichen wünschen, ist der Bildschirmschlüssel die beste Wahl: Pfandrecht

    
nachtigall 12.06.2016 08:25
quelle
0

Verwenden Sie gtk-recordmydesktop und ffmpeg :

apt-get install gtk-recordmydesktop ffmpeg

Führen Sie RecordMyDesktop aus, um einen Teil des Bildschirms / der Anwendung zu erfassen, der als Screencast verwendet werden soll:

gtk-recordmydesktop

Erstellen Sie ogv2gif.sh mit folgendem Inhalt:

INPUT_FILE=
FPS=15
WIDTH=320
TEMP_FILE_PATH="~/tmp.png"
ffmpeg -i $INPUT_FILE -vf fps=$FPS,scale=$WIDTH:-1:flags=lanczos,palettegen $TEMP_FILE_PATH
ffmpeg -i $INPUT_FILE -i $TEMP_FILE_PATH -loop 0 -filter_complex "fps=$FPS,scale=$WIDTH:-1:flags=lanczos[x];[x][1:v]paletteuse" $INPUT_FILE.gif
rm $TEMP_FILE_PATH

Benutze es:

./ogv2gif.sh yourscreencast.ogv

Referenzen:

Fedir RYKHTIK 14.02.2017 10:15
quelle
0

Ich teste alle oben genannten Methoden und finde die einfachste:

  1. Verwenden Sie gtk-recordmysdesktop und key-mon , um ein ogv
  2. zu erhalten
  3. ffmpeg -i xx.ogv xx.gif & lt; - ohne Parameter .

Der fps ist original und die gif-Größe ist kleiner als die ogv-Datei.

    
utopic eexpress 10.03.2017 11:11
quelle

Tags und Links