アイコンをデザインする方法

立体感のあるアイコンのデザイン方法

立体感のあるアイコンの作成方法をメモしておきます。Photoshopを使用し、グラデーションツールでうまく濃淡をつければ簡単にアイコンがつくれます。Photoshopをほとんど使ったことのない私でも簡単に作ることができました。

参考サイト：http://web.kyoto-inet.or.jp/people/hikeda/index.html

01,アイコンの形を作るために、角丸長方形ツールで四角形を描きます。この時、Shiftキーを押しながら書くと正方形が書けます。

02,レイヤーパレットでこのシェイプをCtrlキーを押しながらクリック。こうするとシェイプの形をした選択範囲ができます。

03,選択範囲メニュー→選択範囲を保存→名前をつけて新しい選択範囲を保存します。

04,新規のレイヤーを追加し、グラデーションツールの反射形グラデーションを選択。グラデーションの色を決めます。

05,レイヤーの中心から外に向かって、Shiftキーを押しながらドラッグ。

06,ボタンの中に入れる画像を配置して、不透明度を60％程度に下げます。画像はカスタムシェイプツールの中から選ぶと簡単です。

07,新規のレイヤーを追加し、楕円形選択ツールで上半分を囲むように選択。

08,選択範囲メニュー→選択範囲を読み込む→さきほど名前をつけて保存した選択範囲を選ぶ→現在の選択範囲との共通範囲を選ぶ。

09,グラデーションツールの線形グラデーションを選び、ツールオプションバーで描画色から透明にを選びます。

10,選択範囲外から内にを向かって、Shiftキーを押しながらドラッグ。

11,選択範囲を解除し、レイヤーの不透明度を80％程度に下げます。

関連記事

• 被写体に影をつける方法
• おしゃれなメニューのデザイン方法
• オリジナルのファビコンをデザイン
• フリーのイメージ素材
• 引用符を使ったblockquoteのデザインとCSS