The Community Of Over 578,000

Home ›› Business Value and ROI ›› 6 Key Questions to Guide International UX Research ›› small_16 ›› Designing Search: As-You-Type Suggestions

Designing Search: As-You-Type Suggestions

by Tony Russell-Rose
Share this post on
Share on twitter
Tweet
Share on linkedin
Share
Share on facebook
Post
Share on reddit
Share
Share on email
Email
Share on print
Print

Save

Effective search should subtly guide users in creating and reformulating queries. Use as-you-type suggestions (auto-complete, auto-suggest, and instant results) to help users save time, iterate on their searches, and get the results they want.

Have you ever tried the “I’m Feeling Lucky” button on Google? It’s meant to take you directly to the result you want, rather than return a list of results. It’s a simple idea, and when it works it seems like magic.

But most of the time we are not so lucky. We submit a query and review the results, only to find they’re not quite what we were looking for. Occasionally, we review a further page or two of results, but in most cases it’s quicker just to enter a new query and try again. In fact, this pattern of behaviour is so common that techniques have been developed specifically to help us along this part of our information journey. In particular, three versions of as-you-type suggestions— auto-complete, auto-suggest, and instant results—subtly guide us in creating and reformulating queries.

1. Auto-Complete

One of the key principles in human–computer interaction is recognition over recall: the notion that people are better at recognizing things they have previously experienced than they are at recalling them from memory. This explains why most of us can find our way around graphical operating systems such as Windows and OS/X, but when faced with a naked command line, we’re at a loss for words.

Auto-complete transforms a recall problem into one of recognition. As you type into the search box, it tries to predict your query based on the characters you have entered. Like a human interpreter mediating between two people speaking different languages, auto-complete facilitates the dialogue between the user and the search application. The UK’s National Rail website, for example, recalls the railway stations that match a handful of characters. The user needs only recognize the one he wants:

Auto-complete at the UK National Rail Enquiries website

Auto-complete at the UK National Rail Enquiries website

Auto-complete does its best to remain unobtrusive, so users can still enter a query in full if they choose. But selecting the completions saves time and keystrokes. In addition, they help users avoid spelling mistakes; if, for example, I can’t recall the exact spelling of “Aberystwyth,” no problem—I just need to know it when I see it. This type of interaction is invaluable in mobile contexts, when accurate typing on small, handheld keyboards is more difficult. On smartphones and tablets, auto-complete is applied to all manner of applications, from text messaging to email.

Auto-complete is used for SMS and email on the iPhone

Auto-complete is used for SMS and email on the iPhone

Auto-complete makes the most sense when the choices are based on a controlled vocabulary, i.e., a finite list of items such as a directory of names, locations, organizations, and so on. But what of situations where the choices are potentially unbounded, or where the user isn’t exactly sure what he’s looking for? In exploratory search and other complex information-seeking tasks there may be no such thing a single “right answer.” In this context, a different approach is needed.

2. Auto-Suggest

There’s a thin line between auto-complete and auto-suggest; both offer varying degrees of support for query creation and reformulation, and the terms are used somewhat interchangeably by many people. But if we were to draw a precise distinction, it could be this:

  • The purpose of auto-complete is to resolve a partial query, i.e., to search within a controlled vocabulary for items matching a given character string.
  • The purpose of auto-suggest is to search a virtually unbounded list for related keywords and phrases, which may or may not match the precise query string.

While auto-complete helps people get an idea out of their heads and into the search box, auto-suggest actually throws new ideas into the mix. In this respect, auto-suggest operates at a more conceptual level, offering choices where the relationship to the query may go beyond simple string-matching. Both techniques save keystrokes and help us avoid spelling mistakes, but auto-suggest can also help users construct a more useful query than they might otherwise have thought of on their own. Ebay, for example, provides a variety of different suggestions related to the query “guitar”:

Auto-suggest at eBay

Auto-suggest at eBay

Moreover, the same product categories that we saw earlier being used to provide scoped search can also be used to drive product suggestions. Home Depot, for example, provides a particularly extensive auto-suggest function consisting of product categories, buying guides, project guides and more. Not only do these suggestions facilitate known-item search, they also support exploratory search behavior, encouraging the user to discover new product ideas and specialist content. While the Home Depot example demonstrates what’s possible with auto-suggest, it’s worth noting that moving from a single to multiple lists of suggestions demands greater mental effort from users.

Auto-suggest supports known-item and exploratory search at Home Depot

Auto-suggest supports known-item and exploratory search at Home Depot

One unique asset that the major web search engines have at their disposal is access to vast quantities of user data, which they can mine to maximize the value of query suggestions. Google, for example, derives its suggestions both from the user’s individual search history and from the collective behaviour of many users. Yahoo! takes a slightly different approach, leveraging its extensive network of web properties and resources to provide an auto-suggest function that features a secondary panel containing answers and rich content:

Auto-suggest offers answers and rich content at Yahoo

Auto-suggest offers answers and rich content at Yahoo

A further technique to optimize the value of query suggestions is to display them in the context of recent searches. One approach, which Safari utilizes, is to simply present two adjacent groups: one for query suggestions and another for the browser’s search history.

Query suggestions are presented alongside recent searches in Safari

Query suggestions are presented alongside recent searches in Safari

3. Instant Results

