デザニキ
こんにちは、Webデザイナーのsaku(@sakublog)です。
熱いものを視覚的に表現するときに便利なのが湯気。
例えば温泉や熱い料理の画像に湯気がついていると、「それっぽい！」ってなりますよね。
僕は主にWeb広告のデザイナーをしているのですが、仕事でもこういう案件のバナーを作る機会は多いです。
というわけで今日はPhotoshopで簡単に湯気を表現する方法をご紹介します。
湯気の作り方
背景のイラストを用意
まずは背景に使うイラストを用意しましょう。
今回は「イラストAC」から温泉のイラストをダウンロードしました。
イラストACは登録するだけでクオリティの高いイラスト素材をダウンロードできる便利なサイト。
月額登録すればダウンロードし放題になるのでとってもおすすめ！
さらに姉妹サイトの「写真AC」や「シルエットAC」
の素材も使えるので、デザイナーやこれからデザイナーになりたい人はぜひ登録しましょう！
saku
今回はこちらの温泉イラストを用意しました。
湯気を作る手順
それでは早速湯気を作っていきましょう！
まずは新規作成から600×500サイズのカンバスを作成します。
描画色を黒、背景色を白にしておきましょう。
実際に湯気になる新規レイヤーを作成します。
作成した湯気レイヤーの描画もードをスクリーンに変更します。
湯気レイヤーを選択した状態で、フィルターから雲模様1を選択
湯気ができました！
湯気を作る手順はこれだけ！
簡単に作れちゃいましたね。
湯気がない画像と湯気がある画像を見比べてみると全然違いますね！
おまけ：ひと手間加えてよりリアルに！
このままでももちろんいいのですが、さらにひと手間加えることでよりリアルになります。
湯気は水面から少し離れた場所から出ます。
というわけで、水面近くの湯気を消してみましょう！
ブラシの設定は、色が黒・硬さ0%・不透明度60%です。
マスクを選択し、ブラシで水面近くの湯気を塗っていきます。
水面近くの湯気が消え、よりリアルになりました！
先ほどのものでも充分雰囲気が出ましたが、メリハリがついてよりリアルな温泉に近づきましたね！
まとめ
いかがでしたでしょうか？
ちょっとしたひと手間を加えるだけで、デザインのクオリティは一気に上がるものです。
例えば、料理の画像に湯気がつくと「おいしそう！」ってなりますよね笑
ちなみに、これをシズル感と呼びます。
参考 シズル感はてなキーワード
とっても簡単なので、ぜひ試してみてください。
saku(@sakublog)でした。
