668339 - Design search suggestions UI

Status: RESOLVED FIXED

(addons.mozilla.org Graveyard :: Search, defect, P1)

Description

[Justin Scott [:fligtar]]

Please design the search suggestions UI for the new search box. Our original mock is in bug 546826.

The suggestions should be based on what the search results would normally return, e.g. when searching from a collections page we only show collections, but when searching from the homepage we show all add-ons.

We should include the add-on icon if it will load quickly enough and highlight the text the user has typed.

Please also include the category suggestions, e.g. if you type "tab" one of the suggestions should be going to the Tabs category, and if you type "thunderbird" one of the suggestions should be going to Thunderbird Add-ons.

Comment 1

[Chris Howse [:chowse]]

For the record, here was a proposal for Searchlight-style auto-completer I proposed during the redesign:

http://moz.howsehold.org/amo/refresh/v2/01.4_search.png

This might be easier to do if we have ElasticSearch at our disposal. But it can also be simplified to a single type of add-on if needed.

Comment 2

[Justin Scott [:fligtar]]

I'd like this UI to be as simple and not complicated as possible, so I think a lot of the organization in the 3 options there should be removed.

I think we should show the first results that would appear in the search results page, regardless of type. If the user wants to drill down they can complete the search and use the filters on that page.

Categories and application matches can still be a special style.

Comment 3

[Chris Howse [:chowse]]

Prototyped!

Sample:
http://chowse.github.com/amo-redux/
(start typing "video" in the search box)

Changeset:
https://github.com/chowse/amo-redux/commit/5218d61a3a6e9b271aea3d54ffa6044f6eba016f

Comment 4

[Justin Scott [:fligtar]]

Thanks chowseghost, this is swell!