スポンサー


    ウェブデザイン基礎講座

    フォトショップ講座

    HTML&CSS講座

    グラフィック講座

    Flash講座

    3D講座

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

    サイトメンテナンス講座

    サイト紹介

    スペシャルリンク

サイト内検索

 メールマガジン

テクニック

Homeフォトショップ講座 > バトルフィールド3のカバーアートに触発されて、レーザービームをPhotoshopで作る

バトルフィールド3のカバーアートに触発されて、レーザービームをPhotoshopで作る

投稿日:2014年5月2日   ソフトウェア:Photoshop

このチュートリアルでは、レーザービームを作る方法について紹介します。

Step1:はじめに

このチュートリアルでは、Photoshopを使って、メタルテキスチャや雲の効果を使った抽象的なテキスト効果の作り方を解説していきます。
初心者向けのチュートリアルとなっていて、各ステップも簡単に追っていけると思いますので、ぜひ挑戦してみてください。

このチュートリアルは、バトルフィールド3というゲームのカバーアートに触発されています。
レーザービームを表現するために、主にブラシのオプションやフィルター効果を使用しています。

かっこいいデザインのステッカーはプレゼントのラベルとしても使えます。



Step2:光の破片を作成

新しいファイルを作成します。
大きさは何でも構いません。
背景は黒にしておきます。
まずはブラシを作っていきましょう。
デフォルトのブラシセットから、柔らかい45ピクセルのブラシを選択します。

光の破片を作成

F5キーを押すと、ブラシウィンドウが立ち上がるので、次のように設定していきます。

シェイプ

光の破片を作成

分散

光の破片を作成

その他

光の破片を作成

そして、必ず「滑らかさ」にチェックを入れてください。

ブラシを保存し、新しいレイヤーを作ります。
ためしにそのレイヤー上でブラシを使ってみましょう。
次のような効果が得られるはずです。

光の破片を作成





Step3:レーザービームを作成

次にこのブラシをレーザービームに変えていきましょう。
「フィルタ > ぼかし > ぼかし(移動)」と進み、新しいレイヤーに描いた点に対して、ぼかしを適用します。

レーザービームを作成

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

レーザービームを作成

次に、Ctrl+Fを押して、ぼかしを2回適用します。

レーザービームを作成

自由変形ツールを用いて、少し縮小します。

レーザービームを作成

レーザービームを5回複製し、レイヤーを結合します。
すると、次のようになります。

レーザービームを作成

この結合したレイヤーを何回か複製し、回転したり適当に配置して、下のようにします。

レーザービームを作成

それぞれのレーザービームレイヤーで、ソフトな消しゴムツール(50%の流量と不透明度と設定します)を使って部分的に消していきます。
これで、空中を進んでいくように見えます。

レーザービームを作成



Step4:光の効果を追加

続いて、光の効果を追加していきます。
ソフトな白いブラシを使って、下のように3か所に点を描きます。

ヒント
画像に深みを加えたい場合は、3つの異なる大きさのブラシを使って、一番小さいブラシの不透明度を一番高くし、一番大きいブラシの不透明を一番低くします。

光の効果を追加

次に、小さな光を作っていきます。
新しいレイヤーを作り、ソフトなブラシを使って白い小さな点を描き、ワープツールを使って次のように変形します。

光の効果を追加

ワープを適用したあとは、次のようになります。

光の効果を追加

このレイヤーを何回か複製し、中央の光のまわりに配置します。

光の効果を追加



Step5:ぼかし効果を追加

次は、レーザーにぼかし効果を加えていきます。
[Step3:レーザービームを作成]を繰り返すだけで完成です(ただし、ぼかしフィルタを2回適用するためのCtrl+Fは不要です)。

ぼかし効果を追加

ぼかし効果を追加

ぼかしフィルタのレイヤーを何回か複製して、レーザービームに貼り付けていきます。

ヒント
画像に深みを加えたい場合は、複製したレイヤーの不透明度を調整します。

ぼかし効果を追加

新しいレイヤーを作り、[Step2:光の破片を作成]で作ったブラシを使ってレーザービームの周りに光を追加していきます。

ぼかし効果を追加



Step6:効果をさらに追加

さぁ、終わりが見えてきました。
効果をさらに追加するため、レーザービームにハードな1pxのブラシを使って光を追加していきます。

効果をさらに追加

また、ソフトな白いブラシを使って、柔らかい光を描きます。

効果をさらに追加

また、ソフトな白いブラシを使って、中央に点状の光を追加します。

効果をさらに追加

お好みで、雲のかかった地表のテクスチャや割れ目の入ったテクスチャをダウンロードして追加することもできます。
もし割れ目の入ったテクスチャからこの地面を作る方法が知りたい場合は、下のコメント欄で私に知らせてください。

効果をさらに追加



Step7:最終仕上げ

最後のステップです。
画像を統合し、背景レイヤーを複製し、複製したレイヤーに次のように「ノイズを軽減」フィルタを適用します。
これで画像が少しシャープになります。

完成

次に見た目がさらによくなるように、画像に色の効果を加えます。
次の2つの調整レイヤーを使って、金色や炎のカラースキームを追加します。

特定色域の選択

完成

完成

完成

カラーバランス

完成

完成

完成



Step8:完成

これが最終版です。

完成

これでチュートリアルはおしまいです。
楽しんでもらえましたか?
何か役立てれば幸いです。
では次回までごきげんよう!



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



スポンサードリンク

コメント

ランダム記事5件

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