My favorite Claude design hack right now: Create a prototype.md skill. Instead of one-shotting UI, I have Claude generate 5 variations for every feature in a single HTML file, side-by-side. I pick the winner. Claude builds it.

this is the way

And tokens go 📈📈📈

It's just light frontend work mainly. Doesn't consume many tokens.

@iamtrebuh This is so dumb to always put things in terms of tokens. If it solves the problem faster, who cares if it’s a little token inefficient. Ya know what’s a waste, stuff that doesn’t work for your users.

@BrettFromDJ My comment wasn’t that serious 😅 I agree that saving tokens isn’t always the best way (it rarely is tbh). Whatever works best for u

A few weeks ago I started doing the same. And even since my quality really went up and it's just fun to work like this. I ask it to create an html artefact with ~5 different high fidelity prototypes. I also use the impeccable style skill; somehow this gives me better results. Even just the artefact it creates is so much over the top to use but so cool :D

I've just added and it already does this automatically + generates really nice layouts.

Wait people design things without this? This is the only way to create actually good designs

Superpowers plugin has it in its brainstorming skill. It doubles the usage that's why I have a rule to never offer it to me. I prefer to describe UI in few sentences and then just in case fine tune once the prototype is ready.

@0xDesigner was on this vibe 9mo ago

I did this since day 1, didn't know the majority don't do this

Feels especially relevant for ecommerce, where the hard part is rarely “can we make a prettier section?” It is “which version actually helps someone trust the product?”

Have been doing this for months, but mainly on full pages. Haven’t really thought to do it on individual components

Great idea! Usually I'll play around with GPT image 2 first before going into Claude design, wondering how well it would work to go from GPT image -> HTML or HTML -> GPT image. I'll have to try a new flow, maybe PRD -> 5 HTML -> GPT image -> Claude design

yeah it’s so good that way. i’ve been doing it for months

the "i pick the winner" step is doing all the heavy lifting here. does your prototype.md actually remember your taste, or are you re-explaining it from scratch every project?

This is also a nice way to avoid getting emotionally attached to the first decent answer. I’ve noticed agents are much more useful when they create options first, then help you kill the weaker ones.

That’s actually dope! Gonna try it out 🤙

Can you make this an artifact in claude and share it?

I created my own mini figma prototype variants, truly amazing

How do you ensure variety between the 5 designs?

this is the steve jobs way

oh this is smart. beats my old approach of iterating in figma first. how do you keep the 5 variations from drifting into same-y territory though?

The 5-variation move pops when you tell it what to vary against, not just "make 5". I name the one job of the screen and what stays fixed. Otherwise you get 5 flavors of one idea, not 5 real bets. Makes picking the winner faster too.

AI making the actual design process fun again instead of tedious brings me so much joy

This is a great strategy. It always sucks when you get way too far along in a UI that wasn’t the original intent. I’m implementing today. Any recs on the skill file?

Isn’t this what tweaks are for? Just add tweaks to compare different designs.

Been rinsing Claude Design for this, and then refining on the winner. The skill is probably a cleaner way

just ask it to make a playground of whatever you want with different variations to cycle through. say, "look at this component right now. Make a playground of the component in /*componentname*/playground and I will pick the best."

uzun süredir bunu yapıyorum. çok faydalı. Kafama yatmazsa da claude design için md talimatı oluşturtuyorum.

Yep been doing this too. Works well.

good morning and welcome to the party. its funny to see how excited you are since you tried claude code a few weeks ago for the first time haha

Nice.

Yep, love this technique

Care to share that skill? 😁

Which will take more tokens HTML or static design?

can you explain what your prototype.md skill looks like high level?

Yeah I always do this 🦾🦾