サイドピーク

Side peek

一覧を表示したまま画面右側に詳細パネルをせり出させ、一覧の文脈を保ったまま個々の項目を確認できるUI。

○ 使う場面

  • 一覧の並び順や周辺項目を見失わずに、個々の項目の詳細を素早く確認・編集したいとき
  • URLにアイテムIDを載せて、詳細ページへの直接リンクを共有したいとき

× 避ける場面

  • 詳細を確認したら一覧に戻らず別作業に専念させたいとき(→ページ遷移やモーダル)
  • 一覧と詳細を対等な2ペインとして常時並べておきたいとき(→スプリットビュー)

別名

サイドピーク

近縁種との比較

「サイドピーク」はNotionが広めた呼称で、一覧を画面に残したまま右側に詳細パネルをせり出させる表示形式を指す。同じ役割を指す語としてMaterial Design 3のSide sheet、汎用的なDetail panel、Preview paneなどが並立するが、本図鑑では急速に普及したNotion発の呼称「サイドピーク」を見出し名に採用する。なお本サイト自身の詳細表示(カードクリックで開くダイアログ)もモーダル+ページ併用型であり、一覧の上に重ねて詳細を見せるという点でサイドピークの近い親戚と言える。

近縁種違い・使い分け
ドロワーメニュードロワーメニューも画面端からスライドするオーバーレイ点は共通するが、ドロワーは主にナビゲーションや設定パネルに使われ開くと一覧の文脈そのものを覆い隠すことが多いのに対し、サイドピークは一覧の並びを見せ続けたまま詳細だけを重ねて表示する。
スプリットビュースプリットビューが2ペインを常時固定表示するレイアウトであるのに対し、サイドピークは必要なときだけオーバーレイとしてせり出す一時的な表示という違いがある。
モーダル詳細を確認したら一覧に戻らず別作業に専念させたいときはモーダル(またはページ遷移)へ、一覧の文脈を保ったまま次々確認したいときはサイドピークを使う。

分類

機能・役割
  • ナビゲーション
  • 入力・操作
  • 表示・整理
  • フィードバック・状態
表示レイヤー
  • インライン
  • 固定・追従
  • オーバーレイ
  • 全画面・遷移
複雑さ
  • 単体パーツ
  • 複合パーツ
  • セクション