Search

Search in Firefox 3

Firefox 2 Search Advancements

We made a number of changes to the Search chrome in Firefox 2, largely oriented around three key objectives:

1. Expose the ability to change Search Engines
2. Increase OS native feel of the Search chrome (e.g.: rounded corners on Mac OS)
3. Provide notification mechanism for detection of new Search Engines

Goals for Firefox 3

The improvements made in Firefox 2 have been very well received by both reviewers and users, but we feel that there are still some areas where the UI can be improved for Firefox 3. As part of the Firefox Summit 2006, we convened a quick session to both identify those challenges and to propose solutions. Two use cases came out of that conversation which are both important to implement (labeled as P1 for the purposes of this document, though not necessarily within the scope of Firefox 3):

• P1) One Time Use: Joe is working on a research paper on Argentina and has been using Google, his default search engine, to find some basic information. He needs some information on Argentina's history, which he knows he can find in Wikipedia, so he wants to do a search for argentina using Wikipedia in the Search Bar. In Firefox 2, Joe would have to select Wikipedia from the Search Engine dropdown, enter his search term and hit return, then switch the Search Engine dropdown back to Google.
• P1) Transient Use: Sue is browsing the Radiant Core Blog and wants to do a search for the term mozilla to learn more about our work on Firefox. Although she could use the search field on our Blog page, she prefers to use the Search Bar and notices the blue glow effect, which notifies her of the availability of a new Search Engine. In Firefox 2, Sue would have to open the Search Engine dropdown, select "Add Radiant Core Blog", enter her search term, then switch the Search Engine dropdown back to Google.

We also identified issues with the current implementation or new features we'd like to add, which are labeled as P2:

• P2) Extend Glow: anecdotal evidence suggests that the blue glow effect notification for Search Engines is not providing sufficient guidance to users. Many users are opening the menu but are confused by what the glow means as it isn't tied to any item within the menu. We would like to see the glow applied to the "Add..." item, either to the full item or just to the favicon.
• P2) Rich Results: Myk has developed a quick example of a search that returns rich results when available - his example search for firefox tinderbox returns a "balloon help" like bubble with an abbreviated version of the Tinderbox page for Firefox.

Rejected Concepts

We went through a number of possiblities as suggested in mozilla.dev.apps:

• site-specific search using our search box
• picking an alternate search engine for a particular search

in Bug 339735: Improve UI for adding search engines detected from <link rel...>, but rejected them for the reasons noted below.

Provider Tabs

Tabs positioned above the Search Field for each of the engines when the Search Field has focus:

  [G][Y][W][I][A]
 .   ......................
([G] weather             O.)
 '-------------------------'

Rejected due to concerns over screen real estate. We only be able to show a small number of tabs in the width of the Search Field, and would need vertical space above the Field as well. The Transient use case was difficult to accommodate as we would need to add tabs for new engines thereby taking up more space.

Provider Buttons

Giving users the ability to add additional Search Buttons to the Search Field so that they can click on the button for the Search Engine they want to run the search with:

 ..........................
( weather        [G][W][Y] )
 '-------------------------'

This idea showed promise, but we were concerned about the discoverability of needing to add buttons to the Search Field and about what the interface for doing that would look like. This also didn't address the Transient use case.

Default Search in Preferences

Leaving the Search Bar as is but changing the functionality of the Search Provider dropdown from setting the 'default' Provider to setting a one time use and moving the 'default' setting into Preferences:

 ..........................
([G] weather             O.)
 '-------------------------'

We were concerned about moving one of the settings related to Search into Preferences and weren't sure that users would understand the distinction between default and One Time use.

The Plan (So Far)

Which brings us to the plan so far! The idea is largely based around leavin the look and feel of the Seach Bar as per Firefox 2 to build on the familiar base we have now established.

History/Suggestion Box

The new functionality, which we think addresses all of the P1 and P2 items, will be built into the current Search History/Suggestion box:

        ..........................
1)     ([G] weather             O.)
        '-------------------------'
2)      | Weather in Mountain... >|
        |----------------- history|
3)      | weather in toronto     >|
        | weather in turino      >|
        | weather underground    >|
        |------------- suggestions|
4)      | weather network        >|
        | weather underground    >|
        |----------------- engines|
5)      | [W] Use Wikipedia    /W |
        | [i] Use IMDB         /I |
        | [Y] Use Yahoo!       /Y |
        | [F] Use Food Network /F |
        | [F] Use Radiant C... /R |
        | More search engines    >|
        '-------------------------'

1) The Search Bar remains unchanged from Firefox 2.

