【簡単GIF作成】イラスト2枚だけ/文字を打つ動き

thumnail DTP/Web
この記事は約2分で読めます。

GIFは凝ったイラストでなくても、工夫によってユニークなものを作ることができ、作った作品をSNSでたくさんの人に使ってもらうこともできます。
参考:Instagramステッカーを作る – GIPHYへの申請

ここでは少ない枚数のイラストで作成するもの、イラストを描く必要のないものといった簡単なGIFの作り方をご紹介します。

使用アプリケーション:Photoshop

口をぱくぱく動かすねこ


△こちらを作ります

こちらは想像がつきやすいと思いますが、用意する画像は2種類です。

image
①口を閉じている画像
image
②口を開けている画像(+ハート)

 

透明背景のレイヤーに①の画像を描いたあと、そのレイヤーを複製し、口の部分だけ描き直します(今回はハートを添えました)。
image

 

タイムラインバーが表示されるので各レイヤー画像の表示時間を設定し、再生ボタンで動作確認します。
image

 

ファイル – 書き出し – 「web用に保存」からGIFを選択し、保存します。透明背景の場合は「透明部分」にチェックを入れます。
image

完了

 

同じ原理でできるもの

gif

羽をぱたぱたさせる蝶。こちらもレイヤー2つ分の画像のみ。

 

 

文字を書くGIF

gif

△こちらを作ります。

先ほどと要領は同じで、動きの分だけレイヤーを分けてオブジェクトを用意します。

image

ひと文字につきひとつのレイヤーです。これを先ほどと同じようにタイムラインを選択し、調整。GIF形式で保存します。ちなみにこれはGIFをInstagram等で使えるように登録する際に使用するGIPHY上でも作成できます。「タイピング」というアニメーション機能を使用します。
もちろん他にも同じ効果を得られるアプリケーションがあると思いますので、使いやすいもので作成するといいと思います。

 

同じ原理でできるもの

gif

パステルパープルのマーカーで背景を塗り、上から文字をタイプするという動きです。

image

用意するレイヤーは全部で9つ。
1〜5はマーカーで背景を塗る動き。6〜9で文字をタイプする動きを表します。

 

作成したGIFをInstagram等で使えるようにするためのGIPHYへの申請については別のポストでご紹介していますので、よろしければご覧ください。
参考:Instagramステッカーを作る – GIPHYへの申請

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