Page 1 of 1

Firstlook OneEleven theme usability suggestions

Posted: Wed Jun 20, 2012 8:32 pm
by deactivated010521
My first look Rev: 8068

I love the new OneEleven Theme good work. As always when changing interfaces it takes a moment to get used to the new layout and options. I think in a few days I am used to OneEleven and it will become my favorit theme.

As new OneEleven user I also take the moment to point out some quirks.

* Broken images arrow images:

The following images are broken:

/admin/themes/OneEleven/images/icons/system/arrow-d.gif
/admin/themes/OneEleven/images/icons/system/arrow-u.gif
/admin/themes/OneEleven/images/icons/system/sort_down.gif

* Order of the tiny orange buttons in the top right corner:

Suggestion to switch order of "Logout" and "View Site" icons:

Reason:
a) "View Site" will be used more than "View Site"
b) The order of the grey navigation on the left side is also "View Site" and "Logout" as last.

* Orange icons (Profile icon and Home icon) in the top left corner:

Suggestion to make the Profile icon (link to Profile page) and Home icon (Link to CMSMS homepage) clickable.

Reason:
a) Consistency with other icons
b) Handy shortcut

* Username (current logged in user)

Suggestion to make the username clickable and link to "My Account" page.

a) Handy shortcut

* Icons on grey (left-bar) navigation:

When you roll over an icon in the left-bar navigation the section title (CMS, Content, Layout ... ) and the arrow gives a highlight as if the navigation will collapse. But the icon itself does point to the main page of the section.

a) Wrong visual clue

* Copyright notice bottom bar

I think the height of the bottom bar is a bit out of balance with icons bar on the top.

I suggest to make the "Copyright © CMS Made Simple™ 1.11-beta1 ...." text a bit smaller or wider (on my screen it takes two lines to present it).

a) There is enhough horizontal space.

For branding purposes there is something to say for a 'fat' bar always visibible on the bottom, although from a usability point it does not have any function. Personally I love the way the CMSMS version is presented (just on the bottom of the page) in 'NCleanGrey' more.

..) Just an opinion

* Logo in top left bar

Maybe make the logo in the top left bar link to cmsmadesimple.org site

a) Common convention

* Submit and cancel button on top and bottom of the page:

On a lot of pages for example My Account -> User Preferences-tab the form has a submit and cancel button on the top and bottom of the form. On some pages for Example My Account -> User Account the submit and cancel buttons are only displayed on the bottom.

Is there a general rule? When the form exeeds x fields or a certain height?

a) Be consistent

On a lot of pages after an add, delete modify no feedback/warning is given.

a) Be consistent

Re: Firstlook OneEleven theme usability suggestions

Posted: Wed Jun 20, 2012 10:15 pm
by calguy1000
Thank you for your suggestions.

The broken images will be fixed... However the other issues are cosmetic or 'nice to have' issues and we will seriously have to think whether they are worth implementing at risk to screwing stuff up.

So we'll take all of these recommendations under advisement... but no promises. We will keep track of them though.

Re: Firstlook OneEleven theme usability suggestions

Posted: Wed Jun 20, 2012 11:24 pm
by MichaelK1985
I totally agree with this

Order of the tiny orange buttons in the top right corner

View Site need to switch with Log Out. It's make more sense when the last icon is indeed the Log Out button.

Re: Firstlook OneEleven theme usability suggestions

Posted: Thu Jun 21, 2012 4:21 am
by micahgodbolt
Most annoying thing for me is that the home icon in the breadcrumbs doesn't go back to the "home" screen, and neither does the cmsms logo. Would love for either of those to link back to the home screen.

Re: Firstlook OneEleven theme usability suggestions

Posted: Thu Jun 21, 2012 8:18 am
by airelibre
I totally agree with the various suggestions.

I would just add one : for every label / input couple, place the "label" on the left side, and the "input" on the right side. As our screens are generally quite large, we could save a lot of scrolling with such a modification.

But this may be done on a future version (or fork admin theme)

Re: Firstlook OneEleven theme usability suggestions

Posted: Thu Jun 21, 2012 10:03 am
by uniqu3
arnoud wrote:* Broken images arrow images:

The following images are broken:

/admin/themes/OneEleven/images/icons/system/arrow-d.gif
/admin/themes/OneEleven/images/icons/system/arrow-u.gif
/admin/themes/OneEleven/images/icons/system/sort_down.gif
Can you be more specific? Broken as missing? In my beta setup i can see all mentioned icons (Chrome, FF, IE8), these are also located in correct folder.
arnoud wrote:* Order of the tiny orange buttons in the top right corner:

Suggestion to switch order of "Logout" and "View Site" icons:

