詳細プレビュー
一覧から選択したレコードの要点を別枠で確認します。
詳細プレビューは、一覧の文脈を残したまま、選択した1件の重要情報を横や下の別枠に表示するための機能です。Roundtableでは「一覧では何を比較するか」「プレビューでは何を判断材料として見せるか」「編集画面へ進む条件は何か」を言葉にしておくと、発注者、実装者、AIに指示する人の認識を合わせやすくなります。
この機能でできること
問い合わせ、案件、予約、請求、タスクなどの一覧から1件を選択し、基本情報、状態、担当者、直近履歴、注意点、次の対応、添付の有無などを別枠で確認できます。詳細画面へ移動する前に判断材料を見られるため、一覧で対象を探す作業と、1件の内容を確認する作業を同じ流れで進められます。
一覧で選んだ1件の要点を、ページ遷移せずに確認するための機能です。
詳細画面ほど多くの入力欄を置かず、判断に必要な情報だけを圧縮して見せると、確認作業が速くなります。
よくある利用場面
問い合わせ内容を素早く読む
一覧で未対応の問い合わせを選び、本文、顧客情報、過去対応、次のアクションを右側で確認します。
案件やタスクの優先度を判断する
期限、担当者、進行状況、直近メモを見ながら、どのレコードを先に開くかを決めます。
公開側の申込内容を確認する
予約、資料請求、申込などで、利用者が選んだ1件の概要を確認してから編集や送信へ進みます。
プロンプト例
一覧の起点、選択中表示、プレビューに出す項目、編集画面や詳細画面への導線、スマホ時の表示方法をセットで伝えると、使う人が迷わない画面になります。
プロンプト
問い合わせ一覧に詳細プレビューを追加してください。行を選択すると右側の別枠に、顧客名、問い合わせ内容の要約、状態、担当者、直近3件の対応履歴、次に行う対応を表示します。選択中の行は色を変えて分かるようにし、プレビュー内に詳細画面へ進むボタンを置いてください。スマホでは一覧の下にプレビューを表示してください。
この機能を使うときのポイント
表示する要点一覧だけでは足りないが、詳細画面を開く前に見たい項目を絞ります。
選択中の分かりやすさどの行のプレビューか分かるように、選択中の行、見出し、識別番号をそろえます。
次の操作詳細を開く、編集する、返信する、担当変更するなど、確認後に取る操作を整理します。
画面幅への対応PCでは横並び、スマホでは下部表示や全画面表示にするなど、一覧とプレビューの見せ方を決めます。
この機能を実装するときのコツ
管理側では、一覧行の選択状態、プレビュー領域の差し替え、詳細ボタン、権限による表示制御を組み合わせます。公開側で使う場合は、ログイン不要で見せてよい情報か、URLやセッションで対象レコードをどう限定するかを先に確認します。プレビューは情報量が増えやすいため、最初は「概要、状態、担当、直近履歴、次の操作」程度に絞り、編集が必要な内容は詳細画面やダイアログへ分けると運用しやすくなります。