2026年6月23日から25日、Figmaが主催する製品開発者向けのカンファレンス「Figma Config 2026」が開催されました。
本記事では、その基調講演で発表された新機能を簡潔にお伝えします。

新機能一覧

Figma Configでは、主に6つの新機能が発表されました。

機能名 概要
コードレイヤー Figma Designのキャンバスで作成できる、コードベースのインタラクティブなデザイン
Figma Motion Figma Designでアニメーションを作成できる新たなモード
シェーダーの塗りとエフェクト Figmaエージェントとの会話をもとにしたシェーダー作成
生成プラグイン Figmaエージェントとの会話をもとにしたプラグイン作成
Figma Weaveツール Figma Weaveの技術を活かした十数種類のワークフロー
エージェントスキル Figmaエージェントがスキルを参照できるように

コードレイヤー

コードレイヤーとは、Figma Designのキャンバスで作成できる、コードベースのインタラクティブなデザインです。

これまで、プロンプトを起点とし、実際のコードによって動くデザインのプロトタイピングはFigma Makeだけでした。
そのため、Figma Designのキャンバスでプロンプトをもとにデザインを探求するには、Figma Makeからレイヤーとして1画面ずつコピーしたり、MCPを用いてコードをレイヤーに変換したりするなど、いくつかの機能を組み合わせる必要がありました。

しかし、コードレイヤーの登場によって、デザイナーは慣れ親しんだ環境のままAIとともにデザインを探求できます。
コードレイヤーには以下のような特徴があります。

  • さまざまな作成・編集方法
  • ツールバーから
  • 既存のフレームから
  • チャットやコードエディタでFigmaエージェントに依頼
  • 複数のコードレイヤーを同時に動作でき、比較や探索が容易。
  • 既存のコードベースを取り込める。GitHubのリポジトリのインポートやローカルフォルダのアップロードで実現する。
  • Figma Makeで生成したコードをキャンバスに表示できる。
  • コードレイヤーから主要な画面を抽出し、Figmaレイヤーとして貼り付けられる。コードベースでも俯瞰した閲覧が容易に。

Figma Motion

Figma Motionは、Figma Designでアニメーションを作成できる新たなモードです。

  • タイムラインコントロール
  • キャンバス上の要素を選択して操作することで、その動きをアニメーションとして作成できます。アニメーションは編集可能なタイムラインとして作成されます。そのため、編集やレビューのようなコラボレーションが容易になります。
  • アニメーションスタイル
  • フェード、移動、拡大縮小のようなアニメーションスタイルをプリセットとして登録できます。これを利用すれば、すぐにアニメーションを適用し調整することができます。アニメーションコンポーネントや変数としても登録できます。
  • AIエージェントとの作成
  • AIエージェントとの会話をもとに、アニメーションを作成できます。AIエージェントとともに作成したアニメーションも、Motionモードによってユーザーの手で編集できます。

Figma Motionで作成したアニメーションは以下の方法で容易に開発チームに共有できます。
– MP4、webm、SVG、GIFとしてエクスポート
– Devモードでのコードのコピー
– MCPによる実装

シェーダーの塗りとエフェクト

Figmaエージェントとの会話をもとにシェーダーを作成できるようになります。
既存のシェーダーに加えて、自分好みのエフェクトを作成したり、単色やグラデーションに留まらない表現を模索したりできます。

生成プラグイン

Figmaエージェントとの会話をもとに、プラグインを作成できます。
プラグインの作成はこれまでも他社のAIチャットツールなどを用いて実施できましたが、Figma上で完結するようになります。

Figma Weaveツール

Figma WeaveがFigma Designのキャンバスでツールとして操作可能になります。

Figma Weaveとは、Figmaが2025年の秋に買収、統合したサービスです。
Figma Weaveは、ノードベースのキャンバスで生成ワークフローを構築できます。モデルを接続したり、アセットを変換したり、出力を洗練させたり、アプローチを比較したりできます。

そんなFigma Weaveの技術を活かした十数種類のワークフローが、Figma Designの左パネルからアクセスできるようになります。

エージェントスキル

先日リリースされたFigmaエージェントが、スキルを参照できるようになりました。
これにより、特定の手順に沿った作業をFigmaエージェントに依頼しやすくなります。

まとめ

アップデートの激しい生成AI業界において、キャンバス上でのAIエージェントとのやりとりやスキルの参照などのような機能は、一見すると目新しさがないように映るかもしれません。
しかし、これからも多くのサービスはあらゆるステークホルダー間のコラボレーションによって生まれていきます。そして、多くのソフトウェアデザイナーにとって最も慣れ親しんだ作業場はFigmaです。

デザイナーが日々向き合うキャンバスから生成AIとその成果物にシームレスにアクセスしやすくなったことは、それだけで想像以上に力強いアップデートなのかもしれません。

参考文献