Skip to content
Andrew Voirol
WorkLogAboutContact
HomeWorkLog

AboutContact

✦ Just one prompt away from figuring it all out.

Wednesday, July 29, 2026cloud-9-countdown-build

AI Studio dropped me on Cloud 9 — and then I had to rebuild the sky

ReactAI Studio

Exported an I/O countdown from AI Studio and the first thing that hit me was the scroll. Not the code quality (standard AI Studio scaffold — importmap block, CDN Tailwind, wrong API key wiring). The scroll. You start at 9 and descend through parallax cloud layers toward a reveal. The bones were there, but the flesh was clip art. Generic cloud PNGs. No volumetric feel. No light diffusion. No sense that you're actually in the sky.

The vision was specific: you're on Cloud 9 — as in, on cloud 9 with excitement for I/O — and as you scroll, the numeral 9 dissipates into the cloud layers while the camera tracks down through them. AI-generated cloud textures with luminance-based alpha so white areas become transparent. Three layers — back, mid, front — each drifting at different speeds via UV displacement in a custom GLSL shader. The agent generated the cloud PNGs directly through the image model after the regular image generation endpoint kept throwing 400 errors on oversized base64 payloads. Four AI cloud assets, a Shoreline Amphitheatre background, and a procedural starfield later, the sky existed. React Three Fiber, drei's useTexture, custom shaderMaterial for each cloud plane, smoothstep edge feathering to kill the hard borders. 492 lines in page.tsx for the first commit. Getting the raw materials was the easy part — making them feel like atmosphere was going to be the war.

← Previous

React fiber tree surgery for one screenshot

Next →

The agent kept crashing and the image model kept refusing — so I made the clouds myself


Andrew Voirol

Builder, hacker, shipper. Currently leaving localhost.

Navigate

WorkBuilder’s LogAboutContactRSS Feed

Connect

X / TwitterGitHubLinkedIn

© 2026 Andrew Voirol·Back to top ↑
✦Just one prompt away from figuring it all out.