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

Issue 633799 link

Starred by 2 users

Issue metadata

Status: Verified
Owner:
Closed: Aug 2016
Cc:
Components:
EstimatedDays: ----
NextAction: ----
OS: Chrome
Pri: 2
Type: Bug



Sign in to add a comment

"Copy to clipboard" notification action icon is too dark and too large

Project Member Reported by derat@chromium.org, Aug 3 2016

Issue description

The icon used for the "Copy to clipboard" action on download notifications looks like it's bigger than it should be:

IDR_DOWNLOAD_NOTIFICATION_MENU_COPY_TO_CLIPBOARD:
chrome/app/theme/default_100_percent/cros/downloads/copy_to_clipboard.png  24x24
chrome/app/theme/default_200_percent/cros/downloads/copy_to_clipboard.png  48x48

kNotificationButtonIconSize in ui/message_center/message_center_style.h is 16, so I think these should be 16x16 and 32x32 instead -- that's what other button icons seem to be.

They also look like they're the wrong color: they're #757575, while other action icons appear to be #969696.

I'm attaching the incorrect images.

I've since copied these to the following paths, so I should update those too:

chrome/app/theme/default_100_percent/cros/notification_screenshot_copy_to_clipboard.png
chrome/app/theme/default_200_percent/cros/notification_screenshot_copy_to_clipboard.png
 
copy_100.png
133 bytes View Download
copy_200.png
186 bytes View Download

Comment 1 by derat@chromium.org, Aug 3 2016

