CCI Diploma 2021/2022: Unit 1: Lecture 4: Repeating.
Back to slide index.

Hi!

I'm going to start every lecture with a promise and an artist to reference.

I promise that by the end of this lecture you'll be able understand how to use loops in your work to save you time and earth credits (aka money).

The artist of the day is Yayoi Kusama

The first piece of work I saw of hers was The Passing Winter", which is owned by the Tate. Go see it!

Earlier in my career I was lucky enough to collaborate on an installation inspired by that piece: The Hello Cube.

I think alot of Yayoi's work is about repetition, which is why she's perfect for today's lecture - which is on exactly that thing!

The main thing I want you keep in mind today is that iteration or looping or repeating is one of the most powerful tools for getting things done in coding. Loops let you repeat the same recipe or set of instructions or commands or block of code as many times as you like. You can set loops to run a set number of times, or for a certain period of time, or to run for every piece of information in a certain place (like for every entry in an address book) or even to run an interactive number of times (until the user presses a certain key for example).

By the end of this lecture, you'll know more about:

• Iteration - which is the obsfucatory term for repeating something several times
• Loops - another word for iteration and the term you'll here the most in coding
• The four different kinds of loops in p5.js
• A whole series of examples of looping in p5.js
• The concept of Scope in coding, and particularly in p5.js

Let's look at the definition of Iteration - the obsfucatory term for repeating something several times.

Loops are just a part of the wider coding world of Control Flow. We've already encountered some control flow with if/else statements and switch statements. Another way of thinking about loops is doing things many times, but using logic to stop. Boolean logic in our case.

The two most common kinds of loops are while loops and for loops.

Let's venture further into the p5.js tutorial on program (or control) flow, specifically the section on four different kinds of loops in p5.js. BTW - the structure of for loops is going to take a bit of time to get used to - before you know it you'll be typing them out automatically!

Let's take a look at p5.js's control iteration example, remember - Iteration is just another word for repeating, or doing the same thing several times.

Let's take a look at a p5.js example that combines loops and if statements. BTW: what does this % thing do? Where should we look? There is a whole universe of thinking about number systems that loop.

An example that makes extensive use of logical operators (like AND, OR and NOT - or &&, || and !).

An example that combines for loops with a custom function.

A beautiful example of using interactivity and a loop within a loop to generate a grid of ellipses (or circles).

As always, Daniel Shiffman has some great videos all about loops.

BTW: it took me ages to realise, but most games are just one big while loop - "while the user hasn't pressed the ESC key (or Apple Q), keep running the main game loop" - this is true even for operating systems!

Let's take a look at a common bug that comes up when you are writing loops - issues around the scope of variables. Let's take a look at a p5.js example about scope.

Finally, let's take a look at this beautiful animated example that uses animation, interaction and a loop within a loop. What happens if you play with the background command? What is it doing in this case?

Thanks!
Back to slide index.