自習室管理人ブログ
カテゴリー一覧を見る

Photoshopの基本操作【画像編集の第一歩】

Photoshopの基本操作【画像編集の第一歩】 デザイン・画像編集

Photoshopを開いてみたものの、パネルやメニューが多すぎてどこから手をつければいいかわからない——そんな状態で止まっていませんか。機能の多さに圧倒されるのは初心者なら誰でも通る道で、最初から全部を覚えようとする必要はありません。

この記事では、Photoshopの基本操作を「レイヤー」「切り抜き」「色調補正」「テキストと書き出し」の順に整理し、今日から使える手順としてまとめました。読み終えたあとには、基本的な画像編集の流れが頭に入り、実際に手を動かすイメージが持てるようになります。

この記事のポイント

  • cg-kenkyujo.comの解説では、ツールパネル・レイヤーパネル・メニューバー・オプションバーの4つを、最初に押さえたい機能として挙げている
  • レイヤーと調整レイヤーを使いこなすことで、元画像を壊さずに編集できる
  • Photoshop内の「もっと知る」パネルやホーム画面の「学ぶ」、Adobe公式のチュートリアルを活用すると、独学でも体系的に学べる

何に使えるソフト?Photoshopの用途を整理する

まず、Photoshopがどんなソフトで、何に使えるのかを整理しておきましょう。用途を把握しておくと、学ぶべき操作の優先順位が自然と見えてきます。

画面の横で色見本を見比べる女性
イメージ

画像編集・合成・レタッチの3つの用途

skillhub.jpの解説によると、Photoshopはアドビ(Adobe)が販売する画像編集アプリケーションで、写真家やグラフィックデザイナーなどの「画像のプロ」に広く使われています。

Web制作の現場でも標準的なツールとして定着しており、同サイトによるとサイト内で使用する画像の作成・調整、バナーデザイン、ワイヤーフレームやデザインカンプの作成といった場面で活用されています。

用途を大きく分けると、次の3つになります。

  • 画像編集:写真のトリミング・リサイズ・明るさ調整など、素材を整える作業
  • 合成:複数の画像を組み合わせてひとつの作品を作る作業
  • レタッチ:肌のシミ消しや不要な物の除去など、写真を「磨く」作業

どの用途から入るかによって、最初に覚えるべき操作が変わります。写真編集が目的なら色調補正とレタッチ、デザイン制作が目的ならレイヤーとテキスト操作から始めるのが効率的です。

IllustratorやLightroomとの違い

Photoshopと混同しやすいのが、同じAdobe製品のIllustratorとLightroomです。それぞれの違いを以下の表で確認してください。

ソフト 主な用途 扱うデータ 向いている作業
Photoshop 写真編集・合成・レタッチ ラスター(ピクセル) 写真加工・バナー制作・Web画像
Illustrator ロゴ・イラスト・印刷物 ベクター(パス) 拡大しても劣化しないデザイン
Lightroom 写真の一括現像・管理 RAWファイル中心 大量写真の効率的な現像・整理

Photoshopはピクセル単位の細かい編集が得意で、複雑な合成や精密なレタッチに向いています。ロゴやアイコンのようにどんなサイズでも鮮明に表示したい場合はIllustratorが適し、大量の写真をまとめて現像・管理したい場合はLightroomが向いています。

大きさ順に重ねた五色の書類フォルダー
イメージ

Photoshop基本操作の核心:レイヤーの仕組みを理解する

Photoshopの基本操作のなかで、最初に理解しておくべきなのがレイヤーです。レイヤーなしでは複数要素の編集をやり直すたびに最初からやり直す必要があるため、習得が最優先です。

レイヤーパネルの見方と基本操作

cg-kenkyujo.comの解説によると、Photoshopでは画像や文字を透明なシートのように重ねて加工していきます。この「透明なシート」がレイヤーで、レイヤーを管理するのがレイヤーパネルです。同サイトによると、レイヤーパネルではレイヤーの追加・複製・削除、階層の入れ替え、エフェクトの適用が可能です。

