Canva 便利ツールの使い方

Canvaで作る簡単GIFアニメーション/ブログにも貼れる動くバナー画像の作り方

2021年6月21日

須崎純一
こんにちは、須崎純一です。

プロフィールはコチラ

今日はCanvaでGIFアニメーションバナーの作成方法を具体的に解説していきます。

Canvaで作るGIFアニメーション

GIFアニメーションとは

GIFアニメーションとは、画像をコマ割りして連続再生した「動く静止画像」です。

もりのゆかアイコン(笑)
もりのゆか
パラパラ漫画みたいなイメージですね!

GIF動画とは

パラパラ漫画のように一枚一枚画像を作成し、それをつなぎ合わせることで動画になります。

今回は画像を一枚一枚作成してつなぎ合わせるという方法はとても手間なので、Canvaを使って、GIFアニメーションを使ったブログ用バナーの作成方法を3ステップでお伝えしていきます。

▼Canvaの基礎編▼

Canvaとは?

Canvaは、オンラインで使える無料のグラフィックデザインツールです。

Canva

パソコンでもスマートフォンでもデザインが可能!素人でも素敵な画像が作成できちゃうオススメのツールです。

CANVAでオリジナルで印象に残るデザインを今すぐ開始!

スマホ版Canvaの使い方
参考「Canva」の始め方と基本的な操作方法【スマホ版】

続きを見る

GIFアニメーションバナーの作成方法

それでは早速GIFアニメーションを使ったバナーを作っていきましょう。

step
1
Canvaを開き「デザインを作成」をクリック

Canvaを開き、画面の右上「デザインを作成」→「カスタムサイズ」をクリックして作成したいバナーのサイズを入力します。

Canvaを開く

サイズを入力できたら「新しいデザイン」をクリックして作成していきましょう。
(※ここでは「1200」×「300」で作成しています)

カスタムサイズ

step
2
使いたい素材を選ぶ

続いて、「素材」から自分の使いたい「素材を検索」していきます。

素材を検索する

例えば

  • 本に関するアニメーションを作りたいなら「本」
  • 人物のアニメーションが欲しかったら「人物」

など、色々検索してみましょう。

検索できたら、検索バーの右にあるアイコンから、アニメーションにチェック✔️を入れ、「絞り込む」をクリックし、アニメーションのみの素材に絞ります。

アニメーションで絞る

▼アニメーションのみの素材に絞られました▼

アニメーションのみの素材に絞り込み

ここから自分の気に入ったアニメーションを選択し、バナーを作成していきます。

テキストも自由に入力しよう

step
3
動画をダウンロードする

バナーが完成したらダウンロードしていきます。

画面右上の「ダウンロード」→「∨」をクリックして一覧を表示させます。その際、「MP4形式の動画」でダウンロードしないように注意しましょう。

MP4形式の動画でダウンロードしないようにする

バナーをダウンロード

一覧の一番下にある「GIF(短いクリップ、音声なし)」を選択しましょう。

GIF形式を選択

ファイルの種類が「GIF」になっていることを確認して、「ダウンロード」しましょう。

画像をダウンロード

▼これでGIFアニメーションのバナーが完成です▼

GIFアニメーションサンプル

CANVAでオリジナルで印象に残るデザインを今すぐ開始!

▼Canva基礎編(スマホ版)▼

まとめ

ワードプレスをはじめ、アメブロなどにもGIFアニメーションのバナーは使用できます。

もりのゆかアイコン(笑)
もりのゆか
動いてると、なんだかパッと目を引きますね
須崎純一
このほかにも、「商品の作り方」「便利なツール」「時短仕事術」をまとめた記事もありますのでぜひご覧ください
canvaの使い方と基本的な操作方法
「Canva」の始め方と基本的な操作方法【PC版】

続きを見る

  • この記事を書いた人

須崎純一

8年間で4社転職→社会不適合と自覚し逃げの起業→貯金をすり減らすも、FXで一発逆転を狙う→200万円の損失→経営塾で修行→起業コンサルデビュー→初クライアントさんが3ヶ月で月収7桁超え→月収8桁超えのクライアントを多数輩出。情報発信の「コツコツ」をシステム化し、より自由でクリエイティブなライフスタイルを実現する」めんどくさい作業をシステムやAIで無くし、得意なことや好きなことに集中するべくビジネス展開をサポート。場所に制限がない「フーテンの寅さん生活」で全国を転々としてます。

-Canva, 便利ツールの使い方