r/creativecoding • • 50m ago

bezier construction lines visualization

1 Upvotes

r/creativecoding • • 1h ago

twelve small worlds that live around the files on my Mac desktop, all drawn in code

Thumbnail
gallery
4 Upvotes

same desktop, same icons, one frame per theme: islands, people, zen garden, sky islands, old map, city, beach, meadow, arctic, lava, topo and nebula

every theme reads the icon positions from Finder and builds its world around them, the rule I keep for all of them is calm near the icons and detail at the edges so the labels stay readable

it runs as a live wallpaper on macOS, 15 fps while you use the Mac and about 1 frame a minute when idle

which one would you keep on your desktop?


r/creativecoding • • 3h ago

Textile Studio - Procedural fabric rendering [Free Download]

1 Upvotes

r/creativecoding • • 5h ago

A block of water collapses · PIC/FLIP fluid written from scratch in Unity compute shaders

1 Upvotes

r/creativecoding • • 7h ago

Structure behind bezier

Thumbnail
gallery
52 Upvotes

Created a small tool to visualize different patterns and structures using 100s of points instead of normal 4 points for a bezier curve (pen tool) and these are some of the patterns produced from that


r/creativecoding • • 9h ago

I made a tiny text format for a story beat: walk to a door, stop, turn back

1 Upvotes

I wanted a body-blocking edit to feel closer to editing a sketch than tuning a finished timeline.

This four-phase Posecode example is deliberately small: a character walks to a door, pauses, then turns back. The source stays as text, and the browser renderer shows the result. Changing one value such as `turn: 100` to `turn: 40` lets me test whether the beat reads differently without rebuilding the scene.

The loop is: parse the source, validate it, render, then edit the same source again. It is not AI-generated art; the mannequin and motion are procedural. I used an AI assistant to help draft this post, but the implementation and example are mine.

For people who do blocking: do you prefer editing a compact motion description first, or going straight to a timeline?

```posecode

phase approach { move: forward, steps: 3 }

phase pause { hold: 1 }

phase turn { turn: 40 }

phase return { move: backward, steps: 2 }

```


r/creativecoding • • 1d ago

Can hand tracking feel like an instrument? I built a Mac experiment

0 Upvotes

I’m Shubhra, the indie developer behind Sonari. I’m exploring whether hand motion in front of a Mac camera can feel like playing an instrument rather than operating a gesture UI.

The attached clip is a real capture of the app: hand movement plays built-in sounds and sends MIDI to compatible DAWs, while the visuals respond to the music. It isn’t AI-generated artwork.

I’m still working out how to make gesture-to-sound mappings legible without making the visuals compete with the performance. Does the connection read clearly in the clip? What feedback would help you understand the mapping?

Sonari requires Apple silicon and macOS 26 or later. It includes a full 14-day trial, then a US$99 one-time purchase.

Mac App Store: https://apps.apple.com/app/id6803577489

Product details: https://playsonari.com


r/creativecoding • • 1d ago

Bezier Study

14 Upvotes

r/creativecoding • • 1d ago

Working on one thing at a time. Today I spent some time setting up a blob tracker using TouchDesigner.

Thumbnail
youtube.com
0 Upvotes

r/creativecoding • • 2d ago

Organic Curve Simulation Rendering

Thumbnail
gallery
8 Upvotes

r/creativecoding • • 2d ago

PROPORTION PIECE

4 Upvotes

For the middle of this reel, I kept the seed and composition settings fixed and changed the material. The JavaScript drawing engine uses the golden ratio to guide the placement and scale of the forms. Each material renderer then handles the marks differently. Marker ink can run dry, watercolour spreads into the paper, and oil builds up ridges.

I wanted to see how much of the original structure would still be recognisable across all five versions.

Try the editor · Source code


r/creativecoding • • 2d ago Bravo

a browser-based drawing machine

0 Upvotes