レイヤーパネルからできる主な操作は次のとおりです。

  • レイヤーの追加・複製・削除:パネル下部のアイコンから操作する
  • 階層の入れ替え:レイヤーをドラッグして順序を変更する
  • 表示・非表示の切り替え:目のアイコンをクリックする
  • レイヤーへのエフェクト適用:レイヤーを選択した状態で効果を加える

レイヤーパネルが画面に表示されていない場合は、キーボードのF7キーで表示できます(S.Design.Laboの解説より)。同サイトでは、レイヤーを「Photoshopで必ず使う機能」と紹介しています。

レイヤーがそれぞれ独立して存在しているため、「どのレイヤーが選択されているか」を常に意識することが、操作ミスを防ぐうえで欠かせません。

地下通路の壁を彩る細かなモザイクタイル
イメージ

スマートオブジェクトとラスターレイヤーの違いも押さえる

S.Design.Laboの解説によると、スマートオブジェクトは拡大・縮小を行っても画質が劣化しない一方、ラスターレイヤーは拡大・縮小を繰り返すと画質が劣化します。写真素材を配置する際は、スマートオブジェクトに変換しておくことで、後からサイズ変更が生じても品質を保てます。

変換手順は「レイヤーパネルで対象レイヤーを右クリック」→「スマートオブジェクトに変換」の2ステップです。スマートオブジェクトはレイヤーサムネールの右下にアイコンが表示されるため、一目で確認できます。

調整レイヤーを使うと何が変わるか

通常のレイヤーに直接編集を加えると、元の状態に戻せなくなる場合があります。これを避けるのが調整レイヤーの役割です。

調整レイヤーを使うと、元のレイヤーはそのままの状態で明るさや色味の変更が加えられます。S.Design.Laboの解説では、「元のレイヤーはそのままの状態で様々な編集が加えられる」と説明されており、後からいつでも調整内容を変更・削除できる点が利点です。

追加方法は次のとおりです。

  1. レイヤーパネルを開く
  2. パネル下部の「塗りつぶしまたは調整レイヤーを新規作成」アイコンをクリックする
  3. 追加したい調整の種類(明るさ・コントラスト、色相・彩度など)を選ぶ
  4. プロパティパネルで数値を調整する

プロパティパネルが表示されていない場合は、メニューバーの「ウィンドウ」→「プロパティ」で表示できます。調整レイヤーは「非破壊編集」の基本であり、習慣として使うことで作業の安全性が高まります。

画像の切り抜きはどうすればうまくできる?

被写体だけを切り抜いて背景を透明にする作業は、Photoshopで最もよく使う操作のひとつです。ツールの選び方と手順を押さえておくと、仕上がりの精度が変わります。

白い紙に並べた色紙の形とはさみ
イメージ

クイック選択ツールと「被写体を選択」、どう使い分ける?

選択範囲を作る方法は複数ありますが、初心者が最初に覚えるべき2つを紹介します。

クイック選択ツールは、ブラシをドラッグするだけで近い色や質感の領域を自動認識して選択範囲を広げていくツールです。ツールパネルの「クイック選択ツール」を選び、被写体の上をなぞるように動かします。選択が多すぎた場合はAlt(Mac: Option)キーを押しながらドラッグすると、選択範囲を縮小できます。

被写体を選択は、メニューバーの「選択範囲」→「被写体を選択」から実行します。AIが画像を解析して被写体を自動検出するため、クリック一つで大まかな選択範囲が完成します。最新バージョンでの詳細な精度・機能については、Adobe公式ユーザーガイド(日本語)でご確認ください。

使い分けの目安は次のとおりです。

  • 背景と被写体のコントラストが明確→「被写体を選択」で一発選択
  • 細かい部分を手動で調整したい→「クイック選択ツール」で微調整
  • 複雑な形状や複数の被写体→両方を組み合わせて使う

レイヤーマスクで非破壊的に切り抜く手順

選択範囲を作ったあと、直接削除してしまうと元に戻せません。レイヤーマスクを使うと、切り抜いた部分を「隠す」だけにとどめられるため、後から修正が効きます。

