2016年12月15日

画像を分割してGIFアニメを作り、それを合成してひとつのアニメにする方法


 あまりニーズがなさそうなのですが、一枚の写真を分割して別々にGIFアニメーションを作り、後でそれらをひとつのGIFアニメーションに合成する。こんなことをするには、どうすれば良いか?

 先日ご紹介した『きらきらGIFアニメ』を作るwebサービス『Glitterboo』では、GIFアニメの仕上がりサイズが360 x 270px までしか作ることができません。これより大きなサイズを作るには有料になります。

 そこで、元画像を4つに分割して、それぞれのピースをGIFアニメにして、あとでひとつに合成すればある程度大きく高画質なGIFアニメを作ることができます。

 今日は、この方法をご紹介します。

元画像の分割

 後で一つの画像にするために、画像の分割は正確に行う必要があります。

 これには、『PhotoScape』というソフトを使いました。簡単に分割できます。

PhotoScape01.png


PhotoScape02.png


 これで、一つの画像をきれいに四分割できます。出力はpng形式にします。

GIFアニメーションの作成

 四つのパーツをそれぞれGIFアニメーションにします。

 この方法は過去記事『写真をきらきらGIFアニメに加工するwebサービス』に書きましたので省略します。


GIFアニメーションの合成

 次に、4つのGIFアニメーションを合成して一つにします。

 管理人が思いついたのは、PowerPointを使う方法と、Photoshopを使う方法の二つ。

 まず、PowerPointを使う方法です。
 手順だけを書きます。

@ PowerPointに4つのGIFアニメを読み込む。
A ひとつの画像になるように配置する。

PowerPoint-4Animation-combine.jpg


B これを保存するとき「ビデオの作成」で動画として出力(拡張子 wmv)。
C 動画を扱いやすいmp4形式に変換(webサービスやWindows付属のMovie Makerでも可能)
D 変換した動画(mp4形式)をwebサービスでGIFアニメに変換。さらに、不要な部分を切り取る。

 具体的には、過去記事『地図上に旅行ルートのラインが描かれていくGIFアニメの作り方』をご覧下さい。

 次に、Photoshopを使った方法。
@ GIFアニメーションを動画に変換。管理人は、Giamを使ってavi形式に変換しました。
A Photoshopに動画を読み込む。
B ひとつ画面のキャンパスを4つの画面が入るように拡大する。
C 残りの3つの動画レイヤーをひとつのpsdレイヤーに集める。そして、1つの画像になるように配置する。
D アニメーションで動かしてみる。
E GIFアニメーションとして出力する。

Photoshop-GIF-Animation-combine.png


 仕上がりがこちら。『トリバゴ』のナター・エモンズさんです。

Natalie-Emmons-Animated.gif



posted by ネコ師 at 00:48 | Comment(0) | GIFアニメの作り方と素材庫 | このブログの読者になる | 更新情報をチェックする
この記事へのコメント
記事に関係ないコメント、宣伝的なコメントは削除させていただきます。
コメントを書く
お名前: [必須入力]

メールアドレス:

ホームページアドレス:

コメント: [必須入力]

認証コード: [必須入力]


※画像の中の文字を半角で入力してください。
※ブログオーナーが承認したコメントのみ表示されます。

▲ このページのTOPに戻る