p5.js is a Javascript library for creative coding that is featured heavily in Coding and the Arts.

Depth and Perspective

Depth and Perspective

This project from chapter 2 of Coding and the Arts asks students to apply the visual arts concepts of depth and perspective to a program.

[Read More]

Teach the Machine

Teach the Machine

This project is featured in chapter 5 of Coding and the Arts, where it serves as an introduction to Teachable Machine and training a machine learning model. I find the latest version of Teachable Machine to be really intuitive, particularly when capturing training images from your webcam, but even with its ease of use I think the following introductory video is a super helpful bit of context setting for students.

You can definitely run this activity without any programming by focusing students on training and testing their models in Teachable Machine, but it’s expected that many students will want to do something with the model they’ve trained. The exemplars below all use this model that I trained with a few pieces of fruit and serve as a demonstration for students of how to wire up their trained models in programming environments that you may already be using in the classroom.

As with all things ML, this example model can only ever be as good as the data it was trained with, which happened to be whatever fruit I had on hand with my desk as a background. This inevitably means that it won’t be terribly accurate for a wide range of actual fruit in a wide range of environments. You can use this as a teachable moment for your students as well - the models that they train may work well for them, but will inevitably perform differently for other users in other environments.

[Read More]

Simple P5.js Mandalas

Simple P5.js Mandalas
I’m always looking for fun “absolutely first experience with code” activities - things that feel satisfying without requiring too much background. These kinds of activities aren’t about teaching specific skills as much as they are about getting kids excited about what’s possible with programming. I’ve often used drawing with shapes as this onramp, but laying out shapes requires an understanding of and comfort with the coordinate plane that might turn off students who are math-phobic. [Read More]

Rainbow Knots with P5.js (and Scratch)

Rainbow Knots with P5.js (and Scratch)
I’m going to try something new here, so bear with me as we see how this works. When I’m feeling stressed or overwhelmed I sometimes like to relax with a little creative coding; I just try to get something on the screen and poke around with the code until I find something that soothes me. I’m rarely building towards something specific in these moments, but I do like to explore functions and techniques that I haven’t used before, sometimes just picking a function at random from the documentation and seeing where it gets me. [Read More]