Figma Sitesとは

Figma Sitesは、2025年5月にFigmaの年次カンファレンス「Config 2025」で発表された、Figma上でデザインからWebサイトの公開までを一元管理できる新しいノーコードWeb制作プラットフォームです。

従来のFigmaはUI/UXデザインやプロトタイピングが主な用途でしたが、Figma Sitesでは「デザインからそのままWebサイトを生成・公開」できるのが大きな特徴です。

Figma Sitesの主な特徴

  • Figma上でデザインしたものを、そのままWebサイトとして公開可能。
  • コーディング不要で、デザイナーや非エンジニアでも簡単にWebサイトが作れる。
  • 生成されたコードを直接編集することもでき、柔軟なカスタマイズも可能です。

共同編集・クラウドベース

Figma本来の強みである「リアルタイム共同編集」「クラウドベースでの作業」がそのまま活用できます。チームでの共同制作やフィードバック、修正もスムーズに行えます。

レスポンシブデザイン対応

デスクトップ・モバイル両方のデザインをFigma上で作成し、そのままレスポンシブなWebサイトとして公開可能。フレームやオートレイアウト機能を活用することで、様々なデバイスに最適化したデザインが作れます。

プロトタイプから本番公開まで一気通貫

プロトタイプ作成やインタラクション設定もFigma上で完結。

作成したプロトタイプをそのままWebサイトとして公開できるため、デザインから公開までのフローが大幅に短縮されます

気になること

公開されるサーバー環境

サイトは米国のAmazon Web Services(AWS)を使用してホストされています。ドメインとルーティングはCloudflareによって提供されています。
引用元:https://help.figma.com/hc/en-us/articles/31242845959703-Publish-update-or-unpublish-a-site

AWSとのこと。ドメインとルーティングはCloudflare。

公開後の更新フロー:ページ追加、削除に関して

キャンバスに加えた変更は、公開後にのみ公開サイトに反映されます。例えば、キャンバスからウェブページを削除した場合、更新を公開するまでは公開サイトに残ります。
引用元:https://help.figma.com/hc/en-us/articles/31242845959703-Publish-update-or-unpublish-a-site

Figma Sitesで編集後に、公開するまでは更新されない。

バージョン管理に関して

Figma Sitesでは、サイトを公開するたびに「公開履歴」が残ります。

もし「前のバージョンの内容に戻したい」「一度公開した内容をやり直したい」と思ったとき、過去のバージョンを選んで再度公開(ロールバック)できます。

再公開するとどうなる?

  • 選んだバージョンのHTMLやCSSなどがそのまま復元されて即公開されます。
  • Figmaのキャンバス自体(デザインデータ)は変わりません。
  • 「以前のバージョンを再公開しました」という履歴が残ります。

ポイント・注意点

  • デザイン(キャンバス)は変わらないので、必要ならデザインも手動で戻す必要があります。
  • 公開履歴はいつでも確認でき、何度でもロールバック可能です。
  • 再公開後も、履歴としてどのバージョンを使ったかが残ります。

参考:https://help.figma.com/hc/en-us/articles/31242845959703-Publish-update-or-unpublish-a-site

Figma Sitesまとめ

Figma Sitesは、デザインからWebサイト公開までのワークフローを劇的に効率化し、ノーコードでのWeb制作をさらに身近なものにする革新的なサービスです。今後はCMS機能やコード生成の強化、SEO対応など、さらなる進化が期待されています。デザイナーやWebディレクター、マーケターなど、幅広い職種にとってWeb制作の新たな選択肢となるでしょう。