line ⟷ circle

Matt DesLauriers is a Creative Coder & Generative Artist based in London. Matt’s work ranges from computational form, audio visualization, pen plotting and digital installations. Words fail to describe his art. Go experience them.

NYC London TowerAudiograph

Matt not only creates stunning digital art, he also writes extensively about his work & process and publishes source code for many of his artwork on GitHub. If you want to dabble in generative art, his two creative coding courses on FrontendMasters are a great start. I have taken Creative Coding with Canvas & WebGL myself and I can recommended it wholeheartedly.

The Task

I picked today’s sketch, line ⟷ circle, from the accompanying gallery of Matt’s creative coding workshop. I like the idea of thinking of line as a two-sided polygon and circle as an infinity-sided polygon and Matt’s elegant implementation.

The original sketch is on Glitch, but you can also edit it on p5.js editor with my port. The sketch is reproduced below.

If you want to challenge yourself, I’d suggest not reading the original source code until you have reproduced it. Here’s how I would do it:

  • Recreate the sketch
  • Read & learn from the source code if you are done or if you are stuck
  • Tweak the code a little bit to do something different
  • Combine my (or your!) idea with the sketch for something new

When you are all done, post your work on Twitter with the hashtag #codecember and #day2. Remember to include a link to the source code, so others can learn from your creation. We look forward to seeing your sketch!

Yours,
Pine & Anthony