Home > WEB, webサイト, デザイン, デジタルばなし > Photoshop ウェブサイトのボタンは5秒で作成

Photoshop ウェブサイトのボタンは5秒で作成

ウェブサイトをデザインしていると、ボタンのデザインで結構こだわって悩む時があります。あれやこれやグラデーションかけてみたり、枠の線を入れてみたり割と時間かかるんですよね、納得いくまで。

そんな制作者の大切な時間をPhotoshopには短縮してくれる機能があります。

まず、Googleなどの検索で「Photoshop レイヤースタイル」のワードで検索します。

そうすると、たくさんのPhotoshop用レイヤースタイルを無料で配布しているサイトが表示されます。

例えばこういったサイト http://www.dezinerfolio.com/2008/11/19/220-amazing-free-photoshop-layer-styles からレイヤースタイルのファイルをダウンロードします。

ダウンロードしたファイルは.aslファイルです。

フォトショップを立ち上げて、「ウィンドウ」→「スタイル」からスタイルのウィンドウを開きます。

スタイルのウィンドウ右上にクリックできるところがあるので、そこから「スタイルを読み込み…」をクリックして先ほどダウンロードした.aslファイルを読み込みます。

読み込むと上の画像のようにカラフルなアイコンが増えます。

フォトショップのシェイプツールで例えば角丸矩形を描いて、先ほど読み込んだスタイルの中から好みのものを選んでクリックすると一発でボタンが出来上がります。それこそキャンディーのようになめたくなるようなボタンも1クリックで出来上がります。(下の画像の①〜④の操作)

もちろんレイヤースタイルはレイヤーに対してかける効果なので、オブジェクトだけでなくテキストへもかけることができます。

関連する投稿

WEB, webサイト, デザイン, デジタルばなし , , , , ,