こんにちは！DMMプロダクトマネージャーの小島です。
このレポートでは、FigmaConfig2025で得られた刺激的な体験や、発表された新機能、そしてサンフランシスコでのちょっとした出来事についてお話ししたいと思います。Figmaユーザーの方も、そうでない方も、これからのモノづくりやデザインの可能性を感じていただける内容になれば幸いです。
- はじめに
- セッションレポート
- Figma / Opening keynote & Deepdive：未来を切り拓く、待望の新機能群！
- その他の印象的だったセッション
- 現地で感じた、Figma Configならではの熱気と学び
- ちょっと寄り道：サンフランシスコの街角で
- おわりに：Figma Config 2025から持ち帰ったもの
はじめに
改めまして、DMMアルファ室のプロダクトマネージャーの小島です。アルファ室とは、PM横断組織になります。
肩書通りデザイナーではない私ですが、この度、嬉しい機会をいただき、2025年5月7日と8日にアメリカ・サンフランシスコのモスコーニセンターで開催された、デザイン界の一大イベント「Figma Config 2025」に参加してまいりました！その様子をレポートしたいと思います！
セッションレポート
FigmaConfig App
Configでは、参加者向けに専用の公式アプリが提供されていました。このアプリが非常に優秀で、各セッションの予約から、自分専用のタイムテーブル（Agenda）管理までをスムーズに行うことができます。広大なモスコーニセンター内で、セッション間の会場の移動も、このアジェンダを確認すれば迷うことなく次の目的地へたどり着けるため、非常に効率的に過ごすことができました。
せっかくなので、今回の私のConfig Agendaを添付してみます。実際に、ほぼこのアジェンダの通りにセッションを回りました。
すべてのセッションをご紹介すると膨大な量になってしまうため、特に私の印象に残ったセッションをいくつかピックアップしてレポートします。
Figma / Opening keynote & Deepdive：未来を切り拓く、待望の新機能群！
Configの最大のハイライトは、やはりOpening keynoteです。FigmaのCEOをはじめとするチームから、Figmaの目指す未来と、それを実現する画期的な新機能が多数発表され、会場の熱気は最高潮に達しました。発表された機能は全部で5つ。これらは大きく3つのユースケースに対応するものです。
- ビジュアルデザインの進化： Grid / FigmaDraw
- クラフトの圧倒的な速度向上： FigmaSites / FigmaMake
- 非デザイナーによる素材作成の民主化： FigmaBuzz
Figmaは”Our vision is to make design accessible to everyone. The best way to design is together.”（デザインをすべての人に Accessible にする。最高のデザイン方法は、一緒に行うことだ。）というビジョンを掲げています。まさにそのビジョンを体現するかのように、今回発表された機能は、プロのデザイナーだけでなく、プロダクト開発に関わるすべてのメンバーにとって非常に重要で、待望の機能ばかりでした。
私のレポートには、Keynoteに加えて、各機能のさらに詳細な内容が語られたDeepdiveセッションの情報も含まれています。Deepdiveセッションの映像はまだYouTubeで公開されていないようですが、Keynoteの映像はすでに公開されていますので、Figmaの未来にご興味のある方はぜひご覧になってみてください。
Grid：デザインの根幹を、より直感的で強力に！
デザインの歴史において、Gridシステムは常に重要な役割を果たしてきました。私自身も、デザイナーではありませんが、「Grid systems in graphic design」という書籍を読んだ際に、デザインにおけるGridの重要性を強く認識しました。
もちろん、Figmaにも、Gridをガイドラインとして表示する機能はありました。多くのデザイナーはこれを利用して、要素間の余白（アイソレーション）を適切に保ち、視覚的に美しいデザインを構築しています。しかし、Gridのルールに厳密に従ってデザインを行うには、Figma上での操作にやや複雑性が伴う場面もありました。
今回のConfigで発表された新しいGrid機能は、この課題を解決するものです。Figmaのキャンバス上で、オートレイアウト機能の新しいオプションとして利用できるようになりました。これにより、より簡単に、より柔軟にGridに基づいたレイアウトを構築することが可能になります。
では、具体的にどのように便利になったのでしょうか？
簡単に例を挙げると、以下のような雑多な図形をドラッグ・ドロップするだけで綺麗にグリッド配列にできるのです。
このように、新しいGridレイアウト機能を使えば、デザイナーはこれまで以上に効率的に、そして非デザイナーの方でも驚くほど簡単に、美しく整列されたレイアウトを実現できるようになります。
特に印象的だったのは、ライブデモでカレンダーUIが一瞬で作成されたシーンです。よく利用するUIなのですが、意外と複雑な要素配置が必要なカレンダーを、Gridを使ってあっという間に生成する様子に、会場からはどよめきと大きな拍手が起こりました。隣の人が歓喜していましたね。これはまさに、Figmaが多くのデザイナーが抱える潜在的なニーズを正確に捉え、それに応える価値を生み出していることの証拠だと、肌で感じることができました。
Figma Draw：Figmaで広がる、表現の可能性
Figma Drawは、Figmaに統合された強力なイラストレーションツールです。これまではAdobe Illustratorのような外部の専門ツールや、特定の表現を実現するためのプラグインが必要だった、パターンデザイン、テクスチャーの適用、カーブテキストなどが、Figma内で直接行えるようになります。また、パス操作のインターフェースも大幅に改善され、より直感的で精密なシェイプの編集が可能になりました。これもイラスト制作においては非常に重要な要素です。
このFigmaDrawの登場により、Figma単体でできることの範囲が格段に広がったと感じています。現地で参加していた他社のデザイナーの友人と、「これはもしかしたら、今後はAdobe Illustratorを立ち上げない未来が来るかもしれないね」と話したほどです。それほどに、このFigmaDrawはインパクトのある素晴らしいアップデートだと感じました。
Figma Sites：デザインが、そのままWebサイトになる未来
ConfigのKeynoteで紹介された「Publishボタンを5年間待ち望んでいた！」というポストは、多くのFigmaユーザーの気持ちを代弁していたのではないでしょうか。そして、その長年の願いがついに叶いました。Figma上でデザインしたものを、そのままWebサイトとして公開できる「Figma Sites」がついに発表されたのです。これはもう、「Amazing！」の一言に尽きます。
これまでも、Figmaのデザインデータを元にWebサイトを構築する外部サービスは存在しましたが、Figma自身がこの機能を提供することの意義は非常に大きいです。Figma Sitesを実現するために、Figmaの機能も多岐にわたって強化されています。例えば、PC/Tablet/スマートフォンといった異なるデバイスサイズに対応するバリアント（Variants）を簡単に作成できるようになり、デザイン内のセクションをドラッグ＆ドロップするだけで、各デバイスバリアントに自動的に配置される機能が追加されています。
さらに、驚くべきはその機能の抜け目のなさです。簡単なインタラクションはもちろんのこと、パララックス効果のような動きのある表現もボタンひとつで設定できます。クリックイベントなども仕込めるため、単なる静的なデザインの表示に留まりません。
そして、ここからが一番の驚き。多くの人が「どうせ静的なページしか作れないんでしょ？」と思ったはずです。
しかし、違ったのです。Figma Sitesには、本格的なCMS機能まで搭載されていました。これは本当にすごい。事前にコンポーネント（Component）としてコンテンツの構造を定義しておけば、デザインの知識がない人でも、そのコンポーネントを複製したり、テキストや画像を差し替えたりといったコンテンツの更新作業を簡単に行うことができます。これは「やばすぎる」レベルの機能です。
私のようなプロダクトマネージャーにとってはもう歓喜でした。「え、もうコード書く必要ないじゃん！」と本気で思いました。
写真は、画像拡大のモーダルをライブデモする様子です。
さらに、YouTube動画やGoogleMapなどの埋め込み（Embed）も簡単にできます。例えば、GoogleMapで表示したいお店の位置情報を連携すれば、Figma Sites上で瞬時にマップが表示されるようになります。これも本当に最高です。再び「コード書く必要ないじゃん！」と感じました。
この「コード書く必要ないじゃん」という感覚は、次に紹介するFigmaMakeにも繋がっていきます。
ちなみに、このFigma Sitesは、約30〜40名ほどの少数精鋭チームが、1年以上の期間をかけて開発したそうです。これだけの機能を、この短期間で実現したというのは、あらためてFigmaのクリエイティブチーム、エンジニアチームの技術力と開発スピードの凄まじさを感じました。
ベータ版ながらFigma Sitesで何ができるのか、早速まとめてくださっている方もいらっしゃいましたので、こちらもぜひ参考にしてみてください。
https://www.re-d.jp/news/article/12746/
Figma Make：AIによるデザインの「クラフト」革命
先ほどご紹介したFigma Sitesには、「code layer」という新しい概念が導入されています。これは、これまでのデザインツールが持っていた「デザインレイヤー」、つまりビジュアル要素を配置するレイヤーとは別に、そのビジュアルブロックそのものがコードで構成されているという考え方です。これまでのFigma上でのデザインは、主にビジュアルレイヤーでの操作でしたが、code layerの登場により、デザインとコードの距離が劇的に縮まりました。
これは逆に言えば、コードをそのままFigma Sitesに載せることができる、ということでもあります。
そこで、次に紹介するFigma Makeの出番となります。
Figma Makeは、自然言語で指示するだけで、インタラクティブなプロトタイプを自動的に作成してくれる、AIを活用したデザインクラフトツールです。頭の中でイメージしている画面構成や、要素間のインタラクションなどを言葉で入力するだけで、AIがそれを解釈し、かなり高度なプロトタイプとしてFigma上に具現化してくれます。
これは実際に行われたライブデモの様子です。実は仕上がりのデザイントーンは、テキストで指示したものではなく、参考となるサイトのコンポーネントを貼り付けてAIに同時に読み込ませています。
さらに、Figma Makeで生成されたプロトタイプのコードは、エンジニアと共有し、より洗練させることが可能です。デザインとエンジニアリングの連携を深め、効率的なプロダクト開発を実現するというFigmaのビジョンに、しっかりと向かっている機能だと感じました。
そして、先ほど触れたように、Figma Makeで生成されたプロトタイプは、Figma Sitesのcode layerとしてそのまま組み込むことができます。これにより、「アイデアを言葉にする → Figma Makeでプロトタイプを作成 → Figma Sitesで公開」という、驚くほどスムーズなワークフローが実現されます。
Figma Makeの開発においては、「0から1のデザインクラフト」と、「1対1のデザインプロセスの実現」をどのように両立させるかという点が深く検討されたそうです。そのためには、デザインのレイヤー、コードのレイヤー、そしてAIのレイヤーという、異なる3つの視点からモノづくりを考える必要があります。Deepdiveではそれぞれの領域を担当する開発者が登壇し、その哲学について語ってくれました。
特に印象的だったのは、AIに関する発表でした。
”Words don’t always equal intent.”（言葉は必ずしも意図と等価ではない）
これは本当にその通りだと感じます。私たちは日々コミュニケーションを取る中で、自分の頭の中にある考えや感情を完全に言葉にできているとは限りません。AIは入力された言葉を文字通りに解釈するため、私たちの「本当の意図」を汲み取れずに、意図しない結果を生み出すことがよくあります。
Figma Makeの開発チームは、この課題に対して、以下のステップで取り組んだそうです。
- Capturing user intent（ユーザーの真の意図を捉える）
- Providing strong defaults（有効なデフォルトを用意しておく）
- Implicit styles（暗黙にいい感じにクラフトする）
AIを過度に信頼するのも危険ですが、ユーザーの入力だけを鵜呑みにするのも不十分です。AIツールを開発する側が、ユーザーの創造性を最大限に引き出すために、しっかりと「クリエイティブなロジック」を組み込んでおくことが重要なんだ、とAIツールの設計における学びを得ることができました。
Figma Buzz：クリエイティブ活用を、誰でも簡単に、大量に！
最後に紹介するのは、Figma Buzzです。Figma Buzzは、デザイナーが作成した様々なクリエイティブアセットを、マーケターなどの非デザイナーが簡単に活用し、プロモーション素材などを効率的に作成するためのツールです。
Figma Buzzのわかりやすい活用事例として、ConfigのKeynoteでも紹介されたポストをご紹介します。
https://x.com/motomiya333/status/1921970616938238449
Configのライブデモでは、より大量のクリエイティブバリエーションを生成するために、CSVファイルをアップロードして、そのデータに基づいたデザインを自動生成・大量生産する様子が紹介されました。例えば、ABテスト用の複数の広告バナーを作成したり、カンファレンス出席者のネームタグを大量に、しかも個別にカスタマイズして作成したりといった作業が、驚くほど効率的に行えます。
その他の印象的だったセッション
今回のConfigでは、Figmaの新機能に関する発表だけでなく、様々な分野で活躍するクリエイティブチームやプロダクトチームからのセッションも多数開催されていました。その中でも特に私の興味を引いたセッションをいくつかご紹介します。
Walt Disney Animation / Pixar Animation：トップアニメーターを支える、デザインツールの哲学
ウォルト・ディズニー・アニメーションとピクサー・アニメーション・スタジオから、プロダクトデザイナーの方が登壇。ピクサーには「Presto」という独自のアニメーションソフトウェアが存在するそうです（私もこの時初めて知りました）。このように、ピクサーのクリエイターが使用する独自のアニメーションツールなどを開発しサポートしているプロダクトデザイナー、という非常にユニークなポジションの方々のお話を聞くことができました。
アニメーターの方々は、日々非常に専門的で複雑な作業をしており、そこに特有の重要な課題が存在します。ディズニーやピクサーのプロダクトデザイナーは、そうしたアニメーターの課題を深く理解し、それを解決するためのツールを開発しています。彼らが作り出すツールは、ディズニーやピクサーの圧倒的なクリエイティブを支える重要な要素の一つになっていると言っても過言ではないと感じました。
非常に興味深かったのは、映画「ファインディング・ドリー」の制作時のエピソードです。この作品には無数の魚が登場しますが、魚の群れがより早く、スムーズに動くようにアニメーション化するために、専用のツールを作成したそうです。そのツールは「Easy Fish」と名付けられたとのこと笑。
このように、現場のクリエイター自身が課題解決のためにツールを生み出す文化があり、「本当に有用なツールは、わざわざ説明しなくても自然と一人歩きして、現場に広まっていく」というデザインの本質とも言えるエピソードを語ってくれました。
NFL：巨大スポーツリーグにおける、複雑なユーザー体験設計の裏側
次に印象に残ったのは、NFL（National Football League、ナショナル・フットボール・リーグ）のデザインシステム刷新と公式アプリ開発プロジェクトに関するセッションです。スーパーボウルに代表されるように、NFLはアメリカにおいて絶大な人気を誇る国民的スポーツです。規模は異なりますが、日本でいうとプロ野球のような存在でしょうか。
このセッションでは、NFLの公式アプリがどのようにリブランディングされ、どのような思想でアプリのユーザー体験が設計されたのか、その裏側について詳しく語られました。
ユーザー体験の設計においては、これまでの「記事中心」のアプリから「動画中心」へと大きく舵を切るようです。試合が日曜日に集中するというリーグの特徴を活かして、各曜日ごとに提供するコンテンツを戦略的に切り替えながら、ユーザーの試合への期待感を高め、エンゲージメントを維持・向上させていくような設計になっているとのことでした。
特に、彼らのプロフェッショナルとしての「根気」を感じたエピソードがあります。
ユーザーには、ニュース・チーム情報・選手データ・試合スコア・スケジュールなど多種多様な情報をわかりやすく知りたいというニーズがあります。ビジネス要件はもちろん、ユーザー体験・技術的実現可能性・マーケティング戦略など、多角的な観点からフィジビリティを確保する必要がありました。その要求に応えるため、全曜日・全シーズン・全週を網羅したフロー図を、全ページビジュアルベースで作成していたのです。
彼らがFigmaで作り上げた、無限に広がるかのようなプロトタイプを目にしたとき、その情報量と緻密さに圧倒されました。
Figma Configのような、クリエイティブで華やかなイメージのあるイベントの中で、こうした現実的で泥臭いとも言える制作現場の裏側を見せていただき、非常に親近感が湧くとともに、大規模なプロダクト開発における緻密な設計の重要性をあらためて認識させられました。
Instagram：戦略を加速させる、プロトタイピングの力
Instagramのプロダクトデザイナーによるセッション、「How to leverage prototyping to influence strategy - with real case studies from Instagram」では、プロトタイピングがプロダクト戦略にどのように影響を与え、推進していくかというテーマで語られました。
（※このセッションは日本語通訳のレシーバーを借り忘れてしまい、英語で聞いたため、内容を完全に理解できたわけではないのですが、非常に印象に残った点を中心にレポートします。）
10億人を超える膨大なユーザーを抱えるInstagramのようなサービスにおいては、プロトタイプの重要性がますます高まっているとのことでした。ほんの少しのUIの変更や機能追加であっても、それが多くのユーザーに大きな影響を与える可能性があるため、非常に慎重かつ丁寧な検証が不可欠です。
特に印象的だったのは、「Prototyping gives clarity to the decision.」（プロトタイピングは意思決定に明確性を与える）という言葉です。プロトタイプを作成し、実際にユーザーテストなどを行うことによって、プロダクトの方向性や具体的な仕様に関する意思決定が、より明確で確信度の高いものになる、と語っていました。プロトタイピングによって、「Complexity（複雑さ）からClarity（明確さ）へ」、「Visionary（ビジョン）からreality（現実）」へと移行できる、ということです。
また、興味深かったのは、彼女自身が自身のInstagramアカウントの「親しい友達リスト」（関係者向け）に対して、開発中のプロトタイプをストーリー機能で共有し、高速にフィードバックを得ていると話していたことです。これは、大規模サービスであっても、スピーディーなプロトタイピングとユーザーからのフィードバックサイクルを回すことの重要性を示す、非常にアジャイルな実践例だと感じました。その気概に感銘を受けました。
現地で感じた、Figma Configならではの熱気と学び
The launch is the marketing.
今回のFigma Configに参加して、もっとも私の心を揺さぶられたのは、会場全体を包み込む圧倒的な「熱量」でした。新しい機能が発表されるたびに会場から巻き起こる歓声、デモ中に登壇者の一挙手一投足に真剣に注目し、小さな工夫や改善点にも惜しみない拍手を送る参加者の眼差し。自分で発表して、そうした喜びや驚きといった反応、貴重なフィードバックを生で受け取れる場というのは、クリエイターにとって何物にも代えがたい大きなモチベーションになると強く実感しました。
これこそ、プロダクトマーケティングだなと。
先日、インターネット上でも非常に話題になった「Nintendo Direct」という、任天堂が新作ゲームなどを直接ファンに発表するオンラインイベントがあります。私の友人のゲームファンを含め、世界中の任天堂ファンが、任天堂からの発信を心待ちにして、あの発表の日を待っていました。
こうした自分たちが生み出した製品やサービスについて、ユーザーに直接発表し、その場で生の反応やフィードバックを得られる機会というのは、本当に素晴らしく、そして開発者にとってこれ以上ない刺激的な瞬間であると肌で感じることができました。こうしたユーザーとの対話の機会を、DMMでも積極的に取り入れていきたいと強く思いました。
Less is more.
Config期間中、様々なセッションや参加者との会話の中で、私の頭の中に繰り返し響いてきた言葉があります。それは、「Less is more.」（より少ないことは、より豊かである）という言葉。あるセッションの中でも、スライドのメッセージとして登場しました。プロダクトを開発していると、様々な部署からの要望、ユーザーからの多様なフィードバック、そして膨大なデータなど、無数の情報や意見に囲まれて意思決定が複雑になりがちです。しかし、FigmaのチームやConfig に集まる多くのクリエイターは違いました。本当に大切なものを見極め、しっかり評価する。不要なものは思い切って捨て、作ると決めたものは徹底的に作り込む。そのような研ぎ澄まされた精神を、発表者も参加者も共有していました。
会場全体の雰囲気、参加者一人ひとりのクリエイティブなエネルギー、そしてFigmaが作り出す製品や体験に込められた哲学を肌で感じることができ、非常に刺激的で学びの多い経験となりました。
ちょっと寄り道：サンフランシスコの街角で
Config参加の合間には、少しだけサンフランシスコの街を散策する時間もありました。そこで体験した面白い出来事についても、少しご紹介させてください。
Uber / Waymo体験：未来の移動が、すぐそこに！
サンフランシスコでは、配車サービスのUberはもちろんのこと、自動運転タクシー「Waymo」の体験もできました。Uberは、日本のタクシー配車アプリと比較して、操作性が非常に洗練されていると感じました。特に、乗車・降車地点の指定が細かくできる点や、ひとつ一つの操作が直感的で分かりやすい点は、利用者にとって安心感があり、非常に使いやすかったです。
そして、初めて体験したWaymoの無人タクシー。サンフランシスコのほぼ全域で利用可能になっているようで、街中でも意外と頻繁に見かけました。地元の人たちにとっては、もう見慣れた光景になっているようです。実際に乗ってみると、乗り心地は非常に快適でした。車内では自分の好きな音楽を大音量でかけることもできますし、乗車手続きもBluetoothでWaymoのアプリから「ピッ」と操作するだけで完了するので、非常に手軽でした。Uberと同程度の速さでピックアップ地点に来てくれるのも非常に便利だと感じました。
さすがに深夜の一人での利用は避けた方が良いかな、と思い利用しませんでしたが、日中の利用であれば全く問題なく、むしろ快適な移動手段だと感じました。
California Wine：現地の味覚も満喫！
Configに出席するため偶然サンフランシスコに来ていた友人と現地で合流でき、いくつかのワインバーを巡りました。サンフランシスコの北には、有名なワインの産地であるナパバレーがあることもあり、カリフォルニアワインは世界的にも有名です。
ただ、実際に現地のワインバーに行ってみると、当たり前かもしれませんが、品揃えの中心はやはりフランスワインでした笑。期待していたほどカリフォルニアワインを飲む機会はなかったのですが、それはそれでワインの世界の奥深さを感じることができました。
いくつか行ったワインバーの中でも、「Bar Part Time」というお店は特に雰囲気が良く、カリフォルニアワインも美味しいものが揃っていたのでおすすめです。観光で日本人が一人で入るには少し勇気がいるかもしれませんが、慣れている人と一緒に行くか、複数人で行ってみれば楽しめると思います。
おわりに：Figma Config 2025から持ち帰ったもの
Figma Config 2025への参加は、私の視野を大きく広げ、プロダクトマネージャーとして多くのインスピレーションを得る貴重な経験となりました。Figmaはもはや単なるデザインツールという枠を超え、プロダクト開発プロセス全体を包括的にサポートする強力なプラットフォームへと進化していることを、肌で強く感じます。
今回Configで得られた最新の知見や、会場で感じた熱量を、DMM社内でも積極的に共有し、今後のプロダクト開発に活かしていきたいと考えています。特に、新機能の活用はもちろんのこと、ユーザーとの直接的な対話の機会創出や、「Less is more」の精神に基づいた本質的なプロダクト開発を、チームメンバーと共に追求していきたいです。
最後までお読みいただき、本当にありがとうございました！Configで得た学びを、DMMのプロダクトを通じて皆様にお届けできるよう、これからも邁進してまいります！
