My kids are vibe coding now.
I opened Claude on our family iPad. They sketched their ideas first: a baby dino who has to find his mum and dad, and a construction puzzle built from a blueprint.
Then they just talked to it. Two days later: two real games.
I changed my mind on my own navbar.
A while back I built a floating one with rounded corners. Still love it. But on this site it was popping way too much, so I took a step back and went the other way: flush to the top, sharp corners, no padding, edge to edge in every viewport.
Flat and technical. Built with Codex.
Turned a boring onboarding form into an agentic one: inline buttons, pinned context, a summary you can edit, and the output built at the end.
Codex kills the boring form.
Granular Live Workshop: Build Your Own Plugins With Your AI Agent teapawt.net/i/broadcasts/2vypjKEgL…
Codex upgrades my agent UI: clickable options instead of bullet lists, URL cards inside the chat, and tool calls tucked into an accordion—with clear progress updates while the agent works.
Small UI changes that make an AI chat easier to use.
I designed my media kit in Granular with Claude Code and Codex.
One page: my reach across 5 platforms, the brands I've worked with, the stages I've spoken on, and how to work with me.
Then I asked for polish: rows that reveal one by one as you scroll.
Codex redesigned my hero section in two requests:
1. A subtle halftone on every photo. Keeps the realism, adds texture.
2. A before/after slider: the architect's drawing on the left, the finished building on the right, revealed as you scroll.
I had a garden room built as my home office. It looked bare, so I redesigned it with @higgsfield_ai Genjutsu: concrete walls, art, an orange sofa, a TV wall, my desk and a pegboard.
Every object swapped by prompt, in the same video.
I build live with AI agents every Wednesday, free. Sign up: granular.build/workshop/?utm…
A floating nav bar that turns translucent as you scroll, so the content still reads through it. Then a dropdown to finish it off. 🪟
Hey, do you want to learn how to design like this? Check out granular.build, the agentic workspace loved by designers. It's free to use. You just bring your own AI subscriptions.
Quick designs: making a button pop 🎈
Login doesn't need an outline. Existing users will find it.
The main CTA has to earn the click: lift it with an inset shadow, add a rotating conic glow on hover, and swap the copy for a win: "Book my first client".
#uidesign #claudecode
I made this in Claude Code. Not After Effects.
One file. No libraries, no timeline, no render queue. The agent writes the camera math, not you.
Drop your own screens in, tell it your story, and it writes the camera tour.
That's a product promo. From a folder of screenshots.
I packaged this exact style as a skill. Laptop mockup, real window UI, camera flying over it:
granular.build/marketplace/r…
These little decorative moments are what separate a stale product from one that feels alive. And they've never been easier to build.
The trick: don't let your agent put design straight into your code.
Scratch file first. Sliders for whatever the effect needs. Tune it by eye. Paste the numbers back.
Density: 2.16. I didn't guess that. I felt it.
The full guide, the prompts, and real scratch files from building Granular:
granular.build/blog/scratch-…
Adding an agentic canvas right inside @GranularBuild.
> Mockup in HTML / CSS scratch files, then build the real thing all in one canvas.
> Leave comments for your agents to pick up across your app in one go.
> Drop any visual file from your code base right on the canvas to visualize your work.
designers, it's your time to shine and fight against the slop. Your thoughts are most valuable in the agentic era, and can really become truly polished apps.
Quick designs: baking a canvas toolbar, one prompt at a time.
Link in bio if you want to learn how to build like this, design like this.


