Kana-Lier カナリエ

覚えて効率アップ!PhotoshopでWebデザインをする私がよく使うショートカット

Web制作でのデザインにはPhotoshopを使っています。Kanaです。

ショートカットを使ってPhotoshopを操作しているのですが、作業中、
「え、そんな便利なショートカットがあったの?」といわれることがありました。
Photoshopを使ってデザインされている方の参考になればと思い、私がよく使うショートカットをまとめました:)

ショートカットを使うと、マウスの操作が減るので、とても便利ですよ!

あくまで私がよく使うショートカットですので、同じ動作が他のショートカットで出来たり、このショートカットがあるのに、あのショートカットはない…ということがあるかもしれません。

PR

1.ファイル管理系ショートカット

新規作成
Ctrl + N
command + N
新しいキャンバスを作成します。
キャンバスサイズの変更
Ctrl + Alt + C
command + option + C
キャンバスサイズの変更をします。
上書き保存
Ctrl + S
command +S
ファイルを保存します。
別名を付けて保存
Ctrl + Shift + S
command + shift + S
別名を付けて保存します。

別ファイルにしてデザインを残すことが結構あるので、よく使います。

ウィンドウを閉じる
Ctrl + W
command + W
現在開いているファイルを閉じます。
アプリケーションを終了
Ctrl + Q
command + Q
Photoshopを終了します。

2.基本ショートカット

コピー
Ctrl + C
command + C
コピーします。
ペースト(貼り付け)
Ctrl + V
command + V
ペースト(貼り付け)します。
カット(切り取り)
Ctrl + X
command + X
カット(切り取り)します。
やり直し(戻る)
Ctrl + Z
command + Z
一つ前の作業をやり直します。
Ctrl + Alt + Z
command + option + Z
やり直し(Ctrl + Z / command + Z)よりも更に一段階、前の段階に戻ります。
一段階進む
Ctrl + Shift + Z
command + shift + Z
一段階進みます。

3.レイヤー管理・操作系ショートカット

新規レイヤーを作成
Ctrl + Shift + N
command + shift + N
新規レイヤーを作成します。
レイヤーをコピー
Ctrl + J
command + J
レイヤーをコピーします。
レイヤーをグループ化
Ctrl + G
command + G
レイヤーをグループ化します。
クリッピングマスク化
Ctrl + Alt + G
command + option + G
レイヤーをクリッピングマスク化します。
レイヤーを上へ移動
Ctrl + ]
command + ]
レイヤーを1つ上に移動します。
Ctrl + Shift + ]
command + shift + ]
レイヤーを最前面に移動します。

グループ化されている場合は、そのグループ内での最前面になり、もう一度押すと全てのレイヤーの最前面になります。

