designing the search experience by tyler tate : twigkit

121
Designing the Search Experience BY TYLER TATE

Upload: tyler-tate

Post on 21-May-2015

1.454 views

Category:

Documents


1 download

TRANSCRIPT

Page 1: Designing the search experience by tyler tate : twigkit

Designing theSearch ExperienceB Y T Y L E R TAT E

Page 2: Designing the search experience by tyler tate : twigkit
Page 3: Designing the search experience by tyler tate : twigkit
Page 4: Designing the search experience by tyler tate : twigkit
Page 5: Designing the search experience by tyler tate : twigkit

1. Key concepts

2. Design solutions

Page 6: Designing the search experience by tyler tate : twigkit

Key Concepts1

Page 7: Designing the search experience by tyler tate : twigkit

1. User expertise

2. Information needs

3. Stages of information seeking

4. Context

Page 8: Designing the search experience by tyler tate : twigkit
Page 9: Designing the search experience by tyler tate : twigkit
Page 10: Designing the search experience by tyler tate : twigkit
Page 11: Designing the search experience by tyler tate : twigkit
Page 12: Designing the search experience by tyler tate : twigkit
Page 13: Designing the search experience by tyler tate : twigkit

Domain expert

Domain novice

Page 14: Designing the search experience by tyler tate : twigkit

Technical novice Technical expert

Page 15: Designing the search experience by tyler tate : twigkit

Domain expertTechnical novice

Domain expertTechnical expert

Domain noviceTechnical novice

Domain noviceTechnical expert

Page 16: Designing the search experience by tyler tate : twigkit

Domain expertTechnical novice

Domain expertTechnical expert

Domain noviceTechnical novice

Domain noviceTechnical expert

http://boxesandarrows.com/novices-orienteer-experts-teleport/

Page 17: Designing the search experience by tyler tate : twigkit

❖ How familiar are your users with your particular subject matter?

❖ Is there a big gap in subject-matter expertise among your users?

❖ How tech-savvy are your users?

❖ Is there a big gap in their technical expertise?

Page 18: Designing the search experience by tyler tate : twigkit
Page 19: Designing the search experience by tyler tate : twigkit
Page 20: Designing the search experience by tyler tate : twigkit

Casual Lookup Learn Investigate

Page 21: Designing the search experience by tyler tate : twigkit

Informational Geographic Personal Info Transactional

Page 22: Designing the search experience by tyler tate : twigkit

SearchMotive

Search Type

Page 23: Designing the search experience by tyler tate : twigkit

Casual Lookup Learn Investigate

Info

Geographic

PersonalInfo

TransactionPrice

ComparisonActing on

NotificationsOnline

ShoppingProduct

Monitoring

TriviaWindow

ShoppingInformationGathering

Research

DirectionsFriend

Check-insLocal Points of Interest

Travel Planning

CheckingCalendar

CheckingMessages

Situation Analysis

Lifestyle Planning

http://tinyurl.com/InfoNeedMatrix

Page 24: Designing the search experience by tyler tate : twigkit

❖ What motivates people to use your search application?

❖ Do they want to quickly lookup a simple fact, or are they more interesting in digging deep? Or do they just want to kill time?

❖ What types of searches do your users want to perform?

❖ Does your current search application effectively facilitate the user’s search motive and type?

Page 25: Designing the search experience by tyler tate : twigkit
Page 26: Designing the search experience by tyler tate : twigkit
Page 27: Designing the search experience by tyler tate : twigkit

Initiation

Page 28: Designing the search experience by tyler tate : twigkit

Initiation Selection

Page 29: Designing the search experience by tyler tate : twigkit

Initiation Selection Exploration

Page 30: Designing the search experience by tyler tate : twigkit

Initiation Selection Exploration Formulation

Page 31: Designing the search experience by tyler tate : twigkit

Initiation Selection Exploration Formulation Collection

Page 32: Designing the search experience by tyler tate : twigkit

Initiation Selection Exploration Formulation Collection Action

Page 33: Designing the search experience by tyler tate : twigkit

