List of blogs

Updated Feb 18th
Anton Dil
David Phillips
Anthony Fiore
Richard Brown
Neil Singh
Neil Keskar
Rob Spain
Ben Notarianni
Martin Prout
Stewart Edwards
Mike Taperell
Sharon Dawes
John Wilson
Paul Richards
Antony Lees Chunk 82 blog Chunk 13 blog
Rosie Wood
Mike Richards
Sheep Dalton
Darrel Ince
Ian Perkins
Davide Rizzo
Maxemilian Hilbrand
James Gray
Darragh Buffini
Barry Martin
Liam Madden
Neil Petrie
Grant Mankee
Bryan Clifton
Geoff Riley
Ian Macey
Alex Harris
Fokion Zervoudakis
Edward Toovey
Rosellyne Thompson
Jeremy Annis
Ian Welch
Jannetta Steyn
Roberto Vormittag
Shailesh S. Gokhale
Boyd Stratton
Nigel Parker
Ian Bryn Sadler
Paolo Greco
Marshall Heap
Antonio Bruno
Andrew Hancox
Dusan Licer
Mike Blamires
Anabela Green
JeanLuc Brausch
Rob Martin
Simon Perrins
Mark Moran
Paul Fisher
Rebecca Ewen
Christopher Douce
Bruce Lawley
Samir Rabab
Ebtessam Adam
Sheep Dalton
Graham Hall
Pat Jacobs
Mark Miller

Book Fragment 24

I have joined the writing team and have written fragment 24. It is reproduced below. It shows the general style that I would like you to aim at. I hope to do no more writing. There are some points to be made about the fragments themselves and which are illustrated in the text below:

• Try and use a bit of white space in your programs indentation etc.
• Use 'we' in the text. After all there are a large number of authors.
• Always try and back reference or forward reference bits of the book as in 'you will remember in page xx'; don't worry about page numbers I will fix them up when I edit the text.
• There's no harm in repeating a bit of program code.

There are some specific points to be made about the painful process of transferring your text to Blogger:

• First its quite a painful process transferring from MS Word, be warned.
• Second, figures are quite tricky to get into Blogger. When they are inserted they tend to be put into the top of your blog and you will then need to cut and paste.
• When you add a picture to your blog use the left option.
• There are only a few graphic formats that Blogger accepts; they are: jpg, gif, bmp and png.
• Indentation is a pain. As you will see in my entry I gave up indenting the Java programs. If anyone has a simple solution please let me know.
• Another pain is symbols such as 'less than' or 'greater than'. The best thing to do is to insert the HTML versions of the symbols. Click here for a list. Blogger will not process your blog if you have less than, greater than etc symbols in it.
  

Geometry and computer art

So far in this book we have concentrated on a number of introductory ideas, mainly concerned with programming. We are now going to change tack and look at some mathematics, although we will present some programs later. In order to develop interesting and sophisticated computer art you need to know a bit about geometry. In this and the next two sections we will give you something of a primer. You will also need to know a little about algebra to understand the text up to page xx. The good news is that there is not a lot of it.

Dimensions

In mathematics we talk about dimensions. Normally we talk about one-dimensional, two -nsional and three-dimensional figures. A point is one-dimensional and a line is two-dimensional. A point represents a location in space.

Figure 1 shows what we mean by a point and how we can uniquely identify individual points.

Figure 1: Two points and how to identify them

Imagine what you see is a very small computer screen which contains 49 pixels (7 by 7). If you are unsure about what a pixel is then have a look at page x. The screen is delineated by a pair of vertical lines and a pair of horizontal lines. The horizontal line at the bottom is known as the x-axis and the horizontal line at the leftmost position is known as the y-axis.

Each of the axes contain whole number that represent the position of a point on the screen; for example the point (3,5) is shown. This represents a position of 3 along the x-axis and a position of 5 along the y-axis. Similarly the point (2,3) represents the point which has a position of 2 along the x-axis and a position 3 along the y-axis. The key point to make here is that the coordinates uniquely fix the pixels in space and specify where they are.

In reality a computer screen and other digital devices will have hundreds of pixels, for example a HD video camera has 11 mega (million) pixels.

So these are points, what then are lines and how are they specified? Clearly a line cannot be specified by an x-coordinate and a y-coordinate. Look at Figure 2. This shows a line in the same coordinate system that was used in Figure 1.

Figure 2: A line joining two coordinates

Here we see a line that joins the coordinates (1,3) and (3,5). The two points specify the line. They show that it’s a short line and has two end points in that it does not continue on past the two end points. The line has an important property: its slope. This is the angle that it makes with the x-axis. In Figure 2 the angle is 45 degrees.

So is there anything more we need to know about lines? The first thing is that a line can be infinite it can stretch infinitely from one coordinate to another. The line in Figure 2 is quite short. So how can we specify a line that is infinite (or at least is bounded by a computer screen)?

We do this via an equation. The general form of the equation of a line is

y = mx+c

Here x is the coordinate of the x axis, y is the coordinate of the y axis, m is the slope and c is the point in the y axis where the x coordinate is zero (we call it the intercept). Let’s see how that works with a longer line. Have a look at Figure 3. The value of c is 2; this where it the line intercepts the y axis. The slope is 45 degrees. However, the value of m is not 45, why is this? The answer is based on trigonometry and that m is the tan of the angle. However, you don’t need to know this so if you know nothing about trigonometry it is worth describing m in another way.