2) Rich results appear at the top of the list. Selecting with the mouse or keyboard (select then right arrow) opens a panel to the right of the Suggestion box with the rich results in it. See Submenus, below, for more details.

3) History appears in the next section, unchanged from Firefox 2.

4) If the currently selected Search Provider offers suggestions, they appear in the third section.

5) The final section lists the top 5 Search Providers from the user's list, in the order they have ordered them in using the Manage Search Engines dialog, with favicon, "Use " + name, and a shortcut key (note: this will require adding a shortcut key field to each Engine in the Manage dialog). Hitting / and the shortcut key will run the search with that engine (we're suggesting re-use of the / key from Quick Find, though it may prove onerous when this is implemented and we have a chance to try it out).

Submenus

'Submenus' from each section of the History/Suggestion box will serve slighly different purposes, but all be accessible by either mouse (click on the 'parent' item) or by keyboard (down-arrow to the parent item, right-arrow to open 'submenu'.

        ..........................
       ([G] weather             O.)
        '-------------------------'
1)      | Weather in Mountain... >|
        |----------------- history|
2)      | weather in toronto     >|
        | weather in turino      >|----------------------.
        | weather underground    >| CNN Weather: Turino  |
        |------------- suggestions| low of 54, high ..   | 
3)      | weather network        >| ---------------------|
        | weather underground    >| Weather.com for      |
        |----------------- engines| Turino: low of 34,.. |
        | [W] Use Wikipedia    /W |'---------------------' 
        | [i] Use IMDB         /I |
        | [Y] Use Yahoo!       /Y |
        | [F] Use Food Network /F |
        | [F] Use Radiant C... /R |
4)      | More search engines    >|
        '-------------------------'

1) Rich results are returned in the submenu, so opening this item will actually show a container for the "Weather in Mountain..." results. Myk: can you provide more details here?

2) Team: thoughts on what this does? It looks like, from our mockup, we intended for the Suggestions and History sections to execute the search and pull back the results, interpreted and displayed in the submenu. Is that right?

4) The submenu from "More search engines will give users access to the rest of the engines in their list, displayed in the same format as the engines on the main list. This item should only appear if there are more engines than fit in the five on the main list. Mockup:

        ..........................
       ([G] weather             O.)
        '-------------------------'
        | Weather in Mountain... >|
        |----------------- history|
        | weather in toronto     >|
        | weather in turino      >|
        | weather underground    >|
        |------------- suggestions|
        | weather network        >|
        | weather underground    >|
        |----------------- engines|
        | [W] Use Wikipedia    /W |
        | [i] Use IMDB         /I |
        | [Y] Use Yahoo!       /Y |
        | [F] Use Food Network /F |
        | [F] Use Radiant C... /R |
        | More search engines    >|-------------------------.
        '-------------------------| [W] Use Version T... /V |
                                  | [M] Use MSN Search   /M |
                                  '-------------------------'

Questions

There were a few unanswered questions from our session:

1. Keyword Shortcuts: the concept of enabling users to enter a keyword shortcut for different Search Engines was proposed in m.d.a, but not discussed in our conversation. We could extend our proposed design to allow users to enter "/x" in the Location or Search Bars to search using that engine. For example:

/W mozilla

in either Bar would do a Wikipedia search based on the mockups above.

1. Site Search: the concept of using the Search Bar to do a search on the current site (using the site's own search) or a find on the current page was also raised in m.d.a. Sites already have the ability to integrate their site search by writing an OpenSearch plugin, but Find on the page could be added as an 'engine':

        ..........................
       ([G] weather             O.)
        '-------------------------'
        | Weather in Mountain... >|
        |----------------- history|
        | weather in toronto     >|
        | weather in turino      >|
        | weather underground    >|
        |------------- suggestions|
        | weather network        >|
        | weather underground    >|
        |----------------- engines|
        | [W] Use Wikipedia    /W |
        | [i] Use IMDB         /I |
        | [Y] Use Yahoo!       /Y |
        | [F] Use Food Network /F |
        | [F] Use Radiant C... /R |
        | [0.] Find on page    // |
        | More search engines    >|
        '-------------------------'

which could then bring up the Find bar at the bottom of the window, pre-populate the Search Term, and find the first instance.

1. Setting/Changing default engine: If we believe that the common case is a single, long-term, default search with a lot of "one-off" searches, then we could consider removing the search engine default switching menu in favor of a "manage search engines" at the bottom of the search popup, or other alternative methods.

1. Multiple suggests: Should we expose suggests for more than one engine if available? I think we said no, but bringing it up just in case.