レイヤーを下へ移動
Ctrl + [
command + [
レイヤーを1つ下に移動します。
Ctrl + Shift + [
command + shift + [
レイヤーを最背面に移動します。

グループ化されている場合は、そのグループ内での最背面になり、もう一度押すと、背景を除いた全てのレイヤーの最背面になります。

レイヤーを結合
Ctrl + E
command + E
下のレイヤーと結合します。

グループを選択した場合は、そのグループ内が結合されます。
複数レイヤーを選択した場合は、選択したレイヤーが結合されます。

不透明度を変更
0 〜 9
ブラシツール・塗りつぶし・グラデーションツール以外の状態で、0〜100までの数値を入力すると、選択しているレイヤーの不透明度が変更されます。
レイヤースタイル
レイヤーダブルクリック
レイヤースタイル変更を表示します。

4.作業スペース系ショートカット

メニューの表示/非表示
Tab
メニューの表示/非表示を切り替えます。
スクリーンモード
F
スクリーンモードを切り替えます。

(標準スクリーンモード・メニューありフルスクリーンモード・メニューなしフルスクリーンモード)

ガイドの表示/非表示
Ctrl + :
command + :
ガイドの表示/非表示を切り替えます。
エクストラの表示/非表示
Ctrl + H
command + H
エクストラの表示/非表示を切り替えます。

(エクストラとは、選択範囲の境界線・レイヤーの境界線・ガイド・スライスなどの総称です)

5.範囲選択系ショートカット

範囲選択ツール
M
範囲選択ツールに切り替えます。
Shift + M
選択範囲ツールの形(四角・楕円)を切り替えます。
自由選択ツール
W
自由選択ツールに切り替えます。
Shift + W
範囲ツールの種類を切り替えます。

(自由選択ツール・クイック選択ツール)

選択範囲を解除
Ctrl + D
command + D
選択範囲を解除します。
選択範囲を反転
Ctrl + Shift + I
command + shift + I
選択範囲を反転します。

6.ブラシ系ショートカット

ブラシツール
B
ブラシツールに切り替えます。
Shift + B
ブラシツールの種類を切り替えます。

(ブラシ・鉛筆・色の置き換えツール)

ブラシサイズ変更
]
ブラシサイズの幅を拡大します。
[
ブラシサイズの幅を縮小します。
不透明度を変更
0 〜 9
ブラシツールを選択した状態で0〜100までの数値を入力すると、不透明度が変更されます。

7.ズーム系ショートカット

ズームツール
Z
ズームツールに切り替えます。
Alt / optionを押している間は拡大・縮小が逆になります。
拡大率100%
Ctrl + Alt + 0
command + option + 0
拡大率を100%(ピクセル等倍)にします。
ズームイン
Ctrl + plus(+)
command + plus(+)
ズームインします。
ズームアウト
Ctrl + minus(ー)
command + minus(ー)
ズームアウトします。

8.ツール系ショートカット

スライス
C
スライスツールに切り替えます。
Shift + C
スライスツールの種類を切り替えます。

(スライスツール・スライス選択ツール・切り抜きツール)

修正
J
修正ツールに切り替えます。
Shift + J
修正ツールの種類を切り替えます。

(スポット修正ブラシ・修正ブラシ・パッチ・赤目修正)

消しゴム
E
消しゴムツールに切り替えます。
Shift + E
消しゴムツールの種類を切り替えます。

(消しゴム・背景消しゴム・マジック消しゴム)

塗りつぶし
G
塗りつぶしツールに切り替えます。
Shift + G
塗りつぶしツールの種類を切り替えます。

(塗りつぶし・グラデーション)

0 〜 9
0〜100までの数値を入力すると、不透明度が変更されます。
テキスト
T
テキストツールに切り替えます。
Shift + T
テキストツールの種類を切り替えます。

(横書き文字・縦書き文字・横書き文字マスク・縦書き文字マスクツール)

Ctrl + Enter
command + Enter
テキストツール状態を解除します。

テキスト入力が終わってから、テキストモードから抜ける際に使います。

パス図形
U
パス図形ツールに切り替えます。
Shift + U
パス図形ツールの種類を切り替えます。

(長方形・角丸長方形・楕円・多角形・ライン・カスタムシェイプツール)

スポイト
I
スポイトツールに切り替えます。
ハンド
H
ハンドツールに切り替えます。
自由変形
Ctrl + T
command + T
自由変形モードに切り替えます。
描画色/背景色 入れ替え
X
パレットの描画色と背景色を入れ替えます。
パレット 黒/白
D
パレットの描画色を黒、背景色を白にします。

最後に

いかがでしたでしょうか。
いざリストを作っていると、自分がどんなショートカットを使っていたか、すぐに出て来ませんね…。

Photoshopユーザの方の参考になれば幸いです。

また、Webデザインレシピたかはしのり さんも見やすくショートカットをまとめられていました。
私が使っていないショートカットもありましたので、是非こちらもご覧ください!

効率化 – 覚えちゃえば便利な Photoshop ショートカットキーいろいろ|Webデザインレシピ