Visualizing variations of a paragraph about writing, structured as a binary tree, authored collaboratively with custom AI, and (painstakingly) handwritten.

Vector animation made by manipulating raw SVG code in vanilla JS, with motion based on an algorithm I first explored in the following dweet: dwitter.net/d/5107

The compositions extend far past the boundaries of your screen, but you'll be able to see a complete view in any SVG viewer or editor:

Press `s` (on mobile: long swipe down) to save current view to SVG file.

Press `r` (on mobile: long swipe up) to toggle reading mode, which will show each handwritten line in order, with fixed size and position.

Double click (on mobile: double tap) to show or hide the color palette extraction menu.

For color palettes, each token makes (optional) use of your webcam as well as any images you may wish to insert. (Please note that no images or video will be saved or sent anywhere, as all processing occurs locally on your machine.)

I had originally planned to use my own color palette extraction algorithm, as I wrote one myself a while back, but then I discovered Lokesh Dhakar's wonderful open source "Color Thief" JS library (github.com/lokesh/color-thief), which does a better (and quicker) job, and so it became this project's sole dependency.

rossgoodwin.com