Improving Usability of Pedagogical Computer
Total Page:16
File Type:pdf, Size:1020Kb
IMPROVING USABILITY OF PEDAGOGICAL COMPUTER EMULATION INTERFACES By Stephen D. Williams ([email protected]) Submitted to the Faculty of the College of Arts and Sciences of American University in Partial Fulfillment of the Requirements for the Degree of Master of Science In Computer Science Chair: Michael Black, PhD Mohammad Owrang Ojaboni, PhD Chris Powell, DM Dean of the College Date 2013 American University Washington, D.C. 20016 c COPYRIGHT by Stephen D. Williams ([email protected]) 2013 ALL RIGHTS RESERVED ii IMPROVING USABILITY OF PEDAGOGICAL COMPUTER EMULATION INTERFACES by Stephen D. Williams ([email protected]) ABSTRACT Computer emulations, simulating real or imagined computer systems, are a valuable tool to quickly gain understanding of computer architecture and software. Existing computer emulation systems offer useful but limited visualization and in- teraction. This paper addresses improving usability of pedagogical computer em- ulator interfaces with the application of published design principles informed by research into visuospatial ability. The results include a survey of promising tech- niques addressing similar problems and suggestions for application. Along with sup- porting work extending a publicly available Java-based PC emulator to enable use of the popular Processing visualization development environment, this provides a well-developed design and implementation framework for future improvements by interested parties. iii ACKNOWLEDGEMENTS I want to thank my committee for their time, diligence, and attention. I want to particularly thank Dr. Michael Black for attention, patience, flexibility, and enthusiasm for this subject. I appreciate the opportunity to be involved in an interesting project that promises to develop into an effective, useful, and fun asset to computer architecture, computer science, and human computer interaction education and practice. iv TABLE OF CONTENTS ABSTRACT . ii ACKNOWLEDGEMENTS . iii LIST OF TABLES . viii LIST OF FIGURES . ix CHAPTER 1. INTRODUCTION . .1 1.1 Purpose . .1 1.2 Research Questions . .3 1.3 Significance of the Study . .6 1.4 Concepts and Background . .6 1.4.1 Usability . .7 1.4.2 Related Disciplines . .8 1.4.3 Visuospatial Thinking & Mental Models . 10 1.4.4 Successful Interactive Visualization Methods . 14 1.4.5 Radial Bubble Tree . 17 1.4.6 Node-Link Graphs . 25 1.4.7 Taxonomies & Paradigms . 27 1.4.8 Elements of Designed Form . 29 1.4.9 Characteristics of Interaction Cues . 31 1.4.10 A Taxonomy of Game Cues . 32 v 1.4.11 Published Principles of Design . 33 1.4.12 Taxonomy of Interactive Dynamics . 37 1.4.13 Gamification and Flow . 39 1.4.14 Universal Application . 41 1.4.15 Code and Algorithm Understanding . 42 1.4.16 Processing . 43 1.4.17 Personas . 44 1.5 Specific Accomplishments . 46 2. REVIEW OF EXISTING EMULATORS . 48 2.1 Existing Computer Emulators . 48 2.1.1 Emumaker 86 . 49 2.1.2 WebMIPS . 51 2.1.3 ProcSim . 53 2.1.4 SimuProc . 54 2.1.5 KScalar . 55 2.1.6 WinMips64 . 56 2.1.7 WinDLX . 57 2.1.8 Spim . 57 2.1.9 p88110 . 58 2.1.10 IASSim . 58 2.2 Computer Architecture Emulator Components . 59 2.2.1 CPU . 60 2.2.2 Pipeline . 62 2.2.3 Memory . 63 2.2.4 Storage . 64 2.2.5 Data Path / Control Path . 65 vi 2.3 Interactive Visualization Design . 66 2.4 Visualization Integration Architecture . 67 3. METHODS . 68 3.1 Curating Constraints and Concerns . 68 3.2 Cataloging Relevant Design Elements . 69 3.3 Identifying Key Literature . 69 3.4 Determining Requirements & Missing Features . 69 3.5 Critiquing Computer Emulation Systems . 70 3.6 Modifying Emulator for Pluggable Visualization . 70 3.6.1 Designing Reference Emulator Integration . 71 3.7 Developing New Design Elements . 71 3.8 Implementing Interactive Visualization Elements . 71 3.9 Developing Emulator Scenarios . 72 3.10 Evaluating Usability . 72 3.11 Determining Research Opportunities . 73 4. RESULTS . 74 4.0.1 Constraints, Concerns, & Design Elements . 74 4.1 Requirements & Missing Features . 74 4.1.1 User Requirements & Motivations . 75 4.1.2 Mental Models . 77 4.2 Pluggable Visualization . 78 4.2.1 Adapted Application architecture . 78 4.2.2 Reference Emulator Integration Design . 82 4.3 Solution Design Elements . 84 4.3.1 Representing Scalars . 84 4.3.2 Representing Memory . 87 vii 4.3.3 Representing Instructions . 90 4.4 Usability . 96 5. CONCLUSIONS . 98 5.1 Summary of Findings . 98 5.2 Conclusions Drawn . 99 5.2.1 Solution Scenarios . 99 5.3 Recommendations for Further Research . 101 5.3.1 Memory Visualization . 102 5.3.2 Instruction, Microcode, and Pipeline . 102 5.3.3 Code Understanding & Machine Learning . 102 APPENDIX A. Plugin Code . 104 B. Visualization Models . 108 REFERENCES . 144 viii LIST OF TABLES Table Page 1.1 Characteristics of Interaction Cues Documented in the Study. Quoted from: (Olli et al., 2008, 195) . 31 2.1 Pedagogical Computer Emulators . 48 ix LIST OF FIGURES Figure Page 1.1. Kdirstat treemap . 15 1.2. Voroni Treemap . 15 1.3. NY Times Budget Proposal bubble chart, showing stratified grouping. 16 1.4. Bubble Chart Showing Group Membership and Relative Size. 16 1.5. Bubble Chart Letter-Pair Analysis of Document. 17 1.6. Minimal BubbleTree Demo. 17 1.7. Edward Tufte's Sparklines. 18 1.8. Hyperbolic Tree . 19 1.9. Choropleth Map . 19 1.10. Cartogram . 20 1.11. Expand-Ahead . 21 1.12. Expand-Ahead Animation Scrubbing . 22 1.13. Layer-Time visualization . 23 1.14. TiddlyProcessing . 24 1.15. Fitts's Law, Shannon-Hartley Formulation(community, 2013a) . 36 1.16. Gutenberg Diagram . 36 1.17. Skeuomorph for Audio Compressor(G¨ottling,2013) . 37 1.18. Flow: Challenge vs. Skill . 40 1.19. Flow Chart . 40 2.1. Emumaker 86 2013 Main Interface. 50 x 2.2. Representation of the CPU in Emumaker 86. 51 2.3. WebMIPS Program Entry . 52 2.4. WebMIPS CPU . 52 2.5. WebMIPS Memory . 52 2.6. WebMIPS Registers . 53 2.7. ProcSim Animation Screen . 54 2.8. SimuProc . 55 2.9. KScalar CPU Simulation . 56 2.10. KScalar Pipeline Cycle Diagram . 56 2.11. WinMips64 Main Emulation Window . 57 2.12. WinDLX Clock Cycle Diagram . 57 2.13. Spim Emulator . 58 2.14. IASSim Emulator . 59 2.15. Emumaker 86(Black and Komala, 2011) . 60 2.16. Emumaker 86(Black and Komala, 2011) . 62 2.17. Arcis Instruction Pipeline Representation(Black and Komala, 2011) . 62 2.18. Graphical PC Simulator Memory(Black and Komala,.