バナー作成のやり方
１、デザインの種類の選び方
バナーは、ウェブサイトのヘッダー、ブログ記事、SNS投稿など、
さまざまな場所で活用されます。
今回は、「【無料ウェビナー】WebデザイナーのためのCanva時短術」
というテーマのバナーを作成します。
それぞれの用途に合ったサイズを選ぶことが重要です。
Canvaのホーム画面、左のサイドバーの「作成」をクリックし、
作りたいバナーサイズを選びます。
今回は、SNSで汎用的に使える「Facebookの投稿（横）」
を選んで進めていきます！
２、テンプレートの選び方
左のサイドバーの「デザイン」をクリックし、
検索窓に「ウェビナー」「セミナー」「ビジネス学習」などの
キーワードを入力して、イメージに合うテンプレートを探してみましょう。
今回はWebデザイナー向けのセミナーなので、
少しモダンで洗練された雰囲気のテンプレートが良いかもしれません。
今回はこちらのテンプレートを使っていきます！
３、テキスト・フォントの変更
テンプレートのデフォルトフォントをそのまま使うと、
同じテンプレートを使った他の人のデザインと似てしまうことがあります。
思い切ってフォントを変えるだけで、
オリジナリティが高まり自分自身の個性を表現できます。
そして、全体のバランスをみて文字の大きさや
文字間なども調整してみてください。
＜デザイン変更例＞
デザインのポイント：要素の整列機能
バラバラに配置された文字や画像は、見る人にストレスを与え、
プロフェッショナルな印象を損ねてしまいます。
複数要素を選択し、ツールバーの「配置」をクリック。
「素材を整列させる」の中から必要な整列を選択すると適用されます。
４、カラーの変更
今回はCanvaをイメージさせるグラデーションカラーをメインカラーとし、
タイトルの下と下部の四角形などをメインカラーに変更しました。
＜カラーの変更例＞
５、テーマに合ったイラストの挿入
左のサイドバーから「素材」を選択し、
検索バーにキーワードを入力して検索。
イメージにあるイラストが見つかったら
クリックして挿入します。
今回はこちらのイラストにしてみました！
グラフィック素材なので、ツールバーからカラー変更が行え、
今回は黒（#FFFFFF）→黒（#1E1D1D）に変更しました。
デザインのポイント：グラフィック素材の編集
グラフィック素材（イラストやアイコンなど）を編集する際、
選択して編集ボタンを押すと、
「フォトエディターを使用すると、グラフィックが画像に変わり、すべてのツールが利用できるようになります」
といったメッセージが表示されることがあります。
これは、色変更が可能なグラフィック素材を、
通常の写真と同じような画像データに変換しようとしていることを示しています。
フィルターやエフェクトなどの画像編集ツールを使うと、この変換が適応されるので、
元々できた色変更の機能が使えなくなってしまう点には注意しましょう。
６、申し込みボタン・誘導テキスト
バナーを見た人に「参加したい！」と思ってもらったら、
次は何をすべきか明確に伝えることが重要です。
テンプレートにはなかったので、追加していきたいと思います！
四角形でボタンの土台を作り、
一言テキストを追加、
矢印素材を挿入してCTAボタンを作りました！
７、背景素材を活用してバナーを装飾
単色の背景に加えて、
写真やグラフィック素材を背景として活用すると、
デザインに深みと個性を加えることができます。
テンプレートにはグリッド線の素材が入っているので、
これを削除して別のものに変更していきます。
左のサイドバーから「素材」を選択し、
検索バーにキーワードを入力して検索。
写真やグラフィック素材から背景に使えそうなものを探しましょう。
今回はテーマに合わせて、少しデザイン性を加えたいと思うので、
カラフルな花火のような素材を追加しました。
<デザイン変更例＞
バナーの仕上げと調整
１、テキストエフェクトでタイトルの強調
セミナーのメインタイトルをもっと見やすくするため、
テキストエフェクトを加えてみましょう。
「WebデザイナーのためのCanva時短術」というタイトルテキストをすべて選択し、
上部ツールバーの「エフェクト」をクリックします。
「影」「浮き出し」「ネオン」などを試し、
背景や全体のカラーに馴染みつつ、
視認性の高いエフェクトを選んでみましょう。
エフェクトの色や強さも調整できます。
２、全体的なバランス調整（余白、要素の配置など）
各要素の間に適切な余白があるか、
情報がごちゃついていないかを確認しましょう。
人はバナーやウェブページなどの情報を読む際、
左上から右上、そして左下へ斜めに移動し、最後に右下へと視線が「Zの形」に動く傾向があります。
重要な情報（タイトル、日時、ボタン）が自然な視線の流れで目に入るように
Zの形でチェックしてみてください。
＜バナー完成例＞
