I say "animated gif" but in reality I think it's irresponsible to be serving "real" GIF files to people now. You should be serving gfy's, gifv's, webm, mp4s, whatever. They're a fraction of the filesize making it easier for you to deliver high fidelity, full color animation very quickly, especially on bad mobile connections. (But I suppose if you're just doing this for small audiences (like bug reporting), then LICEcap is a good solution).
- Launch quicktime player
- do Screen recording
- hit the button
- you can chose to record entire screen or a portion by dragging:
- do that then record and hit the stop button in the top taskbar.
- You can then Trim the video in quicktime with
cmd-t
.
- File > "Save…". Save that shit.
- Use Screenflow. It can do 60fps and do all sorts of annotations beyond the basic clicks that Quicktime will capture.
- Go to gfycat and drag your mov file onto it.
- get the embed code and use the iframe
Really, use the iframe. It'll give you better perf and will load way faster for your users.
If you really want a GIF file (terrible), then click the "GIF" icon. It's sweet to let them do the work for us.
However if you want to make the gif on your own.. continue.
Use an app called GIFBrewery but it costs money and is a little weird to configure. But it works. Run it through imageoptim after.
(This path is for people comfortable with homebrew and dotfiles.)
- Grab
gifify
from @SlexAxton's gist: https://gist.github.com/SlexAxton/4989674 and toss it into your dotfiles somewhre - Make sure you have the dependencies:
brew install ffmpeg gifsicle imagemagick
- Run it with
gifify yourvideo.mov --good
- Run the image through imageoptim after.
Type the following in ubuntu terminal
sudo add-apt-repository -y ppa:fossfreedom/byzanz
sudo apt-get update
sudo apt-get install -y byzanz
byzanz-record --duration=15 --x=400 --y=400 --width=800 --height=600 filename.gif
byzanz-record --duration=30 filename.gif
byzanz-record --help