Figmaに精通した編集モデルのトレーニング方法

Figmaに精通した編集モデルのトレーニング方法

デザイナーは、新しいアイデアの模索から製品全体の構築まで、Figmaを幅広い用途で使用しています。しかし、日常的な作業の多くは、より小規模で反復的、そしてしばしば検証不可能なものです。スペーシングの調整、色の変更、フィードバック後のレイアウトの修正など、各変更はそれまでの決定に基づいています。だからこそ、私たちはFigmaエージェントを構築するにあたり、デザイナーがキャンバス上の既存の作業を編集するのを支援するという、焦点を絞ったタスクから始めました。

［画像: ピーチ色のアームチェア、低い木製テーブル、花瓶、円形の壁掛け照明、右上に矢印アイコンが配置された「Open space」カード。］［画像: ピーチ色のアームチェア、低い木製テーブル、花瓶、円形の壁掛け照明、右上に矢印アイコンが配置された「Open space」カード。］

プロンプト: 写真の左上に位置タグコンポーネントを挿入してください

［画像: 1. 同じインテリアの「Open space」カード。左上に白い「Location」バッジがあり、右上に矢印アイコンがあります。］［画像: 1. 同じインテリアの「Open space」カード。左上に白い「Location」バッジがあり、右上に矢印アイコンがあります。］

出力: 要求された位置タグは存在し、判読可能で、含まれています。無関係なコンテンツは保持されています。

私たちは、エージェントがデザインにおいてより優れ、編集作業においてより高速であることを目指しました。そして、デザイナーは一日中これらの作業を行うため、スピードは重要です。編集に時間がかかりすぎると、支援するはずのワークフローが中断される可能性があります。

Figmaでの編集をモデルに教える

この作業を開始した当初、最先端のモデルはFigmaの構文を理解できず、これを機能させるには膨大なシステムプロンプトが必要で、トークン消費量が非常に多くなりました。代わりに、私たちは教師ありファインチューニング（SFT）に投資しました。各トレーニング例は、開始デザインと生成された合成編集リクエスト、そして変更の成功例をペアにしたものです。Figmaのネイティブファイル形式でデザインを表現したため、モデルはキャンバスに適用できる変更を生成することを学びました。タスクがデザインシステムのアセットを必要とする場合、テーマやコンポーネントの変更をカバーする合成プロンプトを生成しました。

次に、より大きな教師モデルを使用してそれらの編集を試行し、候補を決定論的バリデーターと視覚モデルジャッジでチェックしました。これには、有効な出力とリクエストの履行に関するチェックが含まれます。生成パイプラインは、評価者のフィードバックを使用して自己修復し、編集を修正することができました。

そのアプローチは驚くほど効果的でした。250,000以上の例でトレーニングされた初期のLlama 3.3 70Bモデルの1つでさえ、当時のトップモデルに匹敵する編集タスクのパフォーマンスを達成することができました！

［画像: トレーニングパイプライン図。ユーザーコンテンツ、インタラクション履歴、デザインシステムが、トレーニングデータ生成、評価者構築、モデルトレーニング、デザイナーアノテーションによって情報提供されるLLMジャッジトレーニングにリンクされています。］［画像: トレーニングパイプライン図。ユーザーコンテンツ、インタラクション履歴、デザインシステムが、トレーニングデータ生成、評価者構築、モデルトレーニング、デザイナーアノテーションによって情報提供されるLLMジャッジトレーニングにリンクされています。］

私たちの初期のSFTパイプライン

しかしそれ以来、私たちは新しいQwenモデル、Muse Spark Open、Inklingなど、より能力の高いベースモデルへと移行しました。また、この特定の目的のためにSFTのみを使用することの限界にも直面しました。模倣学習は、汎化能力の損失を犠牲にして、トレーニングで見られたものと非常に似たデザインをモデルに生成させます。さらに、サンプル効率が悪く、タスクのさまざまな側面をカバーする多くの例が必要になります。そのため、最新のトレーニングレシピの一部として、強化学習（RL）にも投資しています。私たちの焦点は、デザイン領域のためのより良いRL環境、トレーニングする例の全体的な多様性の向上、報酬モデルの形成、そしてデザイナーが実際に気にかけていることを反映する報酬を拡張するための専門家作成の基準の拡大にあります。

デザイン編集の評価方法

モデルが良い出発点であるかどうかを判断するために、内部評価を実行します。私たちは、Figmaでどれだけうまく機能するか、指示にどれだけ従うか、既存のデザインにどれだけ有用な変更を加えるかだけでなく、その作業のスピードとコストも重視します。

