Let's make a slide puzzle in p5.js together! We'll be using images, nested loops, and arrays, and by the end of our journey, we'll have a fully playable game!
Challenges
Featured Challenge:
#171 — Wave Function Collapse
Straight out of quantum mechanics, Wave Function Collapse is an algorithm for procedural generation of images. In this video (recorded over 3 live streams) I attempt the tiled model and explore a variety of solutions to the algorithm in JavaScript with p5.js. Also, check out WFC's predecessor: Model Synthesis (more info below).
Filter by Language
Pick a language to filter
Filter by Topic
array
Snake Game!? Again!? Now with the p5.js Web Editor!
In this multi-part coding challenge, I demonstrate how to implement kinematics in Processing (Java).
In Part 1 of this multi-part coding challenge, I introduce the classic computer science problem of the Traveling Salesperson (TSP) and discuss the pitfalls with a brute force solution. In Part 2, I discuss Lexicographic Ordering and demonstrate one algorithm to iterate over all the permutations of an array. In Part 3, I apply this algorithm to a brute-force solution of the TSP problem. Every single route permutation is checked one by one. In Part 4, I attempt to create a solution to the TSP problem with a genetic algorithm, and then I add a “crossover” algorithm in Part 5.
In this coding challenge, I use Perlin noise to create a two-dimensional flow field with the p5.js library.
In this coding challenge, I code a p5.js version of the Snake Game.
