Step-by-step walkthroughs that build a complete project from scratch. Start with #1 and work your way through! Simple Mode
Learn the basics: set up a canvas, draw shapes, and understand how setup() and draw() work.
3 stepsUnderstand the coordinate system: where is (0,0)? Which way do x and y go? Why does y go DOWN? Learn to place things exactly where you want.
5 stepsLearn how to use fill, stroke, noFill, and noStroke to style your shapes with beautiful colors.
4 stepsDiscover animation! Use variables to make shapes move, bounce, and follow patterns.
5 stepsLearn how to use if, else, and comparisons to make your programs react to what's happening.
4 stepsLearn how real-seeming motion works in games: velocity, gravity, friction, and collision detection — the building blocks of every platformer and arcade game.
6 stepsUse for loops to repeat things — draw rows, grids, patterns, and animations with just a few lines of code.
4 stepsMake interactive programs! Follow the mouse, respond to clicks, and use keyboard controls.
5 stepsPut everything together and build a simple catching game from scratch, step by step!
5 stepsBuild a coin-catching game using sprites, pixel art, collision detection, and sound effects!
6 steps