terminal · gifs

Terminal Gifs

If you’re wanting to share examples of working in a terminal, such as what I will be pasting below, then you will be needing a way to record, and share what happens.

There is a website (asciicinema) that will do most of the work for you, but, you lose some of the control, and, dammit, engineers should be able to do things on their own, right?

The great news is, you can, and it’s not actually very difficult (nothing is once you know how to do it!)

Linux users will need to install the following

I was fortunate enough to be able to install them all using apt

apt install ttyrec ttygif imagemagick gifsicle xdotool

Usage is quite simple, first call ttyrec with the name of the file that will be created/used to store the commands in. Then whatever is intended to be recorded is actioned in that terminal, followed by <ctrl d> to end the ttyrec session. I’ve thus far been able to record vim sessions, and tmux sessions. Tmux sessions come with some caveats, the pane that had the ttyrec called in it is the only one that will record any commands issued, whilst the whole terminal is included in the image.

ttyrec myRecord
do stuff
...
ctrl-d

Upon completion the recording is converted to a gif, using ttygif

ttygif myRecord

When I initially tried to do this I got the following error

Error: WINDOWID environment variable was empty.

This is fixed by setting an enviroment variable

export WINDOWID=$(xdotool getwindowfocus)

But I have created the following alias in my ~/.bashrc to save remembering that

alias ttygif='WINDOWID=$(xdotool getwindowfocus) ttygif'

Note, I also got errors when I tried to build gifs from processes that produced a lot of output, which turned out to be imagemagick related (see issue), so I updated my /etc/ImageMagick-6/policy.xml to have the following set

<policymap>
    <policy domain="resource" name="memory" value="4GiB"/>
    <policy domain="resource" name="map" value="8GiB"/>
    <policy domain="resource" name="width" value="256KP"/>
    <policy domain="resource" name="height" value="256KP"/>
    <policy domain="resource" name="area" value="2.1474GP"/>
    <policy domain="resource" name="disk" value="16GiB"/>
    <policy domain="resource" name="file" value="768"/>
    <policy domain="resource" name="thread" value="4"/>
    <policy domain="resource" name="throttle" value="0"/>
    <policy domain="delegate" rights="none" pattern="URL" />
    <policy domain="delegate" rights="none" pattern="HTTPS" />
    <policy domain="delegate" rights="none" pattern="HTTP" />
    <policy domain="path" rights="none" pattern="@*"/>
    <policy domain="coder" rights="none" pattern="PS" />
    <policy domain="coder" rights="none" pattern="PS2" />
    <policy domain="coder" rights="none" pattern="PS3" />
    <policy domain="coder" rights="none" pattern="EPS" />
    <policy domain="coder" rights="none" pattern="PDF" />
    <policy domain="coder" rights="none" pattern="XPS" />
</policymap>

ttygif will leave directories in /tmp that you may need to clean up

Once the gif has been created you can use gifsicle to create a smaller version, with

gifsicle -O3 -k 8 --lossy=80 -o tty-small.gif tty.gif

Finished product Full sized (709K) vs Compressed (271K)

Personally I prefer the full sized version, but that’s a matter of taste, and experimenting with compression to find a sweet spot.

References: https://medium.com/@pczarkowski/how-to-make-an-animated-gif-of-your-terminal-commands-62b08dfb6089

Published:
comments powered by Disqus