Code & Form I, our first set of Deliverables, has nine parts, which are listed below. These are due at the beginning of class on Wednesday, August 30th. These particular exercises are concerned with specifying and positioning static shapes with code.
The purpose of these exercises is to ensure that you have basic fluency in introductory-level programming, and to ensure your familiarity with the p5.js creative coding toolkit. The pace and character of the work in this course will change significantly after the first three weeks: following this skill-building, the projects will become much more open-ended (i.e. creative). The next few weeks may be the hardest part of the semester 🙂
Deliverables:
- Complete the Exit Ticket from 8/28 if you have not already.
- Join our Discord if you have not already. The invite has been sent to you by email.
- Complete two forms: the Code of Conduct Acknowledgement Form, and the (anonymous) Labor-Based Grading Vote Questionnaire before noon on Wednesday, 8/30.
- Create an account at OpenProcessing if you have not already, and join our OpenProcessing class using the invite sent to you via Discord. You can also find this invite in the #key-information Discord channel. You will complete the four projects below in our OpenProcessing site, which also includes more details about each project.
- Before beginning the projects below, spend 15 minutes browsing the p5.js Reference and Examples. Examine at least six Examples, including their code. Examine at least 6 Reference pages, starting with the Shape commands. If you need help getting started with p5.js, consider browsing the Coding Train playlist of p5.js tutorials. (And if you get stuck while making the projects, give a shout in the #haaaalp channel in the course Discord.)
Now….
- Complete the project, OpenProcessing #01: Quadrilateral Composition. You are asked to create a composition comprised of three different types of quadrilaterals.
- Complete the project, OpenProcessing #02: Good Shape. You are asked to design an organic blob shape by writing code that displays a static, closed loop.
- Complete the project, OpenProcessing #03: Parametric Big N. You are asked to reproduce Al Held’s “The Big N” painting as accurately as you can in a static format; then, parameterize it interactively.
- Complete the project, OpenProcessing #04: Critter Stamps. You are asked to create a function which abstracts the rendering of an oriented critter motif, with arguments for the critter’s position and rotation.
Helpful Tools
Locating Pixel Coordinates
It can sometimes be challenging to locate the pixel coordinates you want. For some of the following exercises, you may find it helpful to plan your design using graph paper, or by printing your cursor coordinates using something like the following (find the code here):
Choosing Colors
In can also be challenging to get the values that describe the color you want. You may find it helpful to refer to this table of digital colors (which can help you refer to colors by name) as well as the Digital Color Meter app that comes with MacOS. Additionally, you can easily access a color picker by searching for one on Google:
