Search-dropdown Hybrid Box

Here’s an interesting interface element: a search and a drop-down menu in one. Search boxes now use dropdowns for live results and suggested searches but here it’s used as a basic navigation menu, combined with an ability to just type and search for what you want.

This is from Giraffe Restaurants website by Engage Interactive. Here’s what the box looks like when hovered over:

\""

And clicked:

\""

Additionally, it shows nearest locations to whatever result you choose or search for underneath:

\""

Great way to keep the interface simple and helpful.

author picture Written by Dmitry Fadeyev
Published on November 30, 2009