クリックしてもらえるバナーの作り方実践編3前半

このエントリーをはてなブックマークに追加

今日は、画像(写真)の選び方と加工を説明したいと思います! バナーに使う画像は、内容によって自分で撮影する場合、撮影を依頼する場合、すでにある素材から選ぶ場合がありますね。 今回は、フリーの写真素材集からお借りしています。 写真素材 足成 こちらは、商用利用可で、たくさんの写真を扱っておられます。 素材集買う金がなーい!というときにどうぞ! では、フォトショップを立ち上げて写真を選び加工します。

バナーの写真選びについて

今回は大量の肉をドーン!と安売りを強調したいので、美しさよりもドドーン感がある、つまり肉アップの写真を選びました。 写真選びも、バナーの目的によって変わりますが、綺麗な方がいいにきまっています。特に食べ物系は美味しそうに見える方がいいですね。 ただ、体に身につけるもの(服とか靴)は、実物とかけはなれて美しいとクレームの対象になってしまうことがあります。商品によってはそういったことも気をつける必要があります。

画像の不要な部分を削除する

フォトショップでダウンロードした画像を開きます。 私はフォトショップCS5を使っていますが、どのバージョンでも使えるツールのみ使っていきますね。 エレメントの場合は使えない機能があるかもしれません。ごめんなさい。 開いたら、元の画像を複製しておきましょう。 複製の仕方は色々ありますが、下図は【レイヤーの「背景」を選択して右クリック→「レイヤーを複製」を選択】という方法で複製しています。 元画像を複製する 時々、「切り抜きしたんだけど背景が透明にならないんです」と質問されるのですが、これは「背景」レイヤーとなってしまっている元画像を切り抜いてしまったから、ということが多いです。 失敗した時のためも考えて、このように複製しておくとよいでしょう。 「背景」レイヤーの元画像は非表示にしておきます。 さて、ここからバナーに不要な部分を消して必要な部分だけ残す作業に入ります。 やり方としては 1)消しゴムで地道に消す 2)自動選択ツールで消す範囲を選択して消す 3)ペンツールを使う  画像の切り抜き方 方法は他にも色々ありますが、写真によってやりやすい方法、やりにく方法があります。 今回は、3)ペンツールを使っています。 ペンツールは慣れるまで少し時間がかかりますが、マスターするととても便利です。 ここでは説明を省きます!すみません。フォトショップの参考書にはペンツールの使い方がのっていますので、1冊入門書を購入して練習するといいかと思います。 また後日、ペンツールの使い方だけの記事を書くかもしれません。 切り抜き完了 さて、ここから色の調整について説明したいところなのですが、記事が長くなったので分割します。 では実践編3後半でお会いしましょう~。
このエントリーをはてなブックマークに追加

コメント

コメントはまだありません。

コメントの投稿

トラックバック: http://miraiyanet.com/day/blog/2011/03/04/bnr/trackback/

ホームページ制作&運用講座

ページトップへ