AI活用

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

Framer AIでLP案を作るとHTMLエクスポートまで数分で完了しますが、そのファイルをどうクライアントや上司に届けるかで手が止まります。ローカルファイルの送付では表示崩れが起きやすく、かといってFramerの共有リンクはアカウントが必要です。ギガサイト便ならHTMLをそのまま3秒でURL化し、認証付きでレビューを開始できます。

何が共有しづらいのか

Framer AIが生成するLPのHTMLには、Framerのホスティングに依存した相対URLが残るケースがあります。そのままHTMLファイルをメールに添付すると、受け取った相手のブラウザでCSSやJSが読み込まれず、白紙や崩れた状態で表示されることがあります。

クライアントに草稿段階のLPを見せる場合、Framer上の公開リンクをそのまま使うとFramerのブランドウォーターマークが表示されたり、誰でもアクセスできる状態になります。料金プランや未発表のキャンペーン訴求を含むLP案は、特定の相手だけに見せる仕組みが不可欠です。

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

URL化する前の確認点

Framer AIからエクスポートしたHTMLには、Framerのトラッキングスクリプトや解析タグが埋め込まれている場合があります。HTMLをVS Codeやテキストエディタで開き、framer.comドメインへのリクエストが発生するscriptタグがないか確認してください。不要な外部通信はレビュー環境でのCORSエラーや遅延の原因にもなります。

LP案に問い合わせフォームが含まれている場合、form要素のaction属性が本番のフォーム送信エンドポイントを指していないか確認します。レビュー用URLにアクセスしたテスターが誤って実際の送信を行ってしまうと、CRMへのダミーデータ混入につながります。フォームはaction属性を削除するか、テスト用エンドポイントに差し替えてからURL化します。

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

認証と期限の決め方

LP案のレビューを社内の承認者だけに限定する場合は、会社ドメイン認証が最適です。マーケティング部と経営層の両方が同じドメインを使っていれば、メールアドレスを個別に管理しなくても全員がアクセスできます。

クライアント企業への共有では、相手先のドメインを許可リストに追加するか、シンプルなパスワード認証を使います。LP案は競合他社に見られるとコピーされるリスクがあるため、期限は「フィードバック締め切りの翌日0時」と明確に設定し、期間外はURLを無効にすることを共有メッセージに明記します。

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

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

LP案のレビューでは「ヒーロービジョンのコピーは刺さるか」「CTAボタンの位置は自然か」「価格帯の提示はわかりやすいか」のように画面ブロック単位で質問を作ると具体的な回答が集まります。回答用のGoogleフォームかNotionページをURLと同時に送ると、口頭でのコメントが漏れにくくなります。

LP案は修正サイクルが速いため、v1・v2・v3でそれぞれ別のURLを発行するよりも、上書きアップロードで同じURLを維持する運用が効率的です。ただしv1の指摘事項が反映されているかをクライアントが確認したい場合は、v1のURLを期限切れにせず残しておくと比較が容易になります。

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

よくある質問

Framer AIのエクスポートHTMLはアニメーションが含まれますが、ギガサイト便でもアニメーションは正常に動きますか?

CSSアニメーションおよびJavaScriptで実装されたアニメーションはギガサイト便のURL上でも動作します。Framer独自のランタイムライブラリが必要な場合はCDNリンクが切れていないか事前に確認してください。

同じLPのA/Bバリアントを別々のURLで共有するにはどうすればよいですか?

バリアントごとにHTMLファイルをアップロードして別のURLを発行します。各URLのタイトルに「案A」「案B」と明記し、同じレビューリクエストメッセージにまとめて記載するとレビュアーが比較しやすくなります。

レビュアーがスマートフォンでURLを開いたとき、Framer AIのレスポンシブ表示は維持されますか?

ギガサイト便はHTMLをそのままホスティングするためFramer AIが生成したレスポンシブCSSは維持されます。事前にローカルのブラウザのモバイルエミュレーターで確認してからURLを発行することを推奨します。

関連記事

AI活用

Framer AIで生成したHTMLスライドをレビュー用URLにして共有する方法

発表直前に「スライドが開けない」と言われると困る。Framer AIで作ったアニメーション入りHTMLスライドは環境依存が大きく、ファイル送付ではレビューが成立しにくい。ギガサイト便でURLを発行すれば、上司や同僚がそのままブラウザで確認できる。

4分で読める
AI活用

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

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

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