続・プチ効率化２！AutoHotkeyでFigmaのプラグインにショートカットを設定してみよう

じわじわ気温も上がってきて夏がちらほら
梅雨が明けたらいよいよ真夏ということで、例年猛暑が怖いです。

休日は家で無限にパンを焼いて夏を乗り切ります。お塩です。

Figmaを使い始めて

社内の設計、デザインツールがXD⇒Figmaに移行するということもあり、細かな仕様の違いに振り回されながら作業しています。

使い慣れたあの機能この機能が別のショートカットに割り当てられているということもあり、慣れるまで少し時間がかかりそうです。

XDでは片手で操作できていたショートカットを両手で操作する必要があったり、プラグインにショートカットの設定をできなかったりでモヤモヤしています。

なので今回は Windowsで AutoHotkeyを使用してFigmaプラグインのショートカットを設定する方法について紹介していきます。

WindowsにおけるAutoHotkeyの導入方法や、基本的なショートカットキーの置き換えについては過去の記事で紹介していますのでそちらを参照してください。

MacOSの場合は、Figmaでも登録可能なキーボードショートカットというOS付属の機能があるため、AutoHotkeyを導入は不要です。
Windowsにはそういったマクロ機能は搭載されていないため、別途ユーティリティツールを導入する必要があり、今回はWindowsに焦点を当てた内容となっています。

手順

  1. AutoHotkeyのインストール:
  2. 新しいスクリプトファイルを作成:
    • デスクトップ上で右クリックして、「新規作成」→「Autohotkey Script」を選択します。
    • スクリプトファイルに名前を付けます（例：FigmaPluginShortcut.ahk）。
  3. スクリプトファイルを編集:
    • 作成したスクリプトファイルを右クリックして「編集」を選択します。
    • 以下のサンプルスクリプトを使用して、任意のショートカットキーでFigmaのプラグインを実行するように設定します。
    • スクリプトファイルを保存します。 
; Ctrl + Shift + P にショートカットを割り当て 
^+p:: 
     ; Figmaウィンドウをアクティブにする
     IfWinExist, ahk_class Chrome_WidgetWin_1
     {
         WinActivate
         ; QuickActionsを開く（Ctrl + /）
         Send, ^/
         Sleep, 500 ; 少し待つ
         ; プラグイン名を入力
         Send, Plugin Name
         Sleep, 500 ; 少し待つ
         ; Enterキーを送信してプラグインを実行
         Send, {Enter}
     }
     else
     {
         MsgBox, Figma window not found.
     }
 return

スクリプトの説明

  1. ^+p:::
    • Ctrl + Shift + P キーの組み合わせでスクリプトを実行します。
  2. IfWinExist, ahk_class Chrome_WidgetWin_1:
    • Figmaのウィンドウが存在するかチェックします。Figmaのウィンドウはahk_class Chrome_WidgetWin_1として認識されます。
    • FigmaアプリはChromeとして認識されるため、Chromeをアクティブにしている場合でもスクリプトが動作してしまうため、注意が必要です。
  3. WinActivate:
    • Figmaのウィンドウをアクティブにします。
  4. Send, ^/:
    • Ctrl + / を送信してQuick Actionsを開きます。
  5. Sleep, 500:
    • 入力タイミングを調整します。 （0.5秒）
  6. Send, Plugin Name:
    • 実行したいプラグインの名前を送信します。
  7. Send, {Enter}:
    • Enterキーを送信します。

スクリプトの実行

  1. スクリプトを実行:
    • 保存したスクリプトファイルをダブルクリックして実行します。
    • トレイアイコンにAutoHotKeyのアイコンが表示されます。
  2. ショートカットの動作確認:
    • Figmaを開き、設定したショートカットキー（例：Ctrl + Shift + P）を押してプラグインが実行されることを確認します。

実際に動かしてみる

それでは作成したショートカットを使用してFigma上でプラグインを実行してみましょう。
今回は選択したオブジェクトの配置を入れ替える「Swap」というプラグインのショートカットを設定し、実行してみました。

一瞬QuickActionsが表示され、正常にボタンの入れ替えができていることを確認できました。
あとは同様に他のプラグインのトリガーと割り当てたいショートカットを追加していくだけです。

終わりに

都度ショートカットを設定する必要はありますが、多用するプラグインほどその後の作業がグッと楽になりますし、プラグインが増えれば使用頻度も増えて効率化に繋がりますので、ぜひ試してみてください。

(ショートカットがなくてもクイックアクション＞キーワード入力＞サジェストより実行するだけなので数秒の操作ですが、これもまたチリツモということで…)

トップへ戻る
ホーム
トップ