Photoshopで髪の毛をきれいに切り抜く方法【初心者向け】

Photoshopで髪の毛を綺麗に切り抜く方法を初心者向けに解説した記事です。髪の毛などの細かい切り抜きをするには、選択範囲を作成する際「境界線を調整」というオプション機能を使用します。記事を読んでいざチャレンジ!

TechAcademyマガジンは受講者数No.1のオンラインプログラミングスクールTechAcademy [テックアカデミー]が運営。初心者向けに解説した記事を公開中。現役エンジニアの方はこちらをご覧ください。

Photoshopで髪の毛をきれいに切り抜く方法をテックアカデミーのメンター(現役Webデザイナー)が初心者向けに解説します。

Photoshopでは、画像の切り抜きがよく使われます。

ただし、髪の毛をきれいに切り抜くには一工夫が必要です。

選択範囲を作成する際、「選択とマスク」というオプション機能を使用することができます。

これによって人物の髪の毛などの細かい部分を簡単にきれいに切り抜くことが可能です。

目次

 

(※今回の作業はすべてAdobe Photoshop CCのバージョンで行っています)

 

大石ゆかり

田島メンター!!人物の切り抜きをするとき、境界線の部分に髪の毛があるとうまくいかなくて・・・どうすればいいですか~?

田島悠介

選択ツールだけでうまくいかないときは、「選択とマスク」機能を使ってみよう。

大石ゆかり

その機能はどこにあるんですか?

田島悠介

そうだね、まずは普通に選択範囲を作成するところから始めてみようか。

 

髪の毛をきれいに切り抜く

今回はこの写真画像を使用します。

ps_kamic_1

 

画像が背景レイヤーの場合は、レイヤーを右クリックして「背景からレイヤーへ」を選択します。

ps_kamic_2

 

レイヤーの名前を入力し、「OK」をクリックします。

ここでは「レイヤー0」としています。

 

左のツールアイコンから「クイック選択ツール」を選びます。

 

上部にあるオプションバーの「被写体を選択」をクリックします。

これでドラッグをせずに、人物全体をかんたんに選択することができます。

 

人物全体を選択した状態です。

ps_kamic_6

 

大石ゆかり

ここまではできるんですが、細かい髪の毛が範囲外に残ったままですね・・・

田島悠介

ここで「選択とマスク」を選択してみよう。選択範囲の点線が出ている状態で、上のメニューバーに表示されるよ。

大石ゆかり

はい!やってみます!

 

選択範囲を作成した状態で「選択とマスク」をクリックします。

 

右側に「選択とマスク」のウィンドウが表示されます。

「表示モード」を「白黒」に変更してください。

 

「エッジの検出」内の「スマート半径」にチェックを入れ、半径を調整します。

 

白いシルエットが今選択されている部分です。

髪の毛の辺りをドラッグすると、その部分が自動的により細かく調整されます。

ps_kamic_9

 

調整ができたら「OK」を押して「選択とマスク」のウィンドウを閉じます。

選択範囲が作成されている画面に戻るので、そのままの状態で「選択範囲」→「選択範囲を反転」をクリックしましょう。

ps_kamic_10

 

これで人物以外の部分が選択されている状態になりました。

「編集」→「消去」を選択します。

ps_kamic_11

 

最後に「選択範囲」→「選択を解除」をクリックして完成です。

ps_kamic_12

 

先ほど調整した髪の毛を含む、人物の部分以外の場所が透過の状態(何も描かれていない状態)になります。

これで髪の毛もうまく抽出できたことがわかるのではないでしょうか。

ps_kamic_13

 

下にレイヤーを作成し、一色で塗りつぶした状態です。

ps_kamic_14

 

拡大してみると、髪の細かい部分が切り取られているのが分かります。

ps_kamic_15

 

あとは背景用のレイヤーを変えることによって自由に加工が可能です。

ps_kamic_16

これで完了です。

このテクニックを使いこなして、Photoshopの上達にお役立てください。

 

田島悠介

人物の切り抜きはうまくいったかな?

大石ゆかり

髪の毛の一本一本まで、きれいに切り抜けました!

田島悠介

髪以外でも、木の枝など細かい部分の切り取りを行うときは、ぜひこの「選択とマスク」機能を使ってみよう。

大石ゆかり

はい!ありがとうございました!

 

さらにPhotoshopを使いこなしたい場合は、Photoshopで逆光の写真を補正をする方法 も合わせてご覧ください。

 

[PR] Webデザインで挫折しない学習方法を動画で公開中

Photoshopを学習中の方へ

これで解説は終了です、お疲れさまでした。

  • Photoshopを調べたけど分かりづらい
  • 副業や転職後の「現場で使える」知識やスキルを身につけたい

Photoshopの学習や情報収集をしていて、このように思ったことはありませんか?

テックアカデミーのPhotoshop講座では、第一線で活躍する「プロのWebデザイナー」が教えているので、効率的に実践的なスキルを完全オンラインでしっかり習得できます。

合格率10%の選考を通過した、選ばれたWebデザイナーのチャットサポートを受けながら、初心者でもフォトレタッチをマスターできます。