It's Genuary 2024! Watch as I attempt to build a falling sand simulation in p5.js using a grid of pixels and simple rules.
Challenges
Featured Challenge:
#188 — Voice Chatbot
In this coding challenge, I build a conversational voice chatbot entirely in the browser with p5.js. I combine three pieces: speech-to-text with OpenAI's Whisper model, text-to-speech with Kokoro TTS, and a "brain" for the bot. I also explore the transformers.js pipeline API and the Web Audio API. For the bot's brain, I start with a simple ELIZA-style therapist, then incorporate a RiveScript number-guessing game, and finally a local LLM.
Filter by Language
Pick a language to filter
Filter by Topic
pixels
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!
In this video, I follow Mike Ash’s guide to Fluid Simulation and port Jos Stam’s "Real-Time Fluid Dynamics for Games" algorithm and code in Processing (Java).
In this coding challenge, I implement a pixel-based “fire” algorithm using Processing (Java).
In this coding challenge, I attempt to simulate 2D water ripples using Processing (Java).
In this multi-part coding challenge, I demonstrate how to use a circle packing algorithm.
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).
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.
