-
Notifications
You must be signed in to change notification settings - Fork 7
Generating GIFS for blog posts
To generate high-quality GIFs, e.g., for showing new features in blog posts, you can follow these steps (note, this outlines the procedure followed by JG, improvements very welcome):
OBS can be used to record your screen, e.g., with Window Capture (XComposite)
at 60fps output and 2560×1440 pixel output resolution.
First, one needs to generate a color palette. This is because GIF can only support 256 colors per frame, rather than the millions of colors supported by the common video formats. It can be achieved by ffmpeg
using the following command:
ffmpeg -i <your-video>.mkv -vf palettegen <your-palette>.png
Then, to convert the initial video recording to GIF, the following ffmpeg
command can be used, e.g., using 10fps and 1080p resolution:
ffmpeg -i <your-video>.mkv -i <your-palette>.png -lavfi "fps=10,scale=1080:-1,paletteuse" <your-video-10fps-1080p>.gif
Note that for multiple recordings of the same setup, e.g., running different commands in the same terminal, the same color palette can be used. It only needs to be updated if the color scale of the recording changes. There is a Python script video_to_gif.py
that takes care of running both shell commands, exposing the options mentioned above via the CLI. It can be found in our AiiDA Google Drive.
Then, copy the resulting GIF to aiida-website/docs/news/posts/_gifs
, allowing you to include it in your blog post via
![Caption text](./_gifs/<your-video-10fps-1080p>.gif)
Lastly, please create a directory on our shared AiiDA Google Drive under Misc/blog-gifs
with the same name as the markdown file of your blog post (YYYY-MM-DD-title
) that contains the original videos (e.g., as MKV or MP4), the color palette, and the GIFs that you included in your blog post.