Introduction to Creative Computing 2026/2027: 🖼: Individual Work 3: Drawing Your Initials and Draw, then Code.
Back to slide index.
Today we are going to complete two exercises from
Code as a Creative Medium, which was written by
Tega Brain and
Golan Levin. I'd really recommend picking up a copy if you can, it's full of brilliant reference, exercises and project briefs.
Before we work on the two exercises, I'd like to show you three important sources of information about p5.js: the forum, the reference and the examples.
Let's take a look at the
p5.js forum. What can we find? Let's try searching for things as well as browsing.
Next, let's take a look at the
p5.js reference - I always have this open when I'm writing code. Don't forget that all the code examples are editable right in your browser! Even on mobile!
Finally, let's take a look at the
p5.js examples - let's try cut and pasting them into new sketches using your new p5.js editor login. Do they work? Why did you pick the ones that you did?
Now that we are familiar with the forum, reference and examples, let's try two exercises from
Code as a Creative Medium: "Drawing Your Initials" and "Draw, then Code".
By the way, as a reminder, make these exercises on the
online p5.js editor at https://editor.p5js.org (don't forget to log in with your GitHub name and password!) - much easier for sharing with others and a nice way of building up a portfolio of p5.js sketches - useful for your assessment at the end of the unit - HINT HINT!
Let's discuss "Drawing Your Initials" before we all try it on our own. How should we tackle this? One thing I love to do is use something called
pseudocode to rough out my ideas as comments before I write any code. That way I can think before I start writing any code. I also love to sketch ideas with my pen and pad before I code. Both are allowed and encouraged! Let's spend half the remaining time on this exercise before moving onto "Draw, then Code". Show the PDF Joel!
Let's discuss "Draw, then Code" before we all try it on our own. How should we tackle this? Show the PDF Joel!
Have you started making your portfolio of sketches and your reflective statement? See
the unit wiki for links to places to help you make your own if you get stuck. I'd REALLY recommend adding to your GitHub page every week, and your reflective statement. An hour a week in these individual sessions will make a BIG difference and you won't be in a rush at the end of the unit. Have you tried the Share option in the File menu of editor.p5js.org? It's a great way of getting URLs to add to your portfolio of sketches.