eyemovic inc.

Works blog仕事の取り組み・ビジョン

2013.09.12

Mac+Photoshopのデザイナー向け!作業が劇的に高速化する、覚えてほしいショートカットキー41個

これはデザイナー向けにテストに出します。というレベルじゃないかと。

Webデザイナーの制作ツールとしてはPhotoshopとFireworksで分かれるところではあると思いますが、私は生粋のPhotoshop使いなので、Fireworksは「便利そうだなー」と思いつつ、やっぱりPhotoshopを使い続けてしまいます。 というか無理に苦手なものを克服するんじゃなくて好きなものを伸ばす感じで、このままPhotoshopユーザーとしてどんどん推進する所存です。

 

ショートカットキーを覚えるとPhotoshopの作業が劇的に高速化する
学生の頃、先生に「Photoshopはショートカットキーを覚えるだけで作業が5倍速くなる。アクションを使ったらさらに3倍速。」教わったような課題であったようなで覚えたのですが、今回は実際自分がよく使うショートカットキーをまとめてみました。何気なく使ってますが、案外よーさんあるもんですね。
Photoshopだけでなく、MacOS10.8以降の皆様にもぜひ覚えておいて頂きたい内容です。 知ってたらまぁそれはそれで。

 

目的は時短の先にある「成長」
ショトカットキーを覚える目的は、ずばり時短。「作業効率化」であります。
が、作業効率化の先の副産物としては「時間の確保」があり、それがクリエイターやデザイナーとしての「成長」に大きく関わるんじゃないかな、と思うわけです。いわばスキルアップのための基礎体力的な。

 

マウスの移動距離を短縮する
ちなみに私がショートカットを覚えたときのコンセプトは マウスの移動距離をいかに短縮させるか ということ。
最短距離とか、なんかカーレースのライン取りやトヨタ式「カイゼン」やボクシングのジャブに通じるかっこよさがありますね。
実際、Webの制作環境ではダブルモニタや27インチのでっかいモニタも当たり前だったりすると、マウスの移動距離を縮めることは作業にものすごいインパクトをもたらします。マウスの移動速度を速める方法もありますが、それは向き不向きあると思うので割愛。

では、前置きはこの辺にしておいて私がよく使うショートカットを書き出してみます。 

 

Photoshop CS6のショートカット

ツールパレットのショートカット 15個
人によって違うかもしれませんが、よくつかうツールは覚えておきましょう。これだけでも格段にスピード上がりますよ。

toolbox

 

Photoshopで作業中によくつかうショートカット 17個

  1. 手のひらツール:スペースバー押しながらドラッグ
  2. 透明度の設定:数字の1〜0
    ブラシツール以外のツールを選択してるときはレイヤーの透明度、ブラシツールを選択してるときはブラシの透明度を設定します。早押しすれば「23%」とか細かく指定もできます。
  3. 全画面選択:Command + A
  4. 選択解除:Command + D
  5. コピペ:Command + X/C/V
  6. ガイドやスライスの表示/非表示:Command + H
  7. 「前面色」で塗りつぶし:Option + Delete
  8. 「背面色」で塗りつぶし:Command + Delete
  9. 自由変形:Command + T
  10. ズームイン・ズームアウト:Command + [;]/[-]
  11. 一つ戻る:Command + Z
  12. 一つずつ戻る:Command + Option + Z
    ※PhotoshopのCommand + Zの基本機能は「一つ前に戻る」と「元に戻る」を繰り返すのですが、ちゃんと戻り続けるのもあります。地味によく使います。
  13. テキスト入力完了(決定):Command + Enter
  14. Web用に保存:Command + Option + Shift + S
  15. 別名で保存:Command+Shift + S
  16. キャンバスサイズの変更:Command + Option + C
  17. 画像解像度の変更:Command + Option + i

 

Photoshopのショートカットコンビネーション 6技
主に「V」キーで移動ツールに変更してからの2〜3連コンボ技です。

  1. レイヤー選択:V → Command + オブジェクトクリック
    ※移動ツールの設定で「自動選択」をしている場合は動作が変わります。ちなみに私の設定では、自動選択とバウンディングボックスはオフ設定です。
  2. レイヤー複数選択:V → Command + レイヤークリック → Shift + Command + オブジェクトクリック
  3. レイヤー1px移動+複製:コピーしたいレイヤーを選択 → V → Option + 矢印キー
  4. レイヤー水平移動、垂直移動:V → Shift + ドラッグ
  5. テキストの行間を拡げる/縮める:テキストを選択 → Option + 上下キー
  6. テキストカーニング:テキストを選択 → Option + 左右キー

 

あとはカスタマイズでスマートオブジェクトに変換するショートカットと、レイヤー効果をコピペできるショートカットも設定しています。

ひとまずPhotoshopは以上です。

 

つづきまして。

MacOSでよく使うショートカット 10個

  1. 選択範囲をクリップボードに保存:Command+Shift+Control+4 ←必須!Windowsには無かったので感動した。
    「Control」抜きだとデスクトップにpngファイルを生成するのですが、たいていキャプチャをPhotoshopに持ってくるシーンで使うので、クリップボードの方が素早いですしゴミが残らない。
  2. アプリの切り替え:Command+tabキー
    使った順に並ぶので、ブラウザとPhotoshopの切り替えが頻発するときとかは最強。
  3. カーソルをドキュメントの先頭に:fnキー+上下キー
  4. カーソルを左右の端へ:fnキー+左右キー
  5. テキストの選択:Command+Shift+左右キー
  6. フォルダ瞬間移動:Command+Shift+G
  7. テキストを打ったあとで、英語・カタカナ・日本語に変換
    日本語:Option + Z
    カタカナ:Option + X
    英語:Option + C
    半角英語:Control + 「:」
  8. ファイル情報:Command + i
  9. 新規でフォルダを開く:Command + N
  10. 新規フォルダ作成:Command + Shift + N

 

Chromeで使えるショートカット 3個

  1. タブを左右きりかえ Command + Option + 左右キー(Firefoxもいけるのかな)
  2. 新規タブ作成:Command + T
  3. 消しちゃったタブを復活:Command + Shift + T

 

【習得のコツ】

ショートカットのアルファベットは、それぞれ機能の頭文字になっていることが多いので関連づしやすいものもありますが、習得するには、やはりブラインドタッチのように何度も何度も繰り返し使って体で覚えるしかないと思います。鉄拳の10連コンボとか覚える時と一緒で、まさにトレーニング的。
あとMacのトラックパッドもかなーり優れものですが、それはまた別の機会に。

愛媛県松山市でWeb開発一筋15年、700サイト以上の構築実績!

Webサイト制作・システム開発・スマホアプリ開発・組込ソフトウェア開発ならアイムービックにお任せ下さい。