Creative Coding with Canvas & WebGL

Generative Wall Exercise

Creative Coding with Canvas & WebGL

Check out a free preview of the full Creative Coding with Canvas & WebGL course

The "Generative Wall Exercise" Lesson is part of the full, Creative Coding with Canvas & WebGL course featured in this preview video. Here's what you'd learn in this lesson:

Students are instructed to perform their own interpretation of one of Sol LeWitt's works.


Transcript from the "Generative Wall Exercise" Lesson

>> Mathew DesLauriers: So I thought that was really cool and I thought there's just a really good analogy here. And a really good common theme with generative art and with creative coding and with creating artworks using instructions.
>> Mathew DesLauriers: And I actually, as an exercise, take a set of instructions that I created In the same sort of theme as just using some basic constructions.

Mine are probably a little more detailed than but the same idea is just to come up with a grid of evenly spaced points. I drew a little thing here on the side and to select two points and connect them to form a line between two points. And then with those two points you just draw lines down, you end up creating a trapezoid.

And with that trapezoid you can fill it with the different color, maybe using some of the same stuff we were doing already. You can stroke it with the same color as the background. And then again, you do that same thing in a loop or in a while function, just selecting another two points at random that haven't been selected yet.

And you end up doing that over and over again and you create many different shapes. I've only done it here twice, but in your artwork, you could do that through the entire grid and you'd end up with many different overlapping images. And then one thing is, if you do that, you'll notice maybe there's a random assortment, a random arrangement.

And you can sort them all by the average Y position of the two grid points. And you end up with this nice distribution, almost like a city skyline or something like that, where. The smaller ones are a little bit closer to the front and the bigger ones are a bit closer to the end.

And so I wanted this to be an exercise for us to try and work on. Also, if you're feeling a bit overwhelmed, you can just continue working and remixing and tweaking some of what we're doing already. Maybe using some different unicode symbols. Or just chill out, that's okay too.

But if you're feeling ambitious, if you wanna start from something, this is what I would recommend. This is something that I also did in my own time. And after the break, I'll show you my results and we can start to compare and see and just like we saw Louie's work.

Everyone is gonna end up with different results depending on how they interpret the instructions and depending on the colors they choose, and so on.

Learn Straight from the Experts Who Shape the Modern Web

  • In-depth Courses
  • Industry Leading Experts
  • Learning Paths
  • Live Interactive Workshops
Get Unlimited Access Now