Search User Interface Design

4,480 views
4,213 views

Published on

Talk given to the University of Glasgow IR group on the 18th June 2012. #HCIR

Published in: Technology, Business
1 Comment
5 Likes
Statistics
Notes
No Downloads
Views
Total views
4,480
On SlideShare
0
From Embeds
0
Number of Embeds
262
Actions
Shares
0
Downloads
55
Comments
1
Likes
5
Embeds 0
No embeds

No notes for slide

Search User Interface Design

  1. 1. Search User Interface Design Dr Max L. Wilson Mixed Reality Lab University of Nottingham, UKDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  2. 2. About Me Social Media Search My Research Areas Casual Search Search User Interface Design My Framework Information vs Interaction Brain ResponseDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  3. 3. Software Engineering MEng HCI & Information Science PhD Web Science and Semantic WebDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  4. 4. Dr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  5. 5. UIST 2008 JCDL 2008Dr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  6. 6. My PhD Bates, M. J. (1979a). Idea tactics. Journal of the American Society for Information Belkin, N. J., Marchetti, P. G., and Cool, C. Science, 30(5):280–289. (1993). Braque: design of an interface to support user interaction in information retrieval. Bates, M. J. (1979b). Information search Information Processing and Management, 29(3): tactics. Journal of the American Society for 325–344. Information Science, 30(4):205–214.Dr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  7. 7. My PhD Wilson, M. L., schraefel, m. c., and White, R. W. (2009). Evaluating advanced search interfaces using established information-seeking models. Journal of the American Society for Information Science and Technology, 60(7):1407–1422.Dr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  8. 8. Come and Sii what I’ve built http://mspace.fm/sii Best JASIST article 2009Dr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  9. 9. Dr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  10. 10. Dr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  11. 11. About Me Social Media Search My Research Areas Casual Search Search User Interface Design My Framework Information vs Interaction Brain ResponseDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  12. 12. to observe that experience with or of the subject matter was In the post-task interviews, we asked users to informally important to the information seekers. We also see two very augment their relevance judgments with scores out of 5. interesting codes appear in this task, which are able to Overall, the mean score for all rated tweets over all three compliment each other, the first being shared sentiment, tasks was 2.2, indicating a very low relevancy score. and secondly entertaining. Both of these codes are Individually, the first task, which was temporal in nature, Social Media Search subjective in nature, which could be expected a subjective task. Useful links and experience were also played an important role in this task. Many participants found this scored 2.7. The second task, which involved users search for information regarding purchasing an iPhone, scored a very low 1.25. The third and final task, which was a In Tweet Content T1 T2 T3 Experience Someone reporting a personal experience, but not necessarily suggestion / direction. 15 12 13 Direct Someone making a direct recommendation, but not necessarily relaying a personal 3 3 20 Recommendation experience. Social Knowledge Containing information that is spreading socially, or becoming general knowledge. 7 6 6 Specific Where facts are listed directly in tweets e.g. prices, times etc. 51 10 47 Information Reflection on Tweet Entertaining The reader finds them amusing. 1 3 2 Shared Sentiment The reader agrees with the author of the tweet. 1 2 1 Relevant Time The time is current. 14 0 2 Location The location is relevant to the query. 6 1 40 Trust Trusted Author The twitter account has a reputation / following. 3 2 6 Trusted Avatar The visual appearance cultivates trust. 2 0 2 Trusted Link A link to a trustworthy recognizable domain. 14 1 7 Links Actionable Link The user can perform a transaction by using the link (heavily dependent on trust). 9 0 0 Media Link The link is to rich multimedia content. 9 0 0 Useful Link The link provides valuable information content, e.g. authoritative information, educated 61 30 43 reviews, and discussions. Meta Tweet Retweeted Lots Its information that others have passed on lots. 4 0 4 Conversation It is part of a series of tweets, and they all need to be useful. 1 4 4 Table 3. The 16 codes and the 6 categories extracted from responses and tweet pairs from the useful tweets. Further, columns 3-5 show how ICWSM 2011 frequently each was associated with the temporal (T1), subjective (T2) and location-sensitive (T3) tasks.Dr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  13. 13. Social Media Search INSERT VIDEODr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  14. 14. D behaviours documented so far. 4.1 Need-less browsing d Casual Leisure Search Much like the desire to pass time at the television, we saw many examples (some shown in Table 3) of people passing a time typically associated with the ‘browsing’ keyword. 5 h 1) ... I’m not even *doing* anything useful... just browsing eBay aimlessly... f 2) to do list today: browse the Internet until fasting break o time.. S 3) ... just got done eating dinner and my family is watch- ing the football. Rather browse on the laptop i 4) I’m at the dolphin mall. Just browsing. b a Table 3: Example tweets where the browsing activ- d ity is need-less. f t From the collected tweets it is clear that often the inform- s ation-need in these situations are not only fuzzy, but2010 HCIR typi- W cally absent. The aim appears to be focused on the activity, t where the measure of success would be in how much theyDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  15. 15. Casual Leisure Search Springer Book Chapter - Award: Outstanding Author ContributionDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  16. 16. About Me Social Media Search My Research Areas Casual Search Search User Interface Design My Framework Information vs Interaction Brain ResponseDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  17. 17. Search User Interface DesignDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  18. 18. Dr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  19. 19. 4 14 13 1 5 10 8 11 2 9 12 7 6 9 11 3Dr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  20. 20. 4 1 14 10 8 12 13 15 11 5 2 6 7 9 16 3Dr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  21. 21. Dr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  22. 22. Dr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  23. 23. Dr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  24. 24. Dr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  25. 25. 4 14 13 1 5 10 8 11 2 9 12 7 6 9 11 3Dr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  26. 26. 4 1 Input Features 8 12Dr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  27. 27. 4 13 1 5 Control Features 8 11 9 12 7 6 9 11 3Dr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  28. 28. 1 5 Informational Features 10 11 2 9 12 7 6 9 11 3Dr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  29. 29. 14 13 1 Personalisable Features 2 9 12 6 9Dr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  30. 30. SUI Design Taxonomy Input Features Control Features Informational Features Personalisable FeaturesDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  31. 31. SUI Design Taxonomy Input Features Search box Query-by-example Control Features Clusters/Categories Taxonomies Informational Features Facets Social annotations Personalisable FeaturesDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  32. 32. Auto-complete/suggest 4.1. INPUT FEATURES 31 (a) Apple – shows lots of contextual informa- (b) Google – prioritising previous searches. tion and multimedia. Figure 4.1: Examples of AutoComplete.Dr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  33. 33. SUI Design Taxonomy Input Features Query Suggestions Control Features Corrections Sorting Filters Informational Features Groupings Personalisable FeaturesDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  34. 34. 46 Sorting 4. MODERN SEARCH USER INTERFACES (a) Sorting in Amazon (b) Sorting in Walmart (c) Sorting in Yahoo! (d) Tabular sorting in Scan.co.uk.Dr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  35. 35. SUI Design Taxonomy Snippets Input Features Usable Info Thumbnails Previews Control Features Relevance Info 2D & 3D Viz Informational Features Guiding numbers Zero-click answers Personalisable Features Signposting Pagination Social InfoDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  36. 36. Usable Information Figure 4.17: Snippets in Ciao’s search results can be extended using the ‘more’ link. Figure 4.18: Results in Sainsbury’s groceries search can be added to the shopping basket without having to leave the search page. allows searchers to add items to their cart from the SERP, as shown in Figure 4.18. If searchers are unsure if an item is right for them, however, they can view a page with more information about each product, and buy from there too. Ciao!, in Figure 4.17, also has a range of usable links in their results, including links directly to reviews, pricing options, and to the category that an item belongs in. In Google Image Search, there is a usable link that turns any result into a new search for ‘Similar Images,’ as discussed in the Query-by-example section above. Further, searchers may nowDr Max L. Wilson ‘+1’ a result in a Google SERP, without affecting or interrupting their search. Finally, searching http://cs.nott.ac.uk/~mlw/ inMonday, 2 July 12 23
  37. 37. 74 4. MODERN SEARCH USER INTERFACES Social Information Recommendation • Track and reuse information about the behaviour of a systems searchers. Figure 4.39: Amazon often provides feedback to tell searchers what people typically end up actually buying. or even the way they are presented. Further, they can affect the Control features that are provided. For clarification, there has been a lot of work that has focused on algorithmic personalisation forDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12 search, which has a whole book of its own [133]. Instead, this section focuses on different types of
  38. 38. SUI Design Taxonomy Input Features Control Features Informational Features Personalisable Features Current-search Persistent SocialisedDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  39. 39. 76 4. MODERN SEARCH USER INTERFACES Search Histories Recommendation • Help searchers to return to previously viewed SERPs and results. (a) History of searches in PubMed. (b) History of searches and results in Ama- zon. Figure 4.41: SUIs can help searchers get back to previous searches by keeping a history.Dr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  40. 40. SUI Design Taxonomy Input Control Informational PersonalisableDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  41. 41. The Search Box Input Control Query Only sb Informational PersonalisableDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  42. 42. The Search Box Input Control with auto- sb suggest Informational PersonalisableDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  43. 43. The Search Box Input Control If query sb is persistent in search box Informational PersonalisableDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  44. 44. The Search Box Input Control with auto- suggest, and query left in sb place, and if auto- suggest includes search Informational Personalisable historyDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  45. 45. The Sweet Spot for SUI design Input Control Informational Personalisable Good SUI features fit into >1 categoryDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  46. 46. Search User Interface Design • The Taxonomy • Historical context • Lots of examples • 20 Design Recommendations • Future Trends • Evaluation notesDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  47. 47. About Me Social Media Search My Research Areas Casual Search Search User Interface Design My Framework Information vs Interaction Brain ResponseDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  48. 48. Search User Interface Design Does Interaction Matter? Does interaction provide significant benefits to users? Or is it just more information and more data? How should companies prioritise investment in these areas?Dr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  49. 49. Information vs InteractionDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  50. 50. Information vs Interaction Useful info - or Efficient interaction? • Kelly et al (2009) - query suggests > term suggestions • Ruthven (2003) - humans not good at choosing useful ones • Diriye (2009) - slow people down during simple tasksDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  51. 51. Information vs Interaction Useful data? Efficient (from good algorithm) interaction? • Hearst & Pederson (1996) - better task performance • Pirolli et al (1996) - helped to understand corpusDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  52. 52. Information vs Interaction Powerful interaction? or lots of useful data? • Hearst (2006) - careful metadata is always better than clusters • Wilson & schraefel (2009) - good for understanding corpusDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  53. 53. Information vs InteractionDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  54. 54. Information vs Interaction Query dataDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  55. 55. Information vs Interaction Clustered Query data algorithmsDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  56. 56. Information vs Interaction Clustered Faceted Query data algorithms metadataDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  57. 57. Information vs Interaction Query dataDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  58. 58. Information vs Interaction Figure 1: The three interaction conditions in the stu common form. UIC in the middle presents secondar hierarchical clustering. UIF on the right, which inclu terms, or facets, that can be applied to or removed fr - H1: Searchers will be more efficient with more powerful interaction, using the same metadata, when completing search tasks. - H2: Searchers will enjoy more powerful interaction, Query data despite using the same metadata. - H3: Searchers will use query recommendations more when they are presented differently.Dr Max L. Wilson In order to accept or reject these hypotheses, we designed a http://cs.nott.ac.uk/~mlw/Monday, 2 July 12 3x2 repeated-measures study using two independent
  59. 59. 3 Conditions UIQ UIC UIF Figure 1: The three interaction conditions in the study. UIQ on the left presents query suggestions in theirDr Max L. Wilson http://cs.nott.ac.uk/~mlw/ common form. UIC in the middle presents secondary query suggestions with an interaction model based onMonday, 2 July 12
  60. 60. xperience, standard Two standard types of user study task were used in thehe Bing API for the study: 1) a simple lookup task and 2) an exploratory task. op-level entities in All six tasks are shown in Table 1. n, UIC then asked 2 Types of Task The simple lookup tasks had a fixed answer, but the chosen h were represented task description was presented in such a way that the most To create the same likely query would not find the answer without subsequentwsing through the queries or refinements. This approach was chosen to ies, the searchers intrinsically encourage participants to use the IIR features box. As well as on the left of each user interface condition.n selected in thedard terminology to Table 1: Tasks set to participants in the study.em in hierarchy]’. S = Simple, E = Exploratory technically issuing ID S/E Task Descriptionxperience appeared 1 S What is the population of Ohio? fferent sub-clustersy. 2 E Find an appropriate review of “Harry Potter and the Deathly Hallows”. filtering systems, - Compare the rating with the previous film. of metadata made mbination in order 3 S Find the first state of America.s able to flexibly 4 E Deduce the main problems that Steve Jobsf keyword filters in incurred with regards to his health. or and narrow their 5 S What is the iPad 3’s proposed processor name? typically maintain 6 E Explore information related to Apple’s next arch box, and then iPhone, the iPhone 5. results to portions - Note the expected release date. There could well be multiple rumours. elves to using just aimed L. Wilson Dr Max to create a http://cs.nott.ac.uk/~mlw/ to apply 12 Monday, 2 July multiple The exploratory search tasks were chosen to be tasks with
  61. 61. 18 People Intro + UI1 UI2 UI3 QA + Consent 2 tasks 2 tasks 2 tasks DebriefDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  62. 62. 18 People Intro + UI1 UI2 UI3 QA + Consent 2 tasks 2 tasks 2 tasks Debrief Queries Refinements Pageviews Time MeasuresDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  63. 63. 18 People Intro + UI1 UI2 UI3 QA + Consent 2 tasks 2 tasks 2 tasks Debrief Queries Refinements Ease of use Pageviews Task Satisfaction Time MeasuresDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  64. 64. 18 People Intro + UI1 UI2 UI3 QA + Consent 2 tasks 2 tasks 2 tasks Debrief Queries Quickest Refinements Ease of use Most Enjoyable Pageviews Task Satisfaction Best Design Time MeasuresDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  65. 65. Simple vs Exploratory Measure S E Diff Time 176s 179s no Queries 1.75 2.33 p<0.05 Pageviews 1.65 2.09 p<0.005 Refinements 2.42 2.45 noDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  66. 66. Log data By UI Measure Simple Exploratory Queries UIQ < UIC & UIF UIQ > UIC & UIF Refinements No diff UIQ & UIC < UIF Visits No diff UIQ > UIC & UIF Time UIQ > UIC < UIF UIC < UIF < UIQDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  67. 67. Subjective Responses Measure Simple Easy of Use UIQ & UIC > UIF Satisfaction UIQ & UIC > UIF Question UIQ UIC UIF Quickest to correct answer 11 5 2 Most enjoyed during task 4 11 3 Most appealing design 5 11 2Dr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  68. 68. What did we actually learn? • We did see different behaviour in all 3 conditions • People were good at simple tasks with original UIQ • People were faster and more effective with UIC and preferred it • People used more filters and viewed fewer pages with UIF but did not like it so much • But is it better or worse behaviour?Dr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  69. 69. Information vs Interaction Query dataDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  70. 70. Information vs Interaction Clustered Faceted Query data algorithms metadataDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  71. 71. Information vs Interaction Facets Clusters Performance Suggestions (hypothetically)Dr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  72. 72. About Me Social Media Search My Research Areas Casual Search Search User Interface Design My Framework Information vs Interaction Brain ResponseDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  73. 73. SUI Design + Brain ResponseDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  74. 74. SUI Design + Brain Response Cognitive Load Theory Total Mental Capacity Easy Task Simple UIDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  75. 75. SUI Design + Brain Response Cognitive Load Theory Total Mental Capacity Hard Task Simple UIDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  76. 76. SUI Design + Brain Response Cognitive Load Theory Total Mental Capacity Hard Task Complex UIDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  77. 77. Dr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  78. 78. Dr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  79. 79. Dr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  80. 80. SUI Design & Brain Response Clear design recommendations Cost vs Gain of adding a feature Ways to reduce cost of a featureDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  81. 81. About Me Social Media Search My Research Areas Casual Search Search User Interface Design My Framework Information vs Interaction Brain ResponseDr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12
  82. 82. Dr Max L. Wilson http://cs.nott.ac.uk/~mlw/Monday, 2 July 12

×