GIF-Screencast-OSX.md

OS X 屏幕录制视频转 GIF 动画

本篇文章告诉你如何在 Mac OS X 上用免费的工具来将屏幕录制视频转成 GIF 动画, 这些免费的工具是: QuickTime, ffmpeg, and gifsicle.

步骤

首先, 使用系统自带的 "QuickTime Player" 程序来录制屏幕:

• 打开 "Quicktime Player",
• 从菜单选择 File -> New Screen Recording
• 点击红点准备录制, 然后用鼠标拖拽出一个你想录制的区域.
• 从菜单选择 File -> Export -> As Movie, 将视频保存成文件.
  • 将你的视频保存为文件 in.mov

To convert in.mov into out.gif (filesize: 48KB), open Terminal to the folder with in.mov and run the following command:

ffmpeg -i in.mov -s 600x400 -pix_fmt rgb24 -r 10 -f gif - | gifsicle --optimize=3 --delay=3 > out.gif

Notes on the arguments:

• -r 10 告诉 ffmpeg 将视频的帧率转成 10fps, 这样可以减小视频体积
• -s 600x400 这是你的视频的尺寸, 600x400
• --delay=10 告诉 gifsicle GIF 每帧之间的时间间隔是 100ms(也就是帧率为 100fps, 1000ms/10fps = 100ms = 10x10ms), gifsicle 使用的单位是 10ms, 不是 ms
• --optimize=3 让 gifsicle 优化一下, 设置为 3 即可

To share the new GIF using Dropbox and Copy Public URL, run the following:

cp out.gif ~/Dropbox/Public/screenshots/Screencast-`date +"%Y.%m.%d-%H.%M"`.gif

Installation

The conversion process requires the following command-line tools:

• ffmpeg to process the video file
• gifsicle to create and optimize the an animated gif

If you use homebrew and homebrew-cask software packages, just type this in:

brew install ffmpeg 
brew cask install x-quartz #dependency for gifsicle, only required for mountain-lion and above
open /usr/local/Cellar/x-quartz/2.7.4/XQuartz.pkg # runs the XQuartz installer
brew install gifsicle

Resources

• http://schneems.com/post/41104255619/use-gifs-in-your-pull-request-for-good-not-evil (primary source!)
• http://www.reddit.com/r/programming/comments/16zu7d/use_gifs_in_your_pull_requests_for_good_not_evil/
• http://superuser.com/questions/436056/how-can-i-get-ffmpeg-to-convert-a-mov-to-a-gif#_=_
• http://gnuski.blogspot.ca/2012/06/creating-animate-gif-with-free-software.html

Related Ideas

• Extend https://github.com/dergachev/copy-public-url folder action for this use case
  • it would automate the conversion before copying Dropbox public URL
  • assign the folder action to ~/Dropbox/Public/Screenshots/gif
  • consider finding a way to simplify the dependency installation

Performance-vs-quality.md

GIF-Screencast-OSX performance testing

I was disappointed with the color and quality that ffmpeg's GIF conversion gives. Imagemagick's convert can also be used to do the conversion, though this has serious performance penalties.

The following details my experiments of converting a 3.8 second movie to a GIF.

FFMPEG to PNG -> CONVERT to GIF individually

• 42 seconds in CONVERT, did not determine file size

ffmpeg -i in-trimmed.mov -r 10 -vcodec png out-static-%02d.png 
time for img in out-static*.png; do convert -verbose +dither -layers Optimize "$img" "$img.gif" ;  done

FFMPEG to PNG -> CONVERT TO GIF in bulk

• 70KB filesize; 7.2 seconds in CONVERT
• http://dl-web.dropbox.com/u/29440342/screenshots/CTHVGY-Screencast-2013.02.06-18.03.gif

ffmpeg -i in-trimmed.mov -r 10 -vcodec png out-static-%02d.png 
time convert -verbose +dither -layers Optimize -resize 600x600\> out-static*.png  GIF:- > out13.gif

FFMPEG to PNG -> CONVERT to GIF in bulk -> gifsicle

• 56KB size; 7.2 seconds in CONVERT
• http://dl-web.dropbox.com/u/29440342/screenshots/USNVKN-Screencast-2013.02.06-18.13.gif

ffmpeg -i in-trimmed.mov -r 10 -vcodec png out-static-%02d.png 
time convert -verbose +dither -layers Optimize -resize 600x600\> out-static*.png  GIF:- | gifsicle --colors 128 --delay=5 --loop --optimize=3 --multifile - > out12.gif

FFMPEG to PPM -> CONVERT to GIF in bulk

• 6.7 seconds in CONVERT, 70KB filesize
• http://dl-web.dropbox.com/u/29440342/screenshots/ZMMDMX-Screencast-2013.02.06-17.59.gif

ffmpeg -i in-trimmed.mov -r 10 -vcodec ppm out-static-%02d.ppm
time convert -verbose +dither -layers Optimize -resize 600x600\> out-static*.ppm  GIF:- > out14.gif

FFMPEG to PPM -> CONVERT to GIF in bulk -> gifsicle

• 7.2 seconds in CONVERT, 56KB filesize
• http://dl-web.dropbox.com/u/29440342/screenshots/UGTQNY-Screencast-2013.02.06-17.49.gif

time ffmpeg -i  in-trimmed.mov -r 10 -f image2pipe -vcodec ppm - |  time convert -verbose +dither -layers Optimize -resize 600x600\> - gif:- | gifsicle --colors 128 --delay=5 --loop --optimize=3 --multifile ->  out15.gif

FFMPEG to GIF -> gifsicle

• 1 second total (not using CONVERT), 22KB filesize
• http://dl-web.dropbox.com/u/29440342/screenshots/XVXWCJ-Screencast-2013.02.06-17.48.gif

ffmpeg -i in-trimmed.mov -vf "scale=min(iw\,600):-1" -pix_fmt rgb24 -r 10 -f gif - | gifsicle --optimize=3 --delay=7 --colors 128 > out16.gif

Notes

• Omitting resizing down to 600x600 before converting to GIF dramatically slows down CONVERT.
• PPM is the only image format that is compatible with FFMPEG piping directly to CONVERT
  • it has the same performance and compression characteristics as outputting to PNG
  • it avoids creating and cleaning up temporary image files
  • otherwise the temporary files would need to be sorted by numeric order before globbing

Resources

• http://www.imagemagick.org/discourse-server/viewtopic.php?f=2&t=18320#reading-multiple-images-over-standard-input
• http://superuser.com/questions/71028/batch-converting-png-to-jpg-in-linux
• http://zeekish.wordpress.com/2011/09/14/pdf-to-gif-conversion-and-optimization/
• http://stackoverflow.com/questions/3306888/ffmpeg-generate-n-evenly-spaced-png-screenshots
• http://mariovalle.name/postprocessing/ImageTools.html#gifsicle
• http://ffmpeg-users.933282.n4.nabble.com/Converting-avi-files-to-animated-gifs-td935274.html
• https://lists.libav.org/pipermail/ffmpeg-user/2010-August/026860.html
• http://stackoverflow.com/questions/8133242/ffmpeg-resize-down-larger-video-to-fit-desired-size-and-add-padding
• http://superuser.com/questions/318845/improve-quality-of-ffmpeg-created-jpgs

打扰，问一下我倒出来的背景不透明，是什么原因