DesignTips > デザインパーツ > Photoshopで光のラインを作る方法

Photoshopで光のラインを作る方法

Photoshopで光のラインを作る方法

Photoshopで光のラインを作りたいと思います。

基本的なシンプルな光のラインです。今回はPhotoshopで一本の線から緩やかなカーブをした光るラインの作り方をご紹介します。レイヤーを重ね2種類のスタイルを使うことで、発光の仕方を工夫しています。

ロゴ合わせたり、背景に使えそうですね。

Step01 レイヤーを黒く塗りつぶす

レイヤーを黒く塗りつぶす

Photoshopを開き、レイヤーを[#000000]で塗りつぶします。

Step02 光のラインを描くブラシの設定

光のラインを描くブラシの設定

Photoshopで光のラインを描くブラシを設定します。

[ソフト円ブラシ30px→10px]、[間隔:25]、[滑らかさ]。

Step03 中心に直線を引く

光の原型を描く

Photoshopで新規レイヤーを作成します。

Step02で設定したブラシで真ん中に直線(Shift+ドラッグ)を引きます。これが光のラインの原型になります。

Step04 シアーを使って光のラインを変形

シアーを使って光のラインを変形

[フィルター→変形→シアー]で光のラインを変形します。

ダイアログボックスの縦線をクリックし、ゆっくり左右に調整します。

シアーを使って変形させた状態

シアーを使って変形させた状態

フィルターのシアーを使った事で、光の直線が滑らかなカーブのラインができました。

Step05 ぼかしフィルターを使って光のラインをぼかす

ぼかしフィルターを使って光のラインをぼかす

Steo04で作ったラインのレイヤーをコピーし、非表示にします。(Step07で使用する)

コピー元のレイヤーを使い[フィルター→ぼかし→ぼかし(ガウス)]で光のラインをぼかします。

参考記事:Photoshopのぼかし(ガウス)を使った背景のぼかし

ぼかし(ガウス)でぼかした状態

ぼかし(ガウス)でぼかした状態

はっきりしていたラインがうっすら見えるような状態になりました。

Step06 スタイルの光彩(内側)でラインに光を加える

スタイルの光彩(内側)でラインに光りを加える

ぼかしたレイヤーに[光彩(内側)]を設定。

スタイルの光彩(内側)を追加した状態

スタイルの光彩(内側)を追加した状態

カーブした部分がかすかに明るくなりました。

Step07 コピーした光のラインをスタイルで色を変える

コピーしたラインをスタイルで色を変える

Step04でコピーしたレイヤーを表示し、[光彩(内側)]をStep06と同じ設定にします。

そのまま、カラーオーバーレイを設定し光のラインの色を明るく変えます。まだ、OKはしないでください。

Step08 スタイルの光彩(外側)で発光させる

スタイルの光彩(外側)で発光させる

続いて、光彩(外側)を設定し、ラインが発光しているように見せます。あとはOKで完了です。

これで、2つのラインのレイヤーが重なると、青白くきれいに発光しているようにみえます。

完成

Photoshopで光のラインを作る方法 完成

光のラインの完成です。

見た目は難しそうに思えるラインですが、フィルターのシアーを使えば簡単に作れます。

カーブのつけ方、光り方も設定の仕方で変わってきます。Photoshopではシアー、スタイルとも使うイメージに合わせて調整する事ができるので、豊富に作る事ができますね。

関連記事:スピード感のある背景イメージの作り方(Photoshop)

Photoshopで作る凹凸ロゴとテクスチャ
Photoshopでナチュラルなwebボタンを作る方法
ザラついた質感の背景の作り方(Photoshop)
Photoshopで星雲と細かい星の作り方
スピード感のある背景イメージの作り方(Photoshop)
Photoshopで水滴のイラストをリアルに作る
黒板のイラストの作り方(Photoshop)
ヴィンテージカメラファインダーの作り方 (Photoshop)
草木の素材を円形に変形してフレームを作る方法(Photoshop CS6)