Making the Paper Snowflake Web App, Part 1 – Layering canvases

snowflakes-featured2

My first blog post explaining some of the code behind my Paper Snowflake web app. In this installment, we look at how multiple canvases are used together to handle drawing and interactivity tasks.

Read more…

Paper Snowflake Maker – Create, save, and share snowflakes with this HTML5 Canvas app.

snowflakes-featured

Create virtual paper snowflakes with this web app built around the HTML5 canvas. Save your images to your computer, or share them on Facebook.

Read more…

N-body planar choreographies: illustrating mathematics in HTML5 canvas

nBody-featured

An application built in HTML5 and canvas is used to illustrate some intriguing mathematics.

Read more…

Dithered gradients for Processing.

balls-featured

I share some code that you can use in Processing applications to create linear and radial gradients. These gradients can be used with or without dithering, which creates a very smooth appearance.

Read more…

Decay Clock: A Processing sketch.

DecayClock-featured

My first post on Processing: a digital clock made out of little square tiles slowly disintegrates, as the digits are repeatedly destroyed and renewed on a synchronized basis.

Read more…

ColorBoids: The boid algorithm in five dimensions

ColorBoids-featured

The boid algorithm applied to a five-dimensional space: two spatial coordinates and three color coordinates. Play with the settings and watch some interesting pictures emerge.

Read more…

I can see your particle remnants: misadventures in alpha blending.

ugly gray trails

Are you fading out images in the HTML5 canvas by painting a transparent black rectangle over the top? Did you test your animation in different browsers? You may be unaware that ugly gray remnants are being left behind. I discuss the problem, how to predict the color of these remnants, and some workarounds.

Read more…

Textured Rectangles for Equality

hrc-featured

Some generative images to show support for marriage equality in the United States.

Read more…

Smooth HTML5 Canvas Radial Gradients with Dithering

DitheredRadial-featured

Very smooth radial gradients in the canvas, in an easy to use JavaScript class. Subtle gradients across a wide area can be produced without noticeable banding.

Read more…

Random Braids – minimalist generative art in HTML5 canvas

braid-featured

Minimalist generative art in the form of colorful braided strings. Inspired by mathematics and the book “10 Print.”

Read more…