優れたデザインはしばしば主観的ですが、だからといって品質を測定不能な単一のものとして扱う必要はありません。あるデザインは良好な配置を持ちながらコントラストが低い場合があります。編集は洗練されて見えても、リクエストを満たしていない可能性があります。ボタンは正しく見えても、間違ったコンポーネントを使用している場合があります。

以下の例は、AI生成デザインでよく見られるエラーを示しています。

［画像: 120ドルのアンゴラカーディガンと120ドルのキルティングジャケットの衣料品カード。ブランド名の上にハートアイコンが重なっています。］［画像: 120ドルのアンゴラカーディガンと120ドルのキルティングジャケットの衣料品カード。ブランド名の上にハートアイコンが重なっています。］

重なり合ったアイコンとテキスト

［画像: 右揃えの配送およびポリシーパネル。推定配達日、トラックとポリシーのアイコン、および部分的にクリップされたドロップダウン矢印が表示されています。］［画像: 右揃えの配送およびポリシーパネル。推定配達日、トラックとポリシーのアイコン、および部分的にクリップされたドロップダウン矢印が表示されています。］

クリップされた矢印

［画像: 1泊200.7ドルのホテル予約カード。場所と説明のテキスト、部屋のプレビュー、紫色の「Booking Now」ボタンが重なっています。］［画像: 1泊200.7ドルのホテル予約カード。場所と説明のテキスト、部屋のプレビュー、紫色の「Booking Now」ボタンが重なっています。］

重なり合ったテキスト要素

私たちはこれらの次元を個別に評価します。デザインの構造に関するチェックと視覚的ジャッジを組み合わせ、専門デザイナーが結果を調整・レビューします。これにより、モデルがどこで成功し、何を学ぶ必要があるかを理解することができます。

例えば、私たちの内部Figma編集評価でいくつかのトップモデルがどのようにスコアされたかを示します。これも、製品で使用を検討するモデルを決定するために使用する多くの入力のうちの1つにすぎません。

［画像: Figmaデザイン編集v3が77.8%、Sol 6.1が76.9%と比較された水平棒グラフ。］［画像: Figmaデザイン編集v3が77.8%、Sol 6.1が76.9%と比較された水平棒グラフ。］

Qwen 3.8 27Bで追加トレーニングされた最新の未リリースFigma編集モデルと、デザイン編集タスクにおける他のサードパーティモデルとの比較

このモデルがFigmaエージェントで果たす役割

今月初め、私たちはすべてユーザーにFigmaエージェントをロールアウトしました。これには、自社開発の編集モデルが含まれています。エージェントは、この専門モデルと主要なサードパーティモデルの両方を実行し、作業のさまざまな部分に使用します。画像生成、ベクター、または全く新しいデザイン探索のような特定のタスクには、利用可能な最高のサードパーティモデルを使用します。私たちのモデルがうまく処理できる正確な編集やイテレーションには、自社モデルを使用します。

周囲のキャンバスも重要です。エージェントは、キャンバスやデザインシステムからのコンテキスト、そして要求された変更を行うツールを必要とします。ポストトレーニングは、モデルがその作業の一部をより良く行うのに役立ちます。

［画像: Figmaのエージェント］［画像: Figmaのエージェント］

Figmaエージェントで見られた初期の結果に励まされています。ベータ版から一般提供までの間に、典型的なタスクは約20%高速化しました。専門デザイナーとの直接対決テストでは、新しいエージェントは以前のプロダクションエージェントを62%の時間で上回るか同等でした。ユーザー評価は33%高く、ユーザーはエージェントの作業を60%少なく元に戻しています。

自社開発のポストトレーニング済みデザインモデルが処理する作業の割合を2倍以上に増やしました。そして、メッセージあたりの平均コストを削減しました。これらの進歩は、モデル、ツール、ハーネスを含むエージェント全体の改善から来ています。私たちの編集モデルは、その進歩の一部であり、デザイナーが最も頻繁に繰り返すタスクを改善し続ける方法を提供してくれます。

次に進むべき道

この作業は、ポストトレーニングされたモデルが、Figma編集のような専門的なタスクにおいて最先端モデルと競合できることを示しました。焦点を絞った問題から始めることで、進歩をユーザーにとって意味のある製品アップデートに変えることができ、個々の編集の管理に費やす時間を減らし、ビジョンを実現することにもっと時間を費やすことができるようになります。

デザインと、検証不可能なドメイン向けのポストトレーニングモデルに興味がある方は、募集中の職種をご覧ください。現在採用中です。

私たちは、顧客のプライバシーと好みを尊重する方法でトレーニングを行っています。私たちの取り組みについては、こちらで詳しく知ることができます。