A-TIER technique
Claude Code website build — CLAUDE.md, frontend-design skill, screenshot loop
100k ft — What is this?
Claude Code website build — CLAUDE.md, frontend-design skill, screenshot loop
50k ft — Why care?
A concrete recipe for non-sloppy AI sites: run Claude Code in VS Code, write a CLAUDE.md with design rules, install the frontend-design skill, drop in brand assets, and have it screenshot its own work to self-critique. Give it a reference site to rebuild in your brand style.
10k ft — Key takeaways
• A reference site plus your brand assets beats a blank prompt.
• Make the agent screenshot and review its own UI.
• Put design rules in CLAUDE.md so every page follows them.
5k ft — Tools & techniques
Claude Code, VS Code
CLAUDE.md project rules, agent skills, screenshot self-review, workflow automation
1k ft — Deep-dive / try it
Comment 'PRO' and I'll send it over
Transcript excerpt
We're six months away of a Genetic AI that you can ask any question and it will go when do the task. I just go to my AI and say, love Stephen's website, can you just build it better and make it in India as well, because I think it's a big market there. Here's how to use cloud code to do exactly that in under 60 seconds. First, use cloud code inside of VS code. Then give it a proper cloud.md file so it knows the design rules for the whole project. Then install the front end design skill. That's what makes the site look way more modern and polished, less like AI Slop. After that, drop in your brand assets, your logo, colors, fonts, brand guidelines. Until cloud to build a page. And this part really matters. Make it take screenshots of the site while it's building so it can review its own design and keep improving it over time. And if you want even better results, give it a reference site and tell it to rebuild this but in your brand style. And that's how you go from AI vibe coded to something that actually looks professional. So just comment pro and I'll send you a full video where I build it from scratch.
More from @nateherkai
- A-TIER Claude Opus 5.5 to Blender — 3D animation built entirely as code
- A-TIER Claudex skill — Claude and GPT-6 Astra cross-audit plan and build
- B-TIER Google game Playground — why a harness that can't see its output fails
- A-TIER Claude trading watcher — LiquidTrade + QuiverQuant for insider-trade alerts
- A-TIER Claude design stack — Emil Kowalski, Impeccable, taste skills plus Figma MCP