Как сделать обьясняющую GIF-анимацию?

Question

[MaxRdl]

Всем привет!

Есть, допустим, такой пример анимации, которая лучше обьясняет мобильное приложение ( https://twitter.com/Outlook/status/722804017525600256 ).

Вопрос следующий, как проще сделать подобную штуку на Маке? Я делаю запись экрана iPhone через QuickTime Player, но не могу разобраться как редактировать. Допустим, добавить анимацию, чтобы было видно где я тапаю по экрану, добавить фон например.

Кто-то знает простые и желательно бесплатные редакторы с таким функционалом, Возможно кто-то делал похожее в прошлом?

Answer 1

[Developer]

Могу объяснить как такое сделать на андроиде.

Сначала надо записать видео всех действий с телефона.
Для этого подключаем телефон через USB-кабель к компу (должен быть включен режим отладки через USB). Можно так же включить в настройках телефона отображение нажатий на экран.
Затем из папки, где установлен андроид SDK (у меня это d:\Android\sdk\platform-tools\) выполняем команду
adb shell screenrecord --bit-rate 8000000 --time-limit 30 /sdcard/video.mp4
Теперь будет писаться 30-секундный ролик всех наших действий на телефоне с битрейтом 8Mbps.
Забираем полученный mp4, редактируем в видеоредакторе и делаем из видео gif-ку. Инструменты можно поискать в сети. Есть так же онлайн-конвертеры

Comments

[MaxRdl]

было бы очень здорово!

[Developer]

MaxRdl: обновил ответ

Answer 2

[Сергей Соколов]

На днях друзья как раз поделились уроком (на англ.), как они сделали интерактивное демо. Статичные скриншоты и jQuery.

github.com/tagspace/trevor-demo

Answer 3

[Pavel K]

Делал и делаю на Flash, можно экспортировать в gif