New issue
Advanced search Search tips
Note: Color blocks (like or ) mean that a user may not be available. Tooltip shows the reason.

Issue 846407 link

Starred by 4 users

Issue metadata

Status: Assigned
Owner:
Cc:
Components:
EstimatedDays: ----
NextAction: ----
OS: Linux , Windows , Chrome , Mac
Pri: 3
Type: Feature



Sign in to add a comment

[omnibox] Replace omnibox icon defaults and update colors to spec

Project Member Reported by bklmn@chromium.org, May 24 2018

Issue description

We are updating generic search and page icons.
https://screenshot.googleplex.com/hD493TPHAcg.png

The search icon uses a simple material search glass icon, but in a circle to be more "fav" like.

The page icon is using a non-region specific globe. This is happening on mobile as well so we are aligning for consistency cross-platoform.

Both icons are GG400: #202124 @ 28%
 
generic-search.svg
1.2 KB Download
generic-globe.svg
1.3 KB Download
Cc: emilyschechter@chromium.org
Labels: OS-Windows
Thanks.

Note that the new search icon is already in Chrome and in use in the #top-chrome-md = Touchable UI. We should be able to re-use that.

For pages, though, Touchable uses an icon that looks more like the search icon (circular, dark background with white strokes) but still looks like a piece of paper. Just to confirm, you specifically want to move away from that to the globe icon? Will Touchable also use this new globe icon?

Comment 2 by bklmn@chromium.org, May 24 2018

Cc: bettes@chromium.org
Ok great.

For touchable, my understanding is that everything should move to the globe, but Ill confirm with +bettes

Comment 3 by skare@chromium.org, May 29 2018

Status: Assigned (was: Untriaged)
(marking assigned to triage)
Cc: bklmn@chromium.org
Owner: jdonnelly@chromium.org
I'll add these behind the Refresh flag.

Comment 5 Deleted

Comment 6 Deleted

A few questions about this:

1. For touchable, should I immediately change the page icon to the globe? Or only for "touchable refresh"?
2. GG400 is very low contrast, especially with the selection background (see first attached screenshot). The current touchable ui uses GG700 (see second attached screenshot). It also uses GG700 for the de-emphasized text color so that text and icon color match. (It reserves GG400 instead for dark background/incognito text and icons). What would you think of sticking with that approach here?
3. Aside from the color question, do the attached screenshots of my work-in-progress CL look like they correctly captured your intent?
Screen Shot 2018-06-11 at 4.42.10 PM.png
51.1 KB View Download
Screen Shot 2018-06-11 at 4.54.53 PM.png
52.3 KB View Download

Comment 8 by bklmn@chromium.org, Jun 14 2018

1. We should use the Globe for default and touchable. 
2. Let me double check with bettes@ on the color
3. In general, looks great. 

Comment 9 by bklmn@chromium.org, Jun 14 2018

One of the issues with the contrast is the highlight color. Currently much darker than spec'd. In spec we have highlight as #F1F3F4

I know we talked about slightly darkening this for a11y, but we this would be one of our biggest discrepancies. 
Screen Shot 2018-06-14 at 11.06.13 AM.png
183 KB View Download
Ok, I can fix the highlight color.

But what about hover vs. selection vs. both highlight colors? Currently those are actually 3 different colors. The "both" color, which is darkest, is what you're seeing in my screenshots.

I don't remember if we ever discussed how to treat this scenario. My $0.02: having two slightly different colors for hover vs. selection doesn't make much sense. But having a darker color when both are in effect is nice. Otherwise it sort of looks like nothing happens when you move the hover from a non-selected row to the selected row.

Comment 11 by bklmn@chromium.org, Jun 15 2018

Yeah, don't think we have talked about it. Im thinking hover and select should for sure be the same color. 

For the "both" state, this is some I'm just now realizing. Im fine with a shade darker or maybe the shade of blue? Would that be weird? 
Labels: Proj-MdRefresh OS-Linux
I think that'd be weird. I mean, it's not that weird, today's Windows UI uses blue for selection. I've just never been a big fan of that. Although that may be just because it was platform-specific. But you're the designer, I'll do whatever you say. :)

Bottom line for me is that I'd like to see a set of values for the hover/selection highlight and the icons that had a good contrast level between each (between background and highlight and between highlight and icon).

Currently in stable I can't see any difference between hover/select/both, even though it sounds like that's actually not the case :) I'm fine leaving it that way (no difference) because it doesn't seem really necessary to move hover from non-selected to selected. My brain assumes the single row is selected+hovered.

