I asked GPT 5.

The prompt that did the heavy lifting

The first version I tried was vague ("make the matrix rain in threejs") and it returned a flat 2D canvas effect with no depth. The second pass worked because I forced the scene into a real 3D layout. I asked for: falling glyph columns placed on a grid, each with random speed and opacity, a perspective camera drifting along the Z-axis, and a full-screen shader for that blurry CRT look. The prompt looked like this:

Build a Three.js scene simulating the Matrix opening.
- Create 80 columns of vertical falling characters (katakana + digits).
- Each column is a separate plane with a canvas texture.
- Randomize speed, offset and char set per column.
- Camera starts far away and slowly moves forward (Z axis).
- Add a post-processing bloom or glow effect (UnrealBloomPass).
- Pure black background, green #00ff41 text.
- Keep it in one HTML file with CDN imports.

That one prompt produced working code on the first try. Not "kinda works" — it ran, it rained, it looked right. The camera move wasn't perfect (it accelerated like a broken elevator), but the structure was there. I had to tweak the camera easing manually.

Step-by-step workflow, if you want to reproduce it

1. Set the CDN imports for Three.js and OrbitControls + EffectComposer. Sol picked r128 from a CDN by default — pin a modern version or it'll complain.

2. Generate canvas textures for each column using fillText

inside a loop. That's what makes the glyphs look like actual code, not random squares.

3. Place columns in a GridHelper

-like pattern manually: (i % 10) * 4 - 20

for X, random Z spread. Depth comes from the grid, not from texture tricks.

4. Move the camera along Z using a normalized time accumulator, and apply a ease-out curve. I replaced Sol's linear movement with 1 - Math.pow(1 - t, 3)

.

5. Add UnrealBloomPass

for the glow. If you skip this, it looks like a terminal screensaver from the 90s.

The final HTML was about 300 lines, all self-contained. I opened it in a browser and it was honestly cinematic. The way the far columns blur into the dark while the near ones rush past — that only works because the camera is actually moving through 3D space, not scrolling a 2D canvas.

The real lesson about AI workflow

This is a great use case for prompt engineering because the requirements are visual and measurable. You can screenshot the output, show it to the LLM, and ask for changes. I took the rendered frame, pasted it back into the chat, and said "the text is too small, make the columns wider and the camera closer" — Sol adjusted the values in the exact spots. That feedback loop is the actual magic, not the first generation.

If you're looking for a beginner-friendly way to test an AI coding agent, this is it. It's a complete guide in one file: procedural textures, scene setup, animation loop, post-processing. No backend, no build tool, no deployment needed. Just open the HTML and it runs. And if you're into LLM agents, watch how well it responds to visual critique — that's where the real workflow gains are.

The code isn't perfect. It still drops frames on a big monitor and the glyphs occasionally flash white. But for a zero-shot prompt? I've paid for worse tutorials.

OpenAI Slashes GPT-5.6 Luna Price 80%: A Pricing Deep Dive 3d ago

GPT-5.6 Revenue Surge: How July Beat Q2 4d ago

Next Pretending AI didn't write my code made me a better dev →

All Replies （4） #

@Max75Yeah, adding a slight tilt makes a huge difference. Ever tried a top-down view?