twitter facebook github etsy
Tutorials / p5.js Tutorials
Next: Welcome to Coding

Learn to Code with p5.js

New to coding? Start here!

Welcome to Coding Welcome to Coding

Get ready to write some code!

Calling Functions Calling Functions

Tell the computer what to do.

Using Variables Using Variables

Get information from the computer.

Creating Variables Creating Variables

Give your code a memory.

Creating Functions Creating Functions

Write your own custom functions.

Debugging Debugging

Learn how to debug your p5.js code.

If Statements If Statements

Make decisions in your code.

Animation Animation

Create animated visualizations.

Input Input

Use mouse and keyboard input to make interactive sketches.

For Loops For Loops

Use patterns to repeat work without repeating code.

Arrays Arrays

Create variables that hold multiple values.

Using Objects Using Objects

Group related variables together.

Creating Classes Creating Classes

Create blueprints for your own objects.

Array Functions Array Functions

Take arrays to the next level.

Images Images

Display and manipulate image files.

From p5.js to Web Dev From p5.js to Web Dev

Mix p5.js with HTML, CSS, and JavaScript.

Libraries Libraries

Use libraries to expand what p5.js can do.

What's Next? What's Next?

Some options to explore after learning p5.js.

More Info

Want more info before you dive into coding? Read these!

Which Processing should I use? Which Processing should I use?

Should I use p5.js or Processing?

Editors Editors

Which p5.js editor should I use?

From Processing to p5.js

These tutorials assume you’re already familiar with the fundamentals of coding and that you’ve already read the Processing tutorials and the JavaScript tutorials.

Hello World Hello World

Say hello to P5.js!

Review Review

Review Processing, HTML, and JavaScript topics.

Extra Credit

Already have experience with p5.js? These are for you.

Random Random

The power and beauty of the random function.

Next: Welcome to Coding