Photoshop使い方講座！初心者がすぐに使えるツールを紹介

Webデザインには、画像を加工する作業があり、その際に使用するソフトがPhotoshopです。

Photoshopの使い方を知らずにWebデザインをはじめるのは難しいといわれるほど重要なスキルです。

本記事では、Photoshopの基礎知識から基本操作を解説します。

これからWebデザインをはじめる方でも、すぐに実践できるようになる内容なため、ぜひ最後まで読んでみてください。

Photoshopでできること【基礎知識】

はじめに、Photoshopの基礎知識を解説します。

Photoshopを操作する前に覚えておくといい前提の知識を集めました。

Photoshopを使うときにも活かせる内容なため、ぜひ参考にしてみてください。

Photoshopは写真や画像編集が得意

Photoshopでは、写真や画像を編集できます。

ブログやYouTubeのサムネイルの画像を加工したり、撮った写真をPhotoshopに取り込み編集できたりします。

写真や画像を編集したい場合は、Photoshopを使用するのがいいでしょう。

文字入力も可能なので、Photoshopでサムネイル画像を作り切ることもできます。

Photoshopはレイヤーで構成されている

Photoshopはレイヤーで構成されています。

レイヤーとは、複数枚のシートを重ねて文字を書いたり写真を貼り付けたりする構成になっていることです。

Photoshopは、レイヤーを重ねることで1枚の写真が仕上がるようになっています。

レイヤーで構成されているメリットは、修正に手間がかからないことです。

レイヤーを何枚も重ねてから修正したいと思っても、消したいレイヤーの画像や文章をそのまま消去すれば編集できます。

そのため、1枚のレイヤーで作業するのではなく、名前を付けて複数枚のレイヤーを作っておくのがオススメです。

ひとつのレイヤーで作業するのは編集が大変になってしまうため、辞めておきましょう。

Photoshopを使用するときは原寸画像がオススメ

Photoshopで画像を挿入するときは、原寸画像で挿入するのがオススメです。

Photoshopはラスター系ソフトのため。

ラスター系ソフトとは、画像を小さな点（ピクセル）で描画します。

そのため、画像を拡大したり変形したりすると、画質が粗くなってしまいます。

 

また、画像内の一部を円や長方形に変えることがPhotoshopにはできません。

Photoshopを加工する写真や画像は、形を変える必要のないものを選び、原寸で使用するのがいいでしょう。

もし、画像を拡大したり変形させたりしたい場合は、Illustratorの使用をオススメします。

Illustratorはベクター系ソフトと呼ばれていて、点とそれをつないだ線や色・カーブなどを数値化してくれます。

拡大・縮小しても常に数値を合わせてくれるため、ぼやける心配はありません。

Photoshop使い方講座1.ワークスペースの名前

ここからは、Photoshopの使い方を解説します。

「なんだか難しそう」と感じる方もいるかもしれませんが、未経験の方や初心者の方でも、すぐにPhotoshopを使えるような構成になっているためご安心ください。

まずは、ワークスペースの名前を紹介します。

ワークスペースとは、作業場のこと。

Photoshopで写真や画像を編集するときに絶対に使う場所のため、名前は覚えておきましょう。

ワークスペース1.タブ

タブとは、複数枚のファイルが開いているときにファイル名が表示される場所です。

タブをクリックすると、作業対象となるファイルと切り替わります。

表示方法も自由に選択できます。

「ウィンドウ」メニューから「アレンジ」の下にある「すべてを左右に並べる」や、「すべてを上下に並べる」などを選択すると表示変更が可能です。

ワークスペース2.ツールパネル【Photoshopのツールが選べる】

ツールパネルは画像を選択するツールや、修正するツールが選択できます。

ツールの数が多いため、ジャンルが似ている代表的なツールはまとまっており、それ以外のツールは隠れています。

ツールは初期状態では、画面の左端にドッキングされていてドラッグで移動することも可能です。

ドッキングを解除すると、パネル上部に×印が表示され、これをクリックするとパネルが消える仕組みです。

さらに、初期状態ではツールパネルは1列ですが、2列に変更することもできます。

ワークスペース3.オプションバー【Photoshopの設定ができる】

画面上部に表示されているのが、オプションバーです。

Photoshopの代表的な設定項目はオプションバーにあります。

基本的な設定は、オプションバーですぐにできる設計になっています。

ワークスペース4.パネル

画面右側に代表的なパネルが表示されています。

他のパネルはアイコン状態で表示されていて、アイコンをクリックすると、ポップアップ表示されます。

