FigmaMakeとは何か
FigmaMakeは、2026年初頭に一般公開されたAI搭載のデザインツールです。Claude Sonnet 4をベースにしており、テキストプロンプトからインタラクティブなReactアプリを生成できます。デザインツールとしてのFigmaに、AI生成機能が統合された形で提供されています。
リリース時期は2025年後半にβ版として静かにローンチされ、2026年初頭に一般利用が可能になりました。2026年1月22日にはFigma Design、FigJam、Figma Slidesへの埋め込み機能が追加され、4月2日にはMake kitsとMake attachmentsが導入されました。これにより、実際のコンポーネントやデータ、制約を反映したプロトタイプ生成が可能になっています。
価格体系はFigmaの料金プランと統合されており、Freeプランでは1日あたり150 AI credits、月間最大500 AI creditsまで利用できます。Professionalプランでは月間3,000 AI credits、Organizationプランでは3,500 AI credits、Enterpriseプランでは4,250 AI creditsが提供されます。β版単体では月額20ドルで提供されており、将来的にはProサブスクリプションへのバンドルが予定されています。
主な機能は4つです。プロンプトからUI生成機能では、テキスト記述からレイアウト、コンポーネント、基本的なアプリ構造を自動生成します。インタラクティブプロトタイピング機能では、クリッカブルなボタンやシンプルなインタラクション機能を実装できます。コンテキスト認識デザイン機能では、既存のFigmaライブラリからコンポーネントやスタイルを活用して、ブランド統一されたデザインを生成します。コードベースプロトタイプ機能では、実際に動作する編集可能なコードを出力できます。
編集方式はポイント&エディット方式を採用しており、プレビュー画面上で任意の要素を選択し、チャットインターフェースで直接変更を依頼できます。デザインの微調整がスムーズに行える設計になっています。
実際に使って感じた3つのメリット
実際にFigmaMakeを使用してみて、特に優れていると感じたのは3つのポイントです。
1つ目はコスト面の優位性です。Claudeを直接APIで叩くよりも圧倒的に安価です。Figmaの料金プランに含まれるAI creditsを活用すれば、追加コストを抑えながらAIデザイン機能を利用できます。スタートアップや予算に制約がある開発チームにとって、この価格設定は大きな魅力です。
2つ目はデザイン速度の速さです。ClaudeCodeと比較しても、デザインを起こす速度は明らかに早いです。これはFigmaMakeがデザインに特化したLLMを活用しているためと考えられます。プロンプトを入力してから数秒でUIが生成され、修正も即座に反映されるため、アイデアを素早く形にできます。デザイン案を複数パターン出すような場面では、この速度が大きなアドバンテージになります。
3つ目はFigma連携の利便性です。生成されたデザインはFigmaのデザインデータとして書き出せるため、そのまま修正や調整が可能です。AI生成後に人間のデザイナーが細部を調整するワークフローがスムーズに回ります。また、ベンチマークとなるデザインを渡すと、ある程度スタイルを踏襲してくれます。パターン出しも得意で、1つのコンセプトから複数のバリエーションを生成できます。
注意すべき5つのデメリット
一方で、実使用を通じて見えてきたデメリットも複数あります。
1つ目はシングルスレッド制約です。複数のタスクを並行して処理できません。あるデザイン生成が完了するまで、次のタスクをキューに積むこともできません。チームで同時に複数のデザイン案を検討したい場合には、この制約がボトルネックになります。
2つ目は日本語デザインの甘さです。文字のカーニングやLine heightの調整が甘く、日本語UIのデザインには不慣れな印象を受けました。英語圏のデザインを前提に学習されているためか、日本語の長文を含むUIでは視認性が低下する場合があります。日本語メインのサービスでは、生成後に人間が細かく調整する必要があります。
3つ目は動的処理での不安定さです。API結合を考慮したデザインや、データの動的表示を含むUIを指示すると、ちょこちょこバグが発生します。静的なプロトタイプであれば問題ありませんが、動的な要素が絡むと生成結果が不安定になる傾向があります。
4つ目は画像RAG情報の読み込み失敗です。画像をRAG情報（参考資料）として渡そうとすると、ほぼ確実に読んでくれません。デザインのベンチマークとして画像を渡す場合には、別の方法を検討する必要があります。
5つ目は日本語RAG情報への対応の弱さです。日本語でデザインの要件や参考情報を渡しても、うまく反映されないことが多いです。これについては対策があり、RAG情報はすべて英語で渡す、もしくはClaudeDesignで生成したHTMLなどのコードベースで渡すと精度が上がります。
実用的なTips — こうすれば使いやすくなる
デメリットを踏まえた上で、実際の運用で役立つTipsをいくつか紹介します。
まず、RAG情報は英語化することです。日本語の要件定義書をそのまま渡すのではなく、英語に翻訳してから渡すことで、生成精度が大きく向上します。ChatGPTやDeepLなどの翻訳ツールを併用する一手間が、結果的に時間短縮につながります。
次に、コードベースで情報を渡すことです。デザインの参考情報を自然言語で説明するのではなく、ClaudeDesignやCursorなどで生成したHTMLやCSSのコードを渡すと、FigmaMakeがより正確に意図を理解してくれます。既存のコンポーネントライブラリがある場合は、そのコードを参照させることで、一貫性のあるデザインが生成されます。
3つ目は、静的実装に留めることです。動的なAPI連携やリアルタイム更新を含むUIは避け、あくまで静的なプロトタイプとして生成することで、安定した品質を保てます。動的な機能は、プロトタイプ検証後の実装フェーズで開発者が追加する方が確実です。
4つ目は、ベンチマークを活用することです。デザインの方向性を示す参考デザインをベンチマークとして渡すと、スタイルやトーンをある程度踏襲してくれます。パターン出しの際には、ベンチマークを複数パターン用意して試すことで、多様なバリエーションを引き出せます。
どんな用途に向いているか
FigmaMakeが真価を発揮するのは、プロトタイプ作成です。実際に使用した感覚として、プロトタイプ用途では最高レベルの製品だと評価できます。
具体的には、アイデア検証フェーズでの素早いUI試作、デザインパターンの複数案出し、スタートアップにおけるMVP（Minimum Viable Product）開発、クライアントへのデザイン提案の初期段階などが適しています。特に、スピードを重視する場面では大きな武器になります。
一方で、本番運用のUIデザインには不向きです。日本語デザインの細部調整が必要な点、動的処理が絡む場合の不安定さ、複数タスクの並行処理ができない点を考慮すると、本番環境での使用には慎重な判断が求められます。プロトタイプ段階で検証を終えたら、人間のデザイナーとエンジニアが引き継いで実装する流れが現実的です。
また、英語圏のサービスや、グローバル向けのUIであれば、日本語デザインの弱点が目立ちにくいため、より広い範囲で活用できます。
AIデザインツールの今後
FigmaMakeは、AIデザインツール市場における一つの選択肢に過ぎません。競合ツールも急速に台頭しています。
2026年にはAnthropicがClaude Designを投入しました。これはFigmaのライバルとして位置づけられており、プロンプトからプロトタイプを生成する機能を提供しています。同じく2026年3月には、GoogleがStitchのβ版を公開しました。自然言語や手書きのスケッチからUI生成が可能で、コード出力にも対応しています。
これらのツールの登場は、バイブコーディングというトレンドの一部です。バイブコーディングとは、自然言語で開発意図をAIに伝え、生成されたコードやUIを基に手直しを繰り返す開発手法を指します。Cursor、GitHub Copilotなどのツールと並んで、FigmaMakeもこの流れの中に位置づけられます。
日本国内のAIシステム市場は、2024年に1兆3,412億円に達し、前年比56.5%の成長を記録しました。2029年には4兆1,873億円まで拡大すると予測されており、AIデザインツールへの投資も今後さらに加速するでしょう。最高データ責任者の約8割がAI投資を優先しているという調査結果もあり、企業のAI活用戦略においてデザイン自動化は重要な領域になります。
デザイナーとエンジニアの役割も変化しつつあります。デザイナーはピクセル単位の調整作業から解放され、UXコンセプトやユーザー体験の設計により多くの時間を割けるようになります。エンジニアは、プロトタイプ作成のハードルが下がることで、アイデアを素早く検証し、開発の初期段階で多くの失敗を経験できるようになります。
FigmaMakeは完璧なツールではありませんが、プロトタイプ特化という明確な強みを持っています。日本語対応やRAG情報の扱いなど、改善の余地がある部分は今後のアップデートで解消される可能性もあります。AIデザインツールの進化は始まったばかりであり、これからの展開に注目です。
