Individualising Graphical Layouts with Predictive Visual Search Models

In domains where users are exposed to large variations in visuo-spatial features among designs, they often spend excess time searching for common elements (features) on an interface. This article contributes individualised predictive models of visual search, and a computational approach to restructure graphical layouts for an individual user such that features on a new, unvisited interface can be found quicker. It explores four technical principles inspired by the human visual system (HVS) to predict expected positions of features and create individualised layout templates: (I) the interface with highest frequency is chosen as the template; (II) the interface with highest predicted recall probability (serial position curve) is chosen as the template; (III) the most probable locations for features across interfaces are chosen (visual statistical learning) to generate the template; (IV) based on a generative cognitive model, the most likely visual search locations for features are chosen (visual sampling modelling) to generate the template. Given a history of previously seen interfaces, we restructure the spatial layout of a new (unseen) interface with the goal of making its features more easily findable. The four HVS principles are implemented in Familiariser, a web browser that automatically restructures webpage layouts based on the visual history of the user. Evaluation of Familiariser (using visual statistical learning) with users provides first evidence that our approach reduces visual search time by over 10%, and number of eye-gaze fixations by over 20%, during web browsing tasks.

[1]  Krzysztof Z. Gajos,et al.  Automatically generating custom user interfaces for users with physical disabilities , 2006, Assets '06.

[2]  Andrew Sears,et al.  Layout Appropriateness: A Metric for Evaluating User Interface Widget Layout , 1993, IEEE Trans. Software Eng..

[3]  Eileen Kowler Eye movements: The past 25years , 2011, Vision Research.

[4]  Jean Vanderdonckt,et al.  Towards a Dynamic Strategy for Computer-Aided Visual Placement , 1994, Advanced Visual Interfaces.

[5]  Jakob Nielsen,et al.  Usability engineering , 1997, The Computer Science and Engineering Handbook.

[6]  Ian H. Witten,et al.  Adaptive personalized interfaces—A question of viability , 1985 .

[7]  D. Norris,et al.  THE QUARTERLY JOURNAL OF EXPERIMENTAL PSYCHOLOGY, 1996, 49A (1), 80 ± 115 Unchained Memory: Error Patterns Rule out Chaining Models of Immediate Serial Recall , 2022 .

[8]  David M. Blei,et al.  Probabilistic topic models , 2012, Commun. ACM.

[9]  Antti Oulasvirta,et al.  Sketchplore: Sketch and Explore with a Layout Optimiser , 2016, Conference on Designing Interactive Systems.

[10]  Jeffrey Nichols,et al.  UNIFORM: automatically generating consistent remote control user interfaces , 2006, CHI.

[11]  Antti Oulasvirta,et al.  Ability-Based Optimization: Designing Smartphone Text Entry Interface for Older Adults , 2017, INTERACT.

[12]  Jeffrey Nichols,et al.  Mobilization by demonstration: using traces to re-author existing web sites , 2008, IUI '08.

[13]  K. Rayner The 35th Sir Frederick Bartlett Lecture: Eye movements and attention in reading, scene perception, and visual search , 2009, Quarterly journal of experimental psychology.

[14]  Rob Miller,et al.  Sikuli: using GUI screenshots for search and automation , 2009, UIST '09.

[15]  Andrew Sears,et al.  The role of visual search in the design of effective soft keyboards , 2001, Behav. Inf. Technol..

[16]  C. Lebiere,et al.  An integrated theory of list memory. , 1998 .

[17]  Dario D. Salvucci An integrated model of eye movements and visual encoding , 2001, Cognitive Systems Research.

[18]  J R Anderson,et al.  Practice and retention: a unifying analysis. , 1999, Journal of experimental psychology. Learning, memory, and cognition.

[19]  Antti Oulasvirta,et al.  Modelling Learning of New Keyboard Layouts , 2017, CHI.

[20]  C. Koch,et al.  A saliency-based search mechanism for overt and covert shifts of visual attention , 2000, Vision Research.

[21]  M. Chun,et al.  Top-Down Attentional Guidance Based on Implicit Learning of Visual Covariation , 1999 .

[22]  Ranjitha Kumar,et al.  Bricolage: example-based retargeting for web design , 2011, CHI.

[23]  Henrik Eriksson,et al.  Model-Based Automated Generation of User Interfaces , 1994, AAAI.

[24]  Daniel S. Weld,et al.  Exploring the design space for adaptive graphical user interfaces , 2006, AVI '06.

[25]  Antti Oulasvirta,et al.  MenuOptimizer: interactive optimization of menu systems , 2013, UIST.

[26]  Ranjitha Kumar,et al.  Webzeitgeist: design mining the web , 2013, CHI.

[27]  H. Intraub,et al.  Wide-angle memories of close-up scenes. , 1989, Journal of experimental psychology. Learning, memory, and cognition.

[28]  Dan R. Olsen,et al.  A programming language basis for user interface , 1989, CHI '89.

[29]  Aaron Hertzmann,et al.  Learning Layouts for Single-PageGraphic Designs , 2014, IEEE Transactions on Visualization and Computer Graphics.

[30]  Steven K. Feiner,et al.  Scope: automated generation of graphical interfaces , 1989, UIST '89.

[31]  Antti Oulasvirta,et al.  Ability-Based Optimization of Touchscreen Interactions , 2018, IEEE Pervasive Computing.

[32]  Kris Luyten,et al.  Familiarisation: Restructuring Layouts with Visual Learning Models , 2018, IUI.

[33]  P. Frensch,et al.  Composition during serial learning: a serial position effect. , 1994, Journal of experimental psychology. Learning, memory, and cognition.

[34]  Jeffrey Nichols,et al.  Generating remote control interfaces for complex appliances , 2002, UIST '02.

[35]  Krzysztof Z. Gajos,et al.  Ability-Based Design: Concept, Principles and Examples , 2011, TACC.

[36]  M. Chun,et al.  Contextual Cueing: Implicit Learning and Memory of Visual Context Guides Spatial Attention , 1998, Cognitive Psychology.

[37]  Andruid Kerne,et al.  Culturally based design: embodying trans-surface interaction in rummy , 2012, CSCW.

[38]  David L. Barton Design Languages , 1999, The VLSI Handbook.

[39]  Jürgen Ziegler,et al.  Generating user interfaces from data models and dialogue net specifications , 1993, INTERCHI.

[40]  Gerrit C. van der Veer,et al.  Pattern Languages in Interaction Design: Structure and Organization , 2003 .

[41]  Stuart C. Shapiro,et al.  Automatic Construction of User-Interface Displays , 1988, AAAI.

[42]  Aaron Hertzmann,et al.  DesignScape: Design with Interactive Layout Suggestions , 2015, CHI.

[43]  Joachim Meyer,et al.  Benefits and costs of adaptive user interfaces , 2010, Int. J. Hum. Comput. Stud..

[44]  Krzysztof Z. Gajos,et al.  Automatically generating user interfaces adapted to users' motor and vision capabilities , 2007, UIST.

[45]  Krzysztof Z. Gajos,et al.  SUPPLE: automatically generating user interfaces , 2004, IUI '04.

[46]  A. Treisman,et al.  A feature-integration theory of attention , 1980, Cognitive Psychology.

[47]  Morgan Dixon,et al.  Prefab: implementing advanced behaviors using pixel-based reverse engineering of interface structure , 2010, CHI.