Figure 3: An 'infinite' line

This is that m is represents by the ratio of the difference of any two x points and the corresponding y points. For example, since the line goes through the points (0,2) and (2,4). the slope can be calculated as

(4-2)/(2-0)=1

this gives an equation of

y=1x+2

remember that the intercept is 2; this can be easily simplified to

y=x+2

This is all you need to know about lines: that they can be expressed by a simple equation and the equation is defined in terms of a slope and a y intercept. The line relates x and y.

Once you have the equation of a line you can determine any point on it given an x value and a y value, for example in the line we have been looking at if the value of x was 3 then the value of y will be 5.

It is worth looking at a simple program to illustrate some of the ideas here; I will then look at a more complicated program. Here I use the Processing function line. This takes four arguments: the first two are the x and y coordinates of a point and the third and fourth arguments are the x and y coordinates of a second point. The function draws a line between them. A simple program that uses the function is shown below:

size(300,300);
background(255);
line(25,40,280,90);

There are three statements here. The first sets up a window that is 300 by 300 pixels in size. The second statement sets the colour of the background to be white. The final statement draws a line from the point (25,40) to the point (280,90). The display from the program is shown as Figure 4.

Figure 4: A line drawn by Processing

Have a look at the display and figure what is going on here. The line that has been drawn might be a surprise to you.

The line looks wrong. It should start at (25,40) which should be at the bottom left-hand side of the window. You may remember that the answer to this conundrum is that Java has a coordinate system which is completely different to those in use in mathematics. The point (0,0) does not start at the bottom left-hand corner but at the top left-hand corner. If you look at Figure 4 you will see that the leftmost part of the line is 25 pixels across but 40 pixels down and the rightmost part of the line is 280 pixels across and 90 pixels down. Always bear this in mind when developing graphics programs in Processing.

Now that we have given you enough information about drawing lines it is about time that we showed you the development of a rather more complicated program.

The program will draw a series of squares in different colours with the colour, the side of the square and the top leftmost coordinates being random. The main steps in the program are as follows:

Set up the window with a size and background colour
For a number of times
Randomly generate the length of a square
Randomly generate a colour
Randomly generate the top leftmost x and y coordinates
Draw the square

This is a simple design for the program. It leaves a number of questions open. The main one is how many squares will be generated? We shall assume that 20 will be generated. Rather than use the function rect that you met before on page xx we shall use line drawing instructions to generate the square. Another important question is what to do when an attempt is made to draw a square outside the drawing window? You will see a programmatic solution to this soon.

We will use a function random that generates a random number within a certain range.

Our program is shown below

//Set up drawing window
size(400,400);
background(255);
strokeWeight(2);

int noSquares = 20;
int xPosition, yPosition, squareLength;

//Generate a series of random squares
for (int j=0;j‹noSquares;j++){
stroke(random(255), random(255), random(255));
xPosition = round(random(200));
yPosition = round(random(200));
squareLength = round(random(200));
line(xPosition,yPosition,xPosition+squareLength, yPosition);
line(xPosition+squareLength,yPosition,xPosition+squareLength,yPosition+squareLength);
line(xPosition+squareLength,yPosition+squareLength,xPosition,yPosition+squareLength);
line(xPosition, yPosition+squareLength,xPosition,yPosition);
}

The first chunk of code sets up the window as being 400 pixels by 400 pixels in length and height, sets the background colour to be white (255) and specifies that the width of any line drawn will be two pixels.

size(400,400);
background(255);
strokeWeight(2);

The next part of the code just sets up some variables that are used to establish each square’s dimensions and position and define the number of squares that are to be drawn.

int noSquares = 20;
int xPosition, yPosition, squareLength;

The heart of the program is the loop that iterates twenty times generating random numbers and drawing the squares.

//Generate a series of random squares
for (int j=0;j
stroke(random(255), random(255), random(255));
xPosition = round(random(200));
yPosition = round(random(200));
squareLength = round(random(200));
line(xPosition,yPosition,xPosition+squareLength, yPosition);
line(xPosition+squareLength, yPosition,xPosition+squareLength,
yPosition+squareLength);
line(xPosition+squareLength, yPosition+squareLength,xPosition,
yPosition+squareLength);
line(xPosition, yPosition+squareLength,xPosition,yPosition);
}

The function stroke sets up the colour of the lines that are to be drawn; it takes the red, green and blue components of the colour. Since these are generated randomly a value between (0,0,0) (black) to (255,255,255) (white) can be generated. You will remember that the argument within the random function gives the range of the random number to be generated; in our case this is 255; this means that a random number between 0 and 255 is capable of being generated.

The next two lines determine the position of the top left-hand coordinates of the square. It is worth looking at these two statements in a little more detail. They are

xPosition = round(random(200));
yPosition = round(random(200));

Here the function round is used to convert (round up) the result of the random function (a float) to an int. If the round function was not included then Processing would have indicated a syntax error.

An interesting question that it might be worth your while stopping and thinking about is why I did not use the round function within the code

stroke(random(255), random(255), random(255));

that sets up the colour of the lines used to draw the square? The answer is that inside the stroke function you will almost certainly find the function round being employed.

