---
title: "Galileo AIで生成した管理画面モックをレビュー用URLにして共有する方法"
description: "「FigmaのリンクはあるけどHTMLで触れない」という声は管理画面レビューでよく聞く悩みだ。Galileo AIで生成したダッシュボードや設定画面のモックをHTMLのまま共有し、エンジニア以外のメンバーがブラウザで確認できるURLを発行する手順をまとめた。"
image: "https://giga-site.com/og-image.png"
canonical: "https://giga-site.com/articles/galileo-ai-admin-mock-review-url"
markdown: "https://giga-site.com/articles/galileo-ai-admin-mock-review-url/index.md"
category: "AI活用"
publishedAt: "2026-06-25"
updatedAt: "2026-06-25"
readingMinutes: 5
---
# Galileo AIで生成した管理画面モックをレビュー用URLにして共有する方法

Galileo AIを使うと、管理画面のダッシュボードや設定画面のモックを自然言語のプロンプトから数分で生成できる。FigmaベースのアウトプットをHTML化してURLで共有できれば、エンジニアやPMが自分のブラウザで確認できるため、Figmaアカウントを持たないステークホルダーも巻き込みやすい。共有前に整理すべき確認事項を押さえれば、モックを素早く社内に届けられる。

> Source HTML: https://giga-site.com/articles/galileo-ai-admin-mock-review-url
> Article index: https://giga-site.com/articles/index.md

## 何が共有しづらいのか

Galileo AIが生成する管理画面デザインはFigmaのオートレイアウトを多用しているため、HTML変換後にネスト構造が複雑なdivになることがある。ブラウザでは正常に見えても、モバイル画面ではカラムが崩れる場合があるため、共有前にレスポンシブ確認が必要かをレビュー目的に応じて判断する。管理画面はPC専用と明示するなら省略できる。

管理画面モックには「月次売上グラフ」「ユーザー数の推移」のようなダッシュボードKPIが含まれることが多い。Galileo AIのプロンプトに実際のKPI数値を入力した場合、それがそのままHTMLに残るため、社内外の関係者に共有する前に架空の数値に置き換える必要がある。特に上場企業の場合、非公開の業績情報がURLで流出すると重大な問題になる。

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

## URL化する前の確認点

Figmaから変換したHTMLに、Figmaの開発ツールが挿入した`data-figma-id`属性が大量に含まれることがある。これはブラウザ表示に影響しないが、HTMLソースを見たレビュアーがFigmaのノードIDから設計情報を推測できる可能性がある。機密性の高いモックでは変換後にこれらの属性を削除するか、minifyしてソースを読みにくくする対処が有効だ。

管理画面のHTMLにCSRFトークンのinputタグが含まれている場合（フレームワークのテンプレートから流用したコードを含む場合）、静的HTMLとして共有する文脈ではそのまま残しても無害だが、レビュアーに「本物のフォームと誤解される」可能性があるため、コメントアウトするかダミーと明示するラベルを添えるとよい。

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

## 認証と期限の決め方

管理画面のモックを社内のエンジニアチームにのみ共有する場合、会社ドメイン認証が管理コストゼロで最もシンプルだ。一方で社外の開発パートナーがレビューに参加する場合、パートナー企業のドメインを追加許可するか、個別のメールアドレス招待を使う。パスワード共有は管理が煩雑になるため、関係者が3名以上のレビューには不向きだ。

開発要件定義の会議スケジュールに合わせて期限を設定するのが実用的だ。週1回の定例会議で使うなら、次回会議から2日後を期限にするとレビュアーが会議後にも参照できる余裕が生まれる。モックが更新されるたびにURLを新規発行するか上書き更新するかは、サービスの仕様に合わせてチームで統一しておく。

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

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

管理画面モックのエンジニアレビューでは「このUIコンポーネントは既存のデザインシステムで実装できますか？」「データ取得に時間がかかった場合のローディング表示はモックに含まれていますか？」という設問が実装設計に直結する回答を引き出す。見た目の感想より実装制約の観点で質問する。

PMや事業責任者のレビューでは、管理画面の各モジュールが「誰がどのくらいの頻度で使うか」を1行添えて送ると、優先度判断がしやすくなる。「このレポート画面は月次の分析担当者が使い、日次操作者は使わない」という前提情報がないと、全画面を同じ重要度で見てしまい、フィードバックの粒度が揃わない。

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

## よくある質問

### 管理画面モックにリアルタイム更新のグラフ（WebSocket接続）がある場合、静的HTMLで共有しても意味はありますか？

