Coding Challenges

Watch me take on some viewer submitted Coding Challenges in p5.js and Processing!

#124

Flocking Simulation

10 Dec 2018

In this coding challenge, I create a flocking simulation in JavaScript based on Craig Reynolds “boids” algorithm.

#123.2

Chaos Game Part 2

29 Nov 2018

In the second part of the “Chaos Game” coding challenge, I vary the number of seed points, probability, and percentage moved to generate other fractal patterns.

#123.1

Chaos Game Part 1

28 Nov 2018

In this two-part coding challenge, I implement the “Chaos Game” in the p5.js web editor. This first video uses three seed points and results in the famous Sierpinski Triangle.

#122.2

Quick, Draw! Continued

05 Dec 2018

The “Quick, Draw!” dataset is now available via an official Google API + web component. In this challenge follow-up, I explore drawing the doodles with p5.js in an HTML5 canvas.

#122.1

Quick, Draw!

14 Nov 2018

In this coding challenge, I take a closer look at the Quick, Draw! dataset and create a simple node API to “replay” drawings of rainbows and cats using p5.js.

#121.2

Logo Interpreter Part 2

13 Nov 2018

This coding challenge is a continuation of the Logo “interpreter” challenge. I refactor the code and add the “repeat” command.

#121.1

Logo Interpreter Part 1

30 Oct 2018

In this coding challenge, I discuss turtle graphics and make a Logo Interpreter in JavaScript.

#120

Bit Shifting

24 Oct 2018

In this coding challenge, I talk about bitwise operations, and more specifically, bit shifting.

#119

Binary to Decimal Conversion

23 Oct 2018

In this coding challenge, I discuss binary numbers and make an interactive binary to decimal number converter.

#118.2

Mastodon Fractal Tree Bot - Part 2

16 Oct 2018

In Part 2 of this coding challenge, my Fractal Tree Mastodon Bot takes user input to generate a tree of a specific angle.

#118.1

Mastodon Fractal Tree Bot - Part 1

16 Oct 2018

In this coding challenge, I create a node.js Mastodon bot that posts images (fractal trees) generated with Processing code.

#117

Seven-Segment Display

15 Oct 2018

In this coding challenge, I make a Seven-Segment Display with p5.js. This video is inspired by Tom Scott’s: What’s The Longest Word You Can Write With Seven-Segment Displays?.

#116

Lissajous Curve Table

02 Oct 2018

In this Coding Challenge, I visualize a “Lissajous Curve Table” with Processing (Java).

#115

Snake Game Redux

12 Sep 2018

Snake Game!? Again!? Now with the p5.js Web Editor!

#114

Bubble Sort Visualization

22 Aug 2018

In this coding challenge, I implement a “bubble sort” algorithm in Processing (Java) and sort randomly generated lines. #SortingTrain

#113

4D Hypercube (aka 'Tesseract')

21 Aug 2018

In this coding challenge, I visualize a 4D Hypercube (aka “Tesseract”) in Processing (Java).

#112

3D Rendering with Rotation and Projection

20 Aug 2018

In this coding challenge I render a 3D object (cube) in 2D using rotation and projection matrices in Processing (Java).

#111

Animated Sprites

30 Jul 2018

In this coding challenge, I load a sprite sheet and create multiple animated sprites with the p5.js library.

#110.2

Recamán's Sequence - Part 2 (Audio)

25 Jul 2018

In Part 2 of this coding challenge, I use the Recamán’s number sequence to create a series of musical notes, with the help of the p5.js Sound library. #CodingRecaman

#110.1

Recamán's Sequence - Part 1

24 Jul 2018

In this coding challenge, I visualize the Recamán’s number sequence using the p5.js library. #CodingRecaman

#109

Visualizing 500,000 Subscribers

09 Jul 2018

Celebrating the 500,000 subscribers milestone, I create a map visualization of Coding Train subscriber locations around the world!

#108

The Barnsley Fern

21 Jun 2018

In this coding challenge, I visualize the Barnsley Fern fractal with Processing (Java).

#107

Sandpiles

18 Jun 2018

In this coding challenge, inspired by Numberphile I visualize “sandpiles” with Processing (Java).

#106

XOR Problem with TensorFlow.js

11 Jun 2018

In this coding challenge, I visualize solving XOR once again, this time with the TensorFlow.js library.

#104

Linear Regression with TensorFlow.js

29 May 2018

