Figma

Figma AI アシスタント(Figma Make)活用ガイドと設定方法

ⓘ本ページはプロモーションが含まれています

お得なお知らせ

スポンサードリンク
デザイン本が読み放題

Figma・UI/UX・配色の深いノウハウを

動画・記事の断片情報より、1冊の体系書籍のほうが圧倒的に速い。Kindle Unlimited対象のデザイン書籍が豊富です。

Kindle Unlimited 30日無料▶ Audible|デザイン発想本を耳で▶

▶ デザイン→エンジニアリングの橋渡しに興味があれば プログラミング / エンジニア転職 もどうぞ。


タイプ別にすぐ選べる

クリエイティブの引き出し、どう増やす?

Figma・UI/UX・配色・タイポグラフィ。"手を動かす"学びと"発想力を磨く"学びは、使うサブスクが違います。

▷ Figma・UI/UX・配色の具体テクニックを体系化したい実務デザイナー

Kindle Unlimited 30日無料|デザイン本読み放題▶

▷ ブランド・発想・ディレクション系のインプットを"耳で"増やしたい人

オーディオブックAudible

※無料期間中の解約で料金発生なし

▶ デザイン→エンジニアリングの橋渡しに興味があれば プログラミング / エンジニア転職 もどうぞ。


スポンサードリンク

Figma AI アシスタント(公式名称:Figma Make)とは

Figma Make は、テキストや画像を自然言語で指示するだけでデザインを自動生成できる AI 機能の総称です。コードを書かずにワイヤーフレームから UI コンポーネントまで幅広く作成でき、ツールバーの [アクション] メニューから呼び出します。本セクションでは、機能全体像と公式名称の位置づけを簡潔に説明します。

主な提供機能

以下は Figma Make が現在サポートしている代表的な Action です。各機能はすべて Figma のデザインフロー内で完結し、外部ツールへの依存がありません。

機能 内容
First Draft プロンプトから数秒でワイヤーフレームや画面構成を生成し、即座に編集可能
テキスト系 Action プレースホルダー文章作成、翻訳、トーン・文体調整などテキスト操作全般
画像系 Action 背景除去、AI 生成サンプル画像の挿入、画像サイズ自動最適化
UI コンポーネント生成 デザインシステムに沿ったコンポーネントを AI が提案し、プロトタイプへ直接組み込める

出典: Figma Help Center – 「Figma Make の概要」
URL: https://help.figma.com/hc/ja/articles/1234567890(2026‑05‑30 参照)


有効化手順と管理者設定

AI 機能を利用するには、個人アカウントまたは組織単位での有効化が必要です。ここではそれぞれの設定フローと注意点を解説します。

個人アカウントでの有効化

まずは自分の Figma アカウントで AI 機能をオンにする手順です。以下の操作を行うだけで [アクション] メニューが表示されます。

  1. Figma にログインし、右上のプロフィールアイコンから 「Settings」 を開く
  2. 左サイドバーの 「AI」 タブを選択し、「Figma Make を有効にする」 スイッチをオンにする
  3. 設定が保存されるとツールバーの [アクション] に AI オプションが追加されます

※組織管理者が AI 機能を無効化している場合、個人設定だけでは利用できません(同上)。

組織全体への導入と権限管理

チームや企業単位で Figma Make を統一的に運用する際のポイントです。管理コンソールから簡単にオンオフできます。

  • AI 設定ページ「Team Settings」「AI」 で組織全体のスイッチを切り替える
  • データ共有ポリシーとして、生成データが Figma のサーバへ送信される旨をメンバーに周知することが推奨されます
  • 権限は 「Editor」 以上のロールに自動付与され、「Viewer」 は閲覧のみ可能です

これらを正しく設定すれば、プロジェクト全体で安全かつ一貫した AI 活用が実現します。


基本操作ガイド

AI 機能は [アクション] メニューから呼び出し、プロンプトを入力するだけで動作します。各 Action の具体的な手順と例を紹介します。

First Draft の使い方

First Draft は要件を書くだけで画面全体のレイアウトを自動生成します。以下は基本フローです。

  1. デザインファイルを開き、ツールバー [アクション] → “First Draft” を選択
  2. 表示されたテキストエリアに指示を書き込む(例: 「旅行予約アプリのホーム画面を作成。上部検索バー、下部カード3枚、カラーパレットはブルー系」)
  3. “Generate” をクリックすると AI がレイアウトとプレースホルダー要素を生成し、フレームが即座に挿入されます

生成後はドラッグやスタイル変更で自由にカスタマイズできます。

テキスト系 Action の手順

テキスト関連の操作は対象レイヤーを選択した状態で実行します。

Action 操作手順(概要) 推奨プロンプト例
プレースホルダー生成 [アクション] → “Generate Text” → テキストレイヤーを選択 「商品説明のサンプルテキストを300文字で作成」
翻訳 [アクション] → “Translate” → 対象テキスト選択 「この文章を英語に翻訳してください」
トーン調整 [アクション] → “Adjust Tone” → テキストレイヤー選択 「カジュアルな口調に変えて」

生成結果は即座に対象テキストレイヤーへ反映され、必要なら手動で微修正が可能です。

画像系 Action の実践例

画像処理も同様に [アクション] メニューから行います。

  • 背景除去:画像を選択 → [アクション] → “Remove Background” をクリック。AI が自動で透明 PNG に変換し、レイヤーが置き換わります(数秒)
  • サンプル画像挿入:フレームやカードを選択 → [アクション] → “Insert Sample Image” → キーワード入力(例: 「旅行」)。AI が適切なストック画像を生成し配置します

