Figmaで作業スピード3倍！ショートカット厳選ガイド｜今日から時短デザインへ

Posted on by

Figmaは直感的に操作できる便利なデザインツールですが、マウス操作だけで作業しているとどうしても時間がかかり、疲れも溜まりがちです。

実は、多くのプロデザイナーは ショートカットで作業スピードを“爆速化” しています。

ショートカットを覚えると…

  • 時短になる
  • レイアウトが正確になる
  • 作業のストレスが激減する
  • 作業ミスが減る
  • デザインの“思考スピード”も上がる

など、メリットだらけ。

この記事では、初心者が最初に覚えるべき「本当に使うショートカット」だけを厳選 して紹介します。

最も重要！作業スピードが劇的に上がる基本ショートカット

初心者がまず覚えるべきは、この5つだけでOK。
この5つだけで「マウス往復のストレス」が激減します。

① Frame（Fキー）

FキーだけでFrameが作れる。
Figmaは“Frame中心”で作るツールなので、全場面で使います。

  • 新規UIを作る
  • スマホ画面（375px）を作る
  • カードUIを作る

など、使わない日はありません。

② Duplicate（⌘D / Ctrl+D）

複製のショートカット。
複製 → 微修正 → 複製 → 微修正…という“UI反復作業”が一気に早くなります。

③ Copy / Paste（⌘C / ⌘V）

基本ですが、Figmaでは プロパティごとコピーできる のが強力。

  • テキストスタイルだけコピー
  • シャドウだけコピー
  • Auto Layoutだけコピー

なども可能（⌘⌥C / ⌘⌥V）。

④ Undo / Redo（⌘Z / ⌘⇧Z）

UIデザインは試行錯誤が命。
ミスを恐れず作業できるため、結果として作業が早くなります。

⑤ Zoom（⌘＋ / ⌘−）

UI制作は、
✔︎ 全体を見る
✔︎ 細部を見る
の切り替えが頻繁に必要。

ショートカットでズームすると、ストレスがゼロになります。

Auto Layout 作業を爆速にするショートカット

Auto Layout は Figmaの心臓部分。
ここをショートカットで扱えると作業スピードが一気に跳ね上がります。

① Auto Layout を追加（Shift + A）

UIを揃えるときの必須操作。
ボタン・カード・リストなど、UIの9割に使います。

② Auto Layout の方向切り替え（Shift + A で追加 → Panelで左右切替）

方向をワンクリックで変えられるので、

  • 縦並び
  • 横並び
    の切り替えが速い。

③ Resize to Fit（Shift + ⌘ + R）

Auto Layoutが崩れたときに神のように効くショートカット。

  • 余計な余白ができた
  • ボタンが意図せず大きくなった
  • コンテンツサイズにフィットさせたい

こんなときに一発リセットできます。

レイヤー整理が爆速になるショートカット

「レイヤー地獄」になりがちな初心者こそ覚えるべき。

① グループ化（⌘G）／解除（⌘⇧G）

Frameとグループの違いは注意ですが、
「一時的にまとめる」には必要。

② 前面・背面に移動（⌘] / ⌘[）

カバー写真、背景、カードなど、
“重なり順” を整理するのに必須。

③ 名前変更（⌘R）

レイヤーの整理スピードが激変します。
毎日使うべきショートカット。

実務で必須！選択＆移動のショートカット

UIは細かい調整の連続なので、ここを覚えると「職人並みに早くなる」。

① Shiftで複数選択

近い要素を一気にまとめて動かせます。

② 矢印キーで移動（1px / Shift+矢印で10px）

デザインの精度が上がる神ショートカット。

③ Command + Click で下層レイヤーを選択

重なっている要素から「この部分だけ選びたい！」ときに必須。
これを知らないと永遠に選べずイライラします。

テキスト作業が3倍早くなるショートカット

文字編集はUIで必ず行うので習得必須。

① テキスト追加（T）

ボタンひとつで入力状態へ。

② 太字・斜体（⌘B / ⌘I）

装飾のスピードが爆上がりします。

③ 文字サイズ変更（⌘＋ / ⌘−）

見出し調整、UIトーンの調整に毎回使います。

コンポーネント作成を最速で行うショートカット

Figmaの真骨頂、コンポーネント作成も爆速化できます。

① コンポーネント化（⌘⌥K）

UIを作る → すぐコンポーネント化。
プロの現場では必ず行われる手順。

② Main Component を探す（右クリック → Go to Main Component）

ショートカットは現状ありませんが、
この操作を覚えるだけで探す時間が削減できます。

画面を整えるショートカット（めちゃ強い）

① 整列（⌘⇧A）

複数の要素を一気に揃える。
UIが一気にきれいになります。

② 規則正しく並べる（⌘⇧→ / ⌘⇧↓）

ボタンやアイコンを均等に並べる必須ショートカット。

まとめ：ショートカットは“最強の時短スキル”

Figmaはショートカットを使うかどうかで、
作業スピード・クオリティ・集中力がすべて変わります。

まずは以下の5つだけ覚えてください。

  • Frame（F）
  • Duplicate（⌘D）
  • Auto Layout（Shift + A）
  • Resize to Fit（⌘⌥Shift + R）
  • 下層選択（⌘クリック）

これだけで 今日から作業スピード3倍 になります。

#Figmaショートカット #作業効率化 #時短テクニック#デザイン効率化 #仕事効率化 #爆速化 #UIデザイン初心者 #駆け出しデザイナー #学び直し #今日の積み上げ #10分デザイン #デザインTips