Cc: osh...@chromium.org
Here are the sizes of all PNGs with "notification" in their name under chrome/app. (It looks like there are twice-as-large 200% images for all of these, so I'm leaving 200% out of the list.)

chrome/app/theme/default_100_percent/legacy/infobar_desktop_notifications.png            18x18 (mac-only)
chrome/app/theme/default_100_percent/cros/notification_screenshot_copy_to_clipboard.png  24x24 (button)
chrome/app/theme/default_100_percent/cros/notification_peripheral_battery_low.png        40x40
chrome/app/theme/default_100_percent/cros/notification_drive.png                         40x40
chrome/app/theme/default_100_percent/cros/consumer_management_notification_icon.png      40x40
chrome/app/theme/default_100_percent/cros/notification_play_store.png                    40x40
chrome/app/theme/default_100_percent/cros/printer_notification.png                       48x48
chrome/app/theme/default_100_percent/common/notification_screenshot_icon.png             40x40
chrome/app/theme/default_100_percent/common/notification_alert.png                       80x80
chrome/app/theme/default_100_percent/common/notification_welcome_icon.png                80x80
chrome/app/theme/default_100_percent/common/allowed_notifications.png                    19x19 (webui)
chrome/app/theme/default_100_percent/common/notification_usb_icon.png                    80x80
chrome/app/theme/default_100_percent/common/notification_hotword_icon.png                80x80
chrome/app/theme/default_100_percent/common/blocked_notifications.png                    19x19 (webui)
chrome/app/theme/default_100_percent/common/notification_welcome_learn_more.png          16x16 (button)
chrome/app/theme/default_100_percent/common/notification_extension_installed.png         80x80
chrome/app/theme/default_100_percent/screen_capture_notification_grip.png                6x11  (used in custom view)

I think that 80x80 is the correct size for the large icons that appear at the left side of the notifications, which many of these are.

----

So these should probably be 80x80 instead:

cros/notification_peripheral_battery_low.png
cros/notification_drive.png
cros/consumer_management_notification_icon.png
cros/notification_play_store.png
cros/printer_notification.png
common/notification_screenshot_icon.png

---

This is the only action icon that looks like it needs to be resized to 16x16:

cros/notification_screenshot_copy_to_clipboard.png

---

I didn't look at the image content to see if any of these have the same color issue that I described for notification_screenshot_copy_to_clipboard.png.

Comment 2 by derat@chromium.org, Aug 3 2016

Cc: kuscher@chromium.org
On issue 633600, you wrote "I checked with Sebastien and he mentioned that the icons should be at 16 at 1x and in svg format."

Just to clarify, I don't think that any of these are shipped as SVG. We convert to transparent PNGs before checking them in to the tree. Agree that it sounds reasonable to keep these as SVGs on the UX side, though. :-)
Yes I see what you are saying. Please let me know if it's possible to get the list of all the other notification action icons that we should update. 


Comment 4 by derat@chromium.org, Aug 3 2016

List is in comment #1. I don't see any other problematic action icons but there are a bunch of main notification icons that are too small.
Are you talking about these icons? Would you mind to show me a screenshot of how small they are looking now?

https://drive.google.com/corp/drive/u/0/folders/0B_2Uyb2Rhx2OYkpDNHUwako4VHc
https://bugs.chromium.org/p/chromium/issues/detail?id=619085

Thanks,
Elizabeth
Cros system notifications.jpg
966 KB View Download

Comment 6 by derat@chromium.org, Aug 3 2016

Here are the 100% images that seem like they should be 80x80.

I don't think they'll occur at their original sizes in the UI. Instead, they'll be scaled up and blurry.
consumer_management_notification_icon.png
433 bytes View Download
notification_drive.png
2.0 KB View Download
notification_peripheral_battery_low.png
155 bytes View Download
notification_play_store.png
1.2 KB View Download
notification_screenshot_icon.png
194 bytes View Download
printer_notification.png
213 bytes View Download
System notification is moving to vector icons (crbug.com/619085), and we should avoid png unless there is a good reason. Please contact oshima@ or tdanderson@ as they know more about this. 

Also the icons you have attached some assets are already updated in 80x80 svg format, but the rest of them I didn't get the bug/request. That's why they are not created in the right size and format.

notification_peripheral_battery_low:
https://drive.google.com/a/google.com/file/d/0B_2Uyb2Rhx2ORzc5N1Y5X0NVMzg/view

notification_screenshot:
https://drive.google.com/a/google.com/file/d/0B_2Uyb2Rhx2OUU9aTGtQOThFU1E/view

this is for chrome web store, do we need a new one for play store?:
https://drive.google.com/a/google.com/file/d/0B_2Uyb2Rhx2OUHgxdUxlbVpaU2M/view

printer_notification:
https://drive.google.com/corp/drive/u/0/folders/0B_2Uyb2Rhx2OZGFaQ1RoVWc2Y1E
(These are created much earlier so they are still in png) I will update these files to SVG format soon.

Comment 8 by derat@chromium.org, Aug 3 2016

Cc: tdander...@chromium.org
I'll let Oshima or Terry comment here, as I haven't noticed any vector assets in the tree or announcements about this on chromium-dev.
Re #8, we started switching all icons over to vector format during the top chrome material design work. You can see them in ui/gfx/vector_icons (note the files themselves are derived from SVGs but are not actually in .svg format). More details are at https://sites.google.com/a/chromium.org/dev/developers/how-tos/vectorized-icons-in-native-chrome-ui

PNGs will still need to be used for complex multi-colored product icons such as the ones for Drive or Play Store.
Thanks for the details! I left a comment on issue 606819 -- I'm happy to help out with updating some of these if we have vector versions. I assume we should use the spreadsheet for tracking.

Comment 11 Deleted

Comment 12 Deleted

Cc: elizabethchiu@chromium.org
Owner: derat@chromium.org
Status: Started (was: Assigned)
Elizabeth sent me updated icons; attaching here. Thanks!
copy_100.png
286 bytes View Download
copy_200.png
544 bytes View Download
The clipboard icons are fixed now, so I'm closing this. I'll use issue 606819 to track fixing the other issues from comment #1.
Status: Fixed (was: Started)
Labels: VerifyIn-54
Labels: VerifyIn-55

Comment 19 by dchan@google.com, Nov 19 2016

Labels: VerifyIn-56

Comment 20 by dchan@google.com, Jan 21 2017

Labels: VerifyIn-57

Comment 21 by dchan@google.com, Mar 4 2017

Labels: VerifyIn-58
Status: Verified (was: Fixed)

Sign in to add a comment