ブログのメインコンテンツは文章と写真。

それは揺るぎもない事実ですが、文章と写真だけなら紙媒体でもできますよね。
インターネットを通して配信しているのだから、その特性をできるだけ活かしたいところです。

そこで、gifアニメーションの登場です。

こういうやつですね。
このgifアニメは以前の記事内で使用しました。

その際、いくつか質問もありましたので今日は簡単なgifアニメーションのメリットと、簡単な作り方をご紹介したいと思います。

• gifアニメーションのメリットを有効活用しよう
  • gifアニメーションの簡単な作り方
    • オンラインサービスを利用する
  • まとめ

gifアニメーションのメリットを有効活用しよう

さてさて、ではgifアニメのメリットとはなんでしょう。

なんといっても、自動的に無音で再生されるところでしょう。
動画の埋め込みでは再生ボタンを押さない限り再生されません。
画像との並びでも違和感なく、さらっと再生してくれる粋なやつ。

ただ、このメリットはデメリットにもなりえます。
むやみにいれると読みづらいものになってしまいます。
肝心の記事を読んでもらえなくては意味がありません。

また、複数いれるとページの表示が重くなります。

とはいえ、記事に躍動感が生まれるので、使いどころによっては非常に有効な手段だと思います。

躍動感といえばこんな感じ。

「シュパパパパパパパパパパパッ」

終わることのないペロペロです。
毛が無くなっちゃうよ、大五郎。

gifアニメーションの簡単な作り方

では、gifアニメーションの作り方を。

photoshopを使ってパラパラ漫画のように画像を重ねて作る方法が基本だと思いますが、今回は『簡単に』ということでスマホなどで撮影した動画から作成する方法を挙げてみたいと思います。

まずはスマホから動画をパソコンに保存します。
僕はiPhone6で撮影し、MacBookに保存しましたが、拡張子は.MOVでした（拡張子によってはこの後の手順で対応していないかもしれません）。

元動画は下記を使いました。

最近撮影したヤギ様。

オンラインサービスを利用する

ezgif.com

上記を使うのが一番簡単にGIFアニメーションを生成できる方法だと思います。
オンライン上で作成できますので。

注意点としては、動画のサイズ上限が16MBであることくらいでしょうか。

では、さっそく。

「ファイルを選択」をクリックして動画ファイルを選択後、「Upload!」をクリックします。

すると、動画のキャプチャが表示され、その下にGIFアニメーションを作成する際に設定できる項目が表示されます。

Start timeはGifアニメを生成する動画の開始地点、End timeは終了地点ですね。
秒単位で設定します。
デフォルトは動画全ての時間になっていると思います。

SizeはOriginalだと動画のサイズになります。
ここでは500にします。

Frame rateは動画の滑らかさ。そのままでよいでしょう。
MethodもffmpegのままでOKです。

設定が完了したら、「Convert to GIF!」をクリックします。

すると、そのページの下部の「Output gif:」の部分にGIFアニメーションが表示されます。

表示されたGIFアニメの下に諸々設定できるボタンがあり、そこからリサイズなどの加工が可能です。
書き出す際は「save」をクリックします。

GIFアニメーション、完成。

後はこのGIFアニメーションを記事内に放り込めばOKです。
Wordpressでもはてなブログでも、造作無く動きます。

動いた、ヤギ様。

どうでしょう、簡単ですよね。

完成したGIFアニメが重たい場合は、先ほどのサイトでファイルサイズを圧縮することも可能です。

ezgif.com

できるだけ軽くして閲覧しやすいようにしたいですね。

まとめ

上記の方法以外には、Photoshopを持っていれば、動画ファイルをそのまま読み込んでGIFアニメーションにするのが一番調整はしやすいと思います。

記事に躍動感が生まれることがメリットとお伝えしたGIFアニメーションですが、使いどころはもちろん記事以外にもあります。

実は、当ブログのロゴも静かに変化しているのでした。
これも、GIFアニメーションを利用しています。

気付かれた方、いらっしゃったかしら。

 

すてきな写真ブログの作り方 [ Atelier・Spoon ] 価格：2,041円（税込、送料込）

「ブログフォト」センスアップの法則 : 人気ブログの秘密がわかる【電子書籍】[ STUDIOD… 価格：972円

 

次回予告

青空とフリマと池袋ウェストゲートパーク　同じ場所に１日身を置くこと
RSS購読