この記事の結論
Figma AIは1行の文章からのUI制作や雑務の自動化、ワンクリックでのプロトタイプ開発、ワイヤーフレーム制作、プロトタイプのフロー自動調整、SNS・EC・ダッシュボード・マップアプリなど多様なデザインの制作、さらにはダミーテキストの自動生成まで対応しており、デザイン作業を幅広く支援できることが、紹介された12の事例からわかる。
Figma AIって何ができるの？
弊社ではAI導入支援を行っていますが、そのような声をよくいただきます。
本記事では、Figma AIでできることや活用事例についてわかりやすくまとめて紹介していますので、ぜひ最後までご覧ください。
なお、ご紹介する事例はすべて、2024年6月に開催されたConfig 2024の直後（ベータ期）に投稿されたものです。その後、Figma AIは2025年7月にベータを終了して一般提供となり、現在はプロンプトからアプリを作れるFigma Makeなども使えます。利用にはAIクレジットが必要で、プランごとに月間の上限が決まっています。
»出典：Figma Make Is Now Available to All Users(Figma)
Walkersでは「AIを用いたシステム開発のノウハウがない」「最大限に効率よく開発を進めたい」企業さまに、事業を成功に導くAI開発×補助金支援を行っています。⇒サービス概要はこちら
執筆者：山口 鳳汰
累計100万PV以上のAI・ノーコード開発メディアの編集長。
アプリ開発の電子書籍を3冊出版し、1冊はAmazonベストセラーを獲得。
その他、受託開発や教育など多数のノーコード事業に参画している。
運営会社：株式会社Walkers
AI・ノーコード開発を手がける成長支援カンパニー。
300件以上の開発/制作実績、200件以上の企業様を支援。
マーケティングやUI/UXと掛け合わせたサービス開発を得意としている。
執筆者：山口 鳳汰
累計100万PV以上のAI・ノーコード開発メディアの編集長。
アプリ開発の電子書籍を3冊出版し、1冊はAmazonベストセラーを獲得。
運営会社：株式会社Walkers
AI・ノーコード開発を手がける成長支援カンパニー。
これまでに300件以上の開発/制作実績、200件以上の企業様を支援。
Figma AIでできること・活用事例12選とは？
【事例①】1行の文章でUI制作
ついにFigmaではテキストからUIデザインを制作できるようになりました。まさに革命的な機能です。
【事例②】雑務の自動化
Figma内の雑務もAIによって自動化できるようになりました。Figmaユーザーからすると本当にありがたい機能です。
【事例③】ワンクリックでプロトタイプ開発
“ワンクリック”でできるため、ミーティング中にも活用できそうです。そのため、会議のスピードが早くなり予想以上の効率化が期待できます。
【事例④】ワイヤーフレームの制作
デザインまでいかずともサイトの全体像を考えたい時には、ワイヤーフレームだけの出力が可能です。段階に合わせて調整できるのも非常によいところです。
アプリ内のデータベースやワークフローを試すのに、適当でいいからUIデザインやサイトの全体像をイメージしたいと思ったら、figmaのプラグインで便利なのあった。
— エイト|wedコーダー (@eight_web) June 30, 2024
AIで数秒でワイヤーもデザインもできるみたい。
設計も言語化して伝えることができれば、完成度高めることも可能なのかな？… pic.twitter.com/uChnnAIMbE
【事例⑤】揺らぎの演出
細かいデザインについても対応可能であるため、より広範囲のデザイン作成が行えます。
【事例⑥】スライド変換
Figma AIで作ったデザインはスライドにも使えるため、どのようなユーザーにも応用可能です。
Convert Sticky Notes to Figma Slides, supafast!
— Zander Whitehurst (@zander_supafast) June 27, 2024
One of my fave AI updates is being able to convert sticky notes in FigJam to a polished Figma Slides deck.
Stickies to storytelling in seconds. pic.twitter.com/XpC6NDSkOG
【事例⑦】プロトタイプのフローの自動調整
細かな機能ではありますが、非常に嬉しい機能となっています。
あーこれもいいすね。
— tomoyuki|AI社員紹介所 (@sarukun99) June 28, 2024
プロトタイプの線を自動で繋いでくれる#FigmaAI pic.twitter.com/5DminUXv0F
【事例⑧】SNSデザイン制作
SNSのようなデザインも以下のように制作できます。
AI is finally bringing my dog only social network to life. @figma pic.twitter.com/Zb8Kz6Cb7c
— Matthew Berman (@TheMattBerman) June 27, 2024
【事例⑨】ECデザイン制作
ECサイトのようなデザインも以下のように制作できます。
嬉しいことにFigmaのUI3 + AIが早速解放されたので雑に触っている
— コム (@co6x0) June 28, 2024
今のところプロンプトは日本語より英語の方が精度高そうな感じがしている（この動画では英語で一度デザインを作ってから日本語に翻訳させた） pic.twitter.com/poAxfBKCnm
【事例⑩】ダッシュボードデザイン制作
ダッシュボードのようなデザインも以下のように制作できます。
かなりいいぞFigmaAI、超適当にダッシュボード作って言ったらつくってくれるw。 pic.twitter.com/YwxeNu3H7g
— tomoyuki|AI社員紹介所 (@sarukun99) June 28, 2024
【事例⑪】マップアプリデザイン制作
マップアプリのようなデザインも以下のように制作できます。
Figmaにプロンプト入力でかんたんにデザイン作成できるAI機能来た！
— ❖ ken｜旅するデザイナー @南米バンライフ旅 (@ken_tbdz) June 26, 2024
例えば、
「マップと店舗情報が表示されたピザ屋検索アプリ」
と入力すると、デザインを作成してくれる。
画像も生成され、スタイルも複数から選べる。#Config2024 pic.twitter.com/V6MZP5YVAL
【事例⑫】ダミーテキストの自動生成
Figma AIではダミーテキストも考えてくれるため、デザイナーはクリエイティブな作業に集中できます。本当にありがたい機能だと感じます。
この辺もいいですよね、
— tomoyuki|AI社員紹介所 (@sarukun99) June 28, 2024
ダミーのテキスト考えるときにいちいち
CahtGPT/Claudeいかなくていい#FigmaAI pic.twitter.com/dhtIlZqLdk
Figma AIでできること・活用事例の紹介は以上です。この情報がお役に立てていれば嬉しく思います。
Walkersでは成果が実証されたノウハウをもとに、事業を成功に導くためのAI開発×補助金支援を行っています。新規事業・システム開発でお悩みがある方はお気軽にご相談下さい。
無料セルフチェック
費用も、AI活用の効果も。まず無料でチェック
開発の概算費用と、業務のAI効率化診断。条件を選ぶだけで、その場で結果を確認できます。会社への問い合わせは不要です。
無料でチェックを始める →