A program written as a list of statements (like the previous examples) is called a static sketch. In a static sketch, a series of functions are used to perform tasks or create a single image without any animation or interaction.

Interactive programs are drawn as a series of frames, which you can create by adding functions titled setup() and draw() as shown in the code below. These are built-in functions that are called automatically.

• setup() runs only once
• draw() runs again and again

1. void setup () {
2.   size(500, 500);
3. }
4. //
5. void draw() {
6.   if (mousePressed)
7.   {
8.     stroke(0, 0, 0);
9.     fill(244, 224, 163);
10.     ellipse(250, 250, 400, 400);
11.     line(300, 150, 400, 150);
12.     fill(255);
13.     ellipse(150, 150, 100, 100);
14.     fill(239, 219, 160);
15.     ellipse(250, 250, 25, 100);
16.     fill(30, 191, 255);
17.     ellipse(150, 150, 40, 40);
18.     fill(0, 0, 0);
19.     ellipse(150, 150, 15, 15);
20.     fill(0, 0, 0);
21.     stroke(228, 0, 8);
22.     fill(228, 0, 8);
23.     triangle(100, 350, 200, 425, 200, 380);
24.     triangle(400, 350, 300, 425, 300, 380);
25.     rect(200, 380, 100, 45);
26.   }
27.   else
28.   {
29.     stroke(0, 0, 0);
30.     fill(244, 224, 163);
31.     ellipse(250, 250, 400, 400);
32.     fill(255);
33.     ellipse(150, 150, 100, 100);
34.     fill(255);
35.     ellipse(350, 150, 100, 100);
36.     fill(239, 219, 160);
37.     ellipse(250, 250, 25, 100);
38.     fill(30, 191, 255);
39.     ellipse(150, 150, 40, 40);
40.     fill(30, 191, 255);
41.     ellipse(350, 150, 40, 40);
42.     fill(0, 0, 0);
43.     ellipse(150, 150, 15, 15);
44.     fill(0, 0, 0);
45.     ellipse(350, 150, 15, 15);
46.     stroke(228, 0, 8);
47.     fill(228, 0, 8);
48.     triangle(100, 350, 200, 425, 200, 380);
49.     triangle(400, 350, 300, 425, 300, 380);
50.     rect(200, 380, 100, 45);
51.   }
52. } // draw()
    
53. //

1. void setup() {
2.   size(500, 500);
3. }
4. //
5. void draw() {
6.   if (keyPressed && key == 'w')
7.   {
8.     stroke(0, 0, 0);
9.     fill(244, 224, 163);
10.     ellipse(250, 250, 400, 400);
11.     line(300, 150, 400, 150);
12.     fill(255);
13.     ellipse(150, 150, 100, 100);
14.     fill(239, 219, 160);
15.     ellipse(250, 250, 25, 100);
16.     fill(30, 191, 255);
17.     ellipse(150, 150, 40, 40);
18.     fill(0, 0, 0);
19.     ellipse(150, 150, 15, 15);
20.     fill(0, 0, 0);
21.     stroke(228, 0, 8);
22.     fill(228, 0, 8);
23.     triangle(100, 350, 200, 425, 200, 380);
24.     triangle(400, 350, 300, 425, 300, 380);
25.     rect(200, 380, 100, 45);
26.   }
27.   else if (keyPressed && key == 'b')
28.   {
29.     stroke(0, 0, 0);
30.     fill(244, 224, 163);
31.     ellipse(250, 250, 400, 400);
32.     line(300, 150, 400, 150);
33.     fill(255);
34.     stroke(0, 0, 0);
35.     line(100, 150, 200, 150);
36.     fill(239, 219, 160);
37.     ellipse(250, 250, 25, 100);
38.     fill(0, 0, 0);
39.     stroke(228, 0, 8);
40.     fill(228, 0, 8);
41.     triangle(100, 350, 200, 425, 200, 380);
42.     triangle(400, 350, 300, 425, 300, 380);
43.     rect(200, 380, 100, 45);
44.   }
45.   else
46.   {
47.     // size(500, 500);
48.     stroke(0, 0, 0);
49.     fill(244, 224, 163);
50.     ellipse(250, 250, 400, 400);
51.     fill(255);
52.     ellipse(150, 150, 100, 100);
53.     fill(255);
54.     ellipse(350, 150, 100, 100);
55.     fill(239, 219, 160);
56.     ellipse(250, 250, 25, 100);
57.     fill(30, 191, 255);
58.     ellipse(150, 150, 40, 40);
59.     fill(30, 191, 255);
60.     ellipse(350, 150, 40, 40);
61.     fill(0, 0, 0);
62.     ellipse(150, 150, 15, 15);
63.     fill(0, 0, 0);
64.     ellipse(350, 150, 15, 15);
65.     stroke(228, 0, 8);
66.     fill(228, 0, 8);
67.     triangle(100, 350, 200, 425, 200, 380);
68.     triangle(400, 350, 300, 425, 300, 380);
69.     rect(200, 380, 100, 45);
70.   }
71. }
72. //