スポンサー


    ウェブデザイン基礎講座

    フォトショップ講座

    HTML&CSS講座

    グラフィック講座

    Flash講座

    3D講座

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

    サイトメンテナンス講座

    サイト紹介

    スペシャルリンク

サイト内検索

 メールマガジン

テクニック

Homeフォトショップ講座 > ワイヤーフレーム効果を3D描画する

ワイヤーフレーム効果を3D描画する

投稿日:2007年10月16日   レベル:初心者    ソフトウェア:PhotoShop


Step1:ファイルを開く
下の絵のように作るのが今日の目標です。

完成目標

まず、下のイメージをPhotoshopで開きます。

Photoshopを開く

Step2:レイヤー複製
レイヤーの名前を「レイヤー1」に変更します(私のチュートリアルではこのようにするのが一番簡単でしょう)。

レイヤーを複製し(「Ctrl」+「J」を押す)、複製したレイヤーの名前を「レイヤー2」に変更します。

続いて「イメージ」−「色調補正」−「彩度を下げる(あるいは「Shift」+「Ctrl」+「U」を押す)」を選択すると次のようになります。

レイヤー複製

Step3:色調補正
「レイヤー2」を複製して(「Ctrl」+「J」を押す)、「イメージ」−「色調補正」−「階調の反転(あるいは「Ctrl」+「I」を押す)」を選択します。

複製したレイヤーの名前を「レイヤー3」に変更してください。

するとこうなります。

色調補正

それから合成モードを覆い焼きカラーに変更します。

覆い焼きカラー

Step4:ぼかし(ガウス)
「フィルタ」−「ぼかし」−「ぼかし(ガウス)」を選択します。

以下の設定を使用します。

ぼかしガウス

「OK」をクリックすると次のようになります。

ぼかしガウス設定後

Step5:マスクの追加
「レイヤー1」をレイヤーパレットの一番上にドラッグします。

レイヤー1を上に

「レイヤー1」を選択したまま「レイヤーマスクを追加」ボタンを押します

マスクの追加

それからグラデーションツールを選択します。

以下の設定を使用します。

グラデーションツール1

続いて細い線をキャンバス上に引きます(青い矢印のサイズに合わせてください)。

するとこうなります。

こうなります

Step6:ワイヤーフレームを整える
これからブラシツールを使います(小さい丸)。

前面の色を白くします。

「レイヤー2」を選択します。

ドキュメントを400%か500%までズームします。

ブラシツールを使ってイメージのドローイングを始めます。

ワイヤーフレームを整える

Step7:完成
ほんの3-4分ブラシを使うと最後にはこのようになります。

完成目標

いい感じになったでしょ?

引用:Web Design Library 著者:amitk翻訳:菊池



スポンサードリンク

コメント

ランダム記事5件

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