Nav menu prototype updates

From usability tests

  • Blocks displayed in the block inserter should be contextual to the area of the site where the user is inserting—so there would be a different set shown at first when adding to a header, vs a footer or a post. (Flow)
  • Up up up can be used to jump hierarchy. 
  • Consider adding an interstitial, wizardish step for those users who may need it—possibly the users who don’t have existing pages or menus to work from. (See accessibility review)
  • Consider how best to expose additional “edit” controls in the drop-down for those users who look for it there (renaming, for instance). (See accessibility review)
  • Label search results so it’s clear what they are.
  • Always show Search and Browse tabs when adding a page
  • Consider a search icon or some way of making search interface/labelling more clear. (Probably optimise for the primary use case, which is definitely search, and minimise link.)
  • Maybe “Search for a page, or paste a link”

From community feedback


  • Mock up advanced options (sidebar) for menu (Sidebar)
  • Mock up advanced options (sidebar) for menu item (Sidebar)

From accessibility review

  • Mock up keyboard tab flow (look to inner blocks & existing patterns) (Flow)
  • Menu creation interstitial + smart menu decision tree (Flow)

  • Better labelling for search (help text?) (Link Inserter)
  • Mock up browse tab (Link Inserter)
  • Contextual changes for search results (Link Inserter)
  • Write down guidelines for ordering search results (Link Inserter)
  • Mock up flow for linking to an external site (Link Inserter)
  • Show search result focus state (Link Inserter)
  • Show mock with Create page always visible (Link Inserter)
  • Use a line between results and create new, remove results header, try an (or) maybe? Link Inserter)

  • Move arrows left (Menu Item)
  • Variable width containers (Menu Item)
  • Add redundant move and edit controls into drop-down (Menu Item)
  • Add shadow behind menu item dropdown (Menu Item)
  • Change dropdown to triangle (Menu Item)

  • Remove cursor from menu itself



Proposal writeup


Post to Github Weds (and probably make/design too?)

Structure around existing flow, use lots of images. I suspect this will be a small book.

  • Adding a menu block
  • Adding a menu item