手順は次のとおりです。

  1. 切り抜きたい被写体の選択範囲を作る(クイック選択ツールまたは被写体を選択)
  2. レイヤーパネル下部の「レイヤーマスクを追加」アイコンをクリックする
  3. 選択範囲外が自動的に非表示になり、被写体だけが残る
  4. マスクのサムネールを選択した状態で白・黒のブラシを使って境界を調整する

白いブラシで塗ると表示、黒いブラシで塗ると非表示になります。この仕組みを覚えておくと、境界の微調整が直感的に行えます。S.Design.Laboの記事でもレイヤーマスクは「初心者が押さえておきたい基本操作18選」のひとつとして取り上げられています。

古い白黒写真の傷を細い筆で直す手
イメージ

撮影時の失敗写真も改善できる?色調補正・レタッチの基本4操作

撮影時の光の加減で白飛びや暗すぎる写真になってしまった——そんなときに使う4つの補正操作を紹介します。明るさや色味を整えることで写真の印象が変わり、素材の完成度を高められます。

明るさ・コントラストとレベル補正の違い

明るさを調整するツールは複数ありますが、代表的なのが「明るさ・コントラスト」と「レベル補正」です。

明るさ・コントラストは、スライダーを左右に動かすだけで直感的に操作できます。全体的に明るくしたい・暗くしたいといった大まかな調整に向いています。調整レイヤーとして追加すると、元画像を保ったまま何度でも変更できます。

レベル補正は、ヒストグラム(画像の明暗の分布グラフ)を見ながら、シャドウ・中間調・ハイライトをそれぞれ独立して調整します。「全体的に白っぽくくすんでいる」「暗部がつぶれている」といった具体的な問題を解決するのに向いており、より精密な補正が必要な場面で使います。

初心者は「明るさ・コントラスト」から始め、慣れてきたら「レベル補正」に移行するのが自然な流れです。どちらも調整レイヤーとして追加することで、非破壊編集が維持できます。

スポット修復ブラシで不要な部分を消す

写真に写り込んだゴミや肌のシミ、不要な背景要素を消すのに使うのが「スポット修復ブラシツール」です。

操作は非常にシンプルで、消したい部分の上をクリックまたはドラッグするだけです。Photoshopが周囲のピクセルを自動的に分析し、自然な形で埋めてくれます。

使用時のポイントは3つです。

  • ブラシサイズを消したい部分より少し大きめに設定する:オプションバーで直径を調整する
  • コンテンツに応じた塗りつぶしモードを使う:複雑な背景でも自然に仕上がりやすい
  • 新規レイヤーを作成し、オプションバーの「全レイヤーを対象」をオンにしてから作業する:元のレイヤーを残したまま、下の画像をもとに修復できる

小さな点や細い線の除去に向いており、広い面積の消去には「コンテンツに応じた塗りつぶし」(メニューバー「編集」→「コンテンツに応じた塗りつぶし」)を組み合わせると効果的です。

墨の入った硯に置いた筆先
イメージ

テキストと書き出しの基本操作

画像編集が完成したら、テキストを加えて書き出す作業が最後のステップです。用途に合った設定を選ぶことで、Web用にも印刷用にも対応できます。

文字ツールとフォント設定の手順

テキストを追加するには、ツールパネルから「文字ツール(T)」を選択し、キャンバス上をクリックしてから文字を入力します。入力した文字は自動的に独立したテキストレイヤーとして作成されます。

フォントや文字サイズの設定は、オプションバーまたはウィンドウメニューから開く「文字」パネルで行います。主な設定項目は次のとおりです。

  • フォントファミリー:書体の種類(例: Noto Sans JP、游ゴシックなど)
  • フォントスタイル:Regular、Bold、Italic など
  • フォントサイズ:pt(ポイント)単位で指定する
  • カーニング・トラッキング:文字間隔の調整
  • 行送り:行間の調整

テキストレイヤーはラスタライズ(画像化)しない限り、後からいつでも文字の内容やフォントを変更できます。ラスタライズすると編集不可になるため、最終確認が終わるまでテキストレイヤーのまま保持しておくのが安全です。

印刷機の前に積まれた色鮮やかな紙
イメージ

