ケバブメニュー

Kebab menu

縦に並んだ3つの点のアイコンをクリックすると、対象に対する操作の一覧が展開するメニューUI。

同じ役割の俗称いろいろ

  • ケバブ(縦3点)
  • ミートボール(横3点)
  • ベントー(3×3グリッド)
  • ドネル(長さ違い三本線)
  • ハンバーガーメニュー(三本線・主にサイト全体ナビ)

○ 使う場面

  • 一覧の行やカードなど、繰り返し要素ごとに個別の操作(編集・複製・削除等)をまとめたいとき
  • 常時表示のツールバーに置くには使用頻度が低い操作を隠しておきたいとき

× 避ける場面

  • 操作が1つしかないとき(→単体のボタンで十分)
  • 操作の発見性を最優先したいとき(アイコン1つに隠れるため見落とされやすい)

別名

縦三点メニュー、3点リーダーメニュー、ミートボールメニュー、ベントーメニュー、ドネルメニュー

近縁種との比較

縦3点リーダーのアイコンは英語圏で「ケバブ(Kebab)」と呼ばれるが、串に刺さった団子に見立てた俗称は他にもいくつか流通しており、横向きの3点は肉団子に見立てた「ミートボールメニュー」、3×3グリッドのアイコンはお弁当箱に見立てた「ベントーメニュー」、長さの異なる三本線(フィルターアイコン)を指す「ドネルメニュー」と、いずれも食べ物に見立てた俗称である点が共通する(本図鑑のデモが並べる「同じ役割の俗称いろいろ」の一覧も参照)。

近縁種違い・使い分け
ハンバーガーメニューハンバーガーメニューとは同じ「アイコン一つで隠れた選択肢を開く」構造だが、開くのがサイト全体のナビゲーションか、個々の項目に対する操作かで区別される。
ドロップダウンメニュードロップダウンメニューとは「クリックで選択肢を展開する」基本構造を共有するが、常時表示のボタンが起点になるドロップダウンメニューと異なり、ケバブメニューは行・カードなど繰り返し要素に対する個別操作という文脈で使われる。
コンテキストメニューコンテキストメニューとも同じ基本構造を共有するが、右クリックがトリガーになるコンテキストメニューと異なり、ケバブメニューは縦3点という可視のトリガーを常に持つ。

分類

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