WebSocket接続がない静的版では初期データを固定値で表示する形になります。グラフのレイアウトや凡例の読みやすさといったビジュアルレビューには十分で、データの動き（更新間隔・アニメーション）のレビューは別途デモ環境を用意するか録画して添付する方法が現実的です。

### Galileo AIで生成したFigmaデザインをHTML変換したら縦スクロールが無限に続く状態になりました。修正は必要ですか？

Figmaのフレームサイズがそのままbody heightに設定されることが原因で、CSSのheight: autoとoverflow-y: autoを適切に設定することで解消できます。レビュー目的のみなら、スクロール量をレビュアーに事前に伝えるだけで対処できる場合もあります。

### 複数の管理者ロール（一般管理者・スーパー管理者）の画面を1つのURLで切り替えて見せることはできますか？

URLパラメータ（例：?role=super）でCSSクラスを切り替えるJavaScriptを埋め込めば1つのURLで切り替えが可能です。実装が難しい場合は、役割ごとに別URLを発行して「一般管理者URL」「スーパー管理者URL」と明示して送る方法が確実です。

## 関連記事

- [Galileo AIで生成したLP案をレビュー用URLにして共有する方法](https://giga-site.com/articles/galileo-ai-lp-draft-review-url/index.md)
- [Galileo AIで生成したHTMLスライドをレビュー用URLにして共有する方法](https://giga-site.com/articles/galileo-ai-slide-html-review-url/index.md)
- [Galileo AIで生成したフォーム付きページをレビュー用URLにして共有する方法](https://giga-site.com/articles/galileo-ai-form-page-review-url/index.md)
- [Galileo AIで生成した社内ツール風プロトタイプをレビュー用URLにして共有する方法](https://giga-site.com/articles/galileo-ai-internal-tool-prototype-review-url/index.md)
- [Firebase Studioで生成した管理画面モックをレビュー用URLにして共有する方法](https://giga-site.com/articles/firebase-studio-admin-mock-review-url/index.md)
- [Google Stitchで生成した管理画面モックをレビュー用URLにして共有する方法](https://giga-site.com/articles/google-stitch-admin-mock-review-url/index.md)

```json
{
  "@context": "https://schema.org",
  "@type": "Article",
  "headline": "Galileo AIで生成した管理画面モックをレビュー用URLにして共有する方法",
  "description": "「FigmaのリンクはあるけどHTMLで触れない」という声は管理画面レビューでよく聞く悩みだ。Galileo AIで生成したダッシュボードや設定画面のモックをHTMLのまま共有し、エンジニア以外のメンバーがブラウザで確認できるURLを発行する手順をまとめた。",
  "datePublished": "2026-06-25",
  "dateModified": "2026-06-25",
  "mainEntityOfPage": "https://giga-site.com/articles/galileo-ai-admin-mock-review-url",
  "url": "https://giga-site.com/articles/galileo-ai-admin-mock-review-url",
  "inLanguage": "ja",
  "image": "https://giga-site.com/og-image.png",
  "articleSection": "AI活用",
  "author": {
    "@type": "Organization",
    "name": "ギガサイト便"
  },
  "publisher": {
    "@type": "Organization",
    "name": "ギガサイト便"
  },
  "mainEntity": [
    {
      "@type": "Question",
      "name": "管理画面モックにリアルタイム更新のグラフ（WebSocket接続）がある場合、静的HTMLで共有しても意味はありますか？",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "WebSocket接続がない静的版では初期データを固定値で表示する形になります。グラフのレイアウトや凡例の読みやすさといったビジュアルレビューには十分で、データの動き（更新間隔・アニメーション）のレビューは別途デモ環境を用意するか録画して添付する方法が現実的です。"
      }
    },
    {
      "@type": "Question",
      "name": "Galileo AIで生成したFigmaデザインをHTML変換したら縦スクロールが無限に続く状態になりました。修正は必要ですか？",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "Figmaのフレームサイズがそのままbody heightに設定されることが原因で、CSSのheight: autoとoverflow-y: autoを適切に設定することで解消できます。レビュー目的のみなら、スクロール量をレビュアーに事前に伝えるだけで対処できる場合もあります。"
      }
    },
    {
      "@type": "Question",
      "name": "複数の管理者ロール（一般管理者・スーパー管理者）の画面を1つのURLで切り替えて見せることはできますか？",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "URLパラメータ（例：?role=super）でCSSクラスを切り替えるJavaScriptを埋め込めば1つのURLで切り替えが可能です。実装が難しい場合は、役割ごとに別URLを発行して「一般管理者URL」「スーパー管理者URL」と明示して送る方法が確実です。"
      }
    }
  ]
}
```