執筆：Daily GIF89a編集部(大野謙介)

この記事で理解できること(文章量：3分)

・作業時間15ほどで、Photoshopを用いてバナー広告用のGIFアニメを作ることができる。

今回制作したGIFアニメ

今回は、Photoshopの「ぼかし(放射状)」を活用して、回転するタイヤの疾走感を表現した。もちろんカーライフサポーター「TYREBOY next」は架空のメーカーである。

使用した素材

引用元URL：http://www.pakutaso.com/20140254044post-3823.html

制作手順

０．今回、タイヤの回転のアニメーションのみを解説する。その他コメントは任意で配置をして欲しい。

１．新規作成で幅を336px、高さを246pxに設定し「OK」を選択する。

２．画像素材をドラッグアンドドロップで読み込み、レイヤーの名前を「タイヤ」に変更した。

３．「タイヤ」レイヤーをコピーして「タイヤ回転1」レイヤーをと名前を変更した。

４．「タイヤ回転1」レイヤーのタイヤ部分を「選択ツール」などで選択し、切り取る。

５．綺麗にタイヤ部分を切り取った「タイヤ回転1」レイヤー３回コピーして、「タイヤ回転2」「タイヤ回転3」「タイヤ回転4」と名前を変更する。その後、全てのレイヤーをグループにまとめる。グループ名は「車」とした。

６．「タイヤ回転1~4」のレイヤーを回転させ疾走感をだしていく。

７．「タイヤ回転4」レイヤーは、「ぼかし(放射状)」の量を「80」として「OK」を選択する。

８．「タイヤ回転3」レイヤーは、「ぼかし(放射状)」の量を「60」として「OK」を選択する。

９．「タイヤ回転2」レイヤーは、「ぼかし(放射状)」の量を「40」として「OK」を選択する。

１０．「タイヤ回転1」レイヤーは、「ぼかし(放射状)」の量を「10」として「OK」を選択する。

１１．「ウィンドウ」「アニメーション」を選択する。

１２．フレーム１をコピーする。フレーム１は、車グループをまるごと右に「移動ツール」で移動させる。

１３．フレーム２は、車グループをまるごと左に「移動ツール」で移動させる。

１４．「トゥイーン」をクリックし、追加するフレームを「３」にして「OK」を選択する。

１５．フレーム１を選択し、「タイヤ回転4」レイヤーを表示させる。

１６．フレーム２を選択し、「タイヤ回転3」レイヤーを表示させる。

１７．フレーム３を選択し、「タイヤ回転2」レイヤーを表示させる。

１８．フレーム4を選択し、「タイヤ回転1」レイヤーを表示させる。

１９．フレーム５を選択し、「タイヤ」レイヤーをのみを表示させる。

２０．今回文字を表示させたりすることで最終的に20フレームのGIFアニメーションとなった。

完成したGIFアニメ

制作を終えて

今回は、Photoshopのぼかし(放射状)を活用して、回転の躍動感を描写した。TYREBOY nextで今年の冬は安心である。

執筆：Daily GIF89a編集部(大野謙介)

【GIFMAGAZINE】http://gifmagazine.net/

GIFアニメ好きのためのGIF作品投稿・共有プラットフォーム

GIFMAGAZINEアプリ版のダウンロードはこちら

 
iOS:https://itunes.apple.com/ja/app/gifmagazine-animated-gif-magazine/id734489230?l=ja&mt=8
Android：https://play.google.com/store/apps/details?id=jp.createbox.gifmagazine