The remainder of the code just displays the square using the randomly generated values for the length, x coordinate and y coordinate of each square. Notice that we have generated a length of no more than 200 and an x and y coordinate of no more than 200. This ensures that when a square is drawn it is not drawn outside the window since the window as a length of 400 pixels and height of 400 pixels. The display from the program is shown in Figure 5. It has a nice sixties feel to it.

Figure 5: The 20 squares drawn using Processing

It might now be worth modifying the program in some way. There are a number of simple modifications that you might like to try, for example varying the number of squares that are drawn or the thickness of the drawing lines. Another modification is to make it loop endlessly in animation mode. You remember this mode from page xx. Here the functions setup and draw are employed to produce a continually moving picture. The program is shown below

void setup(){
//Set up drawing window
size(400,400);
background(255);
strokeWeight(2);
}

int noSquares = 20;
int xPosition, yPosition, squareLength;

//Generate a series of random squares public void draw(){
stroke(random(255), random(255), random(255));
xPosition = round(random(200));
yPosition = round(random(200));
squareLength = round(random(200));
line (xPosition,yPosition,xPosition+squareLength, yPosition);
line (xPosition+squareLength, yPosition,xPosition+squareLength, yPosition+squareLength);
line (xPosition+squareLength, yPosition+squareLength,xPosition, yPosition+squareLength);
line (xPosition, yPosition+squareLength,xPosition,yPosition); }

Here the code that sets up the window is placed in the function setup and the code that draws the squares is placed in the function draw. There are two differences between this program and the first one. The first difference is, of course, the definition of the two functions setup and draw. The second difference is that the for loop in the first program has not been replicated in the second program. The reason for this is that the function draw continually loops around endlessly. A snapshot of the drawing window during the running of this program is shown in Figure 6.

Figure 6: The drawing program in animation mode

To conclude we shall describe one further program. This program uses the line drawing facilities within Processing to produce an animation that involves the continual drawing of a series of random lines. Each line will have two sets of random end-points, a random colour and a random thickness or stroke. The program is shown below

void setup(){
//set up a white window background and size 400x400
size(400,400);
background(255);
}

int startX, finishX, startY, finishY, lineColour;

void draw(){
//Draw a set of random lines
startX = round(random(400));
startY = round(random(400));
finishX = round(random(400));
finishY = round(random(400));
strokeWeight(random(10));
stroke(random(255),random(255),random(255));
line(startX, startY,finishX, finishY);
}

Here the functions setup and draw are used again. The heart of the program is again in draw. Here the endpoints of the lines are randomly generated (the maximum values are 400; this matches the size of the window) and then the width (stroke) of the line is set followed by a random value of colour for the line. Finally the line is drawn using the line function.

Figure 7 shows the output from this program during its running. It shows a wide range of colours and a series of line widths.

Figure 7: The line drawing program

Book Assignments

The first book assignments are up. You can find them in the September section of this blog. Could I stress that you don't need to make a bid for a chunk until, say Christmas, after you have read the book and decided what you are best suited for and would enjoy.

Welcome

Welcome to a very unusual project. The links on the right-hand side are your main navigation aid to the book whose chunk you will be writing. In the September collection you will find all the details that you need. Good luck!!

Darrel Ince

FAQs

What programming standards and commenting standards should I use? The same as in the Greenberg book.

Do we have to use a style sheet? No, just send in the text using your own style. We will use a style sheet of our own.

Can I email you at any time? Yes, if you have problems or any queries at any time then let me know. I will try and answer within two days. There will be times when I will be away from my computer; I shall, however, advertise them on my main blog. Only email me on MCT-Mass-Writing@open.ac.uk

I live on mainline Europe I can't get to Waterstones; what do I do? You let us know and we will ship the book to you by surface mail.

I have found the Greenberg book at a cheaper price than Waterstones at another outlet. Can I buy it there? The best thing to do is to buy it and then use your Waterstones voucher for yourself, for example by buying some Christmas presents.

What is the target audience? The target audience is readers who want to get involved in computer art but who have no programming expertise and little mathematics. Processing has two modes: procedural and OO. I would hope that we could get this sort of reader up to complicated procedural programs.

You mention that one program should be used to illustrate my 2500 odd words, is this a hard and fast rule? No, if you feel some shorter programs would do then please use them. The choice is up to you.

If I use diagrams what graphics format do I use? Any format that can be embedded within your word processor text. Don't forget to send the graphics separately in the zip file that you send us when you have completed your part of the book.

You say that you want a 100 line program to illustrate each chunk. What if I'm writing a chunk right at the beginning of the book and there's little scope for a large program? The best thing is to develop a collection of small programs and describe each one. Try and make them as visual as possible.

Can I write more than one chunk? We are hoping to get 85 volunteers. This is very ambitious so contact us in November/December if you have enjoyed writing your 2500 words and want to do more.

Do I get paid? Unfortunately not; you do get the book that you will work from and a presentation copy of the book that you helped write. Look on the project as a way of donating some time to the OU, rather than money.

Can I use text and diagrams from the Processing book that you give us? Definitely not this would give rise to all sorts of copyright problems. Don't even devise computer programs that look like the ones that are described in the book.

How do I insert diagrams into my blog? Diagrams are important and most of you will need to employ them. Use any graphics program you like as long as the end-product can be embedded within the text from the word processor that you use.

