plone / Products.CMFPlone

The core of the Plone content management system
https://plone.org
GNU General Public License v2.0
255 stars 191 forks source link

Toggle for expanded/collapsed toolbar is not obvious #807

Closed enzus closed 5 years ago

enzus commented 9 years ago

I found out by chance that clicking on the Plone logo in the toolbar toggles between an expanded version (icon + label) and a collapsed view (icon + label on hover). I'm not sure we have icons clear enough to suffice alone, hence I'm not sure about the value of the collapsed version but we should at least try to make the toggle more obvious... unless we want to keep it as a sort of easter egg?

davilima6 commented 9 years ago

I don't think we need an easter egg here (although Plone probably lacks some) but I do believe there's value in having both collapsed and expanded versions. So +1 for adding a discreet arrow that animates changing direction when clicked in order to hint on the sliding behavior.

Maybe we could move the current arrow-down below toolbar logo to the right (over content). Sorry if I miss something but I don't see much meaning as it is.

enzus commented 9 years ago

OK for keeping the two versions but I struggle to see an elegant way to communicate it. I like the idea of keeping clear the area around Plone logo in the toolbar. Could you please sketch something up to help us visualise it?

davilima6 commented 9 years ago

Something like this:

toolbar-contracted

toolbar-expanded

Without the buggy padding (which should be better fixed when submenu arrows are dropped in favor of hover behavior).

enzus commented 9 years ago

Mmhhh I'm not convinced as the arrows this way seem more related to the body on the right than the toolbar underneath. I know it would probably be ugly but for the sake of clarity we should probably just add a text underneath the Plone logo which alternatively says "expand/collapse toolbar" or "show/hide toolbar labels" and keep the little arrow down.

davilima6 commented 9 years ago

-1 on texts below logo but we could go for a tooltip on the toggler. Even there, "Expand/collapse" or "Expand/collapse toolbar" should be enough since it's less expensive for a user to test and get acquainted with the behavior than it is to be forever exposed to a not so critical contextual helper.

Apart from that I really don't see why there is an arrow below logo right now.

enzus commented 9 years ago

OK a tooltip sounds like a good compromise! Although we would miss it on touch devices?

I guess the reason of the little arrow is to create some correlation with the elements of the toolbar. Imagine the toolbar in a themed website context: that arrow seems to say "hey this is a Plone websites and these are the tools".

davilima6 commented 9 years ago

I see but I don't think it's necessary because sidebars are an already established design pattern and our toolbar is fixed and stands out by itself in relation to the rest of the website. Besides only logged-in users see it so they don't need extra help to figure out those are the CMS tools.

enzus commented 9 years ago

Didn't say it's right to have it, I just guessed why is there :)

davilima6 commented 9 years ago

Np, just making my point. Thanks for bringing this issue up!

jkubaile commented 9 years ago

How about moving the expand icon inside the bar like it is done for the other menus like adding?

davilima6 commented 9 years ago

Not bad, but still not sure which I prefer (specially if the other menu arrows are dropped).

toolbar-contracted-arrow-inside

enzus commented 9 years ago

Guys the more I look at it the more I think we should get rid of the arrows altogether. I know it's a legacy pattern and I usually prefer being explicit to being implicit but in this case I'm sure it's clear enough and with the mouse over discover what's behind each menu will be a matter of ms.

pigeonflight commented 9 years ago

I think a sidebar strip is more in line with common visual vocabulary. Then it would be okay to leave the logo as an easter egg for those who know.

expandable-sidebar

hvelarde commented 9 years ago

The option of using the toolbar expanded or collapsed should be on the personal preferences form and not where it's now:

selection_005

vangheem commented 9 years ago

Agreed. Trying to nestle something in the UI seems wrong...

davilima6 commented 9 years ago

For consistency I think we should have both site-wide and personal settings, just like for the other 3 items.

djay commented 9 years ago

I'm really confused by what the suggested options are from reading the comments. Can someone who understands edit the original issue and list them?

We aren't suggesting removing ability to expand and contract to just via the personal preferences, are we? It's really useful to switch quickly between both.

davilima6 commented 9 years ago

This issue is about adding an always available visual toggle to give the user a visual handler to the expand/contract toolbar behavior.

I suggest @hvelarde opens a new issue regarding the location of the persistent setting: @@personal-preferences, @@site-controlpanel or both (my vote).

hvelarde commented 9 years ago

I opened another issue that I think is more relevant: Do we really need 4 versions of the toolbar? #1001

enzus commented 9 years ago

Sorry guys, just seen this as I'm still missing any sort of notification from github so have to go around exploring tickets!

I think the solution by @pigeonflight is very elegant, correct and effective pointing the arrow from the logo down the toolbar and reducing all the other arrows to one in a sidebar strip.

I'm not sure I understood what you want to be a personal preference? Would the user activate the possibility to have this easter egg working or would decide once and for all for the collapsed or the expanded mode?

davilima6 commented 9 years ago

This is not (and shouldn't be) an easter egg, that was a joke regarding the lack of visual pointers for the expand/contract behavior.

The personal preferences we're talking about is the @@personal-preferences view on which you can override site-wide/all-users defaults like wysiwyg editor, language and timezone. Now it has been suggested (and I agree) to add toolbar's position, which currently lives only in @@site-controlpanel.

hvelarde commented 9 years ago

I think we are missing some serious analysis on how users use the toolbar: do they really change from expand to collapse to expand so often that the options needs to be in place all the time? or is just find to leave it in the personal toolbar?

I agree with @davilima6 that the vertical/horizontal option should be in the personal preferences also.

enzus commented 9 years ago

OK, I now get it and, yes, I agree as well that the vertical/horizontal option should be in the personal preferences, basically to state which default way (expanded or collapsed) the user would prefer to see the toolbar.

I honestly don't think this mechanism is essential but it could come handy in certain circumstances. The analysis can be done but Plone covers so many different situations that I'm not sure we can identify patterns of usage here.

jensens commented 5 years ago

nice to have which stood in here for too long, I think the solution as we have it in 5.2 now works fine.