Web・印刷向けの書き出し設定(形式・解像度)

完成した画像を書き出す際は、使用目的に合わせて形式と解像度を設定します。設定を間違えると、Webで表示するには重すぎたり、印刷すると粗くなったりします。

cg-kenkyujo.comの解説によると、新規ドキュメント作成時にWeb用・印刷用などのプリセットが用意されており(新規ドキュメントのショートカット: Windows Ctrl+N、Mac Command+N)、最初の段階から用途を意識した設定が可能です。書き出し時も同様に、用途別の設定を選ぶことが仕上がりの質に直結します。

下表の解像度は目安です。Adobeのヘルプでは、高品質のプリントには300ppiが業界標準とされています。一方、画面での見た目の大きさは画像のピクセル数で決まるため、Web用は解像度(ppi)の数値ではなくピクセル数で大きさを決めます(出典:Adobe「プリント画像の解像度の仕様」/Adobe「モニター解像度と画像表示サイズ」)。

用途 推奨形式 解像度の目安 書き出し方法
Web・SNS JPEG / PNG / WebP ピクセル数で指定(ppiの数値は画面の見た目に影響しない) 書き出し形式(JPG・PNG)。WebPは「コピーを保存」
印刷物 TIFF / PDF / PSD 300ppi前後 別名で保存
透過PNG PNG ピクセル数で指定 書き出し形式(透明を有効にする)

Web用の書き出しは「ファイル」→「書き出し」→「書き出し形式」から行います。プレビューを見ながらファイルサイズと画質のバランスを確認できるため、初心者でも調整しやすい画面です。最新の推奨設定はAdobe公式ユーザーガイド(日本語)でも確認できます。

Photoshopの基本操作はどこで学べる?

操作を覚えるには、実際に手を動かして練習するのが一番です。ただ、どこで学ぶかによって習得の速さが変わります。

夜の部屋でノートパソコンに向かう後ろ姿
イメージ

Adobe公式チュートリアルと「もっと知る」パネルの活用

Photoshopには、使い方を調べられる「もっと知る」パネルが組み込まれています。「ヘルプ」→「Photoshop ヘルプ」を選ぶか、Ctrl+F(Macは⌘+F)、または画面右上の検索アイコンから開けます。起動時のホーム画面の「学ぶ」からは、初心者向けのチュートリアルも選べます(出典:Adobe「もっと知るパネルにアクセス」/Adobe「ホーム画面の概要」)。

Adobeの公式サイトでも、基礎から応用までの学習コンテンツが公開されています。skillhub.jpの記事では、「公式サイトのバックアップ(解説動画・画像の提供)はもちろんのこと、様々な方がチュートリアルや素材を公開している点も魅力」と紹介されており、学習リソースの豊富さはPhotoshopの強みのひとつです。

また、S.Design.Laboではレイヤー・調整レイヤー・レイヤーマスクなど18の基本操作を、一部はショートカットも添えて解説しています。体系的に学びたい場合の参考になります。

学習の順序としては、次の流れが取り組みやすいです。

  • ホーム画面の「学ぶ」から初心者向けのチュートリアルを選ぶ
  • 基本操作(レイヤー・選択・補正)を一通り体験する
  • 公式チュートリアルで興味のある応用テーマを選んで深掘りする

集中して練習できる環境を整えるヒント

Photoshopの操作は、一度に長時間まとめて練習するより、短い練習を日を空けて繰り返す方が身につきやすいと考えられます。学習法の研究を整理した Dunlosky ら(2013年、Psychological Science in the Public Interest)は、間を空けて繰り返す「分散学習」を有用性の高い方法と評価しています(DOI: 10.1177/1529100612453266)。

1回の練習では「手順を見る→すぐに試す」を短いサイクルで回し、翌日以降に同じ操作をもう一度試してみてください。

💡 集中できる練習環境を外に求める場合

本ブログ管理人が運営するアイデスク新宿自習室は、Photoshopのような集中作業に適した環境です。新宿西口駅から徒歩3分、24時間365日利用可能で、半個室ブース18席・オープン席3席(全21席)を備え、Wi-Fi・全席電源コンセント完備。私語厳禁のため、ノートPCで黙々と手を動かす練習に向いています。

