Photoshopの色調レイヤーを実践

2022-03-11

こんにちは、ソラです!

山田秀平さんのWEBデザインスクール「DLL」のワークブックでPhotoshopの機能を学んでいます。

今回は、ワークブックで学んだ色調レイヤーの実践についてまとめていきます。

色調レイヤーとは?

2つの画像を合成した時に色調がバラバラだと不自然な画像になります。

合成した画像の色調を調整するためのレイヤーが色調レイヤーです。

さっそく実践してみますね!

色調の違う画像の合成方法

色調を調整するだけでなく、画像を合成するところからやっていきます!

手順1 合成用の画像を用意する

ワークブックでは既に画像が用意してあるのですが、公開NGのものなので私が選んだ画像でやっていきますね。

背景はこの夕焼けの画像にしましょう。

そこに人の画像を合成したい…

画像サイトからDLした画像がこちらです。

手順2 画像を合成する

男性の写真の男性部分だけマスクを切ります。

クイック選択ツールでまぁまぁ簡単にできました!

切り抜きできるとデザインしてる感あっていいですね〜😍

そして背景に夕焼けの画像を重ねるだけです。

画像を重ねただけだと、色味が違うのでかなり違和感がありますね。

手順3 男性だけの色調を調整する

この男性、全然夕陽に照らされていない!

なので、夕陽に照らされた感じ男性のレイヤーだけに効果をかけていきます。

色調補正のタブから「色相・彩度」を選ぶと色味を変更できます。

彩度をいじると…

男性が赤くなりました🍎

特に肌の色が変わったのがわかりやすいですね。

手順4 明るさとコントラストを調整する

明るさやコントラストの調整のことを「トーンカーブ」というようです。

この言葉、知らなかった!

聞き慣れない言葉ですが、画像の編集ではよく使うようです。

色味を変えたらトーンカーブで明るさとコントラストを調整していきましょう。

大きな変化はありませんが、少し暗くしました。

これはかなり夕陽に照らされてる感あるのでは!?

手順6 複製レイヤーを乗算にする

複製レイヤーを乗算にするには、レイヤーパネルの上の方にある窓で「乗算」を選択するらしいです…

乗算!?

早速ググりました…

乗算は「レイヤーの色と下にあるレイヤーの色を掛け合わせた色を合成する機能」らしいです。

重ねたレイヤー同士が馴染むってことみたいですね。

細かくてわかりづらいですが、画像の赤枠部分です。

乗算レイヤーの不透明度を調整し、背景と馴染むように調整します。

完成した合成写真です。

色調調整の前よりずっと自然です😊

今回の感想

今回の感想をまとめていきます。

合成はすっごく楽しい!!

ブログではサラッと書いていますが、まず切り抜きからしているのでちょっと手間はかかります。

でも完成した時にわかりやすく「すごーい!」と思えるので頑張れますね。

案外簡単だった!!

手順は多いように見えますが、簡単に言うと

  • 切り抜き
  • 合成
  • 色味の調整

3ステップです。

最初は色調の調整がどういうことかわかりませんでしたが、ワークブックで指導された通りにやってみると意味がよくわかります。

細かくやり方が解説されているので、私のようなデザインの素人が取り組んでもうまくいきました😊

実際に使えそう!!

バナーやLPでも画像を組み合わせることはありそうなので、自分で作る時に色味を揃えられるよう覚えておこうと思います。

実践でバリバリ使うぞ〜😄

ワークブックは面倒くさい、と思ってたのですがちゃんとやっていくと楽しいですね✨