47
Independent Coursework Teaching Tools for CS 101 courses, comparing Processing and BlueJ von Thomas Staubitz Berlin, 02.03.2010 HTW Berlin Fachbereich 4 Wirtschaftswissenschaften II Internationaler Studiengang Medieninformatik Betreut von Prof. Dr. Debora Weber-Wulff

ICW Processing BlueJ

Embed Size (px)

DESCRIPTION

Teaching Tools for CS 101 courses, comparing Processing and BlueJThis paper is comparing the tools BlueJ and Processing regarding their suitability as tools for teaching programming to programming novices. It will be investigated a wide variety of aspects such as concepts, usability, documentation, community support, etc.

Citation preview

Page 1: ICW Processing BlueJ

Independent Coursework

Teaching Tools for CS 101 courses, comparing Processing and BlueJ

von Thomas StaubitzBerlin, 02.03.2010

HTW BerlinFachbereich 4Wirtschaftswissenschaften IIInternationaler Studiengang Medieninformatik

Betreut von! Prof. Dr. Debora Weber-Wulff

Page 2: ICW Processing BlueJ

AbstractTeaching Tools for CS 101 courses, comparing Processing and BlueJ

This paper is comparing the tools BlueJ and Processing regarding their suitability as tools for teaching programming to programming novices. It will be investigated a wide variety of as-pects such as concepts, usability, documentation, community support, etc.

This paper is partially based on practical experiences I made while teaching programming using Processing in Grundlagen der Informatik1, Adobe Flash in Programmierung2 and observa-tions by Dr. Weber-Wulff in her CS 1013 course using BlueJ.

Unterrichtswerkzeuge für Informatik 1 Kurse, Processing und BlueJ im Ver-gleichDas Ziel dieser Abhandlung ist es, zu untersuchen in wie weit Processing und BlueJ als Werkzeuge für den Programmierunterricht von Programmieranfängern an einer Hochschule geeignet sind und was es bei ihrem Einsatz zu beachten gilt. Dabei wird versucht ein umfas-sendes Bild darzustellen, einschliesslich der Aspekte: verfolgte Konzepte, Usability, Doku-mentation, Community Support usw.

Diese Abhandlung basiert teilweise auf meinen eigenen praktischen Erfahrungen mit Proces-sing sowie Dr. Weber-Wulffs Erfahrungen mit BlueJ.

1 Interaction Design / Games Design, HTW Berlin

2 Kommunikationsdesign, HTW Berlin

3 Internationale Medieninformatik, HTW Berlin

Page 3: ICW Processing BlueJ

Table of Contents

............................................................................................1 Introduction! 1

................................................................................................2 Objective! 1

....................................................................................................3 History! 2

...............................................................................3.1. Logo - Design by Numbers! 2

...................................................................................................................3.2. Blue! 3

................................................................................................4 Concepts! 5

......................................................................................4.1. Bottom Up - Top Down! 5

...........................................................................................4.2. Sketches - Projects! 5

...........................................................4.3. Target Groups and Learning Objectives! 5

.................................................................................................5 Usability! 7

.............................................................................................................5.1. IDE GUI! 7

..............................................................................................................5.2. Export! 14

................................................................................................5.3. Learning curve! 16

...........................................................................................................5.4. Stability! 16

...........................................................................................5.6. Library integration! 17

.......................................................................................6 Transferability! 18

.................................................................................6.1. Programming Language! 18

.............................................................................6.2. Integration with “real” IDEs! 19

..................................................................................6.3. Switching to “real” IDEs! 20

............................................................6.4. Usage outside of the teaching context! 21

..............................................................................7 Group work support! 22

........................................................................8 Testing and Debugging! 23

Page 4: ICW Processing BlueJ

................................................................................................9 Add-ons! 24

.........................................................................9.1. Websites and Documentation! 24

.....................................................................................................9.2. Community! 25

...................................................................................9.3. Resources for teachers! 26

..............................................................................................................9.4. Books! 26

...................................................................................9.5. Similar or derived tools! 28

................................................................................................10 Survey! 36

............................................................................................11 Summary! 40

.....................................................................................................Glossary! i

..............................................................................................Bibliography! iii

Page 5: ICW Processing BlueJ

1 IntroductionAs teaching programming to beginners has its special needs, a couple of efforts have been started in recent years to develop programming tools that support these. Two of the most popular tools have been chosen to be compared in this study, BlueJ and Processing. Their strengths and weaknesses will be investigated, and the purposes for which they are specially qualified.

Nowadays programming is not only part of computer scientists’ (CS) education, but is also an obligatory part of many other university programs such as design or arts. Naturally, the learning objectives will differ in certain aspects, also the students’ previous knowledge and their perception of certain concepts will be different. While CS students need to gain deeper understanding, for example of object oriented concepts, it might be enough for art students to scratch on the surface. While CS students can be expected to be content with command line input and output4, arts students are very visually oriented and just cannot figure out what is the use of printing some result to the command line.

BlueJ and Processing cover exactly these issues. While BlueJ visualizes object-oriented pro-gramming (OOP) concepts in an UML-style form, Processing provides the means to produce good-looking visual output with the least possible obstacles.

2 ObjectiveThe objective of this paper is to give an introduction to BlueJ and Processing for teachers that are looking for new ways of teaching CS101 courses.

!

1

4 They often also prefer to see something, but they get used to it after a while

Page 6: ICW Processing BlueJ

3 History3.1. Logo - Design by Numbers

The history of special educational programming tools dates at least as far back as to the 1960s. Seymour Papert invented Logo — a Lisp-based programming language especially de-signed to teach children programming. His intention was to revolutionize the teaching of maths5 by means of teaching programming. In his book Mindstorms - Children, Computers, And Powerful Ideas he points out that a similar revolution in teaching maths took place when Gutenberg invented printing and thus provided the medium for enabling teaching Des-cartes’ theories. [1, p.11] In the nineteenth century mathematics was perceived as the missing link between humanistic and realistic culture, between arts and sciences. This got increas-ingly replaced by a strong focussing on science and technology accompanying the industrial revolution. In Papert’s opinion computers are the means to put mathematics back into this role as they will, if used according to his ideas, enable more children — or more general: people — to understand some more advanced concepts of mathematics. [1, p.12] In this re-spect Processing might be called the intellectual grandchild of Seymour Papert, as it tries to close the gap between arts and science again. It also stands in the tradition of his works as it is a tool that tries to attract the more visual oriented part of humankind. [1, p.14]

From computer scientists a certain ability of abstraction can be expected6. Visual oriented people on the other hand do not feel too comfortable with this kind of abstraction. As I have experienced it, it is difficult for them to see the sense in simple examples that print some re-sult to the console7. Processing steps into this gap as it provides very simple and easy to use facilities to create direct visual representations of a concept. Referring to Piaget’s idea of as-similation and accomodation, Papert states that everything can easily be learned if it can be integrated into previous knowledge. [1, p.22] Learning programming by programming visu-

!

2

5 He also claims that learning programming will improve learning almost any other subject such as e.g. grammar [1, p.77]