Initiation Selection Exploration Formulation Collection Actionhttp://alistapart.com/article/the-ux-of-learning

Page 34: Designing the search experience by tyler tate : twigkit

❖ At what phases of the information seeking process do users want you use your search application?

❖ What stages of the information seeking process does your search application currently facilitate?

❖ Is there more you could do to engage users earlier in the process?

Page 35: Designing the search experience by tyler tate : twigkit
Page 36: Designing the search experience by tyler tate : twigkit
Page 37: Designing the search experience by tyler tate : twigkit
Page 38: Designing the search experience by tyler tate : twigkit

Task

Physical

PersonalSocial

Environ

Page 39: Designing the search experience by tyler tate : twigkit

Design Solutions2

Page 40: Designing the search experience by tyler tate : twigkit

1. Entering the query

2. Displaying results

3. Faceted navigation

Page 41: Designing the search experience by tyler tate : twigkit

Entering the query

Page 42: Designing the search experience by tyler tate : twigkit
Page 43: Designing the search experience by tyler tate : twigkit
Page 44: Designing the search experience by tyler tate : twigkit
Page 45: Designing the search experience by tyler tate : twigkit

SortSearch...In the navigation bar

Page 46: Designing the search experience by tyler tate : twigkit

Sort

Search...

In a secondary toolbar

Page 47: Designing the search experience by tyler tate : twigkit

SortSearch...Via a pull-to-reveal gesture

Page 48: Designing the search experience by tyler tate : twigkit

Sort

Search...Via a pull-to-reveal gesture

Page 49: Designing the search experience by tyler tate : twigkit

Sort

Search...

Via a pull-to-reveal gesture

Page 50: Designing the search experience by tyler tate : twigkit

Sort

Search...

Via a pull-to-reveal gesture

Page 51: Designing the search experience by tyler tate : twigkit

Location

Page 52: Designing the search experience by tyler tate : twigkit

Audio

Page 53: Designing the search experience by tyler tate : twigkit

Visual

Page 54: Designing the search experience by tyler tate : twigkit

Drawing

Page 55: Designing the search experience by tyler tate : twigkit
Page 56: Designing the search experience by tyler tate : twigkit

Autocomplete

Page 57: Designing the search experience by tyler tate : twigkit

Autocomplete

Page 58: Designing the search experience by tyler tate : twigkit

Autosuggest

Page 59: Designing the search experience by tyler tate : twigkit

Autosuggest

Page 60: Designing the search experience by tyler tate : twigkit

Instant results

Page 61: Designing the search experience by tyler tate : twigkit

Instant results

Page 62: Designing the search experience by tyler tate : twigkit

Autocomplete, autosuggest, and instant results

Page 63: Designing the search experience by tyler tate : twigkit

Displaying results

Page 64: Designing the search experience by tyler tate : twigkit

List

Page 65: Designing the search experience by tyler tate : twigkit

Grid

Page 66: Designing the search experience by tyler tate : twigkit

Map

Page 67: Designing the search experience by tyler tate : twigkit

Augmented Reality

Page 68: Designing the search experience by tyler tate : twigkit

Segmented control in a toolbar

List MapMap Images

Search...

Page 69: Designing the search experience by tyler tate : twigkit

Segmented control centered in the navigation bar

List MapMap Images

Page 70: Designing the search experience by tyler tate : twigkit

Single button in the navigation bar

Search... Map

Page 71: Designing the search experience by tyler tate : twigkit
Page 72: Designing the search experience by tyler tate : twigkit
Page 73: Designing the search experience by tyler tate : twigkit
Page 74: Designing the search experience by tyler tate : twigkit

Faceted navigation

Page 75: Designing the search experience by tyler tate : twigkit

Vertical

Page 76: Designing the search experience by tyler tate : twigkit

Horizontal

Page 77: Designing the search experience by tyler tate : twigkit

Hybrid

Page 78: Designing the search experience by tyler tate : twigkit

Closed by default

Page 79: Designing the search experience by tyler tate : twigkit