Reason:
a) "View Site" will be used more than "View Site"
b) The order of the grey navigation on the left side is also "View Site" and "Logout" as last.
Order of "View Site" and "Logout" shortcut icons was swaped.
arnoud wrote:* Orange icons (Profile icon and Home icon) in the top left corner:

Suggestion to make the Profile icon (link to Profile page) and Home icon (Link to CMSMS homepage) clickable.

Reason:
a) Consistency with other icons
b) Handy shortcut
* Username (current logged in user)

Suggestion to make the username clickable and link to "My Account" page.

a) Handy shortcut

Linked now
arnoud wrote:* Icons on grey (left-bar) navigation:

When you roll over an icon in the left-bar navigation the section title (CMS, Content, Layout ... ) and the arrow gives a highlight as if the navigation will collapse. But the icon itself does point to the main page of the section.

a) Wrong visual clue
This was a hot topic before, intially only arrows had toggle functions which worked well for me but user differ in their behavior, so it was requested more then once to actually have toggle on everything but menu icon.

Menu icon is linked to main page as when you collapse the sidebar you can still access main pages without opening sidebar again.

Sorry there is no "one size fits all" solution so skipping this one.
arnoud wrote:* Copyright notice bottom bar

I think the height of the bottom bar is a bit out of balance with icons bar on the top.

I suggest to make the "Copyright © CMS Made Simple™ 1.11-beta1 ...." text a bit smaller or wider (on my screen it takes two lines to present it).

a) There is enhough horizontal space.

For branding purposes there is something to say for a 'fat' bar always visibible on the bottom, although from a usability point it does not have any function. Personally I love the way the CMSMS version is presented (just on the bottom of the page) in 'NCleanGrey' more.

..) Just an opinion


Footer height was reduced, the issue with copyright on two lines might be a OS issue?
MacOS and Linux usually render fonts bolder which would explain why, i tested this on multiple browser sizes on Windows and it worked well, after specific screensize font was actually smaller.
Anyway copyright font size is smaller now and area wider that should fix it now.
arnoud wrote:* Logo in top left bar

Maybe make the logo in the top left bar link to cmsmadesimple.org site

a) Common convention
Linked.
arnoud wrote:* Submit and cancel button on top and bottom of the page:

On a lot of pages for example My Account -> User Preferences-tab the form has a submit and cancel button on the top and bottom of the form. On some pages for Example My Account -> User Account the submit and cancel buttons are only displayed on the bottom.

Is there a general rule? When the form exeeds x fields or a certain height?

a) Be consistent

On a lot of pages after an add, delete modify no feedback/warning is given.

a) Be consistent
Not related to OneEleven, it is how system templates and functions were created, would mean reworking all system templates for actions where buttons are missing.


Please keep in mind that in a BETA process there is no room for Feature Requests, which well above mentioned in major were.
I did follow few suggestions as these were quick changes but i do not intend to follow every FR posted here, unless it is a Bug it will be ignored from now on.

Re: Firstlook OneEleven theme usability suggestions

Posted: Thu Jun 21, 2012 10:34 am
by deactivated010521
Goran,

Thank you for the quick fixes.

About the broken images:

The images are broken not missing.

Probally you made them transparant some white parts are removed from the arrows. Just type the root_url in front of the images I am mentioning, and you will probally see what I mean.

$root_url/admin/themes/OneEleven/images/icons/system/arrow-d.gif
$root_url/admin/themes/OneEleven/images/icons/system/arrow-u.gif
$root_url/admin/themes/OneEleven/images/icons/system/sort_down.gif

Confirmed fixes:

Rev: 8074

v Order of "View Site" and "Logout" shortcut icons was swaped.
v Username (current logged in user) linked now
v Copyright notice bottom bar (indeed an os issue looks good now on linux FireFox).
v Logo in top left bar linked

Other suggestions marked as out of scope.

Thank you

Re: Firstlook OneEleven theme usability suggestions

Posted: Thu Jun 21, 2012 11:05 am
by uniqu3
Hmm either i am blind or :) but i dont see difference except for quality loss due to gif.
See attached images.

Re: Firstlook OneEleven theme usability suggestions

Posted: Thu Jun 21, 2012 12:03 pm
by deactivated010521
Looks dithered if it's by intention leave it as it is.

Re: Firstlook OneEleven theme usability suggestions

Posted: Thu Jun 21, 2012 7:29 pm
by Rolf
Arnoud, this post is resolved? If so, I will move it to Closed Items...

Re: Firstlook OneEleven theme usability suggestions

Posted: Thu Jun 21, 2012 8:26 pm
by deactivated010521
Don't know about the images they look strange to me. All the other suggestions are solved or out of scope.