6 Who else would watch soccer games as ASCII Live streams on telnet (telnet://ascii-wm.net:2006, http://photos1.blogger.com/blogger/2836/3052/1600/ascii-football.png, or to quote Cypher from Matrix: You get used to it. I...I don't even see the code. All I see now is blonde, brunette, redhead

7 I experienced this when I taught Programming in Flash/Actionscript to Communications Designers at HTW Ber-lin. Following are two quotes from students that have attended this course, and took part in the online survey that has been carried out during the process of this study (see chapter 11)

Flash (necessity to stick to the command line for a while to keep things simple and concentrate on the concepts):

...haben sie sich echt bemüht uns Designern etwas beizubringen, nur waren ihre Beispiele wenig plastisch ...

Processing (direct visualization):

... visual output is quickly possible to see and understand, --> motivation for a designer...

Page 7: ICW Processing BlueJ

als is a good way to get started, as known concepts of drawing and time can easily be inte-grated providing rather impressing results quickly.

Processing’s direct predecessor is Design By Numbers (DBN). DBN was devel-oped by John Maeda at MIT’s Aesthetics and Computation Group8. Casey Reas and Ben Fry both worked on DBN and refined it to become Processing. DBN is available as a web application or as a lo-cal standalone application. The devel-opment of DBN started in 1999 and ended in 2003. Figure 1 shows the web based version of DBN. It is visually very similar to Processing, and can also be regarded as the link between Processing

and Logo, as DBN’s syntax and wording are very Logo-like. DBN was one of the first efforts to provide a tool tailored for the needs of educating artists and designers in programming.

“Design By Numbers was created for visual designers and artists as an introduction to computational design. It is the result of a continuing endeavor by Professor John Maeda to teach the “idea” of computation to designers and artists. It is his belief that the quality of media art and design can only improve through establishing educational infrastructure in arts and technology schools that create strong, cross-disciplinary indi-viduals.” [2]

There also was a courseware available that enabled teachers to input problem statements, and students to work with DBN, saving their solutions directly on a server. Thus students could collaboratively view and discuss their work9,10.

3.2. Blue

Michael Kölling and John Rosenberg started to work on a first-year object-oriented teaching language and environment around 1995. They published a paper describing the require-ments for such a language at SIGCSE'95 in Nashville, Tennessee. In this paper they had evaluated a couple of languages such as C++, Sather, SmallTalk and Eiffel for their effective-

Figure 1: Screenshot Design By Numbers

!

3

8 http://acg.media.mit.edu/

9 http://dbn.media.mit.edu/courseware.html

10 http://www.openprocessing.org might be regarded as the successor of this concept

Page 8: ICW Processing BlueJ

ness as first year teaching languages. None of them completely fit their needs, so they de-cided to implement their own language and called it Blue. [4] Java was not invented before 1994 and probably therefore was too new to be considered. The most common critique to all the examined languages was that, due to more or less inconsistencies in the design of all these languages, teachers are forced to handle a couple of different other topics before they can finally start to talk about objects. Even more than the need for a special teaching lan-guage they felt the need for a special teaching IDE (Integrated Development Environment). In their opinion the available professional IDEs were way too complex for novices. OOP without using an IDE, just using a text editor and a few tools such as a compiler, make, etc., is a catastrophe11. [3]

They started to think about using Java around 1997, but at that point the work on Blue had made some progress yet. They also missed generics in Java, which was not introduced until Java 1.512. [5]

In 1999 Michael Kölling published his dissertation about The Design of an Object-Oriented En-vironment and Language for Teaching. Then the environment was still called Blue and sup-ported the Blue programming language. Apart from that, most of the functionalities that are available now in BlueJ, were available in Blue yet. It also looked very similar yet.

According to the theory that you always have to throw away the first system [6], Kölling thought about a complete rebuild of Blue. [7, p. 184] Furthermore, problems appeared port-ing Blue to Windows and Mac OS. [7, p. 186] These, and also the immense popularity of Java at that time were some of the reasons why Kölling switched to Java and started the imple-mentation of BlueJ around 1999. In 2004, with the release of Java 1.5, generics were added to the Java language, thus eliminating the last existing obstacle.

!

4

11 Though still widely common in certain programs, as my survey revealed.

12 Release Date: 2004 http://java.sun.com/j2se/codenames.html

Page 9: ICW Processing BlueJ

4 Concepts4.1. Bottom Up - Top Down

Processing has a very much bottom-up, hands-on approach: Learning by doing; get things done quick and dirty. This again stands in the tradition of Seymour Papert and constructiv-ism: Learning by making mistakes. During my course, I experienced that students tried to find solutions for better structured programs on their own. They soon got dazzled by the amount of functions and variables to be handled and tried to use Processing’s tabs (see chap-ter 5.1.4) to structure their code. When they learned about objects a week later, they were soon convinced by the advantages of this concept. This still does not mean that they under-stood any OOP concepts, as in this phase objects are not much more than means to structure code.

In BlueJ on the other hand students do not write much code during the first couple of les-sons. They are supposed to interact with objects and their methods using the unique features BlueJ is offering to accomplish this. In this BlueJ is definitely very close to the objects-first paradigm. Students then are supposed to read and alter existing code. BlueJ has a strictly topdown approach, a software engineering kind of view: Read first, then do; understand the theory first then put your hands on it.

4.2. Sketches - Projects

Programs written in Processing are called sketches and they are stored in a sketchbook13. It is like taking electronic notes to get a first visual impression of what will have to be done. Later on they can be refined in a more elaborate environment. In the same way artists do a couple of drawings before they start to work on an oil painting.

The equivalent in BlueJ is called a project. Projects are engineered; projects need to be planned.

4.3. Target Groups and Learning Objectives

As mentioned in the introduction, the learning objectives as well as the target groups for these two tools are different. The similarities are that both tools provide an easy to use, sim-ple interface that tries to support programming novices in a way that they are able to concen-trate on programming itself, without being distracted by a complex IDE while still offering more convenience than a simple text editor.

!

5

13 Another reference to Seymour Papert: He used the term electronic sketchbook in [1, p.36]

Page 10: ICW Processing BlueJ

Processing aims at artists and designers. It provides means for fast and easy visual output and user interaction. The price to be paid for this is a rather weak implementation of OOP concepts. I would rather describe it as object-based programming than as object-oriented programming. Programs can be completely written in a procedural way. Processing distin-guishes two different kinds of classes: Standard Processing Classes (SPCs) — recognizable by their .pde suffix — and Plain Old Java Classes (POJCs) — recognizable by their .java suffix.

Processing internally translates Processing code to Java code. During this translation SPCs are converted to inner classes. They therefore do not support concepts such as static14 and private15. POJCs do support static and private as they are not touched. If Processing func-tions such as rect(...), println(...), etc., are meant to be used inside a POJC, it gets a bit tricky though.

Processing is probably not the tool of choice if the courses learning objectives are a deeper understanding of OOP concepts or producing proper class architectures. Apart from arts or design classes it can be used very effectively e.g. in computer vision or image processing classes as it provides very easy access to cameras, images, etc.

BlueJ definitely is the tool of choice when it comes to teaching clean OOP concepts and mod-eling class architectures. The visualization of structures and concepts helps a lot to under-stand these otherwise rather abstract topics. Furthermore it introduces students to planning and documenting their projects with UML-style diagrams and even Model Driven Develop-ment (MDD).

!

6

14 produces an error

15 is ignored

Page 11: ICW Processing BlueJ

5 Usability 5.1. IDE GUI

Note: All user interface research took place on Mac OS X (10.5, 10.6) machines. The exam-ined versions of the tools were Processing 1.0.7 and BlueJ 2.5.2.

5.1.1. BlueJ - Main Window

Working with Objects

After loading an existing project, BlueJ’s main window displays the project’s structure in an UML-like diagram. Right clicking one of the classes UML representations opens a contextual

menu offering a couple of choices, such as creating a new object based on the class, compil-ing the class, or opening the edi-tor (Figure 2-➊). If it was selected to create a new object (Figure 2-➋) a popup window allows for specifying the name for the object to be created. Pressing the OK button finally creates the new ob-ject, which is then displayed in the object bench (Figure 2-➌). Right clicking the object in the object bench offers another popup menu, which allows calling of the object’s methods. Calling an ob-ject’s method will actually exe-cute it (Figure 2-➍). If necessary, a popup window will be displayed, allowing the user to enter pa-rameters.

Working with Classes

To create new classes in an exist-ing or a new project, click the

New Class button on the left of BlueJ’s main window. A popup window will appear (Figure 3-➊). Specify the new class’ name and type (Class, Interface, Abstract Class,…) and click OK.

Figure 2: Working with Objects

!

7

Page 12: ICW Processing BlueJ

The new class will be created and displayed in BlueJ’s class structure panel in the main window (Figure 3-➋). The blue stripes in the new classes box indicate that it needs to be compiled first. Opening the source code edi-tor window will show that a basic class stub has been generated automatically (Figure 3-➌). Similar to tools for Model Driven Devel-opment, BlueJ offers a couple of buttons to add inheritance and dependency relation-ships. At least the inheritance relationship is automatically applied in the according source code.

JUnit tests

Right clicking a class’ UML representation also offers the choice to create a JUnit test class (Figure 4-➊). By right clicking the generated test class, test methods can be added (Figure 4-

➋, ➌). Creating a test method will automatically start a recording (Figure 4-➍). If we create a new Object from the class to be tested and call the method to be tested (Figure 4-➎, ➏) a popup window to specify the expected results will appear (Figure 4-➐). When the “End recording” button is pressed, the recorded assertions will be added to the test methods (Figure 4-➑). The JUnit test can be run now by pressing the “Run Tests” button on the left of the Main Window and will display if the tests have passed or not. See also Section 9 “Testing and Debugging”.

Figure 3: Working with Classes

Figure 4: JUnit

!

8

Page 13: ICW Processing BlueJ

Source Code Management / Team Tool

BlueJ also offers a source code management tool supporting both CVS and SVN. By default this tool is deactivated to keep the UI free of clutter. If made ac-tive in BlueJ’s preferences it of-fers a simple interface to check-out, update, and commit sources (Figure 5).

MenuBar

BlueJ’s MenuBar offers the stan-dard Mac OS X items in the “BlueJ”(Figure 6-➊) menu. It is interesting that there are some

inconsistencies to the Mac standards in the “Project”(Figure 6-➋) and

“Edit” (Figure 6-➌) menus. BlueJ’s “Pro-ject” menu corresponds to what would be the “File” menu in most other Mac applications. On the first glance the “Edit” menu seems to be some extended “File” menu offering options for adding new classes, packages, and adding classes from file. This is a bit irritating, even taken in account that the BlueJ team does not consider classes and packages as files but as concepts. It just does not fit into the edit menu, where options such as redo, undo, find, re-place, cut, copy, etc., are expected. The “Tools” menu offers support for compil-ing, JUnit testing (Figure 6-➎), Teamwork/SCM (Figure 6-➍), and Pro-

ject Documentation. Finally “View” (Figure 6-➏) and “Help” (Figure 6-➐) menu offer

nothing surprising. Depending on the active

Figure 5: Team Support

Figure 6: BlueJʼs menus and the corresponding buttons in BlueJʼs main window

!

9

Page 14: ICW Processing BlueJ

window the contents of the toolbar are changing. See the descriptions of the according win-dow for more details.

5.1.2. BlueJ - Source Code Editor

The Editor

The source code editor offers a couple of buttons such as Undo, Cut, Copy, Paste, and Find. These are self explanatory. A more interesting feature is the possibility to switch directly between the source code and the always auto generated javadoc (Figure 7-➊). Each class opens in a separate win-dow, which can be addressed using the UML-like project visualization in the main win-dow. Editing the source code automatically results in blue stripes in the classes UML representation, indicating that it needs to be recompiled first (Figure 7-➋).

It is unclear why BlueJ, like so many other IDEs, has line numbers turned off by default, this feature

should always be enabled to permit easy discussion of the code.

The MenuBar

As mentioned before different BlueJ windows offer different menu bars. The editor window’s menu bar also shows some inconsistencies to standard Mac applications. Again what should be the “File” menu is called the “Class” (Fig-ure 8-➊) menu. The “Edit” (Figure 8-➋) menu offers the expected options in this case. One would also expect the Find and Replace options, which can be

found in the “Tools” (Figure 8-➌) menu, in

Figure 7: Source code editor

Figure 8: MenuBar when Editor is active window

!

10

Page 15: ICW Processing BlueJ

the “Edit” menu. The “Options” (Figure 8-➍) menu finally is a rather unnecessary shortcut to the preferences pane — which is available in the same depth of hierarchy in the “BlueJ” menu where it belongs [8] — and the key bindings, which normally should be found in the preferences pane, and in my opinion do not deserve that amount of special attention.

5.1.3. Debugger

Clicking in the source code editor’s line numbers column, toggles breakpoints. BlueJ offers a simple debugger to step through the code. The debug-ger is very easy to use and clearly arranged. Similar to the other windows the de-bugger offers its own menu bar, displaying only an op-tions menu.

5.1.4.Terminal and CodePad

BlueJ also offers a Terminal window to communicate with your application (Figure 9). Furthermore, there is a Code-Pad to do some quick and dirty evaluations (Figure 10).

Figure 9: The Debugger

Figure 10: CodePad

!

11

Page 16: ICW Processing BlueJ

5.1.4. Processing

To mention the negative first, Processing does not adhere to the Mac philosophy of having the menu bar at the top of the screen rather than as a part of the window16. The main window consists of the menu bar (Figure 11-➊), an addi-tional button bar (Figure 11-➋) pro-viding shortcuts to the most used actions, the tabs panel (Figure 11-➌), the text editor panel (Figure 11-➍), a status line (Figure 11-➎) displaying error messages if necessary, the ter-minal panel (Figure 11-➏), and an-other panel displaying the line num-ber of the current caret position.

Apart from the menu bar being part of the window and the missing (!) line numbers the UI design leaves

little to be desired in terms of simplic-ity and clarity. The “Processing” (Figure 12-➊)

menu offers no more and no less than the ex-pected. Figures 12-➋-➎ show Processing’s other menu options and their corresponding but-tons in the UI’s main window. The Export option at the “File” menu (Figure 12-➋) defaults to exporting applets. If it was chosen to export an application, a popup window will ask for which operating system the application will be optimized (Mac OS, Windows, Linux). There will be a closer look on the “Tools” (Figure 12-➍) menu later on; the rest of the menu options are self explaining. The little arrow on the right side of Processing’s main window offers op-tions for adding, renaming and deleting tabs. Tabs are a means of structuring code. They are intended to be used as the place to write classes. It is also possible to use them for structuring procedural code — an option which I personally do not like at all, but has been used by my students frequently — writing for example all variable declarations in one tab, the functions

Figure 11: Processing main window

!

12

16 This has been taken care of in version 1.0.9

Page 17: ICW Processing BlueJ

in another, etc. Running a sketch that contains no code at all, re-sults in the creation of an empty window with a default size of 100x100px displaying a default background color of some neu-tral grey (Figure 12-➐). Adding a println() (Figure 12-➑) statement will print the results to the ter-minal part of the main window (Figure 12-➒). The terminal also will display the error stack if an error occurs.

The “Tools”(Figure 12-➍) menu provides a couple of very handy options such as correcting the indentation of the source code (Auto Format), creating a bitmap font from a system font (Figure 13), selecting colors (Figure 14), zipping the sketch (Figure 15), and fixing the character encod-

ing.

Figure 14: Processing color selectorFigure 13: Processing create fonts

Figure 15: Processing archive

Figure 12: Processing menus

!

13

Page 18: ICW Processing BlueJ

5.2. Export

Both tools support superb and easy to handle export functionalities. BlueJ generates a run-nable .jar as well as javadocs with a single click. While the user is asked where to save the .jar file (Figure 16) the javadocs are automatically gener-ated in the project folder (Figure 17).

Figure 17: BlueJ location of the javadocs

Processing offers a simple way to either export an applet or a couple of — plat-form specific — applications. When it is chosen to export an applet, an HTML page is also generated. It is embedding the applet and displays all comments that have been added in doc style (Fig-ure 18-➊):

/**

Sketch drawing a static robot

*/

It is important to note that the line breaks are essential. Otherwise the fol-lowing code is displayed on the HTML

page. This is considered a bug and has

Figure 16: BlueJ exporting a runnable .jar

Figure 18: Processing export applet

!

14

Page 19: ICW Processing BlueJ

been reported to the Processing team.

Figure 18-➋ shows a listing of the files that have been created while exporting the applet. Note that the .pde gets translated into plain Java first before being bundled as a .jar file.

Figure 19 shows the process of exporting an application and the files that are generated.

Figure 19: Processing exporting an application

!

15

Page 20: ICW Processing BlueJ

5.3. Learning curve

The use of Processing can be learned in about an hour if the user has no experience at all. This concerns only the User Interface of course. First visible results can be achieved in about the same time. In the following I’ll show some results that have been achieved by a couple of my students with no or only little previous programming experience within the first lesson. These are static drawings without animation or interaction yet. None of them had ever used Processing before; some of them have had programming classes in school or at other Univer-sity courses before. Their second assignment was to animate these characters. By the end of the semester, after three more introductory exercises, they were able to program little arcade style games.

Figure 20: Results from students first lesson assignments

Of course learning to program cannot be achieved in that short amount of time. Processing is definitely not a wondertool, but at least it does not put any obstacles in the students’ way.

BlueJ supports more features and therefore takes a little more time to learn. Still it is as easy as can be for the complexity of features it supports. The possibility to turn off a couple of ad-vanced features — such as team support — for beginners is great.

5.4. Stability

Some major problems occurred with Processing Video and Mac OS’ poor Java integration. The video plugin only works if Java 1.5 32-bit is enabled as the preferred Java Runtime. !

16

Page 21: ICW Processing BlueJ

Normally, it is no big deal to switch to this version using the Utilities/Java preferences tool. Un-fortunately the Snow Leopard update deinstalls Java 1.5 completely. On Mac OS X Leopard this was considered a minor problem. On Mac OS X Snow Leopard it was about half a day of research and work to figure out what the problem was and how to solve it.

One of my students, running Mac OS on a Dell PC could not add tabs and lost some of her data a couple of times. Another student complained about Processing’s performance on Linux.

There have not been any complaints about BlueJ so far.

5.6. Library integration

Both tools allow users to write and integrate their own libraries for special purposes.

For more details see:

! http://www.bluej.org/doc/writingextensions.html

! http://dev.processing.org/libraries/

Both tools offer a possibility to share these extensions online. Some of these extensions are already included in the standard distributions.

! http://www.bluej.org/extensions/extensions.html

! http://processing.org/reference/libraries/index.html

Thus integrating user generated libraries is a relatively straight forward process.

BlueJ permits installing these extensions either for all users, all projects of a single user, or a single project, depending on the directory they are saved at17.

The way to add extensions to Processing is to add a folder called “libraries” to the folder that is specified as the sketchbook folder in Processing’s preferences. Extensions can now be added to this “libraries” folder. They are available for all sketches now, not only those in the sketchbook.

!

17

17 See http://www.bluej.org/extensions/extensions.html#install for details

Page 22: ICW Processing BlueJ

6 TransferabilityOne of the problems of tools that are specially designed for learning respectively teaching is that there will be a time when students have to switch to a full-fledged IDE or maybe even will have to learn an industry proof programming language. The next couple of pages will try to answer the question if the switch is necessary at all, when will it become necessary, and how easy can it be accomplished. In short: How is the tool’s transferability?

6.1. Programming Language

First the programming language supported by the tools will be looked at. In the case of BlueJ there is nothing much to say about this. It is nothing but plain old Java. No extras, no limita-tions. All that BlueJ does, is hiding those Java internals — such as the main method — which are obstructing the pure OOP spirit from the user.

The case with Processing is different. Processing supports its own programming language. The Processing programming language (PPL). The PPL is also Java based. In fact, all code that was written in the PPL internally is translated to standard Java and then of course into byte code. Processing in a way forces a procedural — or better: hybrid — approach of pro-

gramming onto Java. It is very easy to get students started with a pure procedural approach. They soon realize on their own (in my class it was with the third assignment) that functions and global variables are a rather insufficient way to structure code. They are keen on finding a facility to structure their code. Ob-jects come in very handy for that. This, obviously, has nothing to do with OOP yet, but as students see the opportunities offered by objects, they get accustomed to use them. Later on, in a second step, they can be illuminated with the real myster-ies of OOP such as inheritance, en-

capsulation, polymorphism, etc. Due to Processing’s inner structure — all

Figure 21: Encapsulation in Processing and Java classes

!

18

Page 23: ICW Processing BlueJ

classes are translated to inner classes in the resulting Java file — encapsulation unfortunately does not work, neither is it possible to use static variables. Many students will not even no-tice that this is a problem. You always need to keep in mind that Processing was not de-signed to teach computer scientists but rather to teach artists and designers the basics of pro-gramming.

For some students (and teachers) though, it is disappointing that encapsulation does not work as expected. Looking a bit deeper into the possibilities it turns out that this problem can be solved easily. Processing provides a very easy way to switch to standard Java classes. All that needs to be done is to add the suffix .java to the classname. Classes with the .java suffix will be rendered as standard Java classes. Standard Java classes that support proper encapsulation, and static fields and methods. This feature is kind of the missing link between Processing as a beginner’s toy and a mature programming tool.

Fig.21 shows the different encapsulation behavior of a Processing class (rendered is an inner class, Fig.21-➊ ) and a standard Java class (Fig.21-➋).

Learning about the insufficiencies of procedural programming, students are led step by step, hands-on to the benefits of OOP.

6.2. Integration with “real” IDEs

Processing can easily be integrated with both Netbeans and Eclipse. It is sufficient to include core.jar in the project build path18. Core.jar is the library that provides all the basic function-alities of Processing. On Mac OS it can be found in the package contents of the Processing.app. If more advanced components such as the video library are used, this proc-ess becomes increasingly tricky, as they also need to be added manually to the build path. A successful way to integrate Processing, OpenCV, and Netbeans/Eclipse in one project has been tried but not figured out yet.

To integrate BlueJ with Netbeans or Eclipse, plugins are available19. As with many Eclipse plugins, the process is rather tedious, unintuitive, and annoying. The bluEclipse plugin re-quires another framework to be working, which has to be collected from yet another website, etc. BluEclipse’s website looks kind of outdated. The last date visible on the page is “16-8-2004 [sic]”. The last Eclipse version mentioned is 3.0. I refrained from installing the plugin under these circumstances.

!

19

18 A detailed instruction how to do this can be found here: http://processing.org/discourse/yabb2/YaBB.pl?board=Integrate;action=display;num=1117133941

19 Netbeans: http://edu.netbeans.org/bluej, http://www.bluej.org/netbeans/tutorial/, http://java.sun.com/developer/technicalArticles/tools/bluej/index.html, Eclipse: http://www.csd.uoc.gr/~apapadak/

Page 24: ICW Processing BlueJ

Netbeans officially supports BlueJ. Unfortunately the Netbeans homepage still has not com-pletely recovered from its relaunch. Broken links and images are ubiquitous. The installation of the plugin is straightforward. The problem is it does not work at all. Tested with Netbeans 6.7.1 on Mac OS X Snow Leopard. Even an easy task, such as specifying the BlueJ Home di-rectory, is a major obstacle. It is necessary to dig deep into the BlueJ.app package. The FileChooser, which is provided to find the BlueJ Home does not support this digging. The whole process is anything but optimal. The process described in the tutorials fails to be com-pliant with reality right at the beginning: The described “BlueJ View” just does not show up anywhere.

6.3. Switching to “real” IDEs

Is the switch to a “real” IDE necessary at all?

For Processing it can be stated that considering the main target group (artists and designers) a switch is not imperative. Advanced users can easily integrate Processing into Netbeans/Eclipse to take advantage of these tools productivity enhancing features. Another question is if Netbeans or Eclipse are really probable candidates that this target group will switch to. More probable might be a switch to Flash — or, in the case of my game design students, to some kind of game engine, such as Unity or Unreal. Learning to use either Flash or a game engine is not trivial. The biggest problem with each of these tools is that they combine a cou-ple of different tasks, programming, asset management, timeline animation, etc. For unexpe-rienced users it can be very hard to find the reason why something is not working as ex-pected. Not only can the code be buggy, there is a plethora of things that can go wrong, which are not, or only marginally, related to the students’ coding. Knowing the basics of pro-gramming before entering this complex world is definitely an advantage. The switch to ei-ther of those environments will require to learn another programming language. Actionscript 3 is relatively similar to Java and the concept of hybrid (procedural+object-oriented) pro-gramming is common practice in Actionscript as well. Most of the game engines will require the knowledge of one or the other C dialect20.

As the deliberate reduction of features in BlueJ will become an obstacle for productive pro-gramming, the computer science students eventually will have to switch to another IDE. Ac-tually, in my opinion it would suit both, Eclipse and Netbeans, well if they supported the ba-sic model driven approach as well as the straightforward test case creation that have been implemented in BlueJ. Given these features were part of the IDEs, a switch could be rela-tively seamless.

!

20

20 C# in the case of Unity, C++ in the case of Unreal

Page 25: ICW Processing BlueJ

6.4. Usage outside of the teaching context

In this chapter it will be evaluated if and how each of the tools is actually used outside of the teaching context. This is done to confirm the previous chapter’s statements about the neces-sity to switch.

In the case of BlueJ the answer is straightforward: There is no relevant usage outside of the teaching context.

Concerning Processing there are plenty of artists that are using Processing as part of their daily work. To mention just a few:

Jared Tarbell

http://www.complexification.net/

http://levitated.net/

Martin Wattenberg

http://www.turbulence.org/Works/song/mono.html

Robert Hodgin

http://www.flight404.com/blog/

James Patterson

http://www.presstube.com/daily.php?id=837

[9]

!

21

Page 26: ICW Processing BlueJ

7 Group work supportProcessing has no built-in support for group work. There are webpages, such as http://www.openprocessing.org/collections/, though that offer the possibility to create col-laboration areas, enabling students to share and compare their work.

Figure 22: Classrooms at the OpenProcessing website

BlueJ enables teamwork by offering built-in SVN/CVS support. The feature is switched off by default to keep the environment clutter free. It can easily be turned on in the preferences. When using this feature, students have an additional workload of having to learn about ver-sion control and SVN/CVS of course. On the other hand, this is a very important topic and, in my opinion, is not discussed enough in universities at all. More information can be found here:

! http://www.bluej.org/doc/teamwork-tutorial-2.0.pdf

!

22

Page 27: ICW Processing BlueJ

8 Testing and DebuggingProcessing’s capabilities for debugging are rudimentary but straightforward. Error messages for syntax errors are displayed one at a time. For uncaught exceptions, etc., the message stack is displayed on the console. The preferred (only) tool to find logical errors is “println()”. This can be seen as positive or negative. Students do not have to worry about hassling with a de-bugger, but they also do not learn how to use one. Testing is not supported at all.

BlueJ offers an easy to use debugger. It is very intuitively to use, once you are into BlueJ’s workflow of creating objects and calling their methods. Furthermore, JUnit is neatly inte-grated and offers GUI-based test generation, a feature that would suit many of the full-fledged IDEs very good as well.

Figure 23: Errors and Exceptions in Processing

Figure 24: BlueJʼs Debugger

!

23

Page 28: ICW Processing BlueJ

9 Add-ons9.1. Websites and Documentation

BlueJ

The BlueJ website definitely could be improved in a couple of aspects. In my opinion it is not very intuitive to use. The main navigation could be more salient. The overall impression is a little disordered. Apart from that, all the essentials are provided. Basic info to get started with what it’s all about, a download page offering also links to the necessary JDK’s and in-

stallation instructions, and a huge amount of documentation: Refer-ence manual, extension API, many tutorials, and a couple of academic papers. It also offers a FAQ page, a public bug tracking system, and a form to request technical support. Furthermore a collection of links to other sources for extensions and other resources such as slides and exercises are provided.

Reference

The task of providing help in ques-tions of syntax is left to the standard Java API pages. On one hand, this makes perfect sense as the students are using plain Java. On the other hand, the Java API also has its issues, being rather overwhelming in its pure mass and sometimes rather cryptic descriptions. Maybe an ap-proach similar to Processing’s to pro-vide a more detailed documentation for a subset of Java, especially fitting the needs of beginners, might be

worth a consideration.

Figure 25: BlueJ Homepage

Figure 26: JavaAPI

!

24

Page 29: ICW Processing BlueJ

Processing

Processing’s website does not leave much to be wished for. It is very intuitive to use and has a visually attractive interface. It provides loads of inspiration by presenting selected works of

international artists and tons of links to related projects. It also provides a couple of tutorials to get started with, and a huge amount of examples. Furthermore, it provides pages that are compar-ing Processing to other programming languages on a basis of syntax examples, a list of related books, a download page, and a forum.

Reference

As Processing’s programming language is not plain Java, but only based on Java, Processing

cannot rely on the Java API. It supports its own API reference. Additional advantages: It is not as overwhelming as the Java API; the Detail pages are better structured than the Java API and pro-vide easy to understand descriptions as well as examples for all functions. It just looks a bit more as it might be something that can possibly be un-derstood by novices.

9.2. Community

Processing has a very strong online community. Processing sketches can easily be exported to the web. Many people are sharing their work via the

internet. [9, p.6] Either on their own websites, as se-lected works on http://www.processing.org, or on http://openprocessing.org, a platform to share projects for everybody. Openprocessing.org also offers the possibility to establish vir-tual classrooms to provide students a means of collaboration21.

BlueJ offers a mailing list22 and a google group23 ; for Java related problems it refers to the standard Java forums at SUN24.

Figure 27: Processing Homepage

!

25

21 http://www.openprocessing.org/collections/

22 http://lists.bluej.org/mailman/listinfo/bluej-discuss

23 http://groups.google.com/group/bluej-discuss

24 http://forums.sun.com/index.jspa

Figure 28: Processing Reference

Page 30: ICW Processing BlueJ

9.3. Resources for teachers

A textbook, intended to be used for teaching Java with BlueJ, is available (see 9.4). Additional material, such as slides and the sources for the example projects, are available as downloads on the BlueJ website. The provided slides fit exactly with the book so teachers can almost jumpstart a course. There is also a wide variety of materials provided by the community such as slides in German and French, some tutorials, high school course material, and exer-cises. All these materials also can be found on BlueJ’s website25. The slides that are accompa-nying the book are almost plug and play, the German and French slides are a bit overloaded and could at least afford some changes in their layout.

Most of the books that are available for Processing also offer an accompanying webpage with examples and the complete sources as a download. Daniel Shiffman, the author of Learning Processing, also offers a blog with additional information26.

There are also a couple of communities especially for teachers using Processing 27, 28.

9.4. Books

Objects First with Java - A Practical Introduction using BlueJ

David J. Barnes & Michael Kölling, Prentice Hall / Pearson Education, 2008

Compliant with BlueJ’s general philosophy of objects first, the book by David J. Barnes and Michael Kölling starts exactly with objects. It is strictly focused on concepts not syntax. Basic programming structures are left for later. Students start interactively experimenting with ob-jects and examining the associated code, adding some changes here and there to develop a feeling for programming. As has been described yet, BlueJ offers a fantastic set of tools to do this. During the following chapters, reading code is subsequently substituted by writing code, following the didactical concept of scaffolding. Chapter 2 handles fields and methods, chapter 3 handles the interaction of objects and the basic OOP concept of composition. In chapter 4 bigger object structures are discussed as well as collections, iterating over collec-tions, and for loops. Chapter 5 is focussed on documentation while also discussing more col-lections and randomness. Chapters 6 and 7 discuss how to avoid errors by well structured readable code, refactoring, comments, conventions. Chapters 8-10 are dealing with more ad-vanced OOP/Java concepts such as inheritance, polymorphism, abstraction, interfaces. Chapter 11 handles errors and exception handling while the final two chapters are dealing

!

26

25 http://www.bluej.org/resources/other.html

26 http://www.shiffman.net/teaching/

27 http://artandcode.ning.com/group/educators

28 http://groups.google.com/group/processing-educators

Page 31: ICW Processing BlueJ

with project planning and merging the individual parts of a project. As mentioned before, all the sources as well as a set of accompanying slides are available online.

The German translation of the book has been evaluated for this research. Unfortunately the translator felt the need to also translate the source codes into German. At least he admits that translating sources is dangerous. Still, he thinks that it was unavoidable29. [10]

The book is well structured. Different aspects of each chapter, such as the underlying con-cept, possible particularities in Java, possible traps, etc., are each highlighted in separate boxes.

Learning Processing: A Beginner's Guide to Programming Images, Animation, and Interaction

Daniel Shiffman, Morgan Kaufmann, 2008

This book was predominant source for the Processing course I am teaching at IDGD/HTW Berlin. It reflects the difference of Processing’s conceptual approach compared to BlueJ’s: Al-luding to BlueJ’s “Objects first” approach, it might be called an “Animation first” approach. The first chapters cover the stage and the display of objects on the stage. Colors, shapes, lines, pixels. Variables, basic control structures and functions are introduced. Classes and Ob-jects are covered not before chapter 8. More advanced OOP topics will appear towards the end of the book. All the covered topics are based on animated or interactive examples. Chap-ters 6-9 are dealing with applied programming such as image and video manipulation, some mathematics, translation and rotation in 2D and 3D, Text processing and I/O, and Sound. The book is intended to be a textbook accompanying a one semester programming course. It is a good start for beginners and was useful for the preparation of my course. It is also very useful for self-assigned studies, as it provides many exercises and even space to write in. It is well-structured and has many inspiring graphics, implying that there is fun in learning pro-gramming.

Processing: A Programming Handbook for Visual Designers and Artists

Casey Reas and Ben Fry, MIT Press, 2007

This is the book written by the inventors of Processing. Additionally to the units teaching programming and Processing, this book also offers a couple of essays and interviews with artists coming from a wide variety of fields. Their artwork is related to, or based on comput-

!

27

29 I definitely do not agree with him. English is the language of programming. Source code and comments have to be in English. Otherwise teamwork in an international environment is not possible. Readability for everyone in-cludes that code is written in English. Using the German language in source code in an educational textbook is not only avoidable, it is wrong.

Page 32: ICW Processing BlueJ

ers and software. The book features beginner’s topics as well as advanced topics, always re-lating the computational topic in an arts context. The target group are computer savvy artists and designers with little or no previous programming experience.

A complete list of available books on Processing can be found here: !

http://www.processing.org/learning/books/

9.5. Similar or derived tools

Mobile BlueJ

Not really a derived tool but rather a possible extension for BlueJ is the support of develop-ing applications for mobile phones. This can be activated in the preferences. The extension requests an additional wireless toolkit30.

Greenfoot

Greenfoot is another tool developed by the inventors of BlueJ. It is specialized on supporting the development of graphical applications in Java [11]. The UI is very similar to BlueJ. So is the way the user can interact with the tool. In Greenfoot you are dealing with the “the world” and its “actors”. On the main window’s right side the UML-like diagram presenta-

tion of those elements can be found. Right clicking opens a con-text menu and, exactly as in BlueJ, objects can be created interac-tively (Figure 29-➊). After creating the object, its graphic representa-tion pops up and can be dragged and dropped to the world’s graphic representation on the main window’s left side (Figure 29-➋, ➌). Right clicking the ob-ject’s placed graphic representa-tion (Figure 29-➍) offers possibili-ties to execute the object’s meth-ods, or to inspect the object’s

properties (Figure 29-➎, ➏). Each object’s source code can be displayed and edited exactly as in

BlueJ (Figure 29-➐).

Figure 29: Greenfoot

!

28

30 http://java.sun.com/products/sjwtoolkit/

Page 33: ICW Processing BlueJ

Greenfoot also offers a web-based community platform http://greenfootgallery.org/ to share scenarios while http://www.greenfoot.org/ offers downloads and documentation. Furthermore, there is an annual coding contest named CodePoint.

Figure 30: Greenfoot gallery and Greenfoot homepage

Arduino, Fritzing, Wiring, MobileProcessing

There is a whole family of Applications available that are derived from Processing. At least the UI of most of these tools is very similar to Processing’s.

“Wiring is an open source programming environment and electronics i/o board for ex-ploring the electronic arts, tangible media, teaching and learning computer program-ming and prototyping with electronics.” [12]

!

29

Page 34: ICW Processing BlueJ

Wiring builds on Processing and was developed at the Interaction Design Institute Ivrea31 in Italy. The software is free, the hardware costs about 60€ a piece.

Figure 31: Wiring interface and homepage

“Arduino is an open-source electronics prototyping platform based on flexible, easy-to-use hardware and software. It's intended for artists, designers, hobbyists, and anyone interested in creating interactive objects or environments.” [13]

Arduino also was developed at Ivrea. The software is free, the hardware costs about 25€ a piece.

Figure 32: Arduino

!

30

31 http://interactionivrea.org/en/index.asp

Page 35: ICW Processing BlueJ

“Fritzing is an open-source initiative to support designers, artists, researchers and hob-byists to take the step from physical prototyping to actual product. We are creating this software in the spirit of Processing and Arduino, developing a tool that allows users to document their Arduino and other electronic-based prototypes, share them with oth-ers, teach electronics in a classroom, and to create a PCB layout for manufacturing.” [14]

Fritzing is developed at the Interaction Design Lab at the University of Applied Sci-ences in Potsdam32. A starter kit is offered for 55€. The software is also free.

MobileProcessing is a standalone application to develop software for mobile phones. It re-quires an additional wireless toolkit33,34.

Processing.js35, Ruby-Processing36, Processing for Clojure37, and SPDE (Processing for Scala)38 are porting the idea of Processing to other programming languages.

Scratch, Alice

Finally a couple of tools will be presented, which have been encountered during the research. They have in common with BlueJ and Processing that they are tools to teach programming. The approach to achieve this goal, the target groups, and the output of these tools varies widely though. Scratch is developed at MIT. Alice is developed at Carnegie Mellon Univer-sity. Both of them are using graphical elements to represent programming structures such as

Figure 33: Fritzing homepage and starter kit

!

31

32 http://design.fh-potsdam.de/forschung/interaction-design-lab.html

33 http://java.sun.com/products/sjwtoolkit/

34 http://mobile.processing.org/

35 http://processingjs.org/

36 http://wiki.github.com/jashkenas/ruby-processing

37 http://github.com/rosado/clj-processing

38 http://technically.us/spde/About

Page 36: ICW Processing BlueJ

loops and conditions, etc. This approach is similar to Apple’s Automator. The users can as-semble their programs like a puzzle, being freed from the necessity to remind syntax details and thus being able to concentrate on the structure.

“Scratch is a new programming language that makes it easy to create your own interac-tive stories, animations, games, music, and art -- and share your creations on the web. Scratch is designed to help young people (ages 8 and up) develop 21st century learning skills. As they create and share Scratch projects, young people learn important mathe-matical and computational ideas, while also learning to think creatively, reason sys-

tematically, and work collabora-tively.” [15]

Figure 35: Alice

Figure 34: Scratch

!

32

Page 37: ICW Processing BlueJ

Alice follows a very similar approach to Scratch but targets an older audience. The results are 3D-animations and games39. There is plenty of additional material available, amongst others, a text book, workshops, course syllabi, exam questions, etc. 40

Figure 36: Appleʼs Automator

Pippy, Etoys

Pippy is an effort of the one laptop per child foundation41 to teach Python programming to younger students. A quote from their wiki:

“Teaches Python programming by provid-ing access to Python code samples and a fully interactive Python interpreter. The user can type and execute simple Python expressions. For example, it would be possible for a user to write Python state-ments to calculate expressions, play sounds, or make simple text animation. The initial build ships with about twenty short Python examples covering various aspects of the language.” [16]

Figure 37: Pippy homepage

!

33

39 http://www.alice.org/index.php?page=what_is_alice/what_is_alice

40 http://aliceprogramming.net/materials.html

41 http://laptop.org/en/laptop/index.shtml

Page 38: ICW Processing BlueJ

Etoys42 also is a tool to get started with using and programming the XO43. It is available for Linux, Windows, and Mac OS. It was invented by Alan Kay and is based on SmallTalk. Simi-lar to Alice and Scratch it supports graphical elements for programming structures. This is more than a tool to learn programming. It also can be used to create environments for chil-dren where they can learn a wide variety of techniques to get along in the (digital) world44.

DrScheme

Scheme is one of two Lisp dialects. It was developed at MIT’s AI Lab in the late 70’s. During the nineties the TeachScheme! (later PLT) project was founded. Its purpose is to provide peda-gogic materials for programmers. It was decided to produce a pedagogic programming envi-ronment: DrScheme. Meanwhile, DrScheme is a full-fledged programming environment that is often used to develop new programming languages. The following quote is from TeachScheme!’s manifest:

“TheTeachScheme! Project aims to reform three aspects of introductory high school courses on programming. The first is a systematic program design method. The key property of the method is that it asks students to design programs in a stepwise fash-ion. Each step produces a well-specified intermediate product. It thus gets students started and helps them to overcome obstacles. Furthermore, it empowers teachers to evaluate the reasoning process and not just the final product. The second novelty is the use of a series of increasingly powerful programming languages instead of a single (subset of a) language. Each element of the series introduce students to specific linguis-tic mechanisms and thus represents a cognitive development stage in a concrete man-ner. Consequently, the language implementations can provide knowledge-appropriate feedback when errors occur. The third new component is a program development en-vironment that was specifically developed for beginners. It supports the teaching lan-guages in a uniform manner and provides tools that assist with each stage in the cur-riculum…” [17]

!

34

42 http://www.squeakland.org/

43 http://laptop.org/en/laptop/index.shtml

44 One of the available tutorials: Demonʼs castle, reminds of the Young Ladyʼs Illustrated Primer that has been described by Neal Stephenson in his book Diamond Age [19]

Page 39: ICW Processing BlueJ

Figure 38: DrScheme

Figure 38 shows DrScheme running a script (Figure 38-➊) and stepping through a script (Figure 38-➋). PLT Scheme’s latest release was version 4.2.3 in December 2009. Today PLT consists of numerous people distributed across several universities in the USA. [18]

!

35

Page 40: ICW Processing BlueJ

10 SurveyA survey amongst students of various departments at HTW Berlin was conducted45. As in total only 49 students participated, this survey can only give a general impression and can-not be used to proof anything. The intention of the survey was to evaluate the students ‘ feel-ings towards the tools that have been used in their programs. If they had particular prob-lems, if the tools helped or thwarted them to learn programming, if they had fun learning programming, etc. It has also been tried to evaluate if the students had gender or age specific problems. Maybe due to the small amount of participants, there was no evidence for this to be the case. Therefore, the following diagrams will not consider these factors. The variety of tools that have been used for teaching programming in the various departments is displayed

in Figure 39. Obviously these courses differ not only concerning the tools that have been

0

10

20

30

40

Internationale Medieninform

atikInteraction Design / Gam

e Design

Komm

unikationsdesign

Angewandte Informatik

Wirtschaftsinform

atik

BlueJ Processing Eclipse JBuilder FlashXCode Visual Studio Text Editor + Commandline

Figure 39: Tools that have been used for teaching in CS101 courses

!

36

45 Internationale Medieninformatik (International Media and Computer Science), Angewandte Informatik (Applied Computer Science), Wirtschaftsinformatik (Business Information Systems), Kommunikationsdesign (Communica-tion Design), Interaction Design / Game Design

Page 41: ICW Processing BlueJ

used, but also concerning the depth of knowledge that has to be imparted respectively the amount of weekly hours that are supposed to be spent for each course. The programming class in the Kommunikationsdesign program takes place while the students are in their sixth semester, the other programs take place while the students are in their first (and second) se-mester. The participating students in the Internationale Medieninformatik program are from two different years, this is why part of them have used Eclipse while others have used BlueJ. Both years had an additional class (“Basics of interactive media”) where Processing was used.

Figure 40 displays the programming classes that had previously been taken by students. These are classes in high school, previous experiments at universities, and other institutions such as private schools or vocational schools. The numbers are just added up so there might

be students that took various classes. Interesting are the bars’ black elements, which symbol-ize students without any previous programming knowledge. Unfortunately, this is about all that the survey can reveal. The intention to find out more details about the students’ feelings completely failed as most of them prematurely quit the survey. The following diagrams are knowingly kept very general and have to be read extremely cautious. The tools that have ac-

0

7.5

15.0

22.5

30.0

Internationale Medieninform

atikInteraction Design / Gam

e DesignKom

munikationsdesign

Angewandte Informatik

Wirtschaftsinform

atik

Java C/C++ Pascal Delphi Logo ActionscriptJavascript PHP/Ruby/Python Other None

Figure 40: Previous programming knowledge

!

37

Page 42: ICW Processing BlueJ

tually been used in these courses can be found in Figure 39. Displayed in blue is the median value while the standard deviation is displayed in green.

0

1.25

2.50

3.75

5.00

Internationale Medieninform

atik

Interaction Design / Game Design

Komm

unikationsdesignAngewandte Inform

atikW

irtschaftsinformatik

Figure 41: Was the tool easy to use?

0

1.5

3.0

4.5

6.0

Internationale Medieninform

atik

Interaction Design / Game Design

Komm

unikationsdesignAngewandte Inform

atikW

irtschaftsinformatik

Figure 42: Did the tool help you learn programming?

!

38

Page 43: ICW Processing BlueJ

Figure 43: Did you have fun using the tool?

0

1.5

3.0

4.5

6.0

Internationale Medieninform

atik

Interaction Design / Game Design

Komm

unikationsdesignAngewandte Inform

atikW

irtschaftsinformatik

Though the values do not differ exceedingly, a certain tendency is visible. Especially Adobe Flash in the Kommunikationsdesign program is rated rather negative compared to Processing in the Interaction Design / Games Design program46. Further conclusions will not be drawn as the data basis is too small and random.

!

39

46 I only dare to state this as, apart from conducting the survey, I have been teaching both of these courses and this result fits exactly with what I have been observing during these classes.

Page 44: ICW Processing BlueJ

11 SummaryOne of the students stated in the survey:

“I think only programming itsself [sic] can teach you to programm [sic].”

There is nothing much to be added to this statement. No matter which tool will be used to teach programming, a major effort of both, the student and the teacher will be necessary to achieve a good result. A huge amount of tools to minimize this effort have been developed in the recent years. Two of them, Processing and BlueJ, have been examined in depth, others only have been briefly introduced in this paper.

Both, BlueJ and Processing, have their strengths and weaknesses. If they are used for the ap-propriate purpose, both of them are excellent tools to circumvent at least the worst obstacles of teaching or learning to program.

Programming consists of various concepts. Tools that help to separate these concepts into single tasks can be compared to a pulley system. The weight that has to be lifted does not get less, but the force that is necessary to lift it is less.

!

40

Page 45: ICW Processing BlueJ

GlossaryA)

