ウェブデザイン基礎講座

    フォトショップ講座

    HTML&CSS講座

    グラフィック講座

    Flash講座

    3D講座

    ウェブプログラミング講座

    サイトメンテナンス講座

    サイト紹介

    スペシャルリンク

サイト内検索

 メールマガジン

テンプレートモンスター
ホームページテンプレート

Free Templates Online JP
無料ホームページテンプレート
Free Templates Online JP

株式会社ネットオン
採用Webマーケティング
indeed広告代理店

海外 SEO対策 トラッキングツール
海外 SEO対策
ランキングチェックツール

Rank Tracker

テクニック

Homeフォトショップ講座 > Photoshopで金色のボタンを作る方法

Photoshopで金色のボタンを作る方法

投稿日:2009年08月21日   レベル:初心者    ソフトウェア:PhotoShop

このチュートリアルでは、Photoshopで金色のボタンを作ってみたいと思います。

Step1:はじめに

まず最初に、新しいファイルを作ることから始めましょう。
「ファイル」メニューに行き、「新規」を選択し、72dpiで透明な背景の300×100ピクセルを選びます。


Step2:長方形を描く

レイヤーの名前を「背景」にし、適当な色で塗りつぶして下さい。

次に、角丸長方形ツール(シェイプレイヤー)角丸長方形ツールを選択し、適当な色で130×30ピクセルの長方形を描いて下さい。

長方形を描く

次に、そのレイヤーを右クリックし「レイヤーをラスタライズ」して、レイヤーの名前を「メイン」にして下さい。



Step3:レイヤースタイルを加える

さて、シェイプに色とレイヤースタイルを加えましょう。
「レイヤー」−「レイヤースタイル」−「グラデーションオーバーレイ」を選択し(またはレイヤーパレットの「メイン」をダブルクリックして)、次の設定を適用して下さい。

ドロップシャドウを設定する

シャドウ(内側)を設定する

グラデーションオーバーレイを設定する

グラデーションを設定する

境界線を設定する

このようになったはずです。
文字と少しの輝きを加えたら、完成です。

結果



Step4:輝きを入れる

「Ctrl」+「Shift」+「n」キーを押して「メイン」レイヤーの上に新しいレイヤーを作成し、その名前を「輝き」にします。
ツールボックスから長方形選択ツール長方形選択ツールを選択し、長方形を描いて、白で塗りつぶして下さい。
「選択範囲」メニューに行き、「Ctrl」+「d」キーを押して「選択を解除」して下さい。

白い長方形を描く

「Ctrl」キーを押したまま、「メイン」レイヤーのサムネイルをクリックしてください。
こうすることによって、ボタンの形を選択します。
「選択範囲」メニューに行き、「Ctrl」+「Shift」+「i」を押して「選択範囲を反転」し、「輝き」レイヤーを選択してから、「Delete」を押して下さい。

選択範囲を削除する

「輝き」レイヤーの不透明度を20%にして下さい。



Step5:完成

ツールボックスから横書き文字ツールを選択してください。
色は#6c4b08にし、文字を入力して下さい。
フォントはItcErasの斜体、サイズは14ピクセル、アンチエイリアスの種類をシャープに設定しました。

これで完成です。

完成


引用:Web Design Library 著者:psdsession.com 翻訳:日下部



スポンサードリンク

コメント

ランダム記事5件

2016年5月の人気記事ランキング