We did some brainstorming at Dev Day today around improving the Help and Screen Options tabs in the admin. Keep in mind nothing here is a final decision, just some exploration of what we thought would be easy wins to make these tabs more useful.

Here are the problems with them right now:

  • Most users are blind to these tabs.
  • The labels and positioning give little indication as to what these tabs actually do.
  • For a lot of users, Help is not that helpful.
  • They’re position in the admin creates yet another point of navigation for users to be aware of (and per #1, most of them aren’t).
  • The very wide container for text makes a lot of the help text difficult to read.

Here are some of the possibilities we brainstormed (see notes below image):

Ideas:

  • Adding icons to these tabs would (hopefully) both make these tabs more visible and give a better indication as to what these tabs too.
  • Moving these to the right side of the toolbar would give even more context to what these do, as they would be grouped with other user-specific settings.
  • (6) The toolbar dropdown would allow for a slimmer content area for better readability.
  • (7) The slimmer content area would let us make screen options read like a list for better scannability.
  • (4/5) Putting the gear on the upper right would standardise with several other web apps (Twitter, etc).

We discussed possible changes to the labels:

  • Screen Options -> Screen Preferences
  • Help -> Screen Help
  • (3) Removing the Screen Options label altogether and only showing the icon (since the gear icon is so universally recognised). Possible expanding this to Help.

I did a hi-fi mockup of what the new Help dropdown might look like: