Skip to main content
← Work
Creative Coding·2025

Algorithmic Storytelling:
Rules, Interaction, and Narrative

p5.jsAnimationCollision zonesInteractive narrativeCritical play

A learning trail, not one finished game

These studies grew through an EMAT creative-coding course. The sequence moved from testing whether a canvas could carry a visual rule, to exploring sprite animation and interaction, to attempting a larger narrative prototype. Each version asks a different question about how code can make meaning.

Study 01 · Sol LeWitt-inspired generative sketch

An 800×800 p5.js sketch uses rotating nested squares, randomly generated geometric shapes, transparency, and changing color. Clicking pauses or resumes the animation; vertical mouse position changes speed. The source notes ChatGPT assistance with loop structure and the mouse-position frame-rate function.

Open the Sol LeWitt study →

Study 02 · Algorithmic Storytelling v1 → v2 → v3

The version trail added sprite animation, collision zones, movement-triggered feedback, and a branching narrative. Version 3 is the dated submission, not a claim of a stable finished game.

What the rules do

In the Sol LeWitt study, the rules are the experience: a click changes time, mouse position changes tempo, and randomness changes the arrangement. The point is not to reproduce a static image but to let a person feel how constraints and variation produce a field of possibilities.

In the storytelling prototype, the rules become spatial. Movement through zones triggers feedback and changes what the player can do next. The narrative argument is carried by collision, consequence, and the player's route rather than only by explanatory text.

The useful failure

The v3 source reflection is candid: implementation was difficult, debugging took substantial time, and the intended version was not completed. ChatGPT helped debug the sketch. That makes the artifact more useful, not less: it shows where the concept exceeded the available time and where technical ambition became a design constraint.

I learned to separate a small finished interaction from a larger prototype that still needs work. I also learned that a political idea is not automatically encoded by a theme; if surveillance, resistance, or self-protection matter, they have to be legible in the mechanics and tested as an interaction.

Play the dated submission

The p5.js editor contains the v3 submission. It is shared as a study and working artifact, with its implementation limits visible in the account above.

Open Algorithmic Storytelling v3 →

Where this goes next

The same question continues in SensorSynthFM: how should a person understand the relationship between an input, a transformation, and a creative result? In both projects, interaction is not decoration around the system; it is how the system explains itself.

p5.jsGenerative rulesAnimation timingSprite interactionCollision designNarrative systemsAI-assisted debuggingCreative coding reflection