フォトショップ

わずか10秒っ!Photoshopで部分的に色を変えたいときの【色の置き換え】の使い方&動画解説ダイジェスト

Photoshopで部分的に色を変えたいっ!」と思ったとき、単純な形状のものであれば変更したい場所を【選択ツール】を使って選択することで、任意のカラーに調整することができます。

しかし、選択したい色が複雑に散らばっている場合には、Sfiftを押しながらポチポチと作業しなければならなかったり(これが結構面倒くさい)、なかなか思い通りに選択することができず、頭を悩ませることがあります。

ここでは、Photoshopの【色の置き換え】を活用して、わずか10秒で服の色を変える方法を解説します

また応用編として、【服の一部分だけ色を変える方法】と【服の一部分を残してモノクロにする方法】も解説し、最後に3:32の動画ダイジェストも用意しているので参考にしてみてください。

わずか10秒で服の色を変える【色の置き換え】の使い方

 

Photoshopで画像を開き、イメージ 》色調補正 》色の置き換え をクリック。

change-color01

変化させたい色の部分をスポイトで抽出

change-color13

色を変えたくない肌の部分などは”あまり選択範囲に含まれない”ように、プレビューを見ながら許容量を調節(ちなみに肌にも服の赤色が反射されているので、バッチリと服の色だけ変えるよりも、ほんの少し選択範囲に含めたほうが自然な仕上がりになります)

change-color02

色相や彩度を調整して任意の色に変更

change-color03

このように、Photoshopの【色の置き換え】を使うことで、わずか10秒で任意の色に変えることができます

もちろん、その他の色も許容範囲を調節して色相・彩度・明度を調整しながら、さまざまな色のバリエーションを作ることができます。

woman4

【色の置き換え】を使って服の”一部分だけ”色を変える

【色の置き換え】は許容範囲の調節によって”同系の色を一気に変える”ことができるので便利ですが、逆に一部分だけ変更したい場合にはレイヤーマスクを併用しましょう。

背景の女性レイヤーは直接編集せず、右クリックして背景レイヤーを複製

change-color04

複製したレイヤーを選択している状態で、イメージ 》色調補正 》色の置き換え許容量、色相・彩度・明度を調整して任意の色に変更します

change-color05

服の色を変えたレイヤーにレイヤーマスクを追加

change-color06

ブラシ(黒)を選択して、口紅、ネイル、スカートなど色を変化させたくない部分(元々の赤い部分)を塗ると、塗った部分が透けた状態になり後ろの背景が表示されます

(レイヤーマスクを使用しなくても、服の色を変化させた前面のレイヤーを消しゴムツールで消すことで同様の効果が得られますが、レイヤーマスクに使い慣れておいたほうが応用範囲が広いと思います。)

change-color07

【色の置き換え】を使って服の”一部分を残して”モノクロにする

よくビールなどのCMで、モノクロの世界の中でビールジョッキだけが小麦色に輝き”主役を引き立てるような表現“を目にすることがありますが、このような表現をパートカラーと言います

ここでは【色の置き換え】を使って服の”赤のパートカラー”を残し、その他をモノクロにしてみましょう。

イメージ 》色調補正 》色の置き換え を選択し、残したい色(ここでは赤)以外の背景色などをスポイトで抽出したら、許容量を調節。彩度をMAXまで落としてOKをクリック

change-color08

抽出しきれなかった部分を繰り返し抽出して彩度を落としてOK

change-color09

微妙に抽出しきれなかった肌の色も、もう1度抽出して彩度を落としてOK

change-color10

最後にコントラストを調整したいので、調整レイヤーのトンカーブを追加

change-color11

画面全体を確認しながら印象を調整して完成です

change-color12

動画ダイジェスト

change-color-movie

Photoshopで服や髪、目や建物など部分的に色を変えた場合、選択ツールを使うのが一般的なようですが・・

色の置き換え】を活用することで、選択ツールを使わなくても簡単に任意の色に変更することができるので、ぜひ基本的な使い方と応用方法を身につけて、効率が求められるデザインの現場で役立ててください。

 

スリームデザインの無料メールマガジン

ピックアップ記事

  1. 思わずクリックしてしまう画像でアクセスアップ!2番目に簡単なブログのアイキャッチ…
  2. photoshopで仕事をしたい人が身につけておきたい技術や使い方のまとめ。日本…
  3. 見ているだけで「Photoshopの実践的な使い方が学べる」日本語解説付き動画の…
  4. 柔軟な思考を大切にしたいクリエイター必読の5冊。私の頭をグニャングニャンに柔らか…
  5. 「ブロガーがこんなの読んだら反則レベルでしょっ、、」と思うくらい文章力が上がりそ…

関連記事

  1. webデザイン

    photoshopで雰囲気のあるセピア調に仕上げるプロの技術。

    photoshopで写真をセピア調にするのはすごく簡単。 ⇒ phot…

  2. webデザイン

    芸能人のアメーバブログのようなヘッダーを作成・依頼する前に知っておいたほうが良いこと。

    《芸能人のブログヘッダ画像まとめ【モデル偏】【アイドル偏】》などを見る…

  3. フォトショップ

    細部にこだわってポスターデザインを仕上げるためのディティールを詰めるコツ

    ディティールを詰める技術を覚える男性の怪しさが増すような画像を重ね…

  4. webデザイン

    意外と知らないっ、、Photoshopで文字の輪郭(境界線)だけに影を付ける方法

    Photoshopで文字の輪郭(境界線)に影を付けようと思っても、「外…

Wordpress日本語テーマのまとめ
photoshop日本語チュートリアル

よく読まれている人気の記事

最近の記事

  1. 「いつも締め切りに追われてしまう」そんな人がミッションを成し…
  2. Photoshop CCのメニュー文字やツールバーが異常に小…
  3. 思わずクリックしてしまう画像でアクセスアップ!2番目に簡単な…

思考系のおもろい記事

ブログラ
  1. コピーライティング

    「ブロガーがこんなの読んだら反則レベルでしょっ、、」と思うくらい文章力が上がりそ…
  2. キュレーション

    WordPress日本語有料テーマの決定版っ!TCDシリーズのまとめ
  3. 3分の話

    柔軟な思考を大切にしたいクリエイター必読の5冊。私の頭をグニャングニャンに柔らか…
  4. webデザイン

    photoshopで仕事をしたい人が身につけておきたい技術や使い方のまとめ。日本…
  5. 3分の話

    フリーランスや起業家になる前にこれだけは理解しておきたい5つのマトリックス&チャ…
PAGE TOP