AI活用

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

Galileo AIはLP・管理画面だけでなく、スライド形式のHTMLページ生成にも応用できる。生成されたデザインをFigmaからHTMLに変換してURLで共有すれば、PowerPointやKeynoteを持っていない相手にもブラウザだけでプレゼン資料を届けられる。ただしスライドは「見た目がすべて」なため、崩れた状態で送ることは絶対に避けたい。共有前の確認手順を理解しておくことで、そのリスクをゼロに近づけられる。

何が共有しづらいのか

Galileo AIのアウトプットはFigmaのデザインファイルであり、スライドとして共有するためには画面ごとをHTMLに変換してページ送り機能を付加する作業が必要になる。FigmaのエクスポートではSVGや画像としての書き出しが主流だが、HTML変換を使った場合はナビゲーションボタンを自前で実装するか、スライドライブラリ(RevealJSなど)に乗せ替える手間が生じる。

スライドのデザインはアニメーションやトランジションで視覚的な品質が大きく変わる。Figmaのプロトタイプ機能で設定したトランジションはHTMLエクスポートでは失われることが多い。「Figmaで見たのと違う」というフィードバックを防ぐために、共有するURLがどのレベルの完成度のものか(トランジションなし・静的版)を依頼文に明記しておく。

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

URL化する前の確認点

スライドHTMLがRevealJSやImpress.jsなどのライブラリを使っている場合、CDN版ではなくローカルバンドル版を推奨する。CDNがダウンしたタイミングにレビュアーがURLを開くと、スライドが真っ白になる可能性があるからだ。共有サービスにzipをアップロードする際には、ライブラリのJSとCSSをhtmlと同階層に配置してHTMLのscript srcをローカルパスで参照する構成にする。

スライドの最初のページに社内向けの注釈(「Draft - 社外秘」のようなテキスト)が入っている場合、外部レビュアーに見せる版では削除するか「プレビュー版」のように書き換える。逆にプレビュー版であることを明示するウォーターマークを意図的に入れる場合は、本番HTML公開時に削除するプロセスをドキュメント化しておく。

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

認証と期限の決め方

社内の定例会議でスライドをプレビュー共有する場合、会社ドメイン認証を設定したうえで会議招集メールにURLを添えるのが効率的だ。参加者が自分のタイミングで事前確認でき、会議時間を説明ではなく議論に使える。URLは会議終了から1日後を期限にすると、会議後の参照時間も確保しつつ、古いスライドが参照され続けるリスクを減らせる。

ピッチやクライアントプレゼンの事前レビューでは、パスワード認証を設定してプレゼン当日にパスワードを会場で開示する方法が情報管理上最も安全だ。スライドの構成が変わるたびにURLを差し替える場合は、短縮URLサービスを間に挟むと相手に毎回URLを通知する手間が省ける。

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

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

スライドのレビューでは「論理の流れが追えるか」「データの根拠が示されているか」「デザインの視認性は高いか」の3観点をセットで質問すると、内容・構成・デザインの各レイヤーを分けたフィードバックが集まる。1つのフォームで3観点の評価を5段階で回答してもらう形式にすると、テキストコメントより回収率が高い。

スライドへのコメントを「○枚目:〜〜が見づらい」の形式で収集する場合、ページ番号がスライド上に表示されているかを事前に確認する。ページ番号がないスライドでは「上から3枚目」「棒グラフが出てくる枚」のような曖昧な参照になり、修正箇所の特定に時間がかかる。

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

よくある質問

Galileo AIのFigmaデザインをRevealJSのスライドに変換するには何が必要ですか?

Figmaから各スライドをSVGまたはPNGでエクスポートし、RevealJSのsectionタグにimgとして埋め込む方法が最も確実です。完全なHTML再現を目指す場合はFigma-to-HTML変換プラグインを使いますが、変換精度は画面複雑度に左右されるため確認が必要です。

スライドが60枚以上ある場合、zipのサイズはどのくらいになりますか?

テキストとベクター中心のスライドなら60枚でも5MB程度に収まります。高解像度の背景画像を使っている場合は1枚あたり500KB〜1MBになることがあり、60枚で30MB超になるケースもあります。画像は72dpiのJPEG品質75%程度で書き出すと大幅に圧縮できます。

スライドのレビューURLをクライアントに送ったら「開けない」と言われた場合、原因として何が考えられますか?

最多の原因は認証画面でパスワード入力が求められているのにパスワードが伝わっていないケースです。次に多いのはブラウザの互換性問題で、Internet ExplorerやiOS Safariの古いバージョンではJSが動作しないことがあります。まずブラウザとバージョンを確認してもらうよう依頼してください。

関連記事

AI活用

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

Galileo AIでLP案を生成し、承認者やマーケティングチームに素早くレビューを依頼したい担当者向け。Galileo AI固有のFigmaエクスポートとHTMLエクスポートの違い、競合情報を含むLP案のセキュアな共有手順、1往復で承認を取るための依頼文の書き方を解説する。

5分で読める
AI活用

Galileo AIで生成したフォーム付きページをレビュー用URLにして共有する方法

Galileo AIで生成したフォームUIデザインをHTML化してレビューURLを発行したいデザイナーやプロダクトマネージャー向け。送信先の無効化・マーケティングトラッカーの除去・フォームUXレビューに特化したフィードバック設問の設計を解説し、誤送信リスクなく外部レビュアーに届ける判断基準を提供する。

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