To be clear, this is a windows tracking bug only. Parallel work for Mac is at  crbug.com/590917 

Sorry for any confusion

Let's target M55 for this

New AI. Assigning back to myself.

Update specs for new user menu chip per discussion with Alex (chip should match window controls when window is maximized or when it’s non-maximized but tabstrip isn’t full; should only squish chip when window is non-maximized and tabstrip is full

There are now 2 avatar button presentations for windows 10: tall and cozy

Use tall when either of the following are true: 
    1. not maximized, but tabstrip isn’t full
    2. window is maximized

Use cozy when window is not maximized AND tabstrip is full

Other visual updates
+ new default state removes outlines and background color
+ local avatar icon should be colored #5a5a5a @ 0.7a (Same as the the close-x on tabs) 


Mocks
https://folio.googleplex.com/chrome-ux-specs-and-sources/Chrome%20Desktop%20Sign%20In/user_menu-button/P%20-%20windows_10#%3Fz=width

Specs
https://folio.googleplex.com/chrome-ux-specs-and-sources/Chrome%20Desktop%20Sign%20In/user_menu-button/Spec#%2FSPEC%20-%20avatar-button_WIN10.png%3Fz=width

Deleted: 01-local.png 76.6 KB

	01-local.png 76.6 KB View Download

Deleted: 02-signed-in.png 76.7 KB

	02-signed-in.png 76.7 KB View Download

Deleted: Screen Shot 2016-10-18 at 3.44.10 PM.png 215 KB

	Screen Shot 2016-10-18 at 3.44.10 PM.png 215 KB View Download

Looks terrific, thanks Alan.

Re-assigning to Mihai, since his team is taking over this OKR for this quarter. I've removed the identity-ux-backlog label as well.

Eli: Just to make sure I understand the scope of this work: this is only for windows (and not for Linux), right? On Linux, the exting avatar button matches the UI of the maximize, minimize and close buttons styles.

I believe that's correct, that this is only for Windows. Alan, please correct me if that's wrong.

That is correct

--Chrome Identity automated triaging--

This bug is Assigned and has gone one month without any activity, so it is being moved to Available to indicate that it is not actively being worked on. If you are working on this bug, please mark yourself as the owner and move back to Assigned. Please see https://goo.gl/78kbny for more details. Please remove the Services>SignIn or UI>Browser>Profiles components if this bug isn't related to Chrome Identity.

For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot

This is also something we wanted to do for a while, but I never had time to do the implementation. It may be an interesting way to see how the various UIs interact and how the Views framework works.

I have a partial implementation here: https://codereview.chromium.org/2616523004/

bettes@: Hi Alan, to clarify the spec - should the generic icon (ic_account_circle) be shown even if there are multiple local profiles defined? Mihai and I both think that would get confusing and it would be better to keep the current behaviour, which is to show the generic icon only if there is only one profile (and it's not signed in and is not a guest profile).

Yep, we should only show the generic icon if there is a single, signed-out, non-guest local profile. Let's maintain that behavior.

Thanks Evgeny!

The spec says "menu appears on click-down (not click-release)". Does this apply always or only to the MD button, i.e. the menu should continue to appear on mouse button release on platforms other than Windows 10 or when using themes?

I think that behavior should always apply, but Alan please correct me if that's wrong.

Also, a clarification question for Alan - remind me why are we only updated the avatar style for Win10? Is it just because the button styles for Win10 are so different than other platforms?

And actually, now that I'm thinking about it...we should probably only change the behavior for click ("menu appears on click-down") for Win10, if that's the only platform on which we're making these other changes.

But I could see that going either way. Alan, what are your thoughts?

Click-down applies to the MD button only. "Apply always" sounds like a broad claim so I'd need clarification on what you mean before responding to that :)

This is a windows bug, but the preferred behavior is click-down for mac, windows, linux. If you can cover all platforms, that'd be wonderful! 

By "Apply always" I meant "always show the profiles menu on click-down on the avatar button on Windows, whether the button is the MD button or the existing button".

It probably wouldn't be difficult to change it on other platforms, too, but at the moment I'm only working on Windows, so I think that would be best covered by another bug, just to avoid blocking the rest of this. 

>> By "Apply always" I meant "always show the profiles menu on click-down on the avatar button on Windows, whether the button is the MD button or the existing button".

Yes, apply always

Just to update the bug with some of the things we confirmed over email:

1/ "Active" and "Pressed" are the same and can be treated the same in the code
2/ The click-down behavior should be applied across all versions of Windows, regardless of theme/OS
3/ The button height changes should apply across all of Win10, regardless of theme

Actually, one clarification: the button height changes shouldn't apply when a theme has been set. The click-down behavior should apply across all flavors of Windows; other than that, all the spec'ed layout/visual design changes should only apply to Win10 no-theme.

Summary of changes made:

1) Show new MD button only on Windows 10 and only if not using a theme
2) Make MD button "cozy" (22px) when tabstrip is full and not maximised and not text direction is not RTL (can be tested with --force-ui-direction=rtl)
3) Make "tall" (non-cozy) MD button the same height as caption bar buttons - it's not pixel-perfect (see issue 668278)
4) Change icon and highlighting for MD button (see screenshots attached)
5) Show "ink drop" animation when MD button is clicked, like for bookmarks bar and other menu buttons
6) Make menu appear on press, not on release (for all platforms, not just Windows 10)
7) Keep button in "pressed" state while the profile menu is shown (for all platforms)

