スポンサー


    ウェブデザイン基礎講座

    フォトショップ講座

    HTML&CSS講座

    グラフィック講座

    Flash講座

    3D講座

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

    サイトメンテナンス講座

    サイト紹介

    スペシャルリンク

サイト内検索

 メールマガジン

テクニック

Home ＞ フォトショップ講座 ＞ Photoshopでいつもと違うナビゲーションバーを作る方法

Photoshopでいつもと違うナビゲーションバーを作る方法

投稿日：2010年09月14日　　　レベル：初級者　　　　ソフトウェア：PhotoShop

このチュートリアルでは、いつもと違うナビゲーションバーを作る方法を紹介します。

Step1：箱をつくる

900px×300pxの大きさで解像度を72ppiとして新しいドキュメントを開きます。

ドキュメントを開く

50pxと850pxのところに縦のガイドをひきます。
50pxと250pxのところに横のガイドをひきます。
ガイドの間に、丸ふちの長方形を描きます。

丸ふちの長方形を描く

Ctrl+Enterで、それを選択範囲に変え、0090bfの色で塗りつぶします。

青色に塗りつぶす



Step2：ワープで歪ませる

Ctrl+Tを押して右クリックし、「ワープ」を選びます。

ワープ

「でこぼこ」オプションを選び、「カーブ」に-10と入力します。

でこぼこ

カーブ

すると次のようになります。

カーブした箱





Step3：下半分を使う

下半分だけが見えるように画像を上に移動させます。

下半分を使う



Step4：境界線をつけ、文字をかく

境界線を白の3pxの幅にします。
レイヤースタイルの中で境界線の使用できる中央オプションを選択します。

境界線

ナビゲーションバーの中にリンクを書くと、次のようになります。

リンク



Step5：完成

完成です。
あなたの創造力次第で効果を付け加えて、よりよいものを作ることができます。

完成1

このようなものも出来ます。

完成2



引用: Web Design Library　著者: animhut　翻訳：なかけん



スポンサードリンク

コメント

ランダム記事5件

2012年4月の人気記事ランキング