For the middle of this reel, I kept the seed and composition settings fixed and changed the material. The JavaScript drawing engine uses the golden ratio to guide the placement and scale of the forms. Each material renderer then handles the marks differently. Marker ink can run dry, watercolour spreads into the paper, and oil builds up ridges.

I wanted to see how much of the original structure would still be recognisable across all five versions.

Try the editor · Source code


r/creativecoding • • 2d ago

A rhythmic glitch made from binary code

Thumbnail
youtube.com
5 Upvotes

r/creativecoding • • 4d ago

classes.h: A macro-only library for clang implementing classes with their syntactic sugar, private scoping, and inheritance

Thumbnail
codeberg.org
1 Upvotes

r/creativecoding • • 4d ago

Herzagon: rotating hearts in a hexagon grid that generate their own sound

5 Upvotes

A few years ago I hand-coded a first prototype of this: hearts rotating inside a hexagon grid, overlapping into interference patterns. It was working, but inefficient as hell. Then I lost it in a data crash and nearly forgot about it.

Recently I rebuilt it from scratch with the help of a coding agent - and the result is of course way cooler than my old prototype ever was. The ideas, the decisions and a ridiculous amount of fine-tuning (plus plenty of discarded attempts) are mine, the agent was the rocket backpack.

Under the hood:

- all the core logic in a single HTML file, WebGL2, no libraries

- the hearts are calculated in a fragment shader, the sound is synthesized live in Web Audio

- works on phones and can be added to the home screen like an app

- GPL-3.0, the source is right there in your browser

The sound is driven by the same settings as the image, so every pattern sounds a little different.

The first people I showed it to kept asking me what it's actually good for. I couldn't really answer that, besides "it looks beautiful and I love it". Over time it turned more and more into a kind of relaxation tool for me - a lot of ideas actually came while "testing" things and looking at it with an empty mind. Now there's a breathing mode that paces your breath, plus these ambient sounds, making it the ideal methadone for doom-scroll addicts.

Oh - and I'm playing with the idea of building an arcade cabinet for it someday, with real knobs and switches instead of sliders.

If you wanna give it a try: https://herzagon.de

My family and friends are already getting slightly tired of me showing it to them, so I'm hoping to find some equally nerdy people here to share this fascination with, even without a sensible use case.


r/creativecoding • • 4d ago

Kuramoto-Sivashinsky

52 Upvotes

One of the simplest/shortest chaotic PDEs. Code golfed to 1010 chars:

https://www.shadertoy.com/view/7ffcR4


r/creativecoding • • 5d ago

The Nature of Code OPENRNDR

Thumbnail gallery
2 Upvotes

r/creativecoding • • 5d ago

I added 4 new shader tunnels and a playground of 7 toys and games to my browser chill hub

Thumbnail cosmic-couch.vercel.app
1 Upvotes

Cosmic Couch is a free site that runs in one browser tab, with no signup and no media files. Every visual and sound is generated live with WebGL and Web Audio.

New tunnels (now 10 total):

Aurora Corridor: green and blue northern lights over a rolling beat

Ember Spiral: a spiral of burning embers over a psytrance groove

Lunar Rain: silver rain past a pale moon, with soft keys

Don’t Look Back: a slow, dark spiral with a deep, steady groove

New Playground section:

Kaleido Snake: eat the orbs, and your trail mirrors around the centre

Fractal Pinball: keep the ball in play with the flippers, and bumpers shift the colours

Melt Blocks: a block-stacking game where cleared rows melt away

Fractal Explorer: drag to move, scroll to zoom into a colourful fractal

Dream Shapes: a slow, shifting pattern to watch

Sound Paint: rings that react to the sound, from the mic or the tunnel music

Every background is animated, and there’s a Live input button that lets the visuals react to a microphone. I’d like to hear which toy or tunnel you’d keep, and what breaks on your device.


r/creativecoding • • 6d ago

Infinite visuals

8 Upvotes

r/creativecoding • • 6d ago

Generative kinetic typography for any song: lyrics grow into a branching vine, synced word by word

10 Upvotes