In this challenge, I use the TensorFlow.js library to create an interactive demonstration of linear regression (with stochastic gradient descent!)

#103

Fire Effect

14 May 2018

In this coding challenge, I implement a pixel-based “fire” algorithm using Processing (Java).

#102

2D Water Ripple

07 May 2018

In this coding challenge, I attempt to simulate 2D water ripples using Processing (Java).

#101

May the 4th Scrolling Text

04 May 2018

Happy Star Wars day! May the fourth be with you! In this challenge I attempt to code the iconic text scrolling/title crawl in Processing (Java).

#100.5

Neuroevolution Flappy Bird - Part 5

24 Apr 2018

Part 5!
Here I add a feature for saving and loading a “bird brain” model.

#100.4

Neuroevolution Flappy Bird - Part 4

23 Apr 2018

Part 4!
I attempt to improve the Neuroevolution Flappy Bird Coding Challenge.

#100.3

Neuroevolution Flappy Bird - Part 3

18 Apr 2018

In this video refine the neural network and genetic algorithm parameters as well as speed of the simulation during the training process.

#100.2

Neuroevolution Flappy Bird - Part 2

17 Apr 2018

Coding Challenge #100 Part 2!
Here I add the genetic algorithm.

#99

Neural Network Color Predictor

10 Apr 2018

In coding challenge, I use my neural network JavaScript library to create a “color predictor.”

#98.3

Quadtree Collisions - Part 3

09 Apr 2018

In part 3 of the Quadtree coding challenge, I apply the algorithm to particle system collisions and test its performance.

#98.2

Quadtree - Part 2

26 Mar 2018

In part 2 of the Quadtree coding challenge, I query the data structure for points contained within a rectangular boundary.

#98.1

Quadtree - Part 1

26 Mar 2018

In this coding challenge, I implement a Quadtree data structure in JavaScript and visualize it with p5.js.

#97.1

The Book of Pi - Part 1

20 Mar 2018

In yet another “Pi Day” coding challenge, I attempt to generate a pdf “Book of Pi” with the first 10 million digits of Pi mapped to color. Processing (Java) is used for this project.

#96

Visualizing the Digits of Pi

19 Mar 2018

In this second Pi Day coding challenge, I attempt to “visualize” the digits of Pi. #PiTrain

#95

Approximating the Value of Pi

14 Mar 2018

In this coding challenge, I use use a “monte carlo” method to approximate the value of Pi in Processing (Java).

#94.4

2048 - Part 4

01 Mar 2018

In this multi-part coding challenge, I attempt to code the sliding puzzle game 2048 in JavaScript using canvas and p5.js. In part 4 of my 2048 coding challenge, I attempt but mostly fail to improve the visuals of the game, fix a bug and refactor the code a bit.

#94.3

2048 - Part 3

28 Feb 2018

In this multi-part coding challenge, I attempt to code the sliding puzzle game 2048 in JavaScript using canvas and p5.js. In part 3, I add the score, adjust the font size and add a condition for “winning” the game.

#94.2

2048 - Part 2

27 Feb 2018

In this multi-part coding challenge, I attempt to code the sliding puzzle game 2048 in JavaScript using canvas and p5.js. I continue the game mechanics in part 2.

#94.1

2048 - Part 1

26 Feb 2018

In this multi-part coding challenge, I attempt to code the sliding puzzle game 2048 in JavaScript using canvas and p5.js. This first part focuses on the game mechanics.

#93

Double Pendulum

13 Feb 2018

In this coding challenge, I create a double pendulum simulation in Processing.

#92

XOR Problem

12 Feb 2018

In this coding challenge, I use my Toy Neural Networks library to solve the XOR problem.

#91.3

Snakes & Ladders - Part 3

31 Jan 2018

In this multi-part coding challenge, I attempt to create a simulation of the classic board game Snakes & Ladders (also known as Chutes and Ladders). In this third part, I add “states” in order to animate the player’s movements and help me debug.

#91.2

Snakes & Ladders - Part 2

30 Jan 2018

In part 2 of this multi-part coding challenge, I add the actual snakes and ladders to my game.

#91.1

Snakes & Ladders - Part 1

29 Jan 2018

In this multi-part coding challenge, I attempt to create a simulation of the classic board game Snakes & Ladders (also known as Chutes and Ladders). In this second part, I add the snakes and ladders to the game.

#90

Floyd-Steinberg Dithering

16 Jan 2018