Does my English writing have to be perfect? No, as long as it is readable and understandable then it will do. All the contributions will be edited. However, don't use this fact to write sloppily and assume that someone will rescue you.

How long should I take over this task? Its up to you: some of you will have good writing experience and have used Java for a long time, so the task may take a few weeks. Some of you, however, may struggle a bit with writing and need longer and might even deliver just short of the deadline.

You ask us to load each version of the text into our blog, do you mean the first 500 words, then the first 1000 words etc? This is one option; another option would be to write an outline of your part of the book and each version would refine it. If you feel you can do this then it might be the better option as it will give others a good idea of what your text is all about.

How do you want us to post each version of the text? You can either do it by just having one post and continually editing it showing each version or by creating a post for each version. It is up to you. The first way will result in less text.

Can I look at other blogs? Yes you should. There are a number of reasons for this. First, it might give you ideas about what you write. Second, it would enable you to check that there is no major overlap with your material and others material. Third, it would enable you to comment on other blogs and help other writers.

Chunk assignments

This part of the blog shows each chunk and the URL of the blog associated with it. if you look at each blog you should see versions of that chunk. if you see the text 'No blog assigned' then it is free for you to take possession and start writing. Please email us if you want to write a chunk.

Updated 26th April

---

Chunk 1
Mike Taperell
Chunk 2
Roberto Vormittag
Chunk 3
Stewart Edwards
Chunk 4
Samir Rabab
Chunk 5
Alex Harris
Chunk 6
Sheep Dalton
Chunk 7
Mike Richards
Chunk 8
Bryan Clifton
Chunk 9
Edward Toovey
Chunk 10
Graham Hall
Chunk 11
JeanLuc Brausch
Chunk 12
James Gray
Chunk 13
Anthony Lees
Chunk 14
Geoff Riley
Chunk 15
Bruce Lawley
Chunk 16
Rosie Wood
Chunk 17
Alex Harris
Chunk 18
Fokion Zervoudakis
Chunk 19
Neil Petrie
Chunk 20
Antony Lees
Chunk 21
David Phillips
Chunk 22
Neil Keskar
Chunk 23
Daniel Bergmann
Chunk 24
Darrel Ince
Chunk 25
Pat Jacobs
Chunk 26
Grant Mankee
Chunk 27
Charlie Beddoes
Chunk 28
Simon Perrins
Chunk 29
Rosseleyne Thompson
Chunk 30
Rosseleyne Thompson
Chunk 31
Paul Fisher
Chunk 32
Anthony Fiore
Chunk 33
Ben Notorianni
Chunk 34
Bryn Sadler
Chunk 35
Anton Dil
Chunk 36
Martin Humby
Chunk 37
Martin Humby
Chunk 38
Neil Keskar
Chunk 39
Mark Moran
Chunk 40
Ian Welch
Chunk 41
Andrew Hancox
Chunk 42
Martin Prout
Chunk 43
Boyd Stratton
Chunk 44
Paul Fisher
Chunk 45
Ben Notorianni
Chunk 46
Rosie Wood
Chunk 47
Anthony Lees
Chunk 48
Anthony Lees
Chunk 49
Pat Jacobs
Chunk 50
John Rayfield
Chunk 51
Neil Singh
Chunk 52
Mark Miller
Chunk 53
Anabela Green
Chunk 54
Rebecca Ewen
Chunk 55
Barry Martin
Chunk 56
Paul Richards
Chunk 57
Davide Rizzo
Chunk 58
John Wilson
Chunk 59
Bryan Clifton
Chunk 60
Ebtessam Adam Alsomali
Chunk 61
Rob Martin
Chunk 62
Ian Macey
Chunk 63
Paulo Greco
Chunk 64
Liam Madden
Chunk 65
Boyd Stratton
Chunk 66
Jeremy Annis
Chunk 67
Sharon Dawes
Chunk 68
Martin Prout
Chunk 69
Shailesh Ghokale
Chunk 70
Rob Spain
Chunk 71
Mike Blamires
Chunk 72
Maxemilian Hilbrand
Chunk 73
Richard Brown
Chunk 74
Marshall Heap
Chunk 75
Antonio Bruno
Chunk 76
Marshall Heap
Chunk 77
Darragh Buffini
Chunk 78
Darragh Buffini
Chunk 79
Rosie Wood
Chunk 80
Dusan Licer
Chunk 81
Ian Perkins
Chunk 82
Anthony Lees
Chunk 83
Jannetta Steyn
Chunk 84
Jannetta Steyn
Chunk 85
Nigel Parker

---

Chunks 81 to 85

CHUNK 81
TITLE Object orientation and images
DESCRIPTION In this part of the book show how you can develop a class based Processing program that manipulates images. This would be valuable revision on OO concepts.
OUTCOME

• Be able to develop an OO-based program of no more than 120 lines which manipulates images.

REFERENCE Greenberg 468--479
HINT It would do no harm to make the program the same level of complexity as that in the Greenberg extract
PROGRAM A similar program to that found in the text,

CHUNK 82
TITLE Mouse events
DESCRIPTION This is the first part of the book that looks at mouse events. Happily Processing handles such events easily
OUTCOMES

• Be able to understand how Processing is able to detect and act on mouse events.
• Be able to develop a program up to 120 lines which relies on mouse events bein caught.

