初心者でも無料で簡単に自分でホームページが作れる「ホームページ作成ツール」が増えてきています。 有料プランでも毎月数百円~数千円程度とお手頃な価格なので、“とりあえずHPが欲しい!”という方にはおすすめです。 その中でも […]

2019.9.17
未経験でも分かる! Photoshop(フォトショップ)の使い方2
Illustratorと同様、Photoshop(フォトショップ)にもたくさんのツールがあって覚えるのが大変ですよね。
この記事ではツールボックスの基本と、フォトショップでよく使う「人物の切り抜き」などの説明をします。
【目次】
1.フォトショップのツールボックス
2.ズームツール・手のひらツール
3.選択ツール
4.人物の切り抜き
5.多角形選択ツール
6.まとめ
1.フォトショップのツールボックス
フォトショップのツールボックスには、イラストの描画や編集に使用する様々なツールが納められています。
2.ズームツール・手のひらツール
ズームツール
ズームツールは、画面の表示倍率を変えることができます。
拡大 Mac(Space+⌘) / Win(Space+Ctrl)
縮小 Mac(Space+⌘+Option) / Win(Space+Ctrl+Alt)
①ズームツールを選択
②【拡大する場合】画面をクリック
③【縮小する場合】Mac(Option) / Win(Alt) を押したままクリック
※ステータスバーに直接、倍率を入力することもできます。
手のひらツール (Space)
手のひらツールは、見たい部分を表示させることができます。
①「手のひらツール」を選択。
②画面をクリック&ドラッグ
※画像全体が表示されている場合は移動できません。
3.選択ツール
選択ツールでは、長方形や楕円形で選択範囲を描けます。
「長方形(楕円形)選択ツール」で、クリック→ドラッグし
四角形(円)を描くように選択しましょう。
①長方形(楕円形)選択ツールを選びます。
※コントロールパネルの“ぼかし”は“0px”にしておく。
②画像の上でクリック&ドラッグ

③“Shift”を押しながらクリック&ドラッグ
※“Shift”を押したままドラッグすると縦横比が同じになります。
※選択の解除は選択ツールで画像の任意の場所をクリック。または Mac“⌘+D” / Win“Ctrl+D”
Mac “Option” / Win “Alt” を押してドラッグすると、ドラッグ開始場所が図形の中心となります。
選択範囲は描いた後に移動することができます。選択ツールでドラッグしてみましょう。
選択範囲の保存、読み込み
選択範囲を保存してみましょう。
①「楕円形選択ツール」で円形の選択範囲を作成します。
②メニューバーより、「選択範囲」→「選択範囲を保存」を選択。

名前に“円”と入力して“OK”をクリック。

次に、選択範囲を読み込んでみましょう。
③一旦選択を解除し、メニューバーより、「選択範囲」→「選択範囲を読み込む」を選択。

④チャンネルのプルダウンより先ほど保存した“円”の選択範囲を指定し“OK”をクリック。

“円”の選択範囲が表示されました。
4.人物の切り抜き
人物の髪の毛や動物の毛などを自然に切り抜くのは難しいことですが、おおまかな選択範囲を作成した後に「境界線を調整」を使用することで、比較的簡単に切り抜くことができます。
「境界線を調整」を使用して人物画像の切り抜きをしてみましょう。
①まず、“boy.jpg”の画像の人物だけをおおまかに選択します。今回は「クイック選択ツール」を使用。ブラシサイズを“30”に設定し選択します。
※「クイック選択ツール」で、選択したいエリアの内側をクリック(またはドラッグ)していくにつれて選択エリアが広がっていきます。髪の毛は実際よりも内側を選択するくらいでOKです。
②コントロールパネルより“選択とマスク”を選択し、設定ウィンドウが出たら「表示モード」の「表示」をクリックして、今回は“黒地”を選択します。
③次に「エッジの検出」の「スマート半径」をチェックすると、選択範囲の境界線を調整する幅を指定することができます。今回は“30px”に設定します。
※「半径」は最初の選択範囲に対して周囲のどれ位のエリアで境界線を作成するのかを設定するもの。形状がくっきりしてエッジがはっきりした画像などは数値を少なく、逆に背景に溶け込んで、ぼけ幅が広い場合は数値を大きくするのがポイント。
④「スマート半径」だけでは髪の毛のような複雑なエリアは選択しきれないこともあります。「半径調整ツール」を使って境界線の調整を行う範囲を直接ドラッグして指定してみましょう。
※ブラシのサイズはコントロールパネルにある「直径」で変更することができます。
<切り抜いた画像を使って合成する>
⑤作成した選択範囲をそのままコピーします。(Mac “⌘+C” / Win “Ctrl+C”)
⑥kids_room.jpgを開き、ペースト(Mac “⌘+V” Win “Ctrl+V”)し、完成例を見本にしながら、「移動ツール」で位置を調整します。
⑦完成!

