The Art of Computer Graphics Programming: Translating Pioneer Programs

Considering BLOCKIN BLOCKIN the BLOCKIN


Introduction
In the 80's, at the MIT Media Lab, Harel and Papert (1991) proposed the use of computers as a learning tool, in order to stimulate creative processes that should be involved in learning.In the same line of thinking, architecture educators have also proposed the use of programming for teaching design, such as Schmitt (1988) and Coates (1995) (Celani, 2008).
One of the very first books that was published with this purpose was The Art of Computer Graphics Programming: A Structured Introduction for Architects and Designers (1987), authored by William J. Mitchell, one of the most influential authors in the field of Computational Design theory, along with Robin Ligget and Thomas Kvan.The book was one of the first to establish a relationship between architecture and computer science by means of computer programming code that implemented computational design ideas.However, this book has never been republished and it is almost forgotten since the codes in it were written in Pascal, an obsolete language.
The Art of Computer Graphics Programming is much more than a Pascal programming manual.In the Preface, the authors deliberately affirm that they "are at least as concerned here with issues of design theory and visual aesthetics as we are with computer technology" (p.viii).The book introduces programming techniques along with computational design concepts, through a number of shape generation concepts that can be implemented in Pascal (as in any other computer language): variables that can take different values, thus defining parametric shapes; symmetry and repetition, which create different composition from the same vocabulary; conditionals, lead to environment--dependent solutions; encapsulation of shapes, which creates hierarchic structures; and finally, transformation operations, which carry objects from one state to another.The code examples and exercises always establish a relationship to existing architectural examples, validating the concepts presented as actual architectural design generation strategies.Along with The Logic of Architecture (Mitchell, 1990) and The Poetics of Gardens (Moore, Mitchell and Turnbull, 1988), the book can be seen as part of a trilogy (Celani, Duarte, Vaz, 2011).
This educational matter is one of the principal aspects of this work, and also of this book.Not only have the authors aimed to teach programming skills, but also they intended to explain the inner works of the computers, printers and plotters available at the time, in 1987.It is easily notable how much the technological equipment has changed since that, which made a substantial part of the book obsolete.Nevertheless, it is important to observe that even with this specific point being unnecessary to the current readers, The Art of Computer Graphics Programming is filled with interesting comments about the relationship between technology and architecture, especially considering the period.
The project herein described aimed at rescuing The Art of Computer Graphics Programming from the past, through the translation of its codes into a more contemporary programming language, thus allowing the younger generation to get in touch with an early work of one of the pioneers of CAAD.The main intention of this work was to preserve the originality of the content of this book as one of the first to focus on the importance of programming knowledge for the modern architect.
The renewed codes were made available through an Internet website, which also includes information about the new programming language used.All the book's codes were translated into this language, and each of them is followed by comments, explanations and an illustration, allowing anyone to easily use them.By translating and making these codes available we expect to contribute with the education of a new generation of architects who understand that computers can be much more empowering when one knows how to program them.

Structure of the Book
The first part of The Art of Computer Graphics Programming, "Introduction to the Medium", presents information about hardware and software.The final part of the book, again very technical, discusses graphic packages for 2D and 3D--modeling, and for rendering still images and animations.In Part 2, "Elementary Graphics Program", after a brief introduction to Pascal syntax basics, the book introduces computational design concepts along with programming techniques, all of which are illustrated with sample codes.The codes on Chapters 5 through 15 were translated in the present research.The main computational concepts presented in the book are described below.
Chapter 8, "Graphic Vocabularies", introduces the "distinction between the essential and accidental properties of an object" (p.167), i.e., between the general description of an object (its type) and its actual instantiation.The same chapter describes the "Parameterization of Graphic Elements" (p.166), including a discussion about ranges of parameters, and the degrees of freedom of a parameterized element.The chapter ends with a section called "Defining vocabularies" of graphic elements".Chapter 9, "Repetition", introduces "Principles of regular composition" (p.201), and proceeds with the "Use of Control Structures to Express Compositional Rules" (p.202), which means looping through code with statements such as For/Next, While/Do and Repeat/Until.This chapter ends with a discussion about generate--and--test--procedures.
Chapter 11, "Conditionals", presents structures that allows "to vary conditionally, according to context" (p.273): If/Then/Else and Boolean variables.This concept is exemplified by many design situations, such as choosing among many design alternatives (state--action diagrams), exterior and interior conditions, conditional insertion of architectural elements to generate rhythms, and generate--and--test--procedures.
Chapter 12, "Hierarchical structures", shows how to create subsystems and spatial relations by specifying "the relation between its constituent vocabulary elements" (p.324).It also introduces the concepts of recursion and recursive subdivision.Finally, Chapter 14, "Transformations", introduce Euclidean operations and show how to combine them with hierarchical structures, parameters and loops to generate symmetries.

