スポンサーリンク

GIFの作り方♪ PS

       

今日は、GIFデータマイブームだったので

記事にしてみました。

f:id:editman:20151019230354g:plain

こんな感じのアニメーションGIFの作り方を

私なりの方法の説明をします。

私は、フォトショップCC2015を使用してますので

他のバージョンで、同じ方法で出来るかは

分かりません。

なので参考ぐらいで、気楽に読んで下さい。

まずは、バナーにしたい動画を準備して下さい。

上記のGIFも、元は、動画編集ソフトで作った

大きい普通の動画でした。

では、動画を準備出来たら

GIFに変換してアップまでしてみましょう♪

GIF作成方法

まずは、フォトショップを起動します。

f:id:editman:20151019234840j:plain

そして、作成した動画をドラッグ&ドロップします。

f:id:editman:20151019234915p:plain

動画の対応拡張子は

AVI、MP4、MOV、WMV

の確認はしてOKでした。

ドラッグすると

f:id:editman:20151019235031j:plain

プレビュー専用ですと表記されます

問題無くOK!

画面の下に、こんな表示がされます。

f:id:editman:20151019235151j:plain

次に

GIFに変換して行きます。

メニューのファイル⇀書き出し⇀Web用に保存を選択

f:id:editman:20151019235319j:plain

こんな画面が出ます。

f:id:editman:20151019235350j:plain

右下の画像サイズで好きなバナーサイズに変更してください。

例えばスマホなら

300x100とか

320x200とか

元となる動画は大きくても大丈夫です。

好きなサイズをここで決めますので♪

ただ

※注意でGIFアニメーション

極力短めで繰り返しパターン動画にする方が良いですよ♪

f:id:editman:20151019235506j:plain

画像サイズの設定の下にアニメーションタグがあります。

ループオプションを「一度」「無限」の設定が選べるので

繰り返したい場合は、「無限」にしておきましょう♪

↓次に、ここはしっかりGIFに設定しておきましょう!

f:id:editman:20151019235833j:plain

その他の設定は

こんな感じでOKですよ♪

f:id:editman:20151019235922j:plain

では、保存しましょう♪

f:id:editman:20151020000013j:plain

保存する際には、フォーマットを画像のみにしましょう♪

f:id:editman:20151020000120j:plain

これでアニメーションGIFが

完成です!

f:id:editman:20151020000203j:plain

では、次に

この動画をネット上にアップしなければなりません。

はてなブログをしている方なら

サーバーをレンタルしなくて大丈夫ですよ♪

では、作成したGIFアップしましょう!

はてなブログで記事を書く時に

写真を投稿する流れでOKです♪

f:id:editman:20151020000745j:plain

写真を投稿♪

f:id:editman:20151020000816j:plain

こんな感じになりますよね。

これでOKです♪

後は記事に表示された

GIFデータの上で右クリックします。

f:id:editman:20151020001037j:plain

画像URLをコピー♪

これで無事に作成したアニメーションGIFを

URL化出来ましたね♪

今回フォトショップを使いましたが

ネットで

フリーソフトでGIF作成ソフトは

沢山ありますので

どんな方法でもOKだと思いますよ♪

GIFを作成したら

はてなブログを利用して

ネットにGIFを投稿してアップすれば

良いだけなので

ちょっとした小さいサーバーとして

利用価値ありますね。

使わなくなったら

投稿したGIFを削除すれば

ネットからも削除されるので

安心です!

良かったら参考にして下さい。

ではでは、エディットマンの編集の旅は続く、、、