---
title: "FigmaがUIの刷新を発表 #Config2024"
url: https://roboin.io/article/2024/06/27/figma-announces-new-ui3-at-config2024/
description: Figmaは、新製品発表会「Figma Config 2024」で、新しいUI「UI3」を発表しました。
publishedDate: 2024-06-27T06:03:05.000Z
modifiedDate: 2024-06-27T06:03:05.000Z
thumbnail: https://roboin.io/api/media/file/figma-new-ui3-mock-up-3.png
thumbnailAlt: Figma UI3のモックアップ
thumbnailCaption: N/A
---

# FigmaがUIの刷新を発表 \#Config2024

Figmaは、新製品発表会「Figma Config 2024」で、新しいUI「UI3」を発表しました。

![Figma UI3のモックアップ](https://roboin.io/api/media/file/figma-new-ui3-mock-up-3.png)
*画像クレジット：[Figma](https://www.figma.com/ja-jp/blog/behind-our-redesign-ui3/)*

Figmaは10年前にリリースされて以来、レイアウトはほとんど変わっていません。Figmaは次の10年間の基盤を築くために、クローズドベータ以来3回目の大幅な再設計「UI3」を展開します。

![FigmaのUI2とUI3の比較画像](https://roboin.io/api/media/file/figma-ui2-vs-ui3-1.png)
*画像クレジット：[Figma](https://www.figma.com/ja-jp/blog/behind-our-redesign-ui3/)*

Figmaは、デザイナーが最大限の創造性を発揮できる環境を提供するために、ユーザーのフィードバックを取り入れつつインターフェースを改良してきました。

新しいUIの最大の特徴の一つは、Figmaキャンバスの再設計です。作業空間を最大限に活用でき、重要なツールを常に手元に保ちつつ、集中しやすい環境を提供します。

ツールバーをキャンバスの下部に移動し、サイドパネルをリサイズ可能にしました。これにより、全体的により広々とした印象を受けるデザインに仕上がっています。

![Figmaの新しいキャンバスのスクリーンショット](https://roboin.io/api/media/file/figma-ui3-new-canvas-1.png)
*画像クレジット：[Figma](https://www.figma.com/ja-jp/blog/behind-our-redesign-ui3/)*

ツールバーは表示・非表示が簡単に切り替えられ、必要なときにのみパネルを表示できます。

もうひとつの重要な変更点は、**プロパティパネルの再設計**です。デザインシステムが普及する中で、**コンポーネントの操作**がより重要になってきました。新しいプロパティパネルでは、コンポーネントのバリアントやインスタンスが色やサイズの属性よりも上位に表示されます。

![Figmaのプロパティパネルのスクリーンショット](https://roboin.io/api/media/file/figma-new-ui3-component-panel-1.png)
*画像クレジット：[Figma](https://www.figma.com/ja-jp/blog/behind-our-redesign-ui3/)*

レイアウト関連のオプションも統一され、オートレイアウト、幅、高さなどがひとつのパネルにまとめられました。

![Figmaの新旧プロパティパネルのスクリーンショット](https://roboin.io/api/media/file/figma-new-ui3-properties-panel-1.png)
*画像クレジット：[Figma](https://www.figma.com/ja-jp/blog/behind-our-redesign-ui3/)*

新しいインターフェースでは、これまでのミニマムなデザインから、新たなアイコンに変更されました。

![Figmaの新しいアイコンのスクリーンショット](https://roboin.io/api/media/file/figma-new-ui-icon-1.png)
*画像クレジット：[Figma](https://www.figma.com/ja-jp/blog/behind-our-redesign-ui3/)*

さらに、Figmaのエコシステムが拡大する中で、統一感のあるユーザー体験を提供するための工夫が施されています。FigJam、Figma Design、Figma Slidesといったツール間をスムーズに切り替えられるよう、スリムなツールバーとフローティングパネルが導入されました。

## UI3を使う方法

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

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

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

![Figmaのウェイティングリストの登録ボタンのスクリーンショット](https://roboin.io/api/media/file/figma-ai-waiting-list-button-2.png)

## Config 2024での発表

Config 2024では、UIの刷新の他にも、AI関連機能「Figma AI」の導入が発表されました。詳細は、こちらの記事で紹介しています。

[FigmaがAI関連機能を発表　ビジュアル検索や生成AI、レイヤーの自動リネームなど \#Config2024](https://roboin.io/article/2024/06/27/figma-announces-figma-ai-at-config2024/)

## 参考

- [Inside the Redesigned Figma, Where Your Work Takes Center Stage | Figma Blog](https://www.figma.com/ja-jp/blog/behind-our-redesign-ui3/)