PhotoshopCC2017の「選択とマスク」機能を使ってスピーディに髪の毛を切り抜く方法

もーりー

2017.01.10

こんにちは。デザイナーの森です。

2年前に下記の記事でphotshop cs5以降に追加された「境界線を調整」を使って、髪の毛を切り抜く方法をご紹介しました。

Photoshopで人物の髪の毛を「境界線の調整」を使って簡単に切り抜く方法

現在「境界線を調整」はphotoshopCC2017では名前を改め「選択とマスク」という機能としてパワーアップしております。（photoshopCC2015.5から名称変更）

しかし、僕は最近photoshopCCを2015→2017にバージョンアップしましたが、この名前変更に気づかず「あれ？「境界線を調整」はどこいったの？あんなに便利なツールなくなるはずないのに……」と戸惑ってしまいました。

今回は自分と同じように混乱してしまった方や「選択とマスク」「境界線を調整」をそもそも知らなかった方のために改めて「選択とマスク」の使い方をご紹介します。

※この記事は、2017年に公開されたものです。最新のPhotoshopを使った切り抜きの方法については、以下の記事をご覧ください。

Photoshopで写真を切り抜く方法！髪の毛と背景を馴染ませるコツも紹介【初心者向け】

「選択とマスク」を使って髪の毛を切り抜く方法

今回はふわふわヘアのかわいい子供の写真をご用意しました。

できるかぎり白背景や人物とのコントラストの高い画像だとより切り抜きやすくなります。

このふわふわヘアをパスで切り抜くのはもちろんほぼ不可能だと思います。

まずは人物の境界線をペンツールで囲みます。

髪の毛の部分は大雑把にペンツールで囲っていきます。

ペンツールで囲み終わったら右クリックで「選択範囲を作成」で選択範囲を作ります。

選択範囲ができました。

選択範囲を作成したらいよいよ「選択とマスク」の出番です。

「選択とマスク」を起動するには４つ方法があります。

「選択とマスク」を起動したら「ツール」の上から2番目「境界線調整ブラシツール」を選択し、子供と背景の境界線をなぞっていきます。

「境界線調整ブラシツール」の使い方は基本的にはブラシツールと同じで、サイズも[と]で太くしたり細くしたりできます。（この時、表示モードをオニオンスキンで行うと、切り抜き後のイメージがしやすいかもしれません）

境界線をなぞると背景が消えて髪の毛のディティールのみが現れてきます。

「エッジの検出」や「グローバル調整」で好みの調整を行い完成です。（「エッジのシフトの値をマイナス値にするとよりシャープに切り抜くことが可能です。）

最後に「出力設定」の「出力先」を「レイヤーマスク」にして「OK」を押せば作業は終了です。

他にも「選択とマスク」ではクイック選択ツールや、選択範囲をブラシのように広げていく「ブラシツール」や「なげなわツール」などが用意されています。（これらの機能はクイックマスクモードと同じような使いかたができるので、お好みで使いわけてください」

見え方や機能の追加等、若干「境界線を調整」とは違いますが、基本的な使い方は変わりませんので、安心して試してみてください。

G-02

現在 LIG では、デザイナーを募集しております。

転職活動中の方、ただお話を聞いてみたい方、興味のある方は是非ご応募ください。　お待ちしております！

募集職種	WEBデザイナー
採用形態	中途採用
募集する人	・高いクオリティにこだわり、世界に向けてLIGをリードしたいデザイナー・これからのLIGを共に作り上げる仲間
主に担当していただくこと	大手企業のプロモーション施策、ブランドサイト、コーポレートサイト、リクルートサイト、Webサービスなど、さまざまなプロジェクトのデザイン業務
希望するスキル／条件	・Webサイト及びインターフェースデザインの実務経験がある・Photoshop、Illustratorでのデザイン経験がある・とにかくデザインが好きな気持ちがある
歓迎するスキル／条件	・Webデザイナーとして2年以上の実務経験がある・チームでの開発経験がある・コミュニケーションデザインの経験がある・表現だけではなく、UI/UXも大切にできる
歓迎する人物像	・デザインが好きな方・柔軟性を持ち、自ら考え行動ができる方・現状に満足せず、新しい技術にチャレンジする意欲がある方・積極的に情報発信ができる方・新しい発想やアウトプットへのこだわりがある方・外国人の方も歓迎します