REFERENCE Greenberg 564--570
HINT Don't worry about showing how complex the mouse event code in Java is (Greenberg 564--565) just go straight into a description of the Processing code. Don't use any motion code unless its very simple as we have not covered this in the book
PROGRAM Develop a program similar to the one that you describe in this part of the book.

CHUNK 83
TITLE Buttons
DESCRIPTION Buttons are useful elements to have. Unfortunately the standard button code used in Java cannnot be used in Processing. You have to draw them
OUTCOME

• Be able to understand how Processing implements buttons
• Be able to develop a Processing program of no more than 120 lines that includes two buttons.

REFERENCE Greenberg 579--582
HINT Take the teaching very gently and dont tear your hair out when you realise that you can't use Swing or AWT widgets.
PROGRAM Develop a similar program to the one you describe in the text. Make it class based.

CHUNK 84
TITLE Advanced buttons 1
DESCRIPTION You will need to describe a similar program to the one detailed in the Greenberg extract below. Working with sophisticated buttons is really painstaking in Processing Im afraid.
OUTCOME

• Be able to develop a sophisticated button-based Processing program of no more than 200 lines.

REFERENCE Greenberg 582--586
HINT Take it very gently: build up the program gradually as the code while not being intellectually difficult is somewhat complicated
PROGRAM A program similar in complexity to the one that you describe in the text.

CHUNK 85
TITLE Advanced buttons 2
DESCRIPTION You will need to describe a similar program to the one detailed in the Greenberg extract below. Working with sophisticated buttons is really painstaking in Processing Im afraid. This is a similar version to the previous chunk of the book. You may need to liase a bit with the author of chunk 84. Like 84 this is jst the description of a sophisticated program.
OUTCOME

• Be able to develop a sophisticated button based Processing program of no more than 200 lines

REFERENCE Greenberg 582--586
HINT Take it very gently: build up the program gradually as the code while not being intellectually difficult is somewhat complicated
PROGRAM A program similar in complexity to the one that you describe in the text.

Chunks 71 to 80

CHUNK 71
TITLE Alpha transparency
DESCRIPTION This describes the use of the alpha component of a colour to vary its transparency.
OUTCOME

• Be able to develop a program of around 100-120 lines which employs transparency

REFERENCE Greenberg 406--415
HINT Try and find an example where you dont have to go into much detail on matrices.If you do then make sure its no more than that in the Greenberg extract here.
PROGRAM Develop a program similar to the one you describe in the text.

CHUNK 72
TITLE Colour modes
DESCRIPTION This part of the book is an introduction to the idea of a color mode.
OUTCOMES

• Be able to understand the idea of a colour mode.
• Be able to employ a number of different colour modes in a computer program

REFERENCE Greenberg 415--419
HINT No hint
PROGRAM Develop a program that uses a number of different colour modes and produces some interesting or spectacular effects.

CHUNK 73
TITLE More colour functions
DESCRIPTION This describes a range of new colour functions
OUTCOMES

• Be able to use functions such as blendColor in Processing programs
• Be able to develop Processing programs of around 100-120 lines using the colour functions detailed here.

REFERENCE Greenberg 419--423
HINT Don't worry about explaining bitwise approaches as the author does; just mention the
slowness.
PROGRAM Develop a program based on a class that does some spectacular or interesting graphical effects. No more than 150 lines.

CHUNK 74
TITLE Pixels
DESCRIPTION So far we have been looking at Pixels, now we will look at bit mapped images. This is the introduction.
OUTCOMES

• Be able to understand the difference between bit-mapped and vector graphics.
• Be able to use the pixel functions detailed in this part of the book.
• Be able to develop a program that uses pixels of around 120 lines of code
  

REFERENCE Greenberg 423--429
HINT Develop a gradient-based program similar to those shown in the Greenberg extract
PROGRAM Develop a program similar to the one that you have described in the text.

CHUNK 75
TITLE Faster pixels
DESCRIPTION One of the problems with the functions in the previous chunk of the book is that they are slow. This part of the book looks at how to speed things up
OUTCOMES

• Be able to use the functions detailed in the Greenberg fragment below
• Be able to develop a program of no more than 120 lines of Processing code which uses the pixel array stuff in the fragment below.

REFERENCE Greenberg 429--432
HINT Try describing a program that shimmers a bit, if you cant then its up to you what you do.
PROGRAM Develop a class-based program that is similar to the one you described min the text

CHUNK 76
TITLE Loading and tiling images
DESCRIPTION This is the start of the part of the book that deals with image manipulation. It shows you how load images and set and get the pixels in an image.
OUTCOMES

• Be able to use program facilities to load an image
• Be able to use set and get functions to manipulate an image.
• Be able to develop programs of no more than 120 lines which use the facilities in the Greenberg fragment

REFERENCE Greenberg 432--442
HINT This may be more than 2000 words so feel free to go as far as 3000 words.
PROGRAM A program, does not need to be class based, to do something to an image.

CHUNK 77
TITLE Using bits
DESCRIPTION This is a low level part of the book that will show students how to speed up image processing using bits.
OUTCOMES

• Be able to understand how colours are represented as bits.
• Be able to develop a program of no more than 120 linesusing bitwise operations.

