Post visibility and date picker button iteration

[hedgefield]

Expanding on #852 - I've seen some people discuss the usability of the new visibility and publish date buttons. The main problem is that we used to present the state (Public/Private/Draft etc) separately from the action to edit it, while in gutenberg both are the same thing (Public is a link that opens a popover). I do agree that it looks more elegant, and it saves some space, but from a usability perspective it might not be ideal - it doesn't immediately indicate that clicking the state also offer options to change it.

I've outlined some possible improvements below. TL;DR: I prefer option 2.

Option 1: place arrows next to the state, indicating that clicking on it will open additional options. This might muddy the meaning of that arrow, since it's also used on the collapsible section header above (though we could consider putting the pickers inline too, then it would make sense)

Option 2: Change the state into a button shape like Preview or Settings, making it clearer it contains an action. (note that the Move to trash button below it already has this look.)

Option 3: Reintroduce the edit link behind the state. In this case, I would go with change. To make it fit nicely though I had to expand the width of the sidebar to 320px.

[moorscode]

Related #470

[hedgefield]

Option 4: Make the Visibility and Publish labels the buttons instead of the state. This would make sense from the idea of 'I want to edit these properties', although it breaks with the convention that labels (left) are static and their state (right) is editable.

[karmatosed]

At this point, I am unsure how widespread of an issue this would be. I would like to see during testing and get some solid figures on this.

That all said, I am not sure either of the three options (unfortunately), makes this clearer. I am very cautious of adding noise to the UI at this point.

If you wanted to run some usability tests to delve deeper that would be ace. Even comparing on prototypes could be amazing. But, I understand if you aren't able to @hedgefield.

[karmatosed]

Closing as we are moving things that are feedback or need usability testing to that project. As things have iterated a lot we may decide this doesn't. It would be a good one to consider as we get more feedback from tests.

[afercia]

Note: the issue discussed here is basically the same discussed on #470 and it's not just about design. It's an accessibility issue.