Beginner
p5.js — Beginner
You know how to draw shapes and respond to input. Now build the programming foundations that unlock complex visuals: functions, loops, arrays, sound, and object-oriented thinking.
01
Functions & Code Organisation
Write reusable functions to keep your sketch clean and structured.
02
Loops & Patterns
for and while loops to generate grids, rings, and repeating motifs.
03
Conditionals & Logic
if/else, comparison operators, and boolean logic for reactive behaviour.
04
Arrays & Data
Store and iterate over collections of values to manage many objects at once.
05
Working with Images
Load, display, tint, and manipulate pixel data from images.
06
Text & Typography
Render text, load custom fonts, and use type as a design element.
07
Sound Basics
Load and play audio files, and read microphone input with p5.sound.
08
Randomness & Noise
random() vs Perlin noise — controlled chaos for organic-feeling visuals.
09
Trigonometry for Creative Coding
sin(), cos(), and angles — the maths behind circular and wave motion.
10
Intro to Object-Oriented Programming
Classes and objects to represent many independent entities in one sketch.