Choosing a new Programming Language
In a previous work, we have proposed the translation of the codes from The Art of Computer Graphics Programming into a CAD scripting language, VBA for AutoCAD (Celani and Lazzarini, 2007).However, we realized that that language would soon become obsolete, because AutoDesk was shifting towards Dot Net.Besides, associating the scripts with a specific CAD software was very limiting.For that reason, we decided to look for a more general, free--standing programming language, and after considering different alternatives, we decided to use Processing.
Since its creation, in the early 2000's, Processing was intended to guide architects, designers and anyone without previous skills through learning a simple, but powerful, programming language.It is described in its website as "an open source programming language and environment for people who want to create images, animations, and interactions (…) developed to teach fundamentals of computer programming within a visual context".Therefore, it is a perfect match with the ideas presented in the book.
Processing was developed by two students from MIT Media Lab to teach computer programming concepts for architects and artists.However, due to its full potential, it is now widely used for professional language in architecture, arts and computing itself, in areas such as embedded systems and artificial intelligence, as can be seen in the tutorials and examples found on the internet.At this moment, there are different versions available for Processing.The latest version, 2.0, was released in June 2013.For this project, version 1.5.1 was chosen, since it was the most stable version when the translation process started.In theory, the codes developed in this version can run in future ones, since only the most basic aspects of the language are used.More information about the language and its development environment can be found and downloaded for free from Processing website.

Methodology
The development methodology adopted for the project involved the following stages:

Preliminary study
A preliminary research was conducted on programming languages in general and Processing specifically.As it is possible to see by this article's references, many books on Processing have recently been published.However, they look more like manuals than text books.The most effective way to get objective information proved to be on the Processing forum.In this forum one can ask for help and suggestions, ask questions to other more experienced programmers and discuss technical aspects of the language.Many applets, applications and development environments for Processing were found on the Internet, which confirmed that this language is very popular.

Analytical phase
The second phase consisted of creating an online support website for Processing users.The site was created with an open source online Content Management System, (Concrete 5), which allows using add--ons for inserting content, such as text, images and even computer codes.The website was divided in two parts: Languages and Projects.On Languages, a page describing Processing presents a brief description of the language, with links to online resources that had been previously identified, such as websites, e--books, videos, and apps for tablets.
The Projects page contains a sub--page that introduces the book The Art of Computer Graphics Programming and its authors.In this page we included links for each chapter of the book, as well as to a page explaining how the information is organized and how the website should be used.
The idea is to add other computer languages and translation projects to the websites in the future.

Implementation phase
In this step, the following procedures were performed for each code in the book: During the translation process, many issues arose.They were solved by consulting e--books, by posting questions on the online forum, or even by using the tablet application.A total of 199 small programs were translated into Processing (Table 1).

Evaluation phase
When all the pages are finished, the website will be evaluated by potential users in terms of usability and contribution to the teaching of computational design concepts.
Four examples of translated programs and their resulting graphics are presented in Figure 1.

Discussion
During the completion of the translation some conceptual differences between the Pascal and Processing programming languages were found.Some of them did not cause relevant differences in the codes, such as the orientation of the coordinate axes being opposed.However, we realized that some exercises in the book should be moved to later chapters because, although they involve very basic concepts in Pascal, they require a bit more knowledge in Processing.This can be exemplified by the function that takes input values: in Pascal it requires just a simple command line asking for the input value, but in Processing it requires a function.A document explaining these differences will be included in the website.Despite these observations, the translation of Pascal codes into Processing was considered to be very feasible, allowing the examples and exercises in the book to maintain their original pedagogical aims.
The choice for the Processing language over other languages surveyed (such as C, Java , Python , Design By Numbers, POV Ray and Cinder) proved consistent as it is a programming language that has focused on teaching since it was conceived.The pedagogical aspect was one of the main issues considered of the present work, as well as in the book.The authors not only sought to teach programming techniques, but also intended to propose a new, computational way of understanding architecture.Thus, one of the challenges of this work was to preserve the originality of the contents of the book, focusing on the fact that it was one of the first to emphasize the importance of programming knowledge for the contemporary architect.

Conclusion
Despite the use of an obsolete language, The art of computer graphics programming remains a useful guide to learning programming for anyone, not just architects.Its pedagogical way of teaching each concept based on the previous is unique and could inspire other computer science educators.Moreover, the relationships established between computational concepts and architectural design in the book remain an important and actual issue, so we expect that the translated version of the codes will make it possible to give this book again the credits and the consideration it deserves.
a. Translating the code from Pascal to Processing, using Processing's Integrated Development Environment --IDE; b.Generating an output image; c.Writing comments on the implementation of the code;d.Pasting the translated code and corresponding image in the corresponding chapter's page, and adding comments about the translation process.In some cases, a flow chart was also created to help explaining the code structure.

Figure 1 :
Figure 1: Four examples of translated programs and the resulting graphics.

Table 1 :
. Programs translated from each book Chapter