Designing Mobile Search: A workshop for eBay Classifieds Group

1,040 views

Published on

Published in: Design, Technology, Sports
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,040
On SlideShare
0
From Embeds
0
Number of Embeds
4
Actions
Shares
0
Downloads
14
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Designing Mobile Search: A workshop for eBay Classifieds Group

  1. 1. Designing Mobile Search by @TylerTate
  2. 2. 800 million Desktop PCs Smartphones Laptop PCs Tablets 2005 2006 2007 2008 Forecast 2009 2010 2011 2012 2013 “Beyond the PC” by The Economist, Oct 8th 2011. Sources: Cisco, Gartner, Informa Telecoms & Media, KPCB, Morgan Stanley, UN, Yankee Group, The Economist. .
  3. 3. Problem 1: We didn't know exactly what we wanted.
  4. 4. Problem 1: We didn't know exactly what we wanted. Problem 2: When we saved items on one device, we couldn't access them from others.
  5. 5. Problem 1: We didn't know exactly what we wanted. Problem 2: When we saved items on one device, we couldn't access them from others. Problem 3: We didn't have a good way to share what we'd found with one another.
  6. 6. Problem 1: We didn't know exactly what we wanted. Problem 2: When we saved items on one device, we couldn't access them from others. Problem 3: We didn't have a good way to share what we'd found with one another. Problem 4: We had to perform the same searches everyday until we found just what we wanted.
  7. 7. Initiation
  8. 8. Initiation Selection
  9. 9. Initiation Selection Exploration
  10. 10. Initiation Selection Exploration Formulation
  11. 11. Initiation Selection Exploration Formulation Collection
  12. 12. Initiation Selection Exploration Formulation Collection Action
  13. 13. Initiation Selection Exploration Formulation Collection http://alistapart.com/article/the-ux-of-learning Action
  14. 14. Search Type Search Motive
  15. 15. Casual
  16. 16. Casual Lookup
  17. 17. Casual Lookup Learn
  18. 18. Casual Lookup Learn Investigate
  19. 19. Informational
  20. 20. Informational Geographic
  21. 21. Informational Geographic Personal Info
  22. 22. Informational Geographic Personal Info Transactional
  23. 23. Casual Info Geographic Personal Info Transaction Lookup Learn Investigate
  24. 24. Casual Lookup Learn Investigate Info Window Shopping Trivia Information Gathering Research Geographic Friend Check-ins Directions Local Points of Interest Travel Planning Personal Info Checking Messages Checking Calendar Situation Analysis Lifestyle Planning Transaction Acting on Notifications Price Comparison Online Shopping Product Monitoring http://tinyurl.com/InfoNeedMatrix
  25. 25. Task Environ Social Physical Personal
  26. 26. Task Environ Social Physical Personal
  27. 27. Task Environ Social Physical Personal
  28. 28. Task Environ Social Physical Personal
  29. 29. Task Environ Social Physical Personal
  30. 30. Task Environ Social Physical Personal
  31. 31. 1. Content Over Controls
  32. 32. The Search Box
  33. 33. In the navigation bar Sort Search...
  34. 34. In a secondary toolbar Sort Search...
  35. 35. Via a pull-toreveal gesture Sort Search...
  36. 36. Via a pull-toreveal gesture Sort Search...
  37. 37. Via a pull-toreveal gesture Sort Search...
  38. 38. Via a pull-toreveal gesture Sort Search...
  39. 39. As-you-type suggestions
  40. 40. As-you-type suggestions
  41. 41. Other Input Methods
  42. 42. Location
  43. 43. Audio
  44. 44. Visual
  45. 45. Drawing
  46. 46. Display Formats
  47. 47. List
  48. 48. Grid
  49. 49. Map
  50. 50. Augmented Reality
  51. 51. Toggling the Display Format
  52. 52. Segmented control in a toolbar Search... List Map Images
  53. 53. Segmented control centered in the navigation bar List Map Images
  54. 54. Single button in the navigation bar Search... Map
  55. 55. 2. Open-ended Exploration
  56. 56. Inline Controls
  57. 57. Dedicated Screen
  58. 58. Best Match Price Refine Date
  59. 59. Filtering Best Match Price Refine Date Filter by Category Condition Price Seller Buying Formats Location Acoustic
  60. 60. Filtering with a segmented control Best Match Price Refine Date Narrow by New Refurb. Category Price Buying Formats Location Used Broken Acoustic
  61. 61. Filtering with a slider Best Match Price Refine Date Narrow by New Refurb. Used Broken Price Category Seller Buying Formats Location Acoustic
  62. 62. Sorting with a segmented control Best Match Price Refine Date Price Date Sort by Best Match Narrow by New Refurb. Used Broken Price Category Seller Buying Formats Location Acoustic
  63. 63. Dedicated refinement screens
  64. 64. Accessing the Refinement Screen
  65. 65. Button in the navigation bar Best Match Guitar Price R Date efine
  66. 66. Button in the navigation bar Best Match Search... Guitar Price Best Match Price Refine Date Price Date Refine R Date efine Sort by Best Match Narrow by New Price Refurb. Used Broken
  67. 67. Button in the navigation bar Best Match Search... Price Refine R Done Date efine Sort by Best Match Price Date Narrow by New Refurb. Used Broken Price Category Seller Buying Formats Location Acoustic
  68. 68. Button in the navigation
  69. 69. Gesture
  70. 70. Gesture RefineBest Match Used Broken Acoustic Price Date
  71. 71. Gesture Best Match Price Refine Date Narrow by New Refurb. Used Broken Price Category Seller Buying Formats Acoustic
  72. 72. Button or gesture
  73. 73. Button and popover
  74. 74. Breadcrumbs
  75. 75. Best Match Guitar Price R Date efine Showing new, acoustic guitars. Sorting by price.
  76. 76. 3. Cross-Channel Continuity
  77. 77. 4. Collaborative Searching
  78. 78. 5. Multi-session Tasks
  79. 79. Problem: We didn't know exactly what we wanted.
  80. 80. Problem: We didn't know exactly what we wanted. Solution: Design for open-ended exploration.
  81. 81. Problem: When we saved items on one device, we couldn't access them from others.
  82. 82. Problem: When we saved items on one device, we couldn't access them from others. Solution: Design for cross-channel continuity.
  83. 83. Problem: We didn't have a good way to share what we'd found with one another.
  84. 84. Problem: We didn't have a good way to share what we'd found with one another. Solution: Design for collaborative search.
  85. 85. Problem: We had to perform the same searches everyday until we found just what we wanted.
  86. 86. Problem: We had to perform the same searches everyday until we found just what we wanted. Solution: Design for multi-sessions tasks.
  87. 87. Mobile Search Workshop, Part 1 Developing a CrossChannel Blueprint 13:45 - 14:45
  88. 88. The cross-channel blueprint provides an overview of the ecosystem's two most fundamental attributes: the channels of which it's composed, and the user actions it must facilitate.
  89. 89. A service blueprint created by Brandon Schauer.
  90. 90. Resmini and Rosati’s CHU cube diagram
  91. 91. Gianluca Brugnoli’s touchpoints matrix.
  92. 92. Lookup Shared Assets High priority Low priority N/A High priority Immersive photography Flip pages back/forth Flip pages back/forth Order by phone Order by mail Order online High priority High priority High priority High priority High priority Browse by category Table view of selected items Favorites Wish list / gift registry Standard checkout Expedited checkout Order by phone High priority High priority Medium priority Medium priority High priority Catalog-like browsing experience Table view of selected items Favorites Wish lists Expedited checkout Standard checkout High priority Medium priority N/A Low priority High priority Browse by category Impractical due to screen size Add items to favorites and wish list, but limited ability to edit Expedited checkout High priority High priority Medium priority Low priority High priority Clear signage Store map Helpful staff Physical Store Low priority Search box Voice input Barcode scanner Mobile App Purchase Search box Voice input Tablet App Organize Search box Website Compare Table of contents Index Print Catalog Explore Wander the aisles Compare side by side Ask staff Gift registry / wish list Attendant-assisted Self-checkout Scan-as-you-go Product taxonomy Compare engine Universal Favs All channels powered by a single set of categories Web & tablet powered by one component Favorites list shared by web, tablet, mobile Universal checkout process for web, tablet, and mobile
  93. 93. Group time Break into groups and get ready to create your own cross-channel blueprint.
  94. 94. 1. Identify user actions. What are the actions that users desire to perform throughout the ecosystem as a whole?
  95. 95. Lookup Shared Assets High priority Low priority N/A High priority Immersive photography Flip pages back/forth Flip pages back/forth Order by phone Order by mail Order online High priority High priority High priority High priority High priority Browse by category Table view of selected items Favorites Wish list / gift registry Standard checkout Expedited checkout Order by phone High priority High priority Medium priority Medium priority High priority Catalog-like browsing experience Table view of selected items Favorites Wish lists Expedited checkout Standard checkout High priority Medium priority N/A Low priority High priority Browse by category Impractical due to screen size Add items to favorites and wish list, but limited ability to edit Expedited checkout High priority High priority Medium priority Low priority High priority Clear signage Store map Helpful staff Physical Store Low priority Search box Voice input Barcode scanner Mobile App Purchase Search box Voice input Tablet App Organize Search box Website Compare Table of contents Index Print Catalog Explore Wander the aisles Compare side by side Ask staff Gift registry / wish list Attendant-assisted Self-checkout Scan-as-you-go Product taxonomy Compare engine Universal Favs All channels powered by a single set of categories Web & tablet powered by one component Favorites list shared by web, tablet, mobile Universal checkout process for web, tablet, and mobile
  96. 96. 1. Identify user actions. 2. List the channels. What channels compose the ecosystem? Think both digital and physical.
  97. 97. Lookup Shared Assets High priority Low priority N/A High priority Immersive photography Flip pages back/forth Flip pages back/forth Order by phone Order by mail Order online High priority High priority High priority High priority High priority Browse by category Table view of selected items Favorites Wish list / gift registry Standard checkout Expedited checkout Order by phone High priority High priority Medium priority Medium priority High priority Catalog-like browsing experience Table view of selected items Favorites Wish lists Expedited checkout Standard checkout High priority Medium priority N/A Low priority High priority Browse by category Impractical due to screen size Add items to favorites and wish list, but limited ability to edit Expedited checkout High priority High priority Medium priority Low priority High priority Clear signage Store map Helpful staff Physical Store Low priority Search box Voice input Barcode scanner Mobile App Purchase Search box Voice input Tablet App Organize Search box Website Compare Table of contents Index Print Catalog Explore Wander the aisles Compare side by side Ask staff Gift registry / wish list Attendant-assisted Self-checkout Scan-as-you-go Product taxonomy Compare engine Universal Favs All channels powered by a single set of categories Web & tablet powered by one component Favorites list shared by web, tablet, mobile Universal checkout process for web, tablet, and mobile
  98. 98. 1. Identify user actions. 2. List the channels. 3. Prioritise and describe each channel-action. Determine the priority that each action should receive for a given channel. At the same time as setting priorities, also briefly describe how each action would be achieved.
  99. 99. Lookup Shared Assets High priority Low priority N/A High priority Immersive photography Flip pages back/forth Flip pages back/forth Order by phone Order by mail Order online High priority High priority High priority High priority High priority Browse by category Table view of selected items Favorites Wish list / gift registry Standard checkout Expedited checkout Order by phone High priority High priority Medium priority Medium priority High priority Catalog-like browsing experience Table view of selected items Favorites Wish lists Expedited checkout Standard checkout High priority Medium priority N/A Low priority High priority Browse by category Impractical due to screen size Add items to favorites and wish list, but limited ability to edit Expedited checkout High priority High priority Medium priority Low priority High priority Clear signage Store map Helpful staff Physical Store Low priority Search box Voice input Barcode scanner Mobile App Purchase Search box Voice input Tablet App Organize Search box Website Compare Table of contents Index Print Catalog Explore Wander the aisles Compare side by side Ask staff Gift registry / wish list Attendant-assisted Self-checkout Scan-as-you-go Product taxonomy Compare engine Universal Favs All channels powered by a single set of categories Web & tablet powered by one component Favorites list shared by web, tablet, mobile Universal checkout process for web, tablet, and mobile
  100. 100. 1. Identify user actions. 2. List the channels. 3. Prioritise and describe each channel-action. 4. Identify shared components. Think about the behind-the-scenes components that will be necessary to empower each user action.
  101. 101. Lookup Shared Assets High priority Low priority N/A High priority Immersive photography Flip pages back/forth Flip pages back/forth Order by phone Order by mail Order online High priority High priority High priority High priority High priority Browse by category Table view of selected items Favorites Wish list / gift registry Standard checkout Expedited checkout Order by phone High priority High priority Medium priority Medium priority High priority Catalog-like browsing experience Table view of selected items Favorites Wish lists Expedited checkout Standard checkout High priority Medium priority N/A Low priority High priority Browse by category Impractical due to screen size Add items to favorites and wish list, but limited ability to edit Expedited checkout High priority High priority Medium priority Low priority High priority Clear signage Store map Helpful staff Physical Store Low priority Search box Voice input Barcode scanner Mobile App Purchase Search box Voice input Tablet App Organize Search box Website Compare Table of contents Index Print Catalog Explore Wander the aisles Compare side by side Ask staff Gift registry / wish list Attendant-assisted Self-checkout Scan-as-you-go Product taxonomy Compare engine Universal Favs All channels powered by a single set of categories Web & tablet powered by one component Favorites list shared by web, tablet, mobile Universal checkout process for web, tablet, and mobile
  102. 102. 1. A global view of important user actions
  103. 103. 1. A global view of important user actions 2. The possible channels through which users might attempt those actions
  104. 104. 1. A global view of important user actions 2. The possible channels through which users might attempt those actions 3. A set of task priorities for each channel
  105. 105. 1. A global view of important user actions 2. The possible channels through which users might attempt those actions 3. A set of task priorities for each channel 4. A set of channel priorities for each action
  106. 106. 1. A global view of important user actions 2. The possible channels through which users might attempt those actions 3. A set of task priorities for each channel 4. A set of channel priorities for each action 5. An overview of which components need to be shared across channels
  107. 107. Mobile Search Workshop, Part 2 User Interface Sketching 15:00 - 16:00
  108. 108. Inputting the query Viewing search results Refining the query Advanced features Combine the best ideas Share
  109. 109. Inputting the query Viewing search results Refining the query Advanced features Combine the best ideas Share
  110. 110. Inputting the query Viewing search results Refining the query Advanced features Combine the best ideas Share
  111. 111. Inputting the query Viewing search results Refining the query Advanced features Combine the best ideas Share
  112. 112. Inputting the query Viewing search results Refining the query Advanced features Combine the best ideas Share
  113. 113. Inputting the query Viewing search results Refining the query Advanced features Combine the best ideas Share
  114. 114. Designing Mobile Search by @TylerTate

×