mozilla-mobile / firefox-tv

Firefox for Amazon's Fire TV
https://blog.mozilla.org/blog/2017/12/20/firefox-is-now-on-amazon-fire-tv-happy-holiday-watching/
Mozilla Public License 2.0
256 stars 110 forks source link

Turbo Mode icon color should be redesigned #2049

Open abodea opened 5 years ago

abodea commented 5 years ago

Why/User Benefit/User Problem

The user will be able to see better if the Turbo Mode is on or off.

What / Requirements

When turning the Turbo Mode on, the icon should change color and be more highlighted for example the rocket should get the Firefox theme colors.

Acceptance Criteria (how do I know when I’m done?)

The icon design will change when Turbo Mode will be on or off. IMG_20190411_153628

liuche commented 5 years ago

@brampitoyo ^

brampitoyo commented 5 years ago

@abodea If I understand you correctly, you’re proposing something like this:

Current:

Proposed:

When we make these small decisions, it’s useful to keep in mind how it would impact the rest of the UI.

For instance, there are two other icons on the toolbar that have the same active state:

  1. Pin site
  2. Request desktop site

The question is, should we also colour those icons blue when they’re active? For consistency, we probably should.

But if we do that, then there can potentially be a lot of blue in the browser UI, which will be distracting:

Phase 1@2x

Compare it to if we set the active icon to white:

Phase 1@2x

An alternative to try is to colour the active icon blue, but not change its background colour:

Phase 1@2x

Another alternative is to change the icon’s background colour to blue. I would argue that this is too much:

Phase 1@2x

@abodea What do you think?

abodea commented 5 years ago

Hello @brampitoyo thank you for the response! I believe this is the best one, its way more simple than the others there is no background at all and it looks very nice. 56258112-92baaa80-6122-11e9-8bae-2b5bc89f4418 But I was thinking for another color like something to match Firefox, maybe a combination between Yellow and Orange. Maybe with another color(mentioned above) we can include the following Pin site and Request desktop site would fit perfectly colored. For the image above I consider the UI is clear and simple and the user is very well informed that those options/settings are on/activated. Maybe we can make this effect even for the rest of the buttons(home and settings) when they are selected.

Thanks, Andrei

mcomella commented 5 years ago

Notes: