AI活用

Builder.io Visual Copilotで生成したHTMLスライドをレビュー用URLにして共有する方法

Builder.io Visual CopilotでデザインしたHTMLスライドは、ブラウザで動くインタラクティブなプレゼンとして魅力的な反面、「どうやって相手に見せるか」の手間がかかる。PowerPointと違って添付送信できないし、GitHubPagesに上げるほどでもない。ギガサイト便なら生成したHTMLをそのままアップロードするだけで、パスワード付きプレビューURLが数秒で発行できる。

何が共有しづらいのか

HTMLスライドはReveal.jsやImpress.jsなどのライブラリに依存することが多く、CDNリンクが切れたり社内プロキシでブロックされたりするとスライドが真っ白になる。Builder.io Visual Copilotが生成したコードのCDN参照を確認し、必要ならライブラリをzipに同梱してからアップロードするとトラブルを防げる。

スライドには「非公開の製品ロードマップ」や「社外秘の数値目標」が入ることがある。プレゼン前日に共有するレビューURLが発表後も生き続けると、検索エンジンにインデックスされるリスクや、発表後に情報が広まるリスクが生まれる。有効期限を「発表日の翌日まで」に設定するだけでリスクを大幅に下げられる。

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

URL化する前の確認点

スライドのHTMLを開き、キーボードショートカット(矢印キー・スペースキー)でスライド送りが正しく動作するか確認する。JavaScriptが外部CDNを参照している場合は、オンライン環境で1度動作確認してからアップロードする。スライドの最後のページまで到達できることと、フルスクリーン表示が崩れないことをチェックする。

スライド内に埋め込んだ動画や音声ファイルのパスが、アップロード後も正しく解決されるか確認する。動画を外部URL(YouTubeなど)で参照している場合は限定公開設定になっているかを見る。Base64でHTMLに直接埋め込む手もあるが、ファイルサイズが大幅に増えるためzip形式でのアップロードを推奨する。

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

認証と期限の決め方

社内プレゼン前の上長レビューであれば、パスワード認証1つで十分だ。上長1〜2名にパスワードをメッセージで伝え、「明日の発表前に確認してください」と依頼する。返答がなかった場合に「開いたかどうか」をアクセスログで確認できると便利で、確認依頼を再送するタイミングの判断に使える。

外部登壇のスライドを事前に主催者へ共有する場合は、メール認証を使うとよい。主催者のメールアドレスを指定してアクセスを限定し、期限は「登壇日の前日23:59」に設定する。当日のセッション開始後は自動でURLが無効になるため、スライドの内容が事後に流出するリスクを減らせる。

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

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

スライドのレビュー依頼では「スライド枚数・所要時間・確認してほしい3点」をセットで伝える。「発表時間は15分を想定しています。①ストーリーの流れ ②グラフの見やすさ ③最終スライドのCTAを確認してください」という形にすると、レビュアーが何に集中すればよいかが明確になる。

スライド修正後は変更したスライド番号と変更内容を箇条書きで伝える。「スライド5枚目のグラフを棒グラフから折れ線グラフに変更しました」という具体的な変更ログがあると、レビュアーは全ページを見直さずに変更箇所だけ確認できる。このひと手間でフィードバックのターンアラウンドが速くなる。

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

よくある質問

スライドをReveal.jsで作成しています。プレゼンモード(発表者ノート表示)もレビュアーに見せる必要がありますか?

レビューの目的によります。デザインや内容を確認してもらうだけなら通常表示で十分です。発表者のスピーチ内容も合わせてレビューしてもらう場合は、Reveal.jsのノートプラグインが有効な状態でアップロードし、ショートカットキー(Sキー)で開ける旨を伝えましょう。

スライドのアニメーションがURL上で動作しません。ローカルでは正常に動いていました。

CSSアニメーションやJSアニメーションは通常URLでも動作します。動かない場合はブラウザのContent Security Policyによってインラインスクリプトがブロックされている可能性があります。`<meta http-equiv="Content-Security-Policy">`タグを削除するか、CSPを緩和した状態で再アップロードしてみてください。

登壇後にスライドを一般公開したいのですが、レビュー用URLをそのまま使えますか?

レビュー用URLは認証・期限付きで設定しているため、一般公開には向きません。登壇後は認証なし・期限なしの設定で新しいURLを発行し直すことをお勧めします。旧URLは無効化しておくと管理がシンプルになります。

関連記事

「AI活用」の記事をもっと見る →