I've been building a web music player that turns any song's lyrics into kinetic typography in real time. Nothing is pre-animated: every line is laid out and animated live from the lyric timing.

Live: https://lyricalstudio.vercel.app
Code: https://github.com/arijit-debug/LyricalStudio. The vine is in src/templates/GraphStream.tsx and the shader in src/components/stage/AmbientBackground.tsx.

The vine (Graph mode)

  • Each line is laid out as a small tree: words become nodes, and curved branches connect them in the order they're sung.

  • The next line grows out of the last word of the previous one, so a whole song becomes one continuous drawing. The camera follows the newest branch.

  • Ended lines don't vanish. They linger, dimmed and softly out of focus. The blur is faked by drawing each branch 8 times with wider and fainter strokes, which adds up to a smooth falloff without any blur filter.

  • Branches draw themselves in with a sliding clip window instead of animating the stroke, so it stays smooth even at 240 Hz.

The other styles

  • There are seven layouts (stacked, sliding, zooming, letter-by-letter, scattered, the vine and a flowing one). A small rule system picks one per line from how fast it's sung, the genre and whether it's a repeated chorus.

  • A random seed per playthrough picks 1–4 highlighted words per line in colors from the album art, so the same song never looks quite the same twice.

  • The whole stage drifts very slightly all the time, so nothing ever feels frozen, even during instrumentals.

The background
One fragment shader: two levels of domain-warped fBm noise, tinted with a palette pulled from the album cover, with the cover itself blended in as soft color. Every word drops a ripple at its position when it's sung, so the background breathes with the vocals.

Constraints that shaped it

  • The text stays live, crisp DOM text (so Hindi and Japanese render properly), never canvas bitmaps that go soft when scaled.

  • Motion is springs baked into CSS easing curves, with no per-frame JavaScript.

  • A YouTube video tile must always stay visible in the corner (YouTube's rules), so every layout keeps clear of it.

It's free and open source (MIT). It works best in a desktop browser.

I'd love ideas for new layouts. Each style is one file, and I'm especially curious what generative structures would work for lyrics beyond trees.


r/creativecoding • • 6d ago

Flora

Post image
2 Upvotes

r/creativecoding • • 7d ago

GLSL Shaders capture

Thumbnail
gallery
21 Upvotes

r/creativecoding • • 7d ago

A wax lamp you can shake: every frame is a 3D Cahn–Hilliard solve in WebGPU compute, running in the browser

119 Upvotes

A learning journey with AI... Custom WebGPU compute shaders, no third-party engine: a 3D grid carries the wax fraction ψ under Cahn–Hilliard (∂ψ/∂t = ∇²μ, μ = ψ³ − ψ − ε²∇²ψ), an incompressible flow with a multigrid pressure solve, and heat carried with the wax; a ray-marcher draws the glass. Challenge vanquished: plain Cahn–Hilliard merges everything into one lump, so a thin film rule between separate blobs keeps 6–17 of them. Challenge remaining: better wax mist!

Run it yourself https://mindbendingpixels.com/spinodal/app/ (watch the battery on phones!)

How it works, with each figure measured from the solver: https://mindbendingpixels.com/spinodal/inside/


r/creativecoding • • 7d ago

A music video with an audience of numbers. Every seat is computed live from the song.

35 Upvotes

A song about what a feeling looks like. Drawn by code.

Nothing is keyed by hand. Every motion reads the audio. A flower of life grows one circle on each downbeat. Each chord draws its own ratio as a Lissajous figure, the shape two notes make on an oscilloscope. 3 to 2. 6 to 5. 11 to 8.

The floor under the stage looked like a stage. So it got an audience. Every seat is a number, a live one. How fast the music is getting louder, the pitch and beat. Each seat hears the stage a little late, by its distance. Every word breaks on the back row and rolls toward you. At the highest note every seat shows the same number. One crowd, one note.

Python and PIL for the picture. numpy for the music, no samples. The voice is AI, re-sung through a vocoder. The rest is code.