今日はPhotoshopを使用したメニューボタンの作り方をご紹介です。

まず横のガイド線を1本入れます。
その後新規レイヤーを1枚作成し、ガイドに重なる位置に[長方形選択ツール]で
適当な大きさ範囲選択を作りお好きな色で塗りつぶしをかけます。 

[選択範囲]メニュー→[選択範囲を変更]→[滑らかに]で3pxかけた後
Shift+Ctrl+Iキーで範囲選択を反転し、Deleteキーで背面を削除します。
角が取れた丸みのある四角が出来ます。 

範囲選択を解除後、レイヤースタイルを設定します。
1.ドロップシャドウ
[描画モード]乗算、[不透明度]75%、[サイズ]5px
 

2.光彩（内側）
[描画モード]スクリーン、[カラー]白、[サイズ]50px
 

3.グラデーションオーバーレイ
[描画モード]通常、[不透明度]100%、[角度]90度
 

グラデーションエディタ
開始点　#999999、終了点　#FFFFFF
 

4.境界線
[サイズ]1px、[位置]外側、[カラー]白
 

下記のようになります。
 
続けて[レイヤー]→[レイヤーを複製]を選択して作りたいボタンの数だけ
レイヤーを複製し、最初に作った画像の隣に並べます。
 

ボタンの一番下をカットしますので、次のように選択範囲を作ってください。
それから「Delete」キーを押してボタンの下を削除します。
 

最後に、[横書き文字ツール]を使ってテキストを追加して完成です。
 
地味ですが白基調が多い企業系サイトにあうかもしれませんね♪

デザイナー／INOUE