GIFアニメーションを作ろう

スポンサーリンク
スポンサーリンク

GIFアニメーション 京都秋の御池通り

画像形式のGIFには、GIFアニメーションと言う機能があります。最近はウェブサービスを使って、GIFアニメが簡単に作成できるようになりました。

画像にGIFアニメーションを使うと、画像をパラパラ漫画のように並べて表示して、動画のように見せることができます。上のGIFアニメーションは、いわしの仕事場から撮影した秋の御池通りの様子です。

街路樹が少しずつ紅葉で色づいて落葉していきます。カメラの位置がバラバラなのはご愛嬌ということで・・・(^_^;

スポンサーリンク

GIFアニメーションの例 ニコニコ動画

GIFアニメーションを使えば、動きのないwebサイトにちょっとしたアクセントがつけられます。GIFアニメーションのバナーはよく見かけますよね。

webサイトにGIFアニメーションのバナーがあると、単純なものでもやっぱり目を引きます。

GIFアニメーションは1つの画像ファイルとして表示されますが、その中に複数のGIF画像が保存されています。GIFアニメーションは一種の動画ですが、音声は入らず、長いものや複雑な動画には向きません。動画を使うまでもないような短いものを見せるときによく使います。

たとえば、GIFアニメーションと言われていわしが思い出すのはニコニコ動画です。

左上のタイトルに小さなGIFアニメーションがついてます。特に意味のない、ただのアクセントですが、たまにププッと笑ってしまうものもあります。

http://www.nicovideo.jp/video_top

ニコニコ動画:GINZA

ところで、ニコニコ動画のGIFアニメは、一体何種類ぐらいあるんでしょうか・・・と思ったら、こんなところがありました。何と1000種類です。

どのGIFアニメも意味不明ですが、これだけ集まると壮観ですねぇ。

http://res.nimg.jp/img/base/head/icon/nico/

ニコニコ動画 左上タイトルのGIFアニメ一覧

GIFアニメーションを作ってみる

では、GIFアニメーションを作成してみましょう。

作成の際はPhotoshopを使ったり、GiamやGifCamのようなGIFアニメーション作成ツールを使うのが一般的ですが、最近はこんな便利なwebサービスもあります。

バナー工房のGIFアニメーション作成ツールを使えば、GIFアニメにしたい画像を選んでクリックするだけで、GIFアニメが簡単に作成できますよ。

大層なことはできませんが、普通に使うならこれで十分です。

http://www.bannerkoubou.com/anime/

GIFアニメ(アニメーション)作成 | 画像加工編集サイト・フリーソフト:無料写真加工ならバナー工房

まずは「ファイルを選択」をクリックして、GIFアニメーション用の画像を上から順番に選択していきます。画像は20枚まで使用できます。

GIFアニメーション作成

こんな感じで画像を選択していきます。アップする画像はすべて同じサイズのものを使用します。

あらかじめ画像をリサイズやトリミングで同じサイズに合わせておかないといけませんが、バナー工房のトップページから画像のリサイズやトリミングができるので、画像の加工ソフトがない場合は使ってみるとよいでしょう。

GIFアニメーション作成 画像ファイルを選択

最後に、点滅間隔とループの有無を選択します。点滅間隔は0.1~2秒まで、0.1秒間隔で選択できます。最後にループの有無を選択して「画像を加工する」をクリックします。

GIFアニメーション作成 点滅間隔とループ設定

完成まで少しお待ちあれ・・・

GIFアニメーション作成中

GIFアニメーションが完成しました。「ダウンロード」をクリックして、完成したGIFアニメーション画像を取り込んでください。

GIFアニメーション完成

こんな感じで簡単にGIFアニメーションを作ることができます。

GIFアニメーション 京都秋の御池通り

人間、誰しも動きのあるものには目が行ってしまいますから、webサイトにアクセントが欲しい時は、GIFアニメーションを使うと効果的です。ぜひチャレンジしてみてくださいね。

あと、画像によってはかなりサイズが大きくなるのでご注意を・・・

スポンサーリンク

GIFアニメーション 参考サイト

参考まで・・・「SQUEEZE – Web Design Studio – 」さんの記事で、GIFアニメーションを共有したり検索できるサイトを紹介しています。なかなか面白いですね。

http://squeeze.jp/blog/web-service/the-rise-of-the-animated-gif/

ブーム再来?!盛り上がりを見せるGIFアニメを楽しむサービス・アプリ 9選 / SQUEEZE – Web Design Studio –

他にも、こんなところがあります。特になんてことのないGIFアニメーションなのですが、少し動きをつけるだけで食べ物がこんなにおいしそうに見えちゃいます。

http://japan.digitaldj-network.com/archives/51972785.html

【空腹注意】空前の破壊力を伴ったGIFアニメが登場 | DDN JAPAN

あとはこんなのもいかが・・・GIFアニメがたくさんのGIFMAGAZINEです。

http://gif.gifmagazine.net/

GIFMAGAZINE

コメント

タイトルとURLをコピーしました