Draw Shapes

Consult the Documentation

Knowing what Processing’s built-in functions do and how to use them to build your application is important, but do you need to memorize all of the various components of each? Do you need to remember exactly what each of the parameters in the statement rect(30, 20, 55, 55, 3, 6, 12, 18); mean?

The answer to these questions is—thankfully—no. Processing provides a concise, but extensive, reference for each of its functions.


Note that the documentation is organized by types of functions. In other words, to find out how to draw a particular shape, look under the “Shapes” heading.


Use the Processing Documentation to create one five-line program that does each of the following. Note that Processing orients its axes differently than those typically associated with Cartesian coordinates. See the figure below for reference.

  1. Set the size of the display window to a height of 300 and a width of 500.
  2. Draw an ellipse with a width of 20 and a height of 30. It should be centered at the x-y coordinates (100, 40).
  3. Create a color variable c set to burnt orange. The color values for burnt orange are (RED = 204), (GREEN = 85), and (BLUE = 0).
  4. Draw a quadrilateral that matches the following figure:
  5. Fill the quadrilateral with the color you defined as c.