5.多角形選択ツール
「多角形選択ツール」は、直線的に選択範囲を作成できます。ビルや建物など直線的な部分を選択する場合に使用します。
「多角形選択ツール」で選択してみよう
①“building.jpg”の画像を開きます。
②「なげなわツール」を長押しして表示される「多角形選択ツール」を選択します。
③ビルの輪郭をたどって、ビル部分を選択。建物の角を順にクリックしていきます。
間違えてしまい、戻りたいときは、“Delete”を押す度に1つずつ前に戻ります。

④メニューバーより、「選択範囲」→「選択範囲を反転」を選択します。(選択範囲が空の方に変わります。)
⑤新たに“sky.jpg”の画像を開きます。

⑥“sky.jpg”の画像を全選択(Mac “⌘+A” / Win “Ctrl+A”)し、⌘+Cでコピー、再び“building.jpg”の画像に移動。
メニューバーより、「編集」→「特殊ペースト」→「選択範囲内へペースト」を実行すると下記のようにビルの背景が差し替わります。

6.まとめ
4.人物の切り抜き でご紹介した人物を切り抜く方法は、Photoshopでよく使います。
切り抜いて後ろに別の背景を入れたりすることはよくあるので、基本をしっかり覚えるとラクになります。フォトショップをどんどん使いこなしていきましょう!
Photoshop無料体験版ダウンロードページ
最新記事
-
SEO
SEO対策に強いWeb制作とは?SEOの基本、制作会社の選び方も解説
2022.5.18
インターネットが普及した現代において、ホームページは重要な集客手段となっています。 そして、ホームページで集客するためにはSEO対策が重要です。 本記事では、SEO対策に強いWeb制作の方法や、制作会社の選び方などについ […]
-
Illustrator
デザインセンスの磨き方 その2
2022.5.9
過去の記事で、センスとは何か / どうしたら身につくのかを私なりに分析させていただきました。 今回は、自分のデザインスキルを向上させるのに有効な方法をご紹介します。 結論からいうとセンスを磨くには「言語化」 […]
-
Illustrator
デザインセンスの磨き方 その1
2022.5.9
センスがある人ってかっこよくて羨ましい! デザインの勉強を始めたけど、どうすればセンスを磨いていけるかわからない! 私はデザインのキャリアをスタートして2年以上経ちますが、正直いまも同じような気持ちです(笑) 自分への自 […]
-
Web制作
ホームページ制作費用を安く抑えるための4つのポイント
2022.4.28
「ホームページを制作したいけど予算が少ない・・・」「見積もりが想像以上に高かった・・・」 ホームページをつくる上で多くの人が気になることといえば、やはり制作費。 限られた予算の中で、なるべく安く費用を抑えたいところですが […]
おすすめ記事はこちら
-
- スタートアップ
- ツール
- ホームページ制作
- 無料
無料!簡単!ホームページ作成ツール5選
2021.9.13
-
- スタートアップ
- ホームページ制作会社
- 安い
安いには理由がある?ホームページ制作会社を上手く選ぶためのポイント
2021.8.10
「ホームページ制作 格安」などで検索をすると日本全国のいろいろな制作会社が出て来ます。 5ページ50,000円〜、初期費用0円で月々3,000円〜など、お得そうなキャッチコピーが並んでいるのをよく目にするかと思います。 […]
-
- reCAPTCHA
- プラグイン
- ワードプレス
- 初心者
【簡単スパム対策】Contact Form 7でreCAPTCHAを導入する方法
2021.8.2
WEBサイトのお問い合わせフォームから毎日大量に届くスパムメール… 対策のために検索すると必ずといっていいほど目にする”reCAPTCHA” 名前から察するに導入するのが難しそう…と思われる方もいらっしゃるかもしれません […]
-
- Zoom
- ツール
- 無料
アカウント登録不要!Zoomの使用方法
2020.10.5
【目次】1.Zoomとは2.アカウント作成なしのZoomミーティングの基本的な流れ3.【PCの場合】Zoomアプリのダウンロード方法4.【スマートフォンの場合】Zoomアプリのダウンロード方法 目次1.Zoom とは2. […]
-
- Zoom
- ツール
- 無料
簡単!Zoomアカウント登録&使用方法
2020.10.5
【目次】1.Zoomとは?2.Zoom使用に必要な環境3.PCで登録、使用する場合4.スマートフォンで登録、使用する場合 目次1.Zoom とは【Zoom使用に必要な環境】2.Zoomミーティングの基本的な流れ3.【PC […]
カテゴリー
最新記事
-
SEO
SEO対策に強いWeb制作とは?SEOの基本、制作会社の選び方も解説
2022.5.18
インターネットが普及した現代において、ホームページは重要な集客手段となっています。 そして、ホームページで集客するためにはSEO対策が重要です。 本記事では、SEO対策に強いWeb制作の方法や、制作会社の選び方などについ […]
-
Illustrator
デザインセンスの磨き方 その2
2022.5.9
過去の記事で、センスとは何か / どうしたら身につくのかを私なりに分析させていただきました。 今回は、自分のデザインスキルを向上させるのに有効な方法をご紹介します。 結論からいうとセンスを磨くには「言語化」 […]
-
Illustrator
デザインセンスの磨き方 その1
2022.5.9
センスがある人ってかっこよくて羨ましい! デザインの勉強を始めたけど、どうすればセンスを磨いていけるかわからない! 私はデザインのキャリアをスタートして2年以上経ちますが、正直いまも同じような気持ちです(笑) 自分への自 […]
-
Web制作
ホームページ制作費用を安く抑えるための4つのポイント
2022.4.28
「ホームページを制作したいけど予算が少ない・・・」「見積もりが想像以上に高かった・・・」 ホームページをつくる上で多くの人が気になることといえば、やはり制作費。 限られた予算の中で、なるべく安く費用を抑えたいところですが […]
お問い合わせ
・
資料ダウンロードはこちらから