REFERENCE Greenberg 443--448
HINT Take the explanation of binary representations quite slow
PROGRAM Develop a program similar to the one you describe in the text. It does not have to class-based

CHUNK 78
TITLE Using the mask method
DESCRIPTION The mask method enables the Processing programmer to implement some sophisticated functionality. This part of the book describes it.
OUTCOME

• Be able to develop a program of no more than 120 lines that uses the mask method.

REFERENCE Greenberg 448--451
HINT Try and describe a program that implements some Photoshp functionality
PROGRAM Develop a program similar to the one described in the text.

CHUNK 79
TITLE Using the filter method
DESCRIPTION This should be a gentle introduction to the filter method.
OUTCOMES

• Be able to understand the function of the filter method
• Be able to develop a program of no more than 120 lines using the filter method

REFERENCE Greenberg 452--459
HINT Take this gradually and build up the described program in small chunks.
PROGRAM Develop an interesting program similar to the one that you describe in the text.

CHUNK 80
TITLE Using the blend method
DESCRIPTION This should be a gentle introduction to the blend method.
OUTCOMES

• Be able to understand the function of the blend method
• Be able to develop a program of no more than 120 lines using the blend method

REFERENCE Greenberg 459--467
HINT Take this gradually and build up the described program in small chunks. Show the student how to save the images that have been created.
PROGRAM Develop an interesting program similar to the one that you describe in the text.

Chunks 61 to 70

CHUNK 61
TITLE Classes 2
DESCRIPTION This part of the book should introduce the code behind a class; this will require teaching of the highest order. This is a repeat of the previous chunk. Classes are so dificult to understand so we have decided to repeat the teaching
OUTCOME

• Be able to understand the code of a simple class programmed in no more than 30 lines of code

REFERENCE Greenberg 304
HINT Try and describe a class that implements some simple graphics. Do enough teaching on constructors to get you throuugh but do not go to town on this: there will be more teaching on constructors later. Make the arguments lists a little more complicated than the previous chunk of the book, say three arguments maximum.
PROGRAM Difficult task: try and develop a class that is a little more complicated than the one that you describe and make it do something really visual.

CHUNK 62
TITLE Constructors
DESCRIPTION I want you to teach constructors in depth here. Show the student that a constructor is code that creates an object and assigns values to its attributes
OUTCOMES

• Be able to understand code within constructors containing no arguments and multi-arguments
• Be able to develop code within constructors containing no arguments and multi-arguments

REFERENCE Greenberg 309--311
HINT Use a class as an example. Make it no more than 50 lines of code. Try and get it to do something graphical
PROGRAM Develop a program similar to the one you describe

CHUNK 63
TITLE Methods 1
DESCRIPTION The student will have seen methods in action in the previous three chunks of the book. Describe them in more detail here. Plenty of small examples required. Describe methods with simple arguments such as int.
OUTCOMES

• Be able to understand simple methods containing simple argument lists
• Be able to develop methods containing simple argument lists

REFERENCE Greenberg 311--318
HINT Really take time explaining the role of an argument. This concept messes students up a lot. Show an example of a class that implements some graphical processing
PROGRAM Develop a program that issimilar in complexity to the one in the txt

CHUNK 64
TITLE Methods 2
DESCRIPTION The student will have seen methods in action in the previous three chunks of the book.Describe them in more detail here. Plenty of small examples required. Describe methods with more complex arguments such as arrays of ints.
OUTCOMES

• Be able to understand simple methods containing more complex argument lists
• Be able to develop methods containing more complex argument lists

REFERENCE Greenberg 311--318
HINT Use lots of small exampless
PROGRAM Develop a program similar to the one that you describe in the text.

CHUNK 65
TITLE Bringing it all together
DESCRIPTION In this part of the book I want you to develop a class which is around 100 lines of code. It should contain constructors with a number of arguments, methods with a number of argum ents, methodswhich are void and methods which deliver values. This brings the work on classes described in previous chunks together.
OUTCOMES
Be able to understand the code of a class of roughly 100 lines which contains the elements above.

• Be able to develop the code of a class of roughly 100 lines of code which contains the elements above.

REFERENCE Greenberg 302--318
HINT As with all these classes make the code do somthing graphic.
PROGRAM Develop a program similar to the one that you have explained in the text. Try and make it do something spectacular in graphical terms.

CHUNK 66
TITLE Shapes--an introduction
DESCRIPTION This part of the book introduces some of the 2D Processing shapes. Describe rectangle, ellipse, arc and triangle
OUTCOMES

• Be able to develop simple programs involving the shapes
• Be able to develop more complicated programs of up to 100 lines which show graphiceffects similar to those shown in the Greenber fragment below

REFERENCE Greenberg 340--349
HINT At all times try to show programs which show interesting graphic effects
PROGRAM Develop a program that uses at least two of the shapes to produce some stunning graphics. Don't do recursion

CHUNK 67
TITLE Name Transformations
DESCRIPTION In this part of the book describe how shapes can be transformed.
OUTCOME

• Be able to use the transformation facilities in Processing to transform shapes previoulsy introduced.

REFERENCE Greenberg 350--357
HINT Don't go into any details about matrices; just do as Greenberg does: say theres something called a matrix which is under the bonnet.
PROGRAM Develop a program that uses transformations of around 100-150 lines of code.

