機能プロトタイプ、Webアプリ、またはインタラクティブUIを世界中に共有する準備ができたら、公開しましょう。公開することで、機能プロトタイプやWebアプリが、パブリックWeb上の専用URLからアクセスできるようになります。
公開後、機能プロトタイプやWebアプリを段階的に変更したり、非公開にしたりして、パブリックWebから削除できます。
Webアプリにカスタムドメインを割り当てることもできます。割り当て可能なカスタムドメインの数は、ご利用のプランに基づいています。この上限数はFigma Sitesと共有されています。
注意: Figma Makeでの公開は、管理者設定で無効にできます。Figma Makeの[公開]ボタンが無効になっていて公開できない場合、お客様が所属するチームまたは組織が公開を無効にしています。
機能プロトタイプまたはWebアプリを公開する
注: 公開する前に、お客様が機能プロトタイプまたはWebアプリのすべてのコンテンツに対する権利を持ち、かつFigmaの利用規約に準拠していることをご確認ください。なお、Figma Makeが提供する画像は、Unsplashの画像であることにご注意ください。Figma Makeの画像を使用する場合は、ご自身のユースケースに照らし合わせて適切かどうかを自らご確認いただく責任があります。これらの画像には、https://unsplash.com/termsに記載されているUnsplashの利用規約が適用されます。
以下の手順で、機能プロトタイプまたはWebアプリを公開できます。
- 公開したいFigma Makeファイルを開きます。
- 右上の[公開]をクリックします。
- [公開]モーダルで、タイトルを設定します。
- Figma Makeインターフェースの右上にあるMakeの設定]を必要に応じてクリックすると、サイトの追加設定を変更できます。
- [公開]をクリックします。
[公開]をクリックすると、機能プロトタイプまたはWebアプリがパブリックWeb上で一般公開されます。Figma Makeが提供するランダムに生成されたパブリックURLを使用して、公開された機能プロトタイプまたはWebアプリにアクセスし、共有できます。生成されるURLは、three-random-words.figma.siteのような形式となります。
注: 機能的なプロトタイプやウェブアプリが公開に失敗することがあります。そのような場合は、数分待ってから再試行してください。
機能プロトタイプまたはウェブアプリを公開すると、公開ウィンドウに次の内容が表示されます。
- Figmaによって自動生成されたWebアプリのURL。このURLをクリックすると、公開済みの機能プロトタイプまたはWebアプリにアクセスできます。また、必要に応じてカスタムドメインを使用するよう切り替えることができます。
- ステータスは公開済みです。
- 最新の公開日を表示する新しいフィールド。
重要: Figma Makeの画像を使用または公開する際には、弁護士にご相談のうえ、法的義務を十分に理解して行ってください。確実に法律を遵守するために、これらのガイドラインのみに依存しないでください。
お客様は、ユーザーから収集する情報（サイトにアップロードされたものや訪問者情報など）に対する責任を負い、法令を遵守してデータを管理する必要があります。
公開された機能プロトタイプまたはWebアプリを更新する
既存のコンテンツを修正する必要がある場合は、機能プロトタイプまたはWebアプを更新して公開できます。
機能プロトタイプ、Webアプリ、インタラクティブUIの変更は、更新バージョンを公開した後にのみ表示されます。たとえば、Webアプリのインターフェースを変更しても、公開済みの機能プロトタイプまたはWebアプリには、更新した内容を公開するまでその変更内容が反映されることはありません。
変更した内容を公開するには、機能プロトタイプまたはWebアプリを公開するの手順に沿って作業を行います。次に、公開モーダルで、[更新]をクリックします。
カスタムドメインを追加
公開した機能プロトタイプまたはWebアプリにFigma Makeがランダムに生成したURL以外のURLを割り当てたい場合は、Webアプリにカスタムドメインを割り当てることができます。たとえば、カスタムドメインを追加することで、公開済みの機能プロトタイプやWebアプリのURLにhttps://www.yourdomain.comを割り当てることができます。
カスタムドメインを割り当てるには、サイトのカスタムドメインを管理の手順に従います。手順はFigma Makeでも同じです。
機能プロトタイプまたはWebアプリを非公開にする
非公開にした機能プロトタイプまたはWebアプリは、パブリックWebから削除されます。もし後で再度公開する場合、Figmaは同じURLを再利用します。以下の手順で非公開にすることができます。
- 非公開にしたい機能プロトタイプまたはWebアプリのFigma Makeファイル内で、右上の Makeの設定をクリックします。
- [公開を取り消す]をクリックします。
公開モーダル
公開モーダルには、現在のタイトル、URL、ステータス（公開済みか未公開か）が含まれます。
公開モーダルには、以下の項目が含まれています。
-
タイトル: 機能プロトタイプまたはWebアプリのタイトル。ブラウザのタブ、検索エンジンの検索結果、ソーシャルメディアに表示されます。タイトルを追加することで、ユーザーが閲覧中のサイトを理解しやすくなり、SEOやアクセシビリティが改善します。
-
URL: 未公開の機能プロトタイプまたはWebアプリの場合、サンプルURLが表示されます。公開したことがある場合、公開済みの機能プロトタイプまたはWebアプリの実際のURLが表示されます。非公開にすると、表示されているURLは変わりませんが、パブリックWeb上ではアクティブではなくなります。
-
ステータス: デフォルトのステータスは非公開 です。機能プロトタイプまたはWebアプリが稼働中の場合は、公開済みと表示されます。
Makeの設定モーダル
機能プロトタイプやWebアプリを公開する前または後に設定できる高度なオプション設定がいくつかあります。Makeの設定モーダルを表示するには、Figma Makeインターフェースの右上のMakeの設定をクリックします。
Makeの設定モーダルでは、公開された機能プロトタイプやWebアプリのメタデータとそれらが検索可能かどうかを指定できます。また、機能プロトタイプが公開されているかどうかを確認し、公開または非公開を切り替え、以下のような設定を行えます。
タイトル
タイトル設定を使用して、公開済みの機能プロトタイプまたはWebアプリのタイトルを指定します。タイトルはブラウザのタブ、検索エンジンの結果、ソーシャルメディアに表示されます。タイトルを追加することで、ユーザーが閲覧中のページをブラウザで把握しやすくなります。また、SEOとアクセシビリティが改善します。
メタ説明文
「メタ説明文」の設定を使用して、公開した機能的なプロトタイプまたはウェブアプリの説明を提供します。メタ説明文は、ウェブサイトやページのコンテンツの短い要約であり、ユーザーを引き付け、検索エンジン結果ページ（SERP）からのクリック率を向上させるために設計されています。
言語
言語設定を使用して、機能プロトタイプまたはWebアプリのコンテンツのプライマリー言語を定義します。機能プロトタイプまたはWebアプリに言語コードを設定することで、アクセシビリティが向上するとともに、主要言語を明確に示すことでブラウザの翻訳機能のサポートにもなります。
ISO言語コードは、各言語に一意の識別子を割り当てます。以下は、特によく使用される言語コードです。
- ar – アラビア語
- de – ドイツ語
- en – 英語
- es – スペイン語
- fr – フランス語
- ja – 日本語
- hi – ヒンディー語
- ru – ロシア語
- pt – ポルトガル語
- zh – 中国語
ISO言語コードの全リストは、Wikipediaでご覧いただけます。
GoogleアナリティクスID
Googleアナリティクスで、GoogleアナリティクスのID設定から、使用状況のメトリクスを取得できます。Googleアナリティクスのプロパティに接続して、公開済みWebサイトの利用状況に関するインサイトを取得します。
GoogleアナリティクスIDを見つける方法については、Googleのインストラクションをご確認ください。
注: 現時点ではGoogleアナリティクスのみに対応していますが、将来的には対応アナリティクスプロバイダーを増やすことを目指しています。機能プロトタイプまたはWebアプリのヘッドおよびボディのカスタムコード設定を使用することで、Figmaが直接対応していないアナリティクスプラットフォーム用にコードスニペットを提供できます。
なお、ご自身の機能プロトタイプまたはWebアプリが、Cookie、プライバシー、データ収集に関する法律をはじめとする適用法に準拠していることを確認するのはお客様の責任であることにご注意ください。
検索エンジンの結果からすべてのページを除外します
検索エンジンの結果からすべてのページを除外する設定を有効にすることで、機能プロトタイプやWebアプリをインデックスしない、または検索結果に表示しないように検索エンジンのロボットに伝えることができます。
チェックボックスをオンにして、公開済みの機能プロトタイプまたはWebアプリのヘッダーに<meta name="robots" content="noindex">タグを追加します。
ファビコン
ファビコン設定を使用して、ファビコンとして使用する画像をアップロードします。ファビコンは、ブラウザのタブ、検索結果、ブックマークで、公開された機能プロトタイプやWebアプリを視覚的に示す小さな画像です。32ピクセル × 32ピクセルの画像を使用することをおすすめします。
ソーシャルメディア共有用画像
ソーシャルメディア共有用画像の設定を使用して、公開された機能プロトタイプやWebアプリがソーシャルメディアで共有される際に表示される画像をアップロードできます。幅1,200ピクセル、高さ630ピクセルの画像を使用することをおすすめします。
サイトのヘッドおよびボディ用のカスタムコード
機能プロトタイプまたはWebアプリのheadタグやbodyタグの最初または最後に、カスタムコードスニペットを追加できます。
たとえば、アナリティクスなどの重要なタグはheadに読み込んで、なるべく早く実行されるようにします。一方、チャットウィジェットなどの重要度の低いタグはbodyの最後に配置して、機能プロトタイプやWebアプリのメインコンテンツの読み込み速度が低下しないようにします。