I'm starting a new "build thread" (not building anything except pixels, but they're good pixels).
This is the "Bubble Universe" graphics hack. I'm going to try to have some fun with it. Follow or ignore hashtag #BubbleUniverse for more.
🧵 1/N
I'm starting a new "build thread" (not building anything except pixels, but they're good pixels).
This is the "Bubble Universe" graphics hack. I'm going to try to have some fun with it. Follow or ignore hashtag #BubbleUniverse for more.
🧵 1/N
History. As best I can tell, the bubble universe was invented by Twitter user @yuruyurau in 2020 as a very terse Processing.py sketch and first published in this tweet.
https://xcancel.com/yuruyurau/status/1226846058728177665
Edit: add screen capture of tweet.
🧵 2/N
Paul Dunn ( @zxdunny ) followed a few months later with an even terser BASIC version and a demo on YouTube.
https://www.youtube.com/watch?v=G5aOBh7qQe8
🧵 3/N

@larsbrinkhoff got into the act with Javascript and PDP-10 assembler versions. The sources are on Github, and a video of the PDP-10 is on YouTube.
(Lars, what display are you emulating on the '10?)
https://github.com/larsbrinkhoff/bubble-universe
https://www.youtube.com/watch?v=hIU7iYWZWSY
🧵 4/N
Several others have implemented it; it seems to be popular with the retrocomputing crowd. I found out about it when @PaulaMaddox ported it to her FPGA 6502 simulator a few days ago.
🧵 5/N
And now I've implemented it. But instead of porting it to the slowest most decrepit retromachine I can find, I'm going the other direction: What kind of visual effects can I achieve if I throw a decent GPU at it?
The video above in 🧵 1 is a screen capture from my Javascript + WebGPU implementation. It's running at 20 FPS, using about 5% of the CPU and 3% of the GPU. More to come...
🧵 6/N
I wrote another one! I ported my Javascript + WebGPU implementation to Python + wgpu-py, and now I have a desktop app.
And I pushed it to Github. "Share and enjoy!"
https://github.com/kbob/bubble-universe
🧵 7/N
I finally got my head around WebGPU/wgpu enough to make my own render graph. Now the bubble universe thing is decomposed into a graph of render passes, and I've got some simple parameter animation going.
In this screencap, I'm varying the particle size and transparency and varying the number of particles in two ways in sync with the universe's revolution. The color map is just doing its own thing; that wasn't planned.
🧵 8/N
The problem with programming eye candy tools is that it's easy to get distracted into making pretty pictures and stop working on the tool.
Anyway, here's an interesting spot I found in the universe of bubble universes. If you look at Yuruyurau's original code, there's a parameter, R = Ï„/200. In this image, I vary R between 0.49 and 0.51.
🧵 9/N
The Bubble Universe tool now can directly record to video, and it's got HDR with tone mapping.
I promised visual effects... Here's one where I made the particles fuzzier at the edges. (I also removed 80% of the particles and enabled HDR/tone mapping.)
🧵 10/N
I don't think I pushed that effect far enough. MPEG compression adds a lot of grit, so here's a still for comparison.
Meanwhile, I've been working on light bloom. That's the next scheduled effect. This dandelion thing wasn't scheduled, though, and neither were 🧵 9 or 🧵 8.
🧵 11/N
I've been working on a light bloom filter for the bubble universe. There's this weird checkerboard pattern in the glow - most visible in the southeast corner where the arrow is.
I finally figured it out. That is, I'm pretty sure, caused by floating point overflow. I'm using f16 because wgpu on my GPU doesn't support blending into an f32 buffer.
Anyway. Light bloom. I'll probably turn it down once it's debugged.
🧵 12/N
Light bloom is done with multipass blurring. First the image is downsampled 5 times and blurred into a new image half as big using a 6x6 filter. Then each downsampled image is blurred again and added back to its parent
using a 3x3 filter. Finally, the half-size image is blurred and mixed with the original image.
It's cheap! About 80 texture read operations per pixel total.
(See alt. text for video explanation. Or see https://learnopengl.com/Guest-Articles/2022/Phys.-Based-Bloom .)
🧵 14/N