designmotionhq

interaction

Command Palette

⌘K is a system, not a search box.

Key insights

  • Use fuzzy matching, not exact substring search — typing "stg" should still surface "Settings", "Storage", and "Staging". Exact matching returns nothing and feels broken.
  • Group results into labeled sections (Recent, Actions, Pages) so a long flat list becomes scannable structure instead of an undifferentiated wall.
  • Make it fully keyboard-driven: arrows move the highlight, Enter runs the selected command, Esc closes — never force the user back to the mouse.
  • Never open to a blank void. Prefill recent or suggested commands so people have a starting point before they type a single character.
  • For async commands, show an inline spinner and keep the palette open — load results in place rather than freezing the whole screen.
  • Support nested commands: one command can drill into a sub-menu with a breadcrumb, and Esc walks back exactly one level.

Do / Don't

  • Do: Match queries as fuzzy subsequences so "stg" still finds "Settings"
  • Do: Prefill recent and suggested commands so the palette opens with something to act on
  • Do: Drive everything from the keyboard — arrows to move, Enter to run, Esc to go back
  • Don't: Require exact substring matches — "stg" ≠ "Settings" leaves users staring at "No results"
  • Don't: Open to a blank "No results" void with nothing to select
  • Don't: Freeze the whole screen while an async command loads instead of spinning inline

Get the next pattern first

New breakdowns land in your inbox before anywhere else.

One new pattern breakdown per week. No spam, unsubscribe anytime.

Related patterns