search is the ui

57
Search is the new UI OpenSource Connections @DanielBeach

Upload: danielbeach

Post on 10-Feb-2017

2.164 views

Category:

Technology


0 download

TRANSCRIPT

Page 1: Search is the UI

Search is the new UI

OpenSource Connections

@DanielBeach

Page 2: Search is the UI

@ DanielBeach OpenSource Connections

‣ Search strategist @ OpenSource Connections

‣ Elasticsearch + AngularJS video course

‣ Spyglass search UI‣ New dad

Page 3: Search is the UI

“Search results”google.com

Page 4: Search is the UI

Powered by Search

‣ Search results‣ Data visualization dashboards ‣ Recommendation engines‣ Anomaly detection

Page 5: Search is the UI

Not your typical search interface.parse.ly

Page 6: Search is the UI

Search Misconceptions

‣ Search only powers “search pages”

‣ Search is best left to Google‣ Search is only useful for

full-text documents

Page 7: Search is the UI

Movie Datatmdb.com

Page 8: Search is the UI

Typical Search Inputs

‣ Text entered by a user‣ Selected filters

Page 9: Search is the UI

Passive Search Inputs

‣ Current time & events‣ The user’s location‣ How recently was the content

published?‣ The popularity of an item

Page 10: Search is the UI

Time Datagoogle.com

Page 11: Search is the UI

Talk Overview

‣ Principles of good search‣ How search engines work‣ Front-end search patterns

Page 12: Search is the UI

GENERAL SEARCH PRINCIPLES

Page 13: Search is the UI

Search is an opportunity to have a conversation.

‣ Users are telling you what they expect to find on your site

‣ Search is an opportunity to learn about your users / customers

Page 14: Search is the UI

Natural searchessound hound

Page 15: Search is the UI

Principles of Search Design

‣ Values search‣ Listens to your users‣ Shows relevant content‣ Gets out of their way

Page 16: Search is the UI

Search is about Clarity

‣ The relevancy of the results is more important than the design of the results.

Page 17: Search is the UI

This is what search should be.amazon.com

Page 18: Search is the UI

Only Show what is Important

‣ If you have twenty average results, but one result is statistically more important, don’t show the others.

Page 19: Search is the UI

Grouping by categorycanopy.co

Page 20: Search is the UI

Accommodate Multiple Types of Searching

‣ Informational users are interested in the breadth of your data

‣ Navigational users want to get somewhere fast

Page 21: Search is the UI

Highlighting the importantlonelyplanet.com

Page 22: Search is the UI

Bad Search

‣ Invalid results‣ No results ‣ Confusing result hierarchy‣ Visually messy results‣ No clear input or submit

Page 23: Search is the UI

Good Search Design

‣ Showing relevant data to users

‣ Only shows useful / actionable results

‣ Visually clean results‣ Differentiated results‣ Recognizable input and submit

Page 24: Search is the UI

HOW SEARCH ENGINES WORK

Page 25: Search is the UI

How humans see text

–Arthur Clark

Page 26: Search is the UI

How a search engine sees textThis is called text analysis, and it happens at indexing time.

Page 27: Search is the UI

Indexed terms(simplification)

Page 28: Search is the UI

Query AnalysisA compatible analysis chain must be used for the query string as the indexed content in

order for terms to match.

Page 29: Search is the UI

TERM MEANING

TokenizationSplitting text into indexable pieces, called tokens. A word is often an example of a token.

StemmingCollapsing words to their root (interpretation, interpreting --> interpret)

Inverted index An index of tokens. Maps tokens to document position

Term frequency The number of times a token occurs in a document

Inverse document frequency

Tokens that appear in fewer documents are calculated to be more important (simplified)

Page 30: Search is the UI

Document Scoring

‣ Score based on number of matches in a document, as compared to the popularity of that term across all documents.

Page 31: Search is the UI

Types of Boosts

‣ Field boosts ‣ Text matching (title^5

description)‣ Function scores‣ Boost newer content‣ Multiply by % of popularity‣ …

Page 32: Search is the UI

Minimum Match

‣ How many of the query terms have to match in order for a document to be returned?

‣ Precision vs recall

Page 33: Search is the UI

FRONT-END SEARCH PATTERNS

Page 34: Search is the UI

Search patterns

Page 35: Search is the UI

Search request

{ "query": { "multi_match": { “fields": ["title^5", "description”], “query": “descender”, "minimum_should_match": "2<-1 5<70%" } } }

Page 36: Search is the UI

Response{ "took": 47, "timed_out": false, "hits": { "total": 2, "max_score": 2.17284, "hits": [ { "_index": "catalog", "_type": "comics", "_id": "84", "_score": 2.17284, "_source": { "title": "Descender", "description": "One young robot’s struggle to stay alive in a universe where all androids have been outlawed and bounty hunters lurk on every planet." ...

Page 37: Search is the UI

Aggregations

Page 38: Search is the UI

{ query: query, aggs: { "comic formats": { terms: {field: "format"} } } }

Aggregations Request

Page 39: Search is the UI

Aggregations Response{ "hits":{ "total":2, "hits":[ ... ], "aggregations":{ “comic types":{ "buckets":[{ "key":"Trades", "doc_count":63}, { "key":"Graphic Novels", "doc_count":35 }, { "key":"Compilations", "doc_count":9 }]}}}

Page 40: Search is the UI

Filtering{ filtered: { query: query, filter: { bool: { must: [ {term: {"illustrator": "Dustin Nguyen"}}; ] } }}}

Page 41: Search is the UI

Search categoriesetsy.com

Page 42: Search is the UI

Showing relative document countsassignment.uspto.gov

Page 43: Search is the UI

Autocomplete

Page 44: Search is the UI

Autocomplete Suggestions

‣ Spelling corrections‣ More popular phrases

Page 45: Search is the UI

Autocomplete Request{ "query": { "simple_query_string": { "fields": ['title'], "query": baseTerms + '(' + lastTerm + '|' + lastTerm + '*)', "default_operator": "and" } }, "size": 3, "_source": ["title"] }

Page 46: Search is the UI

Autocomplete – disambiguationgoogle.com

Page 47: Search is the UI

Suggestion Request{ "query": query, "suggest": { "text": searchTerms, "phraseSuggestion": { "phrase": { "field": "title", "direct_generator": [{ "field": "title", "suggest_mode": "popular", "min_word_length": 3 }] }}}}

Page 48: Search is the UI

Highlighting

Page 49: Search is the UI

Highlighting

‣ Highlight search terms‣ Snippets for large blocks of

text

Page 50: Search is the UI

Highlighting Request{ query: query, highlight: { fields: { "title": {number_of_fragments: 0}, "detailed description": {number_of_fragments: 0} } } }

Page 51: Search is the UI

Highlighting Response{ "took":28, "hits":{ "total":2, "max_score":1.44856, "hits":[{ "_index":"catalog", "_type":"comics", "_id":"84", "_score":1.44856, "_source": { "title": "Descender" }, "highlight":{ "title":["<em>Descender</em>"]} } ]}}}

Page 52: Search is the UI

Result highlightinglibrary.oreilly.com

Page 53: Search is the UI

Load more

Page 54: Search is the UI

Loading More Results{ "query": {"match_all": {}}, "from": resultsPage * 10, "sort": "fieldName desc", }

Page 55: Search is the UI

Think outside the search box

‣ Search gives you extreme flexibility to return relevant content quickly, given a wide range of inputs

‣ Retrieval and ranking engine

Page 56: Search is the UI

@DanielBeachOpenSource Connections

Page 57: Search is the UI

Search is the new UI

OpenSource Connections

@DanielBeach