WEB2.0風のアイコンに光沢を加える
Photoshop
比較的簡単にWEB2.0アイコンを作成する方法。慣れれば2分程度で作成することが可能です。
この方法を用いると、上記のアイコンは5分で作成できます。
WEB2.0アイコンって？
簡単に言うと、ツヤツヤとした感じのアイコンのことです。例を挙げれば、Windows XPと、Windows Vistaのロゴで、Vista側がWEB2.0アイコンと呼べるでしょう。
アイコンが2.0っておかしくない？
まさしくWEB2.0とはサービス提供の仕方や新しいWEBのあり方を総称するものですので、筆者も戸惑いを感じました。
しかし最近はWEB2.0アイコンというと、「ツヤツヤとした感じのアイコンね」と認知されてきているようなので、当サイトでも「WEB2.0アイコン」と呼ぶことにしました。
オススメサイト
- 飛鳥スタジオグラフィックス
- プロが教えるデジタルカメラの撮影＆レタッチテクニック。
- 配色のコツ
- 色彩調和・配色技法を詳しく掲載。
- 色彩の知識
- 純色、清色、中間色、ヒュー・トーン・システム、補色など。
フォトショップ講座
WEB2.0風のアイコンを作成するのステップでアイコンが作成されていることを前提とします。
STEP 1.
「自動選択ツール」をクリック。
STEP 2.
オブジェクトの周りを選択する。
STEP 3.
メニューの「選択範囲」から「選択範囲を反転」。
STEP 4.
メニューの「選択範囲」→「選択範囲を変更」→「縮小」をクリック。
STEP 5.
「縮小量」を調整して「OK」をクリック。
STEP 6.
「新規レイヤーを作成」。
STEP 7.
「クイックマスクモードで編集」を選択。
STEP 8.
「長方形選択ツール」をクリック。
STEP 9.
オブジェクトの下方、3/5 程度を長方形で囲む。
STEP 10.
「塗りつぶしツール」を選択。
STEP 11.
選択範囲を塗りつぶす。
STEP 12.
「画像描画モードで編集」をクリック。
STEP 13.
「グラデーションツール」を選択。
STEP 14.
グラデーションバーをクリック。
STEP 15.
「描画色から透明に」のプリセットを選択。
STEP 16.
選択範囲内にグラデーションを描く。
STEP 17.
「長方形選択ツール」をクリック。
STEP 18.
選択範囲の上で右クリック「選択範囲を変形」。
STEP 19.
選択範囲を180°回転させる。
STEP 20.
「グラデーションツール」を選択。
STEP 21.
グラデーションのタイプを「逆方向」にする。
STEP 22.
選択範囲内にグラデーションを描く。
STEP 23.
メニュー「選択範囲」→「選択を解除」。
STEP 24.
グラデーションレイヤーの不透明度を50%前後に設定。
STEP 25.
完成。