Deleted: tall-normal.png 2.9 KB

	tall-normal.png 2.9 KB View Download

Deleted: tall-hover.png 831 bytes

	tall-hover.png 831 bytes View Download

Deleted: tall-pressed.png 7.3 KB

	tall-pressed.png 7.3 KB View Download

Deleted: cozy-normal.png 4.0 KB

	cozy-normal.png 4.0 KB View Download

Deleted: cozy-hover.png 4.2 KB

	cozy-hover.png 4.2 KB View Download

2) above was supposed to say:

Make MD button "cozy" (22px) when tabstrip is full and not maximised and text direction is not RTL (i.e. is LTR)

FYI we have a pretty similar bug tracking work for the themed frame here: bug 591586

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

commit b1d346cc88d41c6a5b1dd5ac47327c9ee7c6d7e7
Author: emx <emx@chromium.org>
Date: Tue Apr 25 08:22:36 2017

Allow a LocatedEvent to be passed to MenuButton, so the ink drop animation is centered on the click location.

The new constructor overload is used in https://codereview.chromium.org/2832823002/

BUG= 635699 

Review-Url: https://codereview.chromium.org/2831353002
Cr-Commit-Position: refs/heads/master@{#466922}

[modify] https://crrev.com/b1d346cc88d41c6a5b1dd5ac47327c9ee7c6d7e7/ui/views/controls/button/menu_button.cc
[modify] https://crrev.com/b1d346cc88d41c6a5b1dd5ac47327c9ee7c6d7e7/ui/views/controls/button/menu_button.h
[modify] https://crrev.com/b1d346cc88d41c6a5b1dd5ac47327c9ee7c6d7e7/ui/views/controls/button/menu_button_unittest.cc
[modify] https://crrev.com/b1d346cc88d41c6a5b1dd5ac47327c9ee7c6d7e7/ui/views/controls/menu/menu_controller.cc

I have questions re: appearing on mouse up.

1. Other bubbles appear on mouse down. Why is this one different?
2. Comboboxes also appear on mouse down. This is arguably similar to a combobox in that it has an active selection and offers several other mutually exclusive selections to switch to. Should we not match that?
3. If this is a menu, should we be able to mouse down, move the mouse, and release on a row to effect selection?

Also: should "Manage people" have an ellipsis after it?

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

commit d6dd415275e2ddf1b1e816de4a9f2b23d4236339
Author: emx <emx@chromium.org>
Date: Tue May 09 09:34:27 2017

Add GetCaptionButtonHeightInDIPs() method

This CL adds the the function GetCaptionButtonHeightInDIPs() method that returns
the height of the caption buttons on Windows in DIPs and uses it for the
Windows 10 MD avatar button (see http://crrev.com/2851543002).

BUG= 635699 

Review-Url: https://codereview.chromium.org/2833363002
Cr-Commit-Position: refs/heads/master@{#470271}

[modify] https://crrev.com/d6dd415275e2ddf1b1e816de4a9f2b23d4236339/chrome/browser/ui/views/frame/minimize_button_metrics_win.cc
[modify] https://crrev.com/d6dd415275e2ddf1b1e816de4a9f2b23d4236339/chrome/browser/ui/views/frame/minimize_button_metrics_win.h

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

commit defdfbc63904f49b29947f3a51babfe1f00f23b8
Author: emx <emx@chromium.org>
Date: Thu May 11 10:46:03 2017

Rename new_avatar_button.* to avatar_button in preparation for CL 2851543002

BUG= 635699 

Review-Url: https://codereview.chromium.org/2868293002
Cr-Commit-Position: refs/heads/master@{#470908}

[modify] https://crrev.com/defdfbc63904f49b29947f3a51babfe1f00f23b8/chrome/browser/ui/BUILD.gn
[modify] https://crrev.com/defdfbc63904f49b29947f3a51babfe1f00f23b8/chrome/browser/ui/views/frame/avatar_button_manager.cc
[rename] https://crrev.com/defdfbc63904f49b29947f3a51babfe1f00f23b8/chrome/browser/ui/views/profiles/avatar_button.cc
[rename] https://crrev.com/defdfbc63904f49b29947f3a51babfe1f00f23b8/chrome/browser/ui/views/profiles/avatar_button.h

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

commit da9bbac7c610430c9b94142d83ce56ee1d4f2f87
Author: emx <emx@chromium.org>
Date: Fri May 12 12:20:41 2017

Update avatar button to MD (part 1)

Update avatar button to MD

Summary of changes made [ see screenshots in https://bugs.chromium.org/p/chromium/issues/detail?id=635699&desc=2#c36 ]:

1) Show new MD button only on Windows 10 and only if not using a theme
2) Make MD button "cozy" (20px) when tabstrip is full and not maximised and text direction is LTR (RTL can be tested with --force-ui-direction=rtl)
3) Make "tall" (non-cozy) MD button the same height as caption bar buttons - it's not pixel-perfect (see bug 716365)
4) Change icon and highlighting for MD button
5) Show "ink drop" animation when MD button is clicked, like for bookmarks bar and other menu buttons
6) Make menu appear on press, not on release (for all platforms, not just Windows 10)