Auto-complete and auto-suggest are both valuable techniques to help users conceive and articulate more effective queries. They differ in approach, but share the principle that as-you-type suggestions provide a shortcut from query to search results. But in some cases it is possible to go even further than this, to make auto-suggest offer actual results instead of just query reformulations. For example, if I type the characters “ip” into the search box at Apple.com, six items appear. However, if I select one of these, it bypasses the search results page entirely and takes me directly to a product-specific landing page. Rather than suggesting alternative queries, the search box provides instant results in the form of a set of matching “best bets” for products and resources:

Instant results at Apple.com

Instant results at Apple.com

A similar principle is in action in the search function of popular desktop operating systems. In Windows 7, for example, a keyword search invokes a panel of recommended results, grouped into popular categories. One can either select a result directly to open it, or choose the “See more results” option to open a regular search results page:

Instant results in Windows 7 desktop search

Instant results in Windows 7 desktop search

In desktop search and site search, the instant results experience can exploit the metadata of a managed collection to optimize the relevance of categories and results. In web search, by contrast, it is somewhat harder to pre-emptively match queries with results in this way. Nonetheless, Google provides its own type of instant results, which complement the auto-suggest function to provide a highly responsive search experience. Instead of presenting a static page of results after each query, Google Instant updates the search results in real time as each character is entered. If the user doesn’t see the results he wants, he can just keep typing and watch the results update.

Instant results when searching via Google

Instant results when searching via Google

As with auto-complete and auto-suggest, instant results can save us time and help avoid spelling mistakes. But more importantly, by providing immediate feedback on our query, instant results can facilitate a more interactive dialogue between user and search application. Of course, it may not be the complete solution for expert users wishing to explore and understand highly complex information spaces, but for known-item search and other information retrieval tasks, it provides a clear benefit.

Summary

Although most of us are familiar with Google’s iconic “I’m Feeling Lucky” button, few of us use it; we know that search problems of any complexity require an iterative approach, comprising the creation and reformulation of queries. As-you-type suggestions have become invaluable in this experience. Auto-complete is better suited for known-item search and simple information retrieval tasks. Auto-suggest works well for exploratory search and complex information seeking tasks. And instant results provide a direct channel from queries to answers.

Use auto-complete to:

  • Facilitate accurate and efficient data entry
  • Select from a finite list of names or symbols

Use auto-suggest to:

  • Facilitate novel query reformulations
  • Select from an open-ended list of terms or phrases
  • Encourage exploratory search (with a degree of complexity and mental effort that is appropriate to the task). Where appropriate, complement search suggestions with recent searches

Use instant results to:

  • Promote specific items or products

For further guidance on detailed interaction design for auto-complete and auto-suggest, see the Endeca UI Design Pattern Library (note that while this resource provides valuable guidance, it conflates the different use cases described above).

post authorTony Russell-Rose

Tony Russell-Rose,

I am currently director of UXLabs, a UX research and design consultancy specialising in complex search and information access applications. Before founding UXLabs I was Manager of User Experience at Endeca and editor of the Endeca UI Design Pattern Library, an online resource dedicated to best practice in the design of search and discovery experiences. Prior to this I was technical lead at Reuters, specialising in advanced user interfaces for information access and search. And before Reuters I was R&D group manager at Canon Research Centre Europe, where I led a team developing next generation information access products and services. Earlier professional experience includes a Royal Academy of Engineering fellowship at HP Labs working on speech UIs for mobile devices, and a Short-term Research Fellowship at BT Labs working on intelligent agents for information retrieval.

My academic qualifications include a PhD in human-computer interaction, an MSc in cognitive psychology and a first degree in engineering, majoring in human factors. I also hold the position of Honorary Visiting Fellow at the Centre for Interactive Systems Research, City University, London.

I am currently vice-chair of the BCS Information Retrieval group and chair of the IEHF Human-Computer Interaction group.

Share on twitter
Tweet
Share on linkedin
Share
Share on facebook
Post
Share on reddit
Share
Share on email
Email
Share on print
Print

Related Articles

The road to a good customer experience can be full of potholes. How do you navigate such a treacherous path? One key way is through product thinking.

What is product thinking and why does it matter?
  • Product thinking is key to shaping the best customer experience possible as it helps to identify problems and solve them.
  • By providing a holistic perspective on a product it differs from design thinking and reveals the real product value for customers.
  • Because of its strategic importance, every team member should hone product thinking skills. It’s more than a working framework, it’s a mindset, a culture of customer experience.
Share:What is product thinking and why does it matter?

“Holistic design” sounds like a new flashy trend that’s used without a real meaning behind it. However, the term was present long before UX design was born. Nowadays, when we use “product design” for digital products and “industrial design” for things, “holistic design” makes a comeback to UX design.

What Is Holistic Design? The Future of UX or a Buzzword?
  • To apply holistic design principles is to consider different facets of a product, stakeholders’ interests and the environment within which it functions.
  • Best practices of holistic design consist of involving stakeholders, being sustainable, creating an ecosystem, and, last but not least, going beyond digital.
  • When it comes to holistic design in UX, it’s essential to apply design thinking and reflect on the design system, make sure that solutions are inclusive and consistently invest in UX research.
Share:What Is Holistic Design? The Future of UX or a Buzzword?
Frame 1 Holistic Design

This website uses cookies to ensure you get the best experience on our website. Check our privacy policy and