Figmaのカスタムプラグインを作るには、JavaScriptの知識とプラグインAPIの理解が必須だった──少なくとも2026年6月24日まで。Config 2026で発表された「Generative plugins」は、プロンプトを入力するだけでカスタムプラグインを自動生成する機能だ。開発環境のセットアップもAPIドキュメントの読み込みも不要になった、と公式発表および複数の技術メディアが伝えている。デザイナーに求められる「AIスキル」は、コードを書く力ではなく「自分がほしいツールを言葉で説明できる力」へと変わりつつある。この記事ではその変化の全貌と、実際のプラグイン生成の流れを解説する。
図解：プラグイン開発の「前と後」
flowchart LR
subgraph OLD["旧プラグイン開発（〜2026年6月）"]
A1[要件整理] --> A2[JavaScript実装]
A2 --> A3[プラグインAPI習得]
A3 --> A4[デバッグ・動作確認]
A4 --> A5[公開]
end
subgraph NEW["Generative plugins（Config 2026〜）"]
B1[したいことを言語化] --> B2[プロンプト入力]
B2 --> B3[AIがプラグイン生成]
B3 --> B4[調整・公開]
end
OLD -- "必要スキル: JS＋API" --> A5
NEW -- "必要スキル: 言語化する力" --> B4
プラグイン開発の"参入障壁"はコードにあった
従来のFigmaプラグイン開発には、少なくとも3つの壁があった。
1. JavaScriptの知識 Figmaプラグインの実体はJavaScript（またはTypeScript）で書かれたコードだ。UIを持つプラグインはHTMLとCSSも必要になる。デザイナーがコードを書き慣れていない場合、ここで挫折するケースが多かった。
2. プラグインAPIの理解 Figmaが提供するプラグインAPIは、ノードの操作・スタイル参照・ドキュメント構造の読み書きなど独自の仕様を持つ。公式ドキュメントは英語で、ページ数も多い。「やりたいことをAPIでどう表現するか」を調べるだけで数時間かかることも珍しくなかった。
3. 開発環境のセットアップ コードエディタ（VS Code等）の準備、Node.js・npmのインストール、Figmaプラグイン開発テンプレートのセットアップ、ローカルでの動作確認──リリースまでに必要な手順が多く、「試しに作ってみる」という気軽さが生まれにくかった。
この3つが合わさって、Figmaプラグインは「エンジニアに頼むもの」という暗黙の前提が出来上がっていた。Config 2026はその前提を崩した。
Config 2026で発表されたこと──Generative pluginsとは
2026年6月24日に開催されたFigmaの年次カンファレンス「Config 2026」で、複数の新機能が発表された。その中で最もインパクトが大きいのが「Generative plugins」だ。
公式発表および TechCrunch（2026年6月24日付）によると、Generative pluginsはAIエージェントを使ってカスタムの再利用可能なプラグインを構築し、Figmaの機能を拡張できる機能だ。ユーザーはプロンプト（自然言語の指示）を入力するだけで、そのプラグインが自動生成される。技術系メディアのDevelopers.IO（クラスメソッド）も「開発環境やAPIの知識が不要になった」と報じている。
プラグイン生成の基本的な流れ（公式発表の範囲で確認できる内容）：
- Figma上でGenerative pluginsの機能を呼び出す
- 「チェックリストを自動でコンポーネント化してほしい」「選択したフレームに均等スペーシングを適用してほしい」など、したいことを自然言語で入力する
- AIがプラグインを生成する
- 生成されたプラグインをチーム内で共有・再利用する
詳細な操作手順・使用できるプランの条件については、公式発表時点では確認できる情報が限られているため、Figma公式サイトおよび公式ドキュメントで最新情報を確認してほしい。
Figma Weaveとの関係：AIワークフローをキャンバス上のツールに
Config 2026では「Figma Weave」との統合も発表された。公式発表によると、20以上のWeaveツールをFigmaに統合し、複雑なAIワークフローをキャンバス上のシンプルなツールに変換する機能だ。
Generative pluginsと合わせて理解すると、こうなる：
- Generative plugins: 繰り返しのデザイン作業を自動化するツールをプロンプトで作る
- Figma Weave統合: 複雑なAIワークフロー（複数のAIステップをつなぐ処理）をFigmaのキャンバス上でシンプルなツールとして扱えるようにする
両者は「AIをFigmaの中に閉じ込め、デザイナーが普段の画面を離れずに使いこなせる環境を作る」という方向性で一貫している。
デザイナーに求められる「AIスキル」が変わった
この変化が重要なのは、「Figmaプラグインが作りやすくなった」という事実以上に、デザイナーに期待される能力の定義が変わりつつあるからだ。
旧定義（〜Config 2026前） 「AIスキル」＝プロンプトを書ける ＋ できればコードも読める ＋ APIの仕様を把握している
新定義（Config 2026以降） 「AIスキル」＝自分がほしいツールを言葉で説明できる ＋ 出力を評価・調整できる ＋ チームに展開できる
言い換えれば、求められる力の重心が「コード実装力」から「要件定義力」に移動した。「何が困っているか」「どう動けばいいか」を明確に言語化できるデザイナーが、最もGenerative pluginsを使いこなせる。
これはデザイナーにとって、むしろ得意領域の話だ。ユーザー体験を言語化し、仕様を整理し、チームに説明する力は、デザイン業務の中核にある。Generative pluginsはその力をそのままプラグイン作成に転用できる構造になっている。
向いている用途と向かない用途
向いているケース
- チーム内で繰り返し発生するタスクを自動化したい（例：スペーシング統一・スタイル一括置換・命名規則チェック）
- プロジェクト固有のルールに基づく操作を自動化したい（例：特定のコンポーネントセットだけを書き出す）
- 小規模なワークフロー改善を低コストで実験したい
向かないケース（現時点で公式に確認できる範囲での推測）
- 外部APIと複雑に連携する高度なプラグイン（認証・データ連携が絡む処理）
- パフォーマンスを極限まで最適化した処理（生成コードの精度はプロンプト品質に依存する）
- 既存の大規模プラグイン（Unsplash連携等）の代替として使う場合
なお、向かないケースについては公式発表の範囲を超えた断定は避ける。実際に試して確認してほしい。
使い始める前に確認しておくこと
現時点（2026年6月26日）で、Generative pluginsの利用に必要なプランや権限の条件は公式で明示された情報が確認できていない。同じくConfig 2026で発表されたCode Layers（デザインキャンバスにReact/npmコードを直接置く機能）は2026年7月よりウェイトリストベータ開始と公式発表されているが、Generative pluginsの展開スケジュールはTechCrunch記事や公式サイトで最新状況を確認することを推奨する。
確認するポイント：
- 自分のFigmaプランでGenerative pluginsが使えるか
- ベータ版の場合、参加申請が必要かどうか
- 組織・チームプランでの利用可否と管理権限の設定
今すぐできる次の一歩
コードを書けなくても、今日から準備できることがある。
言語化の練習をする 「自分のFigma作業でどんなプラグインがあれば楽になるか」を1つ書き出してみる。「ボタンのラベルが長いとき自動的に折り返しを調整してくれる」「選択したコンポーネントの命名ルール違反を検出してくれる」といった具体的な動作レベルで言語化しておくと、Generative pluginsが使えるようになったときにすぐ試せる。
公式情報をフォローする Figma公式ブログ・TechCrunch・Figma Community（プラグインギャラリー）で展開状況を確認する。カンファレンス直後は情報が更新されやすいタイミングだ。
既存プラグインで「プロンプトでできること」を体感する FigmaにはすでにAIを活用したプラグインが複数ある。それらを使って「プロンプト→Figma操作」の感覚をつかんでおくと、Generative pluginsへの移行がスムーズになる。
まとめ
Config 2026が示したのは、「プラグイン開発は一部のエンジニアのもの」という常識が終わりつつあるという事実だ。Generative pluginsは、コードを書かずにカスタムプラグインを作れる入口を開いた。同時に、デザイナーに求められるAIスキルの定義が変わった──コーディングではなく、要件を言葉にして伝える力が主役になる。
まず今日、「あったら楽になるプラグイン」を1つ書き出す。それが新しいスキルの出発点になる。
出典・参考
- TechCrunch（2026年6月24日）: Figma adds code layers, support for animations, more AI features in new update