2012年4月15日日曜日

誰でも何時でもできるWebバーナ製作の優れた勉強方法

Webのバーナ製作って、奥深いですよね。技術向上はマネすることが近道です。
早速まねしてみましょう。


参考にしたバーナ
真似をして作ったバーナ


並べてみると「今が買い時の方」を、もう少し大きく、マンションの背景にメリハリを付けて、斜めの斜線に★のアクセントを、入れたらもっと良かったなーと思いつつ。文字にグラデーションも入れるべきだった。。。

でもマネをすると、プロレベルに近づけた気がします。違いを的確に理解することが、第一歩です。お勧めの勉強方法です。製作はこのように行いましたよ。

拡大してマネしてみると、ピクセル単位でいろいろな工夫がされていることがわかります。


イラストレータで斜め線を作ってフォトショに貼り付けました。

グラデーションで白を上から掛けました。

参考バナーに上下に1ピクセルの青いアクセントがあります。

細いラインでも、入れると締まりますね。

背景の線に沿って、青いタブを作りました。

文字を入れました。参考バナーをよく見ると、微妙に白く光っています。

光彩で、白い文字を光らせました。新着でピカ感がでました。

マンションの影を作りました。背景の線に合わせています。白いフチもとってます。

下地ができました。

細かい作りこみが、重要なんですね。

テキストを入れました。ポイントを大きく、色を変えるんですね。

白い縁取りをしました。

さらに微妙にドロップシャドウをかけます。1ピクセルでも印象が大きく変わります。

字がさらにはっきりしました。完成!

・広告バーナがたくさんある参考サイト
http://aka-design.sub.jp/bd/
http://banner.keizine.net/
http://www.banner-design-gallery.com/

Start typing and press Enter to search