BUG= 635699 

Review-Url: https://codereview.chromium.org/2851543002
Cr-Commit-Position: refs/heads/master@{#471279}

[modify] https://crrev.com/da9bbac7c610430c9b94142d83ce56ee1d4f2f87/chrome/browser/ui/BUILD.gn
[modify] https://crrev.com/da9bbac7c610430c9b94142d83ce56ee1d4f2f87/chrome/browser/ui/avatar_button_error_controller_delegate.h
[modify] https://crrev.com/da9bbac7c610430c9b94142d83ce56ee1d4f2f87/chrome/browser/ui/views/frame/avatar_button_manager.cc
[modify] https://crrev.com/da9bbac7c610430c9b94142d83ce56ee1d4f2f87/chrome/browser/ui/views/frame/avatar_button_manager.h
[modify] https://crrev.com/da9bbac7c610430c9b94142d83ce56ee1d4f2f87/chrome/browser/ui/views/frame/glass_browser_frame_view.cc
[modify] https://crrev.com/da9bbac7c610430c9b94142d83ce56ee1d4f2f87/chrome/browser/ui/views/frame/glass_browser_frame_view.h
[modify] https://crrev.com/da9bbac7c610430c9b94142d83ce56ee1d4f2f87/chrome/browser/ui/views/profiles/avatar_button.cc
[modify] https://crrev.com/da9bbac7c610430c9b94142d83ce56ee1d4f2f87/chrome/browser/ui/views/profiles/avatar_button.h
[delete] https://crrev.com/f2125fea63367c21af67cddccb5ba50d9309070d/chrome/browser/ui/views/profiles/avatar_button_delegate.h
[modify] https://crrev.com/da9bbac7c610430c9b94142d83ce56ee1d4f2f87/chrome/browser/ui/views/profiles/profile_chooser_view_browsertest.cc
[modify] https://crrev.com/da9bbac7c610430c9b94142d83ce56ee1d4f2f87/ui/views/controls/button/label_button.cc
[modify] https://crrev.com/da9bbac7c610430c9b94142d83ce56ee1d4f2f87/ui/views/controls/button/label_button.h

The above commit implements most of the spec, except for the requirement to keep the button looking "pressed" while the menu is shown. estade@ is going to do that as part of bug 591586.

Is there any follow-up work that's left here, or can we mark this bug as Fixed?

Peter, I know you had a few outstanding questions for Alan - can we follow-up on those in another bug?

I think there's enough followup work that I'd rather keep this open, especially since most new UX was implemented on Win 10 only and other versions of Windows haven't been touched.

OK, sounds good. Who is the right owner for the follow-up work? Mihai mentioned that he'd chatted with you and that the platform team is interested in owning these kinds of UX changes to high-visibility surfaces (like the avatar menu).

Does it make sense for Evan to own this moving forward for the remaining follow-up items as well, since he's already working on Issue 591586?

Evan disclaimed willingness to follow up with Windows-specific stuff.  The person with the most expertise in Windows caption button work is bsep, but he's very loaded right now.  Do we have a sense for the urgency of this versus, say, Harmony work?

That's probably a question for Alan and +Rachel :)

Rachel, for context, this bug is about polishing/materializing the avatar button on Windows 10. Evgeny (on the signin team) landed a large chunk of the spec in the CL in comment #43, but there are still some follow-up polish things to do. It probably makes more sense for someone on the platform team (with more familiarity with this code) to own the follow-up polish work. I would imagine this is probably less of a priority than Harmony, but I defer to you folks.

Peter, one thing I'd like to clarify: if we just left things as-is (with Evgeny's CL checked in), are there any glaring inconsistencies/issues, or is the remaining follow-up work truly just polish? From looking at the screenshots linked in Evgeny's CL, things look pretty good to me. Just want to make sure that, for instance, we think it's strictly better to keep Evgeny's CL checked in, even if we don't immediately address the follow-up items remaining.

