Tutorial
Learn Creative Coding and Generative Art. Each tutorial discusses a particular algorithm or programming technique for the purpose of creating interesting visuals.
34 posts
One method for finding the convex hull of a point set is the Quickhull algorithm. It makes use of the divide and conquer paradigm, and builds the convex hull in a recursive manner. This post is a break-down of a Quickhull implementation.
In this tutorial we'll cover how to create a vanilla javascript widget that can be embedded on websites, and is capable of executing javascript safely in an iframe.
In this post we'll go over everything that you should know about Javascript Generators. Javascript generators are a versatile feature of ES6 and allow for interesting programming strategies, that otherwise wouldn't be possible.
In this post we'll have a look at the P5JS graphics buffer and how to effectively use it in your P5 sketching practice. We'll also create a variation of the 10 PRINT pattern that repeats seamlessly.
In this post we'll work our way towards an algorithm that can compute convex polygon intersections. We'll also explore a method for intersections between axis-aligned rectangles, a function that can determine the intersection of two line segments, as well as a point in polygon test.
Shape packing is a popular type of sketch in gen-art, but is often trickier than it might seem when you try to pack anything more complicated than a simple circle. In this post we'll have a look what goes into collision detection as well as a strategy to pack any arbitrary shape in 2D.
The Bowyer-Watson algorithm for Delaunay triangulation is maybe one of the easier methods to implement and understand for obtaining a Delaunay Triangulation.
P5JS doesn't offer native SVG support, there is however a way to run P5 in an 'SVG' mode using zenozeng's SVG runtime. Running P5 in this SVG mode also requires a lot of interaction with the DOM, which we'll discuss in this post.
Tsubuyaki processing has become a popular and fun little challenge on Twitter. In this post I'll be going over some character saving tricks that can come in clutch when you're out of ideas for reducing the size of your code!
A step by step tutorial to constructing a variety of irregular grids
A tutorial on multiple ways to create a hexagonal grid in p5js
An approach for creating all sorts of different smooth shapes in p5, using the canvas rendering context.