Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Designing the search experience small


Published on

Presented by Tyler Tate, Cofounder, TwigKit

Search is not just a box and ten blue links. Search is a journey: an exploration where what we encounter along the way changes what we seek. But in order to guide people along this journey, we must understand both the art and science of search.In this talk Tyler Tate, cofounder of TwigKit and coauthor of the new book Designing the Search Experience, weaves together the theories of information seeking with the practice of user interface design, providing a comprehensive guide to designing search.Pulling from a wealth of research conducted over the last 30 years, Tyler begins by establishing a framework of search and discovery. He outlines cognitive attributes of users—including their level of expertise, cognitive style, and learning style; describes models of information seeking and how they've been shaped by theories such as information foraging and sensemaking; and reviews the role that task, physical, social, and environmental context plays in the search process.

Tyler then moves from theory to practice, drawing on his experience of designing 50+ search user interfaces to provide practical guidance for common search requirements. He describes best practices and demonstrates reams of examples for everything from entering the query (including the search box, as-you-type suggestions, advanced search, and non-textual input), to the layout of search results (such as lists, grids, maps, augmented reality, and voice), to result manipulation (e.g. pagination and sorting) and, last but not least, the ins-and-outs of faceted navigation. Through it all, Tyler also addresses mobile interface design and how responsive design techniques can be used to achieve cross-platform search.This intensive talk will enable you to create better search experiences by equipping you with a well-rounded understanding of the theories of information seeking, and providing you with a sweeping survey of search user interface best practices.

Published in: Education, Technology
  • Be the first to comment

Designing the search experience small

  1. 1. Designing theSearch ExperienceBY TYL ER TATE
  2. 2. 1. Key concepts2. Design solutions
  3. 3. Key Concepts1
  4. 4. 1. User expertise2. Information needs3. Stages of information seeking4. Context
  5. 5. Domain expertDomain novice
  6. 6. Technical novice Technical expert
  7. 7. Domain expertTechnical noviceDomain expertTechnical expertDomain noviceTechnical noviceDomain noviceTechnical expert
  8. 8. Domain expertTechnical noviceDomain expertTechnical expertDomain noviceTechnical noviceDomain noviceTechnical expert
  9. 9. ❖ How familiar are your users with your particular subjectmatter?❖ Is there a big gap in subject-matter expertise amongyour users?❖ How tech-savvy are your users?❖ Is there a big gap in their technical expertise?
  10. 10. Casual Lookup Learn Investigate
  11. 11. Informational Geographic Personal Info Transactional
  12. 12. SearchMotiveSearch Type
  13. 13. Casual Lookup Learn InvestigateInfoGeographicPersonalInfoTransactionPriceComparisonActing onNotificationsOnlineShoppingProductMonitoringTriviaWindowShoppingInformationGatheringResearchDirectionsFriendCheck-insLocal Pointsof InterestTravelPlanningCheckingCalendarCheckingMessagesSituationAnalysisLifestylePlanning
  14. 14. ❖ What motivates people to use your searchapplication?❖ Do they want to quickly lookup a simple fact, or arethey more interesting in digging deep? Or do theyjust want to kill time?❖ What types of searches do your users want toperform?❖ Does your current search application effectivelyfacilitate the user’s search motive and type?
  15. 15. Initiation
  16. 16. Initiation Selection
  17. 17. Initiation Selection Exploration
  18. 18. Initiation Selection Exploration Formulation
  19. 19. Initiation Selection Exploration Formulation Collection
  20. 20. Initiation Selection Exploration Formulation Collection Action
  21. 21. Initiation Selection Exploration Formulation Collection Action
  22. 22. ❖ At what phases of the information seeking processdo users want you use your search application?❖ What stages of the information seeking process doesyour search application currently facilitate?❖ Is there more you could do to engage users earlier inthe process?
  23. 23. TaskPhysicalPersonalSocialEnviron
  24. 24. Design Solutions2
  25. 25. 1. Entering the query2. Displaying results3. Faceted navigation
  26. 26. Entering the query
  27. 27. SortSearch...In the navigationbar
  28. 28. SortSearch...In a secondarytoolbar
  29. 29. SortSearch...Via a pull-to-reveal gesture
  30. 30. SortSearch...Via a pull-to-reveal gesture
  31. 31. SortSearch...Via a pull-to-reveal gesture
  32. 32. SortSearch...Via a pull-to-reveal gesture
  33. 33. Location
  34. 34. Audio
  35. 35. Visual
  36. 36. Drawing
  37. 37. Autocomplete
  38. 38. Autocomplete
  39. 39. Autosuggest
  40. 40. Autosuggest
  41. 41. Instant results
  42. 42. Instant results
  43. 43. Autocomplete, autosuggest, and instant results
  44. 44. Displaying results
  45. 45. List
  46. 46. Grid
  47. 47. Map
  48. 48. AugmentedReality
  49. 49. Segmentedcontrol in atoolbarList MapMap ImagesSearch...
  50. 50. Segmentedcontrolcentered in thenavigation barList MapMap Images
  51. 51. Single button inthe navigationbarSearch... Map
  52. 52. Faceted navigation
  53. 53. Vertical
  54. 54. Horizontal
  55. 55. Hybrid
  56. 56. Closed by default
  57. 57. Open by default
  58. 58. Hybrid
  59. 59. Standard links
  60. 60. Checkboxes
  61. 61. Custom controls (sliders)
  62. 62. Custom controls (color picker)
  63. 63. Standard links
  64. 64. Instant update
  65. 65. Instant update
  66. 66. Two-stage multi-facet selection
  67. 67. Two-stage single-facet selection
  68. 68. Inline breadcrumbs
  69. 69. Vertical breadbox
  70. 70. Horizontal breadcrumbs
  71. 71. Inline controls
  72. 72. Inline controls
  73. 73. Best Match Price DateBest Match Price DateNew Refurb. Used BrokenRefineSort byNarrow byCategory AcousticSellerPriceBuying FormatsLocationDedicatedrefinementscreen
  74. 74. Dedicated refinement screens
  75. 75. Best Match Price DateRefineGuitarButton in thenavigation bar
  76. 76. Best Match Price DateRefineGuitarBest Match Price DateBest Match Price DateBest Match Price DateNew Refurb. Used BrokenRefineSort byNarrow byPriceRefineSearch...Button in thenavigation bar
  77. 77. Best Match Price DateRefineSearch...Best Match Price DateBest Match Price DateNew Refurb. Used BrokenRefineSort byNarrow byCategory AcousticSellerPriceBuying FormatsLocationDoneButton in thenavigation bar
  78. 78. Button in the navigation bar
  79. 79. Gesture
  80. 80. Best Match Price DateRefineUsed BrokenAcousticGesture
  81. 81. Best Match Price DateNew Refurb. Used BrokenNarrow byCategory AcousticSellerPriceBuying FormatsRefineGesture
  82. 82. Button or gesture
  83. 83. Button and popover
  84. 84. Designing theSearch ExperienceBY TYL ER TATE