CHUNK 68
TITLE Hybrid shapes
DESCRIPTION This describes how interesting shapes can be constructed using combinations of p reviously described shapes.
OUTCOMES

• Be able to develop programs up to 100 lines which display combinations of shapes
• Be able to develop classes of up to 100 lines which display combinations of shapes

REFERENCE Greenberg 365--368
HINT Try and use classes for your code so that the student has more examples of this idea to look at.
PROGRAM Develop a class-based program that provides some interesting graphical effect.

CHUNK 69
TITLE Classes creating shapes
DESCRIPTION This part of the book gives the reader some more practice in writing and reading
OUTCOMES

• Be able to develop a class of around 100 lines of code that implements some new shape
• Be able to use objects defined by the class

REFERENCE Greenberg 378--381
HINT make this as much an exercise in class development as much as graphical programming
PROGRAM Develop a similar program to the one in the text

CHUNK 70
TITLE An introduction to colour
DESCRIPTION This is an introduction to the colour facilities in Processing.

OUTCOMES

• Be able to develop programs of around 100 lines involving colours.

REFERENCE Greenberg 400--406
HINT None
PROGRAM Try and develop a program that uses a variety of colours and the shapes that were taught in the previous section of the course. Shapes such as rectangle and ellipse

Chunks 51 to 60

CHUNK 51
TITLE A curve example 1
DESCRIPTION Describe a program that uses the curve drawing idea in Greenberg 246--249, make it relatively complex of around 100 lines of code.
OUTCOME

• Be able to understand a moderately complex curve drawing program

REFERENCE Greenberg 246--249
HINT Try and make this program visually good, for example use colour
PROGRAM Modify the program that you present in this part of the book so that it does something different

CHUNK 52
TITLE A curve example 2
DESCRIPTION Describe a program that uses the curve drawing idea in Greenberg 246--249, make it relatively complex around 150 lines of code.
OUTCOME

• Be able to understand a moderately complex curve drawing program

REFERENCE Greenberg 246--249
HINT Try and make this program visually good, for example use colour
PROGRAM Modify the program that you present in this part of the book so that it does something different.

CHUNK 53
TITLE Using trigonometric functions
DESCRIPTION Describe the three trigonometric functions sin, cos and tan. Dont worry about explaining them in terms of triangles just describe them as functions which have certain drawing properties. Develop a simple program that shows these functions being drawn.
OUTCOME

• Understand the nature of trigonometric functions.
• Understand Processing programs that contain trigonometric funtions.
  

REFERENCE Greenberg 255--256
HINT Don't go into any of the mathematics of the trig functions
PROGRAM Develop a program similar in complexity to the one that you describe.

CHUNK 54
TITLE Sin in action
DESCRIPTION Describe a program that is similar in complexity to that Greenberg 257--260.
OUTCOME

• Be able to understand a complex Processing program

REFERENCE Greenberg 257--260
HINT Don't copy the program in Greenberg try and develop something of the same complexity but which is rather different.
PROGRAM Modify the program that you describe so that its functionality is changed.

CHUNK 55
TITLE Polynomials
DESCRIPTION Describe the gneral form of quadratic and cubic polynomials and show how they can be drawn using the techniques in Greenberg 262--267. Describe a simple program that shows the various curves that are generated by such polynomials
OUTCOME

• Describe the general form of a polynomial
• Develop code that draws a particular polynomial.

REFERENCE Greenber 262-267
HINT Keep the programs simple.
PROGRAM No program required.

CHUNK 56
TITLE An introduction to Processing's curve functions
DESCRIPTION In this you should provide an introduction to curve drawing using the arc method. At this stage keep the description simple and concentrate on some simple examples
OUTCOMES

• Describe the role of the curve functions in Processing
• Use the arc method in simple programs no more than 30 lines in length

REFERENCE Greenberg 267--272.
HINT Students might be a bit stunned by the mathematical aspects of curves; so keep the examples simple
PROGRAM Develop a more complicated program using the arc method.

CHUNK 57
TITLE The Bezier function 1
DESCRIPTION The Bezier function is a really tough topic. Only volunteer for this one if you feel that you have the mathematical ability and the teaching ability to convey a tough subject
OUTCOMES

• Understand how curves are defined by Bezier functions
• Develop programs of no more than 30 lines using Bezier functions

REFERENCE Greenberg 272-278
HINT Try and describe a program simpler than that on Greenberg 275-276
PROGRAM Develop a program that is similar in complexity to the one that you use in the text

CHUNK 58
TITLE The Bezier function 2
DESCRIPTION In this part of the book I would like you to show how Bezier curves can be joined together. Employ programming that creates a number of joined curves. Also show how by using higher order polynomials you can to roughly the same thing
OUTCOMES

• Develop a simple program of no more than 40 lines which joins up Bezier curves
• Develop a simple program of no more than 40 lines creates a Bezier function from a higher order function

REFERENCE Greenber 279-280
HINT Take this very gently and try to eliminate the mathematics
PROGRAM Develop an animation that uses Bezier curves. Anything will do hter, it doesnt have to be one which joins up a series of Bezier curves.

CHUNK 59
TITLE An introduction to object-oriented programming
DESCRIPTION Make this an introduction, dont show the code for any classes, just get the student to understand there are objects and there are methods which correspond to messages. The BurritoRecipe class will be your inspiration; use a different example though.
OUTCOMES

