PhotoshopでGIFアニメを作る方法[第2回]動画をGIFに変換する方法
2016/02/09
「PhotoshopでGIFアニメを作る方法」(大野謙介 連載)
第1回 タイムラインパネルの使い方、GIF形式の保存方法
第2回 動画をGIFに変換する方法
第3回 トゥイーンの使い方(位置・不透明度・効果)
第4回 パペットワープで写真1枚でGIFアニメを作る方法
第5回 シネマグラフの作り方
クリエイター:大野謙介(@SeKai_SeiFuKu)
GIFアニメ好きのためのGIF作品の投稿・共有サービス「GIFMAGAZINE」デザイナー。Adobe Pinch Inにて「Photoshopで作るGIFアニメバナー」を連載
本記事で制作するGIFアニメ

今回は動画素材を使ってこのようなGIFアニメを作ります。
使用した素材ファイル
※今回の動画素材は、「Movietools.info」の「Green Equalizer」をお借りしています。
解説の流れ
- Photoshopで動画を読み込みます。
- タイムラインパネルでフレームを調整します。
- GIF形式で保存をします。
1.Photoshopで動画を読み込みます。
1-1.[ファイル]メニュー→[読み込み]→[ビデオフレームからレイヤー]を選択します。
1-2.動画が長いので一部に切り出します。[選択した範囲のみ]を選択し、GIFにする範囲を制限します。
また、[頻度制限]を大きくすることにより、フレームを間引くことができる。今回は4フレームとしました。
ここまででほぼ作業は終了です。次にタイムラインパネルで余分なフレームを削除していきます。
2.タイムラインパネルでフレームを調整します。
タイムラインパネルの使い方は以下をご覧下さい。
2-1.タイムラインパネルでフレームを削除する。
このように最終敵に8フレームを残した。イコライザーの一つの山の始点と終点のフレームで区切ることにより、GIFアニメがスムーズにループするようになります。
3.GIF形式で保存をします。
3-1.[ファイル]メニュー→[Web用に保存]を選択します。
3-2.[保存形式]をGIFにして、[保存]を選択する。
動画からGIFアニメを作成することができました。

イコライザーの山を調整することでスムーズなループGIFアニメになりました。
次回はトゥイーン機能で2フレーム間の補完をすることにより、簡単にGIFアニメを作ります。
今回は、Photoshopで動画を読み込んでGIFアニメを作成する方法を解説しました。次回は、トゥイーン機能により、[位置][不透明度][レイヤー効果]の2フレーム間の変化を1ボタンで補完できる機能を解説します。ご期待下さい。
![PhotoshopでGIFアニメを作る方法[第3回]トゥイーンの使い方](http://sinkr.main.jp/creators_magazine/wp-content/uploads/2014/10/photoshop_gif_03_fire.gif)
次回は1枚の写真素材を用いてこのようなGIFアニメを作ります。
次回記事はこちら:第3回PhotoshopでつくるGIFアニメ[トゥイーンの使い方]
クリエイター:大野謙介(@SeKai_SeiFuKu)
GIFアニメ好きのためのGIF作品の投稿・共有サービス「GIFMAGAZINE」デザイナー。Adobe Pinch Inにて「Photoshopで作るGIFアニメバナー」を連載
Follow @SeKai_SeiFuKu

(いいね!で最新記事を毎日受け取れるみたいですよ)
あなたの好奇心を刺激する
コラム、ビジュアルビュース、GIFマンガ、海外映像作品紹介記事を毎日配信