It's definitely better to keep his work checked in.

The remaining work on Win 10 is polish/a11y and code cleanup.  However, as noted above, no work has been done on Windows versions pre-10, so that would be substantial implementation; and I don't know whether this bug should track other OSes, which also aren't done yet.

Got it, thanks Peter. I would think that it makes sense to just expand the scope of this bug to include other platforms as well, for whenever UX/platform eng gets the bandwidth to address older OSes.

Agreed that this is much better than before for win10. Let's queue up the rest of the work for after harmony.

In an attempt to unblock this, let me clarify my thoughts here: 

If it's possible, we should keep these polish changes for Windows 10 only. The only version of Windows I'm worried about is 7 and I think the current design (for 7 and aero) is acceptable. We should not prioritize Windows 8. 

I think it's important to keep pushing forward on the polish of Windows 10, given how visible this UI is on the toolbar and our overall investment in the platform.

LMK what else we can do here. Thanks! 

Issue 717835 has been merged into this issue.

I noticed that the current button doesn't correctly handle dark themes (i.e. it remains black when the caption buttons are white). While peter is right I'm pretty swamped I might try to write a patch to fix this quickly anyway, since I think it looks pretty ugly...

Deleted: switcher-button-dark.PNG 2.0 KB

	switcher-button-dark.PNG 2.0 KB View Download

Totally understand. Whatever extra cycles you have would be most appreciated! Is this behind a flag?

It's not behind a flag. I'm assuming we'll need to merge to 60.

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

commit fc4b39cbaf5823aafad88ef0b80c5f7eaf614dc8
Author: Bret Sepulveda <bsep@chromium.org>
Date: Sat Jun 24 20:25:06 2017

Add profile switcher button dark theme.

When the Windows titlebar and caption buttons have a dark theme, the
profile switcher button now has one to match. It doesn't yet update when
the accent color changes but at least it'll match eventually, when
Chrome restarts.

Bug:  635699 
Change-Id: I66316070bb90f9a11b7e6fa40b96ad2a2605d16a
Reviewed-on: https://chromium-review.googlesource.com/544640
Commit-Queue: Bret Sepulveda <bsep@chromium.org>
Reviewed-by: Peter Kasting <pkasting@chromium.org>
Cr-Commit-Position: refs/heads/master@{#482160}
[modify] https://crrev.com/fc4b39cbaf5823aafad88ef0b80c5f7eaf614dc8/chrome/browser/ui/views/profiles/avatar_button.cc
[modify] https://crrev.com/fc4b39cbaf5823aafad88ef0b80c5f7eaf614dc8/chrome/browser/ui/views/profiles/avatar_button.h

I would find that 59.0.3071.115 installer and uninstall v60 and click on the v59 offline installer and you see that the button is now Win8

I am going to disable updates!!!

The current avatar button is being replaced by a toolbar button, so this is obsolete.