Figma Dev mode GA - ohiruneuni/blog

Figma の Dev モードが正式リリースされました。無料のベータ版は 2024 年 1 月 31 日に終了したため、Dev モードの利用には課金が必須になります。

合わせて、いくつか機能が紹介されています。

アノテーションを利用すれば、簡単にプロパティやデザインの詳細を追加できます。

表示するプロパティは選択でき、変更があれば自動的に反映されます。またアノテーションは、レイヤーに紐づき、デフォルトで表示されているため、コメントより気づきやすくなっています。

要素間などの大きさを視覚化した上で、位置の調整が出来ます。この値も変更が自動的に反映されます。

2 つのフレームを選択した上で compare changes を押すと、コードとビジュアルで比較することが出来ます。

VSCode を Figma 上で見ることの出来る VSCode for Figma が再設計されました。以前は大きなキャンバスをそのまま表示していましたが、個々のフレームにフォーカスして表示できるようになりました。