//codexdesign.org
//learning approach: p5.js (uses the JavaScript language)

//motion design: program structure or flow
//code: setup(), draw(), sometimes referred to as code blocks 
//function setup() and function draw() enable a dynamic structure or flow
//dynamic can mean animation and interaction
//the setup() block runs only one time, code here will not repeat 
//the draw() block runs (loops) forever (or until a condition is met), code here will repeat 
//code is interpreted from the top of a program to the bottom of a program

//the program starts in the function setup(), each line of code is interpreted
function setup() {
createCanvas(400, 400); // this code does not repeat
rectMode(CENTER); // this code does not repeat
noStroke(); // this code does not repeat
fill (0); // this code does not repeat
}
//after each line of code is interpreted in the function setup(), the program continues down to the function draw() block
function draw() {
rect (200, 200, 100, 100); // this code repeats
}

//study/practice:
//setup one time, draw forever 
