機能プロトタイプ、Webアプリ、またはインタラクティブUIを世界中に共有する準備ができたら、公開しましょう。公開することで、機能プロトタイプやWebアプリが、パブリックWeb上の専用URLからアクセスできるようになります。
公開後、機能プロトタイプやWebアプリを段階的に変更したり、非公開にしたりして、パブリックWebから削除できます。
Webアプリにカスタムドメインを割り当てることもできます。割り当て可能なカスタムドメインの数は、ご利用のプランに基づいています。この上限数はFigma Sitesと共有されています。
機能プロトタイプまたは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の設定をクリックします。
- [公開を取り消す]をクリックします。
注意: 有料プランから無料プランにダウングレードすると、以前にWebやFigmaコミュニティに公開したFigma Makeファイルは、そのままfigma.siteのサブドメインで公開され、利用可能なままになります。
公開モーダル
公開モーダルには、以下の項目が含まれています。
- タイトル: 機能プロトタイプまたはWebアプリのタイトル。ブラウザのタブ、検索エンジンの検索結果、ソーシャルメディアに表示されます。タイトルを追加することで、ユーザーが閲覧中のサイトを理解しやすくなり、SEOやアクセシビリティが改善します。
- URL: 未公開の機能プロトタイプまたはWebアプリの場合、サンプルURLが表示されます。公開したことがある場合、公開済みの機能プロトタイプまたはWebアプリの実際のURLが表示されます。非公開にすると、表示されているURLは変わりませんが、パブリックWeb上ではアクティブではなくなります。
- ステータス: デフォルトのステータスは非公開 です。機能プロトタイプまたはWebアプリが稼働中の場合は、公開済みと表示されます。
- 閲覧できる人(組織およびエンタープライズプランのみ): アプリをWeb上で誰もが公開できるように公開するか、内部オーディエンスにのみアクセスを制限することができます。
Makeの設定モーダル
機能プロトタイプやWebアプリを公開する前または後に設定できる高度なオプション設定がいくつかあります。Makeの設定モーダルを表示するには、Figma Makeインターフェースの右上のMakeの設定をクリックします。
Makeの設定モーダルでは、公開された機能プロトタイプやWebアプリのメタデータとそれらが検索可能かどうかを指定できます。また、機能プロトタイプが公開されているかどうかを確認し、公開または非公開を切り替え、以下のような設定を行えます。
- タイトル
- メタ説明文
- 言語
- GoogleアナリティクスID
- 検索エンジンの結果からすべてのページを除外します
- ファビコン
- 公開されたアプリへのアクセスを管理する
- ソーシャルメディア共有用画像
- サイトのヘッドおよびボディ用のカスタムコード
タイトル
タイトル設定を使用して、公開済みの機能プロトタイプまたはWebアプリのタイトルを指定します。タイトルはブラウザのタブ、検索エンジンの結果、ソーシャルメディアに表示されます。タイトルを追加することで、ユーザーが閲覧中のページをブラウザで把握しやすくなります。また、SEOとアクセシビリティが改善します。
タイトルが提供されていない場合、Figmaは自動で生成します。
メタ説明文
「メタ説明文」の設定を使用して、公開した機能的なプロトタイプまたはウェブアプリの説明を提供します。メタ説明文は、ウェブサイトやページのコンテンツの短い要約であり、ユーザーを引き付け、検索エンジン結果ページ（SERP）からのクリック率を向上させるために設計されています。
説明が提供されていない場合、Figmaは自動で生成します。
言語
言語設定を使用して、機能プロトタイプまたは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アプリを視覚的に示す小さな画像です。48ピクセル × 48ピクセルの画像を使用することをおすすめします。
公開されたサイトへのアクセスを管理する
公開されたアプリにアクセスできる人を選択するビジネスプラン エンタープライズ
ビジネスプランおよびエンタープライズプランでは、自分のアプリをオープンWebで公開するか、内部オーディエンスに限定するかを選択できます。ファイルが内部で公開されている場合、次のようになります。
- 組織のログインしているメンバーは誰でも閲覧可能
- ゲストや組織外の人はアクセスできません
注意: オーディエンスをWeb上のユーザー全員に設定するオプションがない場合、管理者がオープンWebへの公開を無効にした可能性があります。
パスワード保護を追加する
パスワード保護が有効な場合、訪問者は公開されたWebアプリのコンテンツを見るためにパスワードを入力する必要があります。これには、タイトルや説明などのメタデータも含まれます。
自分でパスワードを作成するか、Figmaによって自動生成されたものを使用することができます。
- 作成するパスワードは最低でも4文字使用し、どのような文字タイプも含めることができます
- Figmaで生成されたパスワードは、4つのランダムな言葉を組み合わせており、強力かつユニークです
パスワードは保存するとすぐに公開したWebアプリに自動的に適用されます。再公開する必要はありませんが、変更が適用されるまでに1、2分かかることがあります。
注意: 検索エンジンの結果から除外されていない公開済みWebアプリにパスワードを追加した場合、いくつかのメタデータが検索リストに引き続き表示されることがあります。パスワード保護が有効になると、検索エンジンはWebアプリのコンテンツをインデックスできなくなり、時間の経過と共に結果から消える傾向があります。プロセスを速めたい場合は、Google Search Centralを通して削除をリクエストすることができます。
設定後のパスワードは再度閲覧できません。コピーするのを忘れた場合は、新しいものを作成する必要があります。パスワードを変更すると、以前のアクセス権を持っていた人は次回Webアプリを更新する際に新しいパスワードを入力する必要があります。
注意: パスワードの設定時にいくつかの制限を受けることがあります。
- 自分でパスワードを作成できない場合、組織がおそらく自動生成されたパスワードだけを使用するよう義務付けています。あなたの組織は、すべての公開Sitesに対してパスワード保護を要求することがあります。
- オーディエンスが内部のみに設定されている場合は、パスワードを追加できません。
ソーシャルメディア共有用画像
ソーシャルメディア共有用画像の設定を使用して、公開された機能プロトタイプやWebアプリがソーシャルメディアで共有される際に表示される画像をアップロードできます。幅1,200ピクセル、高さ630ピクセルの画像を使用することをおすすめします。ソーシャル共有イメージが提供されていない場合、Figmaはアプリのイメージスナップショットを代わりに使用します。
サイトのヘッドおよびボディ用のカスタムコード
機能プロトタイプまたはWebアプリのheadタグやbodyタグの最初または最後に、カスタムコードスニペットを追加できます。
たとえば、アナリティクスなどの重要なタグはheadに読み込んで、なるべく早く実行されるようにします。一方、チャットウィジェットなどの重要度の低いタグはbodyの最後に配置して、機能プロトタイプやWebアプリのメインコンテンツの読み込み速度が低下しないようにします。
よくある質問
アプリへのリンクを共有すると、古いアプリや間違ったメタデータが表示されます。どうすれば直せますか?
まず、アプリの最新バージョンが、すべての更新されたメタデータとともに公開されていることを確認してください。すべて公開されているのに、他のプラットフォームで古い情報が表示される場合は、キャッシングが原因と考えられます。
ほとんどのソーシャルプラットフォームは、URL が最初に共有された際に、タイトル、説明、プレビュー画像などのリンクメタデータをキャッシュします。ページを更新しても、プラットフォームが古いデータを表示し続ける可能性があります。プレビューを更新するには、プラットフォームのデバッグやプレビューツールを通じてURLを実行し、「キャッシュを破棄」することで最新のメタデータを再取得することができます。
メタデータを更新するためのツール:
- Facebook: シェアデバッガー
- LinkedIn: Post Inspector
- X (Twitter): Card Validator
-
Slack: プレビューは時間が経つと自動的に更新されますが、リンクを少し変えて(例: URLの末尾に
?v=2を追加するなど)共有することで、新しいプレビューを表示させることができます。