AI - Artificial intelligence.

Alice - Programming teaching tool.

Arduino - Processing based programming tool and microcontroller.

B)

Blue - Programming language and teaching IDE. Predecessor of BlueJ.

BlueJ - Java based teaching IDE.

C)

core.jar - Processing’s core library.

CS 101 - First year computer course.

CS - Computer Science/Scientist.

CVS - Outdated version control system.

D)

DBN - Design by numbers. Predecessor of Processing.

DrScheme - Lisp based programming environment.

E)

Etoys - Teaching tool. XO.

F)

Flash - Adobe Flash. IDE, Authoring tool.

Fritzing - Processing based programming tool for mi-crocontrollers.

G)

Greenfoot - Programming teaching tool.

GUI - Graphical User Interface.

I)

IDE - Integrated Development Environment.

J)

JUnit - Unit testing library. Java.

L)

Leopard - Mac OS 10.5.

Lisp - Functional programming language.

Logo - Lisp based programming/teaching tool.

M)

MDD - Model Driven Development.

MobileProcessing - Tool to develop Processing applica-tions for mobile phones.

O)

OOP - Object-Oriented Programming.

P)

Pippy - Programming tool. XO.

PLT - Project enhancing the teaching of Scheme and programming.

PPL - Processing Programming Language.