• Understand the broad idea of a class.
• Understand the broad idea of a method
• Understand the broad idea of a message
  

REFERENCE Greenberg 302--303
HINT
Take this very gently, students everyehwere and at every level have problems with object orientation.
PROGRAM Don't write a program for this part of the book.

CHUNK 60
TITLE Classes 1
DESCRIPTION This part of the book should introduce the code behind a class; this will require teaching of the highest order.
OUTCOME

• Be able to understand the code of a simple class programmed in no more than 30 lines of code

REFERENCE Greenberg 304
HINT Try and describe a class that implements some simple graphics. Do enough teaching on constructor to get you thorugh but do not go to town on this: there will be more teaching on constructors later. Make the argument lists for the methods simple (perhaps just one or two arguments).
PROGRAM A difficult task: try and develop a class that is a little more complicated than the one that you describe and make it do something really visual.

Chunks 41 to 50

CHUNK 41
TITLE Vertex functions 1
DESCRIPTION This is one of five sections of the book that provides examples in the use of vertex functions. Describe a program that is about 50 lines of code which uses vertex functions.
OUTCOME

• Be able to understand a program that uses vertex functions.

REFERENCE Greenberg 209--225
HINT Use anti-aliasing
PROGRAM Modify the program that you present in the text so that its functionality changes

CHUNK 42
TITLE Vertex functions 2
DESCRIPTION This is one of five sections of the book that provides examples in the use of vertex functions. Describe a program that is about 75 lines of code which uses vertex functions.Try and make it concepuually similar to that found in Greenberg 220--221 but more complicated
OUTCOME

• Be able to understand a program that uses vertex functions.

REFERENCE Greenberg 209--225
HINT Don't worry about the kludgy approach.
PROGRAM Modify the program that you present in the text so that its functionality changes

CHUNK 43
TITLE Vertex functions 3
DESCRIPTION This is one of five sections of the book that provides examples in the use of vertex functions. Describe a program that is about 100 lines of code which uses vertex functions. Try and make it conceptually similar to that found in Greenberg 224--225 but more complicated
OUTCOME

• Be able to understand a program that uses vertex functions.

REFERENCE Greenberg 209--225”
HINT Might be worth looking at drawing in different colours
PROGRAM Modify the program that you present in the text so that its functionality changes

CHUNK 44
TITLE Vertex functions 4
DESCRIPTION
This is one of five sections of the book that provides examples in the use of vertex functions. Describe a program that is about 100 lines of code which uses vertex functions. Try and make it conceptually similar to that found in the program in Greenberg 231 but more complicated
OUTCOME

• Be able to understand a program that uses vertex functions.

REFERENCE Greenberg 209--225
HINT Might be worth looking at drawing in different colours
PROGRAM Modify the program that you present in the text so that its functionality changes

CHUNK 45
TITLE Vertex functions 5
DESCRIPTION This is one of five sections of the book that provides examples in the use of vertex functions. Describe a program that is about 100 lines of code which uses vertex functions. Try and make it conceptually similar to that found to the program in Greenberg 235 but more complicated
OUTCOME

• Be able to understand a program that uses vertex functions.

REFERENCE Greenberg 209--225
HINT Might be worth looking at drawing in different colours
PROGRAM Modify the program that you present in the text so that its functionality changes

CHUNK 46
TITLE Bringing it together 1
DESCRIPTION This is a really difficult section. What we want you to do is to develop a program of about 200 lines which is visually stunning and which uses any of Processing's line functions.
OUTCOME

• Understand a large Processing program

REFERENCE Any facility presented in Greenberg up to 237
HINT Don't attempt this unless you really feel that you are a practised Java programmer.
PROGRAM No program needed

CHUNK 47
TITLE Bringing it together 2
DESCRIPTION This is a really difficult section. What we want you to do is to develop a program of about 200 lines which is visually stunning and which uses any of Processing's line functions.
OUTCOME

• Understand a large Processing program

REFERENCE Any facility presented in Greenberg up to 237
HINT Don't attempt this unless you really feel that you are a practised Java programmer.
PROGRAM No program needed.

CHUNK 48
TITLE Bringing it together 3
DESCRIPTION This is a really difficult section. What we want you to do is to develop a program of about 200 lines which is visually stunning and which uses any of Processing's line functions.
OUTCOME

• Understand a large Processing program

REFERENCE Any facility presented in Greenberg up to 237
HINT Don't attempt this unless you really feel that you are a practised Java programmer.
PROGRAM No program needed

CHUNK 49
TITLE Lines and acceleration
DESCRIPTION Provide a little revision on lines the way that Greenberg does about lines. Describe a line as a series of points and develop a program that gnerates a series of lines as points
OUTCOME

• Be able to develop a simple program that generates a loine from a series of points

REFERENCE Greenberg 242--246
HINT Talk about a line being a distance vs time graph and the slope the acceleration
PROGRAM No program needed

CHUNK 50
TITLE Generating a simple curve
DESCRIPTION Use the idea of a curve having acceleration in two directions to generate a simple curve. Describe a program that generates a number of curves in an interesting way.
OUTCOME

• Develop a program that generates simple curves.

REFERENCE Greenberg 246--249
HINT You may like to use different colours
PROGRAM Develop another program that is similar in complexity to the one that you describe.