Photoshopで動画データ(mov・avi・mp4)をgifアニメにする方法

えな
アニメを動画データにすることはできたけど、このままじゃ重くてSNSに投稿しづらい・・・
作賀
Photoshopがあれば割と綺麗でカンタンに変換できるぞ
えな
Photoshopってたしか学校にあったかなぁ・・・
作賀
さすがに学生に有償ソフトは厳しいかもな・・・創作や仕事で使ってる人の参考になればってことで

gifアニメにする流れ

上にある画像のようにPhotoshopで動画データを開きます。
mov、mp4、aviでも可能です。

データが重すぎると難しいかもしれません。
mp4はPhotoshop上では真っ黒に表示されますが一連の操作でgifになります。

ファイルメニューから「WEBおよびデバイス用に保存」を押します。
WEBおよびデバイス用に保存

するとこんな画面が開きます。ここでgifの設定・保存ができます。
WEBおよびデバイス用に保存ウィンドウ

保存データの種類を選択します。今回はもちろんGIFを選びます。
保存データの種類を選択
他にもPNGなどありますがpngアニメができるワケではありません。
元々これはWEB用に最適化される項目でpngなどの圧縮画像作る際に色設定をするものです。

「透明部分」のチェックがあります。
背景など透明部分がある画像の場合gifにしても透明が保たれます。
アルファチャンネルとも言います。
透明部分

限られた色数しかないデータになるので透明を作ると1マス分色が少なくなってしまいます。
データとしても重たくなりやすいので特に透明部分が無ければ外しておきましょう。
animegif_05-5

さらに下のループオプションという部分でアニメーションの再生方法を選びます。
ホームページやSNSに使う場合は「無限」にしてループにしておくと親切です。
ループオプション

以上が完了したら「保存」ボタンを押して保存したら完了です。
保存

その他設定について

左上のタブで画面切り替えができます。
gifになる前の画像と、なった後の色数が少ない画像が表示され
違いが確認しやすくなります。
加工後加工前

「特定」タブのところは減色方法を選べます。

ゲームなどを作るプロの現場では1枚の画像でも軽くしなければならない場合があり
他の減色ツールでカラーパレットを作り「カスタム」を選ぶこともありそうです。
特にこだわりがないものでしたら「特定」で充分です。
減色方法

この項目ではディザ方法を選べます。
少ない色数でどのような配置をして元の画像に近づけるか設定できます。
ブラシのように拡散させるか同じ色味は塗りつぶしたように見せるか選べますが
どの色でもあまり違和感のない誤差拡散法を選びます。
ディザ方法

こちらでは半透明部分について↑のようなディザ方法の設定ができます。
半透明部分をgifにしてもキレイに出したい場合は「透明ディザなし」以外を選びます。
半透明部分

「カラー」では色数を選べます。
数が多いほど元画像に近い表現ができますが
データの軽さを求めたい時はここで色数を少なくするのもひとつの手段です。
カラー設定

「画質」はPhotoshopにもある項目で圧縮方法を設定します。
詳しく覚えようとすると難しい数式の話になるので割愛します。
これもこだわりがなければそのままで問題ありません。
画質設定

◆アニメーター経験のアレコレをマンガで読める◆