2014年2月26日

GIFアニメの作り方は? チュートリアル用のアニメ画像も簡単に作れる「Gifzo」がオススメ【※サービス終了】

gifzo-250

2016年1月25日追記: この記事で紹介しているツール「Gifzo」はサービスが終了しているようです。代わりにわたしは現在LICEcapというツールを使っています。

こんにちは! ヨス(@yossense)です。

このブログでは、ツールの使い方を始めとした「物事を説明する記事」が多いのですが、そういう時、どうしても静止画だとわかりづらいことがあります。なので使いたいのが動画ですが、重いですよね。そこで今回の主役のGIF(ジフ)アニメーションが登場です。

GIFアニメーションで作った画像
GIFアニメーションで作った画像

実はこういうGIFアニメーションをYoutubeみたいな動画や、パソコンの動作から超簡単に作れるツールがあるんです。今回はそんな素敵なツール「Gifzo」の紹介です!

GIFアニメを簡単に作れる「Gifzo」

GIFアニメは普通に作ろうと思うと、いろいろ技術的に大変です。このGIFアニメは私が普通にスクリーンショットを撮りまくって、Adobe Photoshopで編集したのですが、かなり大変でした。

普通に作ったGIFアニメ(めちゃ大変やった)
普通に作ったGIFアニメ(めちゃ大変やった)

これを作った当時は超楽チンに作れるツールがあるなんて知らなかったんですよね……。という訳でGIFアニメを一発で作れるのがGifzoというツールです。

このツールは、指定した範囲内に表示されているものの動きをGIFアニメにできます。その範囲内にYoutubeなどの動画があれば、YoutubeもGIFアニメにできるというスグレモノです。

Gifzoのダウンロード&インストール

Gifzoこちらのページからインストールできます2016年1月25日追記: 残念ながらこちらのサービスはすでに終了になっています

1ダウンロード

上記のページのDownloadをクリックするとダウンロードが始まります。

Downloadをクリック
Downloadをクリックします

GifzoWin.zipという圧縮ファイルがダウンロードされます。

2好きな場所に移動

ダウンロードしたGifzoWin.zipという圧縮フォルダを解凍します。するとGifzoWinというフォルダになります。

これをお好きな場所に入れてください。私の場合はクラウドの中に入れて、複数のパソコンで共有で使えるようにしています。

3ファイルを開く

好きな場所に入れたら、今度はそのGifzoWinを開きます。その中にGifzoWin.exeというファイルがありますので、それをダブルクリックしたらGifzoが起動します。

このツールはパソコンの中にインストールして使うものではなく、保存したい場所に入れておいて、使いたいときにGifzoWin.exeを起動させて使います。

4途中でやめたいときは?

Gifzoを起動したけど、やっぱやーめたっ!って思った時はEscキーを押せば止められます。

Gifzoの使い方

それではGifzoを使って実際にGIFアニメーションを作成してみましょう。

1カーソルが変化する

GifzoWin.exeをダブルクリックし、起動させた瞬間、画面が薄暗くなります。そして、カーソルが「+」のような形に変化します!

画面が暗くなり「+」のカーソルが出現します。
画面が暗くなり「+」のカーソルが出現します。

2四角で範囲を選ぶ

マウスの左ボタンを押し続けながらカーソルを動かすと「四角」が現れます。マウス左ボタンを離した瞬間、動画収録する四角が決定されます。その四角の範囲内での動作がそのままGIFアニメになるんです(ただし、カーソルだけは映りません)。

四角でアニメーションにしたいところを選択
四角でアニメーションにしたいところを選択

ちなみにこの例では、私が作った動画(Youtube)の一部をGIFアニメーションにしようとしています。

3収録を開始する

では収録を開始します。Ctrl+Rを押すと録画がスタートになります。

Ctrl+Rを押すと収録が始まります!
Ctrl+Rを押すと収録が始まります!

この例の場合は、もちろんYoutubeも再生しなければなりません。

4収録を終了

収録を止めたいところで、もう一度Ctrl+Rを押します。すると、ブラウザが勝手に立ち上がり、作成されたGIFアニメーションのページ(Gifzoのページ)へ移動します。

ブラウザでこんなページが立ち上がります
ブラウザでこんなページ(Gifzoのページ)が立ち上がります

5保存しましょう

画像を保存(ダウンロード)して下さい! これでOKです。

名前を付けて画像を保存
[ 画像の上でマウス右クリック ] → [ 名前を付けて画像を保存 ]

これで完成したのが、こちらのシュールなGIFアニメーションです。Youtubeにアップロードしている動画から簡単に作れました。

納豆が茶碗に移らない!
納豆が茶碗に移らない!シュールなアニメ

さて、このツールですが、ものすごく使いやすいです。こんなに簡単に作れるんなら 早く知っておきたかったですよー。

先日Gifzoで作ったのがこちらです。

PhraseExpressの例
このアニメはPhraseExpressの例です。

GIFアニメは、こんな風にツールの使い方の説明なんかをするときに非常に便利ですので、ぜひ使ってみてくださいね!

この記事が気に入ったら
「いいね!」で情報GET!

Twitterでヨスをフォローしよう!

この記事のシェアはこちら♪

※ 微妙だったら、そっと閉じるか、ほかの記事を見ていただけるとうれしいです!