นัทนัท

the Head of Design at X just open-sourced his taste (a skill that makes your agent's UI look production-grade) I broke down how it works ↓ Benji wrote down the hundred small decisions he makes when he designs product UI by hand, so an agent can make them too the skill is built around one sentence: "it reads as a real product, simplified to what the viewer needs, framed with intent, and every motion has a cause" it names the 5 ways agent-made UI goes wrong: > too much, real words in every cell, packed tight > too little, a wireframe that doesn't read as a product > boxed, the whole app shrunk into a card like a screenshot > flat, everything has the same weight > bland, your brand's style never shows up then the agent works in 7 steps, and most of them happen before it writes any code: 1. medium: still or animation, where it sits, what size 2. look: light, dark, blueprint or glass, one accent 3. story: 3 to 5 beats 4. examples: start from the closest of dozens of gold examples 5. screen: a few real words, placeholder lines for the rest 6. choreograph: overlapping beats and a loop that ends where it began 7. rehearse: film it, read every frame, fix what it finds the agent films its own work, a script creates every frame on a sheet and monitors one-frame jumps and text that doesn't fit its box, which a screenshot can't show it reads your design tokens too, so the UI uses your real colours, fonts and corner radiuses he built it by giving the same short prompt to 2 new agents with no other context, one with the skill and one without, then comparing the results side by side when something looked off, he wrote down what was wrong, updated the skill and ran the whole test again, instead of fixing it by hand works in Grok Build, Claude Code, Codex and Gemini: npx skills add benjitaylor/skills --skill stageshow Benji says most results still take him a few rounds of feedback, and the first pass is already a big step up from what an agent makes on its own