何が共有しづらいのか
管理画面モックはページ遷移やモーダル開閉などJSによるインタラクションが多い。ローカルファイルとして開くとfile://プロトコルの制限でAjax呼び出しがブロックされ、画面が正しく動かない。また社内共有ドライブに置いてもレビュアーの権限設定が必要になり、実際に開いてもらうまでに一往復かかる。
Difyの生成画面にはアカウント認証が必要なため、そのURLを社外の関係者に送ることはできない。エクスポートしたHTMLにもモックの顧客データや社員名が含まれる場合があり、そのまま外部共有すると情報管理上の問題になる。共有前の内容精査が特に重要だ。
- 相手がログインなしで開ける状態か確認する
- PCとスマホで最低1回ずつ表示を確認する
- 内部情報・個人情報・不要な外部送信が残っていないか見る
- レビュー期限と修正時の差し替え方を決めておく
URL化する前の確認点
管理画面モックのHTMLに含まれるAPIエンドポイント呼び出しを確認する。DifyがfetchやaxiosでバックエンドAPIを叩くコードを生成している場合、そのエンドポイントを本番ドメインのまま共有すると、レビュアーの操作が本番データを変更する恐れがある。エンドポイントはモックレスポンスを返すJSオブジェクトか、https://jsonplaceholder.typicode.comのようなパブリックモックに差し替える。
テーブルに表示されるモックデータにリアルな氏名・メールアドレス・電話番号が含まれていないかをHTMLソースで検索する。正規表現でメールアドレスパターン(@を含む文字列)を検索すると効率的だ。見つかった場合は`user@example.com`や`山田 太郎(仮)`のような明示的なダミーに置き換える。
- HTML内の外部script・form action・iframeを確認する
- APIキーやトークンらしき文字列がないか検索する
- 画像・CSS・JSのパスが公開後も解決できるか見る
- noindexと認証を混同せず、必要なら両方設定する
認証と期限の決め方
管理画面モックは社内の業務フローを模しているため、社外に無制限に公開するのはリスクが高い。社内レビューならば会社ドメイン認証が適切で、社外パートナーが含まれる場合はパスワード認証に切り替える。いずれの場合も`noindex`メタタグを設定して検索エンジンからのクロールを防ぐ。
管理画面のレビューサイクルは要件確定まで複数回繰り返すことが多い。毎回新URLを発行するより、同じURLで上書き更新できる運用にしてレビュアーにブックマークしてもらうほうが効率的だ。一方、最終承認後は期限を設定してURLを失効させ、古いモックへのアクセスを閉じる。
- 誰でも見てよい: URL共有のみでもよいが、検索除外は確認する
- 特定の相手だけ: パスワードまたはメール認証を使う
- 会社内だけ: 会社ドメイン認証を検討する
- 短期レビュー: 期限を設定して古いURLを残さない
共有後のフィードバック回収
管理画面のレビューでは「このメニュー構造で目的の操作に辿り着けるか」「一覧画面のソート・フィルタ項目が業務に必要な軸と合っているか」など業務担当者でないと答えられない観点を中心に質問する。URLとともにFigJamやMiroのコメント収集ボードを別途用意すると、画面の特定箇所への意見を可視化しやすい。
複数の画面をレビューさせる場合は画面名を番号で整理し、「2番のユーザー一覧画面について」「5番の設定画面について」と指定した形で質問を送ると回答が整理されやすい。修正後に更新した際はどの画面が変わったかをリストで伝え、全画面を見直す手間をレビュアーに与えないようにする。
- 確認してほしい観点を3つ以内に絞る
- 期限と返信先を明記する
- 修正後も同じURLで見られるか伝える
- 最終版と途中版が混ざらないようタイトルを付ける
よくある質問
管理画面モックのAPIエンドポイントを差し替えずに共有してしまった場合のリスクは?
レビュアーがボタンを押すたびに本番APIが叩かれ、データの登録・更新・削除が発生する可能性があります。気付いた時点ですぐURLを失効させ、エンドポイントをモックに差し替えた版を再公開してください。
管理画面モックを毎回のイテレーションで新しいURLで共有すべきですか?
同じURLを上書き更新できるサービスを使うと、レビュアーがブックマークをそのまま使えます。URL変更のたびに連絡するコストを省け、古い版との混乱も防げます。
会社ドメイン認証と社外パートナーが両方必要な場合はどうすればいいですか?
社外パートナーを含む場合はパスワード認証に統一するのがシンプルです。パスワードをSlackチャンネルやメールで別送し、URLと同時に受け取れないようにすると安全性が高まります。