The "show/hide hidden jobs" toggle needs to more clearly convey it's purpose & toggle state

RESOLVED FIXED

Status

Tree Management
Treeherder
P3
normal
RESOLVED FIXED
3 years ago
8 months ago

People

(Reporter: bz, Assigned: KWierso)

Tracking

Details

Attachments

(3 attachments)

STEPS TO REPRODUCE: Load https://treeherder.mozilla.org/#/jobs?repo=mozilla-central&exclusion_state=all

EXPECTED RESULTS: The checkbox in the second row of the header, to the right of "NNN unclassified" is checked.

ACTUAL RESULTS: The checkbox is not checked.

The hidden jobs _are_ being shown, so this is a pure UI issue.
philor tells me it's not a checkbox.  I can confirm that it draws as a white hollow square in the non-all state and a gray solid square in the "all" state.  But it looks like a checkbox in both cases, and an unchecked one.  Why can this not just use an actual checkbox?

Comment 2

3 years ago
Perhaps the more important question is, why not just use some text instead of a glyph which doesn't mean much on its own? :-)

Updated

3 years ago
OS: Mac OS X → All
Priority: -- → P2
Hardware: x86 → All
Summary: Hidden job checkbox doesn't visibly reflect the current state → It's too hard to tell whether the "show/hide hidden jobs" toggle is enabled or not

Comment 3

3 years ago
(In reply to :Ehsan Akhgari (not reading bugmail, needinfo? me!) from comment #2)
> Perhaps the more important question is, why not just use some text instead
> of a glyph which doesn't mean much on its own? :-)

Yeah agree the UX could be improved here. Treeherder uses icons in many more places than TBPL did, and I think the new-user learning curve is steeper as a result. That said, I think we need _something_ to try and reduce the UI clutter TBPL had (even with the IMO hard to discover rollover hidden features), particularly given there are more features in Treeherder already, and even more so in the future. Perhaps multiple/customisable views for different types of users (sheriffs vs devs looking at try vs ...) might be the way forwards...

Updated

3 years ago
Blocks: 1125264

Updated

3 years ago
Priority: P2 → P3

Updated

3 years ago
Summary: It's too hard to tell whether the "show/hide hidden jobs" toggle is enabled or not → The "show/hide hidden jobs" toggle needs to more clearly convey it's purpose & toggle state

Updated

3 years ago
Blocks: 1059275
(In reply to :Ehsan Akhgari (not reading bugmail, needinfo? me!) from comment #2)
> Perhaps the more important question is, why not just use some text instead
> of a glyph which doesn't mean much on its own? :-)

What if it looked like a literal job character, with some sort of partly transparent state to imply excluded, then 100% opaque when not.

We do have a tooltip for nearly every key piece of UI including that one, so it is discoverable.

Re text, I think we are just trying to avoid cluttering the UI with yet more content, but which after a users' first discovery becomes just more clutter, because they know intimately where it is and what it does.

Comment 5

a year ago
Created attachment 8762917 [details] [review]
[treeherder] KWierso:1120477 > mozilla:master
(Assignee)

Updated

a year ago
Assignee: nobody → wkocher
(Assignee)

Comment 6

a year ago
Comment on attachment 8762917 [details] [review]
[treeherder] KWierso:1120477 > mozilla:master

How about these? We can use the eye-slash glyph when we aren't showing hidden jobs, and then just the eye glyph when hidden jobs are shown.
Attachment #8762917 - Flags: review?(cdawson)
(Assignee)

Comment 7

a year ago
Created attachment 8762918 [details]
hiddenishidden.png
(Assignee)

Comment 8

a year ago
Created attachment 8762919 [details]
hiddenisvisible.png
(Assignee)

Updated

a year ago
Attachment #8762917 - Flags: feedback?(emorley)
(In reply to Wes Kocher (:KWierso) from comment #6)
> Comment on attachment 8762917 [details] [review]
> [treeherder] KWierso:1120477 > mozilla:master
> 
> How about these? We can use the eye-slash glyph when we aren't showing
> hidden jobs, and then just the eye glyph when hidden jobs are shown.

I've no issues either way :) I think we had the eye glyph in early development and iirc there was user confusion with it, which resulted in using fa-square and fa-square-o to mimic a job button shape.

Updated

a year ago
Attachment #8762917 - Flags: feedback?(emorley) → feedback+
We were talking in IRC that this needs to be a tri-state kind of item.  The issue is actually slightly more complex if we wanted to support everything.

We have two url params in effect here:

* exclusion_profile=default/Tier-2/myTestProfile
* visibility=excluded/included

So here's a proposal:

1. Make the button a drop-down with text "Visibility" when the window is wide.  In narrow widows perhaps switch to the eye icon?
2. Make the menu like this:

================
  excluded
----------------
  none
x default
  Tier-2
  Tier-3
  MyTestProfile
  FlimFlamProfile
=================
where the x's represent the checked item.  For "excluded" it would be checked or not.  For the profile, at least one of them would always be checked.  "none" would indicate show all jobs

"Yay!  Way to complicate things, Cam!", you might say...
"Well, it's just an idea.  We can go a different route, if you like", I would respond...  ;)
(Assignee)

Comment 11

a year ago
(Tri-state bit came from bug 1117561, for the record.)
Wes: would you want to just address this one by changing it to text in the wide-case, and an icon in the narrow case.  Perhaps the eye is fine as that.

Seems like there could be some clever word that's used that means "only showing non-excluded" and could be a strike-out when you're showing all?  I sure can't think of what that word would be though.  Maybe "Excluding" ?  Sigh.. naming is hard...
Comment on attachment 8762917 [details] [review]
[treeherder] KWierso:1120477 > mozilla:master

Clearing this for now till we decide on what the impl should be.
Attachment #8762917 - Flags: review?(cdawson)
(Assignee)

Comment 14

a year ago
Comment on attachment 8762917 [details] [review]
[treeherder] KWierso:1120477 > mozilla:master

How about this? 

When you first load the page, the eye icon is slashed, and the words "Excluded jobs" have a line through them. The tooltip for the toggle says "Click to show excluded jobs".

When you click the toggle, the eye icon loses the slash, the words "Excluded jobs" loses the line through them, and the tooltip changes to "Click to hide excluded jobs".

If the window is too narrow, the text disappears, and shows only the eye icon.

Happy to wordsmith it a bit more, if you'd like, but I can't think of anything better offhand.
Attachment #8762917 - Flags: review?(cdawson)
(Assignee)

Comment 15

a year ago
Other option could be to switch the ::after to be ::before, which would get rid of the eye icon when the text is visible and then show it when the text is hidden.
Comment on attachment 8762917 [details] [review]
[treeherder] KWierso:1120477 > mozilla:master

I really like it!  :)
Attachment #8762917 - Flags: review?(cdawson) → review+

Comment 17

a year ago
Commit pushed to master at https://github.com/mozilla/treeherder

https://github.com/mozilla/treeherder/commit/172afd396c6377ea778622345096b7923c20d9e5
Bug 1120477 - Change the hidden jobs toggle's glyphs to something hopefully more discoverable (#1596) r=camd

* Bug 1120477 - Change the hidden jobs toggle's glyphs to something hopefully more discoverable

* Add some text, but only if the window can fit it

Updated

8 months ago
Status: NEW → RESOLVED
Last Resolved: 8 months ago
Resolution: --- → FIXED
You need to log in before you can comment on or make changes to this bug.