1324726 - The button of viewing history within synced devices looks disabled, but actually can be pressed

Status: RESOLVED INCOMPLETE

(Firefox for Android Graveyard :: Firefox Accounts, defect, P3)

Description

[Wesley Huang [:wesley_huang] (EPM) (NI me)]

Attachment: disabled.png

STR:
1. Go to the history panel under awesome screen
2. Check on the entries of synced devices

Actual result:
The entries looks disabled

Expected result:
The entries should not be grayed out

Comment 1

[Wesley Huang [:wesley_huang] (EPM) (NI me)]

Hi Jack,

Julian found that per "Attachment 8746826 [details] Details for Bug 1261527", it was intended to look like what it is now. So maybe this isn't a bug?

Comment 2

[Jack Lin[:jacklin]]

Hi Anthony,

For visual design, do you know is there any reason for greyed out the entries? I discussed with Taipei developer and he said there is nothing added (maybe some feature is desabled...) within the code when users hide the lists. 

So, I suggest no need to grey out the entries, just use original dark black color. What do you think?

Thank you

Comment 3

[Anthony Lam (:antlam) Find me, @antlam on Slack!]

Yeah this was a deliberate UI choice we made because it looked very overwhelming when _everything_ was dark grey (versus the light grey you're talking about here). We decided to use this light grey UI to define that an item was "collapsed" in the list to avoid having a long running list of tabs that was hard to decipher. But perhaps it's not very legible this way.

I think changing the device icon, and the device name to always stay the darker grey (like it is there for  jacklin’s Nightly on JackdeMacBook-Pro and Nightly on ASUS_Z017DA) makes sense.

But perhaps not the Last synced: subtitle or the chevron arrow (>)?

Comment 4

[Jack Lin[:jacklin]]

Attachment: 2 mockups for collapsed list

I simulated what you mentioned as the attached file. 

I think I prefer the right side mockup because I would still feel something is disabled if the chevron arrow uses light grey color. 

What do you think? or any better suggestions?

Comment 5

[Anthony Lam (:antlam) Find me, @antlam on Slack!]

(In reply to Jack Lin[:jacklin] from comment #4)
> Created attachment 8822341 [details]
> 2 mockups for collapsed list
> 
> I simulated what you mentioned as the attached file. 

Looks good Jack! I think having them all dark grey (the design on the right) looks a bit overwhelming. And I worry it could be even moreso on smaller devices.

> I think I prefer the right side mockup because I would still feel something
> is disabled if the chevron arrow uses light grey color. 
> 
> What do you think? or any better suggestions?

I prefer the left one because there's more of a visual hierarchy.

Looking at the Home Panels navigation along the top, we use a similar light-grey to dark-grey UI to define a similar hierarchy for our users. I'm not too worried about them getting confused by the light grey and chevron and thinking it's disabled. 

If we're worried about hierarchy causing the confusion here, we could try making it all flat (light-grey)? but when they're all dark grey, it seems visually overwhelming to me.

Thoughts?

Comment 6

[Ryan Feeley [:rfeeley]]

Does having a disabled looking device makes sense if there are no open tabs on that device?

Comment 7

[Michael Comella (:mcomella) [NI reported issues only: ex-Mozilla]]

[triage] Non-critical for me but maybe Grisha will want to fix. If not, feel free to move to to P3 Awesomescreen.

Comment 8

[BMO Automation]

We have completed our launch of our new Firefox on Android. The development of the new versions use GitHub for issue tracking. If the bug report still reproduces in a current version of [Firefox on Android nightly](https://play.google.com/store/apps/details?id=org.mozilla.fenix) an issue can be reported at the [Fenix GitHub project](https://github.com/mozilla-mobile/fenix/). If you want to discuss your report please use [Mozilla's chat](https://wiki.mozilla.org/Matrix#Connect_to_Matrix) server https://chat.mozilla.org and join the [#fenix](https://chat.mozilla.org/#/room/#fenix:mozilla.org) channel.