https://tracker.ceph.com/https://tracker.ceph.com/favicon.ico2018-11-20T17:25:44ZCeph Dashboard - Cleanup #37337: mgr/dashboard: Consistent labeling for buttons: 'Edit pool' (pool) vs. 'Update RBD' (images) vs. 'Update' (RGW) vs. 'Submit' (Cluster wide flags) ...https://tracker.ceph.com/issues/37337?journal_id=1248432018-11-20T17:25:44ZErnesto Puerta
<ul><li><strong>Subject</strong> changed from <i>Consistent labeling for buttons: 'Edit pool' (pool) vs. 'Update RBD' (images) vs. 'Update' (RGW) vs. 'Submit' (Cluster wide flags) ...</i> to <i>mgr/dashboard: Consistent labeling for buttons: 'Edit pool' (pool) vs. 'Update RBD' (images) vs. 'Update' (RGW) vs. 'Submit' (Cluster wide flags) ...</i></li></ul> Dashboard - Cleanup #37337: mgr/dashboard: Consistent labeling for buttons: 'Edit pool' (pool) vs. 'Update RBD' (images) vs. 'Update' (RGW) vs. 'Submit' (Cluster wide flags) ...https://tracker.ceph.com/issues/37337?journal_id=1249332018-11-21T14:37:14ZErnesto Puerta
<ul></ul>I briefly went through both EOS and Patternfly projects for guidelines:
<ul>
<li>in EOS I didn't find any direct suggestion.</li>
<li>in PF they're commonly using <a href="https://www.patternfly.org/pattern-library/forms-and-controls/buttons-on-forms/" class="external">'Save' and 'Cancel'</a> (instead of our 'Edit'/'Update'/'Submit' and 'Back').</li>
</ul> Dashboard - Cleanup #37337: mgr/dashboard: Consistent labeling for buttons: 'Edit pool' (pool) vs. 'Update RBD' (images) vs. 'Update' (RGW) vs. 'Submit' (Cluster wide flags) ...https://tracker.ceph.com/issues/37337?journal_id=1277242019-01-18T14:43:22ZLenz Grimmer
<ul></ul><p>Per our discussion, we'll use "Action + Object", e.g. "Delete RBD", "Create Pool".<br />Use "Cancel" for aborting an operation instead of "Back" or something else.</p>
<p>Follow <a class="external" href="https://www.patternfly.org/styles/terminology-and-wording/">https://www.patternfly.org/styles/terminology-and-wording/</a> for "Create" vs. "Add"</p>
<p>Examples: Create OSD, Create Pool, Create RBD Image <strong>but</strong> Add User, Add Group, Add Permission</p> Dashboard - Cleanup #37337: mgr/dashboard: Consistent labeling for buttons: 'Edit pool' (pool) vs. 'Update RBD' (images) vs. 'Update' (RGW) vs. 'Submit' (Cluster wide flags) ...https://tracker.ceph.com/issues/37337?journal_id=1291602019-02-12T10:05:12ZErnesto Puerta
<ul><li><strong>Status</strong> changed from <i>New</i> to <i>In Progress</i></li></ul> Dashboard - Cleanup #37337: mgr/dashboard: Consistent labeling for buttons: 'Edit pool' (pool) vs. 'Update RBD' (images) vs. 'Update' (RGW) vs. 'Submit' (Cluster wide flags) ...https://tracker.ceph.com/issues/37337?journal_id=1301342019-02-26T20:47:41ZErnesto Puerta
<ul><li><strong>File</strong> <a href="/attachments/download/3969/current.png">current.png</a> <a class="icon-only icon-magnifier" title="View" href="/attachments/3969/current.png">View</a> added</li><li><strong>File</strong> <a href="/attachments/download/3970/suggestion.png">suggestion.png</a> <a class="icon-only icon-magnifier" title="View" href="/attachments/3970/suggestion.png">View</a> added</li></ul><p>Most naming inconsistencies come from the high redundancy in text items, that needs to be kept manually. There are enough textual/UI hints for the user to become aware of their current actions and outcomes: URL, breadcrumbs, frame title, button label, task title.</p>
<p>My suggestion would be to:<br />- Keep/use CRUD-like naming for URLs: <resource>/{create,edit,delete,clone,copy}<br />- Keep breadcrumbs, as they help understand the user where they are within the website navigation.<br />- Keep Form Titles in Headline capitalization ("Action Resource", or even simpler: "Resource")<br />- Simplify buttons: only "Save/Cancel", without resource/item mentioning (no button labeled "Add Image", but just "Save").</p>
<p><img src="https://tracker.ceph.com/attachments/download/3969/current.png" title="as per proposed in original" alt="as per proposed in original" /> <img src="https://tracker.ceph.com/attachments/download/3970/suggestion.png" title="new suggestion" alt="new suggestion" /></p> Dashboard - Cleanup #37337: mgr/dashboard: Consistent labeling for buttons: 'Edit pool' (pool) vs. 'Update RBD' (images) vs. 'Update' (RGW) vs. 'Submit' (Cluster wide flags) ...https://tracker.ceph.com/issues/37337?journal_id=1302402019-02-28T10:03:12ZLenz Grimmer
<ul></ul><p>Hi Ernesto,</p>
<p>Ernesto Puerta wrote:</p>
<blockquote>
<p>Most naming inconsistencies come from the high redundancy in text items, that needs to be kept manually. There are enough textual/UI hints for the user to become aware of their current actions and outcomes: URL, breadcrumbs, frame title, button label, task title.</p>
<p>My suggestion would be to:<br />- Keep/use CRUD-like naming for URLs: <resource>/{create,edit,delete,clone,copy}<br />- Keep breadcrumbs, as they help understand the user where they are within the website navigation.<br />- Keep Form Titles in Headline capitalization ("Action Resource", or even simpler: "Resource")<br />- Simplify buttons: only "Save/Cancel", without resource/item mentioning (no button labeled "Add Image", but just "Save").</p>
<p><img src="https://tracker.ceph.com/attachments/download/3970/suggestion.png" title="new suggestion" alt="new suggestion" /></p>
</blockquote>
<p>I would be very much in favor of adapting this, thank you for this proposal! I'm all for simplicity, so the second suggestion would be my favorite. Thanks!</p> Dashboard - Cleanup #37337: mgr/dashboard: Consistent labeling for buttons: 'Edit pool' (pool) vs. 'Update RBD' (images) vs. 'Update' (RGW) vs. 'Submit' (Cluster wide flags) ...https://tracker.ceph.com/issues/37337?journal_id=1302412019-02-28T10:03:23ZLenz Grimmer
<ul><li><strong>Tags</strong> set to <i>usability</i></li></ul> Dashboard - Cleanup #37337: mgr/dashboard: Consistent labeling for buttons: 'Edit pool' (pool) vs. 'Update RBD' (images) vs. 'Update' (RGW) vs. 'Submit' (Cluster wide flags) ...https://tracker.ceph.com/issues/37337?journal_id=1302622019-02-28T12:47:24ZErnesto Puerta
<ul></ul><p>Thanks, Lenz. I'll update my PR to get it aligned with the former proposal. I've also asked Ju to have a look at this for her views on it.</p> Dashboard - Cleanup #37337: mgr/dashboard: Consistent labeling for buttons: 'Edit pool' (pool) vs. 'Update RBD' (images) vs. 'Update' (RGW) vs. 'Submit' (Cluster wide flags) ...https://tracker.ceph.com/issues/37337?journal_id=1305112019-03-01T18:21:51ZJu Lim
<ul></ul><p>First off thanks for bringing this up. I've to admit it was confusing to me as well when I first started looking at Ceph Dashboard, and I'm glad we've folks willing and able to take this one up!</p>
<ul>
<li>+1 Keep/use CRUD-like naming for URLs: <resource>/{create,edit,delete,clone,copy}</li>
</ul>
<ul>
<li>+1 Keep breadcrumbs, as they help understand the user where they are within the website navigation, and it should say “Action Resource”.</li>
</ul>
<ul>
<li>Have Form Titles in with appropriate capitalization/camelcase, i.e. “Action + Object” (e.g. Create Bucket) so it’s clear to user what he/she is doing -- especially if they walk away from their browser (a lot of context-switching happens in a regular day) and returns back to the Ceph Dashboard window/tab in the browser.</li>
</ul>
<ul>
<li>Buttons should be ““Action + Object” (e.g. Create Bucket) or “Cancel” (which replaces “Back” as it’s confusing when it’s really aborting/cancelling the action). The reason I suggest not using “Save” or “Submit” is they are not clear to the user what they are doing. From past experience and usability testing especially in wizards with many steps, “Next” and “Save” was not clear whether data is being persisted or not, whether it was saving a state or actually creating something, etc. It's probably less a concern since we don't yet have any wizards in Ceph Dashboard yet.</li>
</ul>
<ul>
<li>+1 on the “Create” vs. “Add” and the examples of Create OSD, Create Pool, Create RBD Image but Add User, Add Group, Add Permission per suggestions from <a class="external" href="https://www.patternfly.org/styles/terminology-and-wording/">https://www.patternfly.org/styles/terminology-and-wording/</a>.</li>
</ul> Dashboard - Cleanup #37337: mgr/dashboard: Consistent labeling for buttons: 'Edit pool' (pool) vs. 'Update RBD' (images) vs. 'Update' (RGW) vs. 'Submit' (Cluster wide flags) ...https://tracker.ceph.com/issues/37337?journal_id=1305142019-03-01T18:47:09ZErnesto Puerta
<ul></ul><p>Thanks a lot for the feedback, Ju!</p>
So, just to clarify:
<ul>
<li>On breadcrumbs, you suggest moving from, let's say:
<ol>
<li><strong>"Object GW >> Bucket >> Create"</strong> (current) to</li>
<li><strong>"Object GW >> Create Bucket"</strong> or</li>
<li><strong>"Object GW >> Bucket >> Create Bucket"</strong>?</li>
</ol></li>
</ul>
<p>If everyone else is happy with the suggestions I'll make the changes (not many) to bring the missing bits in.</p> Dashboard - Cleanup #37337: mgr/dashboard: Consistent labeling for buttons: 'Edit pool' (pool) vs. 'Update RBD' (images) vs. 'Update' (RGW) vs. 'Submit' (Cluster wide flags) ...https://tracker.ceph.com/issues/37337?journal_id=1311062019-03-08T02:51:38ZJu Lim
<ul></ul><p>Regarding breadcrumbs, both <a class="issue tracker-1 status-5 priority-4 priority-default closed" title="Bug: BUG at fs/ceph/caps.c:2178 (Closed)" href="https://tracker.ceph.com/issues/2">#2</a> or <a class="issue tracker-1 status-5 priority-4 priority-default closed" title="Bug: leaked dentry ref on umount (Closed)" href="https://tracker.ceph.com/issues/3">#3</a> work, though I'd suggest going with <a class="issue tracker-1 status-5 priority-4 priority-default closed" title="Bug: leaked dentry ref on umount (Closed)" href="https://tracker.ceph.com/issues/3">#3</a> ("Object GW >> Bucket >> Create Bucket").</p>
<blockquote>
<ul>
<li>On breadcrumbs, you suggest moving from, let's say:
<ol>
<li><strong>"Object GW >> Bucket >> Create"</strong> (current) to</li>
<li><strong>"Object GW >> Create Bucket"</strong> or</li>
<li><strong>"Object GW >> Bucket >> Create Bucket"</strong>?</li>
</ol></li>
</ul>
</blockquote> Dashboard - Cleanup #37337: mgr/dashboard: Consistent labeling for buttons: 'Edit pool' (pool) vs. 'Update RBD' (images) vs. 'Update' (RGW) vs. 'Submit' (Cluster wide flags) ...https://tracker.ceph.com/issues/37337?journal_id=1314602019-03-11T12:03:04ZLenz Grimmer
<ul></ul><p>Ju Lim wrote:</p>
<blockquote>
<p>Regarding breadcrumbs, both <a class="issue tracker-1 status-5 priority-4 priority-default closed" title="Bug: BUG at fs/ceph/caps.c:2178 (Closed)" href="https://tracker.ceph.com/issues/2">#2</a> or <a class="issue tracker-1 status-5 priority-4 priority-default closed" title="Bug: leaked dentry ref on umount (Closed)" href="https://tracker.ceph.com/issues/3">#3</a> work, though I'd suggest going with <a class="issue tracker-1 status-5 priority-4 priority-default closed" title="Bug: leaked dentry ref on umount (Closed)" href="https://tracker.ceph.com/issues/3">#3</a> ("Object GW >> Bucket >> Create Bucket").</p>
<blockquote>
<ul>
<li>On breadcrumbs, you suggest moving from, let's say:
<ol>
<li><strong>"Object GW >> Bucket >> Create"</strong> (current) to</li>
<li><strong>"Object GW >> Create Bucket"</strong> or</li>
<li><strong>"Object GW >> Bucket >> Create Bucket"</strong>?</li>
</ol></li>
</ul>
</blockquote></blockquote>
<p>Thanks for the suggestions! Option#3 sounds good to me as well.</p> Dashboard - Cleanup #37337: mgr/dashboard: Consistent labeling for buttons: 'Edit pool' (pool) vs. 'Update RBD' (images) vs. 'Update' (RGW) vs. 'Submit' (Cluster wide flags) ...https://tracker.ceph.com/issues/37337?journal_id=1327782019-03-26T13:53:38ZErnesto Puerta
<ul><li><strong>Status</strong> changed from <i>In Progress</i> to <i>Fix Under Review</i></li></ul> Dashboard - Cleanup #37337: mgr/dashboard: Consistent labeling for buttons: 'Edit pool' (pool) vs. 'Update RBD' (images) vs. 'Update' (RGW) vs. 'Submit' (Cluster wide flags) ...https://tracker.ceph.com/issues/37337?journal_id=1327942019-03-26T16:43:22ZLenz Grimmer
<ul><li><strong>Target version</strong> changed from <i>v14.0.0</i> to <i>v15.0.0</i></li><li><strong>Backport</strong> set to <i>nautilus</i></li><li><strong>Pull request ID</strong> set to <i>26572</i></li></ul> Dashboard - Cleanup #37337: mgr/dashboard: Consistent labeling for buttons: 'Edit pool' (pool) vs. 'Update RBD' (images) vs. 'Update' (RGW) vs. 'Submit' (Cluster wide flags) ...https://tracker.ceph.com/issues/37337?journal_id=1329972019-03-28T12:15:51ZErnesto Puerta
<ul><li><strong>Status</strong> changed from <i>Fix Under Review</i> to <i>Pending Backport</i></li></ul> Dashboard - Cleanup #37337: mgr/dashboard: Consistent labeling for buttons: 'Edit pool' (pool) vs. 'Update RBD' (images) vs. 'Update' (RGW) vs. 'Submit' (Cluster wide flags) ...https://tracker.ceph.com/issues/37337?journal_id=1330152019-03-28T12:42:52ZNathan Cutlerncutler@suse.cz
<ul><li><strong>Copied to</strong> <i><a class="issue tracker-9 status-3 priority-4 priority-default closed" href="/issues/39003">Backport #39003</a>: nautilus: mgr/dashboard: Consistent labeling for buttons: 'Edit pool' (pool) vs. 'Update RBD' (images) vs. 'Update' (RGW) vs. 'Submit' (Cluster wide flags) ...</i> added</li></ul> Dashboard - Cleanup #37337: mgr/dashboard: Consistent labeling for buttons: 'Edit pool' (pool) vs. 'Update RBD' (images) vs. 'Update' (RGW) vs. 'Submit' (Cluster wide flags) ...https://tracker.ceph.com/issues/37337?journal_id=1343832019-04-12T07:31:04ZRicardo Marquesrimarques@suse.com
<ul><li><strong>Status</strong> changed from <i>Pending Backport</i> to <i>Resolved</i></li></ul> Dashboard - Cleanup #37337: mgr/dashboard: Consistent labeling for buttons: 'Edit pool' (pool) vs. 'Update RBD' (images) vs. 'Update' (RGW) vs. 'Submit' (Cluster wide flags) ...https://tracker.ceph.com/issues/37337?journal_id=1432482019-08-16T12:59:41ZLenz Grimmer
<ul><li><strong>Related to</strong> <i><a class="issue tracker-1 status-1 priority-4 priority-default" href="/issues/41244">Bug #41244</a>: mgr/dashboard: Confusing naming of buttons in edit dialogs</i> added</li></ul> Dashboard - Cleanup #37337: mgr/dashboard: Consistent labeling for buttons: 'Edit pool' (pool) vs. 'Update RBD' (images) vs. 'Update' (RGW) vs. 'Submit' (Cluster wide flags) ...https://tracker.ceph.com/issues/37337?journal_id=1914742021-04-15T17:25:48ZErnesto Puerta
<ul><li><strong>Project</strong> changed from <i>mgr</i> to <i>Dashboard</i></li><li><strong>Category</strong> changed from <i>132</i> to <i>General</i></li></ul>