学習環境の選び方としては、次の点を確認してください。

  • 電源コンセントが使えるか(長時間の作業ではノートPCの充電が必要になる)
  • Wi-Fiが安定しているか(チュートリアル動画を参照しながら作業する場合)
  • 周囲の音が少ないか(操作に集中できる静かさがあるか)

よくある質問

Q. Photoshopは初心者でも独学で覚えられますか?

A. 覚えられます。Photoshop内の「もっと知る」パネルやホーム画面の「学ぶ」、Adobe公式のチュートリアルがそろっており、ソフトを開いたまま調べながら操作を試せます。最初はレイヤー・選択・色調補正・書き出しの4つの操作に絞り、実際に手を動かしながら覚えていくのが効率的です。短い練習でも日を空けて繰り返すと、操作が定着しやすくなります。

Q. PhotoshopとIllustratorはどちらを先に学ぶべきですか?

A. 目的によって異なります。写真の加工やWeb用画像の制作が目的なら、Photoshopから始めるのが自然です。ロゴやアイコンなどベクターグラフィックを扱いたい場合はIllustratorが向いています。

Web制作を学ぶ場合は、Photoshopで画像を作りIllustratorでロゴを作るという形で両方使うケースが多いため、まずPhotoshopから入り、必要になったタイミングでIllustratorを学ぶ流れが現実的です。

Q. レイヤーマスクと直接削除の違いは何ですか?

A. 直接削除はピクセルを消去するため、元に戻せません。レイヤーマスクは「隠す」だけで、ピクセル自体は保持されます。後から境界を修正したいときや、切り抜きをやり直したいときにマスクを編集するだけで対応できます。Photoshopで編集する際は、直接削除よりもレイヤーマスクを使う習慣をつけると、作業の安全性が高まります。

Q. Web用と印刷用で解像度が違うのはなぜですか?

A. 画面での見た目の大きさは、画像のピクセル数と、モニターのサイズや解像度の設定で決まり、画像の解像度(ppi)の数値には左右されません。ピクセル数を変えずに解像度の数値だけを変えても、画像のデータ量は変わりません。一方、印刷では解像度が仕上がりの細かさを決め、Adobeのヘルプでは高品質のプリントには300ppiが業界標準とされています。

用途に合わせて設定することでファイルサイズと画質のバランスが取れます。最新の推奨値はAdobe公式ユーザーガイドでご確認ください。

Q. 調整レイヤーは後から削除できますか?

A. 削除できます。レイヤーパネルで調整レイヤーを選択し、パネル下部のゴミ箱アイコンをクリックするだけです。また、調整レイヤーの目のアイコンをクリックして一時的に非表示にすることもできます。調整前と調整後の見た目を比較したい場合は、非表示・表示を切り替えながら確認すると便利です。

まとめ

Photoshopの基本操作は、大きく「インターフェースの理解」「レイヤー」「選択と切り抜き」「色調補正」「テキストと書き出し」の5つの柱で構成されています。

ツールパネル・レイヤーパネル・メニューバー・オプションバーの役割を押さえ、レイヤーと調整レイヤーの仕組みを実際の編集作業と結びつけて覚えると、次の操作に進みやすくなります。そのうえでスマートオブジェクトや調整レイヤーの非破壊編集の考え方を身につけると、元画像を守りながら安全に編集できるようになります。

最初の一歩として、Photoshopのホーム画面の「学ぶ」から初心者向けのチュートリアルを1本選び、今日中に終えてみてください。実際に手を動かすことで、読んだだけでは得られない感覚がつかめます。

※本記事の情報は2026年10月時点のものです。Photoshopの料金・プランおよびバージョン情報はAdobeが頻繁に改定するため、最新情報は必ずAdobe公式サイトでご確認ください。
最終更新: 2026年10月2日

参考サイト

集中できる学習環境を探している方は、新宿の自習室もご覧ください。24時間利用可・半個室ブース中心の自習室です。
→ アイデスク新宿自習室の詳細

タイトルとURLをコピーしました