初期状態で見えないパネルは、「ウィンドウ」メニューから選択することで表示できるので、お試しください。

パネル表示は、はじめのうちは使いづらさを感じることがあるかもしれないため、実際に使用しながら覚えていくと良いでしょう。

Photoshop使い方講座2.基本操作を覚える

次に、Photoshopの基本操作を解説します。

Photoshopの基本操作で大事なことは画像調整です。

画像調整の基本は以下の3つです。

1. 画像の拡大や縮小
2. トリミング
3. 明るさ調整

それぞれ具体的に解説します。

基本操作1.Photoshopで画像の拡大や縮小をする

Photoshopで画像のサイズを変更する方法は、まず「ファイル」から「開く」を選択して編集するファイルを開きます。

そこから「イメージ」→「画像解像度」を選択すると、画像のピクセル数やプリントサイズを変更できる画面になるので、オンラインで使用する場合は、画像の幅と高さをピクセル単位で設定し印刷の場合は画像のインチかセンチメートルで入力します。

変更後のサイズに合わせてピクセル数を変更するには、再サンプルを選択してください。

再サンプルにチェックを入れてから、ポップアップメニューで補完方式を選択してください。

「拡大」や「縮小」とついたメニューは写真の拡大や縮小に向いており、ツールで描いた線を保持した状態で拡大・縮小したい場合は、ニアレストネイバー法がいいでしょう。

基本操作2.トリミング【Photoshopで画像を切り取る】

Photoshopで画像を切り取るときはトリミングを選択します。

まず、「イメージ」のメニューから「トリミング」を選びます。

画像周囲の透明部分や指定したカラーの背景ピクセルをトリミングすることによって、色のついている画像部分を切り取ることが可能です。

上下左右で選択できるため、イメージに合ったトリミングができるでしょう。

基本操作3.Photoshopで画像の明るさ調整をする

Photoshopに取り込んだ画像の明るさを調整することで、見栄えのいい画像に修正できます。

Photoshopには、たくさんの色調補正機能が用意されています。

色調を補正するには「イメージ」メニューから「色調補正」の各種コマンドを使うか、レイヤーパネルの「調整レイヤー」の各種コマンドからも可能です。

明るさを変えたりコントラストを変更したりすることで、作品のイメージに合った編集をしてみてください。

Photoshop使い方講座3.画像を加工する

Photoshopでは画像の修正や加工が可能なため、必要のない部分を消したり文字入力できたりします。

ここからは、Photoshopで写真や画像を加工する方法を解説します。

画像加工1.Photoshopを使って画像を修正し加工

修正して加工する方法でオススメなのは、「修復ブラシツール」。

修復ブラシツールは、画像内の一部をコピーして他の場所を修復するツールです。

ツールパネルで修復ブラシツールを選び、オプションバーのブラシピッカーを開いて、ブラシの直径を設定すると、使用したいサイズで修正できます。

画像加工2.Photoshopで必要のない部分を消す

スポット修復ブラシツールは、周辺の画像を使用して修正します。

クリック一回で小さい汚れや傷を修正できます。

ツールパネルにあるスポット修復ブラシツールから選択してください。

マウスカーソルを汚れに合わせてクリックすると、汚れが消えます。

画像加工3.文字入力【Photoshopでもできる】

Photoshopで文字入力をする場合は、「横書き文字ツール」を使い、書式を設定して文字を入力する方法を選びましょう。

書式を設定するには、ツールバーから「横書き文字ツール」を選び、オプションバーで「フォント」を選択します。

クリックすると、文字が入力できる状態になり、文字入力が終了したらオプションバーで確定ボタンを押してください。

文字入力を終了すると、レイヤーパネルにテキストレイヤーが作成されます。

これで文字入力は完成です。

Photoshopを活用して画像や写真をデザインしよう

Photoshopの基本操作や画像加工の方法を解説しました。

初心者の方でもPhotoshopをすぐに使えるために覚えておくべきポイントは以下です。

• ワークスペースの名前をマスターする
• Photoshopの基本操作である画像の扱い方をマスターする
• Photoshopで画像を加工・編集する方法をマスターする

Photoshopの基礎知識を身につけて、色々な操作を覚えていくとスムーズに編集できるでしょう。

ぜひ、今回紹介した知識を使ってみてください。

Chapter Twoでは、WebデザインコースがありPhotoshopの使用方法もお伝えできます。

WebデザインをはじめるにはPhotoshopが必要不可欠なため、ぜひ一度お話だけでもしてみませんか？

Chapter Twoはこちら