Figmaの進化：コードレイヤー、AIプラグイン、そしてモーションサポート
Figmaは、最新の大型アップデートにより、デザインと開発の境界線を根本から再定義しようとしています。コードレイヤーと生成AI機能をコラボレーション用のキャンバスに直接統合することで、このプラットフォームは静的なプロトタイピングツールから、ダイナミックで多角的な環境へと変貌を遂げています。
コードレイヤーによるギャップの解消
「デザイン・トゥ・コード（design-to-code）」の等価性を目指す重要なステップとして、Figmaはマルチプレイヤー・キャンバス上に直接コードレイヤーを導入しました。この機能により、エンジニアリングチームはリポジトリをクローンし、既存のコードフローをデザインレイヤーへと抽出して、迅速なテストやイテレーションを行うことが可能になります。
デザイナーが静的なファイルを開発者に渡す従来のワークフローとは異なり、Figmaのチーフ・プロダクト・オフィサーである山下裕樹氏は、この環境は「本番環境レベルの完璧さ」のためではなく、「探索」のために構築されていることを強調しています。デザイナー、プロダクトマネージャー、エンジニアが空間的かつ非線形な方法でコードと対話できるようにすることで、Figmaは製品開発のディスカバリー（発見）フェーズを加速させ、ハンドオフのプロセスで頻繁に発生する摩擦を軽減することを目指しています。
高度なモーション、シェーダー、および3Dトランスフォーム
長年、高精度なモーションデザインを行うには、デザイナーがFigmaと専用のアニメーションソフトウェアの間を行き来する必要があり、複雑な変換プロセスが生じることがよくありました。Figmaは、アニメーション、トランジション、および3Dトランスフォームへのネイティブサポートを追加することで、この複雑さを解消しようとしています。
また、今回のアップデートではシェーダーエフェクトとフィルのサポートも導入され、ビジュアルツールキットが拡張されました。これにより、より洗練された高性能なビジュアル要素をツール内でプロトタイプ化できるようになり、製品の「質感（feel）」を開発サイクルのより早い段階で捉えることが可能になります。
生成AIとカスタムプラグインの作成
Figmaは、キャンバスをプログラマブルなワークスペースへと変えることで、AIロードマップへの取り組みを強化しています。ユーザーはテキストプロンプトを使用して、AIエージェント向けの再現可能な「スキル」を作成できるようになり、AIアシスタントを汎用的なツールではなく、カスタマイズされたコラボレーターへと進化させることができます。精度を高めるため、AIはNotion、Excel、GitHub、Granolaなどの外部ツールや、アップロードされた様々なファイルからコンテキストを取り込むことが可能です。
開発者コミュニティにとっておそらく最も画期的なのは、シンプルなプロンプトを通じてカスタムプラグインを作成できる機能です。特定のレイアウトジェネレーターが必要な場合でも、複雑なベクターパストレーサーが必要な場合でも、従来のコードを書くことなく、Figma内で独自の機能的なツールを構築できるようになります。
モデル駆動型ワークフローのためのWeavy統合
ノードベースのツールであるWeavyの買収に基づき、Figmaは高度なモデル駆動型ワークフローの統合に取り組んでいます。今年後半には、ユーザーはFigmaのインターフェース内で直接Weavyワークフローを生成できるようになります。これにより、デザインチームは異なるAIモデルを通じて複雑なワークフローを実行して出力を比較できるようになり、選択したデザインの方向性がさまざまな生成パラメータにおいて最適化されていることを確認できます。
主なポイント
- コードとデザインの等価性: 新しいコードレイヤーにより、チームはリポジトリのデータをキャンバスに取り込むことができ、デザイン環境をエンジニアとデザイナーのための真のコラボレーションスペースにします。
- ネイティブなモーションとシェーダー: Figmaは3Dトランスフォーム、トランジション、シェーダーエフェクトをサポートし、外部のアニメーションソフトウェアの必要性を軽減します。
- AIによる拡張性: ユーザーはテキストプロンプトを介して、GitHubやNotionからの外部データと統合されたカスタムプラグインや再現可能なAI「スキル」を生成できるようになります。