Model-Based User Interface Design by Demonstration and by Interview
Total Page:16
File Type:pdf, Size:1020Kb
Model-Based User Interface Design By Demonstration and By Interview A Thesis Presented to The Academic Faculty by Martin Robert Frank In Partial Fulfillment of the Requirements for the Degree Doctor of Philosophy in Computer Science Georgia Institute of Technology December 1995 Copyright (c) 1995 by Martin R. Frank ii Model-Based User Interface Design By Demonstration and By Interview Approved: ___________________________ James Foley, Chairman ___________________________ Ashok Goel ___________________________ Scott Hudson ___________________________ Christine Mitchell ___________________________ Brad Myers ___________________________ Piyawadee Sukaviriya Date Approved_______________ iii FOREWORD Completing a dissertation typically requires an unprecedented level of commitment, persistence and patience from its author, and this one was no exception. First and foremost, I would like to thank my parents, my sister, and Christy Gerlach for the support that made everything possible. Jim Foley made me realize how much better the German term “doctoral father” describes the nurturing role of an advisor. I would also like to thank Brad Myers for his close involvement, which went far beyond the call of duty for an external committee member. Finally, I want to thank the following individuals for volunteering their time for usability experiments and pilot studies: Gregory Abowd, Krishna Bharat, Lucy Gibson, Mark Gray, Chris Mitchell, Jayakumar Muthukumarasamy, Jim Pitkow, Spencer Rugaber, Erica Liebman Sadun, Matthias Schneider-Hufschmidt, Noi Sukaviriya, Lein Ton, and Maurizio Vitale. iv TABLE OF CONTENTS FOREWORD......................................................................................................... iii LIST OF TABLES..................................................................................................vi LIST OF FIGURES............................................................................................... vii SUMMARY............................................................................................................ix CHAPTER I. INTRODUCTION ....................................................................................... 1 I.1 Model-Based User Interface Design ................................................... 2 I.2 User Interface Design by Demonstration ............................................ 4 I.3 Model-Based User Interface Design by Demonstration ...................... 6 II. PREVIOUS WORK .................................................................................... 9 II.1 Previous Work on User Interface Modelling ....................................... 9 II.2 Previous Work on Model-Driven User Interface Tools ..................... 15 II.3 Previous Work on Demonstrational User Interface Tools ................ 17 III. THE ELEMENTS, EVENTS & TRANSITIONS MODEL .......................... 28 III.1 Motivation ........................................................................................ 28 III.2 Introduction to the EET Model ......................................................... 30 III.3 Advanced Concepts of the EET Model ........................................... 41 III.4 Using Two or More Levels of Abstraction ........................................ 75 III.5 Discussion of the EET Model .......................................................... 86 IV. BUILDING MODELS BY DEMONSTRATION ......................................... 97 IV.1 Demonstrating How Elements Change ......................................... 100 IV.2 Demonstrating When Elements Change ....................................... 123 IV.3 Demonstrating Both How and When Elements Change ............... 132 IV.4 The Inferencing Mechanism .......................................................... 145 IV.5 Discussion of the Demonstrational Components .......................... 177 V. BUILDING MODELS BY INTERVIEW .................................................. 184 V.1 The Role of an Interview Component ............................................ 184 V.2 The Design of the Interview Tool ................................................... 186 v VI. USABILITY RESULTS .......................................................................... 205 VI.1 Testing on Non-Programmers ....................................................... 205 VI.2 Testing on Programmers .............................................................. 213 VI.3 Discussion ..................................................................................... 216 VII.CONCLUSION ...................................................................................... 218 VII.1 Discussion .................................................................................... 218 VII.2 Contributions ................................................................................ 226 VII.3 Implementation Issues ................................................................. 226 VII.4 Extensions ................................................................................... 227 VII.5 Future Work ................................................................................. 228 VII.6 Conclusion ................................................................................... 229 APPENDIX A - EET Language Definition ........................................................ 230 APPENDIX B - A Visual Language for Grizzly Bear ........................................ 235 APPENDIX C - Application Code for Section III.3.9 ......................................... 237 APPENDIX D - A “MacDraw” Imitation driven by an EET Model ..................... 241 APPENDIX E - Material and Data from the Non-Programmer Study ............... 244 APPENDIX F - Material and Data from the Programmer Study ....................... 257 REFERENCES ................................................................................................. 260 VITA ................................................................................................................. 266 vi LIST OF TABLES Table Page 2-1 Overview of Application Models ........................................................... 14 2-2 Overview of Demonstrational Systems ................................................. 25 3-1 Standard Implicit Events ....................................................................... 57 4-1 Example Values for Integer Inferencing ............................................. 157 4-2 Computing the “Uniqueness” of Examples ......................................... 159 5-1 Possible Question Categories ............................................................ 200 6-1 Summary Data from the Non-Programmer Study .............................. 211 7-1 Specifying the Human-Computer Dialog ............................................ 219 E-1 Data Gathered from the Non-Programmer Study ............................... 256 F-1 Data Gathered from the Programmer Study ....................................... 259 vii LIST OF FIGURES Figure Page 3-1 Showing and Hiding an Auxiliary Window ............................................. 39 3-2 The “Nodes and Links” Application in Use ............................................ 63 3-3 Initial Layout of the “Nodes and Links” Application................................ 65 3-4 The Simplest Use of an EET Model ...................................................... 77 3-5 A Single EET Model and Application Code ........................................... 78 3-6 Two EET Models at Different Levels of Abstraction .............................. 79 3-7 A File Management Application............................................................. 80 4-1 Inference Bear ..................................................................................... 101 4-2 Capturing Events with Inference Bear ................................................. 103 4-3 Feedback on Recorded Events ........................................................... 104 4-4 A Detailed Storyboard of Inference Bear............................................. 108 4-5 Inference Bear’s Successive Inference Refinement............................ 109 4-6 Setting the Color of All Selected Elements.......................................... 112 4-7 Static User Interface Layout for the Rubber-Banding Lines ................ 114 4-8 Rubber-Banding Lines: Behavior of the Press Event .......................... 115 4-9 Rubber-Banding Lines: Behavior of the Motion Event......................... 116 4-10 Rubber-Banding Lines: Behavior of the Release Event ...................... 117 4-11 Rubber-Banding Lines: Playful Interaction with our Interface Design . 117 4-12 Mini-Finder: Initial User Interface Layout............................................. 118 4-13 Mini-Finder: Demonstration for the Press Event.................................. 119 4-14 Mini-Finder: Demonstration for the Motion Events .............................. 120 4-15 Mini-Finder: Demonstration for the Release Event.............................. 121 4-16 Expression Finder................................................................................ 125 4-17 A Detailed Storyboard of Expression Finder ....................................... 127 4-18 The Mini-Finder Revisited.................................................................... 129 4-19 Grizzly Bear ......................................................................................... 133 4-20 Cycling Through Colors ....................................................................... 134 viii 4-21 A Detailed Storyboard of Grizzly Bear................................................