Internship Blog June 2017

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

未分類

バナー制作

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

こんにちは、北野です。
実習4日目です。
 
本日はバナー制作の練習です。
 
バナーとはWikipediaによりますと、
 
バナー (banner) はウェブページ上で他のウェブサイトを紹介する役割をもつ画像(アイコンの一種)のこと。
本来、旗印を意味し、ウェブページ上で広告が目立つように使われたことから、この通名で呼ばれ定着した。
主に広告・宣伝用に作られ、ウェブサイトへのハイパーリンク用にも利用される。
画像にはリンクを張り、クリックするとそのバナーが紹介するサイトを表示するようになっている。
横長帯状のものが一般的だが、近年は縦長のものや正方形に近いものも多い。
英語の banner は旗の種類で、本来は正方形の紋章旗だが、広く横断幕や幟(のぼり)などの意味に広がり、帯状の広告画像が宣伝用の垂れ幕を連想させることからこの名がついたとされ、英語では本来のバナーと区別するためにウェブバナーと呼ばれる事もある。
 
とのことです。

 

参考のバナーを見つける

まずは、参考にするバナーを見つけることからはじめました。
「バナーデザイン」などと検索するとデザイン集やまとめサイトが見つかります。
そのサイトから検索し、参考にしたいバナーを探し出します。

 

バナートをレースしてみる

参考のバナーをそっくりトレースします。
プロはどのように写真や文字を配置するのか、それらにどのようなスタイルを施すのかを学ぶことが大切なようです。
アレンジしても良かったのですが、まずはそのままトレースすることにしました。
ところが、同じような写真が見つかりません。
カラーや被写体の大きさなどが違うので、雰囲気がかわってしまいそうです。
ただ、ここで時間をとられすぎるのもよくないかと思い、思い切って内容のイメージだけが合う写真を選び、他はなるべくそのま ま写してみることにしました。

 

制作したバナー

バナー1

参考バナーには、人物2人の写真が使われていました。
QUOカードプレゼントもありませんでしたが、ほどよい人物2人の写真が見つからなかったため、写真の下部が空いてしまいました 。QUOカードをプレゼントしてしまいましょう。
 

バナー2

参考のバナーは30代向けで、ピンク色が華やかなバナーでした。
やはりこちらでも、ピンクな感じの女性のバストアップ写真が見つからず、落ち着いた雰囲気の色や女性になってしまいましたので、40代向けとしました。
年齢以外の文言は同じですが、カラーを変更しました。

 

バナートレースをしてみて

わたしの場合、特に注意が必要なのが、サイズのズレです。
せっかくガイドをひいたのに、拡大してみると微妙にずれています。
老眼のせいばかりではなく、おおざっぱな性質がわざわいしていることは間違いありません。
 
教えていただきました。学校の先生にも。
「1ピクセル!」
そう、1ピクセルたりともずれてはいけないのです。
心には染みていますが、未だ身体には染み込んでいないもよう。
 
この作業全体に、なかなか思うように手と頭が働かず、時間がかかりました。
バナーは単価が低いことが多いそうですので、あまり時間をかけて作るものではないとのことです。
トレースするだけでもこのありさまですので、実際一から制作するとなると、いったいどのぐらい時間がかかるでしょうか。
クライアントからのご要望で修正などもでてくるでしょうし、それらを含めて時間配分する必要がありそうです。
大変です。
 
プロには、当然ながらテクニックがあるので、テクニックの引き出しをたくさん作ることが大切なのだと教えていただきました。
それがひいては、制作時間を短縮し、正確なタッチへとつながっていくのだと感じます。
 
とにかく引き出し作りの練習あるのみ!
がんばります。

-未分類

執筆者:


comment

関連記事

人物写真をデッサン風に加工する方法

こんにちは。MIYAです。 実習15日目。今週もWebサイトのパーツをゴリゴリ作成しております。 今回は、Photoshopを使って人物写真をデッサン風にアレンジする方法をご紹介します。 ちなみに、も …

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

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

Illustratorで金メダル

こんにちは、北野です。 実習10目です。 パーツを作り続けています。 今回はIllustratorで金メダルを作ってみました。 この方法が正しいのかは、まだ分かりません。 でも、見た目は金メダルに見え …

読み手に伝わるブログの書き方

こんにちは。MIYAです。 インターン2日目の今日は、ブログの書き方についてご紹介したいと思います。 今回は、インターンブログを書く初日にふたっぱの方に教えていただいたこと、自分自身が勉強したこと等を …

Photoshopで水滴

こんにちは、北野です。 実習11日目です。 暑い季節になってきました。 梅雨入りしてから雨がふっていません。 今日は、Photoshopで水滴を作ってみました。 かなり難しかったです。できたのは奇跡と …