Processing - Programming tool.

S)

SCM - Sourcecode Management System

Scratch - Tool to teach programming.

Squeak - see Etoys.

Snow Leopard - Mac OS 10.6.

SVN - Version control system.

U)

UI - User Interface.

UML - Unified Markup Language.

Unity - Game Engine.

Unreal - Game Engine.

i

Page 46: ICW Processing BlueJ

W)

Wiring - Processing based programming tool for micro-controllers.

X)

XO - Laptop introduced by the one laptop per child foun-dation

ii

Page 47: ICW Processing BlueJ

Bibliography[1]! Seymour Papert, Mindstorms. Kinder, Computer und neues Lernen , Birkhäuser, 1982 .

[2]! What is DBN?, http://dbn.media.mit.edu/whatisdbn.html, Retrieved: 01/22/2010

[3]! M. Kölling, J. Rosenberg, An Object-Oriented Program Development Environment for the First Programming Course, Proceedings of 27th SIGCSE Technical Symposium on Computer Science Education, 1995.

[4]! M. Kölling, B. Koch, J. Rosenberg, Requirements for a First Year Object-Oriented Teaching Language, Proceed-ings SIGCSE'95, 1996.

[5]! M. Kölling, J. Rosenberg, I/O Considered Harmful (At least for the first few weeks), Proceedings of the Second Australasian Conference on Computer Science Education, 1997.

