Search and Filter Interface Round Up - Userability Marathon 2009 - Amy Cueva

Post on 07-Apr-2017

2 views 0 download

Transcript of Search and Filter Interface Round Up - Userability Marathon 2009 - Amy Cueva

Prepared by:Amy Cueva – Founder, Chief Experience Officer

October 19, 2009

Search & Filter Interface Round UpEXAMPLES & BEST PRACTICES

Mad*Pow Fact Sheet

2

Experience Design Studio:Product DesignInteraction Design Contextual InquiryEthnographic ResearchTask Flow AnalysisUsability Testing Information ArchitectureVisual DesignPrototypingInteractive Media E-business StrategyMarket Research Development

Founded:2000 by Amy Cueva and Will Powley

Headquarters:Historic Portsmouth, NH

Staff:28 EmployeesOfficersDirectors DesignersCreative TechnologistsStrategistsSalespeopleAdministrators

Mad*Pow Clients

3

4

Search & Filter: Topics

5

Types of Searches

Key Considerations

Search Initiation and Navigation

Results Presentation

Relevancy, Personalization and Taking Action

Questions?

Types of Searches

6

How do people search?Search EnginesEmbedded Site SearchE-Commerce SearchIntranet/Local SearchOnline, mobile, desktop applications, kiosk, phone interfaces, voice interfaces, asking a live person

What are they looking for?A phone numberA sweaterA plane ticketA documentA songA personAny piece of information

Types of Searches

7

I want to…Find a specific piece of information: There is one answer.A zip/postal code, the temperature in a location, a specific personFind and compare pieces of information: There is more than one answer.Movie times, a type of person, restaurants, books on a topicGain a level of understanding, do research and make a decision: The answer depends on the person doing the search.Where should I go on vacation? What do these symptoms mean? What is the best…

When designing a search interface, consider:

8

Who is visiting? What do they need? What makes audience members different? Are there

any important characteristics about them to consider? Have they been here before? What have they done? Do

we know anything about them? Can that be used to make the results more relevant?

How did they get here? What lead up to this interaction? What is driving them?

What are they looking for? How will they expect to find it? (Search Terms)? Where will they want to look?

What do they want to see? What content or functionality would be most useful relevant to them? Will they need any related information?

When designing a search interface, consider:

9

Who is visiting? What do they need? How will they know when they’ve found what they

are looking for? How will they compare results? What are their decision making attributes? What’s important/most relevant to them?

How will they want to interact? What would the ideal interaction be? Will they sort, refine results, zoom in/out, navigate topically, compare, “pogo-stick” (J Spool), save, favorite, rate, comment, share, email, print?

How will they use this information? What will they need to do with it?

What will they do after? How can that be supported?Will they be back again? Will they need the information

from this search?Would they want search results like this on a regular basis?

What can be done? What will YOU do?

10

What can be done to understand the visitor? Search logs, site stats, analyticsSite survey/customer surveyUser research: User interviews, contextual inquiry,

observationUsability testing: before, after, and during

How early can you do these things? How often? Can they be part of an ongoing process?

What can be done? What will YOU do?

11

Making it happen…What is it? What are the priorities? How do you determine

priorities?What should be done in the future? What can be done right now?What can be done with the technology? What can’t?Who are you working with? How can you collaborate?Is your search effective? How will you measure success? How will search relevancy be monitored and improved on

a regular basis?

Interface & Interaction Design Checklist:

12

Home (pre-search): What will be shown?Most recent searches? Most recently clicked through on? Most popular? Recommended searches?

Interface & Interaction Checklist:

13

Search Box: Placement, priority, design, labelingFocus, return, tabbingPre-population, Type ahead, spell check, interactivity, related searches“Codified” searches

Search Terms: What terms should be anticipated? Will there be a spell check/did you mean feature?

Interface & Interaction Checklist:

14

Display of Results:What content/media will be displayed? Will there be content available on hover? Will the content be expandable/collapsible? Will related content be shown? Can a click through be avoided by showing the right

information in the results? How will the results be organized? How will the results be prioritized? How will they be filtered and sorted? Will topical navigation or faceted navigation be

available?

Interface & Interaction Checklist:

15

Manipulation of Results/Interaction with Results: Sort, filter, zoom in/out, navigate Organize, Drag & drop, Take action, save, share, email printRate, comment, contribute, suggestShow similar/more like this, removeBrowse, hover, click through/viewHow many results per page, paginationHow will the content load/flow in?

Familiar Search Interfaces

16

Newer Search Interfaces

17

Newer Search Interfaces

18

Newer Search Interfaces: Aggregators/Federated Search

19

Aggregators/Federated Search

20

Peek-a-boo Search

21

Type Ahead Search

22

Advanced Search

23

Faceted Navigation & Filters

24

Faceted Navigation & Filters

25

Faceted Navigation & Filters

26

Faceted Navigation & Filters

27

Pagination

28

“Zoom In” and “Zoom Out”

29

Information Visualization

30

Information Visualization

31

Information Visualization

32

Information Visualization

33

Information Visualization

34

Information Visualization

35

Results > Detail Browse

36

Results > Detail Browse

37

Results > Detail Browse

38

Results > Detail Browse

39

Results > Detail Browse

40

Results Presentation: Granularity Levels

41

Results Presentation: Federated Search Results

42

Results Presentation: Federated Search Results

43

Results Presentation: Federated Search Results

44

Results Presentation: Federated Search Results

45

Results Presentation: Rich Results Presentation

46

Results Presentation: Rich Results Presentation

47

Results Presentation: Presentation Options

48

Relevancy and Taking Action: Relationships & Nearness

49

Relevancy and Taking Action: Relationships & Nearness

50

Relevancy and Taking Action: Community Tagging, Rating, and Ranking

51

Relevancy and Taking Action: Implicit vs. Explicit Personalization

52

Relevancy and Taking Action: Implicit vs. Explicit Personalization

53

Relevancy and Taking Action: Individual Manipulation of Results

54

Relevancy and Taking Action: Individual Manipulation of Results

55

Relevancy and Taking Action: Individual Manipulation of Results

56

Relevancy and Taking Action: Saving and Sharing Results

57

Relevancy and Taking Action: Generating Results Feeds

58

Questions?

59