Usability improvements to CMSMS admin panel
Posted: Sat Apr 16, 2011 1:14 am
I have a few suggested usability changes to the admin panel:
1. Change all text editor checkboxes from 'Turn on/off WYSIWYG editor' to 'Use WYSIWYG editor' (with checked meaning 'on'). The current label is ambiguous and doesn't tell users what the current state is (on or off).
2. Similarly, some other checkbox wording is redundant. For example, 'Check this box to disable the module help link in page headers'. The words 'Check this box to' can be removed as they are implied by the state of the checkbox (checked = enabled, unchecked = disabled).
3. Also the state of the checkbox should always be positive-positive, meaning a checkbox being checked (a positive) should not indicate negative actions (such as 'disabled'). In the checkbox mentioned in point 2, the 'checked' state should be 'Enable the module help link in page headers'.
4. Change all 'red cross' icons (whose meaning may be 'inactive', 'disabled', 'not default' etc) to greyed-out 'ticks' to avoid confusion with 'delete'.
5. Make better use of tabs. For example, when adding/editing a page, the 'Options' tab has quite a lot of information. This could be separated into 'Options', 'Accessibility' and 'Attributes' (or something along those lines). The benefits of this change are a) less scrolling; and b) ability to set permissions for the display of each tab for different users.
6. Improve explanations of settings. For example under Global Settings, the explanation for 'Automatically created URL's are flat' is 'If enabled, all urls will be created as a copy of the page alias (but not synchronized to the page alias)'. This could be better worded as 'This will set all URLs to the same value as the Page Alias. Note: The two values will not be synchronised after first being set'. A minor change, but probably helpful to some less experienced users. There are countless examples of this across the site.
7. Building on the above, I would move all explanations to a 'help tooltip'. For example, a small icon at the end of the input which displays the tip when hovering over the item. This would make better use of screen real-estate.
8. When choosing multiple items from a list, such as 'Additional Editors' for pages, use checkboxes rather than CTRL+click functionality.
9. Provide the ability to auto-generate passwords for new users, as well as the option to email the login details to the user. The option to email the account info should also be present for existing accounts (including the currently logged-in user).
10. Provide the ability to add particular admin items as shortcuts. For example, editing a particular page or creating a new gallery. This way the user can navigate directly to their favourite admin pages more easily. Adding a new shortcut could be as simple as going to the page then clicking 'Save this page to my shortcuts'.
11. Move (or copy) all buttons to the top of the page. In many pages on the site, such as attaching stylesheets to a template or viewing the user list, the buttons appear at the bottom of the page. This may cause unnecessary scrolling to perform actions on the page.
12. Standardise icons for admin pages. For example, Theme Manager has a clipboard icon, but Stylesheets doesn't. I personally would remove them all, or another option would be to add to all but make the icons much smaller - they currently waste space and make the positioning of content inconsistent.
13. Left-align the content wrapper on all pages for consistency. Tables are 100% width and fluid, but most other content will depend on screen width.
1. Change all text editor checkboxes from 'Turn on/off WYSIWYG editor' to 'Use WYSIWYG editor' (with checked meaning 'on'). The current label is ambiguous and doesn't tell users what the current state is (on or off).
2. Similarly, some other checkbox wording is redundant. For example, 'Check this box to disable the module help link in page headers'. The words 'Check this box to' can be removed as they are implied by the state of the checkbox (checked = enabled, unchecked = disabled).
3. Also the state of the checkbox should always be positive-positive, meaning a checkbox being checked (a positive) should not indicate negative actions (such as 'disabled'). In the checkbox mentioned in point 2, the 'checked' state should be 'Enable the module help link in page headers'.
4. Change all 'red cross' icons (whose meaning may be 'inactive', 'disabled', 'not default' etc) to greyed-out 'ticks' to avoid confusion with 'delete'.
5. Make better use of tabs. For example, when adding/editing a page, the 'Options' tab has quite a lot of information. This could be separated into 'Options', 'Accessibility' and 'Attributes' (or something along those lines). The benefits of this change are a) less scrolling; and b) ability to set permissions for the display of each tab for different users.
6. Improve explanations of settings. For example under Global Settings, the explanation for 'Automatically created URL's are flat' is 'If enabled, all urls will be created as a copy of the page alias (but not synchronized to the page alias)'. This could be better worded as 'This will set all URLs to the same value as the Page Alias. Note: The two values will not be synchronised after first being set'. A minor change, but probably helpful to some less experienced users. There are countless examples of this across the site.
7. Building on the above, I would move all explanations to a 'help tooltip'. For example, a small icon at the end of the input which displays the tip when hovering over the item. This would make better use of screen real-estate.
8. When choosing multiple items from a list, such as 'Additional Editors' for pages, use checkboxes rather than CTRL+click functionality.
9. Provide the ability to auto-generate passwords for new users, as well as the option to email the login details to the user. The option to email the account info should also be present for existing accounts (including the currently logged-in user).
10. Provide the ability to add particular admin items as shortcuts. For example, editing a particular page or creating a new gallery. This way the user can navigate directly to their favourite admin pages more easily. Adding a new shortcut could be as simple as going to the page then clicking 'Save this page to my shortcuts'.
11. Move (or copy) all buttons to the top of the page. In many pages on the site, such as attaching stylesheets to a template or viewing the user list, the buttons appear at the bottom of the page. This may cause unnecessary scrolling to perform actions on the page.
12. Standardise icons for admin pages. For example, Theme Manager has a clipboard icon, but Stylesheets doesn't. I personally would remove them all, or another option would be to add to all but make the icons much smaller - they currently waste space and make the positioning of content inconsistent.
13. Left-align the content wrapper on all pages for consistency. Tables are 100% width and fluid, but most other content will depend on screen width.