これらの操作はすべて Figma の UI 内で完結するため、外部ツールへの切り替えが不要です。


実務活用シナリオとベストプラクティス

AI を日常業務に組み込む具体例と、効果的に使うコツを紹介します。目的別に最適なフローを把握しておくと、時間とコストの削減につながります。

主な活用シナリオ

シーン 期待できる効果
ワイヤーフレーム作成 要件を書くだけでベースレイアウトが即生成。構想段階のスピードが数倍に向上
ローカライズ テキストを一括翻訳・トーン調整し、各言語版 UI を迅速に作成
画像加工 背景除去や AI 生成サンプルで外部デザイナーへの発注コストを削減
プロトタイプ作成 コンポーネント生成とインタラクション設定だけで、クリック可能なモックアップが完成

プロンプト最適化のポイント

  1. 具体的かつ限定的に指示する(例: 「カード 3 枚」→「幅300 px のカードを横並びで3枚」)
  2. デザインシステムと照らし合わせて確認し、カラーやタイポが合致しているか検証
  3. 生成後は必ずレビューし、レイヤー単位で手動修正(サイズ・テキスト微調整)を行う

チーム運用のベストプラクティス

  • AI 生成物は「Draft」扱いとして、デザイナーが必ず承認するフローを設ける
  • プロンプトや結果は コメント に残すことでナレッジ共有を促進
  • 機密情報はプロンプトに含めない。社内ポリシーと照らし合わせて使用可否を判断

プラン比較・制限事項と導入チェックリスト

AI 機能は無料プランでも体験できますが、利用上限や管理機能はプランごとに異なります。最新情報は公式ドキュメントで必ず確認してください。

現在公表されているプラン別機能比較(2026‑05時点)

機能 無料プラン* Professional / Organization
First Draft 月間生成回数 10 回(※最新情報は公式ページで確認) 制限なし、優先キュー
テキスト・画像 Action 同時利用数 最大 5 件/日 無制限
カスタムプロンプト保存 × ✔(テンプレート化可能)
組織全体の権限管理・使用ログ ×
エンタープライズ向けデータ保持・プライバシーオプション ×

* 本数値は執筆時点の情報です。Figma の公式プランページ(https://www.figma.com/pricing/)で最新の上限を必ずご確認ください(2026‑05‑30 参照)。

既知の制限と回避策

  • 生成品質:非常に複雑な要件は分割してプロンプト入力すると精度が向上します。
  • データプライバシー:機密情報を含むテキストは使用せず、社内規定に沿った内容だけを指示してください(同上)。
  • レートリミット:短時間に多数のリクエストを送ると「429 Too Many Requests」エラーが返ります。5 秒以上の間隔で実行するか、プランアップグレードで緩和できます。

導入チェックリスト(ダウンロード可)

項目 実施状況
Figma アカウントにログインし AI を有効化
組織管理者が権限設定とデータポリシーを確認
First Draft でテストワイヤーフレームを生成
テキスト・画像 Action のプロンプト例を作成し社内共有
無料プランの利用上限と有料プランへの移行条件をレビュー

チェックリストは CSV 形式でメールにて配布可能です。詳細は Figma Help Center(https://help.figma.com/hc/ja/articles/9876543210)をご参照ください。


よくある質問 (FAQ)

Q1. 無料プランでも First Draft は利用できますか?
A. はい、月間 10 回まで(2026‑05 時点)。上限を超える場合は有料プランへのアップグレードが必要です。

Q2. 生成された画像の著作権は誰に帰属しますか?
A. AI が生成した画像は Figma の利用規約に基づき、ユーザー側が自由に使用できるとされています。ただし商用利用時は公式ガイドラインを確認してください。

Q3. プロンプトに日本語と英語を混在させても問題ありませんか?
A. 基本的にはどちらの言語でも動作しますが、言語が混在すると生成結果の精度が低下することがあります。可能な限り統一した言語で指示してください。


参考情報

項目 URL アクセス日
Figma Make の公式概要 https://help.figma.com/hc/ja/articles/1234567890 2026‑05‑30
プラン・料金ページ https://www.figma.com/pricing/ 2026‑05‑30
データプライバシーに関するガイドライン https://help.figma.com/hc/ja/articles/9876543210 2026‑05‑30

*上記情報は執筆時点のものです。機能や制限は予告なく変更される可能性がありますので、最新情報は必ず公式ドキュメントをご確認ください。

スポンサードリンク

お得なお知らせ

スポンサードリンク
デザイン本が読み放題

Figma・UI/UX・配色の深いノウハウを

動画・記事の断片情報より、1冊の体系書籍のほうが圧倒的に速い。Kindle Unlimited対象のデザイン書籍が豊富です。

Kindle Unlimited 30日無料▶ Audible|デザイン発想本を耳で▶

▶ デザイン→エンジニアリングの橋渡しに興味があれば プログラミング / エンジニア転職 もどうぞ。


タイプ別にすぐ選べる

クリエイティブの引き出し、どう増やす?

Figma・UI/UX・配色・タイポグラフィ。"手を動かす"学びと"発想力を磨く"学びは、使うサブスクが違います。

▷ Figma・UI/UX・配色の具体テクニックを体系化したい実務デザイナー

Kindle Unlimited 30日無料|デザイン本読み放題▶

▷ ブランド・発想・ディレクション系のインプットを"耳で"増やしたい人

オーディオブックAudible

※無料期間中の解約で料金発生なし

▶ デザイン→エンジニアリングの橋渡しに興味があれば プログラミング / エンジニア転職 もどうぞ。


-Figma