意外と簡単?Photoshopで画像を切り抜く方法

初心者の方でもAdobe Photoshopの使い方がわかる記事です。

Photoshopでは写真を切り抜いて加工することができるので、これが使えるようになると便利です。この記事を見ながらぜひ試してみてください。

 

なお本記事は、TechAcademyのWebデザインオンラインブートキャンプのPhotoshopのカリキュラムをもとに執筆しています。

 

切り抜きに使う画像

今回はこの写真を使って切り抜いてみます。

PhotoShop CS5から追加された「境界線を調整」という機能を使うことで、比較的簡単にPhotoshopで写真の人物だけを切り抜くことが可能です。

photoshop_c_1

 

 

切り抜きの方法

切り抜きの手順を紹介していきます。

photoshop_c_2

ツールパネルの選択ツールアイコンを右クリックし、「クイック選択ツール」を選びます。

 

photoshop_c_3

選択したい部分を内側からドラッグすると自動で選択範囲が作成されます。

はみ出した部分はAltを押しながらドラッグすることで解除できます。

 

photoshop_c_4

上の画像のように選択したいものが離れて複数ある場合は、Shiftを押しながらドラッグすることで同時選択することが可能です。

 

photoshop_c_4_2

また、選択範囲の追加と削除は、上のメニューからツールアイコンをクリックすることで切り替えることもできます。

 

photoshop_c_5

サンプルの画像で切り取る部分を選択した状態です。

ここから髪の毛の部分も切り抜きますが、詳しくは、Photoshopで髪の毛を綺麗に切り抜く方法をご覧ください。

 

photoshop_c_6

上のメニューより「境界線を調整」をクリックします。

 

photoshop_c_7

「表示モード」で「白黒」にします。

ここで見ると、髪の毛やまつ毛などの細かい部分が選択されていないのがわかります。

 

photoshop_c_8

次に、同じように「表示モード」から「レイヤー上」をダブルクリックします。

 

photoshop_c_9

「スマート半径」を選択し、大きさを調整します。

 

photoshop_c_10

髪の毛に沿ってドラッグします。(髪の毛以外の部分がドラッグしたあと、見えなくなりますが問題ありません)

 

photoshop_c_11

まつ毛の部分も同様にドラッグします。

 

photoshop_c_12

もう一度「表示モード」の「白黒」で見てみると、先ほどと違って細かい部分が追加されていることがわかります。

 

photoshop_c_13

「出力先」から「新規ドキュメント」を選びOKを押します。

 

photoshop_c_14

人物の部分だけ切り抜きされ、背景がと透明の画像が新規に作成されます。まわりの白と灰色の模様は透過(透明)の状態(なにも描かれていない状態)です。

 

photoshop_c_14_2

レイヤーを新規追加します。

ここでは「背景レイヤー」という名前にしています。

 

photoshop_c_14_3

レイヤーの順番を入れ替えます。(背景レイヤーが下になるようにします)

 

photoshop_c_14_4

「背景レイヤー」をツールパネルの「塗りつぶしツール」で塗りつぶしてみると、髪の毛などの細かい部分も切り取られているのが分かります。

 

photoshop_c_15

あとは背景レイヤーを変更することで自由に編集が可能です。

 

いかがでしたか?

ぜひバナー作成などにチャレンジしてみてください。

Photoshopで文字を加工する方法の記事も公開しているので、初心者の方はあわせてご覧ください。

[お知らせ]TechAcademyでは初心者でも最短4週間でオリジナルWebサイトを公開できるWebデザインオンラインブートキャンプを開催しています。Photoshopを使った画像加工も学ぶことができます。