1011397 - [Australis] [UX] Apply doorhanger styling to search engine dropdown

Status: RESOLVED FIXED

(Firefox :: Theme, defect)

Description

[Peter Retzer (:pretzer)]

Attachment: Mockup

It would be nice if the dropdown for selecting the engine in the search bar would be styled like the rest of the doorhangers/menus in Australis. Currently it looks rather out of place (at least on Win7).
I created a mockup of how this could look like, see the attachment.

Comment 1

[Peter Retzer (:pretzer)]

Zhenshuo, since you have worked on the similar bug 978459 recently, do you have any comment on this from a UX perspective?

Comment 2

[Zhenshuo Fang (:fang) - Firefox UX Team]

(In reply to Peter Retzer (:pretzer) from comment #1)
> Zhenshuo, since you have worked on the similar bug 978459 recently, do you
> have any comment on this from a UX perspective?

Yes this seems like a good idea. In terms of the mockup, I like that it uses the grey box to show the "Manage Search Engines" action. We should probably not use the doorhanger panel with the arrow, and the check mark should not replace the logo of the search engine. But other than that it seems good to me.

What I'll do is I'll put this into the Firefox desktop backlog so that people can pick it up, finalize the design and start building it.

Comment 3

[Tim Nguyen :ntim]

It'd be even better if all context menus and menus were styled that way in Firefox (without the arrow of course).

Comment 4

[Matthew N. [:MattN]]

Right, what popup menus shouldn't have the new styling? Are there any platform integration or a11y issues with implementing this or were those all resolved with the existing usage of the style in Australis.

Comment 5

[Dão Gottwald [:dao]]

(In reply to Matthew N. [:MattN] from comment #4)
> Right, what popup menus shouldn't have the new styling? Are there any
> platform integration or a11y issues with implementing this or were those all
> resolved with the existing usage of the style in Australis.

Certainly platform integration concerns. What may be acceptable in one context may feel more awkward in other contexts. For instance, I don't think we want to dump the native style for context menus or menus spawned from the menu bar.

Comment 6

[Tim Nguyen :ntim]

Chrome builds it's own interface layer so we might want to try this out on an experimental branch (UX ?) then get user feedback. But I agree that Comment 5 is a concern.

Comment 7

[Zhenshuo Fang (:fang) - Firefox UX Team]

Attachment: Mockup

For OS X, the only change is applying the grey button style to the "Manage Search Engine..."

For Windows, the design also uses a check mark instead of bold the current search engine, for consistency.

Comment 8

[Dão Gottwald [:dao]]

(In reply to Zhenshuo Fang (:fang) - Firefox UX Team from comment #7)
> For Windows, the design also uses a check mark instead of bold the current
> search engine, for consistency.

Consistency with what? With OS X where checkmark + icon are native behavior? This looks rather alien on Windows. Can we please either stick with bold or let the checkmark replace the icon on Windows?

Comment 9

[Tim Nguyen :ntim]

For the sidebar widget, we replace the icon with the checkmark on Windows. And display the checkmark next to the icon for OSX.

Comment 10

[Tim Nguyen :ntim]

(In reply to Zhenshuo Fang (:fang) - Firefox UX Team from comment #7)
> Created attachment 8435174 [details]
> Mockup
> 
> For OS X, the only change is applying the grey button style to the "Manage
> Search Engine..."
Btw, with OSX Yosemite coming out, the menu transparent background is not gonna be consistent anymore.

Comment 11

[Zhenshuo Fang (:fang) - Firefox UX Team]

Attachment: Mockup

Seems like check marks conflict with platform convention on Windows, even though I think it is more clear and obvious than bold text. But let's stick to bold text instead of changing the logo of current search engine to a check mark.

Comment 12

[(mostly gone) XtC4UaLL [:xtc4uall]]

Did you consider the search provider "autodiscovery" menu item ("Add $Provider_Name$") embedded within two separators?
Can be seen e.g. on https://bugzilla.mozilla.org/

Comment 13

[Zhenshuo Fang (:fang) - Firefox UX Team]

(In reply to XtC4UaLL [:xtc4uall] from comment #12)
> Did you consider the search provider "autodiscovery" menu item ("Add
> $Provider_Name$") embedded within two separators?
> Can be seen e.g. on https://bugzilla.mozilla.org/

yes, it should stay the same.