見出し画像

作業の効率化を!!Figamのショートカットキー集

今回は作業効率UPということで!!
Figmaのショートカットキーを一覧で紹介したいと思います!!
まず、Figmaについて軽く説明しますね!!


概要 : Figamについて

Figmaは、オンラインベースのデザインツールであり、UI/UXデザインやプロトタイピング、共同作業など、さまざまなデザイン関連のタスクを支援します。

  • ブラウザベースのプラットフォーム

Figmaはブラウザ上で動作するため、Windows、Mac、Linuxなど、さまざまなプラットフォームで利用できます。また、デスクトップアプリも提供されています。

  • リアルタイム共同作業

Figmaはリアルタイム共同作業が可能であり、複数のユーザーが同時にファイルを編集できます。これにより、チームメンバーは同じプロジェクトに関するリアルタイムのフィードバックやコメントを共有することができます。

  • デザインシステムの構築

Figmaでは、再利用可能なコンポーネントやスタイルを管理することができます。これにより、デザインシステムを構築し、デザインの一貫性を保ちながら効率的に作業を進めることができます。

  • プロトタイピング機能

Figmaにはプロトタイピング機能が組み込まれており、デザインをクリック可能なプロトタイプに変換できます。これにより、ユーザーエクスペリエンスの流れを確認したり、フィードバックを得ることができます。

  • プラグインエコシステム

Figmaはプラグインエコシステムを持っており、さまざまなプラグインを利用してワークフローをカスタマイズできます。自動化やデザインの拡張など、さまざまな目的に応じてプラグインを活用することができます。

Figmaはこれらの機能を組み合わせて、デザイナーやチームが効率的にデザインを作成し、共同作業を行うことができるように設計されています。さらに、クラウドベースのアプローチにより、データの保存や共有がスムーズで簡単です!!


さて、本題の作業効率には欠かせないFigmaショートカットキーについて、紹介していきます!!!

Figmaショートカット一覧

  • V: 選択ツール

  • A: フレームツール

  • T: テキストツール

  • R: レクタングルツール

  • O: 円形ツール

  • P: ペンツール

  • H: ハンドツール(キャンバスを移動するために使用)

  • Z: ズームツール

  • Shift + 1: フレームの横方向の配置をトグル

  • Shift + 2: フレームの縦方向の配置をトグル

  • Shift + A: 組み合わせてオートレイアウトを適用

  • Cmd/Ctrl + D: 選択を複製

  • Cmd/Ctrl + G: グループ化

  • Cmd/Ctrl + Shift + G: グループから解除

  • Cmd/Ctrl + C: コピー

  • Cmd/Ctrl + V: ペースト

  • Cmd/Ctrl + X: カット

  • Cmd/Ctrl + Z: 元に戻す

  • Cmd/Ctrl + Shift + Z: やり直す

  • Cmd/Ctrl + S: ファイルを保存

  • Cmd/Ctrl + E: 選択されたフレームをプロトタイプに変換

まずは、この一般的なショートカットを覚えましょう!!
お次に作業スピードを上げるのに欠かせないショートカットを紹介します!

ツールの切り替え

  • L: ラインツール

  • Y: ハイパーリンクツール

  • G: グリッドの表示/非表示切り替え

  • D: デフォルトのスタイルにリセット

  • Shift + D: デフォルトのスタイルにリセット(テキストの場合)

レイヤーの操作

  • Cmd/Ctrl + Shift + M: フレーム内のコンポーネントをマスク

  • Cmd/Ctrl + G: 選択したレイヤーをグループ化

  • Cmd/Ctrl + Shift + G: グループ化されたレイヤーから解除

  • Cmd/Ctrl + [: レイヤーを後方に移動

  • Cmd/Ctrl + ]: レイヤーを前方に移動

  • Cmd/Ctrl + Option/Alt + G: グループ内でオートレイアウトを作成

  • Cmd/Ctrl + Option/Alt + L: レイヤーを閉じる/開く

  • Cmd/Ctrl + Shift + K: コンポーネントをコピーして貼り付け

表示の切り替え

  • Cmd/Ctrl + Slash (/): ガイドの表示/非表示切り替え

  • Cmd/Ctrl + Option/Alt + 1: レイヤーパネルの表示/非表示切り替え

  • Cmd/Ctrl + Option/Alt + 2: プロパティパネルの表示/非表示切り替え

  • Cmd/Ctrl + Option/Alt + 3: プロトタイプパネルの表示/非表示切り替え

テキストの編集

  • Cmd/Ctrl + B: テキストを太字にする

  • Cmd/Ctrl + I: テキストをイタリックにする

  • Cmd/Ctrl + U: テキストに下線を引く

  • Cmd/Ctrl + T: テキストを中央揃えにする

  • Cmd/Ctrl + Shift + T: テキストを左揃えにする

ページ操作

  • Cmd/Ctrl + Option/Alt + N: 新しいページを作成

  • Cmd/Ctrl + Option/Alt + Left/Right Arrow: ページ間を移動

表示の切り替え

  • Cmd/Ctrl + . (ピリオド): ズームイン

  • Cmd/Ctrl + , (カンマ): ズームアウト

  • Cmd/Ctrl + 0 (ゼロ): 実際のサイズにズーム

グリッドとガイド

  • Cmd/Ctrl + ; (セミコロン): グリッドの表示/非表示切り替え

  • Cmd/Ctrl + ' (シングルクォーテーション): ガイドの表示/非表示切り替え

その他

  • Cmd/Ctrl + Enter: プロトタイプのプレビューを開始

  • Shift + H: 選択したフレームの水平方向の配置を調整

  • Shift + V: 選択したフレームの垂直方向の配置を調整

  • Cmd/Ctrl + Shift + K: 選択したフレームのアートボードに変換

  • Cmd/Ctrl + Shift + M: 選択したフレームをマスクに変換

  • Cmd/Ctrl + Shift + C: 選択したフレームのスタイルをコピー

  • Cmd/Ctrl + Shift + V: スタイルをペースト

  • Cmd/Ctrl + Shift + B: 選択したフレームのブレンドモードを変更

  • Cmd/Ctrl + Shift + H: ハンドオフ(プロトタイプのハンドオフモードを有効にする)

  • Cmd/Ctrl + Shift + L: コンポーネントのライブラリを追加

  • Cmd/Ctrl + Shift + D: コンポーネントのインスタンスを削除

  • Cmd/Ctrl + Shift + F: 選択したオブジェクトをフレームにまとめる

  • Cmd/Ctrl + Shift + P: ペンツールをプロトタイプに変換

  • Cmd/Ctrl + Shift + G: 選択したフレームをグループ化

  • Cmd/Ctrl + Shift + E: 選択したフレームをプレスリーブツールに変換


これら紹介するのはデフォルトのショートカットであり、環境設定でカスタマイズすることもできます。好みに合わせてぜひ!!
ショートカットマスターを目指しましょう!!

この記事が気に入ったらサポートをしてみませんか?