お問い合わせ・資料ダウンロードはこちらから
頂いたお問い合わせに出来るだけ迅速に(24時間以内)に返信します。知識豊富な専門のスタッフが親切・丁寧にお答えしますので、お気軽にお問い合わせください。
LIHが運営する
お役立ちブログ配信中
Staff blog
LIHの最新情報や、耳よりなセミナー情報、webに関するノウハウをブログ形式でお届けします。
ぜひご覧ください。
-
- SEO対策
- WEB制作
- ブログ集客
SEO対策に強いWeb制作とは?SEOの基本、制作会社の選び方も解説
2022.5.18
インターネットが普及した現代において、ホームページは重要な集客手段となっています。 そして、ホームページで集客するためにはSEO対策が重要です。 本記事では、SEO対策に強いWeb制作の方法や、制作会社の選び方などについ […]
-
- Illustrator
- Photoshop
- WEB制作
- センス
デザインセンスの磨き方 その2
2022.5.9
過去の記事で、センスとは何か / どうしたら身につくのかを私なりに分析させていただきました。 今回は、自分のデザインスキルを向上させるのに有効な方法をご紹介します。 結論からいうとセンスを磨くには「言語化」 […]
-
- Illustrator
- Photoshop
- WEB制作
- センス
デザインセンスの磨き方 その1
2022.5.9
センスがある人ってかっこよくて羨ましい! デザインの勉強を始めたけど、どうすればセンスを磨いていけるかわからない! 私はデザインのキャリアをスタートして2年以上経ちますが、正直いまも同じような気持ちです(笑) 自分への自 […]
-
- スタートアップ
- ホームページ制作
- 安い
ホームページ制作費用を安く抑えるための4つのポイント
2022.4.28
「ホームページを制作したいけど予算が少ない・・・」「見積もりが想像以上に高かった・・・」 ホームページをつくる上で多くの人が気になることといえば、やはり制作費。 限られた予算の中で、なるべく安く費用を抑えたいところですが […]
-
- WEB制作
- 初心者
初心者必見!Webサイト制作に必要なスキルとは?
2022.3.25
近年の副業ブームも相まって、Webサイト制作に必要なスキルを独学で身に付けたい!という方を多く見かけるようになりました。 ドットインストールやProgateなど、独学でプログラミングを学習できるコンテンツは数多くあります […]
-
- WEB制作
- 初心者
【はじめてでもよくわかる】ホームページ制作の進め方
2022.2.28
「初めてホームページを作るんだけど、制作会社との打ち合わせって何を聞かれるの?」 「あらかじめスケジュールを立てておきたいんだけど、どのくらい期間が必要なの?」など、制作がどんな風に進んでいくのか心配な方も多いんじゃない […]