Zero to One: The Mystical Mathematics Of Creative Coding
summary
Shows how plain JavaScript and HTML5 canvas turn simple signals into motion: time mapped into a 0 to 1 range, wrapped with modulo, warped by powers for easing and remapped with linear interpolation to constrain motion. Uses sine/cosine sums to create complex oscillations, generates polygons from circle equations, and spawns per-vertex circles to build fractal-like detail. Includes a visual tool called the modular animation synthesizer that outputs a JSON graph and compiles to ~40 lines of runnable JS so animations can be exported or embedded.
AI-written summary · about
chapters (12)
- 0:00Introduction and speaker background
- 1:53Examples of creative coding
- 3:59Understanding signals in math
- 5:04Breathing life into a square
- 8:37The magic of 0 to 1 range
- 10:41Linear interpolation explained
- 13:34Adding personality with opacity
- 16:02Sine waves and their power
- 19:54Polygons and circle equations
- 24:17Shapes as signals
- 26:46Modular animation synthesizer
- 29:38Q&A and resources
related talks
54mMaking things with maths
22mThe Power of Mathematics in JavaScript
22mMathematics of Animation
41mWeird Web & Curious Creation
25m"Code As A Canvas: Exploring Creative Coding With JavaScript"
43mMathematics of Animation
30mHTML5 Canvas Animation with Javascript
32mStunning visuals with Maths and...no JavaScript?