In this coding challenge, I attempt to implement the Floyd-Steinberg Dithering algorithm and create a “image stippling” effect on an image (kitten, of course) using Processing.

#89

Langton's Ant

07 Jan 2018

In this coding challenge, I implement Langton’s Ant in Processing.

#88

Snowfall

25 Dec 2017

In this special holiday season coding challenge, I attempt to create a snowfall simulation using p5.js, sprite sheets and Perlin noise wind.

#87

3D Knots

20 Dec 2017

In this coding challenge, I attempt to make 3D Knots using Processing and Paul Bourke’s formulae.

#86

Cube Wave by Bees and Bombs

28 Dec 2017

In this coding challenge, I attempt recreate a 3D @beesandbombs GIF with p5.js and the WebGL renderer.

#85

The Game of Life

11 Dec 2017

In this coding challenge, I attempt to code Conway’s Game of Life cellular automata simulation in JavaScript using the p5.js library.

#84

Word Definition Extension

29 Nov 2017

In this coding challenge, I attempt to make a chrome extension that looks up a selected word’s definition using the Wordnik API.

#83

Chrome Extension with p5.js Sketch - Doodle Chrome Extension

16 Nov 2017

In this coding challenge, I create a Chrome Extension which adds a p5.js drawing canvas on top of any webpage you visit.

#82

Image Chrome Extension - The Ex-Kitten-sion!

16 Nov 2017

In this coding challenge, I create a chrome extension which replaces all image on a page with the picture of a kitten.

#81.2

Circle Morphing - Part 2

08 Nov 2017