[6]! Frederick Brooks, Mythical Man Month , Addison Wesley, 1972 .

[7]! M. Kölling, The Design of an Object-Oriented Environment and Language for Teaching, PhD Thesis Basser Department of Computer Science, University of Sydney, 1999.

[8]! Mac Dev Center: Apple Human Interface Guidelines: Menus, http://developer.apple.com/mac/library/DOCUMENTATION/UserExperience/Conceptual/AppleHIGuidelines/XHIGIntro/XHIGIntro.html, Retrieved: 12/26/2009

[9]! B. Fry, C. Reas, Processing A Programming Handbook for Visual Designers and Artists, MIT Press, 2007.

[10]! M. Kölling, D. Barnes, Objektorientierte Programmierung mit Java, Pearson Education, 2008

[11] ! http://www.greenfoot.org/doc/tutorial/tutorial.html, Retrieved: 02/19/2010

[12]! http://www.wiring.org.co/, Retrieved: 02/19/2010

[13]! http://www.arduino.cc/, Retrieved: 02/19/2010

[14]! http://fritzing.org/, Retrieved: 02/19/2010

[15]! http://info.scratch.mit.edu/About_Scratch, Retrieved: 02/19/2010

[16]! http://wiki.laptop.org/go/Pippy#Description_.26_Goals, Retrieved: 12/26/2009

[17]! http://www.plt-scheme.org, Retrieved: 12/26/2009

[18]! http://www.plt-scheme.org/who/, Retrieved: 12/26/2009

[19]! N. Stephenson, Diamond Age, Bantam Books, 1995

iii