Frances: A Tool For Understanding Computer Architecture and Assembly Language

Students in all areas of computing require a knowledge of the computing device and how software is implemented in the machine. Several courses in computer science curricula address these low-level details such as a computer architecture and assembly languages. For such courses, there are advantages to studying real architectures instead of simplified examples. However, real architectures and instruction sets introduce complexity that makes them difficult to grasp in a single semester course. Visualization techniques can help ease this burden. Existing tools are often difficult to use and consequently difficult to adopt in a course where time is already limited. To solve this problem, we present Frances. Frances graphically illustrates key differences between familiar high-level languages and unfamiliar low-level languages and also illustrates how familiar high-level programs behave on real architectures. Key to this tool is that we use a simple web interface that requires no setup and is easy to use, easing course adoption hurdles. We also include several features that further enhance its usefulness in a classroom setting. These features include graphical relationships between high-level code and machine code, clearly illustrated step by step machine state transitions, color coding to make instruction behavior clear, and illustration of pointers. We have used Frances in courses and performed experimental evaluation. Our results show the usability and effectiveness of this tool. Most notably, students with no computer architecture course experience were able to complete lessons using our tool with no guidance