| UI or UX | UI + UX - Location-invoked contextual command menu | UI + UX - Contextual command list for a resource or selection | UI + UX - Button-controlled popup menu of actions or links | UI + UX - Small anchored contextual overlay |
| UI guidance | Render a context menu as a compact command menu anchored to the object, selection, pointer position, or focused item that invoked it, with clear item labels, disabled reasons, separators, and destructive separation. | Render a compact menu of verb-led actions scoped to one resource, row, card, selected set, or page object, with clear section headings, object-aware labels, disabled reasons, and separated dangerous commands. | Render a named button trigger, visible opened state, controlled popup, menu items, active item styling, disabled item state, separator or section grouping, and a safe way to distinguish destructive commands. | Render a popover as a compact surface visually tied to the trigger, field, selection, or object that opened it, with a clear title or labelled content when the body is more than a short sentence. |
| UX guidance | Use a context menu when users need fast object-specific commands from a secondary invocation path such as right click, long press, context-menu key, or Shift+F10. | Use an action menu when users need several contextual commands without keeping every command visible, and the list itself must explain scope, availability, risk, and outcome. | Use a menu button when users need to reveal a short contextual set of commands or links from a single trigger without leaving the current object or toolbar context. | Use a popover when users need local context, clarification, or a small edit without losing their place in the page. |
| Good UI | A file row opens a context menu at the selected row with Open, Rename, Duplicate, Download, Archive, and Delete separated at the end. | A Customer actions menu has Manage customer, Data requests, and Account risk sections, with Edit customer, Merge customer, Request data export, and Delete customer separated at the end. | A table row has a Report actions button that opens a compact menu with Open, Rename, Duplicate, Archive, and an unavailable Export item. | A Due date button in a task row opens a small popover beside the field with Today, Tomorrow, Friday, a custom date field, and a visible close control. |
| Bad UI | Right clicking a row opens a menu beside the toolbar and still shows actions for the previously selected row. | A More menu contains Open, Edit, View, Delete, Settings, Filter, Owner, and a search box with no sections or object names. | An unlabeled ellipsis opens a loose panel of buttons, inputs, links, toggles, and destructive commands with no active item. | A large floating panel appears in the middle of the screen with no arrow, no title, no trigger relationship, and hidden controls below the fold. |
| Good UX | Right click on Forecast.xlsx opens commands for that file, Arrow keys move through items, Escape closes the menu, and focus returns to the file row. | A user opens Customer actions, chooses Duplicate customer, and receives status that names the customer and keeps focus anchored to the action context. | A user opens Report actions, arrows to Duplicate report, activates it, and focus returns to the Report actions trigger with a status update. | Opening the due-date popover moves focus to the first date option, choosing Tomorrow updates the field, closes the layer, and returns focus to the Due date trigger. |
| Bad UX | Keyboard invocation opens at the top-left corner with no visible relationship to the focused object. | A user chooses Delete from a generic row menu and cannot tell whether it deletes the row, account, attached files, or selected customers. | A user tabs into a menu and lands in a text input because the menu contains unrelated form controls. | The user scrolls and the popover stays in the old position, so it appears to describe the wrong field. |
| Best fit | Objects or selections have secondary commands that experienced users expect near the target. | A resource, row, card, selected set, or local page object has several contextual commands. | A local object or toolbar has three to eight secondary commands. | A local control needs brief explanatory content or light editing while page context remains visible. |
| Avoid when | The command is primary, urgent, safety-critical, or required for task completion. | Only one or two commands are needed and visible buttons would be faster. | The job is choosing a form value, selecting several values, or browsing a long list. | The content is essential instruction that must remain visible for task completion. |
| Required state | Resting object or selection state before invocation. | Closed trigger or contextual entry point with resource scope. | Closed trigger state with visible or accessible name. | Closed trigger state with visible label, icon name, or field relationship. |
| Accessibility burden | Support keyboard invocation through the context-menu key or Shift+F10 where the platform expects it. | Give the trigger or menu an accessible name that includes the resource or selected-set scope. | Use an actual button for the trigger when possible. | Use a real button or equivalent control as the trigger whenever possible. |
| Common misuse | Making right click or long press the only way to discover important commands. | Treating the action menu as a junk drawer for every command that does not fit elsewhere. | Using a menu button for long value selection that should be a select, listbox, combobox, or multi-select. | Using a popover as a hidden modal, drawer, sheet, command menu, or full workflow. |