In this video, I implement another possible solution to Golan Levin’s Circle Morphing challenge (as seen here.

#81.1

Circle Morphing - Part 1

01 Nov 2017

In this video, I implement one possible solution to Golan Levin’s Circle Morphing challenge.

#80

Voice Chatbot with p5.Speech

23 Oct 2017

This challenge is a continuation of the number guessing chatbot. In this version, I add the p5.Speech library for a voice interface.

#79

Number Guessing Chatbot

13 Oct 2017

In this coding challenge I attempt to create a chatbot that plays a number guessing game. I use the RiveScript along the JavaScript library p5.js.

#78

Simple Particle System

11 Oct 2017

In this coding challenge, I explore the concept of a simple particle system and attempt to create a smoke effect with the p5.js library.

#77

Recursion

05 Oct 2017

In this coding challenge, I explore the concept of recursion to create fractal patterns in JavaScript HTML5 canvas with the p5.js library.

#76

10PRINT in p5.js

26 Sep 2017

In this coding challenge, I attempt to create a version of the classic one-line Commodore 64 BASIC program in JavaScript using p5.js. This coding challenge is inspired by the book 10 PRINT.

#75

Wikipedia API

25 Sep 2017

In this coding challenge, I attempt to make a “Wikipedia web crawler” in JavaScript. It randomly crawls from topic to topic on Wikipedia using the API and the p5.js library.

#74

Clock

20 Sep 2017

In this coding challenge, I attempt to program a clock in HTML5 canvas with the p5.js library.

#73

Acrostic

11 Sep 2017

In this coding challenge, I create an acrostic generator with the Wordnik API and p5.js. This challenge is part of my “Programming with Text” series.

#72.4

Frogger Refactoring

20 Jun 2017

In this follow-up to the Frogger coding challenge, I attempt to refactor the code to make it more modular, readable, and scalable.

#72.3

Frogger - Part 3

16 Jun 2017

In the third part of the Frogger coding challenge, I implement the rows of logs/turtles that the frog jumps onto.

#72.2

Frogger - Part 2

15 Jun 2017

In Part 2 of the Frogger coding challenge, I add the first row of obstacles to avoid.

#72.1

Frogger - Part 1

14 Jun 2017

In this multi-part challenge, I attempt to re-create the classic Atari video game Frogger in Processing (Java).

#71

Minesweeper

18 May 2017

In this challenge, I attempt to code the classic game Minesweeper in JavaScript with the p5.js library. This video builds on some previous tutorials related to the Prototypes and multi-dimensional arrays in JavaScript.

#70.3

Nearest Neighbors Recommendation Engine - Part 3

11 May 2017

In this coding challenge, I create a movie recommendation engine using the a “nearest neighbor” algorithm. In this third (and final) part, I use the K-Nearest Neighbor machine learning algorithm to predict ratings for movies I haven’t seen yet.

#70.2

Nearest Neighbors Recommendation Engine - Part 2

10 May 2017

In this coding challenge, I create a movie recommendation engine using the a “nearest neighbor” algorithm. In Part 2 of, I iterate through all the users to find the nearest neighbors and list the most “similar” users.

#70.1

Nearest Neighbors Recommendation Engine - Part 1

09 May 2017

In this coding challenge, I create a movie recommendation engine using the a “nearest neighbor” algorithm. In Part 1, I demonstrate you how to calculate a similarity score between two data points.

#69.5

Evolutionary Steering Behaviors - Part 5 (Bonus)

28 Apr 2017

This is a bonus part 5 of my evolutionary steering behaviors coding challenge. Here, I add a DOM checkbox to be enable/disable the debugging view of the sketch.

#69.4

Evolutionary Steering Behaviors - Part 4

27 Apr 2017

This is part 4 (five parts total) of an evolutionary steering behaviors coding challenge. The goal is to create a system where autonomous steering agents evolve the behavior of eating food (green dots) and avoiding poison (red dots).

#69.3

Evolutionary Steering Behaviors - Part 3

24 Apr 2017

This is part 3 (five parts total) of an evolutionary steering behaviors coding challenge. The goal is to create a system where autonomous steering agents evolve the behavior of eating food (green dots) and avoiding poison (red dots).

#69.2

Evolutionary Steering Behaviors - Part 2

20 Apr 2017

This is part 2 (five parts total) of an evolutionary steering behaviors coding challenge. The goal is to create a system where autonomous steering agents evolve the behavior of eating food (green dots) and avoiding poison (red dots).

#69.1

Evolutionary Steering Behaviors - Part 1

18 Apr 2017

This is part 1 (five parts total) of an evolutionary steering behaviors coding challenge. The goal is to create a system where autonomous steering agents evolve the behavior of eating food (green dots) and avoiding poison (red dots).

#68.2

Breadth-First Search Part 2

30 Mar 2017

This is part two of the Breadth-First Search algorithm is and implement it in JavaScript. My demo application is “6 Degrees of Kevin Bacon” (finding the closest relationship between Kevin Bacon and another actor).

#68.1

Breadth-First Search Part 1

30 Mar 2017

In this two part challenge, I cover the Breadth-First Search algorithm is and implement it in JavaScript. My demo application is “6 Degrees of Kevin Bacon” (finding the closest relationship between Kevin Bacon and another actor).

#67

Pong!

27 Mar 2017

In this challenge, I attempt (emphasis on the word “attempt”) to program the classic video game Pong in Processing (Java).

#66

JavaScript Countdown Timer

25 Mar 2017

In this video, I use the p5.js library to create a web-based countdown timer. I discuss the native JavaScript method setInterval() and well as p5’s millis().

#65.2

Visualizing a Binary Tree

22 Mar 2017

In this follow-up to the Binary Tree coding challenge, I look at the very beginning steps to visualizing the tree. Make and share your own!

#65.1

Binary Search Tree

21 Mar 2017

This coding challenge is part of the first week of my course: “Intelligence and Learning.” Here I attempt to implement a classic data structure: The Binary Search Tree.

#64.4

Inverse Kinematics - Multiple

19 Mar 2017

In this last coding challenge on kinematics, I wrap all of the code for inverse kinematics into an object and create an array of many tentacle-like creatures. The creatures reach for a bouncing ball (an idea from the Coding Math YouTube channel). All examples are in Processing (Java).

#64.3

Inverse Kinematics - Fixed Point

18 Mar 2017

In the third video on kinematics, I use inverse kinematics to create a tentacle-like creature (fixed to a base point) that tries to reach for the mouse.

#64.2

Inverse Kinematics

17 Mar 2017

This coding challenge is the second in a series on kinematics! In this video I demonstrate forward inverse kinematics in Processing (Java) and create an eel or snake-like creature that follows the mouse.

#64.1

Forward Kinematics

16 Mar 2017

This coding challenge is the first in a series on kinematics! In Part 1, I demonstrate forward kinematics in Processing (Java).

#63.2

Texturing Cloth Simulation Part 2

14 Mar 2017

In part 2 of this challenge, I add the “unikitty” image as a texture to a waving flag, created with toxiclibs verlet physics.

#63.1

Texturing Cloth Simulation Part 1

14 Mar 2017

In this two part coding challenge, I demonstrate how to render geometry with an image texture (making a waving flag). In this first part, I cover the beginShape(), endShape(), and texture() functions and discuss different options like TRIANGLE_STRIP, QUAD_STRIP, and more.

#62.4

Plinko with Matter.js Part 4

13 Mar 2017

Part 4 of the Plinko coding challenge! In this final video, I add sound to the simulation, a bell ring each time a particle hits a peg.

#62.3

Plinko with Matter.js Part 3

12 Mar 2017

Part 3 of the Plinko coding challenge! In this video, I add a little bit of randomness to the sketch so that the particles’ path varies. I experiment with the peg size and the disc color as well as tweak the physics settings.

#62.2

Plinko with Matter.js Part 2

11 Mar 2017

Part 2 of the Plinko coding challenge! In this video I add boundaries to the sketch and delete offscreen bodies. I also add buckets at the bottom for the particles to land in.

#62.1

Plinko with Matter.js Part 1

10 Mar 2017

Part 1 of the Plinko coding challenge! In this video I create a plinko simulation in HTML5 Canvas using the Matter.js physics engine and p5.js for drawing.

#61

Fractal Spirograph

28 Feb 2017

In this coding challenge, I attempt to create a “Fractal Spirograph” with Processing (Java). The visuals are inspired by images and explanation on C. J. Chen’s blog.

#60

Butterfly Generator

27 Feb 2017

In this coding challenge, I use trigonometry and perlin noise to procedurally generate butterfly wing designs with p5.js. This challenge is inspired by Katie Rose Pipkin’s Moth Generator.

#59

Steering Behaviors

21 Feb 2017

In this coding challenge, I look at extracting font path points from text in p5.js with p5.Font.textToPoints(). I render the text as particles with steering behaviors that react to the mouse.

#58

3D Earthquake Data Visualization

20 Feb 2017

In this coding challenge, I follow up on the Earthquake Data Visualization challenge and create a 3D version in Processing(Java) using spherical coordinates. I also discuss some 3D vector math including the cross product.

#57

Mapping Earthquake Data

13 Feb 2017

In this coding challenge, I visualize earthquake data from the USGS by mapping the latitude, longitude and the magnitude of earthquakes with p5.js.

#56

Attraction and Repulsion Forces

09 Feb 2017

In this coding challenge, I implement a system of particles that respond to attraction / repulsion forces.

#55

Mathematical Rose Patterns

08 Feb 2017

In this coding challenge, I attempt to create rose (rhodonea) curves using trigonometry function and polar coordinates.

#54.2

Star Patterns Update: Law of Sines

14 Feb 2017

This coding challenge is a follow up on the challenge #54: Islamic Star Patterns. In this video, I use the Law of Sines to simplify the tiling pattern calculation.

#54.1

Islamic Star Patterns

01 Feb 2017

In this bonus super-sized coding challenge, I work through visualizing Islamic Star Patterns in p5.js based on this University of Waterloo paper

#53

Random Walker with Vectors and Lévy Flight

31 Jan 2017

In this coding challenge, I continue the discussion on Random Walkers. I implement a random walker using vectors in p5.js, which allows me to vary the distance of each step size. I also implement a “Lévy Flight”, named after french mathematician Paul Lévy.

#52

Random Walker

27 Jan 2017

In this coding challenge, I implement a Random Walker using the p5.js library. This video is part of my Spring 2017 course Nature of Code at Tisch NYU.

#51.3

A* Pathfinding Algorithm - Part 3

18 Jan 2017

In Part 3 of this coding challenge, I look at ways to improve the visual design of the A* Algorithm and invite you to put your own spin on it.

#51.2

A* Pathfinding Algorithm - Part 2

17 Jan 2017

In Part 2 of this A* Algorithm coding challenge, I focus on adding obstacles (walls) to the grid as well as functionality for moving diagonally.

#51.1

A* Pathfinding Algorithm - Part 1

16 Jan 2017

In this coding challenge, I attempt an implementation of the A* Pathfinding Algorithm to find the optimal path between two points in a 2D grid. I begin by explaining the mechanics of how the algorithm works, look at pseudo-code, and then write the algorithm in JavaScript using the p5.js library for rendering.

#50.2

Animated Circle Packing - Part 2 (Kitten Addendum)

10 Jan 2017

In this short addendum to the Animated Circle Packing challenge, I demonstrate how to combine the circle packing algorithm with looking up pixel colors in an image to create an abstract portrait of a kitten.

#50.1

Animated Circle Packing - Part 1

09 Jan 2017

In this coding challenge, I demonstrate a circle packing algorithm and use it to fill the outline of a text path (in this case, this new year “2017”) using Processing (Java).

#49

Photo Mosaic with White House Social Media Images

06 Jan 2017

In this coding challenge, I use a collection of Obama Administration’s facebook images to create a “photo mosaic” of President Obama with Processing (Java).

#48

White House Social Media Data Visualization

06 Jan 2017

In this coding challenge, I discuss how to use the newly released White House social media data to make simple data visualization example with p5.js.

#47

Pixel Sorting in Processing

21 Dec 2016

In this coding challenge, I implement “Pixel Sorting” in Processing (Java). Using a “selection sort” algorithm, I sort the pixels of an image by brightness and hue.

#46.2

Asteroids - Part 2

16 Dec 2016

This video is Part 2 of a new coding challenge: the classic Atari video game Asteroids! In this video, I use JavaScript and HTML5 canvas with the p5.js library to program the “laser” functionality and examine collision detection with the asteroids.

#46.1

Asteroids - Part 1

15 Dec 2016

This video is Part 1 of a new coding challenge: the classic Atari video game Asteroids! In this video, I use JavaScript and HTML5 canvas with the p5.js library to program the ship and the asteroids.

#45

Saving p5.js Drawings to Firebase

11 Dec 2016

In this coding challenge, I make a HTML5 canvas doodling application (with p5.js). Users can save and share drawings in real-time with the Database as a Service (DBaaS) Firebase.

#44.2

AFINN-111 Sentiment Analysis - Part 2

02 Dec 2016

In Part 2 of this coding challenge, I implement sentiment analysis using the AFINN-111 (link below) word list. A single page web app analyzes the valence (positive vs negative) of text as a user types into a text area. This video is part of Session 8 of the “Programming from A to Z” ITP class.

#44.1

AFINN-111 Sentiment Analysis - Part 1

01 Dec 2016

This is Part 1 of a two-part coding challenge on Sentiment Analysis with the AFINN-111 word list. In this video, I explain what the AFINN-111 is and how to convert Tab Separated Values (.tsv) data into JSON data. This video is part of Session 8 of the “Programming from A to Z” ITP class.

#43

Context-Free Grammar

31 Oct 2016

In this coding challenge, I code a Context-Free Grammar text generator from scratch. The concept of recursion is explored. This video is part of Session 7 of the “Programming from A to Z” ITP class.

#42.2

Markov Chains - Part 2

25 Oct 2016

In Part 2 of this coding challenge, I attempt to use a Markov Chain to generate a new name for my YouTube channel. The code reads from a list of name suggestions submitted by viewers.

#42.1

Markov Chains - Part 1

24 Oct 2016

In Part 1 of this coding challenge, I discuss the concepts of “N-grams” and “Markov Chains” as they relate to text. I use Markov chains to generate text automatically based on a source text.

#41

Clappy Bird

20 Aug 2016

In a previous challenge, I created a clone of the popular online game Flappy Bird. In this coding challenge, I make the game audio-responsive and control the bird by clapping.

#40.3

TF-IDF

12 Oct 2016

In part 3 of the Word Counting coding challenge, I implement an algorithm known as TF-IDF (Term Frequency – Inverse Document Frequency). The algorithm scores each word’s relevance for a given document based on its frequency in one document relative to all others in a corpus. This is one possible methods for keyword generation.

#40.2

Word Counter in Processing

11 Oct 2016

In this coding challenge, I build a word counting (concordance) application using the Processing (Java) development environment. I show one example of visualizing the counts with font size.

#40.1

Word Counter in JavaScript

10 Oct 2016

In this coding challenge, I build a word counting (concordance) web application in JavaScript. The video demonstrates a use of associate arrays, regular expressions, and other techniques previously covered as part of “Programming from A to Z.”

#39

Mad Libs Generator

26 Sep 2016

In this coding challenge, I make a Mad Libs web application using p5.js and tabletop.js (a JavaScript library for connecting to google sheet data.)

#38

Word Interactor

20 Sep 2016

In this coding challenge, I make something called a “Word Interactor” (help me with a better name!) using regular expressions, JavaScript, and the p5.js library for DOM manipulation.

#37

Diastic Machine

12 Sep 2016

In this coding challenge, I make what a “Diastic” generator. The Diastic technique is a methodology and algorithm for generating found poetry from a source text. It was developed and used by poet / artist Jackson Mac Low. In this challenge, I generate diastic poems using p5.js.

#36

Blobby!

02 Sep 2016

In this short coding challenge, I demonstrate how to turn an circle (or any shape you want) into a blob and give the edges have a liquidy / blobby / wobbly look. A technique using beginShape() and endShape() along with perlin noise is used.

#35.5

TSP with Genetic Algorithm and Crossover

02 May 2017

This is Part 5 of the Traveling Salesperson coding challenge. In this video, I add a “crossover” algorithm to the Genetic Algorithm.

#35.4

Traveling Salesperson with Genetic Algorithm

01 May 2017

In this coding challenge, I attempt to create a solution to the Traveling Sales Person with a genetic algorithm. This is part 4 of the Traveling Salesperson Coding Challenge.

#35.3

Traveling Salesperson with Lexicographic Order

30 Aug 2016

In Part 3 of the Traveling Salesperson coding challenge, I take the lexicographic ordering algorithm apply it to a brute-force solution of the Traveling Salesperson problem. Every single route permutation is checked one by one.

#35.2

Lexicographic Order

25 Aug 2016

In Part 2 of this coding challenge, I discuss Lexicographic Ordering (aka Lexical Order) and demonstrate one algorithm to iterate over all the permutations of an array.

#35.1

Traveling Salesperson

24 Aug 2016

In Part 1 of this multi-part coding challenge, I introduce the classic computer science Traveling Salesperson problem (“traveling salesman” (sic) for search) and discussing the pitfalls with a brute force solution.

#34

Diffusion-Limited Aggregation

18 Aug 2016

In this coding challenge, I explore the generative algorithm “Diffusion-Limited Aggregation”. The DLA visual pattern is generated from random walkers clustering around a seed (or set of seed) point(s).

#33

Poisson-disc Sampling

22 Aug 2016

In this coding challenge, I implement a “Poisson-disc Sampling” algorithm to evenly (but randomly) distribute a set of seed points throughoutt a canvas. The algorithm is implemented in JavaScript using p5.js.

#32.2

Agar.io - Part 2 (Networking with Socket.IO and Node.js)

04 Sep 2016

This video is Part 2 of a coding challenge where I attempt to make a make a clone of of the popular multiplayer online game Agar.io. In this session, I implement the real-time multiplayer aspect of agar.io using socket.io and node.js.

#32.1

Agar.io - Part 1 (Basic Game Mechanics)

16 Aug 2016

In this coding challenge, I create a clone of the multiplayer online game Agar.io using JavaScript (p5.js). This is only the beginning of this challenge where I build out the basic game mechanics. I plan to make a follow-up to this video and add the multiplayer functionality of the game using node.js and websockets.

#31

Flappy Bird

10 Aug 2016

In this coding challenge, I attempt to program in JavaScript (using the p5.js framework) a clone of the game Flappy Bird.

#30

Phyllotaxis

03 Aug 2016

In this coding challenge, I continue one of my favorite subjects: Algorithmic botany! This video covers the subject of Phyllotaxis, what it is and how it can be used to generate sunflower-like patterns inspired by nature.

#29

Smart Rockets in p5.js

02 Aug 2016

In this (very long) coding challenge, I implement a genetic algorithm from scratch and create “smart rockets” (based on a simulation by Jer Thorp). The rockets evolve the “best” path to a target, moving around obstacles.

#28

Metaballs

15 Jul 2016

In this coding challenge, I show you how to code from scratch Metaballs(Isosurfaces) in Processing and how to control them using the Blob Detection method from my previous computer vision video.

#27

Fireworks

02 Jul 2016

In this 4th of July themed coding challenge, I build an HTML5 canvas fireworks simulation from scratch using the p5.js JavaScript library. I also show how to use Processing to create 3D Fireworks.

#26

3D Supershapes

30 Jun 2016

In this coding challenge, I use the “superformula” to make a 3D “supershape” in Processing. This is part 4 of a multi-part series on superformulas, superellipses and supershapes

#25

Spherical Geometry

29 Jun 2016

In this coding challenge, I create a sphere in Processing using spherical coordinates and triangle strips. This is the 3rd part of a multi-part series on superformulas, superellipses and supershapes.

#24

Perlin Noise Flow Field

27 Jun 2016

In this coding challenge, I use Perlin noise to create a two-dimensional flow field with the p5.js library

#23

2D Supershapes

21 Jun 2016

In this coding challenge, I show you how to make 2D supershapes in p5.js.

#22

Julia Set in Processing

17 Jun 2016

In this coding challenge, I program from the Julia Set fractal in Processing (Java).

#21

Mandelbrot Set with p5.js

13 Jun 2016

In this coding challenge, I program from scratch the Mandelbrot set with p5.js

#20

3D Cloth with toxiclibs

09 Jun 2016

In this coding challenge, I use the toxiclibs physics library to create a 3D cloth in Processing.

#19

Superellipse

03 Jun 2016

In this coding challenge, I’m going to use superformulas to create a superellipse in p5.js. This is part 1 of a multi-part series on superformulas, superellipses and supershapes.

#18

3D Fractal Trees

02 Jun 2016

In this coding challenge, I’m building on top of the Space Colonization video and creating a 3D Fractal Tree, using the same algorithm, in Processing

#17

Fractal Trees - Space Colonization

01 Jun 2016

In this coding challenge, I’m using the space colonization algorithm to make a tree generator. This is the 4th part of my algorithmic botany series.

#16

Fractal Trees - L-System

31 May 2016

In this third installment of my series on algorithmic botany, I discuss L-systems and how they can be used to generate tree and other fractal patterns in p5.js.

#15

Fractal Trees - Object Oriented

30 May 2016

In this coding challenge, I continue the topic of algorithmic botany with another way of generating a tree. With this method, every part of the tree will be an object, so that we can apply forces and attributes to each element

#14

Fractal Trees - Recursive

30 May 2016

In this coding challenge, I’m going to show you how to create a Fractal Tree with a recursive algorithm in p5.js.

#13

Reaction Diffusion Algorithm in p5.js

26 May 2016

In this coding challenge, I use the p5.js library to make a visual representation of the Reaction Diffusion Algorithm.

#12

The Lorenz Attractor in Processing

06 May 2016

In this coding challenge, I show you how to visualization the Lorenz Attractor in Processing (Java).

#11

3D Terrain Generation with Perlin Noise in Processing

04 May 2016

In this coding challenge, I create a 3D procedural terrain using Perlin Noise and the beginShape() function in Processing.

#10.4

Maze Generator with p5.js - Part 4

03 May 2016

In the final part of the Maze Generator challenge, using p5.js, I cover the concept of a “stack” and how it’s going to help us generate a maze using the Depth-First Search Recursive algorithm

#10.3

Maze Generator with p5.js - Part 3

03 May 2016

In part 3 of the Maze Generator challenge, using p5.js, I cover steps 3 and 4 of the recursive backtracker algorithm to generate a maze: Removing walls and marking current cell as visited.

#10.2

Maze Generator with p5.js - Part 2

03 May 2016

In the second part of this coding challenge, using p5.js, I move through the grid created in Part 1 by evaluating which neighbouring cell will be the next one to be visited.

#10.1

Maze Generator with p5.js - Part 1

03 May 2016

In Part 1 of this coding challenge, using p5.js, I create the cells which are going to become our maze.

#9

Solar System in Processing - Part 3 (3D textures)

02 May 2016

In part 3 of this coding challenge, using Processing, I add texture to the 3D objects created in part 2. The PShape class and createShape() functions are covered.

#8

Solar System in Processing - Part 2 (3D)

02 May 2016

In the second part of this coding challenge, using Processing, I take the code from the 2D Solar System (Part 1) and turn it three-dimensional.

#7

Solar System in Processing - Part 1 (2D)

28 Apr 2016

In this viewer submitted coding challenge, I make a 2D Solar System Generator in Processing.

#6

Mitosis Simulation with p5.js

27 Apr 2016

In this viewer submitted coding challenge, I program a cellular mitosis simulation in p5.js.

#5

Space Invaders in JavaScript with p5.js

26 Apr 2016

In this viewer submitted coding challenge, I take on the task of coding a Space Invaders game to play in browser in JavaScript/HTML and the p5.js library.

#4

Purple Rain in Processing

25 Apr 2016

In this viewer submitted coding challenge, I attempt to code a Purple Rain Simulator in Processing.

#3

The Snake Game

20 Apr 2016

In this coding challenge, I attempt to code a p5.js version of the Snake Game.

#2

Menger Sponge Fractal

18 Apr 2016

In this coding challenge, I attempt to code the Menger Sponge (fractals) using Processing.

#1

Starfield in Processing

13 Apr 2016

This is the first in a new series of videos. In this video I attempt to program a “star field” or “warp speed” visualization in Processing.