Comment 15 by bklmn@chromium.org, Jun 18 2018

Ill make sure this is a UI detail Alan and I discuss. Im pretty open and agree contrast is the biggest concern in making sure the icons are visible with the hover and interaction states. 
Cc: dschuyler@chromium.org
 Issue 853407  has been merged into this issue.
Ok, I'm going to proceed with the current colors so I can land the icon changes. Just let me know what your final decision for the icon and selection background colors are and I'll put that in a follow-on change.

Comment 18 by bklmn@chromium.org, Jun 19 2018

That SGTM. Ill evalugate and we can update the polish on these values for M69 if we find a better solution. Actively investigating. 
Project Member

Comment 19 by bugdroid1@chromium.org, Jun 20 2018

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/50f567a5c40098dbb4205c0329309fc38b354ee1

commit 50f567a5c40098dbb4205c0329309fc38b354ee1
Author: Justin Donnelly <jdonnelly@google.com>
Date: Wed Jun 20 01:33:38 2018

[omnibox] Update default suggestion icons for MD Refresh.

The search and bookmark icons are the same as was already being used for
Touchable. The "page" icon is now a globe, which will be used for MD
Refresh (standard and touch) but not non-Refresh touch.

The colors will be updated in a future CL that addresses both icon color
and row highlight color.

Bug: 846407
Change-Id: Ieb9d020bfe27d6610694fd8c773ef1934e9d8c36
Reviewed-on: https://chromium-review.googlesource.com/1104874
Commit-Queue: Justin Donnelly <jdonnelly@chromium.org>
Reviewed-by: Dave Schuyler <dschuyler@chromium.org>
Cr-Commit-Position: refs/heads/master@{#568686}
[modify] https://crrev.com/50f567a5c40098dbb4205c0329309fc38b354ee1/components/omnibox/browser/BUILD.gn
[modify] https://crrev.com/50f567a5c40098dbb4205c0329309fc38b354ee1/components/omnibox/browser/autocomplete_match.cc
[add] https://crrev.com/50f567a5c40098dbb4205c0329309fc38b354ee1/components/omnibox/browser/vector_icons/md_page.icon

Triage: Can we close this bug?

Comment 21 by bklmn@chromium.org, Jun 27 2018

There has been a bunch on negative feedback and concerns about the new search icon. 

TL;DR: we need to revert the search icon back to the original asset used in stable. :(
Will do. Note that the decision was made by email to also use the old icon in Touchable Refresh. After the change I'm making, the iconography will be as follows:

Pages
Stable: old page icon
Non-Refresh Touchable: inverse page icon
All Refresh: globe icon

Searches
Stable: old search icon
Non-Refresh Touchable: inverse search icon
All Refresh: old search icon

Bookmarks
Stable: old star icon
Non-Refresh Touchable: inverse star icon
All Refresh: inverse star icon
Project Member

Comment 23 by bugdroid1@chromium.org, Jun 29 2018

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/690865d9b917970262dbd3d37fc04f5f756c53b5

commit 690865d9b917970262dbd3d37fc04f5f756c53b5
Author: Justin Donnelly <jdonnelly@chromium.org>
Date: Fri Jun 29 14:17:04 2018

[omnibox] Change back to old search icon in Refresh.

The new search icon looks cool but is not obviously a magnifying
glass to many people's eyes.

Bug: 846407
Change-Id: Ibe32f016d34827d8f03b7bbda5fdf721dddf9f5e
Reviewed-on: https://chromium-review.googlesource.com/1118716
Reviewed-by: Dave Schuyler <dschuyler@chromium.org>
Commit-Queue: Justin Donnelly <jdonnelly@chromium.org>
Cr-Commit-Position: refs/heads/master@{#571465}
[modify] https://crrev.com/690865d9b917970262dbd3d37fc04f5f756c53b5/components/omnibox/browser/autocomplete_match.cc

Summary: [omnibox] Replace omnibox icon defaults and update colors to spec (was: [omnibox] Replace omnibox icon defaults)
Leaving this open to track the fact that we may still want to update the icon color, per the discussion above.
Labels: -Pri-1 Pri-2
Labels: -Pri-2 Pri-3
Labels: Group-Omnibox
Owner: bklmn@chromium.org
Labels: -Proj-MdRefresh Proj-DesktopUI
Labels: Hotlist-DesktopUITriaged

Sign in to add a comment