AI活用

Firebase Studioで生成したLP案をレビュー用URLにして共有する方法

Firebase StudioでAI生成したLP案を関係者に見せたいとき、ローカルのHTMLファイルをそのまま送っても相手の環境では正しく表示されないケースが多い。ギガサイト便を使えばHTMLをアップロードするだけでパスワード付きのプレビューURLが発行でき、デザイナーや営業担当が自分のブラウザで即確認できる状態になる。

何が共有しづらいのか

Firebase StudioはHTMLを出力してくれるが、相対パスで参照している画像やCSSが手元のフォルダ構造に依存しているため、ファイルをメールに添付して送っても受け取った側では崩れた状態で表示されることが多い。zip圧縮して展開してもらう方法もあるが、確認してほしい相手がエンジニア以外の場合は手順説明だけで時間を取られてしまう。

また、LP案には競合分析や価格戦略が含まれる場合があり、不特定多数が閲覧できるURLに公開するのはリスクがある。認証なしのホスティングサービスにそのままアップすると、URLを知っていれば誰でも閲覧できてしまう点も注意が必要だ。共有の手軽さと情報漏えいリスクのバランスを取る手段が求められる。

  • 相手がログインなしで開ける状態か確認する
  • PCとスマホで最低1回ずつ表示を確認する
  • 内部情報・個人情報・不要な外部送信が残っていないか見る
  • レビュー期限と修正時の差し替え方を決めておく

URL化する前の確認点

Firebase Studioが生成したLPのHTMLには、外部CDNからReactやTailwindを読み込むscriptタグが含まれることがある。公開環境でその外部スクリプトが動作するか、またContent Security Policyとの競合がないかをブラウザの開発者ツールで確認しておく。特にform actionが実際のAPIエンドポイントを指している場合、レビュー用URLでの送信が本番データに届いてしまう恐れがある。

LP案としてのHTMLであっても、AIが生成するコードにはサンプル用のAPIキーや仮のトークン文字列が紛れ込むことがある。公開前にエディタの全文検索で「key」「token」「secret」などの文字列を確認し、該当する記述があれば削除またはダミー値に置き換えてからアップロードする。noindexメタタグはあくまでクローラーへの指示であり、認証の代わりにはならない点も理解しておく。

  • HTML内の外部script・form action・iframeを確認する
  • APIキーやトークンらしき文字列がないか検索する
  • 画像・CSS・JSのパスが公開後も解決できるか見る
  • noindexと認証を混同せず、必要なら両方設定する

認証と期限の決め方

社外のクライアントにLP案を見せる場合はパスワード認証が最もシンプルだ。ギガサイト便でURLを発行する際にパスワードを設定し、そのパスワードをSlackやメールで別途伝える。URLとパスワードを同じメッセージに書くのは避け、URLだけ先に送ってパスワードを後から伝えると誤送信リスクを下げられる。

社内の特定部署だけが確認する場合は、会社ドメイン認証を使うと個別パスワードを管理する手間が省ける。レビュー期間が1週間程度なら、期限を設定して期間終了後にURLを自動無効化しておくと、古いLP案が引き続き閲覧される状況を防げる。修正が入って差し替えた後も同じURLで最新版が見られるかどうかを事前に確認しておくと、フィードバック中の混乱を減らせる。

  • 誰でも見てよい: URL共有のみでもよいが、検索除外は確認する
  • 特定の相手だけ: パスワードまたはメール認証を使う
  • 会社内だけ: 会社ドメイン認証を検討する
  • 短期レビュー: 期限を設定して古いURLを残さない

共有後のフィードバック回収

LP案の共有時に「全体的にどう思いますか」と聞いても回答が曖昧になりやすい。「ファーストビューのキャッチコピーは訴求対象に刺さるか」「CTAボタンの色と文言は適切か」のように、確認してほしい観点を2〜3点に絞って伝えると、レビュアーが集中して見るべき箇所が明確になる。

修正が発生した場合に同じURLで最新版が確認できる仕組みであれば、その旨をあらかじめ伝えておく。「このURLは修正のたびに更新されます」と明記することで、古いスクリーンショットをベースにコメントされる事態を防ぎやすい。フィードバックの返信期限も日時まで明示し、期限を過ぎた分はレビュー対象外とするルールを決めておくと進行がスムーズになる。

  • 確認してほしい観点を3つ以内に絞る
  • 期限と返信先を明記する
  • 修正後も同じURLで見られるか伝える
  • 最終版と途中版が混ざらないようタイトルを付ける

よくある質問

LP案のHTMLに画像が含まれている場合、画像もまとめてアップロードできますか?

ギガサイト便ではHTMLと関連ファイルをzipにまとめてアップロードできます。画像・CSS・JSをzipに含めることで、相対パスのままでも正しく表示されます。

レビュー期限を過ぎたURLはどうなりますか?

設定した期限を過ぎるとURLへのアクセスが自動的に無効になります。期限前であれば管理画面から延長することも可能です。

パスワードを設定したURLを誤って社外に広く共有してしまった場合はどう対処すればよいですか?

管理画面からURLを即時無効化し、新しいパスワードで別のURLを発行し直すことができます。元のURLにはアクセスできなくなります。

関連記事

AI活用

Google Stitchで生成したLP案をレビュー用URLにして共有する方法

Google StitchでLP案を生成したデザイナー・マーケター向け。生成したHTMLをレビュー用URLとして安全に共有するための前処理・認証設定・フィードバック回収の手順を具体的に解説し、どの認証方式が適切か判断できるようにする。

4分で読める
「AI活用」の記事をもっと見る →