Figmaのアップデート概要
どうも、こんのです。今日は、Figma 2025アップデートでデザインはどう変化するかについて話していきたいなと思います。
先日あったFigmaのアップデートなんですけども、 ポッドキャストでも触れたいなと思ってたんですけど、
自分で使ってみて、壁砕いた上で話したいなと思ったので、ちょっと間が空いたんですけど、アップデート、新機能の話をしていきたいなと思ってます。
先日東京であったFigmaのイベントについても、ちょっと感想を交えながら話していきたいなと思ってます。
まずFigmaのアップデートなんですけども、いろいろ新機能が出たかなと思ってて、
まずFigmaサイトですね。多分これが今回の目玉の機能だったんじゃないかなと思っていて、
Figmaで作ったものをそのままサイトとして公開できる機能ですね。 これはもっと前から個人的に早く欲しいなと思ってて、
いやちょっとこれリリースされるのちょっと遅いんじゃないかなって思ってたぐらいですよね。
だってFigmaで作ったものをオートレイアウトとかでガチガチに組んでたものを、またそれをエンジニアに同じようにCSSで組んでもらうって、
いやだからこの非効率な基本フローをいつまで続けるんだっていうのは、ちょっと前々から苦痛だなぁと思ってたんで、
早く欲しいなぁと思ってたところで、ようやくFigmaサイトが公開されましたね。
多分これってFigmaも前々からやってたけども、結構仕込みの期間は長かったので、
触ってみての感想は、思ったより品質は良いなぁと思っていて、一通りの機能とかもあるので、結構作り込んできたなぁというのが最初に思った感想です。
どんなものかというと、本当にFigmaで作ったものをそのままサイト公開できるんですけども、
いつも使っているFigmaの画面とちょっと違うんですけども、PCとタブレットとスマホの画面サイズの画面を作れて、
そこでそれぞれの画面、どれか1個編集すると各画面に自動的に反映されるっていうものですね。
結構テンプレートも豊富なので、そのテンプレートを元に自分でカスタマイズしてやるっていうやり方もできるかなぁと思っています。
ちょっと触ってみただけで、まだ使いこなしてないので、この辺ちょっと使ってみた後にもう1回レビューや感想を言いたいなぁと思ってますね。
個人的にはこのFigmaサイトって、Figmaをちょっと焦って出した部分もあるんじゃないかなと思っていて、
今までノーコードツールっていろんなもの結構出てたかなと思ってて、 スタジオだったりとかフレーマーだったりとか
公開できちゃうので、わざわざFigmaを使うっていう量があまりないんですよね。
っていうのと、あと最近VZeroが出てきて、VZeroでそのサイトをプロンプトで作って公開もできちゃうので、
あれだかFigmaで作ったデザインって、 アイディアから実際デザインをして、そこからまた開発するっていうフローから
プロンプトでそのままデザインして公開するっていうフローにできちゃうので、 Figmaでわざわざデザインするっていうのは
なんか余計な手間だなっていうのが最近ちょっと思ってきたんですよね。 なのでFigmaもちょっと焦ってきて、このFigmaサイトを公開に至ったんじゃないかなーっていうところはちょっと思ってます。
新機能の詳細
話ちょっと戻すと、Figmaサイトの機能でCMSの機能がまだカミングスンなんで使えないんですけど、CMSは早く欲しいですね。
お知らせ機能だったりとか、いろんなコンテンツ載せていくのにCMSはやっぱり必要になってくるかなと思っているので、これは早くリリースして欲しいなと思ってます。
スタジオにあってFigmaサイトにない部分で言うと、APIの連携ですね。 このAPIから情報を取ってきて
コンテンツを表示するっていうのもやりたいので、APIも連携できるといいかなと思ってます。 あとお問い合わせフォームなども設置したいケースが結構あるかなと思うので
フォーム機能もあると嬉しいなぁと思ってますね。 Google フォームは埋め込めるみたいなんですけども
まあGoogle フォームだとちょっと見た目がカッコ悪くなってしまうので、フォーム機能早く欲しいなぁと思ってます。
Figma サイトはそんな感じで、続いてFigma Buzzですね。
Figma Buzzは Canva みたいな感じでデザインテンプレートがたくさんあって、そこからデザインできるっていうものですね。
正直いろんなテンプレートあるんですけど、Figma っぽさある独特のデザインだなぁと思ってて
Canva みたいにいろんな幅広いデザインに対応してるっていうわけじゃないので、 ちょっと正直 Buzz このものだと使いづらいかなと思ってます。
ただ、使えるかなと思ってるのがテキストとデザインを分離できるのでテキストだけ編集できるモードになるんですよね。
なのでデザイナーがデザインテンプレートを作ったら、あとテキストの変更は他のマーケチームとか他の職種の人にお願いするっていう役割分担できるんじゃないかなと思ってますね。
今の Figma でももちろんできるんですけども、間違ってデザインずらしちゃったとか、 維持しちゃったということもあり得るかなと思うので、そうならないようにテキストだけ変更できるという部分は便利かなと思っています。
あと地味に嬉しいのが CSV のアップロードですね。 過去に画像の大量生成する仕事をやったことあるんですけど、
一気に1000枚ぐらい作らないといけなくて、今までだったら CSV のプラグインがあって、それをアップロードしてやるっていうのはできたんですけども、
プラグインなんでなんかちょっと一部動作が不安定というか、1000個画面作ったらめちゃくちゃ重くなったりとか、画面外にまでデザインが入っちゃってその後編集できないとか
あって不便だったんですけども、まずだと大量の画像を作ってもプレビュー的に問題ないし、あとデモを見る限りめちゃくちゃ動作早いんじゃないかなと思ってますね。
あと CSV アップロードした後にどこの部分とテキストを紐付けるっていうのが視覚的にわかりやすいのが、これはなんか非デザイナーでも使いやすいツールかなと思いました。
続いてフィグマドローですね。 フィグマドローは
フィグマでペンツールとかブラシツールとか追加されたものですね。 ブラシもまあ一通りのパターンはあるので
まあちょっとしたイラストは描けるんじゃないかなとは思ってます。 ただ僕イラスト描かないんでちょっとこの辺はあんまりわからないですが
まあ他のフォトショップとかイラストレーターに比べたらちょっと数は少ないかなという印象ですが、
まあでも通に使えるんじゃないかなと思ってますね。 ただちょっとペンタブとか対応してるのかなとかっていうところはちょっと気になってるところですが
これはなんか普段イラスト描いてる人の話をちょっと聞いてみたいなと思いました。 続いてフィグマメイクですね。
これも目玉の機能かなと思っていて、本当VZeroみたいにプロンプトで
サイトを作れちゃう機能ですね。 ゼロベースでこういうサイトを作りたいっていうのを指示して作ってもらうこともできるんですが、
今ある既存のデザインを読み込ませて 実装してってやると
コード生成までしてくれるので、そういった使い方もあるかなと思ってます。 あとそのまま公開もできるので
自分が作ったツールとかっていうのを世の中に公開できるかなと思ってますね。 なので本当VZeroみたいな機能かなと思っています。
いいところなんですけども コンポーネントをコピーしてそのまま貼り付けるとコンポーネントのバリアブルとか
プロパティとかを意味を理解した上で実装してくれるんですよね。 例えばボタンのコンポーネントをこちらのフィグマメイクに貼り付けて実装してってやると
ボタンのサイズだったりとか ディセーブルとか非活性パターンとかも自動的にたくさんのパターンを作って実装してくれるんですよね。
単純に実装するっていうわけじゃなくて各パターンを作ってくれるっていうのと、勝手になんかドキュメント化して分かりやすくしてくれるとこは非常にいいなと思いました。
個人的に最近使ってるのはアニメーションですね。 今までフィンガーでアニメーション作るときってプロトタイプで頑張って作ることはあったんですけど
AIとの連携と今後の展望
まあまあめんどくさいんですよね。 時間かかっちゃうんでめんどくさいなぁと思って
なんか参考のサイトを見つけて こんな感じで
エンジニアに実装お願いっていうようなコミュニケーションもやったりしてましたね。 ただそれがフィグマメイクでこのデザインをこういう感じのアニメーションをしたいってやると
ほぼ自分のイメージ通りのアニメーションができるので、なので アニメーションをエンジニアに支持するっていうやり方ができるんじゃないかなぁと思いました。
本当フィグマメイクでデザインから実装までできちゃうんで 本当にこれは便利だなぁと思いましたね。
続いて MCP ですね。 MCP なんですけどもあのまあ何かというと
フィグマとエディターを連携して AI コードの生成ができるっていうような機能ですね。
使い方本当簡単で MCP をオンにするっていうのをフィグマ側でやって あと連携させるためのテキストをエディター側に設定してやると
プロンプトでコードが生成できるというものですね。 ちょっと僕はカーソルのエディターを使ってみて試してみたんですけども
カーソル上でプロンプトでコードが書けるので フィグマのデザインの URL をコピーしてこの部分を実装してやると
AI が実装的に実装してくれましたね。 ただこれなんかデザイナー向けっていうよりはどちらかとエンジニア向けかなぁと思いました。
先ほどのフィグマメイクはデザイナーがフィグマ上で簡単にコードを生成できるもので MCP の方はエンジニアが普段使っている環境やエディターで
コードを生成したいときに使えるんじゃないかなぁと思っています。 あと細かな機能のアップデートをいくつかあるので簡単に紹介なんですけども
グリッド機能ですね。 CSS グリッドのレイアウトが今までできなかったんで 複雑なグリッドレイアウトはできなかったんですが今回のアップデートによって
Figmaのアップデートと新機能
グリッドレイアウトができるようになったので結構これは使えるんじゃないかなと思っています。 あとぼかしと背景のぼかしでグラデーションが使えるようになったことですね。
今までぼかしって 均一にしかできなかったんですけどもそれがここからここまでは薄くから濃く
ぼかしを入れたいということが使えるようになったことですね。 これによって結構デザインの幅表現幅が広がったんじゃないかなと思っているのでこれは結構
嬉しいですね。 あとノイズですね。ノイズは今までプラグインで作って貼り付けてやってたんですけど
その手間がなくなって公式の機能としてノイズを生成できるようになったので これはめちゃくちゃ嬉しいですね。
あとあまり話題になってないんですけどパターンっていう機能が増えたことですね。 背景の
設定でパターンというのが増えて 今までは単純な画像のパターンをできたんですけども
フレームに対してパターン設定ができるので 例えば
均一な繰り返しの背景を作るときに自分が作ったデザインをリアルタイムでプレビューしながら 背景のパターンを作れるのでこれはめちゃくちゃ便利だなぁと思いました。
フレーム全体をパターン化できるので 普通のページデザインを
パターンとしてやることもできるので ちょっとどう使うかわからないですけど
コンポーネントみたいな使い方もちょっとできるかなと思ってます。 作ったデザインをここのところにも自動的に置いておきたいという時も使えるかなと思ってて
コンポーネントするわけじゃないけどちょっと同じデザインここに置いておきたいという時はこのパターン使えるかなと思ってますが
ちょっとあのイレギュラーな使い方かもしれないですけどこんなやり方もできるかなと思いました。
イベント体験とFigmaの進化
昨日の説明は以上なんですけども最後にイベントの振り返りをしたいなぁと思ってますね 品川プリンスホテルの会場でやったんですけども
本当会場はめちゃくちゃ広くてすごかったなぁと思ってますね 最初に入った時に
ちょっと遅刻して行っちゃったんですけども入った時に暗くてペンライトがたくさん光ってて
あれこれちょっとなんか会場間違っちゃったかなって思って 一瞬思っちゃったんですけども本当なんか
アイドルとかがやってるような会場の風景な感じですごかったですね あと登壇者の人が登場する時に
カーテンからバッと出てきてすごい 光と音楽が鳴った状態で登場してきて
なんかアイドルっていうかなんか芸人の今から混沌始まるような演出みたいな感じで いやなんか登壇者の人もなんかにが折れしながらみんな登場してましたね
いやなんかめちゃくちゃ面白かったです 登壇者の内容自体はすごいためになったなぁと思っていて
なんかそこまでちょっと話すとちょっと長くなるんであんまり話さないですが 個人的にはトヨタの方の話が面白かったですね
トヨタみたいにすごい大企業のサイトをどのような形でデザインをコミュニケーションとして 使ってるかっていうのと
あとデザインシステムどんな形で活用しているかっていうのが話されてたんですけど 内容はそこまで深掘った話はなかったんですけど
そこまでの大企業なので いろんな部署の調整ってめちゃくちゃ大変だったんじゃないかなーっていうのはすごい思いました
ぜひ何かそういう話ももっと深掘っていきたいなというふうには感じましたね あといろんなグッズをもらえたのが嬉しくって
なんかさっき話したペンライトをもらえたんですけど むちゃくちゃ可愛いんですよね
ちょっと小さいものなんですけどもハート型でフィンマのロゴが入って しかも12色の色を変更できて
今までペンライトってなんかライブとかでしか使ったことなかったんですけど まさかこんなデザインイベントでペンライトをスピーカーに向けてやるなんて
新しい体験だなって思いました まあ自分が登壇したいという気持ちはちょっと今のところないですけども
ペンライトを自分が浴びる側っていうのはやってみたいなっていうのはちょっと思いましたね あと最後にちょっと食事もあって
無料で参加できるイベントでおそらくホテルの食事が出たんじゃないかなと思ってて 食事自体もめちゃくちゃ美味しくて
いや本当充実したイベントでしたね そうだフィグマの
マカロンがあってこれもめちゃくちゃ可愛かったんですね 本当このイベントに関してはめちゃくちゃ完成度が高くて
おそらく確かフィグマジャパンとしてのイベント初だったんじゃないかなと思ってるんですけど スタッフの皆さんめちゃくちゃ頑張った企画と運営したのが感じられるイベントでしたね
ぜひまた来年もやっていただけると嬉しいなぁと思いました ということで長くなったんですけども今日はフィグマ2025アップデートでデザインはどう変化するかについて話しました
振り返るとイベントの時もちょっと話してたんですけども フィグマってただのデザインツールじゃなくなってきたなぁというところで
デザインツールというかもう総合プラットフォーム化してきるなぁというところを持ってます ね
フィングジャムでアイデアを出すところから プロトタイピング作ったり実際デザイン作ってサイトを公開したりとか
公開した後のコンテンツの運用バスの機能ですね もうできるようにあったりとかあとエンジニアとの連携だったりとか
実際自分でコードを生成するところまでの 一貫したツールになってきてるかなぁと思ってますね
なのでデザインの総合プラットフォームって言えばいいのかどうか ちょっと悩ましいところですけども
本当ただのデザインツールって言わなくなってきたかなというのはちょっと感じました なのでなんか
デザイナーが使うツールっていう感じでもなくなってくるのかなと思ってて Figma って言ったら今までデザイナーが作るもの
使うものだったんですけども エンジニアがもちろんあの開発ツールとしても使うことを持ったったりとか
Figma サイトで公開したサイトも CMS のところは他の職種の人が使ったりとか あとバズ機能で画像生成も他の人にお願いできたりとかもできる
ので なのでFigma って多分いろんな人が使っていくツールになってくるんじゃないかなと思ってますね
ただその分課金体系どうなのかなというところはちょっと気になってて いろんな職種に入れたらそれだけコストは跳ね上がってしまうので
そこはちょっと慎重に コストを計算しながら
どこまでFigma を運用するかっていうところは ちょっと企業のお財布との相談になってくるのかなと思ってます
今回のアップデート本当個人的には嬉しいなぁと思っていたので v0 とかフレーマーとか最近ちょっと話題になってき
たんで Figma 今後どうなっちゃうのかなっていうのはちょっと気になってたんで まあ今回のアップデートでまあひと安心かなってはちょっと思ってますね
なので引き続き僕は Figma に続行かなぁと思っているので アップデートを今後も期待しています
はい長かったですが以上にしたいなと思っています 何か質問などあればぜひコメントください
またこの podcast は週一で配信しているのでぜひ番組をフォローしていただけると嬉しいです それじゃあまた
