Internship Blog June 2017

インターンシップ生ブログ

未分類

バナー作成のコツ

投稿日:2017年6月7日 更新日:

こんにちは。MIYAです。
実習4日目。本日の実習では、バナーのトレース作業を行いました。

ちなみに、これが本日トレースした作品の1つです。

1つのバナーの中には沢山の情報が詰め込まれています。これらの情報をいかに分かりやすくデザインするか、なかなか難しいです。そこで本日は、バナーを作成する時のコツについてご紹介いたします。

そもそもバナーの役割とは

WebサイトやSNSのタイムライン、スマートフォンのアプリ等様々なところで見かけるバナー(Banner)ですが、直訳すると「旗」「のぼり」という意味だそうです。

その名の通り、バナーは、Webサイト上で宣伝を行うために作られた「のぼり」です。見る人の興味を引き付けて、クリックしてもらい、広告サイトへと誘導すること。これがバナーの役割です。

バナー作成のコツ

バナーのサイズは様々です。バナーの大きさ、Webサイト上のどこに配置するかによってバナーの掲載費用が変わってきます。そういった限られた条件でいかにいかに魅力的な広告をデザインするかが、バナー作成の技の見せどころです。

また、バナー1つの制作単価は低価格であるため、短時間で仕上げる技量も求められます。バナー1つ作るのに1時間弱というのが一般的な感覚なようです。

では、バナーを作成する際にデザインに迷う時間を減らすために、考え方のコツをご紹介します。

1.配置を揃える

バナーの中には、テキストやイラスト、写真等様々な要素が組み合わさっています。それらの要素を配置する際に、揃えられるものは揃えて配置すると美しく見えます。

まず、バナー作成時には、バナーサイズの枠に縦と横方向の補助線を引き、全体のバランスを見ます。これを基に、さらに補助線を付け加えながら、囲われた空間に対して要素を左揃え、中央揃え、右揃えにするか考えながら配置していきます。

2.余白をとる

バナーは小さく限られたサイズではありますが、余白をきちんと取り入れることで、窮屈感がく見やすいデザインとなります。枠の周囲や、文字、図との間にも余白を取り入れることを考えて見ましょう。

3.強弱を付ける

バナーに掲載する情報の中で一番見て欲しいところはどこなのか、デザインする要素の重要度を決めて、表示の仕方に強弱を付けることが重要です。これにより、読み手側に重要な情報が一目で伝わるようになります。

色んなバナーデザインを見て勉強しよう

バナーの作成スキルをアップさせるためには、色んな方々が作成したバナーを沢山見ることが有効です。色んなバナーを集めている参考サイトを2つご紹介します。

・バナーデザイン専門ギャラリーサイト「レトロバナー」
http://retrobanner.net/

バナーのサイズ、色、業種、テイストからバナーを絞り込む事ができとても見やすいです。

・バナーデザインギャラリー「Banner Design Gallery」

http://www.banner-design-gallery.com/

カテゴリー別に絞り込むこともでき、さらに人気順、新着順に表示することもできます。

デザインのパターンを覚えよう

バナートレースによって沢山のバナーを作成し、参考サイトで色んなデザインを見ていくことでバナーデザインのパターンが見えてくるそうです。

私もその域に達することができるよう、これからも特訓していきたいと思います!

-未分類

執筆者:


comment

関連記事

ハンコ風にロゴをデザインする方法

こんにちは、MIYAです。 実習9日目。本日もWebサイトのパーツ作成を行っております。 その中で覚えたテクニックがこちら。 ハンコ風にロゴをデザインしてみました。・・・ハンコのように見えますかね!? …

ドットインストールとは

こんにちは、北野です。 実習2目です。 本日は、ドットインストールというサイトで学習しました。 ドットインストールとは、「3分動画でマスターする初心者向けのプログラミング学習サイト」と書いてあります。 …

Webサイトを企画する際に考えておきたい4つのP

こんにちは。MIYAです。 実習5日目。本日の実習では、Webサイト企画の考え方について教えていただきました。 そこで、そもそもWebサイトを制作して叶えてようとしていることが、本当にWebサイトが持 …

Illustratorでカーテンを描く方法

こんにちは。MIYAです。 実習10日目。今週もWebサイトのパーツをゴリゴリ作成しております。 そして今回はこちら このようなカーテンをIllustratorで作成するテクニックを紹介します。暗めの …

世界のWordPress

こんにちは、北野です。 実習14日です。 今日は、WordPressについて調べてみました。 毎日、WordPressでブログを書いているのですが、実はあまり分かっていません。 実習に来る前に聞いたこ …