Experiments / 6
Experiments
Visual experiments, games, and creative coding. More exploratory than a case study, but useful for showing interactive systems, visual taste, and moving prototypes.
Visualization
Interactive hereDay-in-the-Life
Time-use visualization engine: a Python backend emits a static data contract while the D3/Canvas frontend animates agents by activity and clock time.
- Small static data contract separates heavy microdata from the web experience.
- Visual engine with force-driven clustering and a clock timeline in 10-minute steps.
- Roadmap for ATUS, Chile ENUT, and Spain EET adapters.
#d3#canvas#time use#data contract
Python · D3.js · Canvas · static data · GitHub Pages2025
Coro Micelar
Original real-time strategy web game: a mycelial colony on a living membrane responds to waves, mutations, mandates, and scars.
- There is no total defeat: pressure degrades, leaves residue, and opens new optimization paths.
- Systems for placement, qualitative waves, run mutations, and persistent combo discovery.
- No build or dependencies; it runs by opening index.html or serving the folder.
#game#canvas#web audio#systems design
Vanilla JS · Canvas · Web Audio · localStorage · ES modules2025
Generative art
Local collectionGenuary 2025
p5.js sketch collection for Genuary prompts, organized around reusable helpers for geometry, color, symmetry, noise, and export.
- 31 sketch folders plus shared utilities for grid, symmetry, noise, gradients, and color.
- Prompt plan grouped by geometry, color, code constraints, architecture, and textures.
- Visual/manual tests for color, grid, noise, save, subdivision, and symmetry helpers.
#p5js#creative coding#generative art#toolkit
p5.js · JavaScript · geometry · palettes · export tooling2025
Particle Life
Particle-life simulation: thousands of agents with per-color attraction and repulsion rules produce clusters, chains, and patterns that emerge on their own in real time.
- Global behavior emerges from simple attraction and repulsion rules between color pairs.
- Quadtree and spatial index resolve neighborhoods for thousands of particles at 60fps.
- Vivid palette on a dark background, in line with the site.
#particle life#emergence#canvas#simulation
Vanilla JS · Canvas · quadtree · spatial index2025
Cuncuna
Generative animation: a network of connected nodes forms a 'cuncuna' (Chilean for caterpillar) that crawls in a loop and weaves a magenta line plexus over a deep background.
- Nodes joined by proximity draw a plexus that shifts frame by frame.
- Continuous looping motion, meant as an ambient piece.
- Magenta palette akin to the site accent.
#generative#plexus#canvas#loop
Vanilla JS · Canvas · p5.js2024
Truchet
Truchet tiling: tiles with randomly oriented arcs that, joined together, draw a continuous maze of curves. A generative-art classic in a rounded-curve variant.
- Each tile picks at random between two arcs; the global pattern arises from that repeated local choice.
- Regenerates a different composition on every load.
- Rounded-curve variant for a clean, continuous stroke.
#truchet#tiling#generative#pattern
Vanilla JS · Canvas · p5.js2024