Open by default

Page 80: Designing the search experience by tyler tate : twigkit

Hybrid

Page 81: Designing the search experience by tyler tate : twigkit

Standard links

Page 82: Designing the search experience by tyler tate : twigkit

Checkboxes

Page 83: Designing the search experience by tyler tate : twigkit

Custom controls (sliders)

Page 84: Designing the search experience by tyler tate : twigkit

Custom controls (color picker)

Page 85: Designing the search experience by tyler tate : twigkit

Standard links

Page 86: Designing the search experience by tyler tate : twigkit

Instant update

Page 87: Designing the search experience by tyler tate : twigkit

Instant update

Page 88: Designing the search experience by tyler tate : twigkit

Two-stage multi-facet selection

Page 89: Designing the search experience by tyler tate : twigkit

Two-stage single-facet selection

Page 90: Designing the search experience by tyler tate : twigkit

Inline breadcrumbs

Page 91: Designing the search experience by tyler tate : twigkit

Vertical breadbox

Page 92: Designing the search experience by tyler tate : twigkit

Horizontal breadcrumbs

Page 93: Designing the search experience by tyler tate : twigkit

Inline controls

Page 94: Designing the search experience by tyler tate : twigkit

Inline controls

Page 95: Designing the search experience by tyler tate : twigkit

Best Match Price Date

Best Match Price Date

New Refurb. Used Broken

Refine

Sort by

Narrow by

Category Acoustic

Seller

Price

Buying Formats

Location

Dedicated refinement screen

Page 96: Designing the search experience by tyler tate : twigkit

Dedicated refinement screens

Page 97: Designing the search experience by tyler tate : twigkit

Best Match Price DateRefineGuitarButton in the navigation bar

Page 98: Designing the search experience by tyler tate : twigkit

Best Match Price DateRefineGuitarBest Match Price Date

Best Match Price Date

Best Match Price Date

New Refurb. Used Broken

Refine

Sort by

Narrow by

Price

RefineSearch...Button in the navigation bar

Page 99: Designing the search experience by tyler tate : twigkit

Best Match Price DateRefineSearch...Best Match Price Date

Best Match Price Date

New Refurb. Used Broken

Refine

Sort by

Narrow by

Category Acoustic

Seller

Price

Buying Formats

Location

DoneButton in the navigation bar

Page 100: Designing the search experience by tyler tate : twigkit

Button in the navigation bar

Page 101: Designing the search experience by tyler tate : twigkit

Gesture

Page 102: Designing the search experience by tyler tate : twigkit

Best Match Price DateRefine

Used Broken

Acoustic

Gesture

Page 103: Designing the search experience by tyler tate : twigkit

Best Match Price Date

New Refurb. Used Broken

Narrow by

Category Acoustic

Seller

Price

Buying Formats

RefineGesture

Page 104: Designing the search experience by tyler tate : twigkit

Button or gesture

Page 105: Designing the search experience by tyler tate : twigkit

Button and popover

Page 106: Designing the search experience by tyler tate : twigkit
Page 107: Designing the search experience by tyler tate : twigkit
Page 108: Designing the search experience by tyler tate : twigkit
Page 109: Designing the search experience by tyler tate : twigkit
Page 110: Designing the search experience by tyler tate : twigkit
Page 111: Designing the search experience by tyler tate : twigkit
Page 112: Designing the search experience by tyler tate : twigkit
Page 113: Designing the search experience by tyler tate : twigkit
Page 114: Designing the search experience by tyler tate : twigkit
Page 115: Designing the search experience by tyler tate : twigkit
Page 116: Designing the search experience by tyler tate : twigkit
Page 117: Designing the search experience by tyler tate : twigkit
Page 118: Designing the search experience by tyler tate : twigkit
Page 119: Designing the search experience by tyler tate : twigkit
Page 120: Designing the search experience by tyler tate : twigkit
Page 121: Designing the search experience by tyler tate : twigkit

Designing theSearch ExperienceB Y T Y L E R TAT E