FigmaがAI関連機能を発表 ビジュアル検索や生成AI、レイヤーの自動リネームなど #Config2024

#AI#Config2024#Figma#ニュース
投稿日: 更新日:
サムネイル

Figmaは、新製品発表会「Figma Config 2024」で、AI関連機能「Figma AI」を発表しました。AIを活用したビジュアル検索やテキスト生成ツール、レイヤーの自動リネームなどが搭載されます。

検索機能の強化

Figmaは、AIを活用したビジュアル検索とアセット検索を導入することを発表しました。

ビジュアル検索では、画像をアップロードするかキャンバス上の領域を選択することで、その画像に関連する既存のコンポーネントやデザインを検索できます。また、テキストで検索することも可能です。

Figmaのビジュアル検索のスクリーンショット
画像クレジット:Figma

ビジュアル検索を使うと、Figmaはユーザーがアクセスできるチームのすべてのファイルから検索し、類似したデザインを表示します。

もっとも関連性の高いフレームを現在のファイルに直接挿入することで、たとえば会社内で他のチームが作ったデザインを再利用するといったことが可能になります。

将来的には、Figmaコミュニティのファイルやアセットも検索対象になる予定です。その際には、元の作成者のクレジットが記載されたり、ソースファイルにアクセスしたりできるようになるとのことです。

Figmaは、[アセット]パネルにおけるアセット検索もAIを使って強化しました。検索キーワードが対象の名前に含まれていなくても、もっとも関連性の高いコンポーネントとアセットを表示できるようになります。

たとえば、「プライマリーボタン」と検索すると、「btn_large」という名前のコンポーネントを表示できます。従来の単純なキーワードマッチングよりも、より直感的な検索が可能になります。

作業を効率化するツール

AIを活用したテキストツール

AIを活用したテキストツールの導入も発表されました。クリックするだけで、テキストを翻訳したり、要約したり、書き換えたりできるようになります。

Figma AIでテキストを翻訳しているようす
画像クレジット:Figma

ダミーテキストと画像の生成

Figmaは、関連性の高いダミーテキストや画像をAIで生成する機能も導入します。デザインでは、Lorem Ipsumのようなダミーテキストや、プレースホルダー画像がよく使われます。

今後は、Figmaが自動的に関連性の高いダミーテキストや画像を生成してくれるようになります。

さらに、画像の背景を削除するツールも導入されます。これまでは、サードパーティーのプラグインや、Remove.bgといったWebサイトを使って背景を削除する必要がありました。Figma AIを使えば、サードパーティーのツールに頼らずに背景を透過できるようになります。

Figmaで画像の背景を透過しているようす
画像クレジット:Figma

クイッククリックプロトタイピング

[プロトタイプを作成]ボタンをクリックすると、静的なモックアップをインタラクティブなプロトタイプに変換できます。プロトタイプをキャンバス上で直接プレビューでき、より効率的にデザインできます。

Figma AIのクイッククリックプロトタイピングのスクリーンショット
画像クレジット:Figma

レイヤー名の自動変更

Figmaは、レイヤー名を自動的に変更する機能も導入します。ワンクリックでレイヤーの名前をコンテキストに応じた名前を自動変更できます。

Figmaでレイヤーの名前を自動変更しているようす
画像クレジット:Figma

プロンプトからのデザインの生成

アクションパネルの[デザインの作成]では、AIを使ってテキストプロンプトからUIレイアウトとコンポーネントを生成できるようになります。どのようなデザインが必要かをテキストで説明するだけで、FigmaのAIがドラフトを作成してくれます。

Figmaのアクションパネルのスクリーンショット
画像クレジット:Figma
Figmaのアクションパネルにテキストプロンプトを入力しているようす
画像クレジット:Figma

さらに、Figmaは将来的に、GoogleのMaterial 3デザインキットなどのデザインシステムを活用し、UIを生成できるようになる予定としています。最終的には、組織独自のデザインシステムのアセットやパターンを使用してUIを生成できるようになるとのことです。

Figma AIを使う方法

Figma AIは、2024年の間はベータ版として無料で提供されます。場合によっては、ベータ版の使用制限を導入する可能性があるとのことです。また、Figma AIの一般提供が開始されたら、価格などの詳細を発表するとしています。

現在、Figma AIはベータ版として提供されており、利用するにはウェイティングリストに登録する必要があります。

ウェイティングリストに登録するには、Figmaの右下に表示されているクエスチョンマークのボタンから、[UI3とAIのウェイティングリストに参加する]をクリックします。

Figmaのウェイティングリストの登録ボタンのスクリーンショット

Config 2024での発表

Config 2024では、Figma AIの他にも、UIデザインの刷新も発表しています。Figmaの新しいUIデザイン「UI3」については、こちらの記事で詳しく紹介しています。

参考

Xに共有する Blueskyに共有する Misskeyに共有する LINEに共有する Threadsに共有する
著者のアイコン画像

生まれた時から、母国語よりも先にJavaScriptを使っていました。ネットの海のどこにもいなくてどこにでもいます。

Webフロントエンドプログラマーで、テクノロジーに関する話題を追いかけています。動画編集やプログラミングが趣味で、たまにデザインなどもやっています。主にTypeScriptを使用したWebフロントエンド開発を専門とし、便利で実用的なブラウザー拡張機能を作成しています。また、個人ブログを通じて、IT関連のニュースやハウツー、技術的なプログラミング情報を発信しています。