スポンサー


    ウェブデザイン基礎講座

    フォトショップ講座

    HTML&CSS講座

    グラフィック講座

    Flash講座

    3D講座

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

    サイトメンテナンス講座

    サイト紹介

    スペシャルリンク

サイト内検索

 メールマガジン

テクニック

Homeフォトショップ講座 > Photoshopを使ってメトロポリスをデザインする方法

Photoshopを使ってメトロポリスをデザインする方法

投稿日:2012年9月7日   レベル:初心者    ソフトウェア:Photoshop

このチュートリアルでは、メトロポリスをデザインする方法を紹介します。

Step1:はじめに

この高層ビルはcgtextures.comから入手したシンプルなタイルのテクスチャで構成されています。
テクスチャをダウンロードして、2400x5200pxのPhotoshopのドキュメントを開きます。

ビル画像

タイル模様



Step2:ビルの表面を作成する

次に、キャンバスをテクスチャで埋めて、高層ビルの表面を作成します。
タイル模様のように見えるのを防ぐため、テクスチャをバラバラに配置してください。
ここでは大きなブロックを作り、レイヤーを統合して複製を作成することを繰り返しています。
キャンバスが埋まったら保存して、ドキュメントを閉じてください。

タイル模様を配置





Step3:新しくファイルを開く

次に1200x1600pxのPhotoshopのファイルを開き、先ほどのテクスチャをスマートオブジェクトとして挿入してください。
遠近法の変形ツールを使って、テクスチャを高層ビルの形にします。
次に、レイヤーをコピーして、少し縮小した2つのビルを追加してください。

ビルを追加する



Step4:クリッピングマスクをかける

クリッピングマスクを使って、不透明度を低くした黒から透明へのグラデーションをそれぞれのビルに追加します。
一番遠くのビルはさらに不透明度を下げます。

ビルにグラデーションを追加



Step5:グラデーションをかける

それぞれのビルの遠い方の端に白から透明へのグラデーションを加えて、遠くの光源を表現します。

白のグラデーション



Step6:フィルタ効果とぼかしを適用する

手前の2つのビルを複製して、複製したものにハイパスフィルタを適用し、オーバーレイに変えてください。
ハイパスレイヤーにレイヤーマスクを追加し、前方側にしか見えないようにフィルタの効果をフェードアウトさせてください。
さらに、ぼかし(ガウス)を適用して、レイヤーマスクを追加し、ぼかしを画像の上部からフェードインさせます。

フィルタ効果を適用



Step7:明るさを調整する

次に、全てのレイヤーの上に明るさ・コントラスト調整レイヤーを追加し、コントラストを+50に上げてください。
さらに色相・彩度レイヤーも追加して彩度を-80に下げます。

明るさ調整



Step8:円形グラデーションを追加する

黒から透明への円形グラデーションを追加し、オーバーレイに変えて、画像の端を暗くします。
白から透明への線形グラデーションを2つ加えて画像の上部を明るくし、1つはソフトライト、
もう1つは通常のままで不透明度を20%に設定してください。

グラデーションをかけ、画像を明るくする



Step9:青の色相を加える

次に、レンズフレアを加えて、カラーバランスレイヤーを使ってクリッピングマスクで青の色相を加えます。

青いを加える



Step10:鳥を配置する

鳥はダウンロードした無料のストックフォトを使っています。

鳥を配置



Step11:雲のレイヤーを追加する

雲のレイヤーを追加し、不透明度20%のスクリーンにセットしてください。
さらに、画像の上部にサイズの違う雲のレイヤーを4〜5枚追加して、そのうちのいくつかをスクリーン、
残りをオーバーレイにしてください。 最後に、濃い青のカラーレイヤーを追加してオーバーレイにセットします。

雲を追加



Step12:完成

完成です。

完成


引用:Web Design Library 著者:Matt 翻訳:幕澤



スポンサードリンク

コメント

ランダム記事5件

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