[discordance]

I’ve been using Claude Design for my front ends. The output looks and feels good enough, but the designs often look very similar and generally adhere to contemporary web tropes.

Keen to hear if anyone has had unconventional creative adventures with it.

[JasonSage]

I've had that experience and I've started testing different prompts and inputs.

I find it funny about meeting requirements when you give them, and making safe choices when you don't give direction. So if you're going to rate the output aesthetics and UX/content, but you don't prompt especially much around the aesthetics, you're only getting the safe assumed defaults. It's good at making bootstrap/tailwind clone designs unless you work that angle. For simple web pages, I've started making this the only focus for initial iteration.

[firemelt]

any tips for design/aesthetics prompts?

[JasonSage]

I keep a bookmarks folder of websites that have non-cookie-cutter design.

If I have an aesthetic in mind I'll use some screenshots of those sites in the prompt and phrase their inclusion as: "Look at these slightly non-standard designs that work really well for me." So far I've only seen Claude look for through-lines and high-level takeaways--"user likes <design feature> based on the screenshots, so I'll include that"--and screenshots aren't currently a granularity level where it can lift specific details or produce something derivative.

Other than that I try to encourage specific consideration of: type scale, borders and rounding, padding/whitespace, elevation as shadow vs blur, colors. I don't think one needs to pull every customization lever on every project.

[qingcharles]

This. Keep a list of sites you like and just jam screenshots of the best bits into Claude Design when you are asking it for help.

I've been designing sites for 32 years, and I've tried almost all the tools. I was very impressed with Stitch, but I've now migrated all my designs to Claude. My aesthetic is born in the simplicity and cleanliness of mid-90s, coupled with modern CSS. I want the purest, simplest HTML, with the simplest CSS and the absolute minimum of JS. Claude generates some of the best looking, most user-friendly designs I've seen. I don't need crazy scroll effects and tons of animations; I just need sites that are easy to read, easy to navigate and let the user get the task done in the quickest way.

[techpression]

I’ve done a few different things, some different presentations, web mockups etc. They all look more or less identical out of the box, and in every single case of a presentation, Claude Design has zero concept of layout boundaries, happily making slides that expand 200% or more out of the visible viewport (I have a lot of content and it just can’t figure out nice ways of presenting it).

There’s still value in it for me, I get decent enough output to convey my intent and I sometimes manually tweak the HTML.

Defining fonts is a good way to at least not get the same typography as everyone else.

[jaapz]

Most applications don't need unconventional creativity though.

[hparadiz]

Most applications are years long projects that already have styling and code structure done by humans so if the mock up is not perfectly aligned it doesn't even matter because when you finally approve the design and get to building it; that's where the pixel perfect tweaking comes in. And again if it's a mature code base with an existing stylesheet it tends to come out with all the expectations you'd have of it because it's re-using components that already exist 99% of the time.

[qingcharles]

Exactly. 99% of sites don't need bleeding edge design and fancy fonts.

[epolanski]

I use claude design too. It has been suggested to me by some very respected and experienced designers which now prototype almost exclusively in claude and then when happy refine in figma.

By the way, you can always tune your prompts to not be generic, if you ask for generic UIs without detailed styling prompts you will get generic designs.

[fragmede]

But then how do they get it back out from Figma and make it live?

[epolanski]

That was never a designer's concern?

By the way figma has a decent mcp that you can connect your LLMs to and extract the design tokens from.

[FireBeyond]

It would seem a circuitous process and I'd suggest another workflow, but Claude Design can ingest Figma files.

[Reebz]

[Take a look at my portfolio site](https://reebz.com), please view on desktop. This is about 3 weeks of effort to date. It is unfinished, but you get the idea.

Just like SaaS boilerplate from the decade prior, there is LLM boilerplate (since it’s trained on the internet).

So if you put in enough elbow-grease anything is (still) possible!

[rirze]

This is amazing.

[monkeydust]

Same, you can instruct it specifically to look non-standard and give it examples of website styles I want. After some wrangling it feels a bit more creative but takes prompting.

[itake]

Do you have any like dyes or work clothes describing this process?

I don’t know what prompted to get it away from the base model and any of like the non-standard web design like styles are a little bit too harsh for me if that makes sense. Like for example I like brutalist design, but it just feels heavy sometimes on the apps that I’m making.

I’ve tried to get the AI to describe a style based on the product name or you know it seem that I wanna have for example travel. But then it creates us like steal, amorphic design where everything looks like a boarding pass airplane ticket.

[slopinthebag]

Sort of, I've given it examples of unconventional UI's and then had it sort of create a mashup of them and it's been decent. But I feel like that's cheating.